/* ═══════════════════════════════════════════════════════════════════════
   M-A-S-T-E-R.ai — design tokens (assets/css/00-tokens.css)

   GENERATED. Do not hand-edit. The build writes this file from
   brand/tokens.json; brand/tokens.json is the only place a token NAME and a
   token VALUE live together. See the never-printed gate: it reads its name
   list from that same file at run time, so a token added to tokens.json is
   guarded on the same build that ships it.

   This file must load BEFORE main.css and before every pages/*.css. It is
   the only file in the theme permitted to contain a colour literal.

   Structure is three-state on purpose:
     1. bare :root                                  -> light, always defined
     2. @media (prefers-color-scheme: dark)
          :root:not([data-theme="light"])           -> system dark, but an
                                                       explicit light choice
                                                       still wins
     3. :root[data-theme="dark"]                    -> explicit dark wins in
                                                       both directions
   Raw tokens are declared once, in :root. Only the SEMANTIC aliases are
   redefined in the dark states, so there is exactly one place a mode swap
   can go wrong.
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  color-scheme: light dark;

  /* ── raw tokens · light set ─────────────────────────────────────────── */
  --master-color-foolscap:          #F6F2EA;
  --master-color-chalk:             #FFFFFF;
  --master-color-tracing:           #ECE6DA;
  --master-color-caliper:           #D6CFC2;
  --master-color-scribe:            #8C8577;
  --master-color-graphite:          #4E555B;
  --master-color-plumb:             #16191C;
  --master-color-index:             #0B5A4C;
  --master-color-index-pressed:     #08453A;
  --master-color-index-wash:        #DCEBE6;
  --master-color-annotation:        #FAE7C0;
  --master-color-ochre:             #8A5512;
  --master-color-ochre-wash:        #FAECCF;
  --master-color-minium:            #A6231A;
  --master-color-minium-wash:       #F7DFD9;
  --master-color-quiet:             #767C81;

  /* ── raw tokens · dark set ──────────────────────────────────────────── */
  /* Declared here too, not inside a media query, so that a rule which names
     a dark token directly can never resolve to an empty value. */
  --master-color-pitch:             #101315;
  --master-color-soot:              #191D21;
  --master-color-filings:           #6B7378;
  --master-color-pumice:            #ADB4B9;
  --master-color-gesso:             #E9E6E0;
  --master-color-verdigris:         #5CC4AC;
  --master-color-verdigris-pressed: #7FD9C3;
  --master-color-orpiment:          #E3A33F;
  --master-color-realgar:           #F3897C;
  --master-color-quiet-dark:        #8B9297;

  /* ── semantic layer · light ─────────────────────────────────────────── */
  /* THIS is what every component references. Nothing outside this file may
     name a raw token, and nothing anywhere may name a hex. */
  --master-ground:           var(--master-color-foolscap);
  --master-surface:          var(--master-color-chalk);
  --master-surface-recessed: var(--master-color-tracing);
  --master-rule-hairline:    var(--master-color-caliper);   /* decorative only */
  --master-rule:             var(--master-color-scribe);    /* carries meaning */
  --master-ink:              var(--master-color-plumb);
  --master-ink-secondary:    var(--master-color-graphite);
  --master-ink-disabled:     var(--master-color-quiet);
  --master-ink-reversed:     var(--master-color-chalk);     /* on a filled control */
  --master-accent:           var(--master-color-index);
  --master-accent-pressed:   var(--master-color-index-pressed);
  --master-accent-tint:      var(--master-color-index-wash);
  --master-focus-ring:       var(--master-color-index);
  --master-highlight:        var(--master-color-annotation);
  --master-caution:          var(--master-color-ochre);
  --master-caution-ground:   var(--master-color-ochre-wash);
  --master-stop:             var(--master-color-minium);
  --master-stop-ground:      var(--master-color-minium-wash);
  --master-selection-ground: var(--master-color-annotation);
  --master-selection-ink:    var(--master-color-plumb);

  /* ── type ───────────────────────────────────────────────────────────── */
  --master-font-display: "Libre Franklin", "Public Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --master-font-ui:      var(--master-font-display);
  --master-font-prose:   "Source Serif 4", "Source Serif Pro", "Charis SIL", Charter, "Bitstream Charter", Georgia, "Times New Roman", serif;
  --master-font-mono:    "Source Code Pro", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "DejaVu Sans Mono", monospace;
}

/* ── 2. system dark, unless the reader has explicitly chosen light ────── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --master-ground:           var(--master-color-pitch);
    --master-surface:          var(--master-color-soot);
    --master-surface-recessed: var(--master-color-pitch);
    --master-rule-hairline:    var(--master-color-soot);
    --master-rule:             var(--master-color-filings);
    --master-ink:              var(--master-color-gesso);
    --master-ink-secondary:    var(--master-color-pumice);
    --master-ink-disabled:     var(--master-color-quiet-dark);
    --master-ink-reversed:     var(--master-color-plumb);
    --master-accent:           var(--master-color-verdigris);
    --master-accent-pressed:   var(--master-color-verdigris-pressed);
    --master-accent-tint:      var(--master-color-soot);
    --master-focus-ring:       var(--master-color-verdigris-pressed);
    --master-highlight:        var(--master-color-orpiment);
    --master-caution:          var(--master-color-orpiment);
    --master-caution-ground:   var(--master-color-soot);
    --master-stop:             var(--master-color-realgar);
    --master-stop-ground:      var(--master-color-soot);
    --master-selection-ground: var(--master-color-verdigris);
    --master-selection-ink:    var(--master-color-plumb);
  }
}

/* ── 3. explicit dark, wherever the reader is ─────────────────────────── */
:root[data-theme="dark"] {
  --master-ground:           var(--master-color-pitch);
  --master-surface:          var(--master-color-soot);
  --master-surface-recessed: var(--master-color-pitch);
  --master-rule-hairline:    var(--master-color-soot);
  --master-rule:             var(--master-color-filings);
  --master-ink:              var(--master-color-gesso);
  --master-ink-secondary:    var(--master-color-pumice);
  --master-ink-disabled:     var(--master-color-quiet-dark);
  --master-ink-reversed:     var(--master-color-plumb);
  --master-accent:           var(--master-color-verdigris);
  --master-accent-pressed:   var(--master-color-verdigris-pressed);
  --master-accent-tint:      var(--master-color-soot);
  --master-focus-ring:       var(--master-color-verdigris-pressed);
  --master-highlight:        var(--master-color-orpiment);
  --master-caution:          var(--master-color-orpiment);
  --master-caution-ground:   var(--master-color-soot);
  --master-stop:             var(--master-color-realgar);
  --master-stop-ground:      var(--master-color-soot);
  --master-selection-ground: var(--master-color-verdigris);
  --master-selection-ink:    var(--master-color-plumb);
}

/* ── 4. an INVERTED REGION, which is what this theme actually needs ───── */
/* The inherited design has no dark MODE; it has dark BANDS inside a light
   page (.master-band--ink, .master-card--navy, .master-footer, the class
   finder stage). Those are not the reader's theme preference and must not
   be driven by it. A band opts in by carrying data-master-surface="inverted",
   and inside it the semantic aliases flip — including the focus ring and the
   selection ground, which is where the inherited code fails today. */
[data-master-surface="inverted"] {
  color-scheme: dark;
  --master-ground:           var(--master-color-pitch);
  --master-surface:          var(--master-color-soot);
  --master-surface-recessed: var(--master-color-pitch);
  --master-rule-hairline:    var(--master-color-soot);
  --master-rule:             var(--master-color-filings);
  --master-ink:              var(--master-color-gesso);
  --master-ink-secondary:    var(--master-color-pumice);
  --master-ink-disabled:     var(--master-color-quiet-dark);
  --master-ink-reversed:     var(--master-color-plumb);
  --master-accent:           var(--master-color-verdigris);
  --master-accent-pressed:   var(--master-color-verdigris-pressed);
  --master-accent-tint:      var(--master-color-soot);
  --master-focus-ring:       var(--master-color-verdigris-pressed);
  --master-highlight:        var(--master-color-orpiment);
  --master-caution:          var(--master-color-orpiment);
  --master-caution-ground:   var(--master-color-soot);
  --master-stop:             var(--master-color-realgar);
  --master-stop-ground:      var(--master-color-soot);
  --master-selection-ground: var(--master-color-verdigris);
  --master-selection-ink:    var(--master-color-plumb);
  background: var(--master-ground);
  color: var(--master-ink);
}

/* A light island inside an inverted band (a white card on the footer) flips
   back, so the pair is always computed against the ground it really has. */
[data-master-surface="inverted"] [data-master-surface="normal"] {
  color-scheme: light;
  --master-ground:           var(--master-color-foolscap);
  --master-surface:          var(--master-color-chalk);
  --master-surface-recessed: var(--master-color-tracing);
  --master-rule-hairline:    var(--master-color-caliper);
  --master-rule:             var(--master-color-scribe);
  --master-ink:              var(--master-color-plumb);
  --master-ink-secondary:    var(--master-color-graphite);
  --master-ink-disabled:     var(--master-color-quiet);
  --master-ink-reversed:     var(--master-color-chalk);
  --master-accent:           var(--master-color-index);
  --master-accent-pressed:   var(--master-color-index-pressed);
  --master-accent-tint:      var(--master-color-index-wash);
  --master-focus-ring:       var(--master-color-index);
  --master-highlight:        var(--master-color-annotation);
  --master-caution:          var(--master-color-ochre);
  --master-caution-ground:   var(--master-color-ochre-wash);
  --master-stop:             var(--master-color-minium);
  --master-stop-ground:      var(--master-color-minium-wash);
  --master-selection-ground: var(--master-color-annotation);
  --master-selection-ink:    var(--master-color-plumb);
  background: var(--master-ground);
  color: var(--master-ink);
}

/* ── 5. the three rules that were global literals and must not be ─────── */
html, body { background: var(--master-ground); color: var(--master-ink); }

::selection {
  background: var(--master-selection-ground);
  color: var(--master-selection-ink);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--master-focus-ring);
  outline-offset: 2px;
}

/* ── 6. forced-colors ─────────────────────────────────────────────────── */
/* Windows High Contrast throws the palette away. The focus ring must survive
   that, and a token system that does not say so leaves keyboard users
   without an indicator on the one platform that most needs it. */
@media (forced-colors: active) {
  a:focus-visible,
  button:focus-visible,
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible,
  summary:focus-visible,
  [tabindex]:focus-visible {
    outline: 3px solid CanvasText;
  }
}
