/* ─────────────────────────────────────────────────────────────────────
 *  Quiver brand tokens · identity 2026, "one light is on"
 *  One light is on: everything is bone, ink and graphite, and the only
 *  colour is one small warm light, an old tungsten bulb, that always
 *  means something.
 *  JSON mirror: tokens/quiver.json. Guide: brand/index.html.
 * ───────────────────────────────────────────────────────────────────── */

:root {
  /* ── Surfaces ───────────────────────────────────────────────────── */
  --q-paper: #f2efe9;          /* pages, paper, the space around the device */
  --q-bone: #dcd7ce;           /* the moulded panel, the brand's main surface */
  --q-bone-top: #e6e2da;       /* panel gradient, top */
  --q-bone-bottom: #d6d1c8;    /* panel gradient, bottom */
  --q-recess: #cec8be;         /* tracks, wells, recessed displays */
  --q-graphite: #2b2926;       /* knobs and keycaps, matte */
  --q-key-label: #8a8378;      /* labels printed on keycaps */
  --q-glass: #0a0a0b;          /* the window */
  --q-glass-glow: #1e150b;     /* the warm glow rising inside the glass */
  --q-night: #0b0a09;          /* the dark room before the light is on */

  /* ── Ink ────────────────────────────────────────────────────────── */
  --q-ink: #1f1d1a;            /* type and marks on bone */
  --q-ink-2: #47433d;          /* secondary text */
  --q-ink-3: #7b756b;          /* labels, captions */
  --q-ink-4: #aaa396;          /* disabled, hairlines */
  --q-on-dark: #ece6dc;        /* type on glass and night */

  /* ── The one light: warm tungsten, about 2700 K ─────────────────── */
  --q-signal: #c27c1a;         /* marks on the panel: active arc, open tab, flat LED */
  --q-signal-strong: #a3620f;  /* hover and pressed marks, text in the light's colour */
  --q-signal-rgb: 194, 124, 26;
  --q-light: #f2ae55;          /* anything lit: LEDs, light pipes, the edge of a bulb */
  --q-light-2: #ffcf8a;        /* marks drawn on glass */
  --q-light-3: #ffe0a3;        /* the hot core of a light */
  --q-light-4: #fffaf0;        /* bloom, the brightest point */
  --q-light-rgb: 242, 174, 85;
  --q-light-2-rgb: 255, 207, 138;

  /* ── Type ───────────────────────────────────────────────────────── */
  /* Martian Mono: the logo, readouts, labels, captions, prices.       */
  /* Hanken Grotesk: headlines, interface text, body copy.             */
  --q-font-mono: "Martian Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --q-font-sans: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --q-track-display: -0.045em;
  --q-track-heading: -0.025em;
  --q-track-mono: 0.02em;

  /* ── Shape ──────────────────────────────────────────────────────── */
  --q-radius-panel: 24px;
  --q-radius-module: 16px;
  --q-radius-key: 8px;
  --q-radius-pill: 999px;

  /* ── Light and shadow (one source, from above) ──────────────────── */
  --q-shadow-rgb: 46, 36, 26;
  --q-raised:
    inset 0 1px 0 rgba(255, 255, 255, .85),
    inset 0 -1px 0 rgba(0, 0, 0, .05),
    0 1px 1.5px rgba(var(--q-shadow-rgb), .20),
    0 3px 8px -3px rgba(var(--q-shadow-rgb), .26);
  --q-pressed:
    inset 0 1px 3px rgba(var(--q-shadow-rgb), .30),
    inset 0 0 0 1px rgba(var(--q-shadow-rgb), .06),
    0 1px 0 rgba(255, 255, 255, .6);
  --q-recessed:
    inset 0 1px 3px rgba(var(--q-shadow-rgb), .26),
    inset 0 0 0 1px rgba(var(--q-shadow-rgb), .06),
    0 1px 0 rgba(255, 255, 255, .7);
  --q-moulded:
    inset 0 1.5px 0 rgba(255, 255, 255, .8),
    inset 0 -2px 1px rgba(0, 0, 0, .05),
    0 1px 1px rgba(var(--q-shadow-rgb), .10),
    0 14px 28px -12px rgba(var(--q-shadow-rgb), .26),
    0 40px 80px -36px rgba(var(--q-shadow-rgb), .34);

  /* ── The LED ────────────────────────────────────────────────────── */
  --q-led-off: radial-gradient(circle at 40% 35%, #bdb5a9, #a39b8e);
  --q-led-on: radial-gradient(circle at 40% 35%, var(--q-light-3), var(--q-light) 60%);
  --q-led-glow: 0 0 0 1px rgba(var(--q-signal-rgb), .25), 0 0 7px 1px rgba(var(--q-light-rgb), .7);

  /* ── Motion ─────────────────────────────────────────────────────── */
  --q-ease: cubic-bezier(.2, .8, .2, 1);
  --q-step: 125ms;             /* one 1/16 at 120 bpm: the step light */
}
