:root { color-scheme:light dark; --ink:#162d42; --ink-2:#244964; --muted:#687987; --mark-on-ink:#fff; }
* { box-sizing:border-box; }
body { margin:0; min-width:280px; color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.login-shell { min-height:100vh; display:grid; place-items:center; padding:24px; background:radial-gradient(circle at 50% 30%,#fff 0,#f1f4f5 55%,#e5ebed 100%); }
.login-card { width:min(100%,410px); padding:44px 40px 32px; text-align:center; background:#fff; border:1px solid #d8e0e3; border-radius:10px; box-shadow:0 24px 70px rgba(22,45,66,.12); }
.neutral-mark { width:54px; height:54px; margin:0 auto 25px; display:grid; place-items:center; border-radius:50%; background:var(--ink); }
.neutral-mark span { width:16px; height:20px; border:2px solid var(--mark-on-ink); border-radius:8px 8px 3px 3px; position:relative; }
.neutral-mark span::before { content:""; position:absolute; width:8px; height:7px; left:2px; top:-9px; border:2px solid var(--mark-on-ink); border-bottom:0; border-radius:8px 8px 0 0; }
.kicker { margin:0 0 9px; color:#6f808d; font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
h1 { margin:0; font:500 2rem Georgia,serif; }
.login-intro { margin:12px 0 28px; color:var(--muted); font-size:.88rem; }
.error { margin:-12px 0 16px; color:#a33e37; font-size:.75rem; }
.login-button { width:100%; height:49px; display:flex; align-items:center; justify-content:center; gap:12px; border-radius:5px; background:var(--ink); color:var(--mark-on-ink); font-size:.86rem; font-weight:750; text-decoration:none; cursor:pointer; transition:background .18s,transform .18s; }
.login-button:hover { background:var(--ink-2); transform:translateY(-1px); }
.login-button:focus-visible { outline:3px solid rgba(37,93,124,.3); outline-offset:2px; }
.login-button span { font-size:1.1rem; transition:transform .18s; }
.login-button:hover span { transform:translateX(3px); }
@media (prefers-color-scheme:dark) {
  :root { --ink:#e8eef2; --ink-2:#c9d8e2; --muted:#a3b2bd; --mark-on-ink:#10171d; }
  .login-shell { background:radial-gradient(circle at 50% 30%,#1b2530 0,#10171d 55%,#080d12 100%); }
  .login-card { background:#182129; border-color:#2c3942; box-shadow:0 24px 70px rgba(0,0,0,.5); }
  .kicker { color:#91a1ac; }
  .error { color:#e8a39c; }
  .login-button:focus-visible { outline-color:rgba(121,184,211,.4); }
}
