/*
 * Palette and faces, shared by the landing page and `/privacy`.
 *
 * A separate file rather than a copy in each, for the reason the renderer is
 * shared too: two hand-maintained copies of a palette drift, and this one is
 * already the *third* copy of Night in the repo (tokens.css, theme.ts, here).
 * A fourth on the same site would be indefensible.
 */

@font-face {
  font-family: 'Space Grotesk';
  src: url('./fonts/space-grotesk-latin.woff2') format('woff2');
  font-weight: 400 700;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: 'Space Mono';
  src: url('./fonts/space-mono-700-latin.woff2') format('woff2');
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}

/*
 * Two themes, and **Night is still the default** — including for a visitor whose
 * OS asks for light.
 *
 * That is deliberate and it is the older decision surviving mostly intact: this
 * page is the game's shopfront, the game opens in Night, and a shopfront that
 * changes identity because of an OS setting has two identities. What changed is
 * only that the choice is now offered rather than withheld. Nobody arrives in
 * Daylight; they switch to it, and then it is remembered.
 *
 * Switching to `prefers-color-scheme` as the default is a two-line change if
 * that ever looks wrong — a media query here, and the fallback in the pre-paint
 * script in `index.html`.
 */
:root,
:root[data-theme='night'] {
  /* Night, verbatim — see app/src/styles/tokens.css. */
  --bg: #0f1116;
  --chrome: #171a22;
  --surface: #20242f;
  --track: #2e3440;
  --rule: #2b303b;
  --ink: #e8e6e0;
  --ink-soft: #9a96a6;
  --amber: #ffb23f;
  --teal: #2fd4c0;

  /*
   * Text and graphics share a value on Night, and part on Daylight. Splitting
   * them here rather than only where they differ keeps every rule in
   * `styles.css` written the same way in both themes — the alternative is a
   * stylesheet where you have to remember which of two amber tokens a given
   * line wanted, which is how one of them eventually gets used on cream.
   */
  --amber-text: #ffb23f;
  --teal-text: #2fd4c0;

  /*
   * The glows, as whole `box-shadow` values rather than as a colour plus a
   * multiplier.
   *
   * The tempting version of this is raw channels and one `--glow: 1|0` switch,
   * multiplied into the alpha with `calc()`. It is fewer tokens and it is worse:
   * `rgb(var(--c) / calc(0.45 * var(--glow)))` puts the on/off switch inside a
   * function inside a shorthand, where one undefined variable silently voids the
   * whole declaration and reads the same in devtools either way. Five explicit
   * values cannot fail partially.
   *
   * Daylight overrides all five, and see the note there before changing any of
   * them to `none` — the transition on `.station` makes that a visible bug.
   */
  --glow-station: 0 0 14px rgb(47 212 192 / 0.4);
  --glow-source: 0 0 14px rgb(255 178 63 / 0.45);
  --glow-junction: 0 0 14px rgb(232 230 224 / 0.28);
  --glow-cta: 0 0 28px rgb(255 178 63 / 0.4);
  --glow-pill: 0 0 20px rgb(255 178 63 / 0.25);

  --sans: 'Space Grotesk', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --mono: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* The line, and the room it needs. */
  --line-w: 9px;
  --gutter: 44px;
  --station: 20px;

  --measure: 34rem;
  --page: 62rem;

  --t: 240ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);
}

/*
 * Daylight, verbatim from the game's Daylight — including the split text
 * colours, which are the part that matters here.
 *
 * `--amber` and `--teal` are route colours and are for *graphics*: the line
 * down the page, the station rings. Neither is legible as text on cream —
 * they were never solved for that, because on the board they are never text.
 * `--amber-text` and `--teal-text` are the ones that were, at ≥5.5:1 rather
 * than at the 4.5 floor, so that a later nudge cannot silently break them.
 *
 * Getting this wrong is not a subtle bug: `#ffb23f` on `#f6f1e7` is about
 * 1.7:1, which is legible on a monitor in a dark room and gone in daylight.
 */
:root[data-theme='daylight'] {
  --bg: #f6f1e7;
  --chrome: #f2ece0;
  --surface: #ede6d8;
  --track: #ddd5c4;
  --rule: #ddd5c4;
  --ink: #23211c;
  --ink-soft: #675756;
  --amber: #e08a1e;
  --teal: #0f9b8e;

  --amber-text: #874c14;
  --teal-text: #0b6565;

  /*
   * Paper does not glow — the game's Daylight says so too.
   *
   * **Alpha zero, not `none`**, and that is not a style preference. `.station`
   * transitions `box-shadow`, and `box-shadow` does not interpolate against
   * `none`: Chrome leaves the old shadow in place on the way *to* it and lands
   * on a zeroed transparent placeholder on the way *back*. With `none` here,
   * switching to Daylight kept the amber glow burning on cream, and switching
   * back to Night lost it until something else re-triggered the transition.
   *
   * Same geometry and a transparent colour keeps every shadow interpolable in
   * both directions. It renders identically to `none`.
   */
  --glow-station: 0 0 14px rgb(47 212 192 / 0);
  --glow-source: 0 0 14px rgb(255 178 63 / 0);
  --glow-junction: 0 0 14px rgb(232 230 224 / 0);
  --glow-cta: 0 0 28px rgb(255 178 63 / 0);
  --glow-pill: 0 0 20px rgb(255 178 63 / 0);
}