/* CSS rules M0 (2026-11-06): the scale. Spec docs/superpowers/specs/2026-11-06-css-consistency-design.md, section 3;
   rules in docs/FRAMEWORK.md, "CSS rules".

   Steps carry their value in their name (--sp-14 is 14px). Each is a value the CSS used at least three times
   on 2026-11-06 (php scripts/check-css.php --values); 1rem is 10px here (html is 62.5%). A value used less often
   stays where it is, as a --x- exception in its component.

   Roles say what a value is for. Each role is an alias of what decides that value today, so using it changes
   nothing. Text roles already exist and are not redefined here: --fs-body, --fs-body-small, --fs-body-large,
   --fs-h1 … --fs-h6 (elements/typography.css, overridden in bones-look/01-foundation.css). The control, card
   and other section roles are added when those rules move (plan M1 and M2), from the values they use then. */

:root {
  /* Spacing steps */
  --sp-1: 1px;
  --sp-2: 2px;
  --sp-2-5: 2.5px;
  --sp-3: 3px;
  --sp-4: 4px;
  --sp-5: 5px;
  --sp-6: 6px;
  --sp-7: 7px;
  --sp-8: 8px;
  --sp-9: 9px;
  --sp-10: 10px;
  --sp-11: 11px;
  --sp-12: 12px;
  --sp-13: 13px;
  --sp-14: 14px;
  --sp-15: 15px;
  --sp-16: 16px;
  --sp-17: 17px;
  --sp-18: 18px;
  --sp-20: 20px;
  --sp-22: 22px;
  --sp-24: 24px;
  --sp-25: 25px;
  --sp-26: 26px;
  --sp-28: 28px;
  --sp-29: 29px;
  --sp-30: 30px;
  --sp-32: 32px;
  --sp-33: 33px;
  --sp-34: 34px;
  --sp-36: 36px;
  --sp-40: 40px;
  --sp-42: 42px;
  --sp-44: 44px;
  --sp-48: 48px;
  --sp-50: 50px;
  --sp-52: 52px;
  --sp-56: 56px;
  --sp-60: 60px;
  --sp-61: 61px;
  --sp-64: 64px;
  --sp-67: 67px;
  --sp-70: 70px;
  --sp-72: 72px;
  --sp-80: 80px;
  --sp-88: 88px;
  --sp-90: 90px;
  --sp-96: 96px;
  --sp-112: 112px;
  --sp-120: 120px;
  --sp-176: 176px;

  /* Font-size steps */
  --fs-9: 9px;
  --fs-10: 10px;
  --fs-10-5: 10.5px;
  --fs-11: 11px;
  --fs-11-5: 11.5px;
  --fs-12: 12px;
  --fs-12-5: 12.5px;
  --fs-13: 13px;
  --fs-13-5: 13.5px;
  --fs-14: 14px;
  --fs-14-5: 14.5px;
  --fs-15: 15px;
  --fs-15-5: 15.5px;
  --fs-16: 16px;
  --fs-16-5: 16.5px;
  --fs-17: 17px;
  --fs-17-5: 17.5px;
  --fs-18: 18px;
  --fs-19: 19px;
  --fs-20: 20px;
  --fs-21: 21px;
  --fs-22: 22px;
  --fs-23: 23px;
  --fs-24: 24px;
  --fs-26: 26px;
  --fs-28: 28px;
  --fs-30: 30px;
  --fs-32: 32px;
  --fs-34: 34px;
  --fs-36: 36px;
  --fs-40: 40px;
  --fs-42: 42px;
  --fs-44: 44px;
  --fs-46: 46px;
  --fs-48: 48px;
  --fs-50: 50px;
  --fs-56: 56px;
  --fs-58: 58px;
  --fs-64: 64px;
  --fs-68: 68px;
  --fs-70: 70px;
  --fs-76: 76px;
  --fs-80: 80px;
  --fs-82: 82px;
  --fs-88: 88px;
  --fs-120: 120px;

  /* Corner steps */
  --r-2: 2px;
  --r-3: 3px;
  --r-4: 4px;
  --r-5: 5px;
  --r-6: 6px;
  --r-7: 7px;
  --r-8: 8px;
  --r-9: 9px;
  --r-10: 10px;
  --r-12: 12px;
  --r-14: 14px;
  --r-16: 16px;
  --r-18: 18px;
  --r-20: 20px;
  --r-22: 22px;
  --r-24: 24px;
  --r-28: 28px;
  --r-42: 42px;
  --r-99: 99px;
  --r-pill: 999px;
  --r-round: 50%;

  /* Roles */
  --section-y: var(--bl-gap); /* top and bottom of a default section: .db-section.padding-default sets --db-section-pb from --bl-gap (bones-look/01-foundation.css) */

  /* Smooth roles (Responsive Task 6, 2026-11-06): size at 375px -> size at 1600px, from php scripts/fluid.php;
     ends measured in docs/superpowers/plans/2026-11-06-role-ends.md. Not used yet: the per-component passes
     and Task 8 switch rules to them. --fs-h1 … --fs-h4, --fs-body and --section-y keep their names and move to
     the measured ends in Task 8. */
  --fs-small: clamp(14px, 13.694px + 0.082vw, 15px);
  --fs-lead: 18px;
  --section-y-tight: clamp(72px, 59.755px + 3.265vw, 112px);
  --section-y-hero: clamp(40px, 30.204px + 2.612vw, 72px);
  --gutter: clamp(16px, 11.102px + 1.306vw, 32px);
}