/* Design tokens — adapted from the "Playful Vibrant" (playful-vibrant) system in FORGE's design library.
   EDIT THIS FILE to retune the whole site — every page builds its
   colour/type/spacing from these variables. See DESIGN.md. */
:root {
  --color-bg: #232323;
  --color-surface: #2b2b2b;
  --color-surface-alt: #333333;
  --color-text: #d5d5d5;
  --color-text-muted: #9a9a9a;
  --color-accent: #ee7888;
  --color-accent-contrast: #000000;
  --color-accent-2: #ec7785;
  --color-border: #4a4a4a;
  --font-display: 'DM Serif Display', Georgia, serif;
  --font-body: 'Work Sans', system-ui, sans-serif;
  --weight-display: 400;
  --weight-body: 400;
  --size-xs: 0.75rem;
  --size-sm: 0.9rem;
  --size-base: 1rem;
  --size-lg: 1.2rem;
  --size-xl: 1.5rem;
  --size-2xl: 2rem;
  --size-hero: clamp(2.75rem, 6vw + 1rem, 6.5rem);
  --leading-tight: 1.02;
  --leading-body: 1.6;
  --tracking-display: -0.01em;
  --tracking-caps: 0.14em;
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.8rem;
  --space-md: 1.25rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 4.5rem;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-pill: 999px;
  --border-w: 2px;
  --shadow-card: 0 6px 0 rgba(0,0,0,.35);
  --container-max: 1080px;
  --color-accent-fill: #a84451;
  --color-accent-fill-contrast: #ffffff;
  --font-text: var(--font-body);
}
/* the mono face belongs to the mounted components (part numbers,
   SKUs, prices in tables) and to nothing else on the page: it is
   declared only inside them, so a page rule that reads it inherits
   the body face instead. Labels, kickers and buttons are never mono. */
[data-forge-component], .fc-composition {
  --font-mono: 'Courier New', Courier, monospace;
}