:root {
            --cyber-main: #00f0ff;
            --cyber-accent: #ff4170;
            --cyber-bg: #090c14;
            --cyber-bg2: #181c27;
            --cyber-field: #23234a;
        }
        html, body {
            height: 100%;
        }
        body {
            min-height: 100vh;
            font-family: 'Orbitron', 'Segoe UI', Arial, sans-serif;
            background: linear-gradient(135deg, var(--cyber-bg) 0%, var(--cyber-bg2) 100%);
            margin: 0;
            display: flex;
            flex-direction: column;
            color: #e0e0ff;
        }
        .cyber-main-wrapper {
            flex: 1 0 auto;
            min-height: 0;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .cyber-form-container {
            background: rgba(24,28,39,0.97);
            border-radius: 17px;
            border: 1.8px solid #00f0ff55;
            box-shadow: 0 8px 44px 0 #00f0ff22;
            max-width: 420px;
            width: 95vw;
            padding: 2.4rem 2rem 2.2rem 2rem;
            position: relative;
            animation: fadeInUp 1s cubic-bezier(.35,.97,.63,.99);
        }
        @keyframes fadeInUp {
            0% { opacity: 0; transform: translateY(60px);}
            100% { opacity: 1; transform: translateY(0);}
        }
        .cyber-form-title {
            font-family: 'Orbitron', Arial, sans-serif;
            text-align: center;
            color: var(--cyber-main);
            letter-spacing: 2px;
            font-size: 2rem;
            font-weight: 700;
            margin-bottom: 10px;
            text-shadow: 0 0 8px #00f0ff55;
        }
        .cyber-form-sub {
            color: #b9eaff;
            font-size: 1.06rem;
            text-align: center;
            margin-bottom: 22px;
            letter-spacing: 0.3px;
        }
        form {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 18px;
        }
        .cyber-input-wrap {
            position: relative;
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .cyber-field {
            background: var(--cyber-field);
            border: 1.5px solid #00f0ff44;
            border-radius: 7px;
            font-size: 1.09rem;
            color: #e0e0ff;
            padding: 14px 16px 14px 42px;
            outline: none;
            transition: border 0.21s, box-shadow 0.21s;
            box-shadow: 0 0 0 0 transparent;
            width: 100%;
            display: block;
            margin: 0 auto;
        }
        .cyber-field:focus {
            border-color: var(--cyber-main);
            box-shadow: 0 0 8px #00f0ff33;
            background: #23234aee;
        }
        .field-icon {
            position: absolute;
            top: 50%;
            left: 17px;
            transform: translateY(-50%);
            color: var(--cyber-main);
            font-size: 1.13em;
            pointer-events: none;
            opacity: 0.83;
        }
        .cyber-btn {
            background: linear-gradient(90deg, var(--cyber-main) 60%, var(--cyber-accent) 110%);
            color: #181c27;
            font-family: 'Orbitron', Arial, sans-serif;
            font-size: 1.15rem;
            font-weight: 700;
            border: none;
            border-radius: 9px;
            padding: 13px 0;
            margin-top: 8px;
            cursor: pointer;
            box-shadow: 0 2px 22px #00f0ff33;
            letter-spacing: 1px;
            width: 100%;
            transition: background 0.15s, color 0.15s, box-shadow 0.2s, transform 0.17s;
        }
        .cyber-btn:hover, .cyber-btn:focus {
            background: linear-gradient(90deg, var(--cyber-accent) 0%, var(--cyber-main) 80%);
            color: #fff;
            box-shadow: 0 4px 38px #ff417055, 0 0 16px #00f0ff44;
            transform: translateY(-2px) scale(1.025);
        }
        .cyber-footer {
            flex-shrink: 0;
            width: 100%;
            color: #6c889b;
            text-align: center;
            margin-top: 32px;
            margin-bottom: 18px;
            font-size: 0.98rem;
            letter-spacing: 0.4px;
        }
        .cyber-footer span {
            color: var(--cyber-main);
        }
        .cyber-error, .cyber-success {
            text-align: center;
            margin-bottom: 12px;
            border-radius: 6px;
            font-size: 1rem;
            padding: 10px 0;
            width: 100%;
        }
        .cyber-error {
            background: #ff417022;
            color: #ff4170;
            border: 1px solid #ff417099;
        }
        .cyber-success {
            background: #00f0ff22;
            color: #00c8d2;
            border: 1px solid #00f0ff77;
        }
        @media (max-width: 500px) {
            .cyber-form-container { padding: 1.3rem 0.7rem 1.2rem 0.7rem; }
            .cyber-form-title { font-size: 1.2rem; }
            .cyber-form-sub { font-size: 0.99rem; }
            .cyber-footer { font-size: 0.92rem; }
        }