:root {
  color-scheme: light;
  --color-primary: #0b2239;
  --color-primary-strong: #071727;
  --color-secondary: #0e6675;
  --color-accent: #c64b1b;
  --color-accent-hover: #a83d14;
  --color-on-accent: #ffffff;
  --color-on-primary: #ffffff;
  --color-on-success: #ffffff;
  --color-background: #f4f6f7;
  --color-surface: #ffffff;
  --color-surface-alt: #e8eef0;
  --color-text: #16242f;
  --color-text-muted: #56646f;
  --color-border: #cad5da;
  --color-control-border: #7b8c95;
  --color-success: #167a55;
  --color-warning: #9a6200;
  --color-error: #b42318;
  --color-focus: #0a7890;
  --shadow-sm: 0 1px 2px rgba(7, 28, 45, 0.05);
  --shadow-md: 0 18px 50px rgba(7, 28, 45, 0.16);
  --radius-sm: 2px;
  --radius-md: 3px;
  --radius-lg: 4px;
  --wrap: none;
  --content: 760px;
  --gutter: clamp(1.25rem, 4vw, 5rem);
  --section-space: clamp(4.5rem, 8vw, 8.5rem);
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --text-xs: 0.78rem;
  --text-sm: 0.9rem;
  --text-base: 1rem;
  --text-lg: clamp(1.08rem, 1.3vw, 1.22rem);
  --h4: clamp(1.1rem, 1.4vw, 1.3rem);
  --h3: clamp(1.3rem, 2vw, 1.7rem);
  --h2: clamp(2.15rem, 4vw, 4rem);
  --h1: clamp(3rem, 5.2vw, 6rem);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-primary: #e9f2f7;
  --color-primary-strong: #ffffff;
  --color-secondary: #62c1d0;
  --color-accent: #ff7130;
  --color-accent-hover: #ff8d59;
  --color-on-accent: #07141f;
  --color-on-primary: #07141f;
  --color-on-success: #07141f;
  --color-background: #07141f;
  --color-surface: #0d202d;
  --color-surface-alt: #132c3a;
  --color-text: #edf3f5;
  --color-text-muted: #aabbc4;
  --color-border: #294450;
  --color-control-border: #68818d;
  --color-success: #4ecb8a;
  --color-warning: #f0c052;
  --color-error: #ff7a70;
  --color-focus: #7dd3e0;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.18), 0 8px 24px rgba(0, 0, 0, 0.14);
  --shadow-md: 0 18px 48px rgba(0, 0, 0, 0.28);
}