:root {
  color-scheme: light dark;
  --color-primary: #0f4c81;
  --color-primary-contrast: #ffffff;
  --color-background: #f7fafc;
  --color-surface: #ffffff;
  --color-text: #1f2933;
  --color-muted: #52616b;
  --color-border: #d9e2ec;
  --color-warning: #9a6700;
  --color-danger: #b42318;
  --color-success: #157f3b;
  --spacing-xs: .25rem;
  --spacing-s: .5rem;
  --spacing-m: 1rem;
  --spacing-l: 1.5rem;
  --spacing-xl: 2rem;
  --radius-small: .25rem;
  --radius-medium: .5rem;
  --max-content-width: 1200px;
  --focus-ring: 3px solid #ffbf47;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--color-background);
  color: var(--color-text);
  line-height: 1.55;
}
a { color: var(--color-primary); }
a:hover { text-decoration-thickness: 0.15em; }
:focus-visible { outline: var(--focus-ring); outline-offset: 3px; }
img, svg { max-width: 100%; height: auto; }

/* Design tokens ab Version 2.0 */
:root {
  --color-info: #1769aa;
  --color-attention: #9a6700;
  --color-critical: #b42318;
  --shadow-card: 0 .15rem .6rem rgb(31 41 51 / .08);
  --radius-large: .9rem;
  --content-gap: clamp(1rem, 2vw, 1.75rem);
  --metric-size: clamp(1.8rem, 7vw, 3.6rem);
}