/* ============================================================
   TKS Design Tokens — assets/tks-tokens.css
   Version: 1.0 | 2026-08-29

   THE brand palette. Not a copy of one — the only declaration.

   Every value is quoted from tks-resources:specs/TKS-brand-design-system.md,
   which is authoritative. Do not add a value here that the brand doc
   does not name, and do not redeclare any of these tokens anywhere
   else. An interactive's own document that needs a colour the brand
   has not named declares that one colour locally, next to the rules
   that use it, and leaves the palette alone.

   Why this file exists (TKS-2058): the palette used to be redefined in
   every interactive's HTML plus player.css — up to 20 copies in four
   different vocabularies, each free to drift from the brand doc, and
   several already had. An interactive's document is a real iframe with
   its own document, so it cannot inherit player.css; the only way one
   palette can serve both the player page and every embedded document
   is a file both link.

   Loaded by:
     - index.html and exam/index.html, BEFORE player.css (which uses
       these tokens and no longer declares any)
     - each interactive's own HTML document, as
       /assets/tks-tokens.css — root-absolute, the same idiom those
       documents already use for components/ and curios/ (TKS-2214
       repointed the last five off a ../../../../ relative path, and
       the components/curios half of the old claim was never true:
       base-odometer loads /components/transport.js root-absolute)

   The surface ramp is a 1:1 mapping onto the four dark surfaces the
   brand names, and a semantic one rather than merely numeric:
   --bg-raised is what .plyr-otl-row:hover uses, and Dark Mid is the
   brand's stated hover/border value.
   ============================================================ */

:root {
  --bg-darkest:  #001525;   /* Navy Dark — page background            */
  --bg-dark:     #052035;   /* Navy Mid — card / panel background     */
  --bg-mid:      #042833;   /* Dark Blue — alternate panel / section  */
  --bg-raised:   #0A2A3F;   /* Dark Mid — hover states, borders       */

  --border-subtle: rgba(99,214,214,0.12);
  --border-mid:    rgba(99,214,214,0.25);
  --border-strong: rgba(99,214,214,0.45);

  --color-green:  #CCE50C;   /* Surge Green — a yellow-green, not mint */
  --color-teal:   #63D6D6;   /* Electric Blue / Teal                   */
  --color-orange: #FF4433;   /* Orange — alerts and warnings only      */
  --color-white:  #FFFFFF;   /* White — high-contrast text, neutrals   */

  --text-primary:   #E9F2F2;   /* Light Grey */

  /* The two below are the deliberate exceptions to the paragraph above.

     --text-secondary: the brand names White, Light Grey, Text Muted
     (.35) and Text Dim (.18) — it has no token for the step between
     primary and muted, so this one has nothing to conform to. Flagged
     rather than invented.

     --text-muted: the brand's Text Muted IS rgba(255,255,255,0.35), and
     this is knowingly not it. Measured 2026-08-28, that value reads
     3.18:1 on Navy Dark, 3.15:1 on Navy Mid and 3.10:1 on Dark Blue —
     under WCAG AA's 4.5:1, and every call site is 10-15px text: state
     labels, page subtitles, stat labels, error messages. #7a9bb5
     measures 6.33 / 5.68 / 5.30 on the same three surfaces.

     Left as-is rather than conformed, because the fix is a policy
     decision and not a token edit: the brand doc's derived neutrals
     (Text Muted .35, Text Dim .18) both fail AA at body sizes, so
     conforming to them platform-wide would ship a regression. TKS-2072
     owns the audit, the written accessibility standard, and the
     brand-doc amendment; this token resolves there, in either
     direction, and this comment goes with it. (TKS-2058) */
  --text-secondary: #b8cdd8;
  --text-muted:     #7a9bb5;

  --font-display: 'Ramabhadra', sans-serif;
  --font-body:    'Inter', sans-serif;
  --font-mono:    'Share Tech Mono', monospace;

  --radius-card:  14px;
  --radius-inner: 10px;
}