@font-face {
  font-family: 'Source Serif 4';
  src: url('./fonts/source-serif-4/source-serif-4-latin-400.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'DM Sans';
  src: url('./fonts/dm-sans/dm-sans-latin-normal.woff2') format('woff2');
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
}
/* Shared foundations. Keep theme values and typography roles here. */
:root {
  color-scheme: light;
  --font-body: 'DM Sans', sans-serif;
  --font-serif: 'Source Serif 4', Georgia, serif;
  --font-size-body: 1rem;
  --font-size-secondary: .875rem;
  --line-body: 1.75;
  --color-page: #fdfdfd;
  --color-surface: #f7f7f5;
  --color-panel: #f5f0e8;
  --color-text: #343a3b;
  --color-heading: #173d42;
  --color-muted: #626969;
  --color-border: #dfe3e1;
  --color-link: #173d42;
  --color-link-hover: #24656b;
  --color-link-active: #102e32;
  --color-focus: #24656b;
  --color-control: #173d42;
  --color-control-hover: #24656b;
  --color-control-text: #fff;
  --color-control-subtle-hover: #e5efeb;
  --color-control-disabled: #687474;
  --color-positive-bg: #eaf3de;
  --color-positive-text: #27500a;
  --color-negative-bg: #fcebeb;
  --color-negative-text: #791f1f;
  --color-accent: #287d66;
  --color-overlay: rgba(0, 0, 0, .95);
  --color-intro: #141412;
  --color-intro-text: #edecea;
  --color-intro-muted: #c5c4bb;
  --color-intro-border: #41423d;
  --color-intro-accent: #7cd6b6;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --gutter: clamp(16px, 4vw, 48px);
  --width-shell: 1100px;
  --width-case: 1000px;
  --width-reading: 68ch;
  --width-media: 1180px;
  --width-media-expanded: 1500px;
  --width-gallery: 2200px;
  --header-height: 72px;
  --section-space: var(--space-12);
  --radius-control: 6px;
  --radius-round: 50%;
  --radius-card: 16px;
  --radius-media: 8px;
  --focus-ring: 2px solid var(--color-focus);
  --control-duration: .2s;
}
:root.dark-mode {
  color-scheme: dark;
  --color-page: #141414;
  --color-surface: #202222;
  --color-panel: #242929;
  --color-text: #d4d9d7;
  --color-heading: #eeeade;
  --color-muted: #b2bbb7;
  --color-border: #414a47;
  --color-link: #eeeade;
  --color-link-hover: #b2e0d7;
  --color-link-active: #e5f6ed;
  --color-focus: #b2e0d7;
  --color-control: #eeeade;
  --color-control-hover: #d1e8df;
  --color-control-text: #173d42;
  --color-control-subtle-hover: #2c403b;
  --color-control-disabled: #a6b0ab;
  --color-positive-bg: #243f30;
  --color-positive-text: #c6e9af;
  --color-negative-bg: #4a292b;
  --color-negative-text: #ffcece;
  --color-accent: #7cd6b6;
}
@media (max-width: 600px) {
  :root { --header-height: 64px; }
}