/* Login styles — EXTERNAL by requirement: the strict CSP (script-src/style-src 'self', no
   unsafe-inline) applies to every served page, so nothing inline survives. Mirrors
   public/next/tokens.css — the login page is served pre-auth so it cannot load the gated
   stylesheet; the tokens are duplicated instead. Keep in step with tokens.css when the palette
   moves. One flat graphite family, one azure accent, flat fills only, no glass, no glow. */
:root{
  color-scheme:dark;
  --bg:#101215; --surface:#16181C; --raised:#1C1F24;
  --line:rgba(255,255,255,.08); --line-bright:rgba(255,255,255,.14);
  --text:#E9ECEF; --text-2:#9BA3AD; --text-3:#6C7681;
  --accent:#3E8BFF; --accent-soft:rgba(62,139,255,.14); --err:#E5484D;
  --radius:10px; --radius-lg:14px; --tap:44px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --ease:160ms ease;
}
@media (prefers-reduced-motion:reduce){:root{--ease:0ms linear}}
*{box-sizing:border-box}
body{
  margin:0;min-height:100vh;min-height:100dvh;display:grid;place-items:center;
  background:var(--bg);color:var(--text);font:15px/1.5 var(--font);
  padding:24px calc(16px + env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) calc(16px + env(safe-area-inset-left));
}
.card{
  width:min(92vw,360px);background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius-lg);padding:28px 26px 24px;
}
.brand{font-size:22px;font-weight:700;letter-spacing:.2px;margin:0}
.brand .dot{color:var(--accent)}
.sub{margin:4px 0 18px;color:var(--text-2);font-size:13px}
label{display:block;font-size:11.5px;color:var(--text-2);letter-spacing:.06em;text-transform:uppercase;margin:14px 0 6px}
input{
  width:100%;min-height:var(--tap);padding:10px 13px;background:var(--raised);
  border:1px solid var(--line);border-radius:var(--radius);color:var(--text);font:14px var(--font);
  transition:border-color var(--ease),box-shadow var(--ease);
}
input::placeholder{color:var(--text-3)}
input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.go{
  display:block;width:100%;min-height:var(--tap);margin-top:20px;border:0;cursor:pointer;
  border-radius:var(--radius);background:var(--accent);color:#fff;font:600 15px var(--font);
  letter-spacing:.2px;transition:background var(--ease);
}
.go:hover{background:color-mix(in srgb,var(--accent) 86%,#000)}
.go:disabled{opacity:.55;cursor:default}
.go.loading{opacity:.7}
.err{margin:12px 0 0;color:var(--err);font-size:13px;min-height:18px;text-align:center}
.ordiv{display:flex;align-items:center;gap:10px;color:var(--text-3);font-size:11px;letter-spacing:.18em;text-transform:uppercase;margin:16px 0 12px}
.ordiv::before,.ordiv::after{content:'';flex:1;height:1px;background:var(--line)}
.pk{
  display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:var(--tap);
  padding:10px 13px;background:var(--accent-soft);border:1px solid var(--line);border-radius:var(--radius);
  color:var(--text);font:14px var(--font);cursor:pointer;transition:border-color var(--ease),background var(--ease);
}
.pk:hover{border-color:var(--accent)}
.pk:disabled{opacity:.5;cursor:default}
.pk svg{width:16px;height:16px;flex:none}