:root {
  color-scheme: dark;
  --t2w-navy: #001131;
  --t2w-lime: #92bf11;
  --t2w-lime-ink: #001131;
  --t2w-on-navy: #f7f9ff;
  --t2w-on-navy-muted: #c2d3eb;
  --t2w-navy-raised: #10294f;
  --t2w-navy-active: #18365f;
  --t2w-navy-border: #315888;
  --t2w-status-danger-soft: #fdebed;
  --t2w-status-danger-strong: #9d2228;
  --t2w-radius-control: 8px;
  --t2w-radius-card: 12px;
  --t2w-font-ui: "Barlow", Arial, sans-serif;
  --t2w-font-heading: "Barlow Condensed", "Barlow", Arial, sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--t2w-on-navy); background: var(--t2w-navy); font: 400 14px/1.45 var(--t2w-font-ui); }
button, input { font: inherit; }
:focus-visible { outline: 3px solid var(--t2w-lime); outline-offset: 2px; }
.auth-shell { display: grid; min-height: 100dvh; place-items: center; padding: 24px; background: radial-gradient(circle at 80% 10%, var(--t2w-navy-active), var(--t2w-navy) 48%); }
.auth-card { width: min(430px, 100%); padding: 34px; border: 1px solid var(--t2w-navy-border); border-radius: var(--t2w-radius-card); background: var(--t2w-navy-raised); box-shadow: 0 16px 48px rgb(0 0 0 / .28); }
.auth-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 34px; }
.auth-brand-mark { display: grid; width: 58px; height: 58px; flex: 0 0 58px; place-items: center; }
.auth-brand-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
.auth-brand strong, .auth-brand small { display: block; }
.auth-brand strong { font-size: 18px; line-height: 1.1; }
.auth-brand small { margin-top: 3px; color: var(--t2w-on-navy-muted); }
.auth-eyebrow { margin: 0 0 7px; color: var(--t2w-lime); font-size: 11px; font-weight: 700; letter-spacing: .12em; }
h1 { margin: 0; font: 700 42px/1 var(--t2w-font-heading); }
.auth-intro { margin: 12px 0 25px; color: var(--t2w-on-navy-muted); }
label { display: block; margin-top: 16px; font-weight: 600; }
input { width: 100%; min-height: 46px; margin-top: 7px; padding: 10px 12px; border: 1px solid #6684aa; border-radius: var(--t2w-radius-control); color: var(--t2w-on-navy); background: var(--t2w-navy); }
input:focus { border-color: var(--t2w-lime); outline: 3px solid rgb(146 191 17 / .28); outline-offset: 1px; }
input[aria-invalid="true"] { border-color: #efadb0; }
button { width: 100%; min-height: 46px; margin-top: 24px; border: 0; border-radius: var(--t2w-radius-control); color: var(--t2w-lime-ink); background: var(--t2w-lime); font-weight: 700; cursor: pointer; }
button:hover { filter: brightness(.96); }
button:disabled { cursor: wait; opacity: .72; }
.auth-error { margin: 14px 0 0; padding: 10px 12px; border: 1px solid #efadb0; border-radius: var(--t2w-radius-control); color: var(--t2w-status-danger-strong); background: var(--t2w-status-danger-soft); overflow-wrap: anywhere; }
.auth-error[hidden] { display: none; }
@media (max-width: 480px) { .auth-shell { padding: 16px; } .auth-card { padding: 24px 20px; } h1 { font-size: 36px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; } }
