/* THALER, Thaler Reserve Standard Works, design tokens.
   Ground: warm off white, never pure white, never flat grey. Green dominant,
   brass is the single sharp accent and never sits under body text. Every
   other color in the two stylesheets and both pages is derived from the
   eight named tokens below with color-mix, nothing new gets introduced. */

:root {
  /* the locked palette, verbatim, no additions */
  --thaler-deep: #14352A;
  --thaler: #1F6B4A;
  --thaler-bright: #4FB07C;
  --brass: #C9A227;
  --ground: #F2F5F0;
  --cream: #FAF8F2;
  --ink: #101A14;
  --ink-soft: #46574C;

  /* surfaces, all color-mix blends of the tokens above */
  --panel: var(--cream);
  --panel-2: color-mix(in srgb, var(--ground) 70%, var(--cream));
  --line: color-mix(in srgb, var(--ink) 16%, transparent);
  --line-soft: var(--line);
  --lift: 0 10px 30px color-mix(in srgb, var(--ink) 14%, transparent);
  --lift-hover: 0 18px 40px color-mix(in srgb, var(--ink) 16%, transparent);

  /* glass: cream at 72% so the nav blur reads, ink edge rather than cream */
  --glass: color-mix(in srgb, var(--cream) 72%, transparent);
  --glass-strong: var(--glass);
  --glass-border: color-mix(in srgb, var(--ink) 12%, transparent);

  /* dark surfaces, on-dark text tokens, all still from the named palette */
  --on-dark: var(--cream);
  --on-dark-soft: color-mix(in srgb, var(--cream) 78%, var(--thaler-deep));
  --dark-panel: color-mix(in srgb, var(--thaler-deep) 88%, black);
  --dark-line: color-mix(in srgb, var(--cream) 12%, transparent);

  /* the one gradient, spent on a single fill, never body copy, never text */
  --thaler-gradient: linear-gradient(100deg, var(--thaler-deep) 0%, var(--thaler) 55%, var(--thaler-bright) 100%);

  /* type: display, body, numerals. Inter is never used anywhere. */
  --font-display: "Bricolage Grotesque", "Iowan Old Style", "Georgia", serif;
  --font-body: "Geist", "Helvetica Neue", Arial, system-ui, sans-serif;
  --font-mono: "Geist Mono", "JetBrains Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

  /* one spacing scale. Use these in components.css for padding, gap, section rhythm. */
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-48: 48px;
  --space-64: 64px;
  --space-96: 96px;

  /* aliases so machine.html and existing inline styles keep resolving */
  --s1: var(--space-8);
  --s2: var(--space-16);
  --s3: var(--space-24);
  --s4: var(--space-32);
  --s6: var(--space-48);
  --s8: var(--space-64);
  --s12: var(--space-96);
  --s16: 128px;

  --radius: 24px;
  --radius-sm: 12px;
  --radius-pill: 999px;
  --maxw: 1180px;

  /* one card system: radius, 1px border colour, surface, inner padding */
  --card-radius: var(--radius);
  --card-border: var(--line);
  --card-surface: var(--cream);
  --card-pad: var(--space-32);

  color-scheme: light;
}