:root {
    color-scheme: dark;
    --bg: #070b12;
    --surface: #0d1523;
    --surface-2: #111d2d;
    --line: rgba(196, 217, 237, .15);
    --text: #f7fbff;
    --muted: #9aabba;
    --cyan: #59efd4;
    --violet: #9d8cff;
    --red: #ff7588;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; scrollbar-width: thin; scrollbar-color: rgba(89, 239, 212, .34) rgba(9, 16, 27, .75); }
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-track { background: rgba(9, 16, 27, .75); }
*::-webkit-scrollbar-thumb { border: 2px solid rgba(9, 16, 27, .75); border-radius: 999px; background: rgba(89, 239, 212, .34); }
*::-webkit-scrollbar-thumb:hover { background: rgba(89, 239, 212, .55); }

body { margin: 0; min-height: 100vh; color: var(--text); background: var(--bg); }
button, input, select, textarea { font: inherit; }
a { color: inherit; }
.auth-body { position: relative; display: grid; overflow-x: hidden; min-height: 100dvh; place-items: center; padding: 34px 16px; }
.auth-ambient { position: fixed; width: 42vw; height: 42vw; border-radius: 50%; pointer-events: none; filter: blur(120px); opacity: .11; }
.auth-ambient-one { top: -20vw; left: -13vw; background: var(--cyan); }
.auth-ambient-two { right: -17vw; bottom: -23vw; background: var(--violet); }
.auth-shell { position: relative; z-index: 1; width: min(470px, 100%); }
.auth-brand { display: flex; width: max-content; margin: 0 auto 20px; align-items: center; gap: 11px; text-decoration: none; }
.auth-brand img { width: 42px; height: 42px; object-fit: contain; }
.auth-brand span { display: grid; gap: 2px; }
.auth-brand strong { letter-spacing: -.02em; }
.auth-brand small { color: var(--muted); font-size: 11px; }
.auth-card { overflow: hidden; padding: 28px; border: 1px solid var(--line); border-radius: 25px; background: radial-gradient(circle at 100% 0, rgba(157, 140, 255, .09), transparent 38%), var(--surface); box-shadow: 0 36px 100px rgba(0,0,0,.42); }
.auth-card-heading > span { color: var(--cyan); font-size: 11px; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.auth-card-heading h1 { margin: 8px 0 7px; font-size: clamp(27px, 7vw, 36px); line-height: 1.07; letter-spacing: -.045em; }
.auth-card-heading p { margin: 0 0 22px; color: var(--muted); font-size: 14px; line-height: 1.55; }
.auth-form { display: grid; gap: 15px; }
.auth-field { display: grid; gap: 7px; color: #cdd9e4; font-size: 12px; font-weight: 750; }
.auth-field input, .auth-field select { width: 100%; min-height: 47px; padding: 0 14px; border: 1px solid var(--line); border-radius: 12px; outline: 0; color: var(--text); background: rgba(3, 9, 17, .62); transition: border-color .18s, box-shadow .18s; }
.auth-field input:focus, .auth-field select:focus { border-color: rgba(89, 239, 212, .62); box-shadow: 0 0 0 3px rgba(89, 239, 212, .09); }
.auth-field input[readonly] { color: var(--muted); background: rgba(3, 9, 17, .35); }
.auth-captcha-row { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 11px; }
.auth-captcha-row strong { min-width: 70px; padding: 12px 11px; border: 1px solid rgba(89, 239, 212, .2); border-radius: 11px; color: var(--cyan); background: rgba(89, 239, 212, .06); text-align: center; font-size: 15px; }
.auth-button { display: inline-flex; width: 100%; min-height: 48px; border: 0; border-radius: 12px; align-items: center; justify-content: center; color: #061613; background: linear-gradient(135deg, var(--cyan), #8ff6e4); font-weight: 900; cursor: pointer; box-shadow: 0 14px 35px rgba(89, 239, 212, .14); transition: transform .18s, filter .18s; }
.auth-button:hover { transform: translateY(-1px); filter: brightness(1.05); }
.auth-button.is-secondary { border: 1px solid var(--line); color: var(--text); background: rgba(255,255,255,.045); box-shadow: none; }
.auth-button.is-google { gap: 10px; color: #172033; background: #fff; box-shadow: none; }
.auth-button.is-google svg { width: 19px; height: 19px; }
.auth-links { display: flex; margin-top: 18px; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 12.5px; }
.auth-links a, .auth-text-link { color: var(--cyan); text-decoration: none; }
.auth-links a:hover, .auth-text-link:hover { text-decoration: underline; }
.auth-divider { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; margin: 20px 0; color: #6e8091; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.auth-divider::before, .auth-divider::after { height: 1px; content: ""; background: var(--line); }
.auth-notice { margin: 0 0 18px; padding: 12px 13px; border: 1px solid rgba(255,117,136,.24); border-radius: 11px; color: #ffc0ca; background: rgba(255,117,136,.07); font-size: 13px; line-height: 1.5; }
.auth-notice.is-success { border-color: rgba(89,239,212,.24); color: #a6ffef; background: rgba(89,239,212,.07); }
.auth-notice.is-info { border-color: rgba(157,140,255,.25); color: #cec6ff; background: rgba(157,140,255,.07); }
.auth-help { margin: 13px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.auth-legal { margin: 16px auto 0; color: #65788a; text-align: center; font-size: 11px; line-height: 1.45; }
.auth-legal span { display:flex;margin-top:7px;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px; }
.auth-legal a { color:#8395a9;text-decoration:none;font-weight:700; }
.auth-legal a:hover { color:var(--cyan); }
.auth-legal i { color:#445268;font-style:normal; }
.auth-compact-form { display: grid; gap: 13px; }
.auth-password-hint { margin: -6px 0 0; color: #77899a; font-size: 11.5px; }

@media (max-width: 520px) {
    .auth-body { padding: 20px 12px; place-items: start center; }
    .auth-card { padding: 23px 18px; border-radius: 21px; }
    .auth-links { flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition-duration: .01ms !important; } }
