@font-face {
font-family: "Inter";
src: url("/fonts/inter-1.woff2") format("woff2");
font-weight: 100 900;
font-style: normal;
font-display: swap;
}
:root {
color-scheme: light;
--font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto,
"Noto Sans", "Helvetica Neue", Arial, sans-serif;
--font-display: var(--font-sans);
--font-body:    var(--font-sans);
--font-mono:    var(--font-sans);
--font-label:   var(--font-sans);
--fs-14: .875rem;
--fs-16: 1rem;
--fs-18: 1.125rem;
--fs-22: 1.375rem;
--fs-28: 1.75rem;
--fs-36: 2.25rem;
--fs-48: 3rem;
--lh-tight: 1.15;
--lh-snug:  1.3;
--lh-body:  1.6;
--fw-regular: 400;
--fw-medium:  500;
--fw-semi:    600;
--fw-bold:    700;
--fw-heavy:   800;
--text-display: var(--fs-48);
--text-h1: var(--fs-36);
--text-h2: var(--fs-22);
--text-h3: var(--fs-18);
--text-body: var(--fs-16);
--text-small: var(--fs-14);
--text-label: var(--fs-14);
--leading-tight: var(--lh-tight);
--leading-body: var(--lh-body);
--tracking-label: .02em;
--sp-1: .25rem;
--sp-2: .5rem;
--sp-3: .75rem;
--sp-4: 1rem;
--sp-5: 1.5rem;
--sp-6: 2rem;
--sp-7: 3rem;
--sp-8: 4rem;
--gutter: 1rem;
--gap: var(--sp-4);
--r-sm: .5rem;
--r-md: .75rem;
--r-lg: 1rem;
--r-xl: 1.5rem;
--r-pill: 999px;
--radius: var(--r-md);
--radius-pill: var(--r-pill);
--sh-1: 0 1px 3px rgba(16, 24, 40, .06), 0 1px 2px rgba(16, 24, 40, .04);
--sh-2: 0 4px 12px rgba(16, 24, 40, .08), 0 2px 4px rgba(16, 24, 40, .04);
--sh-3: 0 12px 32px rgba(16, 24, 40, .12), 0 4px 8px rgba(16, 24, 40, .06);
--shadow: var(--sh-1);
--scrim: rgba(16, 24, 40, .5);
--green-glow: 0 4px 14px rgba(4, 120, 87, .25);
--measure: 46rem;
--measure-wide: 80rem;
--header-h: 3.5rem;
--tap: 2.75rem;
--royal:      #0F1D5B;
--royal-deep: #09123D;
--royal-soft: #1E2D7D;
--royal-tint: #EEF2F6;
--green:         #10B981;
--green-strong:  #059669;
--green-text:    #047857;
--green-tint:    #ECFDF5;
--green-btn:        #047857;
--green-btn-strong: #065F46;
--on-royal:       #FFFFFF;
--on-royal-muted: #D1D9F0;
--orange:        var(--green);
--orange-strong: var(--green-strong);
--orange-text:   var(--green-text);
--orange-tint:   var(--green-tint);
--navy-deep:     var(--royal);
--navy:          var(--royal-soft);
--offwhite:      #EEF2F6;
--ground:        #F8FAFC;
--card:          #FFFFFF;
--sunken:        #F1F5F9;
--border:        #E2E8F0;
--border-strong: #CBD5E1;
--border-control: #64748B;
--ink:           #0F172A;
--muted:         #475569;
--link:          #1D4ED8;
--focus:         #2563EB;
--confirmed:     #059669;
--confirmed-bg:  #ECFDF5;
--problem:       #DC2626;
--problem-bg:    #FEF2F2;
--review:        #854D0E;
--review-bg:     #FEFCE8;
--emph:          var(--royal);
--step-ink:      #854D0E;
--step-bg:       #FEFCE8;
--step-line:     #FEF08A;
--feature-bg:    var(--royal);
--feature-ink:   #FFFFFF;
--feature-muted: #D1D9F0;
--feature-line:  rgba(255, 255, 255, .22);
--on-royal-line: rgba(255, 255, 255, .12);
--on-royal-tint: rgba(255, 255, 255, .16);
--chip-bg:       #EEF2F6;
--chip-ink:      var(--royal);
--acc-royal: #0F1D5B; --acc-royal-tint: #EEF2F6;
--acc-teal: #0F766E; --acc-teal-tint: #F0FDFA;
--acc-amber: #92400E; --acc-amber-tint: #FFFBEB;
--acc-violet: #6D28D9; --acc-violet-tint: #F5F3FF;
--acc-rose: #BE123C; --acc-rose-tint: #FFF1F2;
--acc-green: #047857; --acc-green-tint: #ECFDF5;
}
@media (prefers-color-scheme: dark) {
:root.themeable:not([data-theme="light"]) {
color-scheme: dark;
--ground: #0B1122; --card: #131C33; --sunken: #0E162B;
--border: #1E2B4B; --border-strong: #2E3E66; --border-control: #4B5A82;
--ink: #E8EDF7; --muted: #A9B3C7; --link: #B7C3FF; --focus: #B7C3FF;
--royal-tint: #1D2750;
--green-text: #34D399; --green-tint: rgba(16, 185, 129, .14);
--green-glow: 0 4px 16px rgba(16, 185, 129, .35);
--confirmed: #5FD0A4; --confirmed-bg: #0F2C23;
--problem: #FF9A90; --problem-bg: #3A1816;
--review: #E2C98A; --review-bg: #2B2517;
--emph: #B7C3FF;
--step-ink: #E2C98A; --step-bg: #231F13; --step-line: #4A3F22;
--feature-bg: #1C2C9E;
--chip-bg: #222D55; --chip-ink: #C9D2FF;
--sh-1: 0 1px 3px rgba(0, 0, 0, .4), 0 1px 2px rgba(0, 0, 0, .3);
--sh-2: 0 4px 14px rgba(0, 0, 0, .45), 0 2px 6px rgba(0, 0, 0, .3);
--sh-3: 0 14px 36px rgba(0, 0, 0, .6);
--acc-royal: #B7C3FF; --acc-royal-tint: #222D55;
--acc-teal: #62D2DC; --acc-teal-tint: #0E2B30;
--acc-amber: #F2C063; --acc-amber-tint: #2D230F;
--acc-violet: #C6AAFF; --acc-violet-tint: #261A40;
--acc-rose: #FF93B3; --acc-rose-tint: #39141F;
--acc-green: #72D583; --acc-green-tint: #12301B;
}
}
:root.themeable[data-theme="dark"] {
color-scheme: dark;
--ground: #0B1122; --card: #131C33; --sunken: #0E162B;
--border: #1E2B4B; --border-strong: #2E3E66; --border-control: #4B5A82;
--ink: #E8EDF7; --muted: #A9B3C7; --link: #B7C3FF; --focus: #B7C3FF;
--royal-tint: #1D2750;
--green-text: #34D399; --green-tint: rgba(16, 185, 129, .14);
--green-glow: 0 4px 16px rgba(16, 185, 129, .35);
--confirmed: #5FD0A4; --confirmed-bg: #0F2C23;
--problem: #FF9A90; --problem-bg: #3A1816;
--review: #E2C98A; --review-bg: #2B2517;
--emph: #B7C3FF;
--step-ink: #E2C98A; --step-bg: #231F13; --step-line: #4A3F22;
--feature-bg: #1C2C9E;
--chip-bg: #222D55; --chip-ink: #C9D2FF;
--sh-1: 0 1px 3px rgba(0, 0, 0, .4), 0 1px 2px rgba(0, 0, 0, .3);
--sh-2: 0 4px 14px rgba(0, 0, 0, .45), 0 2px 6px rgba(0, 0, 0, .3);
--sh-3: 0 14px 36px rgba(0, 0, 0, .6);
--acc-royal: #B7C3FF; --acc-royal-tint: #222D55;
--acc-teal: #62D2DC; --acc-teal-tint: #0E2B30;
--acc-amber: #F2C063; --acc-amber-tint: #2D230F;
--acc-violet: #C6AAFF; --acc-violet-tint: #261A40;
--acc-rose: #FF93B3; --acc-rose-tint: #39141F;
--acc-green: #72D583; --acc-green-tint: #12301B;
}