:root{--bg:#F4F3EF;--card:#fff;--line:#E2DFD6;--ink:#141413;--muted:#5C5A53;--accent:#C8F03C;--err-bg:#FBE3D6;--err:#8A2E07;color-scheme:light}
@media (prefers-color-scheme:dark){:root{--bg:#141413;--card:#1E1D1B;--line:#34332F;--ink:#F4F3EF;--muted:#B9B6AD;--err-bg:#3A2217;--err:#F7B79A;color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink);font-family:'DM Sans',system-ui,sans-serif;display:flex;align-items:center;justify-content:center;padding:24px 16px}
.wrap{width:100%;max-width:400px;display:flex;flex-direction:column;gap:20px}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:44px;height:44px;border-radius:12px;background:#141413;display:flex;align-items:center;justify-content:center}
.logo .crown{width:26px;height:auto;fill:var(--accent)}
.name{font:700 17px 'Space Grotesk',sans-serif;letter-spacing:.08em}
.sub{font:12px 'JetBrains Mono',monospace;color:var(--muted)}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:28px;display:flex;flex-direction:column;gap:10px}
h1{margin:0;font:700 26px 'Space Grotesk',sans-serif}
.lead{margin:0 0 8px;color:var(--muted);font-size:14px;line-height:1.5}
label{font-size:13px;font-weight:600;margin-top:6px}
input{height:46px;border-radius:10px;border:1px solid var(--line);background:transparent;color:var(--ink);padding:0 14px;font:inherit;font-size:15px}
input:focus{outline:2px solid var(--ink);outline-offset:1px}
button{margin-top:14px;height:48px;border:0;border-radius:12px;background:var(--ink);color:var(--bg);font:600 15px 'DM Sans',sans-serif;cursor:pointer}
button:hover{opacity:.9}
.msg{margin:0;padding:10px 12px;border-radius:10px;background:var(--err-bg);color:var(--err);font-size:13px}
.foot{margin:0;text-align:center;font:11px 'JetBrains Mono',monospace;color:var(--muted)}