:root { --bg:#0b0908; --panel:#14100d; --line:#2b211a; --text:#f4ebe1; --muted:#948577; --accent:#ff7a18; --accent-2:#ffa04d; --err:#ff6464; }
* { box-sizing: border-box; }
body { margin:0; min-height:100vh; display:grid; place-items:center; padding:24px; background: radial-gradient(900px 520px at 12% -10%, rgba(255,98,0,.14), transparent 60%), var(--bg); color:var(--text); font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
.login-card { width:min(420px,100%); padding:26px; border:1px solid var(--line); border-radius:14px; background:var(--panel); box-shadow:0 18px 50px rgba(0,0,0,.4); }
.brand { display:flex; align-items:center; gap:10px; font-weight:700; letter-spacing:.16em; font-size:13px; }
.brand small { display:block; color:var(--muted); font-size:9px; letter-spacing:.12em; font-weight:500; }
.mark { width:14px; height:14px; border-radius:4px; background:linear-gradient(135deg,var(--accent),#ff5200); box-shadow:0 0 18px rgba(255,122,24,.5); }
h1 { font-size:20px; margin:22px 0 6px; }
.muted { color:var(--muted); font-size:12px; line-height:1.5; margin:0 0 18px; }
label { display:block; font-size:11px; font-weight:600; color:#d3c5b7; margin:12px 0 6px; }
input { width:100%; height:38px; padding:0 11px; border-radius:9px; border:1px solid var(--line); background:#0e0b09; color:var(--text); font:inherit; outline:none; }
input:focus { border-color:rgba(255,122,24,.34); box-shadow:0 0 0 3px rgba(255,122,24,.08); }
button { width:100%; height:38px; margin-top:18px; border:0; border-radius:9px; background:var(--accent); color:#1a0d04; font:inherit; font-weight:700; cursor:pointer; }
button:hover { background:var(--accent-2); }
button:disabled { opacity:.55; cursor:not-allowed; }
.message { min-height:18px; margin-top:12px; font-size:11.5px; color:var(--err); }
.message.ok { color:#43d39a; }