/* KRITIKAL — design tokens
 *
 * Palette derived from the rig itself: painted-ply cabinet grey, Warnex
 * textured black, hi-vis crew orange. Not decoration — these are the actual
 * colours of the objects the company owns.
 *
 * The names describe ROLES, not literal colours, which is what lets the whole
 * site flip between dark and light by redefining this one block. `--pit` is
 * "the deepest surface" and `--chalk` is "type on the dominant surface"; in a
 * light room those are a pale ply and near-black respectively.
 *
 * The 3D scene reads its own palette back out of these variables at runtime,
 * so there is one copy of every colour on the site and it cannot drift.
 */

:root {
  color-scheme: dark;

  /* Surfaces */
  --pit:      #131315;  /* deepest black, sits behind the 3D stack */
  --warnex:   #232326;  /* textured cabinet paint — dominant dark surface */
  --warnex-2: #2C2C30;  /* raised panel */
  --cab:      #C9C6BE;  /* painted-ply cabinet grey — their actual rig colour */
  --cab-2:    #DAD7D0;  /* lighter face, catches the key light */
  --chalk:    #F2F0EB;  /* stencil white — type on the dominant surface */

  /* Accents */
  /* The accent, in two jobs that need two values. --hivis is a FILL you put
     --on-accent text on top of; --accent-text is the accent used AS type, on
     the page. One colour cannot do both: dark enough to read as small text on
     paper is too dark to carry black text as a button. */
  --hivis:       #FF5A1F;  /* crew hi-vis — actions only, never decoration */
  --accent-text: #FF5A1F;
  --hivis-dk:    #D9430E;
  /* The same orange burnt down far enough to read as small text on the
     cabinet-grey sections. Straight --hivis on --cab is 1.8:1 and fails. */
  --hivis-ink: #8F2D06;
  --tape:     #E8C547;  /* gaffer amber — reserved for the live audio state */

  /* Type that sits ON hi-vis or gaffer amber. Near-black in both modes, and
     deliberately not --chalk: white on #FF5A1F is 2.6:1 and fails, which is
     the pairing every piece of real site signage avoids for the same reason. */
  --on-accent: #16161A;

  /* The two constants. Neither flips, because they are used together: a chip
     that is always near-black needs a label that is always pale, whatever the
     rest of the page is doing. */
  --always-ink:  #16161A;
  --always-pale: #F2F0EB;

  /* Text */
  --ink:          #16161A;
  --ink-soft:     #474750;  /* darkened from #55555E to clear 4.5:1 on --cab */
  --ink-invert:   #F2F0EB;
  --ink-invert-2: #A6A6AE;

  /* Lines — hairlines read as cabinet edges and ply seams */
  --edge-dark:  rgba(242, 240, 235, 0.14);
  --edge-light: rgba(22, 22, 26, 0.16);

  /* What the 3D scene reads. Kept here with everything else rather than in the
     JavaScript, so a palette change is one file. */
  --rig-key:    #ffffff;   /* the key light */
  --rig-face:   #bfd0e0;   /* the light that keeps the grey cabinets grey */
  --rig-ambient:#4a505c;
  --rig-fog:    #131315;
  --rig-beam:   #bcd2e8;   /* haze out of the horn tops */
  --rig-exposure: 1;       /* overall light multiplier for the mode */
  /* How much of the additive layer — beams, haze, ground pool, horn glow — to
     use. Additive light only ever brightens towards white, so on a pale page
     it has to be almost entirely off or the rig blows out to a slab. */
  --rig-additive: 1;

  /* Channel forms, for scrims and subtle fills. A literal rgba() cannot flip
     with the mode, and every wash on this site is a wash *of a surface*. */
  --pit-rgb:    19 19 21;
  --warnex-rgb: 35 35 38;
  --cab-rgb:    201 198 190;
  --chalk-rgb:  242 240 235;
  --ink-rgb:    22 22 26;
  --hivis-rgb:  255 90 31;
  --tape-rgb:   232 197 71;

  /* Type */
  --display: "Archivo", "Arial Black", system-ui, sans-serif;
  --body:    "IBM Plex Sans", system-ui, -apple-system, sans-serif;
  --mono:    "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Scale — 1.333 perfect fourth, fluid at the display end */
  --t-xs:   0.75rem;
  --t-sm:   0.875rem;
  --t-base: 1rem;
  --t-md:   1.125rem;
  --t-lg:   clamp(1.35rem, 1.1rem + 1.1vw, 1.85rem);
  --t-xl:   clamp(1.9rem, 1.3rem + 2.6vw, 3rem);
  --t-2xl:  clamp(2.4rem, 1.3rem + 3.4vw, 4.25rem);
  --t-3xl:  clamp(3.2rem, 1.4rem + 7vw, 7.5rem);

  /* Space — 8px base */
  --s-1: 0.5rem;
  --s-2: 1rem;
  --s-3: 1.5rem;
  --s-4: 2rem;
  --s-5: 3rem;
  --s-6: 4rem;
  --s-7: 6rem;
  --s-8: 9rem;

  /* Layout */
  --wrap: 1280px;
  --wrap-narrow: 760px;
  --gutter: clamp(1.25rem, 4vw, 3.5rem);

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 160ms;
  --dur: 320ms;
  --dur-slow: 720ms;
}

/* Cabinets are square-edged. No radius anywhere except the FEEL IT control,
   which is a physical toggle and earns its pill shape. */

/* ---------- Light ----------
 *
 * Not the dark palette inverted. Inverting puts the pale cabinet grey where the
 * near-black was, which loses the one visual fact this whole identity is built
 * on — that their rig is the pale thing in a dark room. A daylight version has
 * to re-derive from the same objects instead: this is the reference photograph,
 * a grey stack in a garden under a bright sky. Ply and chalk are the surfaces,
 * the cabinet grey becomes the mid-tone panel, and the orange burns down so it
 * still reads as a warning colour rather than as highlighter.
 *
 * Applied by JavaScript on <html>, so the attribute is the single switch. The
 * inline script in each page's <head> stamps it before first paint — without
 * that the site renders dark and then flashes to light.
 */
[data-mode="light"] {
  color-scheme: light;

  --pit:      #EFEDE6;  /* the page. Chalk, not white — this is painted ply */
  --warnex:   #E2DFD6;  /* the dominant panel */
  --warnex-2: #D8D5CB;  /* raised panel */
  /* Lifted from #B4B1A7: --ink-soft on that was 4.28:1, just under AA */
  --cab:      #C3C0B6;  /* the cabinet sections, now the mid-tone */
  --cab-2:    #D0CDC4;
  --chalk:    #16161A;  /* type on the dominant surface: ink in a light room */

  /* Bright enough that near-black type on it clears 4.5:1 (it lands at 5.0) */
  --hivis:       #E8551C;
  /* and burnt right down for use as type on the paper, where it lands at 6.9 */
  --accent-text: #8F2D06;
  --hivis-dk:    #B33509;
  --hivis-ink:   #8F2D06;
  --tape:     #B08A08;

  --ink:          #16161A;
  --ink-soft:     #474750;
  --ink-invert:   #16161A;  /* "inverted" text is still ink here */
  --ink-invert-2: #55555E;

  --edge-dark:  rgba(22, 22, 26, 0.16);   /* hairlines go dark on pale */
  --edge-light: rgba(22, 22, 26, 0.22);

  /* Daylight rather than a stage. Cooler key, much stronger ambient, and the
     exposure pulled down because a pale cabinet under stage lighting on a pale
     page blows out to a white blob. */
  --rig-key:     #fbf7ef;
  --rig-face:    #e8eef5;
  --rig-ambient: #59616b;
  --rig-fog:     #3a3d42;
  --rig-beam:    #8fa4b8;
  /* The fog and the ambient are DARK here, on purpose. Fog the colour of the
     paper faded the stack into the page, and a strong pale ambient flattened
     every face to the same grey — together they made a ghost. A dark fog and a
     weak ambient leave the key light to model it, so it stands off the page. */
  /* Far lower than it looks like it should be. The cabinets are #a9aeb0 and
     the page is #EFEDE6, so the rig only reads at all when it is DARKER than
     the paper behind it — a grey stack against a bright sky, which is exactly
     what the reference photograph is. Lit to "normal" it disappears. */
  --rig-exposure: 0.34;
  --rig-additive: 0.12;

  --pit-rgb:    239 237 230;
  --warnex-rgb: 226 223 214;
  --cab-rgb:    195 192 182;
  --chalk-rgb:  22 22 26;   /* follows --chalk: subtle fills go dark on pale */
  --ink-rgb:    22 22 26;
  --hivis-rgb:  232 85 28;
  --tape-rgb:   176 138 8;
}