/* ════════════════════════════════════════════════════════════════
   SuperCat Design System — Radius tokens
   ────────────────────────────────────────────────────────────────
   Two-tier scale:

     Sub-control       xs / sm        2–4 px — chips, indicators,
                                      internal sub-buttons
     ★ Interactive    md  (8 px)     BENCHMARK — buttons, inputs,
                                      every keyboard-focusable control
     Surface           lg / xl        12–16 px — cards, panels,
                                      modals, popovers
     Display           2xl / 3xl      20–28 px — hero panels, decks
     Continuous        pill / full    999 px — switch tracks, status
                                      chips, fully-rounded objects

   Component contract:
     • Anything you can click that isn't a tag → --radius-md
     • Cards / surfaces containing controls    → --radius-lg
     • Modals / large panels                   → --radius-xl
     • Pills (switches, status) and circles    → --radius-pill / -full
   ════════════════════════════════════════════════════════════════ */

:root {
  --radius-none:  0;
  --radius-xs:    2px;     /* checkbox chip, tiny ticks */
  --radius-sm:    4px;     /* sub-buttons, internal chips */
  --radius-md:    8px;     /* ★ buttons, inputs, selects — the benchmark */
  --radius-lg:    12px;    /* cards, tiles, popovers */
  --radius-xl:    16px;    /* modals, large panels */
  --radius-2xl:   20px;    /* hero panels */
  --radius-3xl:   28px;    /* deck-scale containers */
  --radius-pill:  999px;
  --radius-full:  9999px;
}