/* ============================================================================
   BRAND — the per-instance file, and the only one that differs between Joy Core
   and Purple Orange.

   IT NO LONGER SETS THE ACCENT. It used to open with `:root{--accent:var(--red)}`,
   which was correct when there was one look and wrong the moment there were
   three: `:root` and `[data-look="meter"]` have the SAME specificity, and this
   file loads after core.css, so it silently won. Meter rendered its accent word
   in Run's red, on every page, with nothing in the CSS looking wrong.

   The rule that came out of that: **a look owns colour, an instance owns
   identity.** What is left here is what actually differs between two clients on
   the same platform — the mark, the name, and the section-band tints.
   ========================================================================== */
:root{
  --brand-mark:url("/brand/assets/logos/joy.png");
  --brand-name:"Joy Core";
}

/* ---- section bands --------------------------------------------------------
   A band tints a whole section of a board. These are derived from the ACTIVE
   look's own tokens rather than from a fixed palette, so a band in Box is a
   bone band and a band in Meter is a cool grey one — without this file knowing
   which look is on. `--sc-band-num` is the colour big figures take inside a
   band, and it is the readable twin of the tint, never the tint itself. */
[data-scheme]{
  --sc-band:var(--mist);
  --sc-band-fg:var(--ink-2);
  --sc-band-mute:var(--ink-3);
  --sc-band-num:var(--ink);
  --sc-band-rule:var(--line);
}

/* The named bands. Each mixes the look's own paper with one hue, so the tint
   sits in the same family as everything around it. color-mix keeps that true
   across all three looks from one declaration; browsers without it fall back to
   the plain --mist band above, which is a legitimate quieter version. */
[data-scheme="blush"] { --sc-band:color-mix(in srgb, var(--paper) 88%, #E35B45);
                        --sc-band-num:#8E1D17; --sc-band-rule:rgba(142,29,23,.18) }
[data-scheme="powder"]{ --sc-band:color-mix(in srgb, var(--paper) 88%, #2F5AA8);
                        --sc-band-num:#254A8C; --sc-band-rule:rgba(37,74,140,.18) }
[data-scheme="butter"]{ --sc-band:color-mix(in srgb, var(--paper) 86%, #E8C55A);
                        --sc-band-num:#7A6308; --sc-band-rule:rgba(122,99,8,.2) }
[data-scheme="pink"]  { --sc-band:color-mix(in srgb, var(--paper) 90%, #C2557F);
                        --sc-band-num:#8A3A63; --sc-band-rule:rgba(138,58,99,.18) }
[data-scheme="ivory"] { --sc-band:color-mix(in srgb, var(--paper) 94%, #C9A227);
                        --sc-band-num:var(--ink); --sc-band-rule:var(--line) }
/* The one inverted band. At most one per screen, or it stops meaning anything. */
[data-scheme="green"] { --sc-band:#0E3B24; --sc-band-fg:#E9F0EB; --sc-band-num:#F2E27F;
                        --sc-band-mute:rgba(233,240,235,.78);
                        --sc-band-rule:rgba(255,255,255,.22) }
