/* ==========================================================================
   YODELOPE — SITE TOKENS  (yodelope.com)
   ==========================================================================

   This file is intentionally thin. All hex values live in ONE place:

     css/colors.css  — verbatim copy of design/tokens/colors.css
                       source of truth for every hue, neutral, semantic,
                       feedback, and adult-palette variable.
     css/web.css     — verbatim copy of design/tokens/web.css
                       additive web-layer: layout, type scale, interaction,
                       cut-edge shadows, elevation.

   This file adds only three things:
     1. Radius scale (not in the design export — site-specific floor).
     2. Inferred action tokens (no literal "action-*" key in the export;
        flagged INFERRED below to match design/README.md convention).
     3. Back-compat aliases for the name mismatch between the old hand-
        transcription (--adult-*, --elevation-N, --max-content) and the
        canonical export names (--a-*, --web-e-N, --web-maxw). Component
        CSS and inline styles in HTML still use the old names; these aliases
        let them keep working without a mass rename.

   When back-compat aliases are cleaned up, delete section 3.
   ========================================================================== */

@import url('./fonts.css');
@import url('./colors.css');
@import url('./web.css');
@import url('./motion.css');

:root {

  /* -------------------------------------------------------------------------
     1. RADIUS — hard floor, site-specific
     "16px floor — nothing sharper anywhere" (design brief §1.4)
     Not in colors.css or web.css, so lives here permanently.
     ---------------------------------------------------------------------- */
  --radius-1:   16px;  /* floor — never go below this */
  --radius-2:   24px;
  --radius-3:   32px;
  --radius-4:   44px;
  --radius-pill: 999px;
  /* Semantic aliases used in yodelope.css */
  --radius-sm:  var(--radius-1);
  --radius-md:  var(--radius-2);
  --radius-lg:  var(--radius-3);


  /* -------------------------------------------------------------------------
     2. INFERRED ACTION TOKENS
     The design export has no literal "action-*" key. These are inferred from
     the design brief (§1.2: "green means go"; destructive is adult-zone-only)
     and map onto real export variables — no new hex values.
     ---------------------------------------------------------------------- */

  /* Primary CTA — leaf family (same hue as --owned, brief §1.2) */
  --action-go:              var(--leaf-700);
  --action-go-pressed:      var(--leaf-900);

  /* Neutral/secondary CTA — warm paper tones */
  --action-neutral:         var(--n-200);
  --action-neutral-pressed: var(--n-300);

  /* Destructive — adult zone only, maps to --a-danger (6.0:1 on a-surface) */
  --action-destructive:     var(--a-danger);


  /* -------------------------------------------------------------------------
     3. BACK-COMPAT ALIASES — clean up when component CSS is updated
     The old transcription used --adult-* and --neutral-N; the real export
     uses --a-* and --n-N. Until every CSS rule and HTML inline style is
     updated, these thin aliases bridge the gap.
     ---------------------------------------------------------------------- */

  /* adult palette --------------------------------------------------------- */
  --adult-surface:         var(--a-surface);
  --adult-surface-raised:  var(--a-surface-raised);
  --adult-surface-sunken:  var(--a-surface-sunken);
  --adult-border:          var(--a-border);
  --adult-text-primary:    var(--a-text-primary);
  --adult-text-secondary:  var(--a-text-secondary);
  --adult-brand-primary:   var(--a-accent);       /* olive-green, 4.8:1 on a-surface */
  --adult-accent-quiet:    var(--a-accent-quiet);
  --adult-track:           var(--a-track);

  /* adult inferred action tokens (INFERRED — same note as section 2) */
  --adult-action-go:       var(--a-accent);
  --adult-action-neutral:  var(--a-accent-quiet);

  /* elevation ------------------------------------------------------------- */
  /* Old name: --elevation-N. Real export: --web-e-N (in web.css). */
  --elevation-1: var(--web-e-1);
  --elevation-2: var(--web-e-2);
  --elevation-3: var(--web-e-3);
  --elevation-4: var(--web-e-4);

  /* layout ---------------------------------------------------------------- */
  /* Old names used in yodelope.css. Real names: --web-maxw, --web-measure. */
  --max-content:       var(--web-maxw);
  --max-content-wide:  var(--web-maxw-wide);
  --max-prose:         var(--web-measure);

}