/**
 * Atelier — derived tokens. Computed from the 6 base + 3 state vars set by
 * web/css/tokens/_palette-*.css, so this file needs no palette-specific values
 * and works identically under every [data-atl-palette] value.
 *
 * Rule: component/page CSS must use these, not invent its own color-mix() ratio.
 * (Playbook §6.2 "no hard-coded colors" extends to ad-hoc derived-color ratios —
 * a page that mixes its own 14% vs another page's 10% "border" drifts silently.)
 */
:root {
  --atl-border: color-mix(in oklab, var(--atl-text) 10%, var(--atl-bg));
  --atl-border-strong: color-mix(in oklab, var(--atl-text) 35%, var(--atl-bg));
  --atl-text-muted: color-mix(in oklab, var(--atl-text) 65%, var(--atl-bg));
  --atl-text-subtle: color-mix(in oklab, var(--atl-text) 50%, var(--atl-bg));
  --atl-accent-hover: color-mix(in oklab, var(--atl-accent) 85%, black);
  --atl-focus-ring: color-mix(in oklab, var(--atl-accent) 60%, var(--atl-bg));
  --atl-band-text: var(--atl-bg);
  --atl-accent-tint: color-mix(in oklab, var(--atl-accent) 6%, var(--atl-surface));
  --atl-overlay-scrim: color-mix(in oklab, var(--atl-text) 72%, var(--atl-bg));
  --atl-shadow-tint: color-mix(in oklab, var(--atl-text) 25%, transparent);
}

/*
 * Base document wiring. The preview harness (web/preview/*.html) only ever set
 * this in each file's own dev-only <style> block, which is explicitly NOT
 * theme content -- it was never ported into the shipped theme CSS, so every
 * real Magento page fell back to Magento's default white background / #333
 * text instead of the ivory palette. S4 Team-Lead review caught this
 * (2026-07-12) on the deployed Home build. This must be global (not
 * page-scoped) since every page needs the palette surface, not just Home.
 */
body {
  background: var(--atl-bg);
  color: var(--atl-text);
  font-family: 'Jost', sans-serif;
}