/* Design tokens - direction "G · Salon" (E-L2, decided 12.09.2026).

   Warm paper tones, walnut brown, serif headings, spaced capitals, radius
   5px, no shadows; dark = espresso. The side rail is dark brown by default;
   <html data-rail="light"> switches it to the light variant.

   Every colour of the site lives here. site.css only uses var(--...), and
   tests/test_design_tokens.py holds both files to that: each token of the
   light set is redefined for dark, in the media query and under
   [data-theme="dark"]. */


/* The two faces ship with the server (fonts/, SIL Open Font License 1.1,
   see the LICENSE files there) - no page loads anything from outside.
   Variable fonts: one file covers every weight. The latin-ext file is only
   fetched when a page shows such a letter. */

@font-face {
  font-family: "Jost";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("fonts/jost-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
  font-family: "Jost";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("fonts/jost-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
  font-family: "Cormorant Garamond";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("fonts/cormorant-garamond-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
  font-family: "Cormorant Garamond";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("fonts/cormorant-garamond-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root {
  /* Surfaces and text */
  --ground: #f1ebe1;
  --surface: #faf7f1;
  --surface-2: #eae2d5;
  --ink: #2a2119;
  --muted: #6f5f4e;
  --line: #ded3c2;
  --line-strong: #c9baa3;

  /* Walnut: links, buttons, focus */
  --accent: #8a5a2b;
  --accent-strong: #6b4a32;
  --accent-ink: #faf7f1;
  --accent-soft: #eadcc8;

  /* The side rail */
  --rail: #2e2219;
  --rail-ink: #f4ebdd;
  --rail-muted: #c2ad92;
  --rail-active: #3f3024;
  --rail-line: #45352a;

  /* Messages and states */
  --error-ground: #f5e1d8;
  --error-ink: #8e2f1e;
  --note-ground: #e5e9d6;
  --note-ink: #3f5326;
  --warn-ground: #f3e5c4;
  --warn-ink: #75501a;

  color-scheme: light;

  /* Type */
  --font-body: "Jost", system-ui, "Segoe UI", Roboto, sans-serif;
  --font-display: "Cormorant Garamond", "Cormorant", Garamond, "EB Garamond", Georgia, serif;
  --font-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;

  --text-xs: 0.72rem;   /* spaced capitals: buttons, labels, tags */
  --text-sm: 0.875rem;  /* hints, tables, details */
  --text-md: 1rem;      /* running text */
  --text-lg: 1.4rem;    /* h2, display face */
  --text-xl: 2.1rem;    /* h1, display face */
  --text-brand: 1.3rem;

  --caps-track: 0.1em;
  --caps-track-wide: 0.13em;

  /* Space, shape */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;

  --radius: 5px;
  --radius-sm: 3px;
  --radius-pill: 999px;

  --rail-width: 232px;
  --logo-height: 44px;
  --measure-narrow: 32rem;
  --measure-wide: 68rem;

  /* Which uploaded logo shows where (CON-28): the one drawn for a light
     ground, or the one for a dark ground. */
  --stage-light: #faf7f1;
  --stage-dark: #1f1913;
  --rail-logo-on-light: none;
  --rail-logo-on-dark: block;
  --page-logo-on-light: block;
  --page-logo-on-dark: none;
}

/* The light rail variant */
:root[data-rail="light"] {
  --rail: #ede5d9;
  --rail-ink: #2a2119;
  --rail-muted: #6f5f4e;
  --rail-active: #faf7f1;
  --rail-line: #ded3c2;
  --rail-logo-on-light: block;
  --rail-logo-on-dark: none;
}

/* Espresso */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ground: #16110d;
    --surface: #1f1913;
    --surface-2: #28201a;
    --ink: #efe6d9;
    --muted: #a89376;
    --line: #31271e;
    --line-strong: #4a3b2e;
    --accent: #d3a36f;
    --accent-strong: #e4bf93;
    --accent-ink: #16110d;
    --accent-soft: #3a2c1f;
    --rail: #1a130d;
    --rail-ink: #efe6d9;
    --rail-muted: #a89376;
    --rail-active: #2a211a;
    --rail-line: #2a211a;
    --error-ground: #3a1e16;
    --error-ink: #f0b9a8;
    --note-ground: #232b18;
    --note-ink: #c9d8a8;
    --warn-ground: #33280f;
    --warn-ink: #e8c98a;
    --stage-light: #faf7f1;
    --stage-dark: #1f1913;
    --page-logo-on-light: none;
    --page-logo-on-dark: block;
    --rail-logo-on-light: none;
    --rail-logo-on-dark: block;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --ground: #16110d;
  --surface: #1f1913;
  --surface-2: #28201a;
  --ink: #efe6d9;
  --muted: #a89376;
  --line: #31271e;
  --line-strong: #4a3b2e;
  --accent: #d3a36f;
  --accent-strong: #e4bf93;
  --accent-ink: #16110d;
  --accent-soft: #3a2c1f;
  --rail: #1a130d;
  --rail-ink: #efe6d9;
  --rail-muted: #a89376;
  --rail-active: #2a211a;
  --rail-line: #2a211a;
  --error-ground: #3a1e16;
  --error-ink: #f0b9a8;
  --note-ground: #232b18;
  --note-ink: #c9d8a8;
  --warn-ground: #33280f;
  --warn-ink: #e8c98a;
  --stage-light: #faf7f1;
  --stage-dark: #1f1913;
  --page-logo-on-light: none;
  --page-logo-on-dark: block;
  --rail-logo-on-light: none;
  --rail-logo-on-dark: block;
  color-scheme: dark;
}