/* 9CXO design tokens — standalone brand, dark-first glass canvas.
 *
 * Replaced 2026-10-22 (CEO: "take new 9CXO CI from html"). The previous set
 * inherited Baltasaar's petrol authority (#0E5561) and lime (#C8D400). The new
 * surface is a near-black ground with a desaturated olive-lime accent and a
 * mint positive — read out of the delivered glass landing page, not invented
 * here, so the page and anything built next to it agree on the same values.
 *
 * Shared source of truth for index.html, the checkout page, the legal pages and
 * the booking re-skin in nginx.conf. When one of those drifts from this file,
 * this file wins.
 *
 * What changed, and why it matters: petrol is GONE. Any surface still painting
 * #0E5561 or #C8D400 is on the old brand. Those two values survive in exactly
 * one place on purpose — the booking widget proxied from the Pi — and they are
 * being migrated with the rest of the re-skin.
 */
:root {
  /* ── Ground ──────────────────────────────────────────────────────────────
   * Three steps of near-black, not one. The page reads as glass because the
   * panels sit a fraction above the ground, so a single flat background would
   * flatten every card on it. */
  --cxo-ground: #050605;        /* html/body — the floor */
  --cxo-ground-2: #070806;      /* hero tail, where the photo fades out */
  --cxo-ground-3: #141414;      /* raised surfaces on light sections */

  /* ── Ink ─────────────────────────────────────────────────────────────── */
  --cxo-ink: #fbfbfa;           /* primary text on the dark ground */
  --cxo-ink-soft: #c6c8c4;      /* secondary copy */
  --cxo-ink-mute: #9a9c99;      /* labels, captions */
  --cxo-ink-dim: #7c7d7c;       /* the quietest legible step */
  --cxo-ink-invert: #1a1d0c;    /* text ON the lime accent */

  /* ── Accent ──────────────────────────────────────────────────────────────
   * One high-energy accent, and it has to earn each appearance: CTAs, live
   * signals, the active rail dot. Everything else is ink on glass. */
  --cxo-lime: #d2dc4f;
  --cxo-lime-deep: #c6c85a;     /* hover / pressed */
  --cxo-lime-shade: #8f9a4a;    /* lime at low emphasis, e.g. meters */

  /* ── Status ──────────────────────────────────────────────────────────────
   * Mint for positive, because the accent is already spending the page's
   * attention budget and a second yellow-green would compete with it. */
  --cxo-pos: #8fce9d;
  --cxo-pos-2: #77c18c;
  --cxo-pos-3: #5f9c6c;
  --cxo-track: #373a34;         /* unfilled meter / progress track */

  /* ── Glass ───────────────────────────────────────────────────────────────
   * The panel look is a 1px gradient hairline over a blurred, barely-tinted
   * fill. Keep the fill below 10% white or the "glass" turns into grey card. */
  --cxo-panel: rgba(255, 255, 255, 0.055);
  --cxo-panel-line: rgba(255, 255, 255, 0.055);
  --cxo-panel-strong: rgba(255, 255, 255, 0.10);
  --cxo-blur: blur(24px) saturate(1.25);

  /* ── Type ────────────────────────────────────────────────────────────────
   * Roboto 300–600 from Google Fonts. 300 carries the display sizes; anything
   * below 16px goes to 400 or it disappears on the dark ground. */
  --cxo-font: "Roboto", "Helvetica Neue", "Segoe UI", system-ui, Arial, sans-serif;
  --cxo-font-mono: "SF Mono", Consolas, Menlo, monospace;

  /* ── System ──────────────────────────────────────────────────────────────
   * The hero scales off --u (one unit of the 1341×958 design frame) rather
   * than rem, so the composition holds at any viewport instead of reflowing
   * into a different picture. Do not convert the hero to rem/px. */
  --cxo-u: min(calc(100vw / 1341), calc(100vh / 958));
  --cxo-space: 8px;
  --cxo-radius: 14px;
  --cxo-radius-pill: 36px;
}