/* Design tokens from the token economy lab (acme-token-economy-lab/tokens.css),
 * copied unchanged so CADClamp's pages share its palette, type, space and motion. */

/* Hallmark · tokens for the token economy lab
 * Shared by workshop.html and dashboard/index.html so the two never drift.
 *
 * Colour values are preserved from the validated data-visualisation palette the dashboard
 * was built against, rather than restated in OKLCH, because the chart colours are gate-checked
 * at these exact values in both light and dark modes.
 *
 * Fonts are system faces only. The repo's claim is zero network dependencies, and a webfont
 * would break the page on a plane.
 */

:root {
  color-scheme: light;

  /* Surfaces and ink */
  --page:           #f9f9f7;
  --surface-1:      #fcfcfb;
  --surface-2:      #f2f1ed;
  --text-primary:   #0b0b0b;
  --text-secondary: #52514e;
  --text-muted:     #6f6d67;  /* 4.91:1 on --page; #898781 measured 3.41 and failed small text */
  --grid:           #e1e0d9;
  --baseline:       #c3c2b7;
  --border:         rgba(11, 11, 11, 0.10);

  /* Series: categorical slots, assigned in fixed order, never cycled */
  --series-1:       #2a78d6;
  --series-2:       #eb6834;

  /* Link ink: series-1 measures 4.19:1 on light, short of small-text AA.
     These are ramp steps 500 and 400, so no colour is improvised. */
  --link:           #256abf;

  /* Status: reserved, never reused as a series colour */
  --good:           #0ca30c;
  --warning:        #fab219;
  --critical:       #d03b3b;
  --success-text:   #006300;

  /* Sequential ramp: one hue, light to dark */
  --seq-100:        #cde2fb;
  --seq-250:        #86b6ef;
  --seq-400:        #3987e5;
  --seq-550:        #1c5cab;
  --seq-700:        #0d366b;

  /* Type */
  --font-display: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  --font-body:    system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono:    ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --text-xs:      0.75rem;
  --text-sm:      0.8125rem;
  --text-base:    0.9375rem;
  --text-lg:      1.0625rem;
  --text-xl:      1.25rem;
  --text-2xl:     1.5rem;
  --text-3xl:     2rem;
  --text-display-s: clamp(2.25rem, 5vw, 3.25rem);
  --text-display:   clamp(3.5rem, 13vw, 8.5rem);

  /* Space: 4pt scale */
  --space-2xs:    4px;
  --space-xs:     8px;
  --space-sm:     12px;
  --space-md:     16px;
  --space-lg:     24px;
  --space-xl:     32px;
  --space-2xl:    48px;
  --space-3xl:    72px;
  --space-4xl:    112px;

  /* Rules and radii */
  --rule-hair:    1px;
  --rule-thick:   2px;
  --radius-sm:    4px;
  --radius-md:    8px;
  --radius-lg:    12px;

  /* Motion */
  --dur-fast:     120ms;
  --dur-mid:      240ms;
  --dur-slow:     520ms;
  --ease-out:     cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:      cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out:  cubic-bezier(0.65, 0, 0.35, 1);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --page:           #0d0d0d;
    --surface-1:      #1a1a19;
    --surface-2:      #232322;
    --text-primary:   #ffffff;
    --text-secondary: #c3c2b7;
    --text-muted:     #898781;
    --grid:           #2c2c2a;
    --baseline:       #383835;
    --border:         rgba(255, 255, 255, 0.10);
    --series-1:       #3987e5;
    --series-2:       #d95926;
    --link:           #3987e5;
    --success-text:   #0ca30c;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --page:           #0d0d0d;
  --surface-1:      #1a1a19;
  --surface-2:      #232322;
  --text-primary:   #ffffff;
  --text-secondary: #c3c2b7;
  --text-muted:     #898781;
  --grid:           #2c2c2a;
  --baseline:       #383835;
  --border:         rgba(255, 255, 255, 0.10);
  --series-1:       #3987e5;
  --series-2:       #d95926;
  --link:           #3987e5;
  --success-text:   #0ca30c;
}