/* ═══════════════════════════════════════════════════════════════
   VERSE — dense / compact context via [verse] attribute.

   The third typographic register, sibling to [prose]. Where [prose]
   shifts everything UP (long-form, generous), [verse] shifts everything
   DOWN — tighter inset/gap, smaller controls, smaller type — for dense
   product surfaces (inspectors, data tables, toolbars, side rails).

     <aside verse>...</aside>              — md (default)
     <div verse size="sm">...</div>        — extra-compact
     <section verse size="lg">...</section> — relaxed-compact

   Scale relationship (at density=1, --a-gap-k=1):
     register   inset sm/md/lg   gap sm/md/lg   body sm/md/lg
     verse        10 / 12 / 14    10 / 12 / 14    11 / 12 / 13
     regular      14 / 16 / 18    10 / 12 / 14    14 / 15 / 16
     prose        32 / 40 / 48    16 / 20 / 24    14 / 16 / 18

   TYPE SHIFTS WITH [size] (unlike [prose], which pins type at -md):
   verse redefines the sm/md/lg type VALUES; the `-size` pointers are
   re-declared under [verse]:not([size]) so a BARE verse resolves verse's
   own md value (a pointer left at :root would resolve the BASE value —
   custom props compute at their declaration site). The global [size]
   rules then shift the pointer on [size]-bearing elements, resolving
   verse's sm/lg values. Control-size (--a-size) needs explicit tier rules
   because the global [size] rules set it to hardcoded base values, not via
   --a-size-*.

   NOTE: type sizes below the spacing anchors (body 11/12/13, control
   20/24/28) are DEDUCED — proposed compact scale, tune to taste.
   ═══════════════════════════════════════════════════════════════ */

/* `context` layer (ADR-0038 step 7) — sits above utilities+components. */
@layer context {
  [verse] {
    /* ── Inset — tighter than regular ── */
    --a-inset-sm: var(--a-space-2-5); /* 10px */
    --a-inset-md: var(--a-space-3);   /* 12px */
    --a-inset-lg: var(--a-space-3-5); /* 14px */
    --a-inset: var(--a-inset-md);

    /* ── Gaps — parametric (value × --a-gap-k); k=1 = base value. ── */
    --a-gap-xs: calc(var(--a-space-2)   * var(--a-gap-k)); /*  8px @k=1 */
    --a-gap-sm: calc(var(--a-space-2-5) * var(--a-gap-k)); /* 10px @k=1 */
    --a-gap-md: calc(var(--a-space-3)   * var(--a-gap-k)); /* 12px @k=1 */
    --a-gap-lg: calc(var(--a-space-3-5) * var(--a-gap-k)); /* 14px @k=1 */
    --a-gap-xl: calc(var(--a-space-4)   * var(--a-gap-k)); /* 16px @k=1 */
    --a-gap: var(--a-gap-md);

    /* ── Radius — verse register: tighter bounds (max 16px). Re-declares the
       clamps so they resolve verse's min/max (base clamps compute at :root). ── */
    --a-radius-min: 0.25rem; /* 4px */
    --a-radius-max: 0.75rem;    /* 12px */
    --a-radius-xs: clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));
    --a-radius-sm: clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));
    --a-radius-md: clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));
    --a-radius-lg: clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));
    --a-radius: var(--a-radius-md);

    /* ── Control sizing — smaller (explicit tier rules below) ── */
    --a-size-sm: calc(var(--a-density) * 1.250rem); /* 20px */
    --a-size-md: calc(var(--a-density) * 1.500rem); /* 24px */
    --a-size-lg: calc(var(--a-density) * 1.750rem); /* 28px */
    --a-size: var(--a-size-md);

    /* ── Icon / caret — shifted down one tier so chrome tracks verse's
       smaller type + controls. The select/combobox caret is an <icon-ui>
       reading --a-icon-size; CSS-drawn carets (calendar / nav-group / pane)
       read --a-caret-size — both shrink here. Bumped +1 tier (0.7.9 control
       bump) to track the larger 20/24/28 controls: md = 16/14, lg = 18/16,
       sm = 14/12. Like --a-size, these
       need explicit [size] tier rules below: the global [size] icon/caret
       rules live in the utilities layer, which `context` shadows. ── */
    --a-icon-size: 16px;
    --a-caret-size: 14px;

    /* ── Toggle (check / radio / switch) chrome — one tier down like inset +
       --a-size, on clean space rungs. Bumped +1 tier with the 0.7.9 control
       bump → verse toggle 16/20/24 (= --a-space-4/5/6). The explicit [size]
       tier rules below are REQUIRED for the same reason --a-size needs them:
       this context-layer base value pins the token, so the lower-layer global
       [size] --a-toggle-size rules can't reach a verse subtree on their own. ── */
    --a-toggle-size: var(--a-space-5); /* 20px @d=1 — md (bumped +1 tier, 0.7.9) */

    /* ── Typography — compact register (deduced; static, no fluid clamps;
       floored at 10px). VALUES only — pointers live under :not([size]). ── */
    --a-display-sm: 18px;    --a-display-md: 23px;    --a-display-lg: 29px;
    --a-title-sm: 16px;      --a-title-md: 19px;      --a-title-lg: 22px;
    --a-heading-sm: 13px;    --a-heading-md: 14px;    --a-heading-lg: 15px;
    --a-section-sm: 13px;    --a-section-md: 14px;    --a-section-lg: 16px;
    --a-subsection-sm: 12px; --a-subsection-md: 13px; --a-subsection-lg: 14px;
    --a-body-sm: 11px;       --a-body-md: 12px;       --a-body-lg: 13px;
    --a-deck-sm: 14px;       --a-deck-md: 15px;       --a-deck-lg: 16px;
    --a-caption-sm: 10px;    --a-caption-md: 11px;    --a-caption-lg: 12px;
    --a-kicker-sm: 10px;     --a-kicker-md: 10px;     --a-kicker-lg: 11px;
    --a-label-sm: 10px;      --a-label-md: 10px;      --a-label-lg: 11px;
    --a-metric-sm: 19px;     --a-metric-md: 25px;     --a-metric-lg: 34px;
    --a-code-sm: 11px;       --a-code-md: 12px;       --a-code-lg: 13px;

    /* ── UI control text ── */
    --a-ui-px: var(--a-space-2);
    --a-ui-py: var(--a-space-1);
    --a-ui-sm: 11px;         --a-ui-md: 12px;         --a-ui-lg: 13px;
  }

  /* Bare-verse default tier — re-declares the `-size` pointers ON the verse
     element so they resolve verse's values (base :root pointers would resolve
     base values). Mirrors the base default-tier convention: announce/divide
     roles → -sm, text/data roles → -md. The global [size] rules override these
     on [size]-bearing elements (resolving verse's sm/lg token values). */
  [verse]:not([size]) {
    --a-display-size: var(--a-display-md);
    --a-title-size: var(--a-title-md);
    --a-heading-size: var(--a-heading-md);
    --a-section-size: var(--a-section-md);
    --a-subsection-size: var(--a-subsection-md);
    --a-body-size: var(--a-body-md);
    --a-deck-size: var(--a-deck-md);
    --a-caption-size: var(--a-caption-md);
    --a-kicker-size: var(--a-kicker-md);
    --a-label-size: var(--a-label-md);
    --a-metric-size: var(--a-metric-md);
    --a-code-size: var(--a-code-md);
    --a-ui-size: var(--a-ui-md);
  }

  /* Tier shifts — inset/gap/control-size (typography shifts via global [size],
     which resolves verse's token values). Mirrors the [prose] tier pattern. */
  [verse][size="lg"],
  [verse] [size="lg"] {
    --a-inset: var(--a-inset-lg);
    --a-gap: var(--a-gap-lg);
    --a-size: var(--a-size-lg);
    --a-icon-size: 18px;
    --a-caret-size: 16px;
    --a-toggle-size: var(--a-space-6); /* 24px @d=1 — lg (bumped +1 tier) */
  }
  [verse][size="sm"],
  [verse] [size="sm"] {
    --a-inset: var(--a-inset-sm);
    --a-gap: var(--a-gap-sm);
    --a-size: var(--a-size-sm);
    --a-icon-size: 14px;
    --a-caret-size: 12px;
    --a-toggle-size: var(--a-space-4); /* 16px @d=1 — sm (bumped +1 tier) */
  }
}
