:root {
  color-scheme: light;
  --color-primary: #0B6BFF;
  --color-primary-dark: #0647B7;
  --color-primary-light: #EAF3FF;
  --color-navy: #071B4A;
  --color-heading: var(--color-navy);
  --color-background: #F4F8FF;
  --color-surface: #FFFFFF;
  --color-border: #DCE7F5;
  --color-text: #10224D;
  --color-text-muted: #6B7A99;
  --color-success: #16B364;
  --color-success-soft: #E8F8EF;
  --color-warning: #F59E0B;
  --color-warning-soft: #FFF4DB;
  --color-danger: #EF4444;
  --color-danger-soft: #FDECEC;
  --color-purple: #7C3AED;
  --color-purple-soft: #F2EAFE;
  --color-orange: #F97316;
  --color-orange-soft: #FFF0E5;
  --color-cyan: #64D8FF;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --shadow-card: 0 8px 30px rgba(20, 62, 120, 0.08);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --gradient-brand: linear-gradient(125deg, var(--color-primary-dark), var(--color-primary));
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--color-background); color: var(--color-text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: var(--color-primary-dark); }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 { color: var(--color-heading); line-height: 1.2; }
h2 { font-size: 26px; }
h3 { font-size: 18px; }
:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 4px; }
.container { width: min(100%, 1160px); margin-inline: auto; padding-inline: max(var(--space-5), env(safe-area-inset-left)) max(var(--space-5), env(safe-area-inset-right)); }
.skip-link { position: fixed; top: -100px; left: 16px; z-index: 10; padding: 12px; background: var(--color-surface); }
.skip-link:focus { top: 12px; }
@media (min-width: 640px) { .container { padding-inline: var(--space-8); } }