/* Colors. Values copied from extension/shared/kinpaku.css (paper theme, the
   shipped product surface) and DESIGN.md (lacquer theme, the marketing site).
   Never invented. OKLCH only — hex appears only inside imported assets. */

:root {
  /* ── Gold. The mark, a line, a lit dot, the tag. Never text on paper. ── */
  --ks-kinpaku: oklch(84% 0.19 80.46);
  --ks-kinpaku-vivid: oklch(87% 0.20 85);
  --ks-kinpaku-rich: oklch(77% 0.13 82);
  --ks-kinpaku-deep: oklch(61% 0.085 78);
  --ks-kinpaku-pale: oklch(86% 0.07 84);
  --ks-kinpaku-glint: oklch(95% 0.04 84);
  --ks-on-gold: oklch(14% 0.018 95);

  /* ── Patina. State, links, selection, any text that has to be colored. ── */
  --ks-patina: oklch(70% 0.12 188);
  --ks-patina-pale: oklch(82% 0.07 188);
  --ks-patina-deep: oklch(46% 0.08 188);
  --ks-patina-ink: oklch(38% 0.08 188);

  /* ── Failure only. Never decorative. ── */
  --ks-vermilion: oklch(52% 0.16 35);

  /* ── Paper (default ground). ── */
  --ks-paper: oklch(97.8% 0 0);
  --ks-paper-raised: oklch(99.5% 0 0);
  --ks-paper-deep: oklch(95% 0 0);
  --ks-gray: oklch(92% 0 0);
  --ks-gray-2: oklch(88% 0 0);

  /* ── Ink. ── */
  --ks-ink: oklch(13% 0 0);
  --ks-text: oklch(22% 0 0);
  --ks-text-muted: oklch(46% 0 0);
  --ks-text-faint: oklch(56% 0 0);
  --ks-text-mute-deep: oklch(66% 0 0);

  /* ── Rules. A divider is faint; the bound of a control clears 3:1. ── */
  --ks-rule: oklch(13% 0 0 / 0.08);
  --ks-edge: oklch(13% 0 0 / 0.45);

  /* ── Semantic aliases. Author against these. ── */
  --ks-bg: var(--ks-paper);
  --ks-surface: var(--ks-paper-raised);
  --ks-surface-sunken: var(--ks-paper-deep);
  --ks-text-body: var(--ks-text);
  --ks-text-heading: var(--ks-ink);
  --ks-accent: var(--ks-kinpaku);
  --ks-accent-on: var(--ks-on-gold);
  --ks-state: var(--ks-patina);
  --ks-link: var(--ks-patina-deep);
  --ks-focus: var(--ks-patina);
  --ks-danger: var(--ks-vermilion);
}

/* ── Lacquer theme: the marketing site's dark ground (DESIGN.md §3).
      Apply with class="theme-lacquer" on html, body or any container. ── */
.theme-lacquer {
  color-scheme: dark;

  --ks-lacquer: oklch(7% 0.006 95);
  --ks-lacquer-deep: oklch(4% 0.004 95);
  --ks-lacquer-raised: oklch(11% 0.006 95);
  --ks-graphite: oklch(15% 0.008 95);
  --ks-graphite-2: oklch(19% 0.008 95);

  --ks-champagne: oklch(91% 0 0);
  --ks-text-warm: oklch(88% 0 0);

  --ks-kinpaku-rule: oklch(78% 0.12 82);
  --ks-patina-text: oklch(76% 0.088 190);

  --ks-paper: var(--ks-lacquer);
  --ks-paper-raised: var(--ks-lacquer-raised);
  --ks-paper-deep: var(--ks-lacquer-deep);
  --ks-gray: var(--ks-graphite);
  --ks-gray-2: var(--ks-graphite-2);

  --ks-ink: oklch(91% 0 0);
  --ks-text: oklch(88% 0 0);
  --ks-text-muted: oklch(72% 0 0);
  --ks-text-faint: oklch(62% 0 0);
  --ks-text-mute-deep: oklch(52% 0 0);

  --ks-rule: oklch(78% 0 0 / 0.16);
  --ks-rule-strong: oklch(74% 0.09 82 / 0.6);
  --ks-edge: oklch(78% 0 0 / 0.16);

  --ks-bg: var(--ks-lacquer);
  --ks-surface: var(--ks-lacquer-raised);
  --ks-surface-sunken: var(--ks-lacquer-deep);
  --ks-text-body: var(--ks-text-warm);
  --ks-text-heading: var(--ks-champagne);
  --ks-link: var(--ks-kinpaku);
  --ks-state: var(--ks-patina);
}