/* ========================================================================== s37-a11y.css — exp38 MARKUP-cluster sheet (name kept from exp37, where it was introduced). Loaded LAST in , after s35-a11y.css. Carries the accessibility half of the approved critique fix list. Colour is token-only; no new palette entries; tracking, uppercase and case discipline are left as shipped. Contents 1. Metadata Floor — nothing renders under 12px 2. h3 promotion — pin margins/line-height the old span/p never declared 3. Tap targets — .cta-quiet hit area ~44px without moving pixels 4. Defect ledger — 4-up reuse of the ev-nums stat pattern in #evidence 5. Content supports— #how instruments sub-line, caption .t emphasis, em-chain guard for code inside .ev-cap Floor audit method: every selector below shipped with font-size between .60–.74rem or 8.5–11.9px in assets/*.css on sheets this page loads. Deliberately NOT overridden: dev chrome (.hud-btn — the ?dev=1 theme pill / field HUD; tooling, not page), exp33's empty-mount debug label (renders only on an unfilled mount), and themes that set no sub-12px text. ========================================================================== */ /* -------------------------------------------------------------------------- 1. METADATA FLOOR RULE (DESIGN.md founder item 14). Raise every sub-floor size to the 0.75rem / 12px floor. Selectors mirror the originals exactly so cascade order (this sheet last) does the rest; media-scoped originals are beaten by specificity + document order. -------------------------------------------------------------------------- */ /* --- shell: site.css --- */ .kicker, .fine, .facts, .tile-n, .frame-cap, .rail-beat, .legend, .row .kicker, .stop-week, .lead-form label, .form-note, .foot-line { font-size: .75rem; } /* figure system: SVG text sizes are user units */ .fig text, .stage .lbl { font-size: 12px; } .fig .lbl { font-size: 12px; } .fig-hero text { font-size: 12px; } .fig-hero .lbl { font-size: 12px; } /* --- themes.css --- */ html[data-theme="olo"] .olo-note { font-size: .75rem; } /* --- evidence.css (upstream chassis) --- */ .ev-head span, .ev-miss-k { font-size: .75rem; } .ev-cap { font-size: .75rem; } .cl-sig { font-size: .75rem; } /* --- sections.css (agents session chrome) --- */ .sx-tag, .sx-win-t, .sx-win-p, .sx-count, .sx-of, .sx-chip, .sx-lab, .sx-code pre, .sx-ok, .sx-cap { font-size: .75rem; } .sx-inv .lbl, .sx-inv .sx-mob .big, .sx-inv .sx-mob .lbl, .sx-arch text, .sx-arch .lbl { font-size: 12px; } /* --- exp33.css remnants still mounted on index --- */ .hero-cue, .ev-band-lab, .lp-deliver .col-h, .lp-offer { font-size: .75rem; } /* --- graph-sections.css (#intent / #requirement figures) --- */ .gs-state, .gs-flab, .gs-card-f, .gs-rel-h, .gs-rk, .gs-panel-h, .gs-panel-sub { font-size: .75rem; } .fig .gs-fn { font-size: 12px; } .fig .gs-leaf { font-size: 12px; } .fig .lbl.gs-rel { font-size: 12px; } .fig .lbl.gs-det { font-size: 12px; } .fig .lbl.gs-row { font-size: 12px; } .gs-hint { font-size: .75rem; } .gs-read-h { font-size: .75rem; } /* --- herograph.css / hdr-event.css (hero instrument labels) --- */ .hg-ed b { font-size: 12px; } .hg-hdr text { font-size: 12px; } /* --- agent-sections.css + s35-agents.css (#queue and neighbours) --- */ .ag-tag, .ag-bar-s b, .ag-replay, .ag-log li, .ag-cwd, .ag-who, .ag-from, .ag-h, .ag-known-sub, .ag-meta, .ag-col-h, .ag-tid, .ag-tsub, .ag-cmp-cap, .s35-descent .n, .s35-loop .n, .s35-arrives, .s35-eg-t { font-size: .75rem; } .ag .fig .ags { font-size: 12px; } .ag .fig .agb { font-size: 12px; } /* --- hero-v2.css --- */ .hero-mach { font-size: 12px; } .pctl-key, .pctl-play.vid-degraded .pctl-key::before { font-size: .75rem; } .hero33 .facts { font-size: .75rem; } /* --- s35-requirement.css --- */ /* .rq-state re-declares the chip size (.68rem) over .gs-state (.63rem) on the same element; both names are floored so the cascade cannot keep the smaller one. */ .rq-state, .rq-lab, .rq-chip { font-size: .75rem; } /* --- s35-changes.css --- */ .cl-fan-cap, .cl-fan-k, .cl-ok, .cl-klab, .cl-lab, .cl-trust-lab, .cl-in, .cl-out, .cl-fan-m, .cl-state, .cl-eg-t { font-size: .75rem; } /* --- s35-stale.css --- */ .s5-rec p, .s5-eg-t { font-size: .75rem; } .ag .fig .s5-hd { font-size: 12px; } .ag .fig .s5-word { font-size: 12px; } /* --- s35-compound.css --- */ .cp .fig .cpd, .cp .fig .cpl, .cp .fig .cpn { font-size: 12px; } /* --- s35-evidence.css (#evidence ids outrank plain classes) --- */ #evidence .rx-tag, #evidence .rx-stage, #evidence .rx-flag, #evidence .rx-art, #evidence .rx-nums-note, #evidence .rx-src { font-size: .75rem; } /* --- s35-delivery.css (#how rail + #delivery docket) --- */ .s35h-n, .s35h-tech-lab, .s35d-tag, .s35d-lab { font-size: .75rem; } .s35h-loop text { font-size: 12px; } /* --- video.css (the Watch Proof work modal) --- */ .vid-ttl, .vid-skip, .vt, .vt-desc, .vt-cap, .vt-env, .vt-meta, .vid-note { font-size: .75rem; } /* -------------------------------------------------------------------------- 2. H3 PROMOTION NORMALIZATION. The promoted titles keep their own classes (which declare family, size, weight, letter-spacing). Where those classes never declared margin or line-height, the UA

defaults would leak in and shift layout, so pin them here. Classes that already declare margin/line-height (.rx-stage, .s35h-t, .s35d-title, .ag-col-h margin, .kicker margin) need no rule. -------------------------------------------------------------------------- */ .gs-card-id, .cl-id { margin: 0; line-height: inherit; } .ag-col-h { line-height: inherit; } /* -------------------------------------------------------------------------- 3. TAP TARGETS for quiet CTAs. .cta-quiet rests at ~13px tall (mono .8rem + 2px padding + hairline). An absolutely-positioned pseudo-element extends the hit box to ~44px without moving the underline, the row rhythm, or any resting pixel: padding would have dragged the border-bottom off its baseline. Shared-row de-confliction. Where quiet links share a flex row container, that halo lets neighbouring hit boxes cross when the row wraps or stacks: the #intent .link-row breaks onto two lines with a .6rem row gap, and the #evidence ask row (.ev-links) stacks one-per-line at small widths with a .9rem gap (#evidence .rx-links re-asserts it over evidence.css's column rule). A tap landing in a crossing could fire either neighbour. On those shared rows only, the side inset drops to 0 and the vertical extension is clamped just under half the smallest gap so two hit boxes can never intersect; single-link containers keep the full halo. -------------------------------------------------------------------------- */ .cta-quiet { position: relative; } .cta-quiet::after { content: ""; position: absolute; inset: -0.9rem -0.55rem; /* ~14px above/below, ~9px each side */ } .link-row .cta-quiet::after { inset: -0.25rem 0; } /* link-row wraps at a .6rem row gap */ .ev-links .cta-quiet::after { inset: -0.4rem 0; } /* ask row stacks at a .9rem gap */ /* -------------------------------------------------------------------------- 4. DEFECT LEDGER FIGURE (#evidence, replaces the reconciliation prose). Reuses ONLY the section's stat-numeral vocabulary (.ev-nums / .ev-cell / .ev-num / .ev-num-lab / .fig-cap): four cells instead of three, numerals stepped down so the docket reads secondary to the 123 trio above it. -------------------------------------------------------------------------- */ #evidence .ev-ledger { margin-top: clamp(1.4rem, 2.6vw, 2rem); } #evidence .ev-ledger .ev-nums { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1.2rem, 2vw, 1.6rem) clamp(1.4rem, 2.6vw, 2.4rem); border: 0; margin: 0; } #evidence .ev-ledger .ev-cell { padding: 0; } #evidence .ev-ledger .ev-num { font-size: clamp(2.4rem, 4.8vw, 3.6rem); } @media (max-width: 900px) { #evidence .ev-ledger .ev-nums { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 640px) { /* outlasts the upstream 1-column override for #evidence .ev-nums */ #evidence .ev-ledger .ev-nums { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem 1.2rem; } #evidence .ev-ledger .ev-num { font-size: clamp(2.1rem, 8.5vw, 2.7rem); } } /* -------------------------------------------------------------------------- 5. CONTENT SUPPORTS added by this cluster. -------------------------------------------------------------------------- */ /* #how instruments anchor: mono sub-line naming what the tools are, muted and smaller than the row it glosses. Machine-layer voice. */ .s35h-tech-sub { margin: -0.15rem 0 0.55rem; font-family: var(--mono); font-size: .75rem; line-height: 1.6; letter-spacing: .02em; color: var(--muted); } /* Fig-number emphasis inside captions whose sheets predate the .t device */ .cl-fan-cap .t, .sx-cap .t { color: var(--ink); font-weight: 600; } /* em-chain guard: global code{font-size:.9em} would leave ~10.8px inside the now-floored .ev-cap line. Everything else carrying is prose. */ .ev-cap code { font-size: .75rem; } /* -------------------------------------------------------------------------- 6. SKIP-LINK HOVER/FOCUS CONTRAST. The skip link is an ink plate (site.css .skip: background --ink, label --paper). The generic `a:hover` — and terminal's own glowing a:hover — repaint the label --signal while the plate stays ink: measured 2.4:1 on paper (#2337E0 on #14130F) and 1.1:1 on terminal (#FFFFFF on #D2FFE2). The plate already announces the state; the label stays --paper on every theme (17:1 paper, 18:1 terminal). `html` prefix out-ranks the theme hover rule at equal specificity because this sheet loads last. -------------------------------------------------------------------------- */ html a.skip:hover, html a.skip:focus { color: var(--paper); text-shadow: none; }