/* Pond & Paper: the studio's design tokens, one file for the site and any game
   that wants them (docs/plans/site-redesign-2026-10-24.md, section 2).
   Copied to /theme.css by scripts/build-site.mjs and linked before site.css.
   Every name starts with --dl- so nothing collides with a game's own variables.
   Colour pairs are contrast-checked in the plan (section 2.2); a new colour needs
   a measured pair before it goes in. site/sitebar.css repeats the few values it
   needs (it must stand alone inside a game); src/theme.test.mjs keeps them equal. */

:root {
  color-scheme: light;

  /* Day pond */
  --dl-paper: #f6f1e7;
  --dl-sunk: #ede4d2;
  --dl-card: #fffdf8;
  --dl-line: #e2d9c8;
  --dl-edge: #dcd2bf;
  --dl-edge-shadow: #cdc2ad;
  --dl-ink: #1e1a15;
  --dl-soft: #5b5247;
  --dl-pond: #1f5f66;
  --dl-pond-deep: #17494f;
  --dl-pond-text: #1f5f66;
  --dl-pond-tint: #dcebe8;
  --dl-night: #1f5f66;
  --dl-bill: #f28b2b;
  --dl-bill-deep: #c96e1b;
  --dl-on-bill: #1e1a15;
  --dl-bill-text: #a34d0b;
  --dl-reed: #2f7a4f;
  --dl-on-reed: #ffffff;
  --dl-sun: #ffd45c;
  --dl-on-sun: #1e1a15;
  --dl-berry: #b4351f;
  --dl-feather: #f6f1e7;
  --dl-focus: #1f5f66;
  --dl-hero-eyebrow: #ffd9b0;
  --dl-lift: rgb(30 26 21 / 0.1);
  --dl-float: rgb(30 26 21 / 0.18);

  /* Type */
  --dl-display: Fraunces, 'Fraunces Fallback', Georgia, serif;
  --dl-text: Nunito, 'Nunito Fallback', 'Segoe UI', Roboto, system-ui, sans-serif;
  --dl-wordmark: 'Baloo 2', 'Trebuchet MS', sans-serif;
  --dl-fs-hero: clamp(2.1rem, 1.4rem + 3.4vw, 3.9rem);
  --dl-fs-h1: clamp(2rem, 1.6rem + 2vw, 2.75rem);
  --dl-fs-h2: clamp(1.5rem, 1.2rem + 1.2vw, 2rem);
  --dl-fs-h3: 1.2rem;
  --dl-fs-body: 1.0625rem;
  --dl-fs-small: 0.9375rem;
  --dl-fs-label: 0.75rem;

  /* Space (4 px base) */
  --dl-s1: 4px;
  --dl-s2: 8px;
  --dl-s3: 12px;
  --dl-s4: 16px;
  --dl-s5: 24px;
  --dl-s6: 32px;
  --dl-s7: 48px;
  --dl-s8: 64px;
  --dl-s9: 96px;
  --dl-gutter: 16px;
  --dl-section: 48px;
  --dl-wide: 1280px;
  --dl-read: 68ch;

  /* Corners */
  --dl-r-sm: 8px;
  --dl-r-md: 14px;
  --dl-r-lg: 20px;
  --dl-r-xl: 28px;

  /* Motion */
  --dl-fast: 120ms;
  --dl-med: 200ms;
  --dl-slow: 320ms;
  --dl-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --dl-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
}

@media (min-width: 600px) {
  :root {
    --dl-gutter: 24px;
  }
}

@media (min-width: 1024px) {
  :root {
    --dl-gutter: 32px;
    --dl-section: 72px;
    --dl-fs-body: 1.125rem;
  }
}

/* Night pond: designed, not inverted. Same selector pattern as the games, so a
   page (or a game) that sets data-theme="light" stays light. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    color-scheme: dark;
    --dl-paper: #171410;
    --dl-sunk: #100e0b;
    --dl-card: #262119;
    --dl-line: #322c23;
    --dl-edge: #3f382c;
    --dl-edge-shadow: #0d0b08;
    --dl-ink: #f3ede2;
    --dl-soft: #b3a996;
    --dl-pond-text: #7cc3c9;
    --dl-pond-tint: #1b3235;
    --dl-night: #12262a;
    --dl-bill-deep: #a85a14;
    --dl-bill-text: #f5a65c;
    --dl-reed: #4fae7a;
    --dl-on-reed: #0b1a11;
    --dl-sun: #e9be4a;
    --dl-berry: #f08c74;
    --dl-focus: #9fd6da;
    --dl-lift: rgb(0 0 0 / 0.35);
    --dl-float: rgb(0 0 0 / 0.5);
  }
}

:root[data-theme='dark'] {
  color-scheme: dark;
  --dl-paper: #171410;
  --dl-sunk: #100e0b;
  --dl-card: #262119;
  --dl-line: #322c23;
  --dl-edge: #3f382c;
  --dl-edge-shadow: #0d0b08;
  --dl-ink: #f3ede2;
  --dl-soft: #b3a996;
  --dl-pond-text: #7cc3c9;
  --dl-pond-tint: #1b3235;
  --dl-night: #12262a;
  --dl-bill-deep: #a85a14;
  --dl-bill-text: #f5a65c;
  --dl-reed: #4fae7a;
  --dl-on-reed: #0b1a11;
  --dl-sun: #e9be4a;
  --dl-berry: #f08c74;
  --dl-focus: #9fd6da;
  --dl-lift: rgb(0 0 0 / 0.35);
  --dl-float: rgb(0 0 0 / 0.5);
}

/* More contrast when asked for: soft text becomes ink, edges get heavier. */
@media (prefers-contrast: more) {
  :root {
    --dl-soft: var(--dl-ink);
    --dl-edge: var(--dl-ink);
    --dl-line: var(--dl-soft);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dl-fast: 0ms;
    --dl-med: 0ms;
    --dl-slow: 0ms;
  }
}
