:root {
color-scheme: light dark;

  
  --nf-text-2xs: 11px;
  --nf-text-xs: 12px;
  --nf-text-sm: 13px;
  --nf-text-md: 14px;
  --nf-text-lg: 16px;
  --nf-text-xl: 18px;
  --nf-text-2xl: 20px;
  --nf-text-3xl: 24px;
  --nf-text-4xl: 28px;
  --nf-text-5xl: 32px;
  --nf-text-6xl: 40px;

  
  --nf-weight-regular: 400;
  --nf-weight-medium: 500;
  --nf-weight-semibold: 600;
  --nf-weight-bold: 700;
  --nf-weight-black: 800;

  
  --nf-leading-none: 1;
  --nf-leading-tight: 1.2;
  --nf-leading-snug: 1.35;
  --nf-leading-normal: 1.5;
  
  --nf-leading-relaxed: 1.65;

  
  --nf-control-min: 44px;
  --nf-control-pad-y: 8px;
  --nf-control-pad-x: 12px;

  
  --nf-display-1: clamp(3rem, 2.648rem + 1.5vw, 4rem); 
  --nf-display-2: clamp(2.5rem, 2.324rem + 0.75vw, 3rem); 
  --nf-display-3: clamp(1.75rem, 1.486rem + 1.13vw, 2.5rem); 
  --nf-display-4: clamp(1.5rem, 1.324rem + 0.75vw, 2rem); 
  --nf-display-5: clamp(1.25rem, 1.074rem + 0.75vw, 1.75rem); 
  --nf-display-6: clamp(1rem, 0.824rem + 0.75vw, 1.5rem); 

  
  --nf-focus-ring-width: 2px;
  --nf-focus-ring-offset: 2px;
  --nf-focus-ring-inset: -2px;

  
  
  --nf-bg: #e0e9f1;
  --nf-fg: #0f1a37;
  
  --nf-muted: #4a5878;
  
  --nf-accent: #b5202e;
  --nf-accent-fg: #ffffff;
  --nf-border: #b9c5d8;
  
  
  --nf-surface: #ffffff;
  --nf-hero-plane: var(--nf-hero-plate);
  
  --nf-plate-stock: #f1f3f9;
  --nf-band: #f5f9ff;
  --nf-ink-soft: #2c3a5c;
  --nf-font-display: "Anton", "Futura", "Avenir Next Condensed", "Helvetica Neue", "Arial Narrow", Arial, sans-serif;
  --nf-font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --nf-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --nf-space-1: 0.25rem;
  --nf-space-2: 0.5rem;
  --nf-space-3: 1rem;
  --nf-space-4: 1.5rem;
  --nf-space-5: 2.5rem;
  --nf-space-6: 4rem;
  --nf-measure: 72rem;
  
  --nf-band-inset: 1rem;
  
  --nf-card-stroke: 2.5px;
  --nf-focus: #0b6bcb;
  
  --nf-focus-halo: #ffffff;
  
  --nf-radius-ctl: 8px;
  --nf-radius-pill: 9px;
  --nf-radius-panel: 14px;
  --nf-radius-card: 16px;
  
  --nf-sheet-radius: 18px;
  
  --nf-motion: 0.12s;

  
  --nf-motion-slow: 0.18s;
  --nf-shadow-sm: 0 1px 2px rgba(22, 19, 28, 0.07), 0 1px 1px rgba(22, 19, 28, 0.05);
  --nf-shadow-md: 0 6px 16px rgba(22, 19, 28, 0.11), 0 2px 6px rgba(22, 19, 28, 0.07);
  --nf-shadow-lg: 0 16px 40px rgba(22, 19, 28, 0.16), 0 4px 12px rgba(22, 19, 28, 0.09);
  --nf-shadow-press: 0 1px 0 rgba(22, 19, 28, 0.05), 0 12px 28px -16px rgba(22, 19, 28, 0.38);
  --nf-shadow-panel: var(--nf-shadow-press);
  
  --nf-tint-red-soft: var(--nf-surface-2);
  --nf-tint-red: var(--nf-surface-2);
  --nf-tint-red-strong: var(--nf-surface-2);
  
  --nf-ink: #0f1a37;
  --nf-cream: #efe7d9;
  
  --nf-surface-2: #f5f9ff;
  
  --nf-bg-deep: #d5e0ec;
  --nf-gutter: #cbd8e6;
  
  --nf-cta-bg: #b5202e;
  
  --nf-control-border: #8595af;
  
  --nf-cta-edge: color-mix(in srgb, var(--nf-cta-bg) 70%, #000);
  
  --nf-cta-plate: #0f1a37;
  
  --nf-cta-fg: #ffffff;
  --nf-plate-c: #0f1a37;
  --nf-plate-c-text: #b5202e;
  
  --nf-plate-c-fg: #ffffff;
  
  --nf-auth-primary: var(--nf-plate-c);
  --nf-auth-primary-fg: var(--nf-plate-c-fg);
  --nf-auth-link: var(--nf-plate-c-text);
  --nf-plate-y: #e8b23a;
  --nf-halftone-dot: rgba(15, 26, 55, 0.16);
  --nf-halftone-c: rgba(15, 26, 55, 0.22);
  --nf-halftone-m: rgba(181, 32, 46, 0.22);
  --nf-plate-shadow-c: rgba(27, 127, 158, 0.35);
  --nf-plate-shadow-m: rgba(181, 32, 46, 0.28);
  
  --nf-shadow-plate:
    5px 5px 0 var(--nf-plate-shadow-c),
    10px 10px 0 var(--nf-plate-shadow-m);
  
  --nf-card: var(--nf-surface);
  --nf-chip: var(--nf-band);
  --nf-stroke: var(--nf-fg);
  --nf-chip-ink: var(--nf-fg);
  --nf-plate-ink: #efe7d9;
  --nf-plate-ink-soft: #c3cde0;
  
  --nf-display-ink: var(--nf-fg);
  --nf-hero-plate: #0f1a37;
  --nf-hero-band-bg: var(--nf-hero-plate);
  --nf-hero-ink: #efe7d9;
  --nf-hero-ink-soft: #c3cde0;
  --nf-hero-dot-1: rgba(255, 82, 82, 0.30);
  --nf-hero-dot-2: rgba(143, 176, 255, 0.30);
  --nf-red-text: #b5202e;
  --nf-plate-red-text: #ff5252;
  
  --nf-brand-mark-text: #b5202e;
  --nf-footer-bg: #0f1a37;
  --nf-footer-ink: #efe7d9;
  --nf-footer-muted: #c3cde0;
  --nf-footer-link: var(--nf-plate-red-text);
  --nf-step-bg: #edf1f7;
  --nf-frame-line: #0f1a37;
--nf-layer-raised: 1;
  --nf-layer-chrome: 30;
  --nf-layer-overlay: 40;
  --nf-layer-skip: 60;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
--nf-bg: #0a1120;
  --nf-fg: #eef2fa;
  --nf-muted: #a9b6d1;
  
  --nf-accent: #b5202e;
  
  --nf-accent-fg: #ffffff;
  --nf-border: #2b3d60;
  
  --nf-surface: #111b30;
  --nf-hero-plane: var(--nf-surface);
  
  --nf-plate-stock: #182642;
  --nf-band: #111b30;
  --nf-ink-soft: #a9b6d1;
  --nf-focus: #8fb0ff;
  
  --nf-focus-halo: #0a1120;
  --nf-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35), 0 1px 1px rgba(0, 0, 0, 0.25);
  --nf-shadow-md: 0 6px 16px rgba(0, 0, 0, 0.45), 0 2px 6px rgba(0, 0, 0, 0.35);
  --nf-shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.55), 0 4px 12px rgba(0, 0, 0, 0.4);
  --nf-shadow-press: 0 1px 0 rgba(0, 0, 0, 0.4), 0 14px 30px -16px rgba(0, 0, 0, 0.65);
  --nf-shadow-panel: var(--nf-shadow-press);
  --nf-tint-red-soft: var(--nf-surface-2);
  --nf-tint-red: var(--nf-surface-2);
  --nf-tint-red-strong: var(--nf-surface-2);
  --nf-ink: #eef2fa;
  --nf-cream: #0a1120;
  --nf-surface-2: #182642;
  --nf-bg-deep: #0a1120;
  --nf-gutter: #0a1120;
  
  --nf-cta-bg: #b5202e;
  
  --nf-control-border: #60779b;
  
  --nf-cta-edge: color-mix(in srgb, var(--nf-cta-bg) 70%, #fff);
  
  --nf-cta-plate: var(--nf-bg-deep);
  
  --nf-cta-fg: #ffffff;
  --nf-plate-c: #8fb0ff;
  --nf-plate-c-text: #ff5252;
  --nf-plate-c-fg: #0a1120;
  --nf-plate-y: #f0c45c;
  --nf-halftone-dot: rgba(238, 242, 250, 0.13);
  --nf-halftone-c: rgba(143, 176, 255, 0.26);
  --nf-halftone-m: rgba(255, 82, 82, 0.22);
  --nf-plate-shadow-c: rgba(79, 182, 214, 0.30);
  --nf-plate-shadow-m: rgba(228, 83, 95, 0.26);
  
  --nf-card: var(--nf-surface-2);
  --nf-chip: var(--nf-t-control-bg, var(--nf-surface-2));
  --nf-stroke: var(--nf-border);
  --nf-chip-ink: var(--nf-ink-soft);
  --nf-plate-ink: var(--nf-display-ink);
  --nf-plate-ink-soft: var(--nf-muted);
  
  --nf-display-ink: #efe7d9;
  --nf-hero-plate: var(--nf-surface);
  --nf-hero-band-bg: linear-gradient(180deg, var(--nf-hero-plane) 0%, var(--nf-bg) 100%);
  --nf-hero-ink: var(--nf-display-ink);
  --nf-hero-ink-soft: var(--nf-muted);
  --nf-hero-dot-1: var(--nf-halftone-m);
  --nf-hero-dot-2: var(--nf-halftone-c);
  --nf-red-text: #ff5252;
  --nf-plate-red-text: #ff5252;
  --nf-brand-mark-text: #ff5252;
  --nf-footer-bg: var(--nf-surface);
  --nf-footer-ink: var(--nf-fg);
  --nf-footer-muted: var(--nf-muted);
  --nf-footer-link: var(--nf-plate-red-text);
  --nf-step-bg: var(--nf-card);
  --nf-frame-line: var(--nf-border);
  }
}
:root[data-theme="dark"] {
--nf-bg: #0a1120;
  --nf-fg: #eef2fa;
  --nf-muted: #a9b6d1;
  
  --nf-accent: #b5202e;
  
  --nf-accent-fg: #ffffff;
  --nf-border: #2b3d60;
  
  --nf-surface: #111b30;
  --nf-hero-plane: var(--nf-surface);
  
  --nf-plate-stock: #182642;
  --nf-band: #111b30;
  --nf-ink-soft: #a9b6d1;
  --nf-focus: #8fb0ff;
  
  --nf-focus-halo: #0a1120;
  --nf-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35), 0 1px 1px rgba(0, 0, 0, 0.25);
  --nf-shadow-md: 0 6px 16px rgba(0, 0, 0, 0.45), 0 2px 6px rgba(0, 0, 0, 0.35);
  --nf-shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.55), 0 4px 12px rgba(0, 0, 0, 0.4);
  --nf-shadow-press: 0 1px 0 rgba(0, 0, 0, 0.4), 0 14px 30px -16px rgba(0, 0, 0, 0.65);
  --nf-shadow-panel: var(--nf-shadow-press);
  --nf-tint-red-soft: var(--nf-surface-2);
  --nf-tint-red: var(--nf-surface-2);
  --nf-tint-red-strong: var(--nf-surface-2);
  --nf-ink: #eef2fa;
  --nf-cream: #0a1120;
  --nf-surface-2: #182642;
  --nf-bg-deep: #0a1120;
  --nf-gutter: #0a1120;
  
  --nf-cta-bg: #b5202e;
  
  --nf-control-border: #60779b;
  
  --nf-cta-edge: color-mix(in srgb, var(--nf-cta-bg) 70%, #fff);
  
  --nf-cta-plate: var(--nf-bg-deep);
  
  --nf-cta-fg: #ffffff;
  --nf-plate-c: #8fb0ff;
  --nf-plate-c-text: #ff5252;
  --nf-plate-c-fg: #0a1120;
  --nf-plate-y: #f0c45c;
  --nf-halftone-dot: rgba(238, 242, 250, 0.13);
  --nf-halftone-c: rgba(143, 176, 255, 0.26);
  --nf-halftone-m: rgba(255, 82, 82, 0.22);
  --nf-plate-shadow-c: rgba(79, 182, 214, 0.30);
  --nf-plate-shadow-m: rgba(228, 83, 95, 0.26);
  
  --nf-card: var(--nf-surface-2);
  --nf-chip: var(--nf-t-control-bg, var(--nf-surface-2));
  --nf-stroke: var(--nf-border);
  --nf-chip-ink: var(--nf-ink-soft);
  --nf-plate-ink: var(--nf-display-ink);
  --nf-plate-ink-soft: var(--nf-muted);
  
  --nf-display-ink: #efe7d9;
  --nf-hero-plate: var(--nf-surface);
  --nf-hero-band-bg: linear-gradient(180deg, var(--nf-hero-plane) 0%, var(--nf-bg) 100%);
  --nf-hero-ink: var(--nf-display-ink);
  --nf-hero-ink-soft: var(--nf-muted);
  --nf-hero-dot-1: var(--nf-halftone-m);
  --nf-hero-dot-2: var(--nf-halftone-c);
  --nf-red-text: #ff5252;
  --nf-plate-red-text: #ff5252;
  --nf-brand-mark-text: #ff5252;
  --nf-footer-bg: var(--nf-surface);
  --nf-footer-ink: var(--nf-fg);
  --nf-footer-muted: var(--nf-muted);
  --nf-footer-link: var(--nf-plate-red-text);
  --nf-step-bg: var(--nf-card);
  --nf-frame-line: var(--nf-border);
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100dvh; color: var(--nf-fg); background: var(--nf-bg);
  font: var(--nf-text-lg)/1.5 var(--nf-font-body); padding: clamp(24px, 6vw, 64px) 20px; }
main { max-width: 480px; margin: 10vh auto 0; }
.brand { color: var(--nf-fg); font-weight: 700; text-decoration: none; display: inline-flex;
  align-items: center; min-height: 44px; }
h1 { font-size: clamp(24px, 5vw, 32px); line-height: 1.2; margin: 24px 0 16px; }
#status { min-height: 72px; margin: 0 0 24px; }
button, .primary { min-height: 44px; padding: 10px 24px; background: var(--nf-accent); color: var(--nf-accent-fg);
  border: 0; border-radius: var(--nf-radius-control, 10px); font: inherit; font-weight: 600; cursor: pointer; }
.primary { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
button:hover, .primary:hover { filter: brightness(.92); }
button:disabled { cursor: wait; }
.back { display: flex; align-items: center; width: fit-content; min-height: 44px; margin-top: 16px;
  color: var(--nf-fg); text-underline-offset: 3px; }
:focus-visible { outline: 2px solid var(--nf-focus); outline-offset: 4px; }
[hidden] { display: none !important; }
/* Quiet while sign-in completes on its own: only the live status stays in the
   accessibility tree. Controls appear on failure, expiry, a slow issuer or a
   browser that refused the automatic navigation. */
.quiet > :not(#status):not(noscript) { display: none; }
.quiet > #status { position: absolute; width: 1px; height: 1px; min-height: 0; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }