:root {
  --bg: #0b0d0f; --bg-inset: #0e1114; --ink: #e9e4d8; --ink-dim: #a9a294;
  --ink-faint: #6f6a5f; --rule: #262b30; --amber: #e0a43c; --amber-hot: #f4bc4e;
  --amber-dim: #8a6a2e; --cyan: #5ec4c4; --cyan-dim: #3a7d7d; --danger: #d9604a;
  --focus: #f4bc4e; --mono: "SF Mono", "Cascadia Mono", Menlo, Consolas, "Liberation Mono", monospace;
  --sans: "Avenir Next", "Segoe UI", system-ui, -apple-system, sans-serif;
}
* { box-sizing: border-box; }
html { color-scheme: dark; }
body { margin: 0; min-height: 100vh; background: var(--bg); color: var(--ink); font: 15px/1.5 var(--sans); }
.skip-link { position: absolute; left: 1rem; top: -4rem; z-index: 2; padding: .5rem .9rem; background: var(--amber); color: #141210; font-weight: 700; text-decoration: none; transition: top .15s ease; }
.skip-link:focus-visible { top: .5rem; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.auth-shell { min-height: 100vh; display: grid; place-items: center; padding: clamp(1.25rem, 5vw, 4rem); background: radial-gradient(circle at 12% 14%, rgba(94,196,196,.08), transparent 28rem), radial-gradient(circle at 88% 82%, rgba(224,164,60,.07), transparent 30rem), linear-gradient(135deg, #0e1214 0%, var(--bg) 56%, #0d1011 100%); }
.auth-frame { width: min(34rem, 100%); position: relative; border: 1px solid var(--rule); background: rgba(18,21,24,.86); box-shadow: 0 1.5rem 4rem rgba(0,0,0,.3); padding: clamp(1.5rem, 5vw, 3rem); }
.auth-frame::before { content: ""; position: absolute; inset: .55rem; border: 1px solid rgba(94,196,196,.14); pointer-events: none; }
.auth-mark, .auth-copy, .auth-panel, .auth-footnote { position: relative; }
.auth-mark { margin-bottom: 1.5rem; } .auth-mark svg { display: block; }
.seal-ring { fill: none; stroke: var(--cyan-dim); stroke-width: 1.5; } .seal-ring-mid { stroke: var(--amber-dim); stroke-dasharray: 4 5; } .seal-ring-core { stroke: var(--amber); stroke-width: 2; }
.seal-ticks line { stroke: var(--cyan); stroke-width: 2; } .seal-glyph { fill: var(--amber); font: 700 24px var(--mono); }
.kicker { margin: 0 0 .15rem; color: var(--cyan); font: .72rem var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.auth-copy h1 { margin: 0; font-size: clamp(1.8rem, 5vw, 2.45rem); font-weight: 650; letter-spacing: .01em; }
.auth-lede { max-width: 27rem; margin: .75rem 0 0; color: var(--ink-dim); font-size: .95rem; }
.auth-panel { margin-top: 2rem; border-top: 1px solid var(--amber-dim); padding-top: 1.2rem; }
.auth-eyebrow { margin: 0 0 .45rem; color: var(--cyan); font: .68rem var(--mono); letter-spacing: .16em; text-transform: uppercase; }
.auth-status { min-height: 1.5rem; margin: 0 0 1rem; color: var(--ink-dim); font-size: .88rem; }
.auth-error { margin: 0 0 1rem; border-left: 3px solid var(--danger); background: rgba(217,96,74,.1); color: #f18a73; padding: .55rem .7rem; font-size: .82rem; }
.auth-action { width: 100%; min-height: 2.8rem; }
.btn { appearance: none; border: 1px solid var(--rule); background: var(--bg-inset); color: var(--ink); cursor: pointer; font: .78rem var(--mono); letter-spacing: .08em; text-transform: uppercase; padding: .5rem .9rem; }
.btn:hover { border-color: var(--amber); color: var(--amber-hot); } .btn-primary { border-color: var(--amber-dim); color: var(--amber-hot); background: rgba(224,164,60,.08); } .btn-primary:hover { background: rgba(224,164,60,.16); }
.btn:disabled { opacity: .5; cursor: wait; }
.enrollment { margin-top: 1.6rem; } .enrollment-rule { height: 1px; margin: 0 0 1.35rem; background: var(--rule); }
.enrollment h2 { margin: 0; font-size: 1.15rem; font-weight: 620; } .auth-help { margin: .55rem 0 1rem; color: var(--ink-dim); font-size: .84rem; }
.auth-label { display: block; margin-bottom: .4rem; color: var(--ink); font: .72rem var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.auth-token { width: 100%; margin-bottom: .8rem; border: 1px solid var(--rule); border-radius: 0; background: var(--bg-inset); color: var(--ink); font: .9rem var(--mono); letter-spacing: .08em; padding: .7rem .75rem; }
.auth-token:focus { border-color: var(--focus); } .auth-footnote { margin: 1.5rem 0 0; color: var(--ink-faint); font-size: .75rem; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; } }
