/* ScenariGO control values: six visual families.
 *
 * Ticket: agent-reviews/Closed/2026-08-25-app-wide-button-and-interactive-control-consistency-audit.md
 * Step 2, corrected after Codex's taxonomy review (2026-08-28), R1 and R2.
 *
 * STATUS: SETTLED for the regular action-button radius, provisional elsewhere.
 * Steve decided 12px app-wide on 2026-08-28 and authorised implementation
 * across the ticket's audit scope. 12px was NOT the measured plurality - 6px
 * was - and the reason it wins anyway is recorded under "What the measurement
 * does and does not show" below.
 *
 * THIS FILE APPLIES NOTHING. It defines custom properties and no ordinary
 * declarations, so linking it into a page cannot move a pixel.
 * tests/control-tokens-contract.test.js enforces both halves of that: only
 * `:root` may appear as a selector, AND every declaration inside it must be a
 * custom property. The second half was added at Codex's R3 - the first version
 * checked selectors alone and would have accepted `:root { font-size: 12px }`,
 * which changes inherited text and every rem in the product.
 *
 * --- SIX VISUAL FAMILIES, NOT SIX BEHAVIOURS (Codex R1) ------------------
 *
 * These names describe how a control LOOKS. They are not a claim that the app
 * has only six kinds of interaction, and they compose rather than partition:
 *
 *   primary / secondary / destructive   describe action EMPHASIS
 *   compact                             describes SIZE and presentation
 *
 * so an icon-only destructive action is legitimately both. Applying a family
 * must never remove behaviour:
 *
 *   filters        may share secondary geometry, but they are not Cancel
 *                  buttons. Keep the current value, the chevron, the
 *                  expanded/selected state and the keyboard behaviour. Topics
 *                  is a disclosure; List/Tile is a compact segmented choice.
 *   badges/counts  are display-only when genuinely non-interactive. The
 *                  request-count control is CLICKABLE and stays a button
 *                  however its label looks.
 *   text link      is an appearance, not an element. The Library's "View all"
 *                  is a button that changes the displayed section and must
 *                  stay an action; real URL navigation stays an anchor. This
 *                  ticket changes no routes.
 *
 * Hierarchy must not rest on colour alone: labels, selected and expanded
 * indicators, focus-visible, and disabled/loading states are part of each
 * family, not just its dimensions.
 *
 * --- THE PILL BOUNDARY (Steve's decision, 2026-08-28) --------------------
 *
 * Ordinary action and filter buttons lose pill styling. Explicitly RETAINED:
 *   - on/off switch tracks and their circular thumbs (`.toggle-switch`), which
 *     are controls, not badges;
 *   - intentionally circular account and room controls, including their
 *     established accessible hit areas (see shared-public/account-menu.css,
 *     whose 34px circle carries a separate 44px ::after hit area).
 *
 * --- WHAT THE MEASUREMENT DOES AND DOES NOT SHOW (Codex R2) --------------
 *
 * Measured across 9 routes at 1440px, 55 rendered controls:
 *
 *   border-radius   6px x17   8px x10   50% x8    7px x6   12px x5
 *   padding-y       9.6px x24  0px x14   8.8px x10
 *   padding-x       20px x20   0px x11   6px x5   12px x5
 *   font-size       16px x21   13.6px x13   12.8px x8
 *   font-weight     400 x30    600 x10   700 x8
 *   border-width    1px x41    0px x14
 *   height          41px x15   34px x8   36px x7   42px x5
 *
 * An earlier version of this file read `16px x21` and `400 x30` as browser
 * defaults, and concluded a third of these controls were "never styled". THAT
 * WAS WRONG. Both public/styles.css and author-public/styles.css style the base
 * element explicitly:
 *
 *   button { font: inherit; padding: 0.6rem 1.25rem; border-radius: 6px;
 *            border: 1px solid var(--accent); background: var(--accent); }
 *
 * `font: inherit` is an authored decision, so 16px/400 is the page's own type
 * deliberately adopted, not an absence of styling. A computed value never
 * proves author intent.
 *
 * That correction has a consequence worth stating: 6px, 9.6px and 20px are
 * largely THIS ONE BASE RULE showing through, not independent convergence
 * across many components. The plurality is real; it is evidence of a default,
 * not of a consensus.
 *
 * It also means the per-property modes DO NOT COMBINE into a control that
 * exists. Measured directly on a real 41px control:
 *
 *   font-size 16px, line-height normal (a ~19.8px line box at this font),
 *   padding 9.6px x2 = 19.2, border 1px x2 = 2   ->  ~41px
 *
 * The base rule's padding pairs with the INHERITED 16px font. The 0.85rem/600
 * below comes from component overrides, which pair with their own padding. A
 * control built from both would be about 38px, matching nothing currently
 * rendered. So "these values move the fewest controls" is NOT established, and
 * is not claimed. They are a starting point for one surface, to be judged by
 * looking at it.
 */

:root {
  /* 12px, Steve's decision (2026-08-28), NOT the measured 6px plurality.
     6px is what the base `button` rule sets, so it was the most common value by
     a wide margin. But the Scenario Library - the surface Steve photographed and
     approved - deliberately overrides it to 12px on all three of its primaries,
     and so does .briefing-cta in the rooms. Taking 6px would have "harmonised"
     the approved screens toward a default they had each already rejected. The
     mapping that surfaced this is in the ticket. */
  --sg-control-radius: 12px;
  --sg-control-padding-y: 0.6rem;
  --sg-control-padding-x: 1.25rem;
  --sg-control-font-size: 0.85rem;
  --sg-control-font-weight: 600;
  --sg-control-border-width: 1px;
  /* 0.45rem is exactly 7.2px at a 16px root. An earlier comment claimed it sat
     "between" the measured 7.2px and 9.6px; it does not, it is the smaller of
     the two. Corrected per Codex R2. */
  --sg-control-gap: 0.45rem;

  /* FLOORS, never fixed heights: a control must be free to grow when its label
     wraps, which the 200%-text work depends on. */
  --sg-control-min-height: 40px;
  /* Recorded from the adaptive mobile programme rather than invented here. It
     applies in BOTH axes for a touch target, and adopting it must never shrink
     a larger intentional control or an existing hit area. */
  --sg-control-min-height-touch: 44px;

  /* Compact icon: square, space-constrained, label-free. 36px is a VISUAL size
     and is explicitly not permission for a 36px touch target: a compact control
     still needs the 44px coarse-pointer target above, by box or by hit area. */
  --sg-control-compact-size: 36px;
  /* 8px, proportional rather than arbitrary: 12px on a 41px control is ~29% of
     its height, and ~29% of a 28px compact control is ~8px. The compact family
     currently renders at 7px, so this is a 1px move that gives the app one
     compact radius instead of 7px and 8px both existing. A compact control must
     NOT take the 12px action radius - at 26x26 that reads as a pill, which the
     pill boundary forbids for anything clickable. */
  --sg-control-compact-radius: 8px;

  /* Text link: no box by design, so that navigation stops being drawn as a
     button. Appearance only - it does not decide the element. */
  --sg-control-link-font-size: 0.85rem;
  --sg-control-link-font-weight: 600;

  /* Display, NOT a control. Reserved for genuinely non-interactive status
     badges and counts. Switch tracks and circular identity controls keep their
     own shapes under the pill boundary above; they are not covered by this. */
  --sg-badge-radius: 999px;
}