:root { color-scheme: dark; --bg:#080a0f; --panel:#11141c; --field:#0b0e15; --line:#2a303d; --text:#f2f4f8; --muted:#8b93a3; --accent:#7c9cff; --danger:#ff9292; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
body { margin:0; min-width:320px; min-height:100vh; color:var(--text); background:radial-gradient(circle at 50% 0,rgba(124,156,255,.16),transparent 36rem),linear-gradient(rgba(124,156,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(124,156,255,.035) 1px,transparent 1px),var(--bg); background-size:auto,42px 42px,42px 42px,auto; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
button,input { font:inherit; }
.auth-shell { min-height:100vh; display:grid; place-items:center; padding:22px; }
.auth-card { width:min(100%,430px); padding:30px; border:1px solid var(--line); border-radius:17px; background:rgba(17,20,28,.96); box-shadow:0 30px 100px rgba(0,0,0,.4); }
.auth-card.register-mode { width:min(100%,620px); }
header { display:flex; align-items:center; justify-content:space-between; padding-bottom:20px; border-bottom:1px solid var(--line); }
.logo { display:flex; align-items:center; gap:7px; font-size:21px; font-weight:800; letter-spacing:-.8px; }.logo img { width:27px; height:27px; border-radius:7px; }.logo span,.intro p { color:var(--accent); }
.secure { color:var(--muted); font-size:10px; }.secure i { display:inline-block; width:6px; height:6px; margin-right:5px; border-radius:50%; background:var(--accent); }
.intro { margin:26px 0 22px; }.intro p { margin:0 0 7px; font-size:9px; font-weight:800; letter-spacing:.15em; }.intro h1 { margin:0 0 8px; font-size:29px; letter-spacing:-.04em; }.intro span,.note { color:var(--muted); font-size:12px; }
.auth-tabs { display:grid; grid-template-columns:1fr 1fr; gap:3px; margin-bottom:20px; padding:4px; border:1px solid var(--line); border-radius:9px; background:var(--field); }
.auth-tabs button { padding:8px; border:0; border-radius:6px; background:transparent; color:var(--muted); cursor:pointer; }.auth-tabs button.active { background:#202638; color:var(--text); }
form { display:grid; gap:14px; }.register-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }label span { display:block; margin-bottom:7px; color:var(--muted); font-size:11px; }
input { width:100%; height:45px; padding:0 12px; border:1px solid var(--line); border-radius:8px; outline:0; background:var(--field); color:var(--text); }input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(124,156,255,.12); }
.submit { margin-top:3px; padding:12px; border:0; border-radius:8px; background:var(--accent); color:#080b12; font-weight:750; cursor:pointer; }.submit:hover { background:#93acff; }.submit:disabled { opacity:.55; cursor:wait; }
.message { margin:16px 0 0; padding:10px 11px; border:1px solid rgba(255,146,146,.25); border-radius:7px; background:rgba(255,146,146,.07); color:var(--danger); font-size:12px; }.message.success { border-color:rgba(124,156,255,.25); background:rgba(124,156,255,.08); color:#b9c8f7; }
.note { margin:20px 0 0; text-align:center; }
@media(max-width:600px){.register-grid{grid-template-columns:1fr}}
@media(max-width:480px){.auth-shell{padding:10px}.auth-card{padding:23px 18px}.secure{font-size:0}.secure i{margin:0}}