/* Omega Point figure tokens — https://omegapoint.systems/chart-styles */
:root {
  --bg: oklch(0.135 0.008 50);
  --ink: oklch(0.945 0.02 80);
  --ink-2: oklch(0.82 0.018 80);
  --ink-4: oklch(0.47 0.012 80);
  --rule: oklch(0.32 0.010 50);
  --rule-2: oklch(0.26 0.009 50);
  --rule-3: oklch(0.205 0.008 50);
  --c1: oklch(0.78 0.12 75);
  --c2: oklch(0.66 0.15 25);
  --c3: oklch(0.70 0.10 150);
  --c4: oklch(0.66 0.11 245);
  --c5: oklch(0.64 0.10 320);
  --c6: oklch(0.80 0.11 62);
  --serif: var(--serif-font), "Newsreader", serif;
  --sans: var(--sans-font), system-ui, sans-serif;
  --mono: var(--mono-font), "Geist Mono", monospace;
}

/* Shared SVG label classes used by chart components */
.axis {
  font-family: var(--mono);
  font-size: 14px;
  letter-spacing: 0.06em;
  fill: var(--ink-4);
  text-transform: uppercase;
}

.anno {
  font-family: var(--mono);
  font-size: 16px;
  letter-spacing: 0.03em;
  fill: var(--c1);
}

/* Card/carousel variant: axis + annotation labels scaled up (and a touch
   brighter) so the small print stays legible when a 4:5 card is viewed small
   on a phone. Use in archetype `card` branches in place of .axis / .anno. */
.axis-card {
  font-family: var(--mono);
  font-size: 28px;
  letter-spacing: 0.04em;
  fill: var(--ink-3);
  text-transform: uppercase;
}
.anno-card {
  font-family: var(--mono);
  font-size: 30px;
  letter-spacing: 0.03em;
  fill: var(--c1);
}

/* Gold <b> emphasis inside a stat value container */
.v b { color: var(--c1); font-weight: 600; }