/* ══ WORLD SF · THE PRODUCT PALETTE ══ ═══════════════════════════════════════
   The app's colour system, mapped onto this page's 14 world tokens.
   Source of truth: App/design-mockups/mockups/app-v2.html (the Inter variant,
   2026-09-14) and App/main color palette.md. Hue 252 throughout.

   COLOUR ONLY. Never put structure, type or motion in a world file —
   skeleton.css owns those and contains zero hex codes.

   WHAT IS DIFFERENT ABOUT THIS WORLD: A, B and C are dark-only. This one
   carries light AND dark off the same ramp, exactly as the app does, and
   follows the visitor's OS setting unless they choose otherwise. That is the
   whole point — a visitor must not feel they changed products between the
   landing page and the app.

   Founder rulings carried through, both of them:
     · no pure white  → the app surface is #FBFCFE, never #FFFFFF
     · border at 1.51:1 → --n-8 #C3CBD5, not --n-7

   TWO MAPPINGS THAT ARE JUDGEMENT CALLS, FLAGGED SO THEY CAN BE OVERRULED:

   1. --paper INVERTS. On the dark worlds --paper was the one LIGHT surface.
      On a light ground the one contrasting surface has to go the other way, so
      --paper is the navy slab (--primary) and --ink is --on-primary. In dark
      mode it flips back to near-white, which is also what the app's primary
      button does. Recorded in landing/MEMORY.md 2026-08-15 off the Kelvin mock.

   2. --fault BECOMES --danger. The old teal #0c6b5a has no home in the app
      system, whose rule 3 is "don't add a second brand hue — green and red
      belong to grading". A caveat node reads closest to danger, so it borrows
      grading's red. This is the one place the landing bends that rule; the
      alternative was accent-blue, which would make the fault node invisible
      against an accent that is already blue. Say the word and it flips.

   THE AMBIENT PAINT IS SOLVED, NOT EYEBALLED. Same rule world A used: the
   worst case is paint composited at --ambient-a × 0.95 (the DOT constant in
   ambient.js) over --ground, and the chosen paint is the most extreme value
   that still leaves the 13px caption at ≥95% of the contrast it has on bare
   ground. Computed with APCA-W3 0.1.9, validated against world-a.css's own
   stated numbers (it reproduces its Lc 60 → 57 exactly) before being used here.
   ══════════════════════════════════════════════════════════════════════════ */

:root {
  --ground:#F4F6F9;      /* --n-2 · the app background, not a new colour */
  --t1:#18222D;          /* --n-12 · Lc 97.5 on ground */
  --t2:#64707E;          /* --n-11 · Lc 69.4 */
  --t3:#767E88;          /* --n-10 · Lc 62.8 */
  --hairline:#C3CBD5;    /* --border · the 1.51:1 ruling */
  --paper:#0C2F51;       /* --primary · the inversion, see note 1 above */
  --ink:#EEF8FF;         /* --on-primary · Lc 97.4 on paper */
  --accent:#345D8A;      /* --a-11 · 6.30:1 as text on ground, per the audit */
  --accent-ink:#EEF8FF;
  --fault:#BE2038;       /* --danger · see note 2 above */
  --screen:#FBFCFE;      /* --n-1 · the iPad shows the actual product surface */
  --lid:#FBFCFE;         /* WHITE, founder 2026-09-14: "i cant really see the
                            ipad in dark mode tho so make the ipad white". Was
                            --n-9 #858D97. A white body on a near-white page is
                            only 1.05:1, so in light mode the device is carried
                            by --device-shadow below, not by its own fill. */
  --device-shadow:rgba(24,34,45,.17);  /* --n-12 at 17%. The ONE thing holding a
                            white iPad off a white page. art.js skips the shadow
                            entirely when a world does not define this, so the
                            three old worlds are untouched and art.js stays
                            hex-free. */
  --ambient:#DEE1E5;     /* SOLVED: caption Lc 74.3 of 78.0 = 95.3% */
  --ambient-a:0.32;      /* matched to world A's L2 pick so the three worlds
                            stay comparable if the split test is ever rerun */
}

/* ── DARK ────────────────────────────────────────────────────────────────
   The app's dark ramp. --ground and --screen are literally the app's --bg and
   --surface, so the laptop on screen 1 is showing the real thing.

   The text ladder was NOT a straight lift. The app's dark ramp jumps from
   --n-11 #969BA0 to --n-12 #EDF0F2 with nothing between, and taking --n-10
   #676C73 for --t3 measured Lc 24.8 — far below the Lc 42.5 the same slot has
   in world B, and unreadable at the 9.5px the slide stamps are drawn at. So
   --t3 takes --n-11 and --t2 is derived at 45% of the way from --n-11 to
   --n-12. The ladder now measures 97.2 / 68.3 / 47.3 against world B's
   91.4 / 66.4 / 42.5 — stronger in all three, which is also the "more
   contrast" the founder asked for on 2026-09-14. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ground:#101215;      /* --n-1 dark · the app background */
    --t1:#EDF0F2;          /* --n-12 · Lc 97.2 */
    --t2:#BDC1C5;          /* derived · Lc 68.3 */
    --t3:#969BA0;          /* --n-11 · Lc 47.3 */
    --hairline:#31363B;    /* --border dark = --n-7 */
    --paper:#EDF0F2;       /* flips back to near-white, like the app's
                              primary button in dark */
    --ink:#101215;
    --accent:#ADC0D6;      /* --a-11 dark · 10.08:1 as text, per the audit */
    --accent-ink:#101215;
    --fault:#FA686A;       /* --danger dark */
    --screen:#191C20;      /* --n-3 dark = the app's --surface */
    --lid:#EDF0F2;         /* white here too. --n-12 rather than the light
                              mode's #FBFCFE: against a #101215 ground a true
                              white slab is ~18:1 and glares, and --n-12 is
                              already this palette's own near-white. */
    --device-shadow:rgba(0,0,0,.55);
    --ambient:#606265;     /* SOLVED: caption Lc 61.6 of 64.9 = 95.0% */
    --ambient-a:0.32;
  }
}

/* The explicit choice has to beat the OS setting in BOTH directions, so the
   dark block is repeated verbatim here. Without this a visitor who picks Dark
   on a light-set machine gets the light palette and thinks the button is
   broken. Keep the two blocks identical — edit one, edit the other. */
:root[data-theme="dark"] {
  --ground:#101215;
  --t1:#EDF0F2;
  --t2:#BDC1C5;
  --t3:#969BA0;
  --hairline:#31363B;
  --paper:#EDF0F2;
  --ink:#101215;
  --accent:#ADC0D6;
  --accent-ink:#101215;
  --fault:#FA686A;
  --screen:#191C20;
  --lid:#EDF0F2;
  --device-shadow:rgba(0,0,0,.55);
  --ambient:#606265;
  --ambient-a:0.32;
}