/* The dark theme (dark-mode plan, Phase 2). The SAME names as tokens.css,
 * with night values — nothing else. base.css never learns that this file
 * exists. It is linked after tokens.css by base.njk, only when site.darkMode is
 * on, with media="screen and (prefers-color-scheme: dark)": the visitor's
 * system setting switches it (no toggle, the operator 2026-10-13), and `screen` keeps
 * print light. scripts/check-roles.mjs FAILs the build if this file declares a
 * name tokens.css does not have — a typo here would otherwise do nothing,
 * silently.
 *
 * Every text/ground pair below is measured (WCAG 2.0 contrast, the number
 * after each value), and the whole site is measured again on rendered pixels by
 * scripts/check-contrast.mjs in three schemes: light, dark, and dark with
 * prefers-contrast: more. Start: the 2026-10-12 mockup's values (plan §2).
 *
 * THE FOLDS (plan §3.7, Phase 3): the operator picked "lit step" of three
 * rendered candidates (2026-10-14): at night the boxes' hard offset fold is
 * LIGHTER than the ground, a step catching light, and their 1 px line is light
 * enough to draw the edge (3.97 on the ground). The form card's own fold
 * follows --c-fold (tokens.css --c-form-card-fold); the header logo's folds
 * are the same colour (logo-mark-dark.svg, scripts/build-logo-vector.py
 * DARK_FOLD). --c-mark-dark, the hero ribbon's trace on the night sky, stays
 * the mark's own dark in every candidate.
 *
 * NOT REDEFINED, so the same in both themes, on purpose:
 *   the party colours (--c-red, --c-orange, --c-amber, --c-amber-deep,
 *   --c-red-ink) and their ramps — the mark's own colours; text on them is
 *   --c-on-party (white) or --c-on-party-bright (ink), both kept;
 *   --c-on-accent, --c-fill-on-accent, --c-on-party, --c-spark, --c-shine —
 *   white on or into a filled surface that stays dark;
 *   --c-brand-light, --c-brand-deep, --c-brand-deepest — the candidates'
 *   portrait ground and the banner strip, large graphics;
 *   --c-form-card and everything inside .enlist__card — the light island
 *   (tokens.css), given color-scheme: light at the end of this file. */

:root {
  color-scheme: dark;

  /* The ground and its neutrals: blue-black, the mockup's family (the operator,
   * 2026-10-13). On --c-bg: */
  --c-bg:           #0e1820;
  --c-surface:      #15232d;
  --c-surface-deep: #1b2c38;
  --c-ink:          #eef3f5;   /* 16.04 on bg · 12.82 on surface-deep */
  --c-body:         #c8d2d8;   /* 11.68 on bg · 10.43 on surface */
  --c-muted:        #94a3ac;   /*  6.92 on bg ·  6.18 on surface · 5.53 on surface-deep */
  --c-rule:         #2b3c48;   /* a hairline, not text (1.57 on bg) */

  /* The accent, lifted from the day navy (#183b62) only as far as a filled
   * button needs to read as a button on the night ground. */
  --c-accent:           #1f4c7c;   /* white on it 8.81 */
  --c-accent-hover:     #275d94;   /* white on it 6.82 */
  --c-accent-ink:       #5fc6d8;   /* links and lines: 9.02 on bg · 8.06 on surface */
  --c-accent-ink-hover: #8ad7e4;   /* 11.04 on bg */
  --c-accent-text:      #9cc3ef;   /* /go's dates on a card: 8.75 on card */

  /* The night sky (the operator: "night sky", 2026-10-13): the day sky's shape, sunk.
   * Text on it is --c-ink, so the night flips the day's constraint: the DARK
   * corner is now the safe one and the GLOW is the danger. The mockup's glow,
   * rgb(46 150 138 / 0.7), measured 3.21:1 under light text at its core; it is
   * re-tuned here to #227670 at 0.85, so the core is 4.82 against ink and the
   * worst blend over the sky's stops is 4.92 (over #1f6884) to 5.43 (over
   * #113d50). The sky's stops under ink: 5.57 (#1f6884, the lit centre) to
   * 10.39 (#113d50, the edge). Ink on the flat fallback #1a5a73: 6.82.
   * The sink corner darkens, which only helps light text, so the bands that
   * carry text take it at full strength here too (in the day they cannot). */
  --c-brand-field: #1a5a73;
  --brand-field-glow-top:       radial-gradient(ellipse 45% 65% at 100% 0%, rgb(34 118 112 / 0.85), rgb(34 118 112 / 0) 70%);
  --brand-field-glow-sink:      radial-gradient(ellipse 60% 85% at 0% 100%, rgb(8 36 50 / 0.85), rgb(8 36 50 / 0) 75%);
  --brand-field-glow-sink-text: var(--brand-field-glow-sink);
  --brand-field-glow-sky:       radial-gradient(ellipse 85% 110% at 62% 45%, #1f6884 0%, #1a5a73 45%, #154a60 75%, #113d50 100%);

  /* Text on the bright party colours stays the day's ink. Written out because
   * tokens.css derives it from --c-ink, which is light here: 5.64 on orange,
   * 9.05 on amber, 3.44 on the red end of the join card's gradient (large bold
   * text there, AA from 3.0). */
  --c-on-party-bright: #141414;

  /* A red party's social glyph under the pointer or the keyboard: the party
   * red is 2.99:1 on the night card (Phase 4's hover pass), so it is lifted,
   * same hue. Non-text (WCAG 2.1's 3:1, not a 2.0 rule). */
  --c-glyph-red:    #e0363f;   /* 3.64 on the card (surface) · 4.08 on bg */

  /* Surfaces and lines (tokens.css's ROLES, by job). */
  --c-on-ink:       #0e1820;   /* the "back to top" square's hover is a fill of --c-ink, light at night: 16.04 */
  --c-card:         #15232d;   /* /go's link boxes = surface; ink on it 14.3 */
  --c-field:        #15232d;
  --c-danger-bg:    #3a1517;
  --c-danger-ink:   #f4c3c5;   /* 10.36 on danger-bg */
  --c-band-tint:    #13303c;
  --c-index-band:   #0e1820;   /* the plan index's hover band: the ground, under ink 16.04 */
  --c-index-num:    var(--c-ink);   /* the step numbers keep the night ink: 16.04 on the ground */
  --shadow-pop:     0 0.6rem 1.4rem rgb(0 0 0 / 0.5);

  /* The folds (the header comment): non-text, so no WCAG 2.0 minimum. */
  --c-fold:         #2e4250;   /* 1.72 on bg · 10.44 under the white form card */
  --c-line-strong:  #5f7a8c;   /* 3.97 on bg · 3.18 on surface-deep (the party rows) */
  --c-mark-dark:    #2b2c2c;
  --c-photo-ground: #0e1820;   /* = bg, and opaque: in the day the photo's white
                                  covers the plan axis's line, and the headings
                                  set clear on a photo rely on it (a transparent
                                  ground ran the line under them, 1.66:1) */
  /* The plan photographs' night variants (Phase 3, §3.5): positive photographs
   * on this same ground, their fades running into it, brightest pixel #1b343d
   * (--c-ink 11.70, --c-body 8.51 on it). `build-col-images.py --night`. */
  --img-col-2:  url("/assets/img/cost-of-living/step-2-night.jpg");
  --img-col-4:  url("/assets/img/cost-of-living/step-4-night.jpg");
  --img-col-6:  url("/assets/img/cost-of-living/step-6-night.jpg");
  --img-col-8:  url("/assets/img/cost-of-living/step-8-night.jpg");
  --img-col-10: url("/assets/img/cost-of-living/step-10-night.jpg");
  --img-oc-1:   url("/assets/img/organized-crime/step-1-night.jpg");
  --img-oc-3:   url("/assets/img/organized-crime/step-3-night.jpg");
  --img-oc-5:   url("/assets/img/organized-crime/step-5-night.jpg");
  --img-oc-7:   url("/assets/img/organized-crime/step-7-night.jpg");
}

/* Its own prefers-contrast block: tokens.css's would put near-black text on
 * the night ground (plan §6b, 4). The same three, each pushed toward ink. */
@media (prefers-contrast: more) {
  :root { --c-body: #dde4e8; --c-muted: #b4c0c7; --c-rule: #7a8f9c; }   /* 13.96 · 9.66 · rule 5.33 on bg */
}

/* The light island (tokens.css): the forms' card keeps the light values, and
 * this keeps the browser's own colours inside it light too — the Tally
 * iframe's canvas (Chromium paints an opaque one behind a cross-origin frame
 * whose scheme differs from its host's, which would defeat the forms'
 * transparentBackground=1), form controls, scrollbars (plan §3.6). */
.enlist__card { color-scheme: light; }