/* ==========================================================================
   style-compat.css — v1→F/G token bridge for calculator pages
   --------------------------------------------------------------------------
   Scoped to <main> — maps the old v1 property names that the production
   calculator CSS expects onto the current F/G semantic tokens from theme.css.
   The Phase 1 chrome (<nav>, <footer>) lives OUTSIDE <main> and
   uses :root tokens from style.css untouched.

   Old structural names still accepted inside the calculator CSS are listed
   here so they resolve to the correct F/G values at runtime.

   The legacy single-accent tokens are NO LONGER defined. Each usage in the
   per-calc CSS files has been replaced by the correct warm/cool semantic
   token (see per-calc CSS).

   Load order on a calc page:
     theme.css   (F/G :root / [data-theme] tokens)
     style.css   (Phase 1 chrome classes)
     style-compat.css (this file — v1 names bridged to F/G tokens, main-scoped)
     <tool>.css  (per-calc CSS — already rewritten to use F/G tokens directly)
   ========================================================================== */

main {
  /* Surfaces */
  --bg:         var(--c-bg);
  --surface:    var(--c-surface);
  --surface-2:  var(--c-surface-2);
  --surface-3:  var(--c-surface-2);

  /* Borders */
  --border:        var(--c-border);
  --border-bright: var(--c-border);

  /* Text */
  --text-primary:   var(--c-text);
  --text-secondary: var(--c-text-soft);
  --text-muted:     var(--c-text-faint);

  /* Typography stacks */
  --font-sans:    var(--font-content);
  --font-display: var(--font-mark);

  /* Spacing (unchanged numeric values) */
  --space-4:  1rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;

  /* Layout */
  --container: 1200px;

  /* Radii / motion */
  --radius:    14px;
  --radius-sm: 8px;
  --transition: 600ms cubic-bezier(0.4, 0, 0.2, 1);
}