/* Shared design tokens for the start page and all module pages. */
:root {
  --bg: #f7f8fa; --fg: #17202c; --muted: #586374; --soft: #eceff4; --soft-2: #e1e5eb;
  --card: #ffffff; --line: #dde2e8;
  --accent: #0f766e; --accent-on: #ffffff; --accent-text: #0e6a63; --accent-soft: #d9ecea;
  --p1: var(--accent); --p2: #87bbb7; --p3: #e08a3c; --p4: #9c4a10;
  --ok-text: #23703a; --warn-text: #9a5200; --bad-text: #a8322a;
  --f-display: "Fraunces", Georgia, serif;
  --f-body: "IBM Plex Sans", "Segoe UI", Helvetica, Arial, sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, monospace;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #10151c; --fg: #e4e9f0; --muted: #9aa6b5; --soft: #1a212b; --soft-2: #232c38;
    --card: #151b23; --line: #27313d;
    --accent: #7bb4af; --accent-on: #021210; --accent-text: #93c1be; --accent-soft: #15302e;
    --p2: #08413d; --p3: #e08a3c; --p4: #b5652a;
    --ok-text: #7fd096; --warn-text: #ebb56c; --bad-text: #f08a80;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #10151c; --fg: #e4e9f0; --muted: #9aa6b5; --soft: #1a212b; --soft-2: #232c38;
  --card: #151b23; --line: #27313d;
  --accent: #7bb4af; --accent-on: #021210; --accent-text: #93c1be; --accent-soft: #15302e;
  --p2: #08413d; --p3: #e08a3c; --p4: #b5652a;
  --ok-text: #7fd096; --warn-text: #ebb56c; --bad-text: #f08a80;
  color-scheme: dark;
}