/* Design tokens (spec §16.2): vermilion accent, plain paper neutrals, three typefaces (self-hosted, OFL). */
@font-face { font-family: 'Zen Maru Gothic'; font-weight: 500; font-display: swap; src: url('/assets/fonts/zen-maru-gothic-500.woff2') format('woff2'); }
@font-face { font-family: 'Zen Maru Gothic'; font-weight: 700; font-display: swap; src: url('/assets/fonts/zen-maru-gothic-700.woff2') format('woff2'); }
@font-face { font-family: 'Zen Kaku Gothic New'; font-weight: 400; font-display: swap; src: url('/assets/fonts/zen-kaku-gothic-new-400.woff2') format('woff2'); }
@font-face { font-family: 'Zen Kaku Gothic New'; font-weight: 500; font-display: swap; src: url('/assets/fonts/zen-kaku-gothic-new-500.woff2') format('woff2'); }
@font-face { font-family: 'Zen Kaku Gothic New'; font-weight: 700; font-display: swap; src: url('/assets/fonts/zen-kaku-gothic-new-700.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-weight: 400; font-display: swap; src: url('/assets/fonts/ibm-plex-mono-400.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-weight: 500; font-display: swap; src: url('/assets/fonts/ibm-plex-mono-500.woff2') format('woff2'); }

:root {
  --paper: #f1f2f5;
  --sheet: #ffffff;
  --ink: #1d2030;
  --ink-2: #5b6075;
  --line: #dcdfe8;
  --ai: #b8392b;
  --ai-ink: #ffffff;
  --ai-wash: #fbe5e1;
  --amber: #8f5a0f;
  --amber-wash: #fbf0dc;
  --risk: #b3343b;
  --risk-wash: #fbe6e7;
  --ok: #2d7a5c;
  --ok-wash: #e2f2ea;
  --lattice: #e6e3ea;
  --shadow: rgba(20, 22, 40, 0.18);
  --eye: #3a2a26;
  --twig: #6e4a30;
  --f-display: 'Zen Maru Gothic', 'Hiragino Maru Gothic ProN', ui-rounded, system-ui, sans-serif;
  --f-body: 'Zen Kaku Gothic New', 'Hiragino Sans', 'Noto Sans JP', system-ui, -apple-system, sans-serif;
  --f-mono: 'IBM Plex Mono', ui-monospace, Menlo, Consolas, monospace;
  --radius: 14px;
  --gap: 14px;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --paper: #0e0f15; --sheet: #181a23; --ink: #eceef4; --ink-2: #a2a7b8; --line: #2b2e3c;
    --ai: #ff9a8a; --ai-ink: #2a0d09; --ai-wash: #3b1d18;
    --amber: #e6ae55; --amber-wash: #33270f; --risk: #f08a8f; --risk-wash: #3a1a1d;
    --ok: #7fcaa8; --ok-wash: #16302a; --lattice: #262833; --shadow: rgba(0, 0, 0, 0.5);
    --twig: #c9a07a;
    color-scheme: dark;
  }
}