:root { color-scheme: dark; font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; --line:#2b2b2b; --text:#e7edf6; --muted:#8a8a8a; --accent:#8a8a8a; --up:#24b89a; }
* { box-sizing: border-box; }
html, body { width:100%; min-height:100%; margin:0; }
body { background:#131313; color:var(--text); }
body::before { content:""; position:fixed; inset:0; background:radial-gradient(circle at 50% 35%, rgba(120,120,120,.10), transparent 32%), linear-gradient(rgba(150,150,150,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(150,150,150,.03) 1px, transparent 1px); background-size:auto, 38px 38px, 38px 38px; pointer-events:none; }
.login-shell { position:relative; min-height:100dvh; display:grid; place-items:center; padding:24px; }
.login-card { width:min(390px, 100%); padding:30px; border:1px solid var(--line); border-radius:11px; background:rgba(20,20,20,.96); box-shadow:0 30px 90px rgba(0,0,0,.5); }
.brand-mark { height:28px; width:auto; display:block; }
.heading { margin-top:24px; }
.heading small { color:#8a8a8a; letter-spacing:.15em; font-size:9px; }
form { margin-top:27px; }
label { display:block; margin-bottom:8px; color:#c0c0c0; font-size:11px; font-weight:650; }
.password-field { display:grid; grid-template-columns:1fr 42px; height:43px; border:1px solid #303030; border-radius:6px; overflow:hidden; background:#181818; }
input { min-width:0; border:0; outline:0; padding:0 12px; background:transparent; color:#eef3fa; font:14px inherit; }
.password-field:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px rgba(138,138,138,.16); }
.password-field button { border:0; border-left:1px solid #2b2b2b; background:transparent; color:#8a8a8a; cursor:pointer; }
.password-field button:hover { color:#fff; background:#1c1c1c; }
.password-field svg, .submit-button svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.error-message { margin-top:10px; color:#ff817d; font-size:11px; }
.submit-button { width:100%; height:42px; margin-top:15px; display:flex; align-items:center; justify-content:center; gap:8px; border:1px solid #3a3a3a; border-radius:6px; background:#2a2a2a; color:#fff; font-weight:750; cursor:pointer; }
.submit-button:hover { background:#333333; }
.submit-button:disabled { opacity:.6; cursor:wait; }
footer { margin-top:23px; padding-top:15px; border-top:1px solid var(--line); display:flex; justify-content:space-between; color:#6f6f6f; font-size:9px; }
footer span { display:flex; align-items:center; gap:5px; }
footer i { width:5px; height:5px; border-radius:50%; background:var(--up); }