:root {
  color-scheme: light;
  --navy-950: #f7f8fa;
  --navy-900: #ffffff;
  --navy-800: #e7ecf5;
  --navy-700: #cbd3df;
  --navy-600: #a8b5c8;
  --gold-500: #294ba3;
  --gold-400: #223f89;
  --gold-soft: rgba(41, 75, 163, 0.1);
  --ink-100: #283342;
  --ink-300: #283342;
  --ink-500: #526173;
  --ink-700: #526173;
  --line: rgba(40, 51, 66, 0.16);
  --line-strong: rgba(41, 75, 163, 0.48);
  --shadow: 0 16px 40px rgba(40, 51, 66, 0.14);
  --radius-sm: 0.5rem;
  --radius-md: 0.85rem;
  --radius-lg: 1.2rem;
  --ease: 180ms cubic-bezier(0.2, 0.7, 0.2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { min-width: 320px; background: var(--navy-950); }
body { min-width: 320px; min-height: 100dvh; margin: 0; overflow-x: hidden; background: var(--navy-950); color: var(--ink-100); font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: 1rem; line-height: 1.6; text-rendering: optimizeLegibility; text-wrap: pretty; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
a { color: inherit; }
:where(a, button, input, select, textarea, summary, [role="tab"]):focus-visible { outline: 3px solid var(--gold-400); outline-offset: 4px; }
h1, h2, h3 { text-wrap: balance; }
[hidden] { display: none !important; }