/* ═══════════════════════════════════════════════════════════════════════════
   ARETÉ — THE SYSTEM (Phase 2, 2026-08-30)
   Tokens, primitives and the five-destination shell. Loaded AFTER arete.css so
   it re-bases the ground the old components sit on without rewriting them.
   Identity source: areteprotocol.com translated, not copied — navy ground with
   falloff, one restrained cyan used as light, Syne for structure, Cormorant
   italic for the one phrase that matters, Manrope for everything read.
   Rules honoured: three typefaces only (no fourth font), no second framework,
   no warm colour, no label under 12px, provenance is a component.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1. TOKENS ─────────────────────────────────────────────────────────── */
/* Tokens moved to css/tokens.css (Stage 0 item 1, 2026-09-14) — one source of truth. */
/* Tokens moved to css/tokens.css (Stage 0 item 1, 2026-09-14) — one source of truth. */

/* ── 2. GROUND ─────────────────────────────────────────────────────────── */
html,body{ background:var(--s0); }
body, body.font-sans, .font-sans{ font-family:var(--f-body) !important; }
body{
  font-family:var(--f-body); font-size:var(--t-body); line-height:1.55;
  background-image:radial-gradient(120% 70% at 50% -10%, #001F3F 0%, var(--s0) 62%);
  background-attachment:fixed;
}
html[data-theme="light"] body{ background-image:radial-gradient(120% 70% at 50% -10%, #ffffff 0%, var(--s0) 60%); }
/* the starfield, aurora and sheen retire: depth comes from tone, one object may move, nothing twinkles */
#webgl-bg, .aurora, .sheen::after{ display:none !important; }
body.webgl-on .aurora{ display:none !important; }
.cis-live{ text-shadow:none !important; }

/* ── 3. TYPE ───────────────────────────────────────────────────────────── */
#page-title{ font-family:var(--f-disp) !important; font-weight:600 !important; font-size:20px !important; letter-spacing:-.01em !important;
  background:none !important; -webkit-text-fill-color:currentColor !important; color:rgb(var(--ink)) !important; }
.ui-display{ font-family:var(--f-body); font-weight:400; font-size:var(--t-display); line-height:.92; letter-spacing:-.04em;
  font-variant-numeric:tabular-nums; color:rgb(var(--ink)); }
.ui-title{ font-family:var(--f-disp); font-weight:600; font-size:var(--t-title); line-height:1.12; letter-spacing:-.015em; color:rgb(var(--ink)); text-wrap:balance; margin:0; }
.ui-section{ font-family:var(--f-disp); font-weight:500; font-size:var(--t-section); line-height:1.25; color:rgb(var(--ink)); margin:0; }
.ui-body{ font-size:var(--t-body); color:rgb(var(--ink2)); max-width:64ch; }
.ui-support{ font-size:var(--t-support); color:rgb(var(--ink3)); }
.ui-meta{ font-family:var(--f-meta); font-size:var(--t-meta); letter-spacing:.06em; color:rgb(var(--ink3)); }
.ui-label{ font-family:var(--f-meta); font-size:var(--t-meta); letter-spacing:.02em; text-transform:none; color:rgb(var(--ink3)); }
.ui-em{ font-family:var(--f-em); font-style:italic; font-weight:500; font-size:1.12em; color:var(--ice2); }
.ui-num{ font-variant-numeric:tabular-nums; }

/* ── 4. SURFACES ───────────────────────────────────────────────────────── */
.ui-panel{ background:var(--s1); border:1px solid var(--hair); border-radius:var(--r-2); }
.ui-raised{ background:var(--s2); border:1px solid var(--hair2); border-radius:var(--r-2); }
.ui-glass{ background:rgba(0,31,63,0.72); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); border:1px solid var(--hair2); border-radius:var(--r-2); }
html[data-theme="light"] .ui-glass{ background:rgba(255,255,255,0.78); }
.ui-hair{ border:0; border-top:1px solid var(--hair); margin:0; }
/* re-base the legacy card family onto navy so untouched views stop reading obsidian */
.card,.card-hero{
  background:linear-gradient(150deg,rgba(0,191,255,.028),rgba(10,122,205,.018) 60%,transparent) !important;
  border:1px solid rgba(160,225,255,.13) !important;
  box-shadow:0 30px 70px -50px rgba(18,64,184,.7) !important;
  border-radius:16px !important; }
html[data-theme="light"] .card, html[data-theme="light"] .card-hero{
  background:linear-gradient(150deg,rgba(255,255,255,.72),rgba(255,255,255,.55)) !important;
  border-color:rgba(15,40,70,.14) !important; box-shadow:inset 0 1px 0 #fff,0 30px 70px -46px rgba(18,64,184,.30) !important; }
.glass{ background:rgba(0,31,63,0.82) !important; border-color:var(--hair) !important; }
html[data-theme="light"] .glass{ background:rgba(255,255,255,0.86) !important; }

/* ── 5. SECTION HEADER ─────────────────────────────────────────────────── */
.ui-head{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--sp-4); margin:0 0 var(--sp-4); }
.ui-head .ui-label::before{ display:none; }

/* ── 6. VALUE DISPLAY ──────────────────────────────────────────────────── */
.ui-value{ display:flex; align-items:baseline; gap:var(--sp-3); }
.ui-value .ui-display{ color:var(--ice); }
.ui-value .ui-of{ font-family:var(--f-meta); font-size:16px; color:rgb(var(--ink3)); letter-spacing:.08em; }
.ui-delta{ font-family:var(--f-meta); font-size:var(--t-support); color:rgb(var(--ink2)); letter-spacing:.04em; }

/* ── 7. STATE CHIP ─────────────────────────────────────────────────────── */
.ui-chip{ display:inline-flex; align-items:center; gap:8px; height:26px; padding:0 10px; border-radius:var(--r-1);
  font-family:var(--f-meta); font-size:var(--t-meta); letter-spacing:.14em; text-transform:uppercase;
  border:1px solid var(--hair2); color:rgb(var(--ink2)); background:transparent; white-space:nowrap; }
.ui-chip::before{ content:''; width:6px; height:6px; border-radius:50%; background:currentColor; }
.ui-chip[data-state="nominal"]{ color:var(--st-nominal); border-color:var(--st-nominal); }
.ui-chip[data-state="caution"]{ color:var(--st-caution); border-color:var(--st-caution); }
.ui-chip[data-state="degraded"]{ color:var(--st-degraded); border-color:var(--st-degraded); }
.ui-chip[data-state="critical"]{ color:var(--st-critical); border-color:var(--st-critical); background:rgba(169,201,234,0.08); }
.ui-chip[data-state="critical"]::before{ box-shadow:0 0 0 3px rgba(169,201,234,0.18); }
.ui-chip[data-state="confirmed"]{ color:var(--st-confirmed); border-color:var(--hair2); }
.ui-chip[data-state="confirmed"]::before{ border-radius:0; transform:rotate(45deg); width:5px; height:5px; }
.ui-chip[data-state="unresolved"]{ color:var(--st-unresolved); border-style:dashed; }
.ui-chip[data-state="unresolved"]::before{ background:transparent; border:1px solid currentColor; }

/* ── 8. PROVENANCE — a first-class primitive. Form differs, not only colour:
       measured = solid mark · self-reported = ring · derived = half · composed/estimated = dotted,
       so a composed estimate can never pass for a direct measurement. ──── */
.ui-prov{ display:inline-flex; align-items:center; gap:7px; font-family:var(--f-meta); font-size:var(--t-meta); letter-spacing:.10em;
  text-transform:uppercase; color:var(--pv-composed); white-space:nowrap; }
.ui-prov::before{ content:''; width:8px; height:8px; border-radius:50%; box-sizing:border-box; border:1px solid currentColor; }
.ui-prov[data-prov="measured"]{ color:var(--pv-measured); }
.ui-prov[data-prov="measured"]::before{ background:currentColor; }
.ui-prov[data-prov="self"]{ color:var(--pv-self); }
.ui-prov[data-prov="derived"]{ color:var(--pv-derived); }
.ui-prov[data-prov="derived"]::before{ background:linear-gradient(90deg,currentColor 50%,transparent 50%); }
.ui-prov[data-prov="composed"],.ui-prov[data-prov="estimated"]{ color:var(--pv-composed); }
.ui-prov[data-prov="composed"]::before,.ui-prov[data-prov="estimated"]::before{ border-style:dotted; border-width:1.5px; }
.ui-prov[data-prov="unknown"]{ color:rgb(var(--ink3)); }
.ui-prov[data-prov="unknown"]::before{ border-style:dashed; }

/* ── 9. BUTTONS — one language, four kinds, all from the validated Intercept ── */
.ui-btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:44px; padding:0 8px; border-radius:8px;
  font-family:var(--f-body); font-weight:500; font-size:14px; line-height:1; cursor:pointer; text-decoration:none; letter-spacing:0; text-transform:none;
  border:0; color:rgb(var(--ink2)); background:transparent; transition:color var(--dur-1); }
.ui-btn:hover{ color:rgb(var(--ink)); }
.ui-btn:active{ opacity:.7; }
.ui-btn:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; }
.ui-btn--pill{ padding:0 16px; border-radius:var(--r-pill); border:1px solid rgba(160,225,255,.26); background:rgba(140,220,255,.05); color:rgb(var(--ink)); }
.ui-btn--pill:hover{ color:rgb(var(--ink)); background:rgba(140,220,255,.12); }
.ui-disc{ width:44px; height:44px; padding:0; border-radius:50%; display:inline-grid; place-items:center; cursor:pointer; flex:none;
  border:1px solid rgba(160,225,255,.26); background:rgba(140,220,255,.05); color:rgb(var(--ink2));
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:inset 0 1px 0 rgba(255,255,255,.12); transition:background var(--dur-1),color var(--dur-1); }
.ui-disc:hover{ background:rgba(140,220,255,.12); color:rgb(var(--ink)); }
.ui-disc:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; }
.ui-btn--primary{ position:relative; padding:0 26px; min-width:200px; min-height:52px; font-size:16px; font-weight:600; border-radius:var(--r-pill);
  border:1px solid rgba(190,235,255,.45); color:rgb(var(--ink));
  background:linear-gradient(115deg,#0b7acd,#00BFFF 55%,#0b5aa0);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 14px 36px -12px rgba(0,191,255,.7);
  transition:transform .3s var(--ease-inst),box-shadow .3s,border-color .3s; }
.ui-btn--primary:hover{ color:rgb(var(--ink)); transform:translateY(-2px); border-color:rgba(220,244,255,.7); box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 18px 44px -12px rgba(0,191,255,.95); }
.ui-btn--primary:active{ opacity:1; transform:translateY(0) scale(.985); }
.ui-btn--quiet{ color:rgb(var(--ink3)); }
.ui-btn--quiet:hover{ color:rgb(var(--ink)); }
.ui-btn--danger{ background:transparent; border-color:var(--st-critical); color:var(--st-critical); }
.ui-btn--danger:hover{ background:rgba(184,236,255,0.08); }
.ui-btn[disabled]{ opacity:.45; cursor:not-allowed; pointer-events:none; }
.ui-btn--sm{ min-height:36px; padding:0 14px; font-size:var(--t-support); }
.ui-btn--sm.ui-btn--primary{ min-width:0; min-height:44px; }
.ui-btn--block{ width:100%; }
html[data-theme="light"] .ui-btn--pill, html[data-theme="light"] .ui-disc{ border-color:rgba(15,40,70,.18); background:rgba(15,40,70,.04); }
html[data-theme="light"] .ui-btn--pill:hover, html[data-theme="light"] .ui-disc:hover{ background:rgba(15,40,70,.09); }
html[data-theme="light"] .ui-btn--primary{ color:#fff; background:linear-gradient(115deg,#0a7acd,#116289 50%,#003f5c); border-color:rgba(10,122,205,.5); }

/* ── 10. ROWS (decision / evidence) ────────────────────────────────────── */
.ui-row{ display:grid; grid-template-columns:1fr auto; gap:var(--sp-2) var(--sp-4); padding:var(--sp-4) 0; border-bottom:1px solid var(--hair); align-items:start; }
.ui-row:last-child{ border-bottom:0; }
.ui-row__title{ font-size:var(--t-body); color:rgb(var(--ink)); font-weight:500; line-height:1.4; }
.ui-row__meta{ display:flex; flex-wrap:wrap; gap:var(--sp-3); align-items:center; grid-column:1 / -1; }
.ui-row__right{ display:flex; gap:var(--sp-2); align-items:center; justify-self:end; }
.ui-row--unresolved{ border-left:2px solid var(--st-unresolved); padding-left:var(--sp-3); }
.ui-row--evidence .ui-row__title{ font-weight:400; color:rgb(var(--ink2)); }

/* ── 11. INTERRUPTION (the deliberate pause, not an alert) ─────────────── */
.ui-interrupt{ background:var(--s2); border:1px solid var(--hair2); border-left:2px solid var(--ice); border-radius:var(--r-2); padding:var(--sp-4) var(--sp-5); display:grid; gap:var(--sp-2); }
.ui-interrupt .ui-label{ color:var(--ice); }
.ui-interrupt__basis{ font-size:var(--t-body); color:rgb(var(--ink)); }
.ui-interrupt__consequence{ font-size:var(--t-support); color:rgb(var(--ink2)); }
.ui-interrupt__actions{ display:flex; gap:var(--sp-2); flex-wrap:wrap; margin-top:var(--sp-2); }

/* ── 12. EMPTY STATE ───────────────────────────────────────────────────── */
.ui-empty{ padding:var(--sp-6) var(--sp-4); text-align:center; border:1px dashed var(--hair2); border-radius:var(--r-2); color:rgb(var(--ink3)); font-size:var(--t-body); }
.ui-empty b{ display:block; color:rgb(var(--ink2)); font-weight:500; margin-bottom:var(--sp-1); }

/* ── 13. SHEET / DRAWER ────────────────────────────────────────────────── */
.ui-sheet-backdrop{ position:fixed; inset:0; background:rgba(2,10,22,0.62); z-index:70; opacity:0; pointer-events:none; transition:opacity .18s; }
.ui-sheet-backdrop.on{ opacity:1; pointer-events:auto; }
.ui-sheet{ position:fixed; left:0; right:0; bottom:0; z-index:71; background:var(--s1); border-top:1px solid var(--hair2); border-radius:14px 14px 0 0;
  padding:var(--sp-3) var(--sp-4) calc(var(--sp-5) + env(safe-area-inset-bottom,0px)); max-height:calc(100vh - 32px); overflow:auto; scrollbar-gutter:stable;
  transform:translateY(102%); transition:transform .22s cubic-bezier(.22,1,.36,1); }
.ui-sheet.on{ transform:none; }
.ui-sheet__grip{ width:36px; height:4px; border-radius:2px; background:var(--hair3); margin:0 auto var(--sp-4); }
@media (min-width:1024px){
  .ui-sheet{ left:calc(var(--rail-w) + 12px); right:auto; bottom:12px; width:min(580px, calc(100vw - var(--rail-w) - 24px)); border-radius:24px;
    border:1px solid rgba(160,225,255,.18); background:rgba(0,24,48,.88); -webkit-backdrop-filter:blur(22px); backdrop-filter:blur(22px);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 50px 110px -40px rgba(18,64,184,1);
    transform:translateY(12px); opacity:0; pointer-events:none; transition:transform .18s, opacity .18s; }
  .ui-sheet.on{ transform:none; opacity:1; pointer-events:auto; }
  .ui-sheet__grip{ display:none; }
}
@media (prefers-reduced-motion:reduce){ .ui-sheet, .ui-sheet-backdrop{ transition:none; } }

/* ── 14. CHART FRAME ───────────────────────────────────────────────────── */
.ui-chart{ position:relative; background:var(--s1); border:1px solid var(--hair); border-radius:var(--r-2); padding:var(--sp-4); }
.ui-chart__foot{ display:flex; justify-content:space-between; gap:var(--sp-3); margin-top:var(--sp-3); flex-wrap:wrap; }
.ui-chart canvas, .ui-chart svg{ max-width:100%; display:block; }

/* ── 15. THE SHELL ─────────────────────────────────────────────────────── */
/* the 26-item sidebar, its float button, mode toggles and backdrop retire from view; the DOM stays so setView + deep links never break */
#sidebar, #sb-backdrop, #nav-float, #menu-toggle, .nav-mode-sel{ display:none !important; }
#content-wrap{ margin-left:0 !important; }
#read-progress{ left:0 !important; }
/* header: title · Intercept · account. The rest steps back. */
#content-wrap > header{ height:var(--hdr-h) !important; background:rgba(3,16,31,0.86) !important; border-bottom:1px solid var(--hair) !important; }
html[data-theme="light"] #content-wrap > header{ background:rgba(243,246,250,0.88) !important; }
#streak-pill, #cmdk-btn, #veil-toggle, #load-wrap{ display:none !important; } /* founder 2026-09-08: the float window button (#float-btn) stays in the header */
@media (max-width:1023px){ #theme-toggle{ display:none !important; } #page-title{ font-size:18px !important; } }
#avatar{ background:var(--s2) !important; border:1px solid var(--hair2); color:rgb(var(--ink2)) !important; box-shadow:none !important; font-family:var(--f-meta); font-size:12px; }
.intercept-hdr-btn{ border-radius:var(--r-pill) !important; }

/* desktop rail */
#ui-rail{ position:fixed; top:0; bottom:0; left:0; width:var(--rail-w); z-index:45; display:none; flex-direction:column; align-items:stretch;
  background:var(--s1); border-right:1px solid var(--hair); padding:14px 8px calc(12px + env(safe-area-inset-bottom,0px)); }
#ui-rail .ui-rail__brand{ display:flex; align-items:center; justify-content:center; height:46px; margin-bottom:10px; text-decoration:none; }
#ui-rail .ui-rail__brand span{ font-family:var(--f-disp); font-weight:600; font-size:11px; letter-spacing:.34em; color:rgb(var(--ink)); }
.ui-dest{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; height:66px; border-radius:var(--r-2); border:1px solid transparent;
  background:transparent; color:rgb(var(--ink3)); cursor:pointer; text-decoration:none; font-family:var(--f-body); font-weight:600; font-size:11px; letter-spacing:.14em; text-transform:uppercase; position:relative; }
.ui-dest svg{ width:22px; height:22px; stroke:currentColor; fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.ui-dest:hover{ color:rgb(var(--ink)); background:var(--s2); }
.ui-dest:focus-visible{ outline:2px solid var(--ice); outline-offset:-2px; }
.ui-dest[aria-current="page"]{ color:var(--ice); background:var(--ice-glow); border-color:rgba(79,196,245,0.28); }
.ui-dest[aria-current="page"]::before{ content:''; position:absolute; left:-9px; top:18px; bottom:18px; width:2px; border-radius:2px; background:var(--ice); }
#ui-rail .ui-rail__spacer{ flex:1; }
/* the More control: the Intercept's glass disc, not a bare dot row (founder 09-01) */
#ui-rail .ui-dest--more{ height:auto; padding:10px 0 8px; color:rgb(var(--ink2)); gap:7px; }
#ui-rail .ui-dest--more svg{ width:18px; height:18px; padding:12px; box-sizing:content-box; border-radius:50%;
  border:1px solid rgba(160,225,255,.26); background:rgba(140,220,255,.05);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10); transition:background var(--dur-1), border-color var(--dur-1); }
#ui-rail .ui-dest--more:hover{ background:transparent; color:rgb(var(--ink)); }
#ui-rail .ui-dest--more:hover svg{ background:rgba(140,220,255,.12); border-color:rgba(180,235,255,.5); }
#ui-rail .ui-dest--more span{ font-size:10.5px; letter-spacing:.10em; }
html[data-theme="light"] #ui-rail .ui-dest--more svg{ border-color:rgba(15,40,70,.18); background:rgba(15,40,70,.04); box-shadow:none; }
html[data-theme="light"] #ui-rail .ui-dest--more:hover svg{ background:rgba(15,40,70,.09); }

/* mobile tab bar */
#ui-tabbar{ position:fixed; left:0; right:0; bottom:0; z-index:45; display:none; grid-template-columns:repeat(4,1fr); height:calc(var(--tab-h) + env(safe-area-inset-bottom,0px));
  padding-bottom:env(safe-area-inset-bottom,0px); background:rgba(0,31,63,0.94); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); border-top:1px solid var(--hair2); }
html[data-theme="light"] #ui-tabbar{ background:rgba(255,255,255,0.94); }
#ui-tabbar .ui-dest{ height:auto; border-radius:0; border:0; gap:4px; padding:8px 0 6px; font-size:10.5px; letter-spacing:.12em; }
#ui-tabbar .ui-dest[aria-current="page"]{ background:transparent; }
#ui-tabbar .ui-dest[aria-current="page"]::before{ left:50%; top:0; bottom:auto; height:2px; width:28px; transform:translateX(-50%); }

/* the More sheet: secondary rooms, grouped under the five words — contextual navigation, not a drawer */
#ui-more h3{ font-family:var(--f-meta); font-size:var(--t-meta); letter-spacing:.16em; text-transform:uppercase; color:var(--ice); margin:var(--sp-4) 0 var(--sp-2); }
#ui-more h3:first-of-type{ margin-top:0; }
#ui-more .ui-more__grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:10px; }
#ui-more .ui-more__item{ display:flex; align-items:center; min-height:48px; padding:0 18px; border-radius:999px;
  border:1px solid rgba(160,225,255,.26); background:rgba(140,220,255,.05);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
  color:rgb(var(--ink)); font-family:var(--f-body); font-size:var(--t-support); font-weight:500; text-align:left; cursor:pointer;
  transition:background var(--dur-1), border-color var(--dur-1); }
#ui-more .ui-more__item:hover{ background:rgba(140,220,255,.12); border-color:rgba(180,235,255,.5); color:rgb(var(--ink)); box-shadow:inset 0 1px 0 rgba(255,255,255,.18), var(--glow-1); }
#ui-more .ui-more__item:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; }
#ui-more .ui-more__item small{ margin-left:auto; padding-left:10px; font-size:11px; color:rgb(var(--ink3)); font-style:italic; }
#ui-more .ui-more__item[aria-current="page"]{ background:rgba(140,220,255,.16); border-color:rgba(180,235,255,.5); color:rgb(var(--ink)); }
#ui-more h3{ font:500 13px var(--f-disp); letter-spacing:.02em; text-transform:none; color:rgb(var(--ink3)); margin:22px 2px 10px; }
#ui-more h3:first-of-type{ margin-top:6px; }
html[data-theme="light"] #ui-more .ui-more__item{ border-color:rgba(15,40,70,.18); background:rgba(15,40,70,.04); box-shadow:none; }
html[data-theme="light"] #ui-more .ui-more__item:hover, html[data-theme="light"] #ui-more .ui-more__item[aria-current="page"]{ background:rgba(15,40,70,.09); border-color:rgba(15,40,70,.3); }
#ui-more .ui-more__item small{ margin-left:auto; font-family:var(--f-meta); font-size:11px; letter-spacing:.1em; color:rgb(var(--ink3)); }
#ui-more .ui-more__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--sp-2); }
#ui-more .ui-more__head .ui-label{ color:rgb(var(--ink2)); }

/* header "more" (mobile) */
#ui-more-btn{ display:none; }

/* responsive tiers — deliberate, not one breakpoint */
@media (min-width:1024px){
  #ui-rail{ display:flex; }
  #content-wrap{ margin-left:var(--rail-w) !important; }
  #read-progress{ left:var(--rail-w) !important; }
  main.view{ padding:var(--sp-6) var(--sp-6) var(--sp-7) !important; max-width:1440px; }
}
@media (min-width:1280px){ :root{ --rail-w:92px; } }
@media (max-width:1023px){
  #ui-tabbar{ display:grid; }
  #ui-more-btn{ display:inline-flex; }
  body{ padding-bottom:calc(var(--tab-h) + env(safe-area-inset-bottom,0px)); }
  main.view{ padding:var(--sp-4) var(--sp-4) var(--sp-6) !important; }
  #page-onward{ padding-bottom:var(--sp-5) !important; }
}
@media (max-width:1023px) and (pointer:coarse){ #content-wrap > header{ padding-left:var(--sp-4) !important; padding-right:var(--sp-4) !important; } }
@media print{ #ui-rail, #ui-tabbar, .ui-sheet, .ui-sheet-backdrop{ display:none !important; } }

/* ── 16. TODAY (Phase 3) — one centre of gravity: the number, then its meaning ── */
.td{ display:grid; gap:var(--sp-5); max-width:1180px; }
.td-head{ display:flex; justify-content:space-between; align-items:baseline; gap:var(--sp-3); }
.td-state__top{ display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap; margin-bottom:var(--sp-3); }
.td-state .ui-display{ font-size:clamp(88px,14vw,168px); }
.td-num--dim{ color:rgb(var(--ink3)) !important; }
.td-what{ font-size:var(--t-support); color:rgb(var(--ink3)); max-width:44ch; margin:var(--sp-2) 0 0; }
.td-state .ui-delta{ margin-top:var(--sp-2); }
.td-verdict{ font-size:clamp(28px,3.2vw,40px); }
.td-verdict[data-state="critical"]{ color:var(--st-critical); }
.td-verdict[data-state="degraded"]{ color:var(--st-degraded); }
.td-verdict[data-state="caution"]{ color:var(--st-caution); }
.td-sub{ margin:var(--sp-3) 0 0; }
.td-stale{ color:var(--st-caution); }
.td-actions{ display:flex; gap:var(--sp-2); flex-wrap:wrap; margin-top:var(--sp-4); }
.td-attn-wrap .ui-interrupt[data-rank="99"]{ display:none; }
.td-evidence .ui-row{ padding:var(--sp-3) 0; }
.td-evidence .ui-row__title{ font-size:var(--t-body); }
.td-evidence .ui-row__right{ font-family:var(--f-meta); font-size:var(--t-body); color:rgb(var(--ink)); }
.td-record__row{ display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap; padding-top:var(--sp-3); }
.td-record__row .ui-btn{ margin-left:auto; }
@media (min-width:1024px){
  .td{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); grid-template-areas:"head head" "state side" "meaning side" "record record"; column-gap:var(--sp-7); row-gap:var(--sp-5); align-items:start; }
  .td-head{ grid-area:head; }
  .td-state{ grid-area:state; }
  .td-meaning{ grid-area:meaning; }
  .td-side{ grid-area:side; display:grid; gap:var(--sp-5); align-self:start; }
  .td-record{ grid-area:record; }
}
@media (max-width:1023px){
  .td{ gap:var(--sp-4); }
  .td-state .ui-display{ font-size:clamp(84px,26vw,120px); }
  .td-verdict{ font-size:26px; }
  .td-actions .ui-btn{ flex:1 1 100%; }
  .td-record__row .ui-btn{ margin-left:0; }
}

.td-side{ display:grid; gap:var(--sp-4); }
.td-state[data-state="critical"] .ui-display{ color:var(--st-critical); }
.td-state[data-state="degraded"] .ui-display{ color:var(--st-degraded); }
.td-state[data-state="caution"] .ui-display{ color:var(--st-caution); }
.td-record__row .ui-support{ color:rgb(var(--ink2)); }

.ui-interrupt .ui-label{ color:var(--ice2); }

/* ── 17. DECIDE (Phase 4) — state · decision · check · commit · record ───── */
.dc{ display:grid; gap:var(--sp-5); max-width:1180px; }
.dc-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:var(--sp-5); flex-wrap:wrap; }
.dc-head__l{ display:grid; gap:var(--sp-2); }
.dc-head__r{ max-width:44ch; margin:0; }
.dc-state{ display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap; }
.dc-state__num{ font-size:28px; line-height:1; color:rgb(var(--ink)); letter-spacing:-.02em; }
.dc-state__num .ui-of{ font-size:13px; margin-left:3px; }
.dc-link{ background:none; border:0; padding:0; color:var(--ice); font:500 var(--t-support)/1.4 var(--f-body); text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.dc-link:hover{ color:var(--ice2); }
.dc-step{ display:flex; justify-content:space-between; align-items:baseline; gap:var(--sp-3); margin-bottom:var(--sp-3); }
.dc-input{ width:100%; background:transparent; border:0; border-bottom:1px solid var(--hair3); border-radius:0; padding:8px 0 12px; font-family:var(--f-body); font-size:22px; font-weight:400; letter-spacing:-.01em; color:rgb(var(--ink)); outline:none; }
.dc-input:focus{ border-bottom-color:var(--ice); }
.dc-input::placeholder{ color:rgb(var(--ink3)); }
.dc-facts{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-4); margin-top:var(--sp-4); }
.dc-lab{ display:block; margin:0 0 6px; color:rgb(var(--ink2)); }
.dc-opts{ display:flex; gap:6px; flex-wrap:wrap; }
.dc-opt{ flex:1 1 auto; min-height:40px; padding:0 12px; border-radius:var(--r-1); border:1px solid var(--hair2); background:transparent; color:rgb(var(--ink2)); font:500 var(--t-support)/1 var(--f-body); cursor:pointer; }
.dc-opt:hover{ background:var(--s2); color:rgb(var(--ink)); }
.dc-opt.sel{ border-color:var(--ice) !important; background:var(--ice-glow) !important; color:rgb(var(--ink)) !important; }
.dc-fold{ border:1px solid var(--hair); border-radius:var(--r-2); background:var(--s1); }
.dc-fold__sum{ list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:var(--sp-3); min-height:44px; padding:0 var(--sp-4); font:500 var(--t-body)/1.3 var(--f-body); color:rgb(var(--ink)); }
.dc-fold__sum::-webkit-details-marker{ display:none; }
.dc-fold__sum::before{ content:'+'; font-family:var(--f-meta); color:var(--ice); margin-right:8px; }
.dc-fold[open] .dc-fold__sum::before{ content:'−'; }
.dc-fold__body{ padding:0 var(--sp-4) var(--sp-4); display:grid; gap:var(--sp-3); }
.dc-slider__row{ display:flex; justify-content:space-between; font-size:var(--t-support); color:rgb(var(--ink2)); margin-bottom:6px; }
.dc-actions{ display:flex; gap:var(--sp-2); flex-wrap:wrap; margin-top:var(--sp-4); }
.dc-note{ margin-top:var(--sp-3); max-width:60ch; }
.dc-side{ background:var(--s1); border:1px solid var(--hair); border-radius:var(--r-2); padding:var(--sp-4) var(--sp-4) var(--sp-5); display:flex; flex-direction:column; align-items:center; text-align:center; }
.dc-side .dc-step{ width:100%; text-align:left; }
.dc-gauge{ position:relative; width:200px; height:200px; margin:0 auto; }
.dc-support{ border-top:1px solid var(--hair); margin-top:var(--sp-4); padding-top:var(--sp-4); }
.dc-verdict{ font-family:var(--f-disp); font-weight:500; font-size:22px; line-height:1.2; margin:var(--sp-3) 0 var(--sp-2); text-wrap:balance; max-width:26ch; }
.dc-side #sim-blindspots, .dc-commit{ width:100%; text-align:left; }
.dc-commit{ border-top:1px solid var(--hair); margin-top:var(--sp-4); padding-top:var(--sp-4); }
.dc-stamp{ margin-top:var(--sp-3); letter-spacing:.04em; text-transform:none; line-height:1.5; }
.dc-record{ display:grid; gap:var(--sp-3); }
.dc-ledger{ display:grid; gap:8px; }
.dc-ledger > div{ background:var(--s1) !important; border:1px solid var(--hair); }
.dc-form .dc-field{ margin-bottom:var(--sp-3); }
.dc-field{ width:100%; background:var(--s0); border:1px solid var(--hair2); border-radius:var(--r-1); padding:10px 12px; font:400 var(--t-body)/1.4 var(--f-body); color:rgb(var(--ink)); outline:none; }
.dc-field:focus{ border-color:var(--ice); }
.dc-wave{ margin-top:var(--sp-3); }
#dl-pending{ width:max-content; }
@media (min-width:1024px){
  .dc{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); grid-template-areas:"head head" "main side" "record record"; column-gap:var(--sp-7); }
  .dc-head{ grid-area:head; } .dc-main{ grid-area:main; } .dc-side{ grid-area:side; align-self:start; } .dc-record{ grid-area:record; }
}
@media (max-width:1023px){
  .dc-facts{ grid-template-columns:1fr; }
  .dc-actions .ui-btn{ flex:1 1 100%; }
  .dc-input{ font-size:20px; }
  .dc-gauge{ width:200px; height:200px; }
  .dc-gauge canvas{ width:200px !important; height:200px !important; }
}
.dc, .td{ grid-template-columns:minmax(0,1fr); }
.dc > *, .dc-facts > *, .dc-main > *, .dc-side > *, .td > *{ min-width:0; }
.dc-side .dc-step{ flex-wrap:wrap; }
@media (min-width:1024px){ .dc{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); } .td{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); } }

/* ── 18. THE INTERCEPT (Phase 4, v6) — one glass frame in the navy field, the app dimmed
       behind it. The frame and the pill are the website's .glass and .btn, copied line for
       line (glows included); only the hover lift is left off, a dialog does not float away.
       Every id the JS binds to is kept; js/22-intercept.js fills the new elements. ── */
#intercept-panel{ background:radial-gradient(70% 55% at 50% 0%,rgba(14,58,107,.92) 0%,rgba(0,31,63,.94) 40%,rgba(3,16,31,.96) 100%) !important;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); padding:24px 16px !important; }
.int-card{ position:relative; width:100%; max-width:640px; max-height:calc(100dvh - 48px); overflow-y:auto; overscroll-behavior:contain;
  scrollbar-width:none; text-align:center; border-radius:24px; isolation:isolate; padding:72px 64px 40px; box-sizing:border-box;
  background:linear-gradient(150deg,rgba(0,191,255,.08),rgba(10,122,205,.06) 55%,rgba(255,255,255,.012));
  border:1px solid rgba(160,225,255,.16);
  -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 30px 70px -40px rgba(18,64,184,.95); }
.int-card::-webkit-scrollbar{ display:none; }
/* the legacy arete.css card/button rules outrank by specificity; restated here so the glass wins */
/* 2026-09-25 audit: the two bleed lights live in the card's own background. As an
   absolute ::before inside a scroll container they covered only the first screen and
   scrolled away mid-card once the Intercept grew taller than the frame. The frame's
   own background does not scroll with its content, so the lights stay on the frame.
   Same recipe, the protected violet second light included (constitution §4). */
html:not([data-theme="light"]) .int-card{ display:block;
  background:radial-gradient(60% 50% at 20% 0%,rgba(47,123,255,.22),transparent 70%),radial-gradient(50% 50% at 90% 100%,rgba(122,92,255,.18),transparent 70%),linear-gradient(150deg,rgba(0,191,255,.08),rgba(10,122,205,.06) 55%,rgba(255,255,255,.012)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 30px 70px -40px rgba(18,64,184,.95); }
html:not([data-theme="light"]) .int-card::before{ content:none; }
html[data-theme="light"] .int-card{ display:block; }
.int-action-btn{ flex:none; text-transform:none; letter-spacing:0; white-space:nowrap; }
.int-actions .int-action-secondary, .int-actions .int-action-primary, .int-actions .int-action-override{ background:transparent; border:0; box-shadow:none; text-shadow:none; color:rgb(var(--ink2)); }
.int-actions .int-action-secondary:hover, .int-actions .int-action-primary:hover{ background:transparent; color:rgb(var(--ink)); }
.int-actions{ padding-top:0; }
.int-pill{ text-transform:none; letter-spacing:0; white-space:nowrap; }
.int-card::before{ content:""; position:absolute; inset:-1px; border-radius:inherit; z-index:-1; pointer-events:none;
  background:radial-gradient(60% 50% at 20% 0%,rgba(47,123,255,.22),transparent 70%),radial-gradient(50% 50% at 90% 100%,rgba(122,92,255,.18),transparent 70%); }
.int-card::after{ content:none; }
/* top corners */
.int-stamp{ position:absolute; top:22px; left:26px; display:flex; align-items:center; gap:14px; font:400 13px var(--f-body); color:rgb(var(--ink3)); }
.int-armed{ display:inline-flex; align-items:center; gap:6px; font:500 13px var(--f-body); color:var(--ice2); }
.int-armed-dot{ width:6px; height:6px; border-radius:50%; background:var(--ice2); box-shadow:0 0 8px var(--ice2); }
.int-close{ position:absolute; top:14px; right:14px; width:44px; height:44px; display:grid; place-items:center; border:0; background:transparent; color:rgb(var(--ink3)); border-radius:50%; cursor:pointer; }
.int-close:hover{ color:rgb(var(--ink)); background:rgba(0,191,255,.08); }
.int-close:focus-visible, .int-action-btn:focus-visible, .int-pill:focus-visible{ outline:2px solid var(--ice2); outline-offset:3px; }
.int-input:focus{ outline:none; box-shadow:none; }
.int-input:focus-visible{ outline:none; background:rgba(0,191,255,.07); border-radius:12px; } /* a text field always matches :focus-visible; a wash marks it, not a ring (her rule: no lines) */
/* pressed feedback without moving layout (ui-ux-pro-max: stable interaction states) */
.int-disc:active{ filter:brightness(1.25); transform:none; }
.int-action-btn:active, .int-pill:active{ opacity:.7; }
.int-actions .int-primary > .int-action-btn:active{ opacity:1; }
/* keyboard focus is never hidden under the phone's fixed bar */
.int-card{ scroll-padding-bottom:170px; }
/* the mic disc (ref pin 140878294591043696): the site pill gradient, ice halo that breathes while listening */
.int-disc.int-mic{ border-color:rgba(190,235,255,.35) !important; color:rgb(var(--ink)) !important; position:relative;
  background:linear-gradient(115deg,rgba(10,122,205,.62),rgba(0,191,255,.42) 50%,rgba(0,63,92,.62)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 14px 36px -14px rgba(47,123,255,.8) !important; }
.int-disc.int-mic:hover{ transform:translateY(-2px); }
.int-disc.int-mic::before{ content:""; position:absolute; inset:-10px; border-radius:50%; pointer-events:none; opacity:0;
  background:radial-gradient(50% 50% at 50% 50%,rgba(0,191,255,.35),transparent 70%); transition:opacity .3s; }
.int-disc.int-mic[data-live]::before{ opacity:1; animation:int-mic-breathe 1.6s ease-in-out infinite; }
.int-disc.int-mic[data-live]{ border-color:rgba(220,244,255,.7) !important; }
@keyframes int-mic-breathe{ 0%,100%{ transform:scale(.9); opacity:.6 } 50%{ transform:scale(1.25); opacity:1 } }
@media (prefers-reduced-motion:reduce){ .int-disc.int-mic[data-live]::before{ animation:none; } }
html[data-theme="light"] .int-disc{ border-color:rgba(15,40,70,.18) !important; background:rgba(15,40,70,.04) !important; }
html[data-theme="light"] .int-disc.int-mic{ color:#fff !important; background:linear-gradient(115deg,#0a7acd,#116289 50%,#003f5c) !important; border-color:rgba(10,122,205,.5) !important; }
/* the stack */
.int-stack{ display:grid; justify-items:center; gap:0; }
/* 1 · the decision */
.int-input{ width:100%; border:0; background:transparent; text-align:center; font:500 36px/1.06 var(--f-disp); letter-spacing:-.025em; color:rgb(var(--ink)); padding:0; margin:0; outline:none; }
.int-input::placeholder{ color:rgb(var(--ink3)); opacity:.75; font-weight:400; }
/* 2 · two facts, tap a word */
.int-facts{ display:inline-flex; align-items:center; justify-content:center; gap:10px; margin-top:18px; padding:0 16px; min-height:36px; border-radius:999px;
  font:400 13px/1.5 var(--f-body); color:rgb(var(--ink2)); letter-spacing:.02em;
  border:1px solid rgba(160,225,255,.16); background:rgba(0,191,255,.05); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.int-fact{ display:inline-flex; }
.int-dot{ color:rgb(var(--ink3)); }
.int-pill{ display:none; border:0; background:transparent; padding:0 4px; min-height:44px; margin:-4px 0; /* 44px hit area inside the 36px pill */ font:inherit; color:inherit; cursor:pointer; border-radius:8px; transition:color .15s; }
.int-pill.sel{ display:inline-flex; align-items:center; background:transparent; border:0; color:rgb(var(--ink2)); box-shadow:none; }
html[data-theme="light"] .int-pill, html[data-theme="light"] .int-pill.sel{ background:transparent; border:0; }
.int-pill.sel:hover{ color:rgb(var(--ink)); }
/* 3 · THE CUBE — the website's held cube, its face CSS copied line for line (index.html .face/.f1..f6),
   one hero cubie in the site's held pose (rx -26, ry 34, slow turn) with the site's satellites in depth.
   Per the site's own rule the cube stands still for Intercept; when the reading is compromised it slips off its axis (Drift). */
.int-cube{ --ics:112px; width:300px; height:280px; position:relative; perspective:1000px; perspective-origin:50% 45%; margin-top:2px; }
.ic-origin{ position:absolute; left:50%; top:50%; width:0; height:0; transform-style:preserve-3d; }
.ic-rig{ transform-style:preserve-3d; }
.ic-cubie{ position:absolute; width:var(--ics); height:var(--ics); left:calc(var(--ics)/-2); top:calc(var(--ics)/-2); transform-style:preserve-3d; will-change:transform; }
.ic-face{ position:absolute; inset:0; border-radius:5px; border:1px solid rgba(220,242,255,.42);
  background:linear-gradient(150deg,rgba(0,191,255,.50),rgba(10,122,205,.42) 50%,rgba(0,31,63,.55));
  box-shadow:inset 0 0 18px rgba(160,215,255,.28),inset 0 1px 0 rgba(255,255,255,.45); }
.ic-face::before{ content:""; position:absolute; left:8%; top:7%; width:50%; height:30%; border-radius:6px;
  background:linear-gradient(140deg,rgba(255,255,255,.5),rgba(255,255,255,.02) 85%); }
.ic-f1{ transform:translateZ(calc(var(--ics)/2)); }
.ic-f2{ transform:rotateY(180deg) translateZ(calc(var(--ics)/2)); background:linear-gradient(150deg,rgba(10,122,205,.44),rgba(0,31,63,.50)); }
.ic-f3{ transform:rotateY(90deg) translateZ(calc(var(--ics)/2)); background:linear-gradient(150deg,rgba(22,140,220,.46),rgba(0,45,80,.48)); }
.ic-f4{ transform:rotateY(-90deg) translateZ(calc(var(--ics)/2)); background:linear-gradient(150deg,rgba(0,191,255,.46),rgba(10,98,172,.48)); }
.ic-f5{ transform:rotateX(90deg) translateZ(calc(var(--ics)/2)); background:linear-gradient(150deg,rgba(207,243,255,.74),rgba(0,191,255,.55));
  box-shadow:inset 0 0 22px rgba(220,245,255,.5),inset 0 1px 0 rgba(255,255,255,.7); }
.ic-f6{ transform:rotateX(-90deg) translateZ(calc(var(--ics)/2)); background:linear-gradient(150deg,rgba(0,63,92,.55),rgba(0,17,35,.60)); }
/* the held one: the site's pose and its slow turn; the lean is the site's Drift */
.ic-hero{ animation:ic-turn 16s ease-in-out infinite alternate; transition:transform 1.2s cubic-bezier(.2,.8,.2,1); }
.ic-hero .ic-face{ border-color:rgba(230,246,255,.55); box-shadow:inset 0 0 22px rgba(180,230,255,.34),inset 0 1px 0 rgba(255,255,255,.55),0 30px 60px -30px rgba(0,191,255,.5); }
@keyframes ic-turn{ from{ transform:translateZ(60px) rotateX(-26deg) rotateY(26deg) rotateZ(var(--lean,0deg)); } to{ transform:translateZ(60px) rotateX(-24deg) rotateY(42deg) rotateZ(var(--lean,0deg)); } }
.int-cube[data-lean="1"]{ --lean:-8deg; }
.int-cube[data-lean="2"]{ --lean:-14deg; }
.int-cube[data-empty] .ic-face{ opacity:.45; }
@media (prefers-reduced-motion:reduce){ .ic-hero{ animation:none; transform:translateZ(60px) rotateX(-26deg) rotateY(34deg) rotateZ(var(--lean,0deg)); } }
/* light theme keeps the faces; the ground is pale so the shadow softens */
html[data-theme="light"] .ic-hero .ic-face{ box-shadow:inset 0 0 22px rgba(180,230,255,.34),inset 0 1px 0 rgba(255,255,255,.7),0 30px 60px -30px rgba(10,122,205,.35); }
.int-numrow{ display:flex; align-items:baseline; justify-content:center; gap:10px; margin-top:6px; }
.int-num{ font:300 64px/1 var(--f-body); letter-spacing:-.05em; color:rgb(var(--ink)); font-variant-numeric:tabular-nums; }
.int-num[data-empty]{ color:rgb(var(--ink3)); }
.int-numlab{ font:400 14px var(--f-body); color:rgb(var(--ink3)); }
/* 5 · the verdict */
.int-verdict{ margin-top:18px; font:500 28px/1.1 var(--f-disp); letter-spacing:-.022em; color:rgb(var(--ink)); text-wrap:balance; max-width:22ch; }
.int-verdict em{ font:italic 500 1.08em var(--f-em); color:#dff4ff; }
/* 5b · the model line. One line under the verdict: the name, then its opening
   sentence. It has no frame, no fill and no card of its own, because a framework
   that announces itself teaches reflexive dismissal; it sits in the column like
   a sentence the instrument happened to say. */
.int-model{ margin:14px auto 0; max-width:36ch; }
/* the gutter balances the dismiss disc, so the sentence sits on the card's axis
   with everything else in the column */
.int-model__row{ display:flex; align-items:flex-start; justify-content:center; gap:8px; }
.int-model__row::before{ content:''; flex:none; width:28px; }
.int-model__open{ min-width:0; display:block; text-align:center; padding:6px 0; border:0; background:none; cursor:pointer;
  font:400 15px/1.5 var(--f-body); color:rgb(var(--ink2)); }
.int-model__open:hover{ color:rgb(var(--ink)); }
.int-model__name{ font-weight:600; color:rgb(var(--ink)); }
.int-model__name::after{ content:'\00a0\00b7\00a0'; font-weight:400; color:rgb(var(--ink3)); }
.int-model__x{ flex:none; width:28px; height:28px; min-height:28px; margin-top:4px; display:grid; place-items:center;
  border:0; background:none; border-radius:50%; cursor:pointer; color:rgb(var(--ink3)); }
.int-model__x svg{ width:13px; height:13px; }
.int-model__x:hover{ color:rgb(var(--ink2)); background:rgba(140,220,255,.08); }
/* the offer is one centred line; the instructions under it are prose, and prose
   is read ragged-right */
.int-model__how{ margin:4px 0 0; padding:0 28px; text-align:left; font:400 13.5px/1.65 var(--f-body); color:rgb(var(--ink2)); }
.int-model__how--companion{ margin-top:9px; color:rgb(var(--ink3)); }
.int-model__how--companion span{ color:rgb(var(--ink2)); font-weight:600; }
@media (max-width:767px){ .int-model{ margin-top:12px; } .int-model__open{ font-size:14px; } }
/* 6 · mic disc · the one pill · why disc; the quiet exits under them */
.int-actions{ display:grid; justify-items:center; gap:10px; margin-top:30px; }
.int-actions .int-row{ display:flex; align-items:center; justify-content:center; gap:18px; }
.int-actions .int-primary{ display:flex; justify-content:center; }
.int-actions .int-quiet{ display:flex; flex-wrap:wrap; justify-content:center; gap:0 28px; }
.int-action-btn{ min-height:44px; display:inline-flex; align-items:center; padding:0 6px; border:0; background:transparent; font:500 14px var(--f-body); color:rgb(var(--ink2)); cursor:pointer; border-radius:8px; }
.int-action-btn:hover{ color:rgb(var(--ink)); }
/* the two small discs (site .btn-ghost) */
.int-disc{ width:44px; height:44px; min-height:44px; padding:0 !important; border-radius:50% !important; display:grid; place-items:center; cursor:pointer; flex:none;
  border:1px solid rgba(160,225,255,.26) !important; background:rgba(140,220,255,.05) !important; color:rgb(var(--ink2)) !important; font-size:0 !important;
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:inset 0 1px 0 rgba(255,255,255,.12); transition:background .2s,color .2s,transform .3s cubic-bezier(.2,.8,.2,1); }
.int-disc svg{ width:18px; height:18px; display:block; }
.int-disc:hover{ background:rgba(140,220,255,.12) !important; color:rgb(var(--ink)) !important; }
.int-why[aria-expanded="true"]{ background:rgba(140,220,255,.16) !important; color:rgb(var(--ink)) !important; }
/* the site's .btn, verbatim */
.int-actions .int-primary > .int-action-btn{ position:relative; display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:0 26px; min-width:200px; min-height:52px; border-radius:999px;
  font-family:var(--f-body); font-size:16px; font-weight:600; cursor:pointer; color:rgb(var(--ink));
  border:1px solid rgba(190,235,255,.35);
  background:linear-gradient(115deg,rgba(10,122,205,.62),rgba(0,191,255,.42) 50%,rgba(0,63,92,.62));
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 14px 36px -14px rgba(47,123,255,.8);
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,border-color .3s,background .3s; }
.int-actions .int-primary > .int-action-btn:hover{ transform:translateY(-2px); border-color:rgba(220,244,255,.6); box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 18px 44px -14px rgba(47,123,255,1); }
.int-actions .int-primary > .int-action-btn:active{ transform:translateY(0) scale(.985); }
.int-msg{ margin:10px 0 0; min-height:20px; font:400 13px/1.5 var(--f-body); color:rgb(var(--ink2)); }
/* the evidence, behind Why — prose, no rails */
.int-report{ margin-top:36px; padding-top:28px; text-align:left; max-width:46ch; margin-left:auto; margin-right:auto; border:0 !important; }
.int-report-grid{ display:block; }
.int-report-grid > .int-rg-cell{ padding:0 !important; border:0 !important; background:none !important; }
.int-report-grid > .int-rg-key{ font:500 12px var(--f-body) !important; letter-spacing:.06em !important; text-transform:uppercase; color:rgb(var(--ink3)) !important; margin:18px 0 4px !important; }
.int-report-grid > .int-rg-key::before{ display:none !important; }
.int-report-grid > .int-rg-cell:not(.int-rg-key){ font:400 14px/1.6 var(--f-body); color:rgb(var(--ink2)); }
.int-report-grid > :nth-child(1), .int-report-grid > :nth-child(2), .int-report-grid > :nth-child(3), .int-report-grid > :nth-child(4), .int-report-grid > :nth-child(5), .int-report-grid > :nth-child(6){ display:none !important; }
.int-report-grid p, .int-report-grid span, .int-report-grid div{ letter-spacing:0 !important; }
.int-report-grid p[style*="font-size"], .int-report-grid span[style*="font-size"]{ font-size:13px !important; }
.int-report-grid .int-fresh{ font:500 12px var(--f-body) !important; letter-spacing:.06em !important; color:rgb(var(--ink3)) !important; }
.dec-type-tag{ font:500 12px var(--f-body) !important; letter-spacing:.06em !important; border-radius:6px !important; }
/* the recognition tap: two plain answers, not two controls. A filled chip here would
   read as Areté preferring one of them (constitution §9: options are tappable words). */
.ff-recog{ appearance:none; border:0; background:none; padding:6px 0; margin-right:20px; cursor:pointer;
  font:500 13px var(--f-body); color:rgb(var(--ink2)); border-bottom:1px solid transparent;
  min-height:44px; transition:color var(--dur-2,240ms) ease, border-color var(--dur-2,240ms) ease; }
.ff-recog:hover{ color:rgb(var(--ink)); border-bottom-color:var(--hair2,rgba(0,191,255,.22)); }
.ff-recog:focus-visible{ outline:2px solid var(--ice2); outline-offset:3px; }
.int-seek-counsel, .ff-watch-link, .int-probe-btn, #int-adopt-btn{ min-height:44px; padding:0 16px !important; border-radius:999px !important; border:1px solid rgba(160,225,255,.26) !important; background:rgba(140,220,255,.05) !important; color:rgb(var(--ink)) !important; font:500 14px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; }
.int-probe-btn.sel{ background:rgba(140,220,255,.16) !important; border-color:rgba(180,235,255,.5) !important; }
.int-probe{ margin-top:22px; padding:0 !important; border:0 !important; }
.int-gate{ margin-top:22px; padding:0 !important; border:0 !important; background:none !important; }
.int-gate-head{ font:500 12px var(--f-body) !important; letter-spacing:.06em !important; color:rgb(var(--ink3)) !important; }
.int-gate p{ font:400 14px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; }
#int-adopt{ border:0 !important; padding:0 !important; }
#int-report > div:empty{ display:none; }
/* light theme: same frame on a pale field */
html[data-theme="light"] #intercept-panel{ background:radial-gradient(70% 55% at 50% 0%,rgba(226,236,246,.94),rgba(243,246,250,.96) 60%) !important; }
html[data-theme="light"] .int-card{ background:linear-gradient(150deg,rgba(255,255,255,.72),rgba(255,255,255,.55)); border-color:rgba(15,40,70,.14); box-shadow:inset 0 1px 0 #fff,0 30px 70px -40px rgba(18,64,184,.35); }
html[data-theme="light"] .int-card::before{ background:radial-gradient(60% 50% at 20% 0%,rgba(47,123,255,.14),transparent 70%),radial-gradient(50% 50% at 90% 100%,rgba(122,92,255,.10),transparent 70%); }
html[data-theme="light"] .int-verdict em{ color:#0e4d78; }
html[data-theme="light"] .int-actions .int-action-secondary, html[data-theme="light"] .int-actions .int-action-primary, html[data-theme="light"] .int-actions .int-action-override{ background:transparent; border:0; color:rgb(var(--ink2)); }
html[data-theme="light"] .int-actions .int-primary > .int-action-btn{ color:#fff; background:linear-gradient(115deg,#0a7acd,#116289 50%,#003f5c); border-color:rgba(10,122,205,.5); }
/* phone: the frame fills the field, the actions sit in thumb reach */
@media (max-width:767px){
  #intercept-panel{ padding:0 !important; align-items:stretch !important; }
  .int-card{ max-width:100%; max-height:none; height:100dvh; border-radius:0; border:0; padding:calc(64px + env(safe-area-inset-top,0px)) 26px calc(150px + env(safe-area-inset-bottom,0px)); }
  .int-stamp{ top:calc(14px + env(safe-area-inset-top,0px)); left:18px; font-size:12px; }
  .int-close{ top:calc(10px + env(safe-area-inset-top,0px)); right:10px; }
  .int-input{ font-size:26px; }
  .int-facts{ font-size:13px; margin-top:10px; }
  .int-cube{ --ics:92px; width:260px; height:230px; margin-top:0; }
  .int-cube .ic-cubie:nth-child(3), .int-cube .ic-cubie:nth-child(8){ display:none; }
  .int-num{ font-size:56px; }
  .int-verdict{ font-size:23px; margin-top:14px; }
  .int-actions{ position:fixed; left:0; right:0; bottom:0; z-index:3; margin:0; padding:14px 18px calc(14px + env(safe-area-inset-bottom,0px)); gap:2px 14px; background:linear-gradient(180deg,transparent,rgba(0,31,63,.9) 30%); }
  .int-actions .int-action-btn{ font-size:13px; }
  .int-msg{ position:fixed; left:26px; right:26px; bottom:calc(140px + env(safe-area-inset-bottom,0px)); z-index:3; pointer-events:none; text-align:center; }
  html[data-theme="light"] .int-actions{ background:linear-gradient(180deg,transparent,rgba(243,246,250,.92) 30%); }
  body:has(#intercept-panel:not(.hidden)) #ui-tabbar{ display:none !important; }
  /* §11 (2026-09-25 audit): backdrop blur is off under 760px. On the card it also made
     the card the containing block of the "fixed" dock, so the dock scrolled with the
     beliefs and sat on top of them. Off, the dock stays on the screen's edge. */
  #intercept-panel, #intercept-panel .int-card{ backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
  /* without the blur the room behind would show through: the phone card stands on the
     lit scrim at full opacity (the sheet's own recipe, css/sheet.css) */
  #intercept-panel .int-card{ background:radial-gradient(70% 55% at 50% 0%, #0e3a6b 0%, #001f3f 40%, #03101f 100%) !important; }
}
/* a phone on its side: the bar goes back into the flow, the cube shrinks */
@media (max-width:1023px) and (max-height:520px){
  .int-actions{ position:static; padding:14px 0 0; background:none; }
  .int-msg{ position:static; }
  .int-card{ padding-bottom:24px; }
  .int-cube{ --ics:64px; width:200px; height:150px; }
}
@media (min-width:768px) and (max-height:820px){ .int-card{ padding-top:60px; } .int-cube{ --ics:96px; width:260px; height:230px; } .int-actions{ margin-top:22px; } }

/* ── 19. THE RECORD (Phase 5) — a logbook, not a dashboard. A deck of glass sheets in the
       Intercept's frame language; the open decision forward and lit, earlier to the left,
       later to the right. Motion is transform + opacity only; still under reduced-motion. ── */
#view-record:not(.hidden){ width:100%; box-sizing:border-box; align-self:stretch; display:block !important; } #rc-host{ width:100%; }
.rc-head{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.rc-title{ font:500 22px/1 var(--f-disp); letter-spacing:-.02em; color:rgb(var(--ink)); }
.rc-meta{ font:400 13px var(--f-body); color:rgb(var(--ink3)); flex:1 1 auto; }
.rc-tools{ display:flex; align-items:center; gap:10px; }
.rc-q{ min-height:44px; display:inline-flex; align-items:center; padding:0 8px; border:0; background:transparent; font:500 14px var(--f-body); color:rgb(var(--ink2)); cursor:pointer; border-radius:8px; }
.rc-q:hover{ color:rgb(var(--ink)); } .rc-q:active{ opacity:.7; } .rc-q:disabled{ opacity:.5; cursor:default; }
.rc-q--dim{ color:rgb(var(--ink3)); } .rc-q[aria-expanded="true"]{ color:rgb(var(--ink)); }
.rc-disc{ width:44px; height:44px; padding:0; border-radius:50%; display:grid; place-items:center; cursor:pointer; flex:none;
  border:1px solid rgba(160,225,255,.26); background:rgba(140,220,255,.05); color:rgb(var(--ink2));
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:inset 0 1px 0 rgba(255,255,255,.12); transition:background .2s,color .2s; }
.rc-disc svg{ width:18px; height:18px; } .rc-disc:hover{ background:rgba(140,220,255,.12); color:rgb(var(--ink)); } .rc-disc:active{ filter:brightness(1.25); }
.rc-disc:disabled{ opacity:.35; cursor:default; }
.rc-q:focus-visible, .rc-disc:focus-visible, .rc-dot:focus-visible{ outline:2px solid var(--ice2); outline-offset:3px; }
/* the orbit: the cube on its platform in the middle, the sheets circling it */
.rc-orbit{ position:relative; height:690px; margin-top:-24px; transition:height .4s cubic-bezier(.2,.8,.2,1); perspective:1400px; perspective-origin:50% 28%; cursor:grab; touch-action:pan-y; user-select:none; }
.rc-orbit.is-drag{ cursor:grabbing; }
/* while the ring turns the glass blur rests, so the turn stays smooth; it returns when the ring settles */
.rc-orbit.is-turning .rc-sheet{ -webkit-backdrop-filter:none; backdrop-filter:none; transition:none; }
.rc-sheet{ transition:-webkit-backdrop-filter .3s, backdrop-filter .3s; }
.rc-sheet:not(.is-cur){ contain:paint; }
#view-record{ overflow-x:hidden; }
/* the ground: the Intercept's Midnight Glow field */
/* the whole column, header included, sits on the Intercept's field while the Record is open; the header loses its band */
body:has(#view-record:not(.hidden)) #content-wrap{ background:radial-gradient(70% 55% at 50% 0%,rgba(14,58,107,.92) 0%,rgba(0,31,63,.94) 40%,rgba(3,16,31,.96) 100%); }
body:has(#view-record:not(.hidden)) #content-wrap > header{ background:transparent !important; border-bottom:0 !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; box-shadow:none !important; }
body:has(#view-record:not(.hidden)) #content-wrap > header::before, body:has(#view-record:not(.hidden)) #content-wrap > header::after{ display:none !important; }
/* the pad (ref pin 112027110690036948): rings of light on the floor, beams and motes rising; drawn, not pictured */
.rc-core{ position:absolute; left:50%; top:600px; width:0; height:0; z-index:1; }
.rc-pad{ position:absolute; left:-380px; top:-120px; width:760px; height:240px; pointer-events:none; }
.rc-pad span{ position:absolute; left:50%; top:50%; border-radius:50%; transform:translate(-50%,-50%); border:1px solid rgba(0,191,255,.55); box-shadow:0 0 18px rgba(0,191,255,.45),inset 0 0 24px rgba(0,191,255,.18); }
.rc-pad .r1{ width:760px; height:240px; border-color:rgba(0,191,255,.22); box-shadow:0 0 30px rgba(0,191,255,.18); }
.rc-pad .r2{ width:600px; height:190px; border-color:rgba(0,191,255,.35); border-style:dashed; }
.rc-pad .r3{ width:440px; height:140px; border-color:rgba(102,217,255,.6); box-shadow:0 0 26px rgba(0,191,255,.6),inset 0 0 30px rgba(0,191,255,.25); }
.rc-pad .r4{ width:300px; height:96px; border-color:rgba(184,236,255,.8); box-shadow:0 0 32px rgba(102,217,255,.8),inset 0 0 40px rgba(102,217,255,.35); }
.rc-pad .core{ width:180px; height:58px; border:0; background:radial-gradient(50% 50% at 50% 50%,rgba(220,246,255,.9),rgba(0,191,255,.5) 45%,transparent 72%); box-shadow:0 0 60px rgba(0,191,255,.7); filter:blur(1px); }
.rc-beams{ position:absolute; left:-160px; bottom:0; width:320px; height:560px; pointer-events:none; filter:blur(5px);
  -webkit-mask:linear-gradient(180deg,transparent,#000 55%,#000 88%,rgba(0,0,0,.35)); mask:linear-gradient(180deg,transparent,#000 55%,#000 88%,rgba(0,0,0,.35)); }
.rc-beams b{ position:absolute; bottom:0; width:26px; height:100%; background:linear-gradient(180deg,rgba(0,191,255,0),rgba(0,191,255,.10) 55%,rgba(102,217,255,.30)); -webkit-mask:linear-gradient(90deg,transparent,rgba(0,0,0,.55) 30%,#000 50%,rgba(0,0,0,.55) 70%,transparent); mask:linear-gradient(90deg,transparent,rgba(0,0,0,.55) 30%,#000 50%,rgba(0,0,0,.55) 70%,transparent); transform-origin:50% 100%; }
.rc-beams b:nth-child(1){ left:40px; height:88%; transform:skewX(-6deg); } .rc-beams b:nth-child(2){ left:100px; width:34px; } .rc-beams b:nth-child(3){ left:150px; width:22px; height:96%; }
.rc-beams b:nth-child(4){ left:200px; width:32px; height:82%; } .rc-beams b:nth-child(5){ left:258px; height:90%; transform:skewX(6deg); }
.rc-motes{ position:absolute; left:-200px; bottom:0; width:400px; height:380px; pointer-events:none; }
.rc-motes i{ position:absolute; bottom:0; width:3px; height:3px; border-radius:50%; background:#dff4ff; box-shadow:0 0 8px rgba(102,217,255,.9); opacity:0; animation:rc-mote 4s linear infinite; }
/* fragments of the cube, rising out of the light and turning as they float */
.rc-frags{ position:absolute; left:0; bottom:0; width:0; height:0; pointer-events:none; --ics:56px; perspective:900px; }
.rc-frag{ position:absolute; bottom:-20px; margin-left:-28px; opacity:0; transform-style:preserve-3d; animation:rc-frag 10s linear infinite; }
@keyframes rc-frag{ 0%{ transform:translateY(0) scale(var(--fs)) rotateX(var(--rx)) rotateY(var(--ry)); opacity:0 } 10%{ opacity:.85 } 85%{ opacity:.6 } 100%{ transform:translateY(-520px) scale(var(--fs)) rotateX(calc(var(--rx) + 200deg)) rotateY(calc(var(--ry) + 260deg)); opacity:0 } }
@media (prefers-reduced-motion:reduce){ .rc-frag{ animation:none; opacity:.6; transform:translateY(calc(-60px - 25px * var(--fs) * 10)) scale(var(--fs)) rotateX(var(--rx)) rotateY(var(--ry)); } }
/* R6 · THE STRIP. One mark per call against the horizon: above it landed well,
   below it did not, on the line it is still open. No hue carries the meaning
   (§3); position does, which survives a screenshot and a colourblind reader.
   The line is the constitution's hairline, doing the job it does everywhere
   else: separation, the horizon, a level. */
/* the horizon is exactly as long as the record is: a line running past the last
   call would be a promise about calls that have not happened */
/* 2026-09-20, second pass. The first strip stated the law and then broke it:
   position was supposed to carry the whole meaning, but the marks below the line
   were drawn at .40 opacity against the ones above at .78, so opacity was quietly
   doing half the work — and doing it badly. On the dark ground the "went badly"
   run was all but invisible, which is exactly the half of the record that matters.
   Both sides are lit the same now. The side of the line is the only difference,
   as §3 requires, and the stems are thick enough and far enough apart to be a
   shape rather than a ruler. */
.rc-strip{ position:relative; display:flex; align-items:center; justify-content:center; flex-wrap:nowrap;
  gap:9px; height:72px; margin:6px auto 4px; width:max-content;
  max-width:calc(100% - 2*var(--room-pad,24px)); }
/* the horizon reads as a level, not a rule: it is strongest where the record is
   and gives out at both ends */
.rc-strip__line{ position:absolute; left:0; right:0; top:50%; height:1px; pointer-events:none;
  background:linear-gradient(90deg,rgba(127,211,255,0),rgba(127,211,255,.30) 12%,rgba(127,211,255,.30) 88%,rgba(127,211,255,0)); }
/* a mark may compress when the record is long, so the line stays as long as the
   record is and never has to be clipped to fit the room */
.rc-mark{ position:relative; width:11px; min-width:5px; flex:0 1 auto; height:58px;
  padding:0; border:0; background:none; cursor:pointer;
  display:grid; place-items:center; -webkit-tap-highlight-color:transparent; }
.rc-mark i{ display:block; width:3px; border-radius:1.5px; background:var(--ice2,#7FD3FF);
  transition:opacity var(--dur-2,240ms) ease, transform var(--dur-2,240ms) ease; }
/* landed well: the mark stands ABOVE the line. went badly: it hangs BELOW it.
   Same light on both, so the eye reads the side and nothing else. */
.rc-mark--up i{ height:18px; transform:translateY(-12px); opacity:.80; }
.rc-mark--down i{ height:18px; transform:translateY(12px); opacity:.80; }
/* still open: on the line, present and not yet counted. It is the one mark that
   is a dot rather than a stem, because it has no side to stand on yet. */
.rc-mark--open i{ height:5px; width:5px; border-radius:50%; opacity:.85;
  background:transparent; box-shadow:inset 0 0 0 1.5px rgba(190,235,255,.75); }
.rc-mark:hover i{ opacity:1; }
/* the one you are looking at: its stem at full light, and a ring where it meets
   the horizon, so the card on the front and its mark in the record are one thing */
.rc-mark.is-cur i{ opacity:1; }
.rc-mark.is-cur::after{ content:""; position:absolute; left:50%; top:50%; width:11px; height:11px; margin:-5.5px 0 0 -5.5px;
  border-radius:50%; background:transparent; box-shadow:inset 0 0 0 1.5px var(--ice,#00BFFF), 0 0 14px -2px rgba(0,191,255,.7); }
.rc-mark:focus-visible{ outline:2px solid var(--ice2); outline-offset:2px; border-radius:3px; }
@media (prefers-reduced-motion:reduce){ .rc-mark i{ transition:none; } }
@media (max-width:767px){
  .rc-strip{ height:76px; gap:6px; margin:10px auto 8px; }
  .rc-mark{ width:9px; min-width:4px; height:60px; }
  .rc-mark--up i{ height:18px; transform:translateY(-12px); }
  .rc-mark--down i{ height:18px; transform:translateY(12px); }
}
.rc-foot{ display:flex; align-items:center; justify-content:center; gap:28px; margin-top:-6px; }
.rc-foot__mid{ display:flex; flex-direction:row; align-items:baseline; justify-content:center; flex-wrap:wrap; column-gap:16px; row-gap:2px; min-width:220px; }
.rc-count{ margin:0; font:500 20px/1.15 var(--f-disp); letter-spacing:-.02em; color:rgb(var(--ink)); text-align:center; text-wrap:balance; }
.rc-count em{ font:italic 500 1.08em var(--f-em); color:#dff4ff; }
/* R5 · the open count is the way to the next open call. A text exit, not a control:
   no box, no fill, the same phrase it always was, with somewhere to go. */
.rc-open{ appearance:none; border:0; background:none; padding:0; margin:0; font:inherit; color:inherit;
  cursor:pointer; border-bottom:1px solid transparent; transition:border-color var(--dur-2,240ms) ease; }
.rc-open:hover{ border-bottom-color:var(--hair2,rgba(0,191,255,.22)); }
.rc-open:focus-visible{ outline:2px solid var(--ice2); outline-offset:3px; }
html[data-theme="light"] .rc-count em{ color:#0e4d78; }
@keyframes rc-mote{ 0%{ transform:translateY(0); opacity:0 } 12%{ opacity:.9 } 100%{ transform:translateY(-360px); opacity:0 } }
@media (prefers-reduced-motion:reduce){ .rc-motes i{ animation:none; opacity:.5; transform:translateY(-120px); } }
.rc-ring{ position:absolute; left:50%; top:0; width:0; height:0; transform-style:preserve-3d; z-index:2; } /* the sheets always paint over the pad; the pad reaches them only through the glass */
/* the sheets: the Intercept's frame, carrying the cube's fragments */
.rc-sheet{ position:absolute; left:-190px; top:0; width:380px; box-sizing:border-box; padding:56px 28px 22px; text-align:center; border-radius:24px; isolation:isolate;
  background:linear-gradient(150deg,rgba(0,191,255,.08),rgba(10,122,205,.06) 55%,rgba(255,255,255,.012));
  border:1px solid rgba(160,225,255,.16); -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 30px 70px -40px rgba(18,64,184,.95); will-change:transform,opacity; cursor:pointer; }
.rc-sheet::before{ content:""; position:absolute; inset:-1px; border-radius:inherit; z-index:-1; pointer-events:none;
  background:radial-gradient(60% 50% at 20% 0%,rgba(47,123,255,.22),transparent 70%),radial-gradient(50% 50% at 90% 100%,rgba(122,92,255,.18),transparent 70%); }
.rc-sheet.is-cur{ cursor:default; border-color:rgba(180,235,255,.28); }
.rc-sheet.is-held{ border-color:rgba(220,244,255,.5); box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 40px 80px -36px rgba(18,64,184,1),0 0 40px rgba(0,191,255,.18); }
/* the front sheet's foot is solid enough that the pad's rings do not run through the words */
.rc-sheet.is-cur::after{ content:""; position:absolute; inset:0; border-radius:inherit; z-index:-1; pointer-events:none; background:linear-gradient(180deg,transparent 45%,rgb(var(--container-low) / .78) 78%,rgb(var(--container-low) / .92)); }
.rc-q, .rc-q:hover{ text-decoration:none; border-bottom:0; }
.rc-sheet:not(.is-cur):hover{ border-color:rgba(180,235,255,.3); }
.rc-sheet .rc-stamp{ position:absolute; top:18px; left:22px; }
/* the writing arrives with nearness: --reveal runs 0 at the back to 1 at the front; the two neighbours read, the rest stay glass and fragments */
.rc-sheet .rc-stamp, .rc-sheet .rc-words, .rc-sheet .rc-pill, .rc-sheet .rc-num, .rc-sheet .rc-status{ opacity:var(--reveal,1); transform:translateY(calc((1 - var(--reveal,1)) * 10px)); transition:opacity .2s linear, transform .2s linear; }
.rc-sheet .rc-quiet, .rc-sheet .rc-more{ opacity:0; transform:translateY(8px); transition:opacity .35s cubic-bezier(.2,.8,.2,1), transform .35s cubic-bezier(.2,.8,.2,1); }
/* the actions arrive WITH the card's own writing, on the same --reveal the words use. They used to
   flip on the instant the card became the front one, so mid-turn one card showed its buttons while
   the card beside it still showed its words: two decisions talking at once. */
.rc-sheet.is-cur .rc-quiet, .rc-sheet.is-cur .rc-more{ opacity:var(--reveal,1); transform:none; }
.rc-sheet:not(.is-cur) .rc-quiet, .rc-sheet:not(.is-cur) .rc-more{ visibility:hidden; }
@media (prefers-reduced-motion:reduce){ .rc-sheet .rc-stamp, .rc-sheet .rc-words, .rc-sheet .rc-pill, .rc-sheet .rc-num, .rc-sheet .rc-status, .rc-sheet .rc-quiet, .rc-sheet .rc-more{ transition:none; transform:none; } }
.rc-sheet:not(.is-cur) .rc-parts{ opacity:1; }
@media (prefers-reduced-motion:reduce){ .rc-sheet .rc-stamp, .rc-sheet .rc-words, .rc-sheet .rc-pill, .rc-sheet .rc-num, .rc-sheet .rc-status, .rc-sheet .rc-quiet, .rc-sheet .rc-more{ transition:none; transform:none; } }
.rc-parts{ position:relative; width:150px; height:88px; margin:2px auto 0; perspective:700px; --ics:52px; }
.rc-parts[data-lean="1"]{ --lean:-8deg; } .rc-parts[data-lean="2"]{ --lean:-14deg; } .rc-parts[data-empty] .ic-face{ opacity:.45; }
.rc-part{ opacity:.9; } .rc-sheet .ic-hero{ display:none; } /* the cube itself stands in the middle; the sheets carry its fragments */
.rc-words{ margin:0; font:500 30px/1.06 var(--f-disp); letter-spacing:-.025em; color:rgb(var(--ink)); text-wrap:balance; }
.rc-pill{ display:inline-flex; align-items:center; gap:10px; margin-top:14px; padding:0 16px; min-height:36px; border-radius:999px; font:400 13px var(--f-body); color:rgb(var(--ink2)); letter-spacing:.02em;
  border:1px solid rgba(160,225,255,.16); background:rgba(0,191,255,.05); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.rc-num{ display:flex; align-items:baseline; justify-content:center; gap:8px; margin-top:2px; }
.rc-n{ font:300 64px/1 var(--f-body); letter-spacing:-.05em; color:rgb(var(--ink)); font-variant-numeric:tabular-nums; } .rc-n[data-empty]{ color:rgb(var(--ink3)); }
.rc-nl{ font:400 14px var(--f-body); color:rgb(var(--ink3)); }
.rc-num--none{ min-height:64px; align-items:center; } .rc-num--none .rc-nl{ font-size:15px; }
.rc-status{ margin:14px 0 0; font:500 26px/1.1 var(--f-disp); letter-spacing:-.022em; color:rgb(var(--ink)); text-wrap:balance; }
.rc-status em{ font:italic 500 1.08em var(--f-em); color:#dff4ff; }
/* R1 · the number under the comparison, the instant a decision closes. Evidence sits
   on the sheet behind a hairline, never in a second frame (constitution §4). */
.rc-said{ margin:12px auto 0; max-width:34ch; padding-top:12px; border-top:1px solid var(--hair,rgba(0,191,255,.10));
  font:400 14px/1.5 var(--f-body); color:rgb(var(--ink2)); font-variant-numeric:tabular-nums;
  opacity:var(--reveal,1); transition:opacity .2s linear; }
/* R3 · the falsifier asked at close: their own words back, then one answer */
.rc-fx{ margin:12px auto 0; max-width:34ch; padding-top:12px; border-top:1px solid var(--hair,rgba(0,191,255,.10)); opacity:var(--reveal,1); }
.rc-fx__q{ margin:0; font:400 14px/1.5 var(--f-body); color:rgb(var(--ink2)); }
.rc-fx .rc-quiet{ margin-top:6px; }
.rc-said--fx{ border-top:0; padding-top:0; margin-top:6px; color:rgb(var(--ink3)); }
.rc-quiet{ display:flex; justify-content:center; flex-wrap:wrap; gap:0 22px; margin-top:10px; }
/* THE BLIND SPOT ANSWERED (2026-09-20) · constitution §9: options are tappable
   words inside ONE pill, never a button group. Three answers in the .rc-quiet row
   wrapped at 34ch and orphaned the third on its own line. The pill is the sheet's
   own recipe (.rc-pill) at an interactive height, so the answer reads as one
   object rather than three controls competing for the eye. */
.rc-ans{ display:flex; justify-content:center; margin-top:10px; }
.rc-ans__pill{ display:inline-flex; align-items:center; max-width:100%; padding:0 4px; min-height:44px;
  border-radius:999px; border:1px solid rgba(160,225,255,.16); background:rgba(0,191,255,.05);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.rc-ans__pill .rc-q{ min-height:42px; padding:0 13px; font-size:13px; letter-spacing:.02em; border-radius:999px; white-space:nowrap; }
.rc-ans__sep{ flex:0 0 auto; width:1px; height:14px; background:rgba(160,225,255,.18); }
@media (max-width:420px){ .rc-ans__pill .rc-q{ padding:0 10px; font-size:12.5px; } }

.rc-more{ margin-top:6px; text-align:center; } .rc-more p{ margin:6px 0; font:400 14px/1.5 var(--f-body); color:rgb(var(--ink2)); }
.rc-stamp{ font:400 13px var(--f-body); color:rgb(var(--ink3)); }
/* empty */
.rc-empty{ padding:24px; text-align:center; }
.rc-empty .rc-status{ font:400 15px var(--f-body); color:rgb(var(--ink2)); margin-top:10px; }
/* arrival */
@keyframes rc-rise{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }
.rc-in .rc-foot{ animation:rc-rise .5s .2s cubic-bezier(.2,.8,.2,1) both; }
.rc-in .rc-orbit{ animation:rc-rise .6s .08s cubic-bezier(.2,.8,.2,1) both; }
/* add a decision: the existing form, in a sheet */
.rc-add{ position:fixed; inset:0; z-index:60; display:none; align-items:center; justify-content:center; padding:24px 16px;
  background:radial-gradient(70% 55% at 50% 0%,rgba(14,58,107,.92) 0%,rgba(0,31,63,.94) 40%,rgba(3,16,31,.96) 100%); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
.rc-add.on{ display:flex; }
.rc-add__frame{ position:relative; width:100%; max-width:560px; max-height:calc(100dvh - 48px); overflow-y:auto; padding:64px 40px 32px; border-radius:24px; isolation:isolate; text-align:center;
  background:linear-gradient(150deg,rgba(0,191,255,.08),rgba(10,122,205,.06) 55%,rgba(255,255,255,.012)); border:1px solid rgba(160,225,255,.16);
  -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 30px 70px -40px rgba(18,64,184,.95); }
.rc-add__frame::before{ content:""; position:absolute; inset:-1px; border-radius:inherit; z-index:-1; pointer-events:none;
  background:radial-gradient(60% 50% at 20% 0%,rgba(47,123,255,.22),transparent 70%),radial-gradient(50% 50% at 90% 100%,rgba(122,92,255,.18),transparent 70%); }
.rc-add__x{ position:absolute; top:14px; right:14px; border:0; background:transparent; box-shadow:none; }
.rc-add__body{ text-align:left; margin-top:18px; }
.rc-add__body details > summary{ display:none; }
.rc-add__body .dc-fold__body{ padding:0; border:0; }
/* light theme */
html[data-theme="light"] .rc-sheet, html[data-theme="light"] .rc-add__frame{ background:linear-gradient(150deg,rgba(255,255,255,.72),rgba(255,255,255,.55)); border-color:rgba(15,40,70,.14); box-shadow:inset 0 1px 0 #fff,0 30px 70px -40px rgba(18,64,184,.35); }
html[data-theme="light"] .rc-sheet::before, html[data-theme="light"] .rc-add__frame::before{ background:radial-gradient(60% 50% at 20% 0%,rgba(47,123,255,.14),transparent 70%),radial-gradient(50% 50% at 90% 100%,rgba(122,92,255,.10),transparent 70%); }
html[data-theme="light"] .rc-status em{ color:#0e4d78; }
html[data-theme="light"] .rc-disc{ border-color:rgba(15,40,70,.18); background:rgba(15,40,70,.04); }
html[data-theme="light"] .rc-add{ background:radial-gradient(70% 55% at 50% 0%,rgba(226,236,246,.94),rgba(243,246,250,.96) 60%); }
/* the old ledger block on Decide: the ledger lives here now; DOM kept, the form travels */
#view-simulator .dc-record{ display:none; }
/* phone */
@media (max-width:767px){
  .rc-head{ gap:10px; } .rc-meta{ flex-basis:100%; order:3; font-size:12px; } .rc-tools{ margin-left:auto; }
  .rc-orbit{ height:600px; }
  .rc-core{ top:560px; } .rc-beams{ height:420px; }
  /* the pad on a phone (2026-09-23 phone walk): a 760px ring scaled to .55 was still
     418px on a 390px screen, and cut harder on a 360px one. Sized in screen widths
     instead, same proportions, so the outer ring always sits inside the glass. */
  .rc-pad{ transform:none; width:96vw; height:30.3vw; left:-48vw; top:-15.15vw; }
  .rc-pad .r1{ width:96vw; height:30.3vw; } .rc-pad .r2{ width:75.8vw; height:24vw; }
  .rc-pad .r3{ width:55.6vw; height:17.7vw; } .rc-pad .r4{ width:37.9vw; height:12.1vw; }
  .rc-pad .core{ width:22.7vw; height:7.3vw; }
  .rc-motes{ height:320px; width:min(400px,92vw); left:max(-200px,-46vw); }
  .rc-orbit .rc-sheet{ width:86vw; left:-43vw; padding:50px 22px 20px; }
  .rc-foot{ gap:14px; } .rc-count{ font-size:18px; } .rc-foot__mid{ min-width:0; flex-direction:column; align-items:center; column-gap:0; }
  #view-record{ padding-bottom:calc(var(--tab-h,60px) + 28px + env(safe-area-inset-bottom,0px)) !important; }
  .rc-words{ font-size:26px; } .rc-n{ font-size:56px; } .rc-status{ font-size:23px; }
  .rc-add__frame{ max-width:100%; max-height:100dvh; height:100dvh; border-radius:0; border:0; padding:calc(56px + env(safe-area-inset-top,0px)) 22px calc(24px + env(safe-area-inset-bottom,0px)); }
  .rc-add{ padding:0; }
}
@media (max-width:1023px) and (max-height:520px){ .rc-core{ display:none; } .rc-orbit{ height:420px; } }
html[data-theme="light"] body:has(#view-record:not(.hidden)) #content-wrap{ background:radial-gradient(70% 55% at 50% 0%,rgba(226,236,246,.94),rgba(243,246,250,.96) 60%); }
html[data-theme="light"] .rc-pad span{ border-color:rgba(17,98,137,.5); box-shadow:0 0 14px rgba(17,98,137,.25); } html[data-theme="light"] .rc-pad .core{ background:radial-gradient(50% 50% at 50% 50%,rgba(17,98,137,.55),transparent 72%); box-shadow:none; }
html[data-theme="light"] .rc-beams b{ background:linear-gradient(180deg,transparent,rgba(17,98,137,.12) 55%,rgba(17,98,137,.25)); } html[data-theme="light"] .rc-motes i{ background:#116289; box-shadow:none; }
@media (prefers-reduced-motion:reduce){ .rc-in .rc-head, .rc-in .rc-orbit, .rc-now--in{ animation:none; } .rc-cube .ic-hero{ transition:none; } }

/* ── 20. THE RADAR (Phase 6) — the longitudinal surface. The line is the hero:
       readings against the operator's own baseline band, composed days hollow,
       decisions as ticks beneath. No grid, no legend, no cards. The legacy
       Decisions Radar keeps its ids behind "Decisions on your plate". ── */
body:has(#view-radar:not(.hidden)) #content-wrap{ background:radial-gradient(70% 55% at 50% 0%,rgba(14,58,107,.92) 0%,rgba(0,31,63,.94) 40%,rgba(3,16,31,.96) 100%); }
body:has(#view-radar:not(.hidden)) #content-wrap > header{ background:transparent !important; border-bottom:0 !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; box-shadow:none !important; }
html[data-theme="light"] body:has(#view-radar:not(.hidden)) #content-wrap{ background:radial-gradient(70% 55% at 50% 0%,rgba(226,236,246,.94),rgba(243,246,250,.96) 60%); }
#view-radar:not(.hidden){ display:block !important; }
#view-radar{ width:100%; box-sizing:border-box; align-self:stretch; max-width:1080px; margin:0 auto;
  --rd-line:rgba(0,191,255,.85); --rd-dot:#66D9FF; --rd-halo:rgba(0,191,255,.2); --rd-faint:rgb(var(--ink3));
  --rd-teal:#7FD3FF; --rd-tealtext:#9fd9f5; --rd-ice:#00BFFF; --rd-bandhi:rgba(0,191,255,.13); --rd-bandlo:rgba(0,191,255,.05); }
html[data-theme="light"] #view-radar{ --rd-line:rgba(17,98,137,.85); --rd-dot:#116289; --rd-halo:rgba(17,98,137,.16); --rd-teal:#2f7ba3; --rd-tealtext:#0b4a69; --rd-ice:#116289; --rd-bandhi:rgba(17,98,137,.14); --rd-bandlo:rgba(17,98,137,.05); }
#view-radar:not(.rd-open) > section, #view-radar:not(.rd-open) > #radar-sentry{ display:none; }
#view-radar.rd-open > section, #view-radar.rd-open > #radar-sentry{ display:block; }
#rd-host{ padding-top:8px; }
.rd-stamp{ margin:0; font:400 13px var(--f-body); color:rgb(var(--ink3)); }
.rd-title{ margin:10px 0 4px; font:500 40px/1.05 var(--f-disp); letter-spacing:-.025em; color:rgb(var(--ink)); }
.rd-state{ margin:0 0 26px; font:500 22px/1.2 var(--f-disp); letter-spacing:-.02em; color:rgb(var(--ink)); max-width:32ch; text-wrap:balance; }
.rd-line{ display:block; width:100%; height:auto; }
.rd-line .rd-t3, .rd-caption{ font:400 12px var(--f-body); }
.rd-line .rd-t3{ fill:rgb(var(--ink3)); }
.rd-line .rd-t2{ font:400 14px var(--f-body); fill:rgb(var(--ink2)); }
.rd-line .rd-num{ font:300 46px var(--f-body); fill:rgb(var(--ink)); letter-spacing:-.05em; font-variant-numeric:tabular-nums; }
.rd-line .rd-numlab{ font:400 14px var(--f-body); fill:rgb(var(--ink3)); }
.rd-line .rd-ghost{ font:200 150px var(--f-body); fill:var(--rd-ice); letter-spacing:-.06em; }
@media (max-width:767px){ .rd-line .rd-ghost{ font-size:96px; } }
.rd-caption{ margin:6px 0 0; color:rgb(var(--ink3)); }
.rd-interp{ margin:26px 0 0; font:500 26px/1.15 var(--f-disp); letter-spacing:-.022em; color:rgb(var(--ink)); max-width:30ch; text-wrap:balance; }
.rd-interp em{ font:italic 500 1.08em var(--f-em); color:#dff4ff; }
html[data-theme="light"] .rd-interp em{ color:#0e4d78; }
.rd-rows{ margin-top:34px; max-width:none; }
.rd-row{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:13px 2px; border-top:1px solid var(--hair); font:400 15px/1.5 var(--f-body); color:rgb(var(--ink)); }
.rd-prov{ font:400 13px var(--f-body); color:rgb(var(--ink3)); white-space:nowrap; }
.rd-watch{ margin:26px 0 0; font:400 14px/1.6 var(--f-body); color:rgb(var(--ink2)); }
.rd-watch b{ color:rgb(var(--ink)); font-weight:500; }
.rd-watch .rd-prov{ display:inline; margin-left:8px; }
/* 08-01 panels: a breath lighter than the field, hairline edge, title top-left */
html[data-theme="light"] html[data-theme="light"] /* the instrument stands in the open field: corner ticks, no card (approved composition, 09-01) */
.rd-inst{ position:relative; margin-top:34px; }
.rd-ck{ position:absolute; width:18px; height:18px; border:1px solid var(--hair3); pointer-events:none; }
.rd-ck--tl{ left:-6px; top:-6px; border-right:0; border-bottom:0; }
.rd-ck--br{ right:-6px; bottom:-6px; border-left:0; border-top:0; }
.rd-ret{ animation:rd-pulse 6s ease-in-out infinite; }
@keyframes rd-pulse{ 0%,100%{ opacity:.45; } 50%{ opacity:.62; } }
.rd-draw{ stroke-dasharray:1; stroke-dashoffset:1; animation:rd-drawin .6s .15s cubic-bezier(.2,.8,.2,1) forwards; }
@keyframes rd-drawin{ to{ stroke-dashoffset:0; } }
@media (prefers-reduced-motion:reduce){ .rd-ret{ animation:none; opacity:.5; } .rd-draw{ animation:none; stroke-dashoffset:0; } }
.rd-links{ margin-top:34px; display:flex; flex-wrap:wrap; gap:10px; }
.rd-q{ min-height:44px; display:inline-flex; align-items:center; padding:0 18px; cursor:pointer;
  font:500 14px var(--f-body); color:rgb(var(--ink)); border-radius:999px;
  border:1px solid rgba(160,225,255,.26); background:rgba(140,220,255,.05);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  transition:background .2s, border-color .2s, box-shadow .2s; }
.rd-q:hover{ background:rgba(140,220,255,.12); border-color:rgba(180,235,255,.5); box-shadow:inset 0 1px 0 rgba(255,255,255,.2); }
.rd-q:active{ opacity:.7; }
.rd-q--dim{ color:rgb(var(--ink2)); }
.rd-q[aria-expanded="true"]{ background:rgba(140,220,255,.16); border-color:rgba(180,235,255,.5); }
.rd-q:focus-visible{ outline:2px solid var(--ice2); outline-offset:3px; }
html[data-theme="light"] .rd-q{ border-color:rgba(15,40,70,.18); background:rgba(15,40,70,.04); }
html[data-theme="light"] .rd-q:hover, html[data-theme="light"] .rd-q[aria-expanded="true"]{ background:rgba(15,40,70,.09); border-color:rgba(15,40,70,.3); }
@keyframes rd-rise{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
.rd-in > *{ animation:rd-rise .5s cubic-bezier(.2,.8,.2,1) both; }
.rd-in > *:nth-child(2){ animation-delay:.06s; } .rd-in > *:nth-child(3){ animation-delay:.12s; }
.rd-in > *:nth-child(4){ animation-delay:.18s; } .rd-in > *:nth-child(5){ animation-delay:.24s; }
.rd-in > *:nth-child(6){ animation-delay:.3s; } .rd-in > *:nth-child(7){ animation-delay:.36s; }
@media (prefers-reduced-motion:reduce){ .rd-in > *{ animation:none; } }
@media (max-width:767px){
  .rd-title{ font-size:32px; }
  .rd-line .rd-num{ font-size:38px; }
    .rd-state{ font-size:18px; margin-bottom:18px; }
  .rd-interp{ font-size:21px; margin-top:20px; }
  .rd-row{ font-size:14px; flex-wrap:wrap; gap:2px 12px; } .rd-row .rd-prov{ white-space:normal; }
  .rd-links{ gap:8px; }
  .rd-inst{ margin-left:-24px; margin-right:-24px; }
  .rd-ck{ display:none; }
  #view-radar{ padding-bottom:calc(var(--tab-h,60px) + 28px + env(safe-area-inset-bottom,0px)) !important; }
}

/* ── 21. THE FIELD, EVERYWHERE (founder 09-01): the Record's ground under every room; the header dissolves into it ── */
#content-wrap{ background:radial-gradient(70% 55% at 50% 0%,rgba(14,58,107,.92) 0%,rgba(0,31,63,.94) 40%,rgba(3,16,31,.96) 100%); }
#content-wrap > header{ background:transparent !important; border-bottom:0 !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; box-shadow:none !important; }
#content-wrap > header::before, #content-wrap > header::after{ display:none !important; }
html[data-theme="light"] #content-wrap{ background:radial-gradient(70% 55% at 50% 0%,rgba(226,236,246,.94),rgba(243,246,250,.96) 60%); }

/* ── 22. THE TYPE LAW (founder 09-01): the Intercept's voice in every room.
       Headings Syne 500 tight; numbers Manrope 300 tabular; no heavy bold shouting. ── */
#content-wrap .view h1:not(.overline), #content-wrap .view h2:not(.overline), #content-wrap .view h3:not(.overline){
  font-family:var(--f-disp); font-weight:500; letter-spacing:-.02em; text-transform:none; }
#content-wrap .view .stat-num, #content-wrap .view .big-num{ font-family:var(--f-body); font-weight:300; letter-spacing:-.05em; font-variant-numeric:tabular-nums; }
#content-wrap .view b, #content-wrap .view strong{ font-weight:600; }

/* ── 23. CONFORMANCE (founder 09-01): every legacy control folds into the Intercept family ── */
.brief-recal-btn, .recal-btn{ border-radius:999px !important; border:1px solid rgba(160,225,255,.26) !important; background:rgba(140,220,255,.05) !important;
  color:rgb(var(--ink)) !important; font:500 14px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; min-height:44px; }
.brief-recal-btn:hover, .recal-btn:hover{ background:rgba(140,220,255,.12) !important; }
.adm-btn{ border-radius:999px !important; font:500 12px var(--f-body) !important; letter-spacing:0 !important;
  border:1px solid var(--hair2) !important; background:transparent !important; color:rgb(var(--ink2)) !important; }
.adm-btn:hover:not(:disabled){ background:rgba(140,220,255,.08) !important; color:rgb(var(--ink)) !important; }
.adm-btn-primary{ border-color:rgba(160,225,255,.26) !important; background:rgba(140,220,255,.05) !important; color:rgb(var(--ink)) !important; }
/* quiet tertiary for every expansion / "open" / "more" link */
a[href="#record"], .more-link, .open-link{ background:transparent !important; border:0 !important; color:rgb(var(--ink2)) !important; font:500 14px var(--f-body) !important; }

/* ── 24. YOU / SIGNATURE conformance (founder 09-01): the tile grid becomes quiet ledger rows ── */
#sig-fns{ display:block !important; }
#sig-fns > div{ background:transparent !important; border:0 !important; border-top:1px solid var(--hair) !important;
  border-radius:0 !important; box-shadow:none !important; padding:14px 2px !important; margin:0 !important; }
#sig-fns > div:hover{ background:var(--s-subtle) !important; }

/* the sheet speaks in the room's own voice */
#ui-more{ padding:22px 28px calc(22px + env(safe-area-inset-bottom,0px)); }
#ui-more .ui-more__head{ display:flex; align-items:baseline; justify-content:space-between; margin:0 0 6px; }
#ui-more .ui-more__head .ui-label{ font:500 18px var(--f-disp); letter-spacing:-.01em; text-transform:none; color:rgb(var(--ink)); }
#ui-more h3{ font:500 14px var(--f-disp); margin-top:18px; }
#ui-more .ui-more__item[aria-current="page"]{ box-shadow:inset 0 1px 0 rgba(255,255,255,.18), var(--glow-1); }

/* the sheet's scrollbar: a thin ice thread, not the OS bar */
.ui-sheet{ scrollbar-width:thin; scrollbar-color:rgba(0,191,255,.28) transparent; }
.ui-sheet::-webkit-scrollbar{ width:4px; }
.ui-sheet::-webkit-scrollbar-track{ background:transparent; margin:28px 0 28px; }
.ui-sheet::-webkit-scrollbar-thumb{ background:rgba(0,191,255,.18); border-radius:2px; }
.ui-sheet::-webkit-scrollbar-thumb:hover{ background:rgba(0,191,255,.45); }

/* ── the Continue cards: the Record's glass, not flat boxes (founder 09-01) ── */
.pf-onward{ min-height:64px; padding:14px 22px; border-radius:18px;
  border:1px solid rgba(160,225,255,.26); background:rgba(140,220,255,.05);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
  transition:background var(--dur-1), border-color var(--dur-1), box-shadow var(--dur-1); }
.pf-onward:hover{ background:rgba(140,220,255,.12); border-color:rgba(180,235,255,.5); box-shadow:inset 0 1px 0 rgba(255,255,255,.18), var(--glow-1); }
.pf-onward:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; }
html[data-theme="light"] .pf-onward{ border-color:rgba(15,40,70,.18); background:rgba(15,40,70,.04); box-shadow:none; }
html[data-theme="light"] .pf-onward:hover{ background:rgba(15,40,70,.09); border-color:rgba(15,40,70,.3); }

/* the Continue arrow becomes the Record's glass disc; flat action rows take the pill */
.pf-onward svg{ width:16px; height:16px; padding:11px; box-sizing:content-box; border-radius:50%;
  border:1px solid rgba(160,225,255,.26); background:rgba(140,220,255,.05);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10); transition:background var(--dur-1), border-color var(--dur-1); }
.pf-onward:hover svg{ background:rgba(140,220,255,.14); border-color:rgba(180,235,255,.5); }
html[data-theme="light"] .pf-onward svg{ border-color:rgba(15,40,70,.18); background:rgba(15,40,70,.04); box-shadow:none; }
#sig-share, #sig-card{ border-radius:999px !important; border:1px solid rgba(160,225,255,.26) !important; background:rgba(140,220,255,.05) !important;
  color:rgb(var(--ink)) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.10); min-height:46px;
  transition:background var(--dur-1), border-color var(--dur-1); }
#sig-share:hover, #sig-card:hover{ background:rgba(140,220,255,.12) !important; border-color:rgba(180,235,255,.5) !important; }
html[data-theme="light"] #sig-share, html[data-theme="light"] #sig-card{ border-color:rgba(15,40,70,.18) !important; background:rgba(15,40,70,.04) !important; box-shadow:none; }

/* ── 25. GLOBAL RESET (founder 09-02): legacy Tailwind white borders/washes fold into the
       instrument's hairline language; the marketing sheen dies; light is structural. ── */
[class*="border-white/"]{ border-color:var(--hair) !important; }
[class*="hover:border-"]:hover{ border-color:var(--hair2) !important; }
[class*="bg-white/"]{ background-color:var(--s-subtle) !important; }
[class*="hover:bg-white/"]:hover{ background-color:rgba(0,191,255,.06) !important; }
.sheen::before, .sheen::after{ display:none !important; animation:none !important; }
/* quiet tertiary continue row */
.pf-next{ display:flex; flex-wrap:wrap; gap:6px 34px; align-items:baseline; padding-top:18px; border-top:1px solid var(--hair); }
.pf-next button{ display:inline-flex; align-items:baseline; gap:8px; min-height:44px; border:0; background:transparent; padding:0 2px; cursor:pointer;
  font:500 15px var(--f-body); color:rgb(var(--ink2)); transition:color var(--dur-1); }
.pf-next button:hover{ color:rgb(var(--ink)); }
.pf-next button:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; }
.pf-next button .pf-d{ font:400 13px var(--f-body); color:rgb(var(--ink3)); }
.pf-next .pf-lab{ font:400 13px var(--f-body); color:rgb(var(--ink3)); flex-basis:100%; }

.rd-legend{ margin:10px 0 0; font:400 12px var(--f-body); color:rgb(var(--ink3)); }

/* ── 26. THE ICON LIGHT (founder 09-02, her pin): every icon carries the azure-to-ice
       gradient with soft glow; the active destination burns brighter. ── */
#ui-rail .ui-dest svg, #ui-tabbar .ui-dest svg{ stroke:url(#ai-grad); stroke-width:1.9;
  filter:drop-shadow(0 0 4px rgba(0,191,255,.35)); }
#ui-rail .ui-dest:hover svg, #ui-tabbar .ui-dest:hover svg{ filter:drop-shadow(0 0 7px rgba(0,191,255,.55)); }
#ui-rail .ui-dest[aria-current="page"] svg, #ui-tabbar .ui-dest[aria-current="page"] svg{
  stroke:url(#ai-grad); filter:drop-shadow(0 0 9px rgba(0,191,255,.8)); }
.ui-disc svg, .rc-disc svg, .theme-toggle svg, #notif-bell svg, #ui-more-btn svg, .pf-onward svg, .nm-btn svg{
  stroke:url(#ai-grad); filter:drop-shadow(0 0 4px rgba(0,191,255,.3)); }
.ui-disc svg circle[fill="currentColor"], #ui-more-rail svg circle{ fill:url(#ai-grad); stroke:none; }
#ui-more .ui-more__item svg, .card svg, .brief-row svg{ stroke:url(#ai-grad); }
html[data-theme="light"] #ui-rail .ui-dest svg, html[data-theme="light"] #ui-tabbar .ui-dest svg,
html[data-theme="light"] .ui-disc svg, html[data-theme="light"] .rc-disc svg,
html[data-theme="light"] .theme-toggle svg, html[data-theme="light"] #notif-bell svg{
  stroke:url(#ai-grad-light); filter:none; }

/* ── 27. OVERVIEW, INBOXED (founder 09-04): the whole overview stands in ONE instrument
       frame — a single box, internally divided by hairlines, nothing scattered. ── */
#view-overview{ max-width:1180px; margin:0 auto; }
#view-overview > *:first-child{ margin-top:0; }
#view-overview{ border:1px solid rgba(160,225,255,.16); border-radius:24px;
  background:linear-gradient(150deg,rgba(0,191,255,.03),rgba(10,122,205,.02) 60%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 40px 90px -50px rgba(18,64,184,.8);
  padding:28px 32px !important; }
#view-overview > section, #view-overview > div{ border-top:1px solid var(--hair); padding-top:24px; margin-top:24px; }
#view-overview #ov-situation-inner{ border:0 !important; border-radius:12px; }
#view-overview [class*="rounded"]{ box-shadow:none; }
#view-overview > section:first-child, #view-overview > div:first-child{ border-top:0; padding-top:0; margin-top:0; }
#view-overview .card, #view-overview .card-hero{ border:0 !important; background:transparent !important; box-shadow:none !important; }
html[data-theme="light"] #view-overview{ border-color:rgba(15,40,70,.14); background:rgba(255,255,255,.5); box-shadow:none; }
@media (max-width:767px){ #view-overview{ border:0; border-radius:0; padding:18px !important; box-shadow:none; } }

/* ── 28. DECIDE AS THE HUB (founder 09-06, her reference): the whole room one floating
       frame over the field; dialogue column left, luminous instrument column right. ── */
#view-simulator{ max-width:1280px; margin:0 auto; border:1px solid rgba(160,225,255,.16); border-radius:24px;
  background:linear-gradient(150deg,rgba(0,191,255,.03),rgba(10,122,205,.02) 60%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 40px 90px -50px rgba(18,64,184,.8);
  padding:28px 32px !important; }
#view-simulator .card, #view-simulator .card-hero{ border:0 !important; background:transparent !important; box-shadow:none !important; }
/* the stage (her reference, 09-06): the instrument spans the hub; the value dominates;
   the dialogue sits beneath. Intercept/Record remain the standard for every material. */
#view-simulator .dc{ max-width:none; }
#view-simulator .dc-head{ border-bottom:1px solid var(--hair); padding-bottom:18px; }
@media (min-width:1024px){
  #view-simulator .dc{ grid-template-areas:"head head" "side side" "main main" "record record"; }
}
#view-simulator .dc-side{ position:relative; overflow:hidden; text-align:left; align-items:stretch;
  border:1px solid rgba(160,225,255,.16); border-radius:20px; padding:26px 36px 30px;
  background:radial-gradient(80% 120% at 30% 0%,rgba(14,58,107,.55),rgba(0,20,42,.85) 65%),rgba(0,16,34,.6); }
#view-simulator .dc-side::before{ content:''; position:absolute; left:8%; right:8%; top:-1px; height:1px;
  background:linear-gradient(90deg,transparent,rgba(0,191,255,.55),transparent); }
@media (min-width:1024px){
  #view-simulator .dc-side{ display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-areas:"step step" "gauge read"; column-gap:56px; align-items:center; }
  #view-simulator .dc-side .dc-step{ grid-area:step; }
  #view-simulator .dc-side .dc-gauge{ grid-area:gauge; padding-left:12px; }
  #view-simulator .dc-side .dc-read{ grid-area:read; text-align:left; max-width:560px; }
  #view-simulator .dc-side .dc-verdict{ max-width:none; margin:var(--sp-3) 0 var(--sp-2); }
}
#view-simulator .dc-side .dc-read .pill{ margin-top:2px; }
html[data-theme="light"] #view-simulator{ border-color:rgba(15,40,70,.14); background:rgba(255,255,255,.5); box-shadow:none; }
@media (max-width:767px){ #view-simulator{ border:0; border-radius:0; padding:18px !important; box-shadow:none; } }

/* ── 29. MIDNIGHT GLOW ROOMS (founder 09-06): the palette and the atmosphere of the
       Midnight Glow reference, applied ONLY to Today, Decide, Radar, You and the More sheet.
       Intercept and Record are the benchmark and are not touched by anything below: their
       ids never appear here, their field rule (section 19) keeps its own colours, and the
       Intercept overlay lives outside the scoped rooms. Form language is copied from the
       two benchmark screens: one glass frame, Syne 500 headings, Manrope 300 numbers,
       one Cormorant italic phrase, pills in sentence case, quiet text exits. ── */

/* the tokens, re-based on the reference swatches: Surface #0F1724 · Midnight Blue #0B1E33 ·
   Deep Slate #1A2A3F · Graphite #4B5B6B · Blue Glow #1F7EDB · Ice Blue #7FD3FF */
/* The Midnight Glow token blocks that stood here scoped these colours to five rooms
   only. Founder ruling 2026-09-14: they are the canonical palette for the whole app,
   so they now live in css/tokens.css on :root. A token is declared in one place. */


/* the field: deeper than the Record's, lit from above by the Blue Glow */
html:not([data-theme="light"]) body:has(:is(#view-brief,#view-simulator,#view-radar,#view-signature):not(.hidden)) #content-wrap{
  background:radial-gradient(70% 55% at 50% 0%,rgba(31,126,219,.34) 0%,rgba(11,30,51,.98) 44%,#0F1724 100%); }

/* the shared grammar inside the rooms */
:is(#view-brief,#view-simulator,#view-radar,#view-signature) .ui-chip,
:is(#view-brief,#view-simulator) .pill, #view-simulator #sim-tier{
  height:36px; padding:0 16px; border-radius:999px !important; font:500 13px/1 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important;
  border:1px solid var(--mg-pill-edge) !important; background:var(--mg-pill-bg) !important; color:rgb(var(--ink)) !important;
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:inset 0 1px 0 rgba(255,255,255,.10); }
:is(#view-brief,#view-simulator) .ui-chip::before{ width:6px; height:6px; opacity:.9; }
:is(#view-brief,#view-simulator,#view-radar,#view-signature) .ui-prov,
:is(#view-brief,#view-simulator,#view-radar,#view-signature) .ui-meta,
:is(#view-brief,#view-simulator,#view-radar,#view-signature) .ui-label{
  font:400 13px/1.4 var(--f-body); letter-spacing:0; text-transform:none; color:rgb(var(--ink3)); }
:is(#view-brief,#view-simulator,#view-radar,#view-signature) .ui-prov::before{ width:7px; height:7px; }
:is(#view-brief,#view-simulator,#view-radar,#view-signature,#view-practice,#view-uncertainty) .ui-btn--primary{
  min-width:200px; min-height:52px; font-weight:500; font-size:16px; color:#fff; border-color:rgba(127,211,255,.45);
  background:linear-gradient(115deg,#155FAF,#1F7EDB 55%,#124f95);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 14px 36px -12px rgba(31,126,219,.75); }
:is(#view-brief,#view-simulator,#view-radar,#view-signature,#view-practice,#view-uncertainty) .ui-btn--primary:hover{ border-color:rgba(200,236,255,.7); box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 18px 44px -12px rgba(31,126,219,.95); }
:is(#view-brief,#view-simulator,#view-signature,#view-practice,#view-uncertainty) .ui-btn:not(.ui-btn--primary){ color:rgb(var(--ink2)); font-weight:500; font-size:14px; }
:is(#view-brief,#view-simulator,#view-signature,#view-practice,#view-uncertainty) .ui-btn:not(.ui-btn--primary):hover{ color:rgb(var(--ink)); }
:is(#view-brief,#view-simulator,#view-signature) .ui-em{ color:#dff4ff; }
html[data-theme="light"] :is(#view-brief,#view-simulator,#view-signature) .ui-em{ color:#0e4d78; }

/* ── TODAY: the Intercept at rest. The cube stands in the open field, lit by today's state,
       the number beneath it, the verdict, one action. No frame: the room is the field itself.
       Below the fold, one column of quiet rows: the next heavy moment, why it reads this. ── */
#view-brief:not(.hidden){ display:block !important; }
#view-brief .td{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) !important; grid-template-areas:"state" "meaning" "side" "record";
  gap:0; max-width:none; margin:0; padding:0; text-align:center; background:none; border:0; box-shadow:none; border-radius:0;
  min-height:0; }
#view-brief .td::before{ display:none; }
#view-brief .td-head{ grid-area:auto; position:absolute; top:-8px; left:0; display:flex; gap:14px; align-items:center; text-align:left; }
#view-brief .td-head .ui-label{ font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); letter-spacing:0; text-transform:none; }
#view-brief .td-state{ grid-area:state; display:flex; flex-direction:column; align-items:center; padding-top:10px; }
#view-brief .td-state__top{ justify-content:center; margin:0; gap:14px; order:1; }
#view-brief .td-state__top .ui-chip{ height:36px; }
/* the cube: the Intercept's object (its face classes, untouched), scaled for a room */
#view-brief .td-cube{ --ics:124px; width:360px; height:296px; position:relative; perspective:1000px; perspective-origin:50% 45%; margin:4px auto 0; order:2; }
#view-brief .td-cube[data-lean="1"]{ --lean:-8deg; }
#view-brief .td-cube[data-lean="2"]{ --lean:-14deg; }
#view-brief .td-cube[data-empty] .ic-face{ opacity:.45; }
#view-brief .td-state .ui-value{ order:3; justify-content:center; align-items:baseline; gap:10px; margin-top:6px; }
#view-brief .td-state .ui-display{ font:300 clamp(72px,7vw,92px)/1 var(--f-body) !important; letter-spacing:-.05em; color:rgb(var(--ink)) !important; }
#view-brief .td-state .td-num--dim{ color:rgb(var(--ink3)) !important; }
#view-brief .td-state .ui-of{ font:400 15px var(--f-body); letter-spacing:0; color:rgb(var(--ink3)); }
#view-brief .td-what{ display:none; }
#view-brief .td-state .ui-delta{ order:4; margin-top:8px; font:400 13px var(--f-body); letter-spacing:0; color:rgb(var(--ink3)); }
#view-brief .td-meaning{ grid-area:meaning; display:flex; flex-direction:column; align-items:center; margin-top:10px; }
#view-brief .td-verdict{ font:500 clamp(26px,2.4vw,32px)/1.1 var(--f-disp) !important; letter-spacing:-.022em; color:rgb(var(--ink)) !important; max-width:22ch; text-wrap:balance; }
#view-brief .td-verdict em{ font:italic 500 1.08em var(--f-em); color:#dff4ff; }
html[data-theme="light"] #view-brief .td-verdict em{ color:#0e4d78; }
#view-brief .td-sub{ margin:12px 0 0; max-width:46ch; font-size:15px; line-height:1.55; color:rgb(var(--ink2)); }
#view-brief .td-stale{ color:rgb(var(--ink3)); }
#view-brief .td-actions{ justify-content:center; align-items:center; gap:18px; margin-top:24px; }
#view-brief .td-actions .ui-btn{ flex:none; }
/* below the fold: one quiet column */
#view-brief .td-side{ grid-area:side; display:grid; gap:0; width:100%; max-width:680px; margin:64px auto 0; text-align:left; }
#view-brief .ui-interrupt{ background:transparent; border:0; border-top:1px solid var(--hair); border-radius:0; padding:20px 2px 6px; gap:6px; }
#view-brief .ui-interrupt .ui-label{ color:rgb(var(--ink3)); }
#view-brief .ui-interrupt__basis{ font:500 15px/1.45 var(--f-body); color:rgb(var(--ink)); }
#view-brief .ui-interrupt__basis b{ font-weight:500; }
#view-brief .ui-interrupt__consequence{ font:400 14px/1.55 var(--f-body); color:rgb(var(--ink2)); }
#view-brief .ui-interrupt__actions{ margin-top:2px; }
#view-brief .ui-interrupt__actions .ui-btn{ padding:0 2px; min-height:44px; }
#view-brief .td-attn-wrap .ui-interrupt[data-rank="99"]{ display:none; }
/* THE EVIDENCE LINE inside the interrupt (2026-09-20, second pass). The watch
   states the hour; this says what that hour sits inside. It is quieter than the
   consequence it extends, because it is evidence and not a second conclusion. */
#view-brief .ui-interrupt__ev{ display:block; margin-top:4px; color:rgb(var(--ink3)); font-variant-numeric:tabular-nums; }

/* ONE TRUE LINE A DAY (2026-09-20) now closes the column, above the provenance
   row rather than in the middle of the stack. Quiet by construction: a line that
   shouts every morning is the one that gets ignored by the fifth. */
/* (The day's line is composed in css/room-today.css, which is where a room's
   own rules live. A second rule for it stood here — 14px ink3 with tabular
   figures, built for a number rather than for a sentence — and which of the two
   won depended on file order. One element, one rule, in the room's own file.) */

/* TONIGHT (2026-09-20). The ritual's own pill on Today, and the sheet it opens.
   Values copied off the running Record: the 34ch column, the hairline, the
   15px sentence at ink, and the answer pill from constitution §9. */
/* (.td-tonight retired 2026-09-20: the evening takes the room's one button
   rather than minting a second block. Nothing renders it; §1.5 removes it.) */
/* align-content, not the default stretch: a stretched grid row inflates the
   answer pill into a circle at border-radius:999px. justify-items is deliberately
   NOT set, because the sheet inserts its own title bar as a child of this element
   and centring every child squeezes the bar to the width of its own words. */
.tn{ margin:0 auto; padding:8px 2px 4px; display:grid; gap:10px;
  align-content:center; min-height:52vh; text-align:center; }
.tn .ui-label{ color:rgb(var(--ink3)); }
/* THE SENTENCE OF THE RITUAL (2026-09-20, design pass). It was 15px body — the
   rung of a caption — for the one sentence the whole sheet exists to ask about.
   A ritual with a caption at its centre is a form. It takes the sheet's own
   display ramp now, the same one the check ledger's claim uses two rooms away
   (.ck-claim, 20px Syne), so the same claim reads the same weight wherever the
   operator meets it. Measure tightened to 30ch to hold it at two lines (§2). */
.tn__say{ margin:0 auto; max-width:30ch; font:400 20px/1.35 var(--f-disp); letter-spacing:-.01em;
  color:rgb(var(--ink)); text-wrap:balance; }
@media (max-width:640px){ .tn__say{ font-size:18px; } }
.tn__ans{ display:flex; align-items:center; justify-content:center; margin-top:2px; }
.tn__pill{ display:inline-flex; align-items:center; flex:0 0 auto; max-width:100%; padding:0 4px; height:44px; min-height:44px;
  border-radius:999px; border:1px solid rgba(160,225,255,.16); background:rgba(0,191,255,.05);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.tn__pill .rc-q{ min-height:42px; padding:0 13px; font-size:13px; letter-spacing:.02em; border-radius:999px; white-space:nowrap; }
.tn__sep{ flex:0 0 auto; width:1px; height:14px; background:rgba(160,225,255,.18); }
.tn__act{ display:flex; flex-direction:column; align-items:center; gap:4px; margin-top:6px; }
@media (max-width:420px){ .tn__pill .rc-q{ padding:0 10px; font-size:12.5px; } }
/* the morning re-read (js/59): Tonight's sheet, ten numbers in its pill */
.rr-ask{ margin:4px auto 0; font:400 14px/1.5 var(--f-body); color:rgb(var(--ink2)); text-align:center; }
.rr-pill{ padding:0 2px; }
.tn__pill .rr-n{ padding:0; min-width:30px; font-size:14px; letter-spacing:0; font-variant-numeric:tabular-nums; }
.rr-sum{ margin:2px auto 0; max-width:40ch; font:400 14px/1.5 var(--f-body); color:rgb(var(--ink2)); text-align:center; }
/* the Ulysses clause (js/60): under each standing order, what the instrument understood */
.pr-read{ list-style:none; margin:10px 0 0; padding:0; display:grid; gap:8px; }
.pr-read li{ display:grid; gap:2px; font:400 13px/1.45 var(--f-body); color:rgb(var(--ink3)); }
.pr-read li b{ font-weight:500; color:rgb(var(--ink2)); }
@media (max-width:420px){ .tn__pill .rr-n{ min-width:27px; padding:0; } .rr-pill .tn__sep{ display:none; } }
#view-brief .td-evidence{ margin-top:14px; }
#view-brief .td-evidence .ui-head{ margin:0; padding:16px 2px 6px; border-top:1px solid var(--hair); }
#view-brief .td-evidence .ui-head .ui-label{ font:500 15px var(--f-disp); letter-spacing:-.01em; color:rgb(var(--ink)); }
#view-brief .td-evidence .ui-head .ui-meta{ font:400 13px var(--f-body); color:rgb(var(--ink3)); letter-spacing:0; }
#view-brief .td-evidence .ui-row{ grid-template-columns:1fr auto; gap:2px 16px; padding:11px 2px; border-bottom:0; border-top:1px solid var(--hair); }
#view-brief .td-evidence .ui-row:first-of-type{ border-top:0; }
#view-brief .td-evidence .ui-row__title{ font:400 15px/1.5 var(--f-body); color:rgb(var(--ink)); }
#view-brief .td-evidence .ui-row__right{ font:400 15px/1.5 var(--f-body); color:rgb(var(--ink)); }
#view-brief .td-evidence .ui-row__meta{ grid-column:1 / -1; }
#view-brief .td-record{ grid-area:record; width:100%; max-width:680px; margin:18px auto 0; }
#view-brief .td-record .ui-hair{ display:none; }
#view-brief .td-record__row{ justify-content:center; gap:8px 26px; padding-top:18px; border-top:1px solid var(--hair); }
#view-brief .td-record__row .ui-support{ color:rgb(var(--ink3)); font-size:14px; }
#view-brief .td-record__row .ui-chip{ height:auto; padding:0; border:0 !important; background:transparent !important; box-shadow:none; color:rgb(var(--ink3)) !important; font-size:14px !important; -webkit-backdrop-filter:none; backdrop-filter:none; }
#view-brief .td-record__row .ui-chip::before{ display:none; }
#view-brief .td-record__row .ui-btn{ margin-left:0; min-height:44px; }
/* entry: the stack rises, the cube is already there */
@keyframes td-rise{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
#view-brief .td-state__top, #view-brief .td-state .ui-value, #view-brief .td-state .ui-delta, #view-brief .td-meaning, #view-brief .td-side, #view-brief .td-record{ animation:td-rise .5s var(--ease-inst) both; }
#view-brief .td-state .ui-value{ animation-delay:.06s; } #view-brief .td-state .ui-delta{ animation-delay:.12s; } #view-brief .td-meaning{ animation-delay:.18s; } #view-brief .td-side{ animation-delay:.24s; } #view-brief .td-record{ animation-delay:.3s; }
@media (prefers-reduced-motion:reduce){ #view-brief .td *{ animation:none !important; } }
@media (max-width:1279px){ #view-brief .td-cube{ --ics:120px; width:340px; height:300px; } }
@media (max-width:767px){
  #view-brief .td{ min-height:0; }
  #view-brief .td{ grid-template-areas:"head" "state" "meaning" "side" "record"; }
  #view-brief .td-head{ grid-area:head; position:static; justify-content:center; margin-bottom:6px; }
  #view-brief .td-state{ padding-top:6px; }
  #view-brief .td-cube{ --ics:100px; width:280px; height:240px; }
  #view-brief .td-state .ui-display{ font-size:72px !important; }
  #view-brief .td-state .ui-value{ margin-top:12px; }
  #view-brief .td-verdict{ font-size:24px !important; }
  #view-brief .td-actions{ flex-direction:column; gap:10px; margin-top:24px; }
  #view-brief .td-side{ margin-top:40px; }
  #view-brief .td-record__row{ flex-direction:column; align-items:center; gap:6px; text-align:center; }
}

/* ── CALENDAR: the week as seven columns of light, standing in the open field. Height is the
       day's load, today burns brightest, the clearest window is a gap of dark. Under today's
       column the read; beside it the day's moments as quiet rows. The feed and the import
       fold under one line each. (js/25-calendar.js paints; js/05 keeps every number.) ── */
#view-calendar:not(.hidden){ display:block !important; }
#view-calendar .cl{ position:relative; width:100%; max-width:1180px; margin:0 auto; }
#view-calendar .cl-head{ display:flex; gap:18px; align-items:baseline; min-height:20px; }
#view-calendar .cl-stamp{ font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }
#view-calendar .cl-quiet{ background:none; border:0; padding:0 2px; min-height:32px; font:500 14px var(--f-body); color:rgb(var(--ink2)); cursor:pointer; }
#view-calendar .cl-quiet:hover{ color:rgb(var(--ink)); }
#view-calendar .cl-quiet:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; border-radius:6px; }
#view-calendar .cl-stamp .cl-quiet{ min-height:0; font-size:13px; color:rgb(var(--ink2)); }
/* the week */
#view-calendar .cl-week{ margin-top:8px; }
#view-calendar .cl-week__svg{ display:block; width:100%; height:clamp(240px,38vh,360px); overflow:visible; }
#view-calendar .cl-week__labels{ display:grid; margin-top:10px; }
#view-calendar .cl-lbl{ display:flex; flex-direction:column; align-items:center; gap:2px; font:400 13px/1.2 var(--f-body); color:rgb(var(--ink3)); }
#view-calendar .cl-lbl small{ font-size:12px; color:rgb(var(--ink4)); }
#view-calendar .cl-lbl--today{ color:rgb(var(--ink)); font-weight:500; }
#view-calendar .cl-lbl--today small{ color:rgb(var(--ink2)); }
@keyframes cl-grow{ from{ transform:scaleY(0); opacity:0; } to{ transform:scaleY(1); opacity:1; } }
#view-calendar .cl-col{ transform-box:fill-box; transform-origin:bottom; animation:cl-grow .7s var(--ease-inst) both; }
#view-calendar .cl-col--halo{ animation-duration:1.1s; }
@media (prefers-reduced-motion:reduce){ #view-calendar .cl-col{ animation:none; } }
/* the read, under the week */
#view-calendar .cl-read{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); column-gap:64px; row-gap:24px; margin-top:44px; align-items:start; }
#view-calendar .cl-band{ margin:0; font:500 clamp(30px,3vw,40px)/1.05 var(--f-disp); letter-spacing:-.025em; color:rgb(var(--ink)); }
#view-calendar .cl-sentence{ margin:14px 0 0; font:400 16px/1.6 var(--f-body); color:rgb(var(--ink2)); max-width:52ch; }
#view-calendar .cl-window{ margin:22px 0 0; display:grid; gap:4px; }
#view-calendar .cl-window__t{ font:300 34px/1 var(--f-body); letter-spacing:-.04em; color:rgb(var(--ink)); font-variant-numeric:tabular-nums; }
#view-calendar .cl-window__t:empty{ display:none; }
#view-calendar .cl-window__sub{ font:400 14px/1.55 var(--f-body); color:rgb(var(--ink3)); max-width:48ch; }
#view-calendar .cl-rows__head{ margin:0 0 4px; font:500 15px var(--f-disp); letter-spacing:-.01em; color:rgb(var(--ink)); padding:0 2px 10px; }
#view-calendar .cl-row{ display:grid; grid-template-columns:52px minmax(0,1fr) auto; gap:14px; align-items:baseline; padding:11px 2px; border-top:1px solid var(--hair); font:400 15px/1.45 var(--f-body); color:rgb(var(--ink)); }
#view-calendar .cl-row__t{ color:rgb(var(--ink2)); font-variant-numeric:tabular-nums; }
#view-calendar .cl-row__title{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#view-calendar .cl-row__d{ font-size:13px; color:rgb(var(--ink3)); white-space:nowrap; }
#view-calendar .cl-row--past{ color:rgb(var(--ink3)); } #view-calendar .cl-row--past .cl-row__t{ color:rgb(var(--ink3)); }
#view-calendar .cl-row--live .cl-row__t{ color:var(--mg-ice); }
#view-calendar .cl-rows__more, #view-calendar .cl-rows__empty{ margin:0; padding:11px 2px; border-top:1px solid var(--hair); font:400 14px var(--f-body); color:rgb(var(--ink3)); }
#view-calendar .cl-wk{ margin:18px 0 0; padding-top:14px; border-top:1px solid var(--hair); font:400 14px/1.6 var(--f-body); color:rgb(var(--ink2)); }
#view-calendar .cl-wk span{ color:rgb(var(--ink)); }
#view-calendar .cl-wk #cal-wk-band{ color:rgb(var(--ink2)) !important; background:none !important; border:0 !important; }
#view-calendar .cl-note{ margin:8px 0 0; font:400 14px/1.55 var(--f-body); color:rgb(var(--ink3)); max-width:48ch; }
/* the feed and the import: one line each */
#view-calendar .cl-feed, #view-calendar .cl-import{ max-width:none; margin-top:36px; }
#view-calendar .cl-import.hidden{ display:none; }
#view-calendar .cl-feed + .cl-import{ margin-top:0; }
#view-calendar .cl-fold{ border-top:1px solid var(--hair); }
#view-calendar .cl-fold__sum{ list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:52px; padding:0 2px; font:500 15px/1.3 var(--f-body); color:rgb(var(--ink)); }
#view-calendar .cl-fold__sum::-webkit-details-marker{ display:none; }
#view-calendar .cl-fold__sum::before{ content:'+'; width:14px; color:rgb(var(--ink3)); margin-right:6px; font:400 16px/1 var(--f-body); }
#view-calendar .cl-fold[open] .cl-fold__sum::before{ content:'−'; }
#view-calendar .cl-fold__t{ flex:1 1 auto; }
#view-calendar .cl-fold__state{ font:400 13px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; background:none !important; border:0 !important; padding:0 !important; }
#view-calendar .cl-fold.is-on .cl-fold__state{ color:var(--mg-ice) !important; }
#view-calendar .cl-fold > *:not(summary){ margin-left:22px; }
#view-calendar .cl-p{ margin:2px 0 14px; font:400 15px/1.6 var(--f-body); color:rgb(var(--ink2)); max-width:64ch; }
#view-calendar .cl-lab{ display:block; margin:0 0 6px; font:400 13px var(--f-body); color:rgb(var(--ink3)); }
#view-calendar .cl-connect__row{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
#view-calendar .cl-field{ flex:1 1 320px; min-width:0; background:rgba(15,23,36,.5); border:1px solid var(--hair2); border-radius:12px; padding:11px 14px; font:400 14px/1.4 var(--f-body); color:rgb(var(--ink)); outline:none; }
#view-calendar .cl-field:focus{ border-color:var(--mg-ice); }
#view-calendar .cl-field::placeholder{ color:rgb(var(--ink3)); }
#view-calendar .cl-field--area{ width:100%; margin:10px 0; }
html[data-theme="light"] #view-calendar .cl-field{ background:#fff; }
#view-calendar .cl-fine{ margin:12px 0 0; font:400 13px/1.55 var(--f-body); color:rgb(var(--ink3)); max-width:72ch; }
#view-calendar .cl-msg{ margin:8px 0 0; min-height:18px; font:400 13px var(--f-body); color:rgb(var(--ink2)); }
#view-calendar .cl-quietrow{ display:flex; gap:22px; margin-top:8px; }
#view-calendar .cl-quietrow .cl-quiet{ min-height:44px; }
#view-calendar .cl-status .cl-p{ margin-bottom:4px; }
#view-calendar .cl-drop{ display:block; margin-top:6px; padding:26px 22px; border:1px dashed var(--hair2); border-radius:14px; text-align:center; cursor:pointer; transition:border-color var(--dur-1), background var(--dur-1); }
#view-calendar .cl-drop:hover{ border-color:var(--hair3); background:var(--s-subtle); }
#view-calendar .cl-drop__t{ display:block; font:500 15px var(--f-body); color:rgb(var(--ink)); }
#view-calendar .cl-drop .cl-fine{ margin-top:6px; }
#view-calendar .cl-fold { padding-bottom:18px; }
#view-calendar .cl-fold:not([open]){ padding-bottom:0; }
@media (max-width:1023px){
  #view-calendar .cl-read{ grid-template-columns:minmax(0,1fr); row-gap:30px; margin-top:32px; }
}
@media (max-width:767px){
  #view-calendar .cl-week__svg{ height:200px; }
  #view-calendar .cl-band{ font-size:28px; }
  #view-calendar .cl-window__t{ font-size:30px; }
  #view-calendar .cl-lbl{ font-size:12px; } #view-calendar .cl-lbl small{ display:none; }
  #view-calendar .cl-fold > *:not(summary){ margin-left:0; }
  #view-calendar .cl-row{ grid-template-columns:44px minmax(0,1fr) auto; gap:10px; font-size:14px; }
}

/* ── SENSORS: four arcs of light around the fused read, one per channel; beside them, one row per
       channel with its toggle. The Sentinel folds under a single line. (js/26-sensors.js paints;
       js/04 keeps every value, toggle and permission.) ── */
#view-sensors:not(.hidden){ display:block !important; }
#view-sensors .sn{ position:relative; width:100%; max-width:1180px; margin:0 auto; }
#view-sensors .sn-head{ min-height:20px; }
#view-sensors .sn-stamp{ font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }
#view-sensors .sn-body{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); column-gap:72px; align-items:center; margin-top:18px; min-height:min(560px, calc(100dvh - 300px)); }
/* the instrument */
#view-sensors .sn-inst{ display:flex; flex-direction:column; align-items:center; text-align:center; }
#view-sensors .sn-arcs{ position:relative; width:min(100%,420px); aspect-ratio:1; }
#view-sensors .sn-arcs__svg{ display:block; width:100%; height:100%; overflow:visible; }
#view-sensors .sn-centre{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; pointer-events:none; }
#view-sensors .sn-num{ font:300 clamp(64px,7vw,84px)/1 var(--f-body) !important; letter-spacing:-.05em; color:rgb(var(--ink)) !important; font-variant-numeric:tabular-nums; }
#view-sensors .sn-numlab{ font:400 14px var(--f-body); color:rgb(var(--ink3)); }
#view-sensors .sn-conf{ margin:6px 0 0; font:400 13px var(--f-body); color:rgb(var(--ink3)); display:flex; gap:8px; }
#view-sensors .sn-conf #sns-conf-badge{ font:400 13px var(--f-body) !important; letter-spacing:0 !important; border:0 !important; padding:0 !important; background:none !important; color:rgb(var(--ink3)) !important; text-transform:none !important; }
#view-sensors .sn-read{ margin:12px 0 0; max-width:38ch; font:400 15px/1.55 var(--f-body); color:rgb(var(--ink2)); }
@keyframes sn-draw{ from{ opacity:0; } to{ opacity:1; } }
#view-sensors .sn-arc{ animation:sn-draw .8s var(--ease-inst) both; }
@keyframes sn-breathe{ 0%,100%{ opacity:.35; } 50%{ opacity:.9; } }
#view-sensors .sn-gather{ animation:sn-breathe 3s ease-in-out infinite; }
@media (prefers-reduced-motion:reduce){ #view-sensors .sn-arc, #view-sensors .sn-gather{ animation:none; opacity:.8; } }
/* the channels */
#view-sensors .sn-rows{ display:block; }
#view-sensors .sn-row{ padding:18px 2px 16px; border-top:1px solid var(--hair); }
#view-sensors .sn-row:last-child{ border-bottom:1px solid var(--hair); }
#view-sensors .sn-row__head{ display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"name right" "what right"; column-gap:16px; align-items:center; }
#view-sensors .sn-row__name{ grid-area:name; font:500 16px/1.3 var(--f-body); color:rgb(var(--ink)); }
#view-sensors .sn-row__what{ grid-area:what; font:400 13px/1.45 var(--f-body); color:rgb(var(--ink3)); margin-top:2px; }
#view-sensors .sn-row__right{ grid-area:right; display:flex; align-items:center; gap:16px; }
#view-sensors .sn-row__val{ font:300 22px/1 var(--f-body) !important; letter-spacing:-.04em; color:rgb(var(--ink)) !important; font-variant-numeric:tabular-nums; min-width:3ch; text-align:right; }
#view-sensors .sn-row__conf, #view-sensors .sn-row__right .sense-conf{ font:400 13px var(--f-body) !important; letter-spacing:0 !important; border:0 !important; padding:0 !important; background:none !important; color:rgb(var(--ink3)) !important; text-transform:none !important; }
#view-sensors .sn-row__read{ margin:10px 0 0; font:400 14px/1.5 var(--f-body); color:rgb(var(--ink2)); }
#view-sensors .sn-row__read:empty{ display:none; }
#view-sensors .sn-row__fine{ margin:4px 0 0; font:400 13px/1.5 var(--f-body); color:rgb(var(--ink3)); max-width:60ch; }
#view-sensors .sn-row__fine:empty{ display:none; }
#view-sensors .sn-row__fine b{ color:rgb(var(--ink2)); font-weight:500; }
/* the switch: the room's own, over the legacy class */
#view-sensors .sense-toggle{ min-height:44px; min-width:44px; display:inline-flex; align-items:center; justify-content:center; background:none; border:0; padding:0; cursor:pointer; }
#view-sensors .sense-switch{ width:40px; height:22px; border-radius:11px; border:1px solid var(--hair2); background:rgba(127,211,255,.06); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); transition:background var(--dur-2), border-color var(--dur-2); }
#view-sensors .sense-switch::after{ content:''; position:absolute; top:3px; left:3px; width:14px; height:14px; border-radius:50%; background:rgb(var(--ink3)); transition:transform var(--dur-2) var(--ease-inst), background var(--dur-2); }
#view-sensors [aria-checked="true"] .sense-switch{ background:rgba(31,126,219,.35); border-color:rgba(127,211,255,.55); box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 0 12px rgba(31,126,219,.35); }
#view-sensors [aria-checked="true"] .sense-switch::after{ transform:translateX(18px); background:#DFF4FF; }
#view-sensors .sense-toggle:focus-visible{ outline:2px solid var(--focus); outline-offset:2px; border-radius:12px; }
/* physiological entry */
#view-sensors .sn-entry{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px 16px; margin-top:14px; align-items:end; }
#view-sensors .sn-entry.hidden{ display:none; }
#view-sensors .sn-lab{ display:grid; gap:6px; font:400 13px var(--f-body); color:rgb(var(--ink3)); }
#view-sensors .sn-field{ width:100%; background:rgba(15,23,36,.5); border:1px solid var(--hair2); border-radius:10px; padding:9px 12px; font:400 15px/1.3 var(--f-body); color:rgb(var(--ink)); outline:none; }
#view-sensors .sn-field:focus{ border-color:var(--mg-ice); }
html[data-theme="light"] #view-sensors .sn-field{ background:#fff; }
#view-sensors .sn-entry .ui-btn{ grid-column:1 / -1; justify-self:start; }
#view-sensors .sn-entry .sn-row__fine{ grid-column:1 / -1; }
/* the Sentinel: one line */
#view-sensors .sn-sentinel{ margin-top:40px; }
#view-sensors .sn-fold{ border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); }
#view-sensors .sn-fold__sum{ list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:56px; padding:0 2px; font:500 16px/1.3 var(--f-body); color:rgb(var(--ink)); }
#view-sensors .sn-fold__sum::-webkit-details-marker{ display:none; }
#view-sensors .sn-fold__sum::before{ content:'+'; width:14px; color:rgb(var(--ink3)); margin-right:6px; font:400 16px/1 var(--f-body); }
#view-sensors .sn-fold[open] .sn-fold__sum::before{ content:'−'; }
#view-sensors .sn-fold__t{ flex:1 1 auto; }
#view-sensors .sn-fold__state{ font:400 13px var(--f-body) !important; color:rgb(var(--ink3)) !important; background:none !important; border:0 !important; padding:0 !important; letter-spacing:0 !important; text-transform:none !important; }
#view-sensors .sn-fold > *:not(summary){ margin-left:22px; }
#view-sensors .sn-fold[open]{ padding-bottom:20px; }
#view-sensors .sn-p{ margin:2px 0 14px; font:400 15px/1.6 var(--f-body); color:rgb(var(--ink2)); max-width:66ch; }
#view-sensors .sn-steps{ margin:0 0 16px; padding-left:20px; font:400 14px/1.7 var(--f-body); color:rgb(var(--ink2)); max-width:66ch; }
#view-sensors .sn-code{ font:inherit; color:rgb(var(--ink)); }
#view-sensors .sn-quietrow{ display:flex; flex-wrap:wrap; gap:14px 22px; align-items:center; }
#view-sensors .sn-install.hidden, #view-sensors #sentinel-done.hidden{ display:none; }
#view-sensors .sn-privacy{ margin:28px 0 0; font:400 13px/1.5 var(--f-body); color:rgb(var(--ink3)); }
@media (max-width:1023px){
  #view-sensors .sn-body{ grid-template-columns:minmax(0,1fr); row-gap:28px; min-height:0; }
  #view-sensors .sn-arcs{ width:min(100%,340px); }
  #view-sensors .sn-entry{ grid-template-columns:1fr; }
}
@media (max-width:767px){
  #view-sensors .sn-arcs{ width:min(100%,280px); }
  #view-sensors .sn-num{ font-size:56px !important; }
  #view-sensors .sn-row__head{ grid-template-columns:minmax(0,1fr) auto; }
  #view-sensors .sn-fold > *:not(summary){ margin-left:0; }
}

/* ── READINGS: thirteen weeks of days as a field of marks, the run joined by a hairline; beside it
       the sentence; below, the sixteen marks as quiet rows. (js/27-readings.js paints the field;
       js/05 keeps the numbers and the marks.) ── */
#view-achievements:not(.hidden){ display:block !important; }
#view-achievements .rg{ position:relative; width:100%; max-width:1180px; margin:0 auto; }
#view-achievements .rg-head{ display:flex; justify-content:space-between; gap:18px; min-height:20px; }
#view-achievements .rg-stamp{ font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }
#view-achievements .rg-top{ display:grid; grid-template-columns:minmax(0,6fr) minmax(0,5fr); column-gap:72px; align-items:center; margin-top:30px; min-height:min(420px, calc(100dvh - 420px)); }
#view-achievements .rg-field{ position:relative; }
#view-achievements .rg-dots{ display:block; width:100%; height:auto; overflow:visible; }
#view-achievements .rg-field__lbl{ display:flex; justify-content:space-between; margin-top:6px; padding:0 14px; font:400 13px var(--f-body); color:rgb(var(--ink3)); }
@keyframes rg-in{ from{ opacity:0; transform:scale(.4); } to{ opacity:1; transform:none; } }
html[data-theme="light"] #view-achievements .rg-dot:not(.rg-dot--on){ fill:rgba(17,98,137,.32) !important; } html[data-theme="light"] #view-achievements .rg-dot--on{ fill:#1F7EDB !important; } html[data-theme="light"] #view-achievements .rg-dot--today{ fill:#0e4d78 !important; }
#view-achievements .rg-dot{ transform-box:fill-box; transform-origin:center; animation:rg-in .5s var(--ease-inst) both; }
#view-achievements .rg-run{ stroke-dasharray:1; stroke-dashoffset:1; animation:rd-drawin .9s .3s var(--ease-inst) forwards; }
@media (prefers-reduced-motion:reduce){ #view-achievements .rg-dot, #view-achievements .rg-run{ animation:none; stroke-dashoffset:0; } }
#view-achievements .rg-h{ margin:0; font:500 clamp(28px,2.8vw,38px)/1.1 var(--f-disp) !important; letter-spacing:-.025em; color:rgb(var(--ink)) !important; text-wrap:balance; }
#view-achievements .rg-sub{ margin:14px 0 0; font:400 16px/1.6 var(--f-body); color:rgb(var(--ink2)); max-width:44ch; }
#view-achievements .rg-line{ margin:22px 0 0; padding-top:14px; border-top:1px solid var(--hair); font:400 14px/1.6 var(--f-body); color:rgb(var(--ink3)); }
#view-achievements .rg-line span{ font:300 18px/1 var(--f-body) !important; letter-spacing:-.03em; color:rgb(var(--ink)) !important; font-variant-numeric:tabular-nums; }
#view-achievements .rg-cta{ margin-top:24px; }
#view-achievements .rg-cta.hidden{ display:none; }
/* the marks: js/05's rows, re-read as the room's ledger */
#view-achievements .rg-marks{ margin-top:56px; }
#view-achievements .rg-h2{ margin:0 0 4px; font:500 18px/1.2 var(--f-disp); letter-spacing:-.015em; color:rgb(var(--ink)); }
#view-achievements #ach-grid .grid{ display:block !important; }
#view-achievements #ach-grid .grid > div, #view-achievements #ach-grid > p{ display:grid !important; grid-template-columns:auto minmax(0,1fr); gap:0 16px !important; padding:16px 2px !important; border-top:1px solid var(--hair) !important; }
#view-achievements #ach-grid .grid > div > span{ margin-top:9px !important; width:7px !important; height:7px !important; box-shadow:none !important; }
#view-achievements #ach-grid .grid > div > span[style*="box-shadow"]{ background:#7FD3FF !important; box-shadow:0 0 8px rgba(31,126,219,.7) !important; }
#view-achievements #ach-grid .grid > div > div > p:first-child{ font:500 16px/1.4 var(--f-body) !important; color:rgb(var(--ink)) !important; letter-spacing:0 !important; }
#view-achievements #ach-grid .grid > div > div > p:nth-child(2){ font:400 14px/1.55 var(--f-body) !important; color:rgb(var(--ink2)) !important; margin-top:2px !important; max-width:64ch; }
#view-achievements #ach-grid .grid > div > div > p:nth-child(3){ font:400 13px/1.5 var(--f-body) !important; color:rgb(var(--ink3)) !important; margin-top:6px !important; }
#view-achievements #ach-grid details{ margin-top:0 !important; border-top:1px solid var(--hair); }
#view-achievements #ach-grid details summary{ padding:0 2px !important; min-height:56px; border:0 !important; border-radius:0 !important; background:none !important; font:500 16px var(--f-body); color:rgb(var(--ink)); }
#view-achievements #ach-grid details summary::before{ content:'+'; width:14px; margin-right:12px; color:rgb(var(--ink3)); font:400 16px/1 var(--f-body); }
#view-achievements #ach-grid details[open] summary::before{ content:'−'; }
#view-achievements #ach-grid details summary .overline{ font:500 16px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink)) !important; }
#view-achievements #ach-grid details summary span:not(.overline){ font:400 13px var(--f-body); color:rgb(var(--ink3)) !important; letter-spacing:0 !important; text-transform:none !important; }
#view-achievements #ach-grid details summary{ display:flex; align-items:center; gap:16px; }
#view-achievements #ach-grid details summary > span:first-of-type{ flex:1 1 auto; display:grid; }
#view-achievements #ach-grid details summary > span:last-child:not(:first-of-type){ font:500 14px var(--f-body) !important; color:rgb(var(--ink2)) !important; }
#view-achievements #ach-grid details > div, #view-achievements #ach-grid details > .grid{ padding-left:26px; }
#view-achievements #ach-grid details .grid > div:first-child{ border-top:0 !important; }
#view-achievements #ach-grid .text-\[11px\], #view-achievements #ach-grid [class*="text-\["]{ letter-spacing:0 !important; }
@media (max-width:1023px){
  #view-achievements .rg-top{ grid-template-columns:minmax(0,1fr); row-gap:26px; min-height:0; }
}
@media (max-width:767px){
  #view-achievements .rg-h{ font-size:26px !important; }
  #view-achievements .rg-marks{ margin-top:40px; }
  #view-achievements #ach-grid details > div, #view-achievements #ach-grid details > .grid{ padding-left:0; }
}

/* ── CALIBRATION: the calibration surface. Predicted across, landed up, the lit diagonal where
       certainty and truth agree; each resolved band a point of evidence, its gap a hairline down
       to the diagonal. Beside it the read; beneath, the bands and states as quiet rows.
       (js/28-calibration.js paints from the same response js/07 fetches.) ── */
#view-calibration:not(.hidden){ display:block !important; }
#view-calibration .cb{ display:block; width:100%; max-width:1180px; margin:0 auto; }
#view-calibration .cb-head{ display:flex; justify-content:space-between; gap:18px; min-height:20px; }
#view-calibration .cb-stamp{ font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }
#view-calibration .cb-body{ display:grid; grid-template-columns:minmax(0,6fr) minmax(0,5fr); column-gap:72px; align-items:center; margin-top:10px; min-height:min(600px, calc(100dvh - 260px)); }
#view-calibration .cb-surface{ width:100%; max-width:600px; }
#view-calibration .cb-svg{ display:block; width:100%; height:auto; overflow:visible; }
#view-calibration .cb-t{ font:400 13px var(--f-body); fill:rgb(var(--ink3)); }
#view-calibration .cb-t--dim{ fill:rgb(var(--ink4)); font-size:12px; }
@keyframes cb-in{ from{ opacity:0; transform:scale(.6); } to{ opacity:1; transform:none; } }
#view-calibration .cb-pt{ transform-box:fill-box; transform-origin:center; animation:cb-in .6s .4s var(--ease-inst) both; }
#view-calibration .cb-gap{ animation:cb-in .6s .7s var(--ease-inst) both; }
#view-calibration .cb-diag{ stroke-dasharray:1; stroke-dashoffset:1; animation:rd-drawin .9s .1s var(--ease-inst) forwards; }
@media (prefers-reduced-motion:reduce){ #view-calibration .cb-pt, #view-calibration .cb-gap, #view-calibration .cb-diag{ animation:none; stroke-dashoffset:0; } }
#view-calibration .cb-numrow{ display:flex; align-items:baseline; gap:10px; }
#view-calibration .cb-num{ font:300 clamp(64px,6.5vw,88px)/1 var(--f-body); letter-spacing:-.05em; color:rgb(var(--ink)); font-variant-numeric:tabular-nums; }
#view-calibration .cb-numlab{ font:400 14px var(--f-body); color:rgb(var(--ink3)); }
#view-calibration .cb-h{ margin:14px 0 0; font:500 clamp(26px,2.6vw,34px)/1.1 var(--f-disp); letter-spacing:-.022em; color:rgb(var(--ink)); text-wrap:balance; }
#view-calibration .cb-sub{ margin:14px 0 0; font:400 16px/1.6 var(--f-body); color:rgb(var(--ink2)); max-width:44ch; }
#view-calibration .cb-line{ margin:20px 0 0; padding-top:14px; border-top:1px solid var(--hair); font:400 13px/1.55 var(--f-body); color:rgb(var(--ink3)); max-width:48ch; }
#view-calibration .cb-quiet{ display:flex; gap:18px; align-items:center; flex-wrap:wrap; margin-top:26px; }
#view-calibration .cb-rows{ margin-top:44px; }
#view-calibration .cb-rows + .cb-rows{ margin-top:32px; }
#view-calibration .cb-h3{ margin:0 0 4px; font:500 16px/1.2 var(--f-disp); letter-spacing:-.01em; color:rgb(var(--ink)); }
#view-calibration .cb-row{ display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) auto; gap:4px 24px; align-items:baseline; padding:14px 2px; border-top:1px solid var(--hair); font:400 15px/1.5 var(--f-body); color:rgb(var(--ink)); }
#view-calibration .cb-rows .cb-row:last-child{ border-bottom:1px solid var(--hair); }
#view-calibration .cb-row__l small{ display:block; font-size:13px; color:rgb(var(--ink3)); }
#view-calibration .cb-row__m{ color:rgb(var(--ink2)); } #view-calibration .cb-row__m b{ font-weight:500; color:rgb(var(--ink)); font-variant-numeric:tabular-nums; }
#view-calibration .cb-row__r{ color:rgb(var(--ink3)); font-size:14px; white-space:nowrap; justify-self:end; }
#view-calibration .cb-row--empty{ grid-template-columns:minmax(0,1fr) auto; color:rgb(var(--ink2)); }
#view-calibration .cb-row--empty .cb-row__r{ color:rgb(var(--ink3)); }
/* the signed-out card js/07 writes stays legible in the room */
#view-calibration #cal-body > section.card{ border:0 !important; background:none !important; box-shadow:none !important; padding:0 !important; max-width:52ch; }
@media (max-width:1023px){
  #view-calibration .cb-body{ grid-template-columns:minmax(0,1fr); row-gap:28px; min-height:0; }
  #view-calibration .cb-surface{ max-width:520px; margin:0 auto; }
}
@media (max-width:767px){
  #view-calibration .cb-t{ font-size:15px; } #view-calibration .cb-t--dim{ font-size:14px; }
  #view-calibration .cb-row{ grid-template-columns:minmax(0,1fr); gap:2px; } #view-calibration .cb-row__r{ justify-self:start; white-space:normal; }
  #view-calibration .cb-h{ font-size:26px; }
}

/* ── UNCERTAINTY: the horizon. One line from the past through today into the open; every forecast a
       point on it at its horizon date. Beneath, the open questions and the record as quiet rows, the
       form as a restrained column, the discipline under one fold. (js/29-uncertainty.js paints;
       js/13 keeps every field, handler and score.) ── */
#view-uncertainty:not(.hidden){ display:block !important; }
#view-uncertainty .un{ display:block; width:100%; max-width:1180px; margin:0 auto; }
#view-uncertainty .un-head{ display:flex; justify-content:space-between; gap:18px; min-height:20px; }
#view-uncertainty .un-stamp{ font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }
#view-uncertainty .un-horizon{ margin:22px -24px 0; }
#view-uncertainty .un-svg{ display:block; width:100%; height:auto; overflow:visible; }
#view-uncertainty .un-t{ font:400 13px var(--f-body); fill:rgb(var(--ink3)); }
#view-uncertainty .un-t--dim{ fill:rgb(var(--ink4)); }
#view-uncertainty .un-n{ font:300 22px var(--f-body); fill:rgb(var(--ink)); letter-spacing:-.03em; }
#view-uncertainty .un-n__pct{ font-size:12px; fill:rgb(var(--ink3)); }
#view-uncertainty .un-line{ stroke-dasharray:1; stroke-dashoffset:1; animation:rd-drawin 1.1s var(--ease-inst) forwards; }
@keyframes un-in{ from{ opacity:0; transform:scale(.5); } to{ opacity:1; transform:none; } }
#view-uncertainty .un-pt{ transform-box:fill-box; transform-origin:center; animation:un-in .5s .5s var(--ease-inst) both; }
@media (prefers-reduced-motion:reduce){ #view-uncertainty .un-line, #view-uncertainty .un-pt{ animation:none; stroke-dashoffset:0; } }
/* the lead */
#view-uncertainty .un-lead{ max-width:640px; margin:10px auto 0; text-align:center; }
#view-uncertainty .un-h{ margin:0; font:500 clamp(26px,2.6vw,34px)/1.15 var(--f-disp); letter-spacing:-.022em; color:rgb(var(--ink)); text-wrap:balance; }
#view-uncertainty .un-h em{ font:italic 500 1.08em var(--f-em); color:#dff4ff; }
html[data-theme="light"] #view-uncertainty .un-h em{ color:#0e4d78; }
#view-uncertainty .un-numrow{ display:flex; justify-content:center; align-items:baseline; gap:12px; }
#view-uncertainty .un-num{ font:300 clamp(56px,6vw,80px)/1 var(--f-body); letter-spacing:-.05em; color:rgb(var(--ink)); font-variant-numeric:tabular-nums; }
#view-uncertainty .un-num small{ font-size:.4em; color:rgb(var(--ink3)); }
#view-uncertainty .un-numlab{ font:400 14px/1.3 var(--f-body); color:rgb(var(--ink3)); text-align:left; }
#view-uncertainty .un-sub{ margin:12px auto 0; font:400 15px/1.6 var(--f-body); color:rgb(var(--ink2)); max-width:52ch; }
/* the body: ledger left, form right */
#view-uncertainty .un-body{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); column-gap:72px; align-items:start; margin-top:56px; }
#view-uncertainty .un-h3{ margin:0; display:flex; align-items:baseline; gap:10px; font:500 17px/1.2 var(--f-disp); letter-spacing:-.015em; color:rgb(var(--ink)); padding-bottom:10px; }
#view-uncertainty .un-h3__n{ font:300 17px var(--f-body); color:rgb(var(--ink3)); }
#view-uncertainty .un-h3--gap{ margin-top:48px; }
#view-uncertainty .un-h3__sub{ margin:-4px 0 12px; font:400 14px/1.5 var(--f-body); color:rgb(var(--ink3)); }
#view-uncertainty .un-stamp b{ font-weight:600; color:var(--ice); }
#view-uncertainty .un-stamp--r{ text-align:right; }
#view-uncertainty .un-t--due{ fill:var(--ice); font-weight:500; }
#view-uncertainty .un-svg{ max-width:100%; }
#view-uncertainty .un-row--due .un-row__acts{ justify-content:flex-start; }
#view-uncertainty .un-row--due .un-quiet:not(.un-quiet--dim){ color:rgb(var(--ink)); padding:0 14px; border:1px solid var(--hair2); border-radius:999px; min-height:36px; transition:border-color var(--dur-1,180ms) ease, background-color var(--dur-1,180ms) ease; }
#view-uncertainty .un-row--due .un-quiet:not(.un-quiet--dim):hover{ border-color:var(--ice); background:rgba(127,211,255,.06); }
#view-uncertainty .un-more{ display:block; margin:14px 0 0; padding:0 2px; min-height:44px; background:none; border:0; cursor:pointer; font:500 14px var(--f-body); color:rgb(var(--ink2)); }
#view-uncertainty .un-more:hover{ color:rgb(var(--ink)); }
#view-uncertainty .un-more:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; border-radius:6px; }
#view-uncertainty .un-range{ -webkit-appearance:none; appearance:none; height:28px; background:transparent; cursor:pointer; }
#view-uncertainty .un-range::-webkit-slider-runnable-track{ height:2px; background:linear-gradient(90deg,var(--ice),var(--hair2)); border-radius:2px; }
#view-uncertainty .un-range::-moz-range-track{ height:2px; background:var(--hair2); border-radius:2px; }
#view-uncertainty .un-range::-webkit-slider-thumb{ -webkit-appearance:none; width:20px; height:20px; margin-top:-9px; border-radius:50%; background:var(--ice-hi); border:0; box-shadow:0 0 0 6px rgba(127,211,255,.14); }
#view-uncertainty .un-range::-moz-range-thumb{ width:20px; height:20px; border-radius:50%; background:var(--ice-hi); border:0; }
#view-uncertainty .un-range:focus-visible{ outline:2px solid var(--focus); outline-offset:4px; border-radius:6px; }
#view-uncertainty .un-empty{ margin:0; padding:16px 2px; border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); font:400 15px/1.6 var(--f-body); color:rgb(var(--ink2)); }
#view-uncertainty .un-empty em{ font:italic 500 1.06em var(--f-em); color:#dff4ff; }
html[data-theme="light"] #view-uncertainty .un-empty em{ color:#0e4d78; }
#view-uncertainty .un-empty--dim{ color:rgb(var(--ink3)); }
#view-uncertainty .un-row{ display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"main p" "acts acts"; gap:6px 20px; padding:16px 2px; border-top:1px solid var(--hair); }
#view-uncertainty .un-row:last-of-type{ border-bottom:1px solid var(--hair); }
#view-uncertainty .un-row__main{ grid-area:main; min-width:0; }
#view-uncertainty .un-row__q{ margin:0; font:500 16px/1.4 var(--f-body); color:rgb(var(--ink)); }
#view-uncertainty .un-row__meta{ margin:4px 0 0; font:400 13px/1.5 var(--f-body); color:rgb(var(--ink3)); }
#view-uncertainty .un-due{ color:var(--mg-ice); }
#view-uncertainty .un-row__p{ grid-area:p; font:300 30px/1 var(--f-body); letter-spacing:-.04em; color:rgb(var(--ink)); font-variant-numeric:tabular-nums; }
#view-uncertainty .un-row__p small{ font-size:13px; color:rgb(var(--ink3)); margin-left:2px; }
#view-uncertainty .un-row__acts{ grid-area:acts; display:flex; align-items:center; gap:6px 18px; flex-wrap:wrap; }
#view-uncertainty .un-row__sp{ flex:1 1 auto; }
#view-uncertainty .un-quiet{ background:none; border:0; padding:0 2px; min-height:40px; font:500 14px var(--f-body); color:rgb(var(--ink2)); cursor:pointer; }
#view-uncertainty .un-quiet:hover{ color:rgb(var(--ink)); }
#view-uncertainty .un-quiet--dim{ color:rgb(var(--ink3)); }
#view-uncertainty .un-quiet:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; border-radius:6px; }
#view-uncertainty .un-drow{ display:grid; grid-template-columns:10px minmax(0,1fr) auto auto; gap:14px; align-items:center; padding:11px 2px; border-top:1px solid var(--hair); font:400 15px/1.45 var(--f-body); color:rgb(var(--ink)); }
#view-uncertainty .un-drow:last-of-type{ border-bottom:1px solid var(--hair); }
#view-uncertainty .un-drow__dot{ width:8px; height:8px; border-radius:50%; border:1px solid rgba(127,211,255,.55); }
#view-uncertainty .un-drow__dot.is-yes{ background:#7FD3FF; border-color:#7FD3FF; }
#view-uncertainty .un-drow__q{ margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#view-uncertainty .un-drow__r{ font-size:14px; color:rgb(var(--ink2)); white-space:nowrap; }
#view-uncertainty .un-drow__o{ font-size:14px; color:rgb(var(--ink3)); min-width:7ch; text-align:right; white-space:nowrap; }
#view-uncertainty .un-drow__o.is-yes{ color:var(--ice); }
#view-uncertainty .un-drow__b{ font-size:13px; color:rgb(var(--ink3)); font-variant-numeric:tabular-nums; min-width:3.5ch; text-align:right; }
/* the form */
#view-uncertainty .un-form{ padding-top:0; }
#view-uncertainty .un-lab{ display:block; margin:18px 0 6px; font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }
#view-uncertainty .un-input{ width:100%; background:transparent; border:0; border-bottom:1px solid var(--hair3); border-radius:0; padding:8px 0 12px; font:400 20px/1.3 var(--f-body); color:rgb(var(--ink)); outline:none; }
#view-uncertainty .un-input:focus{ border-bottom-color:var(--mg-ice); }
#view-uncertainty .un-input::placeholder{ color:rgb(var(--ink3)); }
#view-uncertainty .un-prob{ margin-top:8px; }
#view-uncertainty .un-prob__n{ display:block; font:300 56px/1 var(--f-body); letter-spacing:-.05em; color:rgb(var(--ink)); font-variant-numeric:tabular-nums; margin:2px 0 10px; }
#view-uncertainty .un-prob__pct{ font-size:20px; color:rgb(var(--ink3)); margin-left:2px; }
#view-uncertainty .un-range{ width:100%; accent-color:#7FD3FF; }
#view-uncertainty .un-two{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
#view-uncertainty .un-two .un-lab{ margin-top:14px; }
#view-uncertainty .un-field{ display:block; width:100%; margin-top:6px; background:rgba(15,23,36,.5); border:1px solid var(--hair2); border-radius:10px; padding:10px 12px; font:400 15px/1.3 var(--f-body); color:rgb(var(--ink)); outline:none; color-scheme:dark; }
#view-uncertainty .un-field:focus{ border-color:var(--mg-ice); }
#view-uncertainty .un-field--n{ width:90px; display:inline-block; margin-top:0; }
#view-uncertainty .un-inline{ display:inline-flex; align-items:center; gap:8px; margin-top:6px; }
#view-uncertainty .un-lab--row{ display:grid; }
html[data-theme="light"] #view-uncertainty .un-field{ background:#fff; color-scheme:light; }
#view-uncertainty .un-fine{ margin:8px 0 0; font:400 13px/1.55 var(--f-body); color:rgb(var(--ink3)); max-width:44ch; }
#view-uncertainty .un-commit{ margin-top:26px; }
#view-uncertainty .un-msg{ margin:10px 0 0; min-height:18px; font:400 13px var(--f-body); color:rgb(var(--ink2)); }
/* the discipline, folded */
#view-uncertainty .un-disc{ margin-top:52px; }
#view-uncertainty .un-fold{ border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); }
#view-uncertainty .un-fold__sum{ list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:56px; padding:0 2px; font:500 16px/1.3 var(--f-body); color:rgb(var(--ink)); }
#view-uncertainty .un-fold__sum::-webkit-details-marker{ display:none; }
#view-uncertainty .un-fold__sum::before{ content:'+'; width:14px; color:rgb(var(--ink3)); margin-right:6px; font:400 16px/1 var(--f-body); }
#view-uncertainty .un-fold[open] .un-fold__sum::before{ content:'−'; }
#view-uncertainty .un-fold__sum > span:first-child{ flex:1 1 auto; }
#view-uncertainty .un-fold__state{ font:400 13px var(--f-body); color:rgb(var(--ink3)); }
#view-uncertainty .un-fold[open]{ padding-bottom:22px; }
#view-uncertainty .un-p{ margin:4px 0 12px 22px; font:400 15px/1.65 var(--f-body); color:rgb(var(--ink2)); max-width:70ch; }
#view-uncertainty .un-move{ display:grid; grid-template-columns:28px minmax(0,220px) minmax(0,1fr); gap:16px; align-items:baseline; padding:12px 2px 12px 22px; border-top:1px solid var(--hair); font:400 15px/1.5 var(--f-body); }
#view-uncertainty .un-move__n{ font:italic 500 18px var(--f-em); color:rgb(var(--ink3)); }
#view-uncertainty .un-move__t{ font-weight:500; color:rgb(var(--ink)); }
#view-uncertainty .un-move__d{ color:rgb(var(--ink2)); }
@media (max-width:1023px){
  #view-uncertainty .un-body{ grid-template-columns:minmax(0,1fr); row-gap:44px; margin-top:44px; }
  #view-uncertainty .un-move{ grid-template-columns:28px minmax(0,1fr); } #view-uncertainty .un-move__d{ grid-column:2; }
}
@media (max-width:767px){
  #view-uncertainty .un-horizon{ margin:18px -16px 0; }
  #view-uncertainty .un-h{ font-size:26px; }
  #view-uncertainty .un-two{ grid-template-columns:1fr; }
  #view-uncertainty .un-drow{ grid-template-columns:10px minmax(0,1fr) auto; } #view-uncertainty .un-drow__r{ display:none; }
  #view-uncertainty .un-head{ flex-direction:column; gap:4px; } #view-uncertainty .un-stamp--r{ text-align:left; }
  #view-uncertainty .un-num{ font-size:56px; }
  #view-uncertainty .un-p, #view-uncertainty .un-move{ padding-left:2px; margin-left:0; }
}

/* ── THE ARCHIVE: a place where records live. The newest document stands as one glass sheet on the
       floor, in a pool of light; the earlier ones recede into chronological hairline rows.
       (js/30-archive.js paints; js/10 keeps the list, the kinds and the Doctrine.) ── */
#view-archive:not(.hidden){ display:block !important; }
#view-archive .ar{ display:block; width:100%; max-width:1180px; margin:0 auto; }
#view-archive .ar-head{ display:flex; justify-content:space-between; gap:18px; min-height:20px; }
#view-archive .ar-stamp{ font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }
/* the floor */
#view-archive .ar-floor{ position:relative; height:clamp(340px,44vh,440px); margin-top:8px; display:flex; align-items:flex-end; justify-content:center; perspective:1200px; }
#view-archive .ar-pool{ position:absolute; left:50%; bottom:22px; width:0; height:0; pointer-events:none; }
#view-archive .ar-pool span{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); border-radius:50%; }
#view-archive .ar-pool__r1{ width:640px; height:180px; border:1px solid rgba(127,211,255,.14); box-shadow:0 0 30px rgba(31,126,219,.14); }
#view-archive .ar-pool__r2{ width:400px; height:112px; border:1px solid rgba(127,211,255,.28); box-shadow:0 0 26px rgba(31,126,219,.35), inset 0 0 30px rgba(31,126,219,.18); }
#view-archive .ar-pool__glow{ width:300px; height:80px; background:radial-gradient(closest-side, rgba(31,126,219,.55), rgba(31,126,219,0)); filter:blur(8px); }
#view-archive .ar-sheet{ position:relative; width:220px; height:300px; margin-bottom:56px; padding:22px 22px 20px; box-sizing:border-box; display:flex; flex-direction:column; text-align:left;
  border-radius:14px; border:1px solid rgba(160,225,255,.22);
  background:linear-gradient(160deg,rgba(31,126,219,.16),rgba(31,126,219,.06) 55%,rgba(255,255,255,.015));
  -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16), 0 40px 70px -40px rgba(31,126,219,.9), 0 0 0 1px rgba(31,126,219,.08);
  transform:rotateX(4deg) rotateY(-8deg); transform-style:preserve-3d; animation:ar-rise .9s var(--ease-inst) both; }
#view-archive .ar-sheet::before{ content:''; position:absolute; left:10%; right:10%; top:-1px; height:1px; background:linear-gradient(90deg,transparent,rgba(223,244,255,.7),transparent); }
#view-archive .ar-sheet::after{ content:''; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(140deg,rgba(255,255,255,.10),rgba(255,255,255,0) 45%); pointer-events:none; }
#view-archive .ar-sheet--empty{ border-style:dashed; border-color:rgba(127,211,255,.18); background:rgba(31,126,219,.03); box-shadow:none; }
#view-archive .ar-sheet__kind{ font:400 12px/1.4 var(--f-body); color:rgb(var(--ink3)); }
#view-archive .ar-sheet__title{ margin-top:auto; font:500 24px/1.1 var(--f-disp); letter-spacing:-.02em; color:rgb(var(--ink)); text-wrap:balance; }
#view-archive .ar-sheet__sub{ margin-top:8px; font:italic 500 15px/1.35 var(--f-em); color:#dff4ff; }
#view-archive .ar-sheet__date{ margin-top:16px; font:400 12px/1.4 var(--f-body); color:rgb(var(--ink3)); }
@keyframes ar-rise{ from{ opacity:0; transform:translateY(18px) rotateX(4deg) rotateY(-8deg); } to{ opacity:1; transform:rotateX(4deg) rotateY(-8deg); } }
@media (prefers-reduced-motion:reduce){ #view-archive .ar-sheet{ animation:none; } }
html[data-theme="light"] #view-archive .ar-sheet{ background:linear-gradient(160deg,rgba(255,255,255,.85),rgba(255,255,255,.6)); border-color:rgba(15,40,70,.16); box-shadow:inset 0 1px 0 #fff, 0 40px 70px -46px rgba(31,126,219,.4); }
html[data-theme="light"] #view-archive .ar-sheet__sub{ color:#0e4d78; }
/* the lead */
#view-archive .ar-lead{ max-width:640px; margin:26px auto 0; text-align:center; }
#view-archive .ar-h{ margin:0; font:500 clamp(24px,2.4vw,30px)/1.15 var(--f-disp); letter-spacing:-.022em; color:rgb(var(--ink)); text-wrap:balance; }
#view-archive .ar-h em{ font:italic 500 1.08em var(--f-em); color:#dff4ff; }
html[data-theme="light"] #view-archive .ar-h em{ color:#0e4d78; }
#view-archive .ar-sub{ margin:12px auto 0; font:400 15px/1.6 var(--f-body); color:rgb(var(--ink2)); max-width:52ch; }
#view-archive .ar-quiet{ display:flex; justify-content:center; gap:18px; margin-top:22px; }
/* earlier records */
#view-archive .ar-rows{ max-width:760px; margin:52px auto 0; }
#view-archive .ar-h3{ margin:0 0 4px; font:500 16px/1.2 var(--f-disp); letter-spacing:-.01em; color:rgb(var(--ink)); }
#view-archive .ar-row{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) auto; gap:4px 20px; align-items:baseline; padding:13px 2px; border-top:1px solid var(--hair); font:400 15px/1.5 var(--f-body); color:rgb(var(--ink)); }
#view-archive .ar-row:last-child{ border-bottom:1px solid var(--hair); }
#view-archive .ar-row__t{ font-weight:500; }
#view-archive .ar-row__k{ color:rgb(var(--ink3)); font-size:14px; }
#view-archive .ar-row__d{ color:rgb(var(--ink3)); font-size:13px; white-space:nowrap; font-variant-numeric:tabular-nums; }
@media (max-width:767px){
  #view-archive .ar-floor{ height:300px; }
  #view-archive .ar-sheet{ width:180px; height:250px; margin-bottom:44px; padding:18px; }
  #view-archive .ar-sheet__title{ font-size:20px; }
  #view-archive .ar-pool__r1{ width:360px; height:110px; } #view-archive .ar-pool__r2{ width:240px; height:72px; } #view-archive .ar-pool__glow{ width:200px; height:56px; }
  #view-archive .ar-row{ grid-template-columns:minmax(0,1fr) auto; } #view-archive .ar-row__k{ grid-column:1 / -1; }
}

/* ── INSIGHTS: the letter as a page. A thin ridge of the period's integrity stands above the first
       line; the instrument's letter follows in prose; the headlines read as observation and what it
       means. One column, editorial measure. (js/31-insights.js paints; js/07 writes the letter.) ── */
#view-insights:not(.hidden){ display:block !important; }
#view-insights .in{ display:block; width:100%; max-width:1180px; margin:0 auto; }
#view-insights .in-head{ display:flex; justify-content:space-between; align-items:baseline; gap:18px; min-height:20px; }
#view-insights .in-stamp{ font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }
#view-insights .in-tog{ display:inline-flex; gap:18px; }
#view-insights .in-quiet{ background:none; border:0; padding:0 2px; min-height:32px; font:500 14px var(--f-body); color:rgb(var(--ink3)); cursor:pointer; }
#view-insights .in-quiet:hover, #view-insights .in-quiet.is-on{ color:rgb(var(--ink)); }
#view-insights .in-quiet.is-on{ text-decoration:underline; text-decoration-color:rgba(127,211,255,.6); text-underline-offset:6px; }
#view-insights .in-quiet:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; border-radius:6px; }
/* the page */
#view-insights .in-page{ max-width:680px; margin:26px auto 0; }
#view-insights .in-ridge{ display:block; width:100%; height:clamp(96px,14vh,140px); overflow:visible; }
#view-insights .in-area{ animation:in-fade 1s var(--ease-inst) both; }
#view-insights .in-crest{ stroke-dasharray:1; stroke-dashoffset:1; animation:rd-drawin 1.1s var(--ease-inst) forwards; }
#view-insights .in-mark{ animation:in-fade .6s .8s var(--ease-inst) both; }
@keyframes in-fade{ from{ opacity:0; } to{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ #view-insights .in-area, #view-insights .in-crest, #view-insights .in-mark{ animation:none; stroke-dashoffset:0; } }
#view-insights .in-h{ margin:22px 0 0; font:500 clamp(30px,3.2vw,40px)/1.1 var(--f-disp) !important; letter-spacing:-.025em; color:rgb(var(--ink)) !important; text-wrap:balance; }
#view-insights .in-stampline{ margin:14px 0 0; font:400 14px/1.6 var(--f-body); color:rgb(var(--ink3)); }
#view-insights .in-lead{ margin:16px 0 0; font:400 17px/1.65 var(--f-body); color:rgb(var(--ink2)); }
#view-insights .in-quietrow{ display:flex; gap:22px; align-items:center; flex-wrap:wrap; margin-top:26px; }
/* the letter: js/07's markup, given the page's voice */
#view-insights .in-letter{ margin-top:30px; padding-top:26px; border-top:1px solid var(--hair); }
#view-insights .in-letter.hidden{ display:none; }
#view-insights .in-letter > p.overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; margin:0 0 14px !important; }
#view-insights .in-letter .voice-counsel{ font:400 17px/1.75 var(--f-body) !important; color:rgb(var(--ink)) !important; max-width:none !important; }
#view-insights .in-letter .voice-counsel p{ margin:0 0 16px !important; }
#view-insights .in-letter .voice-counsel p:first-child{ font:italic 500 22px/1.4 var(--f-em) !important; color:#dff4ff; margin-bottom:18px !important; }
html[data-theme="light"] #view-insights .in-letter .voice-counsel p:first-child{ color:#0e4d78; }
#view-insights .in-letter .voice-counsel p:last-child{ font:italic 500 19px/1.5 var(--f-em) !important; color:#dff4ff; }
html[data-theme="light"] #view-insights .in-letter .voice-counsel p:last-child{ color:#0e4d78; }
#view-insights .in-letter > p.font-mono{ font:400 13px/1.5 var(--f-body) !important; letter-spacing:0 !important; color:rgb(var(--ink3)) !important; margin-top:8px !important; }
/* the headlines */
#view-insights .in-heads{ margin-top:34px; }
#view-insights .in-headline{ padding:20px 0 18px; border-top:1px solid var(--hair); }
#view-insights .in-heads .in-headline:last-child{ border-bottom:1px solid var(--hair); }
#view-insights .in-h2{ margin:0; font:500 21px/1.25 var(--f-disp); letter-spacing:-.015em; color:rgb(var(--ink)); text-wrap:balance; }
#view-insights .in-p{ margin:8px 0 0; font:400 15px/1.65 var(--f-body); color:rgb(var(--ink2)); }
/* the foot */
#view-insights .in-foot{ display:flex; gap:26px; align-items:center; flex-wrap:wrap; margin-top:30px; }
#view-insights .in-foot .in-quiet{ min-height:44px; color:rgb(var(--ink2)); }
#view-insights .in-foot .in-quiet:hover{ color:rgb(var(--ink)); }
#view-insights .in-msg{ font:400 13px var(--f-body); color:rgb(var(--ink3)); min-height:18px; }
/* the signed-out card js/07 writes */
#view-insights #ins-body > section.card{ border:0 !important; background:none !important; box-shadow:none !important; padding:0 !important; max-width:52ch; }
@media (max-width:767px){
  #view-insights .in-head{ flex-wrap:wrap; }
  #view-insights .in-h{ font-size:28px !important; }
  #view-insights .in-letter .voice-counsel{ font-size:16px !important; }
  #view-insights .in-foot{ gap:18px; }
}

/* ── THE APPROACH: the well. The basin your judgment rests in, full width in the open field; the
       baseline well dashed behind it, the tipping edge above, you as the point the well returns.
       Under it the number, the state, the sentence; then the four signals as hairline rows.
       (js/32-approach.js paints with js/10's geometry; js/10 keeps the dynamics.) ── */
#view-approach:not(.hidden){ display:block !important; }
#view-approach .ap{ display:block; width:100%; max-width:1180px; margin:0 auto; }
#view-approach .ap-head{ display:flex; justify-content:space-between; gap:18px; min-height:20px; }
#view-approach .ap-stamp{ font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }
#view-approach .ap-field{ margin:6px -12px 0; }
#view-approach .ap-well{ display:block; width:100%; height:auto; max-height:min(52vh,480px); overflow:visible; }
#view-approach .ap-t{ font:400 13px var(--f-body); fill:rgb(var(--ink3)); }
#view-approach .ap-t--dim{ fill:rgb(var(--ink4)); }
#view-approach .ap-rim, #view-approach .ap-ghost{ stroke-dasharray:1; stroke-dashoffset:1; animation:rd-drawin 1.2s var(--ease-inst) forwards; }
#view-approach .ap-ghost{ animation-duration:1s; stroke-dasharray:4 6; stroke-dashoffset:0; animation-name:ap-fade; }
#view-approach .ap-basin, #view-approach .ap-edge{ animation:ap-fade 1s .5s var(--ease-inst) both; }
#view-approach .ap-ball{ animation:ap-drop .9s .8s var(--ease-inst) both; }
@keyframes ap-fade{ from{ opacity:0; } to{ opacity:1; } }
@keyframes ap-drop{ from{ opacity:0; transform:translateY(-40px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ #view-approach .ap-rim, #view-approach .ap-ghost, #view-approach .ap-basin, #view-approach .ap-edge, #view-approach .ap-ball{ animation:none; stroke-dashoffset:0; } }
/* the lead */
#view-approach .ap-lead{ max-width:640px; margin:8px auto 0; text-align:center; }
#view-approach .ap-numrow{ display:flex; justify-content:center; align-items:baseline; gap:12px; }
#view-approach .ap-num{ font:300 clamp(56px,6vw,80px)/1 var(--f-body); letter-spacing:-.05em; color:rgb(var(--ink)); font-variant-numeric:tabular-nums; }
#view-approach .ap-numlab{ font:400 14px var(--f-body); color:rgb(var(--ink3)); }
#view-approach .ap-h{ margin:10px 0 0; font:500 clamp(26px,2.6vw,34px)/1.15 var(--f-disp); letter-spacing:-.022em; color:rgb(var(--ink)); text-wrap:balance; }
#view-approach .ap-sub{ margin:12px auto 0; font:400 15px/1.6 var(--f-body); color:rgb(var(--ink2)); max-width:52ch; }
/* the signals */
#view-approach .ap-rows{ max-width:680px; margin:44px auto 0; }
#view-approach .ap-row{ display:flex; justify-content:space-between; gap:24px; align-items:baseline; padding:13px 2px; border-top:1px solid var(--hair); font:400 15px/1.5 var(--f-body); color:rgb(var(--ink)); }
#view-approach .ap-row:nth-last-of-type(2){ border-bottom:1px solid var(--hair); }
#view-approach .ap-row__l{ color:rgb(var(--ink)); font-weight:500; }
#view-approach .ap-row__r{ color:rgb(var(--ink2)); text-align:right; font-variant-numeric:tabular-nums; }
#view-approach .ap-fine{ margin:12px 0 0; font:400 13px/1.55 var(--f-body); color:rgb(var(--ink3)); }
/* the gap panel js/10 fills, given the room's voice */
#view-approach .ap-gap{ max-width:680px; margin:26px auto 0; padding-top:16px; border-top:1px solid var(--hair); }
#view-approach .ap-gap .overline{ font:500 15px var(--f-disp) !important; letter-spacing:-.01em !important; text-transform:none !important; color:rgb(var(--ink)) !important; margin-bottom:8px !important; }
#view-approach .ap-gap p:not(.overline){ font:400 15px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; margin-top:6px !important; }
#view-approach .ap-gap p.font-mono{ font:400 13px/1.5 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
/* the fold */
#view-approach .ap-fold{ max-width:680px; margin:30px auto 0; border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); }
#view-approach .ap-fold__sum{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:0; min-height:52px; padding:0 2px; font:500 15px/1.3 var(--f-body); color:rgb(var(--ink)); }
#view-approach .ap-fold__sum::-webkit-details-marker{ display:none; }
#view-approach .ap-fold__sum::before{ content:'+'; width:14px; color:rgb(var(--ink3)); margin-right:8px; font:400 16px/1 var(--f-body); }
#view-approach .ap-fold[open] .ap-fold__sum::before{ content:'−'; }
#view-approach .ap-p{ margin:2px 0 18px 22px; font:400 15px/1.65 var(--f-body); color:rgb(var(--ink2)); max-width:64ch; }
@media (max-width:767px){
  #view-approach .ap-field{ margin:6px -8px 0; }
  #view-approach .ap-t{ font-size:30px; } #view-approach .ap-t--dim{ display:none; }
  #view-approach .ap-h{ font-size:26px; }
  #view-approach .ap-row{ flex-direction:column; gap:2px; } #view-approach .ap-row__r{ text-align:left; }
  #view-approach .ap-p{ margin-left:0; }
}

/* ── BIAS ANALYSIS: four strata of light, the default lens brightest at the top, the blind edge
       dimmest at the bottom; today's distortion a disturbance in its stratum. The state read beneath;
       the standing signature, the active signal and the full study as quiet rows and one fold.
       (js/33-bias.js paints the strata; js/06 loadBias keeps every read.) ── */
#view-bias:not(.hidden){ display:block !important; }
#view-bias > *{ max-width:1180px; margin-left:auto; margin-right:auto; }
#view-bias .bi-head{ display:flex; justify-content:space-between; gap:18px; min-height:20px; }
#view-bias .bi-stamp{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-bias .hidden{ display:none !important; }
/* empty */
#view-bias .bi-empty{ max-width:640px; margin:60px auto 0; text-align:center; }
#view-bias .bi-h{ margin:0; font:500 clamp(26px,2.6vw,34px)/1.15 var(--f-disp); letter-spacing:-.022em; color:rgb(var(--ink)); text-wrap:balance; }
#view-bias .bi-sub{ margin:12px auto 0; font:400 15px/1.6 var(--f-body); color:rgb(var(--ink2)); max-width:52ch; }
#view-bias .bi-quiet{ display:flex; justify-content:center; gap:18px; margin-top:24px; }
/* the strata */
#view-bias .bi-arch{ margin-top:22px; }
#view-bias .bi-strata{ display:grid; gap:0; margin:0 -8px; }
#view-bias .bi-band{ position:relative; display:grid; grid-template-columns:150px minmax(0,1fr) auto; align-items:center; gap:24px; min-height:clamp(74px,11vh,104px); padding:0 28px;
  border-top:1px solid rgba(127,211,255,calc(.12 + .38*var(--g)));
  background:linear-gradient(180deg, rgba(31,126,219,calc(.30*var(--g))) 0%, rgba(31,126,219,calc(.10*var(--g))) 40%, rgba(31,126,219,0) 100%);
  animation:bi-rise .7s var(--ease-inst) both; }
#view-bias .bi-band::before{ content:''; position:absolute; left:8%; right:8%; top:-1px; height:1px; background:linear-gradient(90deg,transparent,rgba(223,244,255,calc(.85*var(--g))),transparent); filter:blur(.2px); }
#view-bias .bi-band:last-child{ border-bottom:1px solid rgba(127,211,255,.10); }
#view-bias .bi-band__pos{ font:400 13px/1.3 var(--f-body); color:rgb(var(--ink3)); }
#view-bias .bi-band__name{ font:500 clamp(17px,1.5vw,20px)/1.2 var(--f-body); color:rgb(var(--ink)); opacity:calc(.55 + .45*var(--g)); }
#view-bias .bi-band__name small{ display:block; margin-top:3px; font:400 13px/1.3 var(--f-body); color:rgb(var(--ink3)); }
#view-bias .bi-band__v{ font:300 26px/1 var(--f-body); letter-spacing:-.04em; color:rgb(var(--ink)); font-variant-numeric:tabular-nums; opacity:calc(.5 + .5*var(--g)); }
#view-bias .bi-band__act{ position:absolute; right:28px; bottom:10px; font:400 12px var(--f-body); color:var(--mg-ice); }
#view-bias .bi-band.is-active{ background:linear-gradient(180deg, rgba(31,126,219,calc(.30*var(--g) + .08)) 0%, rgba(31,126,219,calc(.10*var(--g) + .05)) 40%, rgba(31,126,219,.02) 100%); }
#view-bias .bi-band.is-active .bi-band__name{ opacity:1; }
/* the disturbance: a lit point and two slow ripples */
#view-bias .bi-band__pt{ position:absolute; left:62%; top:50%; width:10px; height:10px; margin:-5px 0 0 -5px; border-radius:50%; background:#DFF4FF; box-shadow:0 0 14px rgba(127,211,255,.9), 0 0 40px rgba(31,126,219,.8); }
#view-bias .bi-band__pt i{ position:absolute; inset:-14px; border-radius:50%; border:1px solid rgba(127,211,255,.55); animation:bi-ripple 3.6s ease-out infinite; }
#view-bias .bi-band__pt i:last-child{ animation-delay:1.8s; }
html[data-theme="light"] #view-bias .bi-band__pt{ background:#1F7EDB; box-shadow:0 0 14px rgba(31,126,219,.7); }
html[data-theme="light"] #view-bias .bi-band__pt i{ border-color:rgba(31,126,219,.55); }
@keyframes bi-ripple{ 0%{ transform:scale(.4); opacity:.9; } 100%{ transform:scale(3.2); opacity:0; } }
@keyframes bi-rise{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ #view-bias .bi-band{ animation:none; } #view-bias .bi-band__pt i{ animation:none; opacity:.4; transform:scale(1.6); } }
/* the read: loadBias's card, given the room's voice */
#view-bias .bi-read{ max-width:680px; margin:34px auto 0; text-align:center; }
#view-bias .bi-read .sr-card{ border:0 !important; border-left:0 !important; background:none !important; padding:0 !important; box-shadow:none !important; }
#view-bias .bi-read .sr-card::before, #view-bias .bi-read .sr-card::after{ display:none !important; }
#view-bias .bi-fflib summary > span:first-child, #view-bias .bi-fflib summary .ff-tag, #view-bias .bi-fflib summary [class*="pill"]{ border:0 !important; background:none !important; padding:0 !important; margin-right:8px; font:400 13px var(--f-body) !important; color:rgb(var(--ink3)) !important; letter-spacing:0 !important; text-transform:none !important; }
#view-bias .bi-read .sr-card > div:first-child{ justify-content:center; margin-bottom:12px !important; }
#view-bias .bi-read .sr-dot{ display:none !important; }
#view-bias .bi-read .sr-card .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-bias .bi-read .sr-card > p.text-lg{ font:500 clamp(28px,3vw,38px)/1.1 var(--f-disp) !important; letter-spacing:-.025em; color:rgb(var(--ink)) !important; text-wrap:balance; }
#view-bias .bi-read .sr-card > p.text-\[13\.5px\]{ font:400 16px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; margin:14px auto 0 !important; max-width:56ch; }
#view-bias .bi-read .sr-card > div.mt-4{ margin:22px auto 0 !important; padding:16px 2px 0 !important; border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; background:none !important; text-align:left; }
#view-bias .bi-read .sr-card > div.mt-4 svg{ display:none; }
#view-bias .bi-read .sr-card > div.mt-4 .overline{ font:500 15px var(--f-disp) !important; color:rgb(var(--ink)) !important; }
#view-bias .bi-read .sr-card > div.mt-4 p:last-child{ font:italic 500 19px/1.5 var(--f-em) !important; color:#dff4ff !important; margin-top:6px !important; }
html[data-theme="light"] #view-bias .bi-read .sr-card > div.mt-4 p:last-child{ color:#0e4d78 !important; }
/* the rows: loadBias's biasCard markup, flattened */
#view-bias .bi-rows{ max-width:760px; margin:44px auto 0; }
#view-bias .bi-rows + .bi-rows{ margin-top:30px; }
#view-bias .bi-h3{ margin:0 0 6px; font:500 16px/1.2 var(--f-disp); letter-spacing:-.01em; color:rgb(var(--ink)); }
#view-bias .bi-cards > div{ border:0 !important; border-top:1px solid var(--hair) !important; background:none !important; padding:16px 2px 6px !important; border-radius:0 !important; }
#view-bias .bi-cards > div > div:first-child{ margin-bottom:6px !important; }
#view-bias .bi-cards > div > div:first-child > span{ display:none !important; }
#view-bias .bi-cards .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-bias .bi-cards > div > p{ font:400 16px/1.6 var(--f-body) !important; color:rgb(var(--ink)) !important; max-width:64ch; }
#view-bias .bi-cards > div > div.mt-4{ margin:12px 0 0 !important; padding:10px 0 8px !important; border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; background:none !important; }
#view-bias .bi-cards > div > div.mt-4 svg{ display:none; }
#view-bias .bi-cards > div > div.mt-4 .overline{ font:500 14px var(--f-body) !important; color:rgb(var(--ink2)) !important; }
#view-bias .bi-cards > div > div.mt-4 p:last-child{ font:400 15px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:64ch; }
#view-bias .bi-cards .text-on-muted.text-sm{ font:400 15px/1.6 var(--f-body); color:rgb(var(--ink3)); padding:14px 2px; border-top:1px solid var(--hair); }
/* the fold */
#view-bias .bi-fold{ max-width:760px; margin:40px auto 0; border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); }
#view-bias .bi-fold__sum{ list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:56px; padding:0 2px; font:500 16px/1.3 var(--f-body); color:rgb(var(--ink)); }
#view-bias .bi-fold__sum::-webkit-details-marker{ display:none; }
#view-bias .bi-fold__sum::before{ content:'+'; width:14px; color:rgb(var(--ink3)); margin-right:6px; font:400 16px/1 var(--f-body); }
#view-bias .bi-fold[open] .bi-fold__sum::before{ content:'−'; }
#view-bias .bi-fold__t{ flex:1 1 auto; }
#view-bias .bi-fold__state{ font:400 13px var(--f-body); color:rgb(var(--ink3)); }
#view-bias .bi-fold[open]{ padding-bottom:26px; }
#view-bias .bi-study{ margin-top:26px; }
#view-bias .bi-study .bi-cards{ display:block !important; }
/* the layer-by-layer cards js/06 writes: kept, quieted */
#view-bias .bi-bx{ display:block !important; }
#view-bias .bi-bx .bx-card{ border:0 !important; border-top:1px solid var(--hair) !important; background:none !important; border-radius:0 !important; margin:0 !important; }
#view-bias .bi-bx .bx-head{ padding:14px 2px !important; }
#view-bias .bi-bx .bx-head > div > div > span{ display:none !important; }
#view-bias .bi-bx .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-bias .bi-bx .bx-head p.text-\[13\.5px\]{ font:400 15px/1.5 var(--f-body) !important; color:rgb(var(--ink)) !important; }
#view-bias .bi-bx .bx-head p.font-semibold{ font:500 16px/1.4 var(--f-body) !important; color:rgb(var(--ink)) !important; }
#view-bias .bi-bx .bx-inner{ padding:0 2px 16px !important; }
#view-bias .bi-bx .bx-inner > div{ border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; background:none !important; padding:10px 0 !important; margin-top:8px !important; }
#view-bias .bi-bx .bx-inner svg{ display:none; }
#view-bias .bi-bx .bx-inner p{ font:400 15px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; }
#view-bias .bi-bx .bx-inner p.italic{ color:rgb(var(--ink3)) !important; }
#view-bias .bi-bx h3.overline, #view-bias .bi-bx .col-span-full{ border-top:1px solid var(--hair) !important; border-style:solid !important; padding-top:18px !important; }
/* the reasoning faults: js/12's library, quieted */
#view-bias .bi-ffhead{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; }
#view-bias .bi-fftools{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-top:10px; }
#view-bias .bi-field{ flex:1 1 260px; min-width:0; background:rgba(15,23,36,.5) !important; border:1px solid var(--hair2) !important; border-radius:12px !important; padding:10px 14px !important; font:400 14px/1.4 var(--f-body) !important; color:rgb(var(--ink)) !important; outline:none; }
#view-bias .bi-field:focus{ border-color:var(--mg-ice) !important; }
html[data-theme="light"] #view-bias .bi-field{ background:#fff !important; }
#view-bias .bi-ffilter{ display:flex; gap:16px; }
#view-bias .bi-ffilter .int-pill{ display:inline-flex !important; background:none !important; border:0 !important; padding:0 2px !important; min-height:40px; font:500 14px var(--f-body) !important; color:rgb(var(--ink3)) !important; text-transform:none !important; letter-spacing:0 !important; box-shadow:none !important; }
#view-bias .bi-ffilter .int-pill.sel, #view-bias .bi-ffilter .int-pill[aria-pressed="true"]{ color:rgb(var(--ink)) !important; text-decoration:underline; text-decoration-color:rgba(127,211,255,.6); text-underline-offset:6px; }
#view-bias .bi-fflib{ display:block !important; margin-top:12px; }
#view-bias .bi-fflib details{ border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; background:none !important; padding:0 !important; margin:0 !important; }
#view-bias .bi-fflib summary{ padding:12px 2px !important; font:500 15px/1.4 var(--f-body) !important; color:rgb(var(--ink)) !important; }
#view-bias .bi-fflib details > div{ padding:0 2px 14px !important; }
#view-bias .bi-fflib p, #view-bias .bi-fflib span:not(.overline){ font:400 14px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; letter-spacing:0 !important; text-transform:none !important; }
#view-bias .bi-fflib .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-bias [class*="border-white/"], #view-bias [class*="bg-white/"]{ border-color:var(--hair) !important; background-color:transparent !important; }
@media (max-width:767px){
  #view-bias .bi-strata{ margin:0; }
  #view-bias .bi-band{ grid-template-columns:minmax(0,1fr) auto; padding:14px 16px; min-height:78px; gap:12px; }
  #view-bias .bi-band__pos{ grid-column:1 / -1; }
  #view-bias .bi-band__pt{ left:70%; }
  #view-bias .bi-band__act{ right:16px; bottom:8px; }
  #view-bias .bi-read .sr-card > p.text-lg{ font-size:26px !important; }
}

/* ── BLIND SPOTS: the exposure polygon in open space; seven domains as spokes, the polygon reaching
       further where the lens bends, the sharpest exposure lit. Beside it the read; beneath, the
       domains and the strata as rows; the faults and the full read under one fold.
       (js/34-blindspots.js recomposes js/03's own output.) ── */
#view-blindspots:not(.hidden){ display:block !important; }
#view-blindspots > *{ max-width:1180px; margin-left:auto; margin-right:auto; }
#view-blindspots .bs-head{ display:flex; justify-content:space-between; gap:18px; min-height:20px; }
#view-blindspots .bs-stamp{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
/* the field */
#view-blindspots .bs-field{ display:grid; grid-template-columns:minmax(0,6fr) minmax(0,5fr); column-gap:64px; align-items:center; margin-top:6px; min-height:min(600px, calc(100dvh - 260px)); }
#view-blindspots .bs-svg{ display:block; width:100%; max-width:620px; height:auto; overflow:visible; }
#view-blindspots .bs-t{ font:400 14px var(--f-body); fill:rgb(var(--ink3)); transition:fill var(--dur-1); }
#view-blindspots .bs-t--top{ fill:rgb(var(--ink)); font-weight:500; }
#view-blindspots .bs-t.is-lit{ fill:#DFF4FF; }
#view-blindspots .bs-v{ transition:r var(--dur-1), fill var(--dur-1); }
#view-blindspots .bs-v.is-lit{ fill:#DFF4FF; r:7; }
#view-blindspots .bs-poly{ transform-box:fill-box; transform-origin:center; animation:bs-grow 1s var(--ease-inst) both; }
@keyframes bs-grow{ from{ opacity:0; transform:scale(.2); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ #view-blindspots .bs-poly{ animation:none; } }
#view-blindspots .bs-lead .bs-stamp{ margin:0 0 10px; }
#view-blindspots .bs-h{ margin:0; font:500 clamp(28px,3vw,38px)/1.1 var(--f-disp); letter-spacing:-.025em; color:rgb(var(--ink)); text-wrap:balance; }
#view-blindspots .bs-sub{ margin:14px 0 0; font:400 16px/1.6 var(--f-body); color:rgb(var(--ink2)); max-width:46ch; }
#view-blindspots .bs-counter{ margin:18px 0 0; padding-top:14px; border-top:1px solid var(--hair); display:grid; gap:4px; }
#view-blindspots .bs-counter span{ font:400 13px var(--f-body); color:rgb(var(--ink3)); }
#view-blindspots .bs-counter em{ font:italic 500 19px/1.45 var(--f-em); color:#dff4ff; }
html[data-theme="light"] #view-blindspots .bs-counter em{ color:#0e4d78; }
#view-blindspots .bs-fine{ margin:16px 0 0; font:400 13px/1.55 var(--f-body); color:rgb(var(--ink3)); max-width:46ch; }
#view-blindspots .bs-lead--empty{ max-width:640px; margin:60px auto 0; text-align:center; }
#view-blindspots .bs-quiet{ display:flex; justify-content:center; gap:18px; margin-top:24px; }
/* the rows */
#view-blindspots .bs-rows{ max-width:760px; margin:44px auto 0; }
#view-blindspots .bs-h3{ margin:0 0 4px; font:500 16px/1.2 var(--f-disp); letter-spacing:-.01em; color:rgb(var(--ink)); }
#view-blindspots .bs-row{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) auto; gap:20px; align-items:center; padding:12px 2px; border-top:1px solid var(--hair); font:400 15px/1.5 var(--f-body); color:rgb(var(--ink)); cursor:default; outline:none; }
#view-blindspots .bs-row:last-of-type{ border-bottom:1px solid var(--hair); }
#view-blindspots .bs-row:focus-visible{ outline:2px solid var(--focus); outline-offset:2px; border-radius:6px; }
#view-blindspots .bs-row.is-top .bs-row__n{ font-weight:500; }
#view-blindspots .bs-row__bar{ display:block; height:1px; background:var(--hair2); position:relative; }
#view-blindspots .bs-row__bar i{ position:absolute; left:0; top:0; height:1px; background:linear-gradient(90deg,#1F7EDB,#7FD3FF); box-shadow:0 0 8px rgba(31,126,219,.6); }
#view-blindspots .bs-row__w{ font-size:14px; color:rgb(var(--ink3)); white-space:nowrap; }
#view-blindspots .bs-row.is-top .bs-row__w{ color:rgb(var(--ink2)); }
/* the strata rows */
#view-blindspots .bs-srow{ display:grid; grid-template-columns:150px minmax(0,1fr); grid-template-areas:"pos name" "pos bias"; gap:2px 20px; width:100%; text-align:left; padding:14px 2px; border:0; border-top:1px solid var(--hair); background:none; cursor:pointer; color:rgb(var(--ink)); }
#view-blindspots .bs-srow:last-of-type{ border-bottom:1px solid var(--hair); }
#view-blindspots .bs-srow:hover, #view-blindspots .bs-srow.is-on{ background:var(--s-subtle); }
#view-blindspots .bs-srow:focus-visible{ outline:2px solid var(--focus); outline-offset:2px; border-radius:6px; }
#view-blindspots .bs-srow__pos{ grid-area:pos; font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); align-self:start; padding-top:3px; }
#view-blindspots .bs-srow__name{ grid-area:name; font:500 16px/1.4 var(--f-body); color:rgb(var(--ink)); }
#view-blindspots .bs-srow__bias{ grid-area:bias; font:400 14px/1.5 var(--f-body); color:rgb(var(--ink2)); }
#view-blindspots .bs-srow.is-on .bs-srow__name{ color:#DFF4FF; }
/* the stratum detail js/03 writes, quieted */
#view-blindspots .bs-detail:empty{ display:none; }
#view-blindspots .bs-detail > div{ border:0 !important; border-left:0 !important; background:none !important; border-radius:0 !important; padding:18px 2px 8px !important; margin-top:6px; }
#view-blindspots .bs-detail .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-blindspots .bs-detail p{ font:400 15px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; }
#view-blindspots .bs-detail > div > p.font-semibold{ font:500 20px/1.3 var(--f-disp) !important; color:rgb(var(--ink)) !important; margin-top:4px !important; }
#view-blindspots .bs-detail > div > div{ border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; background:none !important; padding:10px 0 !important; margin-top:10px !important; }
/* the fold */
#view-blindspots .bs-fold{ max-width:760px; margin:40px auto 0; border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); }
#view-blindspots .bs-fold__sum{ list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:56px; padding:0 2px; font:500 16px/1.3 var(--f-body); color:rgb(var(--ink)); }
#view-blindspots .bs-fold__sum::-webkit-details-marker{ display:none; }
#view-blindspots .bs-fold__sum::before{ content:'+'; width:14px; color:rgb(var(--ink3)); margin-right:6px; font:400 16px/1 var(--f-body); }
#view-blindspots .bs-fold[open] .bs-fold__sum::before{ content:'−'; }
#view-blindspots .bs-fold__t{ flex:1 1 auto; }
#view-blindspots .bs-fold__state{ font:400 13px var(--f-body); color:rgb(var(--ink3)); }
#view-blindspots .bs-fold[open]{ padding-bottom:26px; }
#view-blindspots .bs-fold__in{ display:block; }
#view-blindspots .bs-fold__in > *{ margin-top:26px !important; }
#view-blindspots .bs-fold__in .card, #view-blindspots .bs-fold__in section{ border:0 !important; background:none !important; box-shadow:none !important; padding:0 !important; border-radius:0 !important; }
#view-blindspots .bs-fold__in .overline{ font:500 16px/1.2 var(--f-disp) !important; letter-spacing:-.01em !important; text-transform:none !important; color:rgb(var(--ink)) !important; }
#view-blindspots .bs-fold__in .font-mono, #view-blindspots .bs-fold__in [class*="tracking-"]{ font-family:var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; }
#view-blindspots .bs-fold__in .bs-fault-filter{ background:none !important; border:0 !important; color:rgb(var(--ink3)) !important; padding:0 2px !important; min-height:40px; font:500 14px var(--f-body) !important; margin-right:14px; }
#view-blindspots .bs-fold__in .bs-fault-filter[style*="rgba(0,191,255,0.9)"], #view-blindspots .bs-fold__in .bs-fault-filter[style*="rgba(240,138,138,0.9)"]{ color:rgb(var(--ink)) !important; text-decoration:underline; text-decoration-color:rgba(127,211,255,.6); text-underline-offset:6px; }
#view-blindspots .bs-fold__in details{ border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; background:none !important; padding:0 !important; }
#view-blindspots .bs-fold__in details summary{ padding:12px 2px !important; border:0 !important; background:none !important; border-radius:0 !important; }
#view-blindspots .bs-fold__in p, #view-blindspots .bs-fold__in span:not(.overline){ letter-spacing:0 !important; text-transform:none !important; }
#view-blindspots [class*="border-white/"], #view-blindspots [class*="bg-white/"]{ border-color:var(--hair) !important; background-color:transparent !important; }
@media (max-width:1023px){
  #view-blindspots .bs-field{ grid-template-columns:minmax(0,1fr); row-gap:26px; min-height:0; }
  #view-blindspots .bs-svg{ max-width:520px; margin:0 auto; }
}
@media (max-width:767px){
  #view-blindspots .bs-t{ font-size:17px; }
  #view-blindspots .bs-h{ font-size:28px; }
  #view-blindspots .bs-row{ grid-template-columns:minmax(0,1fr) auto; } #view-blindspots .bs-row__bar{ grid-column:1 / -1; order:3; }
  #view-blindspots .bs-srow{ grid-template-columns:minmax(0,1fr); grid-template-areas:"pos" "name" "bias"; }
}

/* ── DEEP READ: typography is the anchor. One 66ch column, the title as an object, the seven sections
       as a continuous piece with Cormorant numerals in the margin, the double edge as the coda.
       (js/02 renderDeep writes the content; this composes it.) ── */
#view-deep:not(.hidden){ display:block !important; }
#view-deep .dr{ width:100%; max-width:66ch; margin:0 auto; }
#view-deep .dr-head{ display:flex; justify-content:space-between; gap:18px; min-height:20px; }
#view-deep .dr-stamp{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-deep .dr-title{ margin:64px 0 0; font:500 clamp(38px,4.4vw,58px)/1.04 var(--f-disp) !important; letter-spacing:-.03em; color:rgb(var(--ink)) !important; text-wrap:balance; }
#view-deep .dr-title em{ font:italic 500 1.02em var(--f-em); color:#dff4ff; }
html[data-theme="light"] #view-deep .dr-title em{ color:#0e4d78; }
#view-deep .dr-sig{ margin:22px 0 0; display:flex; gap:14px; align-items:baseline; flex-wrap:wrap; }
#view-deep #deep-arch{ font:500 18px/1.3 var(--f-body) !important; letter-spacing:0 !important; color:rgb(var(--ink)) !important; text-shadow:none !important; }
#view-deep .dr-sig__sub{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; color:rgb(var(--ink3)) !important; }
/* the body: js/02's grid of cards becomes a sequence of sections */
#view-deep .dr-body{ display:flex; flex-direction:column; margin-top:56px; }
#view-deep .dr-body > .grid{ display:block !important; margin:0 !important; }
#view-deep .dr-body > .grid > div{ position:relative; border:0 !important; background:none !important; box-shadow:none !important; border-radius:0 !important; padding:34px 0 30px !important; border-top:1px solid var(--hair) !important; }
#view-deep .dr-body > .grid > div:first-child{ border-top:0 !important; padding-top:0 !important; }
#view-deep .dr-body > .grid > div > div:first-child{ position:absolute; left:-64px; top:38px; margin:0 !important; display:block !important; }
#view-deep .dr-body > .grid > div:first-child > div:first-child{ top:4px; }
#view-deep .dr-body > .grid > div > div:first-child span:first-child{ font:italic 500 24px/1 var(--f-em) !important; letter-spacing:0 !important; color:rgb(var(--ink3)) !important; }
#view-deep .dr-body > .grid > div > div:first-child span:not(:first-child){ display:none !important; }
#view-deep .dr-body > .grid > div > h3{ margin:0 0 14px !important; font:500 26px/1.15 var(--f-disp) !important; letter-spacing:-.02em !important; color:rgb(var(--ink)) !important; text-wrap:balance; }
#view-deep .dr-body > .grid > div > p{ font:400 17px/1.75 var(--f-body) !important; color:rgb(var(--ink2)) !important; }
#view-deep .dr-body .read-prose b, #view-deep .dr-body .read-prose strong{ color:rgb(var(--ink)); font-weight:500; }
#view-deep .dr-body .reveal-up{ opacity:1 !important; transform:none !important; }
/* the double edge: the coda */
#view-deep .dr-body > section{ order:9; border:0 !important; background:none !important; padding:40px 0 0 !important; margin:30px 0 0 !important; border-top:1px solid var(--hair) !important; }
#view-deep .dr-body > section h3.overline{ font:500 26px/1.15 var(--f-disp) !important; letter-spacing:-.02em !important; text-transform:none !important; color:rgb(var(--ink)) !important; }
#view-deep .dr-body > section span.font-mono{ font:italic 500 16px var(--f-em) !important; letter-spacing:0 !important; color:rgb(var(--ink3)) !important; }
#view-deep .dr-body > section > p{ font:400 16px/1.7 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:none !important; margin:12px 0 22px !important; }
#view-deep .dr-body > section > div{ padding:18px 0 !important; border-color:var(--hair) !important; }
#view-deep .dr-body > section > div > div:first-child span:first-child{ font:500 17px var(--f-body) !important; color:rgb(var(--ink)) !important; }
#view-deep .dr-body > section > div > div:first-child span:last-child{ font:400 13px var(--f-body) !important; letter-spacing:0 !important; color:rgb(var(--ink3)) !important; }
#view-deep .dr-body > section > div > div:last-child{ font:400 15px/1.6 var(--f-body) !important; }
#view-deep .dr-body > section > div > div:last-child .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; margin-bottom:4px !important; }
#view-deep .dr-body > section > div > div:last-child span:not(.overline){ color:rgb(var(--ink2)) !important; }
#view-deep .dr-body > section > div > div:last-child > div.w-px{ background:var(--hair2) !important; }
#view-deep .dr-body > section > div > div:last-child > div:first-child span:not(.overline){ color:rgb(var(--ink)) !important; }
/* empty state */
#view-deep .dr-body > div.border-dashed{ border:0 !important; background:none !important; padding:0 !important; text-align:left !important; }
#view-deep .dr-body > div.border-dashed p:first-child{ font:500 24px/1.2 var(--f-disp) !important; color:rgb(var(--ink)) !important; }
#view-deep .dr-body > div.border-dashed p:not(:first-child){ font:400 16px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:none !important; margin:12px 0 0 !important; }
/* the foot */
#view-deep .dr-foot{ display:flex; gap:22px; align-items:center; margin-top:44px; padding-top:20px; border-top:1px solid var(--hair); }
#view-deep .dr-quiet{ background:none; border:0; padding:0 2px; min-height:44px; font:500 14px var(--f-body); color:rgb(var(--ink2)); cursor:pointer; }
#view-deep .dr-quiet:hover{ color:rgb(var(--ink)); }
#view-deep .dr-quiet:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; border-radius:6px; }
#view-deep .dr-msg{ font:400 13px var(--f-body); color:rgb(var(--ink3)); }
@media (max-width:1023px){
  #view-deep .dr-body > .grid > div > div:first-child{ position:static; margin-bottom:10px !important; }
}
@media (max-width:767px){
  #view-deep .dr-title{ margin-top:40px; font-size:36px !important; }
  #view-deep .dr-body{ margin-top:40px; }
  #view-deep .dr-body > .grid > div > h3{ font-size:23px !important; }
  #view-deep .dr-body > .grid > div > p{ font-size:16px !important; }
  #view-deep .dr-body > section > div > div:last-child{ flex-direction:column !important; gap:12px !important; }
  #view-deep .dr-body > section > div > div:last-child > div:first-child{ text-align:left !important; }
  #view-deep .dr-body > section > div > div:last-child > div.w-px{ display:none; }
}

/* ── THE PROOF: one integrity line across the whole record, every reading a point, the two halves the
       exhibit compares as faint levels. Beneath it the case, as an editorial sequence: no tiles, no
       boxes, the numbers in Manrope 300 ink. (js/36-proof.js draws the line; js/11 keeps every exhibit.) ── */
#view-proof:not(.hidden){ display:block !important; }
#view-proof .pf{ max-width:1180px; margin:0 auto; }
#view-proof .pf-field{ margin:0 -12px 8px; }
#view-proof .pf-line{ display:block; width:100%; height:auto; max-height:min(38vh,320px); overflow:visible; }
#view-proof .pf-t{ font:400 13px var(--f-body); fill:rgb(var(--ink3)); }
#view-proof .pf-t--dim{ fill:rgb(var(--ink4)); }
#view-proof .pf-path{ stroke-dasharray:1; stroke-dashoffset:1; animation:rd-drawin 1.4s var(--ease-inst) forwards; }
#view-proof .pf-area, #view-proof .pf-halo, #view-proof .pf-mean{ animation:pf-fade 1s .6s var(--ease-inst) both; }
@keyframes pf-fade{ from{ opacity:0; } to{ opacity:1; } }
@keyframes pf-in{ from{ opacity:0; transform:scale(.4); } to{ opacity:1; transform:none; } }
#view-proof .pf-pt{ transform-box:fill-box; transform-origin:center; animation:pf-in .4s .9s var(--ease-inst) both; }
@media (prefers-reduced-motion:reduce){ #view-proof .pf-path, #view-proof .pf-area, #view-proof .pf-halo, #view-proof .pf-mean, #view-proof .pf-pt{ animation:none; stroke-dashoffset:0; } }
/* the hero, as a page head */
#view-proof .pf .proof-hero{ max-width:760px; margin:26px auto 0 !important; padding:0 !important; border:0 !important; text-align:center; }
#view-proof .pf .proof-eyebrow{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-proof .pf .proof-title{ margin:10px 0 0 !important; font:500 clamp(30px,3.2vw,42px)/1.1 var(--f-disp) !important; letter-spacing:-.025em !important; color:rgb(var(--ink)) !important; text-wrap:balance; }
#view-proof .pf .proof-sub{ margin:14px auto 0 !important; font:400 16px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:56ch !important; }
#view-proof .pf .proof-verdict{ display:block !important; margin:14px auto 0 !important; padding:0 !important; border:0 !important; background:none !important; font:400 14px/1.6 var(--f-body) !important; color:rgb(var(--ink3)) !important; box-shadow:none !important; }
#view-proof .pf .proof-verdict > span:first-child{ display:none; }
#view-proof .pf .proof-verdict b{ font-weight:500; color:rgb(var(--ink)); }
/* the exhibits, as sections */
#view-proof .pf .proof-grid{ display:block !important; max-width:760px; margin:44px auto 0 !important; }
#view-proof .pf .proof-exhibit{ border:0 !important; border-top:1px solid var(--hair) !important; background:none !important; box-shadow:none !important; border-radius:0 !important; padding:30px 2px 28px !important; margin:0 !important; overflow:visible !important; }
#view-proof .pf .proof-exhibit::before, #view-proof .pf .proof-exhibit::after{ display:none !important; }
#view-proof .pf .proof-exhibit:last-child{ border-bottom:1px solid var(--hair) !important; }
#view-proof .pf .proof-exhibit-head{ font:500 16px/1.25 var(--f-disp) !important; letter-spacing:-.01em !important; text-transform:none !important; color:rgb(var(--ink)) !important; margin:0 0 14px !important; }
#view-proof .pf .brief-cis{ font:300 clamp(48px,5vw,64px)/1 var(--f-body) !important; letter-spacing:-.05em !important; color:rgb(var(--ink)) !important; text-shadow:none !important; font-variant-numeric:tabular-nums; }
#view-proof .pf .proof-exhibit .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; margin-top:6px !important; }
#view-proof .pf .proof-exhibit p:not(.overline):not(.proof-exhibit-head){ font:400 15px/1.65 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:64ch; }
#view-proof .pf .proof-exhibit p.text-on-surface{ color:rgb(var(--ink)) !important; font-size:16px !important; }
#view-proof .pf .proof-exhibit b{ color:rgb(var(--ink)) !important; font-weight:500; }
#view-proof .pf .proof-exhibit .flex.items-end{ gap:40px !important; margin-bottom:10px !important; }
#view-proof .pf > p, #view-proof .pf > .proof-grid ~ p{ max-width:760px; margin:18px auto 0 !important; font:400 13px/1.55 var(--f-body) !important; letter-spacing:0 !important; color:rgb(var(--ink3)) !important; }
@media (max-width:767px){
  #view-proof .pf-field{ margin:0 -8px 4px; }
  #view-proof .pf-t{ font-size:34px; } #view-proof .pf-t--dim{ font-size:30px; }
  #view-proof .pf .proof-title{ font-size:28px !important; }
  #view-proof .pf .brief-cis{ font-size:44px !important; }
}

/* the reading-progress bar (long reads): a 2px ice hairline under the header, not a glowing pill */
#read-progress{ top:var(--hdr-h) !important; height:2px !important; background:transparent !important; left:0 !important; }
@media (min-width:1024px){ #read-progress{ left:var(--rail-w) !important; } }
#read-progress-bar{ height:2px !important; min-height:0 !important; padding:0 !important; border:0 !important; display:block !important; border-radius:0 !important; box-shadow:none !important; background:linear-gradient(90deg,#1F7EDB,#7FD3FF) !important; }

/* ── PROFILE & SETTINGS: the seal on the left, the controls as quiet rows on the right. A setting
       room: nothing competes with the controls. (js/06 renderProfile keeps every value; the handlers
       stay in js/08, js/09, js/11, js/12.) ── */
#view-profile:not(.hidden){ display:block !important; }
#view-profile .pr{ width:100%; max-width:1180px; margin:0 auto; }
#view-profile .pr-head{ display:flex; justify-content:space-between; gap:18px; min-height:20px; }
#view-profile .pr-stamp{ font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }
#view-profile .pr-body{ display:grid; grid-template-columns:minmax(0,4fr) minmax(0,8fr); column-gap:80px; align-items:start; margin-top:26px; }
/* the seal */
#view-profile .pr-seal{ position:sticky; top:calc(var(--hdr-h) + 24px); display:flex; flex-direction:column; align-items:center; text-align:center; padding-top:18px; }
#view-profile .pr-seal__disc{ position:relative; width:206px; height:206px; display:grid; place-items:center; }
#view-profile .pr-seal__ring{ position:absolute; inset:0; width:206px; height:206px; display:block; opacity:.9; }
#view-profile .pr-seal__mark{ position:relative; width:96px; height:96px; border-radius:50%; display:grid; place-items:center;
  font:300 30px/1 var(--f-body); letter-spacing:.04em; color:rgb(var(--ink));
  border:1px solid rgba(160,225,255,.28); background:linear-gradient(150deg,rgba(31,126,219,.22),rgba(31,126,219,.08) 55%,rgba(255,255,255,.02));
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 20px 50px -24px rgba(31,126,219,.9); }
#view-profile .pr-email{ margin:22px 0 0; font:500 16px/1.3 var(--f-body); color:rgb(var(--ink)); }
#view-profile .pr-sig{ margin:6px 0 0; font:500 22px/1.15 var(--f-disp) !important; letter-spacing:-.02em; color:rgb(var(--ink)) !important; }
#view-profile .pr-opno{ margin:8px 0 0; font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); letter-spacing:0; }
#view-profile .pr-line{ margin:18px 0 0; padding-top:14px; border-top:1px solid var(--hair); width:100%; font:400 14px/1.6 var(--f-body); color:rgb(var(--ink3)); }
#view-profile .pr-line span{ font:300 18px/1 var(--f-body) !important; color:rgb(var(--ink)) !important; letter-spacing:-.03em; font-variant-numeric:tabular-nums; background:none !important; -webkit-text-fill-color:currentColor !important; }
#view-profile .pr-quietrow{ display:flex; gap:22px; align-items:center; flex-wrap:wrap; margin-top:10px; }
#view-profile .pr-quiet{ background:none; border:0; padding:0 2px; min-height:44px; font:500 14px var(--f-body); color:rgb(var(--ink2)); cursor:pointer; }
#view-profile .pr-quiet:hover{ color:rgb(var(--ink)); }
#view-profile .pr-quiet--dim{ color:rgb(var(--ink3)); }
#view-profile .pr-quiet:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; border-radius:6px; }
/* the rows */
#view-profile .pr-row{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); column-gap:40px; padding:24px 2px; border-top:1px solid var(--hair); align-items:start; }
#view-profile .pr-rows .pr-row:last-child{ border-bottom:1px solid var(--hair); }
#view-profile .pr-row__t{ display:block; font:500 16px/1.3 var(--f-body); color:rgb(var(--ink)); }
#view-profile .pr-row__d{ display:block; margin-top:6px; font:400 14px/1.55 var(--f-body); color:rgb(var(--ink3)); max-width:40ch; }
#view-profile .pr-row__r{ min-width:0; }
#view-profile .pr-row__r .pr-quietrow{ margin-top:0; min-height:44px; }
#view-profile .pr-msg{ margin:8px 0 0; min-height:16px; font:400 13px var(--f-body); color:rgb(var(--ink2)); }
#view-profile .pr-opts{ display:flex; gap:22px; flex-wrap:wrap; align-items:center; min-height:44px; }
#view-profile .pr-opts .int-pill{ display:inline-flex !important; background:none !important; border:0 !important; padding:0 2px !important; min-height:44px; font:500 14px var(--f-body) !important; color:rgb(var(--ink3)) !important; text-transform:none !important; letter-spacing:0 !important; box-shadow:none !important; cursor:pointer; }
#view-profile .pr-opts .int-pill.sel, #view-profile .pr-opts .int-pill[aria-pressed="true"]{ color:rgb(var(--ink)) !important; text-decoration:underline; text-decoration-color:rgba(127,211,255,.6); text-underline-offset:6px; }
#view-profile .pr-area{ width:100%; min-height:120px; background:rgba(15,23,36,.5); border:1px solid var(--hair2); border-radius:12px; padding:12px 14px; font:400 15px/1.55 var(--f-body); color:rgb(var(--ink)); outline:none; resize:vertical; }
#view-profile .pr-area:focus{ border-color:var(--mg-ice); }
#view-profile .pr-area::placeholder{ color:rgb(var(--ink3)); }
html[data-theme="light"] #view-profile .pr-area{ background:#fff; }
#view-profile .pr-row--stack .pr-quietrow{ margin-top:12px; }
#view-profile .pr-status{ margin:0; min-height:44px; display:flex; align-items:center; font:400 15px/1.5 var(--f-body) !important; letter-spacing:0 !important; color:rgb(var(--ink2)) !important; }
#view-profile .pr-fold{ margin-top:6px; }
#view-profile .pr-fold__sum{ list-style:none; cursor:pointer; display:inline-flex; align-items:center; min-height:40px; font:500 14px var(--f-body); color:rgb(var(--ink3)); }
#view-profile .pr-fold__sum::-webkit-details-marker{ display:none; }
#view-profile .pr-fold__sum::before{ content:'+'; width:14px; color:rgb(var(--ink3)); margin-right:6px; font:400 15px/1 var(--f-body); }
#view-profile .pr-fold[open] .pr-fold__sum::before{ content:'−'; }
#view-profile .pr-fine{ margin:6px 0 0; font:400 13px/1.55 var(--f-body); color:rgb(var(--ink3)); max-width:60ch; }
#view-profile .pr-code{ margin:8px 0 0; font:400 12px/1.6 ui-monospace,Consolas,monospace; color:rgb(var(--ink3)); word-break:break-all; padding:10px 12px; border:1px solid var(--hair); border-radius:10px; }
#view-profile a.ui-btn{ text-decoration:none; }
/* the stack behind the read */
#view-profile .pr-stack{ max-width:760px; margin:56px auto 0; }
#view-profile .pr-stack .overline{ display:block; margin:0 0 6px !important; font:500 16px/1.2 var(--f-disp) !important; letter-spacing:-.01em !important; text-transform:none !important; color:rgb(var(--ink)) !important; }
#view-profile .pr-stack .grid{ display:block !important; }
#view-profile .pr-stack .grid > div{ display:grid !important; grid-template-columns:28px minmax(0,1fr) auto; gap:16px !important; align-items:baseline; padding:12px 2px; border-top:1px solid var(--hair); font:400 15px/1.5 var(--f-body); color:rgb(var(--ink)); }
#view-profile .pr-stack .grid > div:last-child{ border-bottom:1px solid var(--hair); }
#view-profile .pr-stack .grid > div > span:first-child{ font:italic 500 16px var(--f-em) !important; color:rgb(var(--ink3)) !important; width:auto !important; }
#view-profile .pr-stack .grid > div > *:last-child{ font:300 18px/1 var(--f-body) !important; color:rgb(var(--ink)) !important; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
#view-profile .pr-stack [style*="color"]{ color:rgb(var(--ink)) !important; }
#view-profile .pr-stack .grid > div .h-1, #view-profile .pr-stack .grid > div [class*="h-1"]{ display:none !important; }
@media (max-width:1023px){
  #view-profile .pr-body{ grid-template-columns:minmax(0,1fr); row-gap:36px; }
  #view-profile .pr-seal{ position:static; }
  #view-profile .pr-row{ grid-template-columns:minmax(0,1fr); row-gap:12px; }
  #view-profile .pr-row__d{ max-width:none; }
}

/* ── THE PRACTICE: a ledger of people. The verdict over the field, each client one hairline row
       (name · state · trend · last read · Prepare), the preparation as a quiet section, the invite
       one line. (js/18 paints; this composes; js/38 says its words plainly.) ── */
#view-practice:not(.hidden){ display:block !important; }
#view-practice > *{ max-width:1180px; margin-left:auto; margin-right:auto; }
#view-practice .pc-head{ display:flex; justify-content:space-between; gap:18px; min-height:20px; }
#view-practice .pc-stamp, #view-practice #pc-count{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; text-align:right; }
#view-practice #pc-root, #view-practice #pc-state{ max-width:900px; margin:0 auto; }
#view-practice .card{ border:0 !important; background:none !important; box-shadow:none !important; border-radius:0 !important; padding:0 !important; }
/* the verdict */
#view-practice #pc-root > section.card-hero{ margin:34px 0 0 !important; text-align:center; }
#view-practice #pc-root > section.card-hero > .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-practice #pc-root > section.card-hero > p.serif-display{ font:500 clamp(28px,3vw,40px)/1.1 var(--f-disp) !important; letter-spacing:-.025em !important; color:rgb(var(--ink)) !important; max-width:24ch; margin:10px auto 0 !important; }
#view-practice #pc-root > section.card-hero > p.text-on-muted{ font:400 16px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; margin:14px auto 0 !important; max-width:52ch !important; }
#view-practice #pc-root > section.card-hero > div{ justify-content:center; gap:14px 34px !important; margin-top:22px !important; padding-top:16px !important; border-color:var(--hair) !important; }
#view-practice #pc-root > section.card-hero > div span.font-mono:first-child{ font:300 22px/1 var(--f-body) !important; letter-spacing:-.03em !important; color:rgb(var(--ink)) !important; }
#view-practice #pc-root > section.card-hero > div span.font-mono:last-child{ font:400 13px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
/* the clients */
#view-practice #pc-root > section:not(.card-hero){ margin-top:44px !important; }
#view-practice #pc-root h2.overline{ font:500 16px/1.2 var(--f-disp) !important; letter-spacing:-.01em !important; text-transform:none !important; color:rgb(var(--ink)) !important; }
#view-practice #pc-root .text-xs.text-on-muted{ font:400 13px/1.5 var(--f-body) !important; color:rgb(var(--ink3)) !important; }
#view-practice #pc-root .pill{ display:none !important; }
#view-practice #pc-roster{ margin-top:8px !important; }
#view-practice #pc-roster > *{ margin:0 !important; }
#view-practice .pc-row{ border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; background:none !important; padding:14px 2px !important; gap:18px !important; min-height:56px; }
#view-practice #pc-roster .pc-row:last-child{ border-bottom:1px solid var(--hair) !important; }
#view-practice .pc-row:hover{ background:var(--s-subtle) !important; }
#view-practice .pc-row:focus-visible{ outline:2px solid var(--focus); outline-offset:2px; border-radius:6px; }
#view-practice .pc-row > span:first-child{ box-shadow:none !important; }
#view-practice .pc-row > span.text-sm{ font:500 16px/1.3 var(--f-body) !important; color:rgb(var(--ink)) !important; }
#view-practice .pc-row span[class*="tracking-"]{ border:0 !important; padding:0 !important; font:400 13px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-practice .pc-row span.font-mono.text-\[11px\]{ font:400 14px var(--f-body) !important; color:rgb(var(--ink2)) !important; }
#view-practice .pc-row span.font-mono.uppercase{ font:500 14px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink2)) !important; }
#view-practice .pc-row:hover span.font-mono.uppercase{ color:rgb(var(--ink)) !important; }
#view-practice .pc-row svg path, #view-practice .pc-row svg polyline{ stroke:#7FD3FF !important; }
/* the preparation */
#view-practice #pc-focus{ margin-top:36px !important; padding:24px 2px 0 !important; border-top:1px solid var(--hair) !important; }
#view-practice #pc-focus .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-practice #pc-focus h3{ font:500 26px/1.15 var(--f-disp) !important; letter-spacing:-.02em !important; color:rgb(var(--ink)) !important; }
#view-practice #pc-focus h3 span{ box-shadow:none !important; }
#view-practice #pc-focus p.font-mono{ font:400 14px/1.6 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-practice #pc-focus .brief-row{ padding:10px 0 !important; border-top:1px solid var(--hair); }
#view-practice #pc-focus .brief-row span:last-child{ font:400 15px/1.6 var(--f-body) !important; color:rgb(var(--ink)) !important; }
#view-practice #pc-focus svg polyline, #view-practice #pc-focus svg path{ stroke:#7FD3FF; }
#view-practice #pc-focus-close{ font:500 14px var(--f-body) !important; color:rgb(var(--ink3)) !important; }
/* the invite: one line */
#view-practice #pc-root > section:last-child > div{ padding:18px 2px !important; border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); }
#view-practice #pc-code{ font:300 26px/1 var(--f-body) !important; letter-spacing:.18em !important; color:rgb(var(--ink)) !important; }
#view-practice #pc-copy{ border:0 !important; background:none !important; padding:0 2px !important; min-height:44px; font:500 14px var(--f-body) !important; color:rgb(var(--ink2)) !important; }
#view-practice #pc-copy:hover{ color:rgb(var(--ink)) !important; }
#view-practice #pc-root > section:last-child > p{ font:400 13px/1.55 var(--f-body) !important; color:rgb(var(--ink3)) !important; border:0 !important; padding-top:12px !important; margin-top:0 !important; max-width:70ch; }
/* the states: sign in / set up / error, as a quiet lead */
#view-practice #pc-state{ margin-top:40px; }
#view-practice #pc-state .card{ max-width:none !important; }
#view-practice #pc-state .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-practice #pc-state h3{ font:500 clamp(26px,2.6vw,34px)/1.15 var(--f-disp) !important; letter-spacing:-.022em !important; color:rgb(var(--ink)) !important; margin-top:8px !important; }
#view-practice #pc-state p.text-sm{ font:400 16px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:52ch !important; }
#view-practice #pc-state .grid{ gap:0 56px !important; margin-top:36px !important; }
#view-practice #pc-state .grid > div{ border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; padding:22px 2px 26px !important; }
#view-practice #pc-state .grid > div > p.text-sm{ font:500 17px/1.3 var(--f-body) !important; color:rgb(var(--ink)) !important; }
#view-practice #pc-state .grid > div > p.text-xs{ font:400 14px/1.55 var(--f-body) !important; color:rgb(var(--ink3)) !important; max-width:40ch; }
#view-practice #pc-state label.text-xs, #view-practice #pc-state label .text-xs{ font:400 13px/1.4 var(--f-body) !important; color:rgb(var(--ink3)) !important; }
#view-practice #pc-state input:not([type="checkbox"]){ background:rgba(15,23,36,.5) !important; border:1px solid var(--hair2) !important; border-radius:12px !important; padding:11px 14px !important; font:400 15px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink)) !important; }
html[data-theme="light"] #view-practice #pc-state input:not([type="checkbox"]){ background:#fff !important; }
#view-practice #pc-state button#pc-create, #view-practice #pc-state button#pc-join{ width:auto !important; margin-top:16px !important; padding:0 22px !important; min-height:44px; border-radius:999px !important; border:1px solid var(--mg-pill-edge) !important; background:var(--mg-pill-bg) !important; font:500 14px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink)) !important; }
#view-practice #pc-state button#pc-create:hover, #view-practice #pc-state button#pc-join:hover{ background:var(--mg-pill-hover) !important; }
#view-practice #pc-state label.flex span{ font:400 13px/1.55 var(--f-body) !important; color:rgb(var(--ink3)) !important; }
#view-practice #pc-state > .card > p:last-child{ font:400 13px/1.55 var(--f-body) !important; color:rgb(var(--ink3)) !important; border-color:var(--hair) !important; }
#view-practice [class*="border-white/"], #view-practice [class*="bg-white/"]{ border-color:var(--hair) !important; background-color:transparent !important; }
@media (max-width:767px){
  #view-practice .pc-row{ flex-wrap:wrap; }
  #view-practice #pc-root > section.card-hero > p.serif-display{ font-size:26px !important; }
}

/* ── TEAM and COHORT: people sharing an instrument. Empty: one quiet centred invitation. Populated: the
       headline as a sentence, the aggregate as one number, one mark per member lit by its state, the
       members as hairline rows, the invite one line. (js/08 paints; this composes; js/39 says its words.) ── */
#view-team:not(.hidden), #view-cohort:not(.hidden){ display:block !important; }
#view-team > *, #view-cohort > *{ max-width:900px; margin-left:auto; margin-right:auto; }
:is(#view-team,#view-cohort) .ws-stamp, :is(#view-team,#view-cohort) #tm-count, :is(#view-team,#view-cohort) #ch-count{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
:is(#view-team,#view-cohort) h2.serif-display{ font:500 clamp(28px,3vw,38px)/1.1 var(--f-disp) !important; letter-spacing:-.025em !important; color:rgb(var(--ink)) !important; }
:is(#view-team,#view-cohort) > section:first-child p.text-sm{ font:400 15px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:52ch; }
:is(#view-team,#view-cohort) .card{ border:0 !important; background:none !important; box-shadow:none !important; border-radius:0 !important; padding:0 !important; }
:is(#view-team,#view-cohort) .overline{ font:500 16px/1.2 var(--f-disp) !important; letter-spacing:-.01em !important; text-transform:none !important; color:rgb(var(--ink)) !important; }
:is(#view-team,#view-cohort) .text-xs.text-on-muted, :is(#view-team,#view-cohort) .text-\[11px\], :is(#view-team,#view-cohort) .text-\[10px\]{ font:400 13px/1.5 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
/* the headline */
#tm-headline, #ch-headline{ font:500 clamp(26px,2.8vw,36px)/1.15 var(--f-disp) !important; letter-spacing:-.022em !important; color:rgb(var(--ink)) !important; text-wrap:balance; max-width:26ch; }
#tm-headline-sub, #ch-headline-sub{ font:400 16px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:52ch; margin-top:12px !important; }
/* the aggregate: one number, not a tile */
#tm-avg, #ch-avg, #ch-members, #ch-crit{ font:300 clamp(48px,5vw,64px)/1 var(--f-body) !important; letter-spacing:-.05em !important; color:rgb(var(--ink)) !important; background:none !important; -webkit-text-fill-color:currentColor !important; text-shadow:none !important; }
#tm-delta{ font:400 15px/1.4 var(--f-body) !important; color:rgb(var(--ink2)) !important; }
#tm-delta-lbl{ font:400 13px var(--f-body) !important; color:rgb(var(--ink3)) !important; }
#tm-mesh, #ch-field{ display:none !important; }
#tm-trend, #ch-growth{ max-height:120px; }
#tm-trend polyline, #tm-trend path, #ch-growth polyline, #ch-growth path{ stroke:#7FD3FF !important; }
/* sections as hairline blocks */
:is(#view-team,#view-cohort) #tm-dash > section, :is(#view-team,#view-cohort) #ch-dash > section, :is(#view-team,#view-cohort) #tm-dash > div.card, :is(#view-team,#view-cohort) #ch-dash > div.card{ padding:26px 2px 22px !important; border-top:1px solid var(--hair) !important; margin:0 !important; }
:is(#view-team,#view-cohort) #tm-dash:not(.hidden), :is(#view-team,#view-cohort) #ch-dash:not(.hidden){ display:block !important; margin-top:20px; }
:is(#view-team,#view-cohort) section:has(> #tm-mesh), :is(#view-team,#view-cohort) section:has(> #ch-field){ display:none !important; }
:is(#view-team,#view-cohort) .adm-label{ font:500 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink2)) !important; }
:is(#view-team,#view-cohort) .pill{ text-transform:none !important; letter-spacing:0 !important; font:400 13px/1.2 var(--f-body) !important; border-color:var(--hair) !important; color:rgb(var(--ink3)) !important; background:none !important; }
:is(#view-team,#view-cohort) #tm-dash > *:first-child, :is(#view-team,#view-cohort) #ch-dash > *:first-child{ border-top:0 !important; }
/* the marks: one point per member, lit by its state */
.ws-marks{ display:flex; flex-wrap:wrap; gap:10px; margin:6px 0 16px; }
.ws-mark{ width:10px; height:10px; border-radius:50%; background:rgba(127,211,255,.22); border:1px solid rgba(127,211,255,.35); animation:ws-in .5s var(--ease-inst) both; }
.ws-mark.is-clear{ background:#7FD3FF; border-color:#7FD3FF; box-shadow:0 0 10px rgba(31,126,219,.7); }
.ws-mark.is-drift{ background:rgba(127,211,255,.55); border-color:rgba(127,211,255,.7); }
.ws-mark.is-crit{ background:#DFF4FF; border-color:#DFF4FF; box-shadow:0 0 12px rgba(223,244,255,.8); }
@keyframes ws-in{ from{ opacity:0; transform:scale(.4); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ .ws-mark{ animation:none; } }
/* the roster: hairline rows, words not badges */
:is(#view-team,#view-cohort) .ws-row{ padding:12px 2px !important; border-top:1px solid var(--hair); font:400 15px/1.45 var(--f-body); color:rgb(var(--ink)); }
:is(#view-team,#view-cohort) .ws-row:last-child{ border-bottom:1px solid var(--hair); }
:is(#view-team,#view-cohort) .ws-row > span:first-child > span:first-child{ border:0 !important; background:none !important; font:italic 500 16px var(--f-em) !important; color:rgb(var(--ink3)) !important; width:auto !important; }
:is(#view-team,#view-cohort) .ws-row .pill{ border:0 !important; background:none !important; padding:0 !important; font:400 14px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink2)) !important; border-radius:0 !important; }
:is(#view-team,#view-cohort) .ws-row span[style*="color"]{ color:rgb(var(--ink3)) !important; }
:is(#view-team,#view-cohort) #tm-roster, :is(#view-team,#view-cohort) #ch-roster{ display:block !important; }
:is(#view-team,#view-cohort) #tm-roster > *, :is(#view-team,#view-cohort) #ch-roster > *{ margin:0 !important; }
/* the distribution and council: hairline rows */
:is(#view-team,#view-cohort) .brief-row{ padding:10px 0 !important; border-top:1px solid var(--hair); }
:is(#view-team,#view-cohort) .brief-cis{ font:300 40px/1 var(--f-body) !important; letter-spacing:-.04em !important; color:rgb(var(--ink)) !important; }
:is(#view-team,#view-cohort) p.font-mono, :is(#view-team,#view-cohort) span.font-mono{ font-family:var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; }
/* the invite: one line */
#tm-invite, #ch-invite{ padding:20px 2px !important; border-top:1px solid var(--hair) !important; border-bottom:1px solid var(--hair) !important; }
#tm-code, #ch-code{ font:300 26px/1 var(--f-body) !important; letter-spacing:.18em !important; color:rgb(var(--ink)) !important; }
#tm-copy, #ch-copy, #tm-copylink, #ch-copylink, #tm-mail, #ch-mail, #tm-wa, #ch-wa, #tm-leave, #ch-leave, #tm-memo-btn{ border:0 !important; background:none !important; padding:0 2px !important; min-height:44px; font:500 14px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink2)) !important; text-decoration:none !important; }
#tm-copy:hover, #ch-copy:hover, #tm-copylink:hover, #ch-copylink:hover, #tm-mail:hover, #ch-mail:hover, #tm-wa:hover, #ch-wa:hover, #tm-memo-btn:hover{ color:rgb(var(--ink)) !important; }
#tm-leave, #ch-leave{ color:rgb(var(--ink3)) !important; }
/* the empty state: one quiet centred invitation */
#tm-state, #ch-state{ max-width:760px !important; margin:40px auto 0 !important; }
:is(#tm-state,#ch-state) .card{ max-width:none !important; }
:is(#tm-state,#ch-state) .overline{ font:400 13px/1.4 var(--f-body) !important; color:rgb(var(--ink3)) !important; }
:is(#tm-state,#ch-state) h3{ font:500 clamp(26px,2.6vw,34px)/1.15 var(--f-disp) !important; letter-spacing:-.022em !important; color:rgb(var(--ink)) !important; margin-top:8px !important; }
:is(#tm-state,#ch-state) p.text-sm{ font:400 16px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:52ch !important; }
:is(#tm-state,#ch-state) .grid{ gap:0 56px !important; margin-top:36px !important; }
:is(#tm-state,#ch-state) .grid > div{ border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; padding:22px 2px 26px !important; }
:is(#tm-state,#ch-state) .grid > div > p.text-sm{ font:500 17px/1.3 var(--f-body) !important; color:rgb(var(--ink)) !important; }
:is(#tm-state,#ch-state) .grid > div > p.text-xs{ font:400 14px/1.55 var(--f-body) !important; color:rgb(var(--ink3)) !important; }
:is(#tm-state,#ch-state) input{ background:rgba(15,23,36,.5) !important; border:1px solid var(--hair2) !important; border-radius:12px !important; padding:11px 14px !important; font:400 15px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink)) !important; }
html[data-theme="light"] :is(#tm-state,#ch-state) input{ background:#fff !important; }
:is(#tm-state,#ch-state) button[id$="-create"], :is(#tm-state,#ch-state) button[id$="-join"]{ width:auto !important; margin-top:16px !important; padding:0 22px !important; min-height:44px; border-radius:999px !important; border:1px solid var(--mg-pill-edge) !important; background:var(--mg-pill-bg) !important; font:500 14px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink)) !important; }
:is(#tm-state,#ch-state) button[id$="-create"]:hover, :is(#tm-state,#ch-state) button[id$="-join"]:hover{ background:var(--mg-pill-hover) !important; }
:is(#tm-state,#ch-state) > .card > p:last-child{ font:400 13px/1.55 var(--f-body) !important; color:rgb(var(--ink3)) !important; border-color:var(--hair) !important; }
:is(#view-team,#view-cohort) [class*="border-white/"], :is(#view-team,#view-cohort) [class*="bg-white/"]{ border-color:var(--hair) !important; background-color:transparent !important; }
@media (max-width:767px){ #tm-headline, #ch-headline{ font-size:26px !important; } }

/* ── THE ANATOMY: ten shards around one small cube, each organ at its own angle, lit when the record
       feeds it; select one and its words become the focus. The words as rows beneath.
       (js/40-anatomy.js paints; js/14 keeps the organs, the panel and the pulse.) ── */
#view-anatomy:not(.hidden){ display:block !important; }
#view-anatomy > *, #view-anatomy #an-body{ max-width:1180px; margin-left:auto; margin-right:auto; }
#view-anatomy #an-body{ display:block !important; }
#view-anatomy [data-dark-stage], #view-anatomy .an-stage{ min-height:0 !important; background:none !important; }
#view-anatomy #an-canvas{ display:none !important; }
#view-anatomy :is(.an-stage,[data-dark-stage]) > div:first-of-type{ position:static !important; padding:0 !important; pointer-events:auto !important; display:flex; justify-content:space-between; gap:18px; align-items:flex-start; }
#view-anatomy .an-stage .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-anatomy .an-stage h2{ font:500 clamp(26px,2.6vw,34px)/1.15 var(--f-disp) !important; letter-spacing:-.022em !important; color:rgb(var(--ink)) !important; margin-top:6px !important; }
#view-anatomy #an-sub{ font:400 15px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:44ch; margin-top:10px !important; }
#view-anatomy #an-ride-btn{ border-radius:999px !important; border:1px solid var(--mg-pill-edge) !important; background:var(--mg-pill-bg) !important; color:rgb(var(--ink)) !important; font:500 14px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; min-height:44px; padding:0 20px !important; }
#view-anatomy #an-ride-btn:hover{ background:var(--mg-pill-hover) !important; }
#view-anatomy .an-fig{ display:block; width:100%; max-width:820px; height:auto; margin:10px auto 0; overflow:visible; transition:margin var(--dur-3,.45s) var(--ease-inst); }
@media (min-width:1024px){ #view-anatomy.an-open .an-fig{ margin-left:0; } }
#view-anatomy .an-organ{ cursor:pointer; outline:none; animation:an-in .6s var(--ease-inst) both; }
@keyframes an-in{ from{ opacity:0; } to{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ #view-anatomy .an-organ{ animation:none; } }
#view-anatomy .an-lbl{ font:400 14px var(--f-body); fill:rgb(var(--ink3)); transition:fill var(--dur-1); }
#view-anatomy .an-organ.is-on .an-lbl{ fill:rgb(var(--ink2)); }
#view-anatomy .an-organ:hover .an-lbl, #view-anatomy .an-organ.is-focus .an-lbl, #view-anatomy .an-organ:focus-visible .an-lbl{ fill:rgb(var(--ink)); font-weight:500; }
#view-anatomy .an-shard{ transition:fill var(--dur-2), stroke var(--dur-2), filter var(--dur-2); }
#view-anatomy .an-organ.is-focus .an-shard{ fill:#DFF4FF; stroke:#DFF4FF; filter:drop-shadow(0 0 10px rgba(127,211,255,.9)); }
#view-anatomy .an-organ:focus-visible .an-shard{ stroke:var(--focus); stroke-width:2; }
#view-anatomy #an-caption{ position:static !important; margin-top:14px; }
#view-anatomy #an-caption-txt{ font:italic 500 19px/1.5 var(--f-em) !important; color:#dff4ff !important; }
html[data-theme="light"] #view-anatomy #an-caption-txt{ color:#0e4d78 !important; }
#view-anatomy #an-tip{ display:none !important; }
/* the panel: the room's glass */
#an-panel.an-panel-room{ position:fixed !important; top:var(--hdr-h) !important; right:0 !important; bottom:0 !important; width:min(460px,94vw) !important; z-index:60 !important;
  background:rgba(11,30,51,.94) !important; -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px) !important; border-left:1px solid rgba(127,211,255,.18) !important; padding:32px 30px !important; }
html[data-theme="light"] #an-panel.an-panel-room{ background:rgba(255,255,255,.94) !important; border-left-color:rgba(15,40,70,.14) !important; }
#an-panel.an-panel-room h3{ font:500 28px/1.15 var(--f-disp) !important; letter-spacing:-.022em !important; color:rgb(var(--ink)) !important; }
#an-panel.an-panel-room p.font-mono, #an-panel.an-panel-room .overline{ font:400 13px/1.5 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#an-panel.an-panel-room p.font-mono[style*="00BFFF"]{ color:var(--mg-ice) !important; }
#an-panel.an-panel-room p.text-\[13px\]{ font:400 15px/1.65 var(--f-body) !important; color:rgb(var(--ink2)) !important; }
#an-panel.an-panel-room .overline.mt-5{ margin-top:22px !important; color:rgb(var(--ink)) !important; font-weight:500 !important; }
#an-panel.an-panel-room button[onclick]{ border-radius:999px !important; border:1px solid var(--mg-pill-edge) !important; background:var(--mg-pill-bg) !important; color:rgb(var(--ink)) !important; font:500 14px var(--f-body) !important; min-height:44px; padding:0 18px !important; }
#an-panel.an-panel-room #an-close{ border:0 !important; background:none !important; font:500 14px var(--f-body) !important; letter-spacing:0 !important; color:rgb(var(--ink3)) !important; padding:10px !important; }
/* the words, as rows */
#view-anatomy .an-words{ max-width:760px; margin:48px auto 0 !important; border:0 !important; background:none !important; padding:0 !important; box-shadow:none !important; }
#view-anatomy .an-words .brief-section-head{ font:500 16px/1.2 var(--f-disp) !important; letter-spacing:-.01em !important; text-transform:none !important; color:rgb(var(--ink)) !important; margin-bottom:4px; }
#view-anatomy .an-words .grid{ display:block !important; }
#view-anatomy .an-words .grid > div{ display:grid; grid-template-columns:160px minmax(0,1fr); gap:16px; padding:12px 2px; border-top:1px solid var(--hair); font:400 15px/1.55 var(--f-body) !important; }
#view-anatomy .an-words .grid > div:last-child{ border-bottom:1px solid var(--hair); }
#view-anatomy .an-words .grid > div b{ font-weight:500; }
#view-anatomy .an-words .grid > div span{ margin:0 !important; color:rgb(var(--ink2)) !important; }
@media (max-width:767px){
  #view-anatomy .an-stage > div:first-of-type{ flex-direction:column; }
  #view-anatomy .an-lbl{ font-size:30px; }
  #view-anatomy .an-words .grid > div{ grid-template-columns:minmax(0,1fr); gap:2px; }
}

/* ── THE CANON: a refinement, not a redesign. The reading column at 66ch, numerals and "In Areté" in
       ink rather than ice, the mono tags in Manrope, the ambient canvas retired, the two actions quiet.
       (js/10 renderCanon writes the content; this composes it.) ── */
#view-canon:not(.hidden){ display:block !important; }
#view-canon #canon-body{ max-width:72ch; margin:0 auto; }
#view-canon #canon-ambient{ display:none !important; }
#view-canon .brief-dateline{ display:flex; justify-content:space-between; gap:18px; }
#view-canon .brief-dateline > span{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-canon .brief-section > p.overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; margin:56px 0 14px !important; }
#view-canon .brief-section > p.text-on-surface{ font:500 clamp(34px,4vw,52px)/1.06 var(--f-disp) !important; letter-spacing:-.03em !important; color:rgb(var(--ink)) !important; max-width:20ch !important; }
#view-canon .brief-section > p.text-\[15px\]{ font:400 17px/1.65 var(--f-body) !important; color:rgb(var(--ink2)) !important; margin-top:18px !important; max-width:none !important; }
#view-canon .brief-row-canon{ display:grid !important; grid-template-columns:112px minmax(0,1fr); gap:20px; padding:34px 0 !important; border-top:1px solid var(--hair) !important; }
#view-canon .brief-row-canon > div:first-child > p:first-child{ font:italic 500 34px/1 var(--f-em) !important; color:rgb(var(--ink3)) !important; }
#view-canon .brief-row-canon > div:first-child > p.font-mono{ font:400 13px/1.45 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; overflow-wrap:anywhere; color:rgb(var(--ink4)) !important; margin-top:8px !important; }
#view-canon .brief-row-canon > div:last-child > p.text-on-surface{ font:500 24px/1.2 var(--f-disp) !important; letter-spacing:-.02em !important; color:rgb(var(--ink)) !important; margin-bottom:12px !important; }
#view-canon .brief-row-canon > div:last-child > div{ font:400 16px/1.7 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:none !important; }
#view-canon .brief-row-canon > div:last-child > div em{ color:rgb(var(--ink)); }
#view-canon .brief-row-canon > div:last-child > p:last-child{ font:400 15px/1.65 var(--f-body) !important; color:rgb(var(--ink2)) !important; margin-top:16px !important; max-width:none !important; padding-top:12px; border-top:1px solid var(--hair); }
#view-canon .brief-row-canon > div:last-child > p:last-child .overline{ display:block; font:italic 500 17px/1.3 var(--f-em) !important; letter-spacing:0 !important; text-transform:none !important; color:#dff4ff !important; margin-bottom:4px; }
html[data-theme="light"] #view-canon .brief-row-canon > div:last-child > p:last-child .overline{ color:#0e4d78 !important; }
#view-canon #canon-body > div:last-child{ border-top:1px solid var(--hair) !important; padding-top:24px !important; }
#view-canon #canon-body > div:last-child .brief-recal-btn{ border:0 !important; background:none !important; padding:0 2px !important; min-height:44px; font:500 14px var(--f-body) !important; letter-spacing:0 !important; color:rgb(var(--ink2)) !important; }
#view-canon #canon-body > div:last-child .brief-recal-btn:hover{ color:rgb(var(--ink)) !important; }
#view-canon #canon-body > div:last-child .flex{ gap:26px !important; }
#view-canon #canon-body > div:last-child p.font-mono{ font:400 13px/1.55 var(--f-body) !important; letter-spacing:0 !important; color:rgb(var(--ink3)) !important; margin-top:14px !important; }
@media (max-width:767px){
  #view-canon .brief-row-canon{ grid-template-columns:minmax(0,1fr); gap:8px; padding:26px 0 !important; }
  #view-canon .brief-row-canon > div:first-child{ display:flex; align-items:baseline; gap:12px; }
  #view-canon .brief-section > p.text-on-surface{ font-size:32px !important; }
}

/* ── THE MODELS and THE PSYCHE: the last two legacy surfaces, brought into the rooms' language by subtraction.
       Models: the catalogue as hairline rows (number, name, one line, the glyph at the right); no tiles.
       Psyche: the three strata as hairline blocks with the depth column at the left; no card-in-card, no badge.
       (js/15 and js/16 keep every handler; js/42 says their words in sentence case.) ── */
#view-models:not(.hidden), #view-psyche:not(.hidden){ display:block !important; }
#view-models #mo-body, #view-psyche #py-body{ display:block !important; max-width:900px; margin:0 auto; }
:is(#view-models,#view-psyche) .card, :is(#view-models,#view-psyche) .card-hero{ border:0 !important; background:none !important; box-shadow:none !important; border-radius:0 !important; padding:0 !important; }
:is(#view-models,#view-psyche) .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
:is(#view-models,#view-psyche) h2, :is(#view-models,#view-psyche) h3{ font:500 clamp(28px,3vw,40px)/1.1 var(--f-disp) !important; letter-spacing:-.025em !important; color:rgb(var(--ink)) !important; margin-top:8px !important; }
:is(#view-models,#view-psyche) #mo-body > section:first-child p.text-sm, :is(#view-models,#view-psyche) #py-body > section:first-child p.text-sm{ font:400 16px/1.6 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:52ch !important; margin-top:12px !important; }
:is(#view-models,#view-psyche) p.font-mono, :is(#view-models,#view-psyche) span.font-mono{ font-family:var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; }
/* the models as rows */
#view-models #mo-body > section + section{ margin-top:34px; }
#view-models #mo-grid{ display:block !important; }
#view-models #mo-grid > button{ display:grid !important; grid-template-columns:44px minmax(0,1fr) 64px; column-gap:18px; align-items:center; width:100%; padding:16px 2px !important; border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; background:none !important; box-shadow:none !important; transition:background var(--dur-1); }
#view-models #mo-grid > button:last-child{ border-bottom:1px solid var(--hair) !important; }
#view-models #mo-grid > button:hover{ background:rgba(127,211,255,.05) !important; }
#view-models #mo-grid > button:focus-visible{ outline:2px solid var(--focus); outline-offset:-2px; }
#view-models #mo-grid > button > div:first-child{ display:contents !important; }
#view-models #mo-grid > button > div:first-child > span{ grid-column:1; grid-row:1 / span 2; font:italic 500 22px/1 var(--f-em) !important; color:rgb(var(--ink3)) !important; letter-spacing:0 !important; }
#view-models #mo-grid > button > div:first-child > div{ grid-column:3; grid-row:1 / span 2; width:56px !important; opacity:.8; }
#view-models #mo-grid > button > p{ grid-column:2; margin:0 !important; }
#view-models #mo-grid > button > p:nth-of-type(1){ font:500 17px/1.3 var(--f-body) !important; letter-spacing:-.01em !important; color:rgb(var(--ink)) !important; }
#view-models #mo-grid > button > p:nth-of-type(2){ font:400 14px/1.5 var(--f-body) !important; color:rgb(var(--ink3)) !important; margin-top:3px !important; }
#view-models #mo-body > section:last-child p{ font:400 13px/1.55 var(--f-body) !important; color:rgb(var(--ink3)) !important; margin-top:22px; max-width:66ch; }
/* the psyche as strata blocks */
#view-psyche #py-body > section + section{ margin-top:34px; }
#view-psyche #py-body .grid{ display:block !important; }
#view-psyche #py-body canvas{ display:none !important; }
#view-psyche #py-body .lg\:w-32{ display:none !important; } /* the depth gauge duplicated the strata; the words carry it */
#view-psyche #py-body .lg\:flex-row{ display:block !important; margin-top:30px !important; } /* the strata are the words; the depth gauge duplicated them */
#view-psyche .rounded-\[3px\].border{ border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; background:none !important; padding:26px 2px 24px !important; margin:0 !important; }
#view-psyche .rounded-\[3px\].border:last-child{ border-bottom:1px solid var(--hair) !important; }
#view-psyche .rounded-\[3px\].border > div:first-child{ margin-bottom:12px !important; align-items:baseline !important; }
#view-psyche .rounded-\[3px\].border span.font-mono{ font:italic 500 22px/1 var(--f-em) !important; color:rgb(var(--ink3)) !important; letter-spacing:0 !important; min-width:36px; }
#view-psyche .rounded-\[3px\].border .overline{ color:rgb(var(--ink3)) !important; }
#view-psyche .rounded-\[3px\].border p.font-semibold{ font:500 22px/1.2 var(--f-disp) !important; letter-spacing:-.02em !important; color:rgb(var(--ink)) !important; margin-top:4px !important; }
#view-psyche .rounded-\[3px\].border p.text-\[13\.5px\]{ font:400 16px/1.65 var(--f-body) !important; color:rgb(var(--ink2)) !important; max-width:66ch; }
#view-psyche .rounded-\[3px\].border p.text-\[13\.5px\] b, #view-psyche .rounded-\[3px\].border p.text-\[13\.5px\] strong{ color:rgb(var(--ink)); font-weight:500; }
#view-psyche .rounded-\[3px\].border .pill{ border:0 !important; background:none !important; padding:0 !important; font:italic 500 16px var(--f-em) !important; letter-spacing:0 !important; text-transform:none !important; color:#dff4ff !important; }
html[data-theme="light"] #view-psyche .rounded-\[3px\].border .pill{ color:#0e4d78 !important; }
#view-psyche #py-body p.font-mono{ font-size:13px !important; line-height:1.55 !important; color:rgb(var(--ink3)) !important; margin-top:22px; max-width:66ch; }
#view-psyche #py-signin{ border-radius:999px !important; border:1px solid var(--mg-pill-edge) !important; background:var(--mg-pill-bg) !important; color:rgb(var(--ink)) !important; font:500 14px var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; min-height:44px; padding:0 20px !important; }
@media (max-width:767px){
  #view-models #mo-grid > button{ grid-template-columns:36px minmax(0,1fr) 48px; column-gap:12px; }
  #view-models #mo-grid > button > div:first-child > div{ width:44px !important; }
}

/* ── DECIDE: the hub frame takes the Midnight glass; the state row, verdict and options speak the benchmark's language ── */
#view-simulator{ background:var(--mg-glass-bg); border-color:var(--mg-glass-edge); box-shadow:var(--mg-glass-shadow); -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); }
#view-simulator .dc-state__num{ font:300 40px/1 var(--f-body); letter-spacing:-.05em; }
#view-simulator .dc-state__num .ui-of{ font:400 13px var(--f-body); letter-spacing:0; color:rgb(var(--ink3)); margin-left:6px; }
#view-simulator .dc-link{ text-decoration:none; color:rgb(var(--ink2)); }
#view-simulator .dc-link:hover{ color:rgb(var(--ink)); }
#view-simulator .dc-side{ border-color:var(--mg-glass-edge); }
html:not([data-theme="light"]) #view-simulator .dc-side{ background:radial-gradient(80% 120% at 30% 0%,rgba(31,126,219,.28),rgba(11,30,51,.85) 65%),rgba(15,23,36,.6); }
html[data-theme="light"] #view-simulator .dc-side{ background:rgba(255,255,255,.55); }
html[data-theme="light"] #view-simulator .dc-field{ background:#fff; }
#view-simulator .dc-side::before{ background:linear-gradient(90deg,transparent,rgba(127,211,255,.55),transparent); }
#view-simulator .dc-verdict{ font:500 28px/1.1 var(--f-disp); letter-spacing:-.022em; }
#view-simulator #sim-tier{ display:inline-flex; align-items:center; margin-top:0; }
#view-simulator .dc-input{ border-bottom-color:var(--hair3); }
#view-simulator .dc-input:focus{ border-bottom-color:var(--mg-ice); }
#view-simulator .dc-opt{ min-height:44px; padding:0 18px; border-radius:999px; border:1px solid var(--mg-pill-edge); background:var(--mg-pill-bg); color:rgb(var(--ink)); font:500 14px/1 var(--f-body);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:inset 0 1px 0 rgba(255,255,255,.10); transition:background var(--dur-1), border-color var(--dur-1); }
#view-simulator .dc-opt:hover{ background:var(--mg-pill-hover); color:rgb(var(--ink)); }
#view-simulator .dc-opt.sel{ border-color:rgba(127,211,255,.6) !important; background:rgba(127,211,255,.16) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.18), var(--glow-1); }
#view-simulator .dc-fold{ background:transparent; border:0; border-top:1px solid var(--hair); border-radius:0; }
#view-simulator .dc-fold__sum{ padding:0 2px; font:500 15px/1.3 var(--f-body); }
#view-simulator .dc-fold__sum::before{ color:rgb(var(--ink3)); }
#view-simulator .dc-fold__body{ padding:0 2px 18px; }
#view-simulator .dc-field{ background:rgba(15,23,36,.5); border-color:var(--hair2); border-radius:10px; }
#view-simulator .dc-field:focus{ border-color:var(--mg-ice); }
#view-simulator .dc-ledger > div{ background:transparent !important; border:0; border-top:1px solid var(--hair); border-radius:0; }
#view-simulator #coach-readiness, #view-simulator #coach-reco{ border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; padding:16px 2px !important; background:transparent !important; }
#view-simulator .dc-commit, #view-simulator .dc-support{ border-top-color:var(--hair); }
#view-simulator .dc-actions .ui-btn{ flex:none; }
#view-simulator .dc-actions{ align-items:center; gap:18px; }
@media (max-width:1023px){ #view-simulator .dc-actions .ui-btn{ flex:none; } }
/* the three quiet exits: one hairline row of text actions under the check; the record's folds open beneath on demand */
#view-simulator .dc-quiet{ display:flex; flex-wrap:wrap; gap:0 26px; margin-top:22px; padding-top:10px; border-top:1px solid var(--hair); }
#view-simulator .dc-quiet__b{ border:0; background:none; box-shadow:none; padding:0 2px; min-height:44px; font:400 14px/1 var(--f-body); letter-spacing:0; color:rgb(var(--ink3)); cursor:pointer; transition:color var(--dur-1); }
#view-simulator .dc-quiet__b:hover{ color:rgb(var(--ink)); }
#view-simulator .dc-quiet__b[aria-expanded="true"]{ color:rgb(var(--ink)); text-decoration:underline; text-underline-offset:6px; text-decoration-color:var(--mg-ice); }
#view-simulator .dc-quiet__b:focus-visible{ outline:2px solid var(--focus); outline-offset:2px; border-radius:6px; }
#view-simulator .dc-record.is-open{ display:block; }
#view-simulator .dc-record > .ui-head, #view-simulator .dc-record > #dl-pending, #view-simulator .dc-record > #dl-list, #view-simulator .dc-record > .dc-wave{ display:none; } /* the ledger lives in Record */
#view-simulator .dc-record details.dc-fold:not([open]){ display:none; } /* only the chosen exit shows */
#view-simulator .dc-record.is-open{ max-width:720px; }
#view-simulator .dc-record.is-open details.dc-fold > summary{ display:none; } /* the quiet row already names it */
#view-simulator .dc-record.is-open details.dc-fold{ border-top:0; }
#view-simulator #int-record-list > div{ background:transparent !important; border:0 !important; border-top:1px solid var(--hair) !important; border-radius:0 !important; padding:12px 2px !important; }
#view-simulator #int-record-list > div:last-child{ border-bottom:1px solid var(--hair) !important; }
#view-simulator #int-record-list .font-mono, #view-simulator #int-record-list [class*="uppercase"], #view-simulator #int-record-list span{ font-family:var(--f-body) !important; text-transform:none !important; letter-spacing:0 !important; font-size:13px !important; }
#view-simulator #int-record-list .text-on-surface, #view-simulator #int-record-list b{ font-size:15px !important; }

/* ── RADAR: the approved instrument, unchanged in form; the field and the line take the Midnight palette ── */
html:not([data-theme="light"]) #view-radar{ --rd-line:rgba(127,211,255,.85); --rd-dot:#7FD3FF; --rd-halo:rgba(31,126,219,.32);
  --rd-teal:#7FD3FF; --rd-tealtext:#9fd9f5; --rd-ice:#1F7EDB; --rd-bandhi:rgba(31,126,219,.18); --rd-bandlo:rgba(31,126,219,.06); }
#view-radar .rd-q{ border-color:var(--mg-pill-edge); background:var(--mg-pill-bg); }
#view-radar .rd-q:hover, #view-radar .rd-q[aria-expanded="true"]{ background:var(--mg-pill-hover); border-color:rgba(127,211,255,.5); }
#view-radar .rd-ck{ border-color:var(--hair3); }

/* ── YOU: the signature stands in one glass frame; the eight functions read as quiet rows on the field ── */
#view-signature:not(.hidden){ display:grid !important; }
#view-signature .card.card-hero{ border-radius:24px !important; border:1px solid var(--mg-glass-edge) !important; background:var(--mg-glass-bg) !important; box-shadow:var(--mg-glass-shadow) !important;
  -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); padding:28px 32px 30px !important; text-align:center; }
#view-signature .overline{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; text-transform:none !important; color:rgb(var(--ink3)) !important; }
#view-signature #sig-conf{ font:400 13px/1.4 var(--f-body) !important; letter-spacing:0 !important; color:rgb(var(--ink3)) !important; }
#view-signature #sig-arch{ font:500 clamp(28px,2.6vw,36px)/1.1 var(--f-disp) !important; letter-spacing:-.022em !important; color:rgb(var(--ink)) !important;
  background:none !important; -webkit-text-fill-color:currentColor !important; margin-top:14px !important; text-wrap:balance; }
#view-signature #sig-lead{ font:400 15px/1.7 var(--f-body) !important; color:rgb(var(--ink2)) !important; padding:0 !important; margin-top:12px !important; }
#view-signature #sig-lead b, #view-signature #sig-lead strong{ color:rgb(var(--ink)); font-weight:500; }
#view-signature .card-hero > .flex.mt-5{ border-top:1px solid var(--hair); padding-top:18px; margin-top:22px !important; }
#view-signature .card-hero p.text-center{ font:400 13px/1.5 var(--f-body) !important; color:rgb(var(--ink3)) !important; }
#view-signature #sig-share, #view-signature #sig-card{ display:inline-flex !important; width:auto !important; padding:0 20px; margin:14px 5px 0 !important; min-height:44px;
  border-color:var(--mg-pill-edge) !important; background:var(--mg-pill-bg) !important; color:rgb(var(--ink)) !important; font:500 14px var(--f-body); box-shadow:inset 0 1px 0 rgba(255,255,255,.10); }
#view-signature #sig-share:hover, #view-signature #sig-card:hover{ background:var(--mg-pill-hover) !important; border-color:rgba(127,211,255,.5) !important; }
#view-signature #sig-share svg, #view-signature #sig-card svg{ stroke:currentColor; filter:none; }
#view-signature #sig-share-msg{ font:400 13px var(--f-body); color:rgb(var(--ink3)); }
#view-signature section:not(.card) > .flex.mb-3\.5 .overline{ font:500 15px var(--f-disp) !important; letter-spacing:-.01em !important; color:rgb(var(--ink)) !important; }
#view-signature section:not(.card) > .flex.mb-3\.5 span{ font:400 13px var(--f-body); color:rgb(var(--ink3)); }
#view-signature #sig-fns > div{ display:flex; gap:16px !important; padding:16px 2px !important; border-top:1px solid var(--hair) !important; }
#view-signature #sig-fns > div > div:first-child{ height:44px !important; width:44px !important; border-radius:10px !important; border:1px solid var(--hair) !important; background:rgba(15,23,36,.5) !important; }
#view-signature #sig-fns .font-semibold{ font:500 15px/1.4 var(--f-body) !important; color:rgb(var(--ink)) !important; }
#view-signature #sig-fns .font-mono{ font:300 22px/1 var(--f-body) !important; letter-spacing:-.04em; color:rgb(var(--ink)) !important; font-variant-numeric:tabular-nums; }
#view-signature #sig-fns .text-\[11px\]{ font:400 13px/1.5 var(--f-body) !important; color:rgb(var(--ink3)) !important; opacity:1 !important; }
#view-signature #sig-fns .h-1{ height:1px !important; background:var(--hair2) !important; margin:10px 0 8px !important; }
#view-signature #sig-fns .h-1 > div{ background:linear-gradient(90deg,#1F7EDB,#7FD3FF) !important; box-shadow:0 0 8px rgba(31,126,219,.6); height:1px; margin-top:0; }
#view-signature #sig-fns p{ font:400 14px/1.5 var(--f-body) !important; color:rgb(var(--ink2)) !important; }
#view-signature > section:last-child .card{ border-radius:18px !important; border:1px solid var(--mg-pill-edge) !important; background:var(--mg-pill-bg) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.10) !important;
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); padding:16px 22px !important; transition:background var(--dur-1), border-color var(--dur-1); }
#view-signature > section:last-child .card:hover{ background:var(--mg-pill-hover) !important; border-color:rgba(127,211,255,.5) !important; }
#view-signature > section:last-child .card .h-11{ border-radius:50% !important; border:1px solid var(--mg-pill-edge) !important; background:var(--mg-pill-bg) !important; color:rgb(var(--ink2)) !important; }
#view-signature > section:last-child .card .h-11 svg{ stroke:currentColor; filter:none; }
#view-signature > section:last-child .card .font-semibold{ font:500 16px/1.3 var(--f-body) !important; color:rgb(var(--ink)); }
#view-signature > section:last-child .card .text-xs{ font:400 14px/1.5 var(--f-body) !important; color:rgb(var(--ink2)) !important; }
#view-signature > section:last-child .card .text-primary-soft:not(.h-11){ color:rgb(var(--ink2)) !important; font:500 14px var(--f-body) !important; }
#view-signature .text-primary-soft, #view-signature .text-primary{ color:var(--mg-ice) !important; }
@media (max-width:767px){ #view-signature .card.card-hero{ padding:22px 20px 24px !important; border-radius:20px !important; } }

/* ── MORE: the sheet is the Intercept's glass in the Midnight palette ── */
@media (min-width:1024px){
  html:not([data-theme="light"]) #ui-more{ background:rgba(11,30,51,.9); border-color:var(--mg-glass-edge); box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 50px 110px -40px rgba(31,126,219,.9); }
}
html:not([data-theme="light"]) #ui-more{ background:rgba(11,30,51,.96); }
#ui-more .ui-more__item{ border-color:var(--mg-pill-edge); background:var(--mg-pill-bg); font:500 14px var(--f-body); }
#ui-more .ui-more__item:hover{ background:var(--mg-pill-hover); border-color:rgba(127,211,255,.5); }
#ui-more .ui-more__item[aria-current="page"]{ background:rgba(127,211,255,.16); border-color:rgba(127,211,255,.5); }
#ui-more .ui-more__item small{ font:italic 500 13px var(--f-em); letter-spacing:0; color:rgb(var(--ink3)); text-transform:none; }
#ui-more .ui-more__head .ui-label{ font:500 20px var(--f-disp); letter-spacing:-.015em; }
#ui-more h3{ font:400 13px var(--f-body); letter-spacing:0; color:rgb(var(--ink3)); }
.ui-sheet{ scrollbar-color:rgba(127,211,255,.28) transparent; }


/* ── 30. THE VERDICT VESSEL (js/43, her 09-07 screenshot) ───────────────── */
#view-simulator .dc-side{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); grid-template-areas:"step step" "gauge read" "row read"; column-gap:32px; align-items:center; padding:28px 32px 26px; }
#view-simulator .dc-side .dc-gauge{ grid-area:gauge; width:100%; max-width:360px; height:340px; margin:0 auto; padding:0; }
#view-simulator .dc-side .dc-gauge canvas{ width:100% !important; height:340px !important; }
#view-simulator .dc-side .dc-read{ grid-area:read; align-self:center; }
#view-simulator .vv-metrics{ margin:0 0 18px; }
#view-simulator .vv-num{ display:flex; flex-direction:column; gap:2px; margin-bottom:18px; }
#view-simulator .vv-num__l{ font:500 12px/1 var(--f-body); letter-spacing:.08em; text-transform:uppercase; color:rgb(var(--ink3)); }
#view-simulator .vv-num__v{ font:300 44px/1 var(--f-body); letter-spacing:-.04em; color:rgb(var(--ink)); }
#view-simulator .vv-row{ display:grid; grid-template-columns:1fr auto; grid-template-areas:"l v" "b b"; row-gap:6px; column-gap:12px; margin:0 0 12px; max-width:300px; }
#view-simulator .vv-row__l{ grid-area:l; font:400 13px/1.2 var(--f-body); color:rgb(var(--ink3)); }
#view-simulator .vv-row__v{ grid-area:v; font:400 15px/1.2 var(--f-body); color:rgb(var(--ink)); }
#view-simulator .vv-bar{ grid-area:b; height:3px; border-radius:2px; background:rgba(127,211,255,.14); overflow:hidden; }
/* PROTECTED (Intercept, founder ruling): this bar's teal stop #2ab5b5 is the last teal in the
   stylesheets. Retiring it would change the Intercept's approved rendered identity, so it stands.
   Its Radar twin .rdo-bar__f above took the cold rung #1F7EDB; the two bars now differ by one stop. */
#view-simulator .vv-bar__f{ display:block; height:100%; border-radius:2px; background:linear-gradient(90deg,#2ab5b5,#00BFFF,#9FE2FF); box-shadow:0 0 10px rgba(0,191,255,.55); transition:width .6s var(--ease-inst); }
#view-simulator .vv-actions{ grid-area:row; display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:14px; margin-top:-6px; }
#view-simulator .vv-disc{ width:44px; height:44px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--mg-pill-edge); background:var(--mg-pill-bg); color:rgb(var(--ink)); cursor:pointer; box-shadow:inset 0 1px 0 rgba(255,255,255,.14); transition:background var(--dur-1), transform var(--dur-1); }
#view-simulator .vv-disc svg{ width:18px; height:18px; }
#view-simulator .vv-disc:hover{ background:var(--mg-pill-hover); }
#view-simulator .vv-disc:active{ transform:scale(.96); }
#view-simulator .vv-disc[aria-expanded="true"]{ border-color:rgba(127,211,255,.6); background:rgba(127,211,255,.16); }
#view-simulator .vv-pill{ min-width:170px; min-height:46px; padding:0 30px; border-radius:999px; border:1px solid rgba(160,225,255,.45); background:linear-gradient(180deg,rgba(0,191,255,.22),rgba(31,126,219,.18)); color:rgb(var(--ink)); font:500 15px/1 var(--f-body); cursor:pointer; box-shadow:inset 0 1px 0 rgba(255,255,255,.28), 0 12px 30px -12px rgba(31,126,219,.9); transition:box-shadow var(--dur-1), border-color var(--dur-1); }
#view-simulator .vv-pill:hover{ border-color:rgba(200,236,255,.7); box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 18px 44px -12px rgba(31,126,219,.95); }
#view-simulator .vv-disc:focus-visible, #view-simulator .vv-pill:focus-visible{ outline:2px solid var(--focus); outline-offset:3px; }
#view-simulator .vv-line{ flex-basis:100%; margin:6px 0 0; text-align:center; font:400 13px/1.4 var(--f-body); color:rgb(var(--ink3)); }
#view-simulator .vv-line em{ font:italic 500 15px var(--f-em); color:rgb(var(--ink2)); }
#view-simulator .dc-side #sim-note{ display:none; }
#view-simulator .dc-side #sim-note.vv-show{ display:block; }
#view-simulator .dc-side .dc-verdict{ font-size:24px; margin:10px 0 6px; }
@media (max-width:1023px){
  #view-simulator .dc-side{ grid-template-columns:1fr; grid-template-areas:"step" "gauge" "read" "row"; padding:20px 16px; }
  #view-simulator .dc-side .dc-gauge{ height:300px; } #view-simulator .dc-side .dc-gauge canvas{ height:300px !important; }
  #view-simulator .vv-row{ max-width:none; }
}
html[data-theme="light"] #view-simulator .vv-bar{ background:rgba(15,40,70,.12); }
html[data-theme="light"] #view-simulator .vv-pill{ background:linear-gradient(180deg,rgba(26,122,168,.16),rgba(26,122,168,.08)); }


/* ── 31. THE RADAR ORBIT (js/44, her 09-07 screenshot) ──────────────────── */
#view-radar{ max-width:1320px; }
#view-radar .rdo{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:28px; align-items:start; }
#view-radar .rdo-head{ margin:0 0 6px; }
#view-radar .rdo-label{ font:500 12px/1 var(--f-body); letter-spacing:.18em; text-transform:uppercase; color:rgb(var(--ink3)); }
#view-radar .rdo-title{ margin:12px 0 10px; font:500 clamp(26px,2.6vw,34px)/1.15 var(--f-disp); letter-spacing:-.022em; color:rgb(var(--ink)); max-width:22ch; text-wrap:balance; }
#view-radar .rdo-title em{ font:italic 500 1em var(--f-em); color:#dff4ff; }
html[data-theme="light"] #view-radar .rdo-title em{ color:#0e4d78; }
#view-radar .rdo-sub{ margin:0; font:400 15px/1.55 var(--f-body); color:rgb(var(--ink2)); max-width:44ch; }
#view-radar .rdo-stamp{ margin:6px 0 0; font:400 13px var(--f-body); color:rgb(var(--ink3)); }
#view-radar .rdo-stage{ display:block; width:100%; height:auto; aspect-ratio:1000/600; overflow:visible; }
#view-radar .rdo-num{ font:300 40px var(--f-body); letter-spacing:-.04em; fill:#F4FAFF; }
#view-radar .rdo-t{ font:400 13px var(--f-body); fill:rgb(var(--ink3)); }
#view-radar .rdo-cl{ font:400 13px var(--f-body); fill:rgb(var(--ink3)); }
#view-radar .rdo-cv{ font:500 15px var(--f-body); fill:rgb(var(--ink)); }
#view-radar .rdo-breath{ transform-origin:500px 318px; transform-box:view-box; animation:rdo-breath 4.2s ease-in-out infinite; }
@keyframes rdo-breath{ 0%,100%{ opacity:.7; transform:scale(.96); } 50%{ opacity:1; transform:scale(1.04); } }
@media (prefers-reduced-motion:reduce){ #view-radar .rdo-breath{ animation:none; } }
#view-radar .rdo-r{ position:relative; padding:22px 22px 18px; border-radius:18px; border:1px solid var(--mg-glass-edge); background:var(--mg-glass-bg); box-shadow:var(--mg-glass-shadow); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); margin-top:8px; }
#view-radar .rdo-r::before{ content:''; position:absolute; left:10%; right:10%; top:-1px; height:1px; background:linear-gradient(90deg,transparent,rgba(127,211,255,.6),transparent); }
#view-radar .rdo-h{ margin:0 0 14px; font:500 12px/1 var(--f-body); letter-spacing:.18em; text-transform:uppercase; color:rgb(var(--ink3)); }
#view-radar .rdo-h--pat{ margin-top:22px; padding-top:18px; border-top:1px solid var(--hair); }
#view-radar .rdo-row{ display:grid; grid-template-columns:40px 1fr; grid-template-areas:"ic l" "ic v" "ic b"; column-gap:14px; row-gap:4px; align-items:center; padding:10px 0; border-bottom:1px solid var(--hair); }
#view-radar .rdo-row:last-of-type{ border-bottom:0; }
#view-radar .rdo-ic{ grid-area:ic; width:40px; height:40px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--mg-pill-edge); background:var(--mg-pill-bg); color:rgb(var(--ink)); }
#view-radar .rdo-ic svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; }
#view-radar .rdo-row__l{ grid-area:l; font:400 13px/1.2 var(--f-body); color:rgb(var(--ink3)); }
#view-radar .rdo-row__v{ grid-area:v; font:400 16px/1.2 var(--f-body); color:rgb(var(--ink)); }
#view-radar .rdo-bar{ grid-area:b; height:3px; border-radius:2px; background:rgba(127,211,255,.14); overflow:hidden; }
#view-radar .rdo-bar__f{ display:block; height:100%; border-radius:2px; background:linear-gradient(90deg,#1F7EDB,#00BFFF,#9FE2FF); box-shadow:0 0 10px rgba(0,191,255,.55); }
#view-radar #rdo-pat .rd-inst{ margin:0 -6px; }
#view-radar #rdo-pat .rd-inst .rd-ck{ display:none; }
#view-radar #rdo-pat .rd-line{ width:100% !important; height:auto !important; }
#view-radar #rdo-pat .rd-interp{ margin:10px 0 0; font-size:15px; line-height:1.45; max-width:none; }
#view-radar #rdo-pat .rd-interp em{ font-size:1em; }
#view-radar #rdo-pat .rd-legend{ margin-top:8px; font-size:12px; }
#view-radar .rd-rows{ margin-top:26px; }
@media (max-width:1023px){
  #view-radar .rdo{ grid-template-columns:1fr; }
  #view-radar .rdo-cl{ font-size:22px; } #view-radar .rdo-cv{ font-size:26px; } #view-radar .rdo-t{ font-size:22px; } #view-radar .rdo-num{ font-size:56px; }
}
html[data-theme="light"] #view-radar .rdo-num{ fill:#0b2a45; }
html[data-theme="light"] #view-radar .rdo-bar{ background:rgba(15,40,70,.12); }

/* the still water: the latest disturbance spreads once, slowly, then rests */
#view-radar .rdo-dist--live{ animation:rdo-spread 6s ease-out infinite; }
@keyframes rdo-spread{ 0%{ transform:scale(.6); opacity:1; } 70%{ opacity:.35; } 100%{ transform:scale(2.2); opacity:0; } }
@media (prefers-reduced-motion:reduce){ #view-radar .rdo-dist--live{ animation:none; } }
#view-radar .rdo-breath{ animation-duration:7s; }

/* the water in depth (js/45): the WebGL pool sits under the SVG; the SVG keeps callouts, number, caption */
#view-radar .rdo-l--3d{ position:relative; }
#view-radar .rdo-gl{ position:absolute; left:0; bottom:0; width:100%; aspect-ratio:1000/600; height:auto; display:block; pointer-events:none; }
#view-radar .rdo-stage{ position:relative; z-index:1; }
#view-radar .rdo-stage.rdo-3d .rdo-2d{ display:none; }
#view-radar .rdo-stage.rdo-3d .rdo-num{ fill:#F4FAFF; paint-order:stroke; stroke:rgba(0,20,45,.55); stroke-width:6px; }
#view-radar .rdo-stage.rdo-3d .rdo-t{ display:none; }
#view-radar .rdo-cap{ margin:8px 0 0; text-align:center; font:400 13px var(--f-body); color:rgb(var(--ink3)); position:relative; z-index:1; }

/* the basin on near-black ground (js/45): the field darkens around the instrument; the caption becomes the etched line */
#view-radar .rdo-l--3d::before{ content:''; position:absolute; left:-6%; right:-6%; bottom:-4%; height:78%; background:radial-gradient(60% 60% at 50% 55%,rgba(0,8,20,.55),rgba(0,6,16,.92) 70%,rgba(0,6,16,0) 100%); pointer-events:none; }
#view-radar .rdo-stage.rdo-3d .rdo-num{ font-size:26px; }
#view-radar .rdo-cap{ display:flex; align-items:center; gap:18px; font:400 12px/1 var(--f-body); letter-spacing:.18em; text-transform:uppercase; color:rgb(var(--ink3)); }
#view-radar .rdo-cap::before, #view-radar .rdo-cap::after{ content:''; flex:1; height:1px; background:linear-gradient(90deg,transparent,rgba(127,211,255,.45)); }
#view-radar .rdo-cap::after{ background:linear-gradient(90deg,rgba(127,211,255,.45),transparent); }

/* the Radar field goes near-black while the basin is open; the light theme keeps its own ground */
html:not([data-theme="light"]) body:has(#view-radar:not(.hidden)) #content-wrap{ background:radial-gradient(60% 50% at 50% 42%,#04122a 0%,#010812 55%,#00050c 100%) !important; }
#view-radar .rdo-l--3d::before{ display:none; }
html:not([data-theme="light"]) #view-radar .rdo-r{ background:rgba(2,12,28,.55); }

/* the anchor stands alone (js/45): in 3D the SVG's labels, number and caption step aside; the panel and the rows carry the numbers */
#view-radar .rdo-stage.rdo-3d{ visibility:hidden; }
#view-radar .rdo-l--3d .rdo-cap{ display:none; }
html:not([data-theme="light"]) body:has(#view-radar:not(.hidden)) #content-wrap{ background:linear-gradient(180deg,#010b1e 0%,#010914 45%,#00050d 100%) !important; }

/* ── the Radar anchor as the approved artwork (09-07): no card, no container, its own proportions ── */
#view-radar .rdo-anchor{ display:block; width:100%; height:auto; aspect-ratio:1536/1024; max-width:100%; margin:0; background:transparent; border:0; border-radius:0; }
#view-radar .rdo-stage.rdo-3d{ visibility:visible; }
#view-radar .rdo-l--3d::before{ display:none; }

/* the anchor blends into the field: its edges dissolve into the dark around it, so the plate has no frame */
#view-radar .rdo-anchor{ -webkit-mask-image:radial-gradient(ellipse 72% 70% at 50% 50%,#000 52%,rgba(0,0,0,.6) 72%,transparent 100%); mask-image:radial-gradient(ellipse 72% 70% at 50% 50%,#000 52%,rgba(0,0,0,.6) 72%,transparent 100%); }
@media (min-width:1024px){ #view-radar .rdo-anchor{ width:calc(100% + 80px); max-width:none; margin:0 -40px 0; } }
html:not([data-theme="light"]) body:has(#view-radar:not(.hidden)) #content-wrap{ background:radial-gradient(70% 60% at 36% 52%,#03122b 0%,#010b1c 45%,#00050d 100%) !important; }
html[data-theme="light"] #view-radar .rdo-anchor{ -webkit-mask-image:radial-gradient(ellipse 70% 68% at 50% 50%,#000 50%,transparent 100%); mask-image:radial-gradient(ellipse 70% 68% at 50% 50%,#000 50%,transparent 100%); }


/* ── the anchor, one material with the cube and the vessel (Midnight Glow: navy #001F3F, ice #00BFFF / #66D9FF) ── */
#view-radar .rdo-art{ position:relative; }
@media (min-width:1024px){ #view-radar .rdo-art{ width:calc(100% + 120px); margin:0 -60px 0; } #view-radar .rdo-anchor{ width:100%; max-width:none; margin:0; } }
#view-radar .rdo-anchor{ mix-blend-mode:screen; filter:hue-rotate(7deg) saturate(1.08) brightness(1.02);
  -webkit-mask-image:radial-gradient(ellipse 76% 74% at 50% 50%,#000 46%,rgba(0,0,0,.55) 70%,transparent 100%); mask-image:radial-gradient(ellipse 76% 74% at 50% 50%,#000 46%,rgba(0,0,0,.55) 70%,transparent 100%);
  animation:rdo-float 9s ease-in-out infinite; }
html:not([data-theme="light"]) body:has(#view-radar:not(.hidden)) #content-wrap{ background:radial-gradient(70% 60% at 36% 55%,#001F3F 0%,#00132a 40%,#000812 75%,#00050c 100%) !important; }
/* the orb's pulse: ice light breathing where today sits (50% across, 47.5% down the artwork) */
#view-radar .rdo-pulse{ position:absolute; left:50%; top:47.5%; width:11%; aspect-ratio:1; transform:translate(-50%,-50%); border-radius:50%; pointer-events:none; mix-blend-mode:screen;
  background:radial-gradient(circle,rgba(102,217,255,.55) 0%,rgba(0,191,255,.22) 35%,rgba(0,191,255,0) 70%); animation:rdo-pulse 4.8s ease-in-out infinite; }
/* the tide: a slow ice glow beneath the basin, the same light the vessel stands in */
#view-radar .rdo-tide{ position:absolute; left:50%; top:74%; width:62%; height:22%; transform:translate(-50%,-50%); border-radius:50%; pointer-events:none; mix-blend-mode:screen;
  background:radial-gradient(ellipse,rgba(0,191,255,.30) 0%,rgba(0,140,140,.10) 45%,rgba(0,191,255,0) 70%); filter:blur(14px); animation:rdo-tide 7s ease-in-out infinite; }
@keyframes rdo-float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-5px); } }
@keyframes rdo-pulse{ 0%,100%{ opacity:.45; transform:translate(-50%,-50%) scale(.9); } 50%{ opacity:1; transform:translate(-50%,-50%) scale(1.15); } }
@keyframes rdo-tide{ 0%,100%{ opacity:.55; } 50%{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ #view-radar .rdo-anchor, #view-radar .rdo-pulse, #view-radar .rdo-tide{ animation:none; } }
html[data-theme="light"] #view-radar .rdo-anchor{ mix-blend-mode:normal; }
html[data-theme="light"] #view-radar .rdo-pulse, html[data-theme="light"] #view-radar .rdo-tide{ mix-blend-mode:normal; opacity:.5; }


/* ── the Radar instrument (js/45) lives in the Intercept's own field; nothing pasted ── */
html:not([data-theme="light"]) body:has(#view-radar:not(.hidden)) #content-wrap{ background:radial-gradient(70% 55% at 50% 0%,rgba(14,58,107,.92) 0%,rgba(0,31,63,.94) 40%,rgba(3,16,31,.96) 100%) !important; }
#view-radar .rdo-stage.rdo-3d{ visibility:visible; }
#view-radar .rdo-stage.rdo-3d .rdo-2d, #view-radar .rdo-stage.rdo-3d .rdo-t{ display:none; }
#view-radar .rdo-l--3d .rdo-cap{ display:none; }
#view-radar .rdo-l--3d::before{ display:none; }
#view-radar .rdo-cl{ font:400 13px var(--f-body); fill:rgb(var(--ink3)); }
#view-radar .rdo-cv{ font:500 14px var(--f-body); fill:rgb(var(--ink2)); }
#view-radar .rdo-stage.rdo-3d .rdo-num{ font:300 24px var(--f-body); fill:#eaf6ff; paint-order:stroke; stroke:rgba(0,20,45,.5); stroke-width:5px; }
html:not([data-theme="light"]) #view-radar .rdo-r{ background:var(--mg-glass-bg); }


/* ── Radar, the premium pass: the readings as a quiet column, no tile, no icons, no bars ── */
#view-radar .rdo{ grid-template-columns:minmax(0,1fr) 280px; gap:40px; }
#view-radar .rdo-r, html:not([data-theme="light"]) #view-radar .rdo-r{ background:transparent; border:0; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; padding:0; margin-top:12px; }
#view-radar .rdo-r::before{ display:none; }
#view-radar .rdo-h{ margin:0 0 6px; font:400 13px/1.2 var(--f-body); letter-spacing:0; text-transform:none; color:rgb(var(--ink3)); }
#view-radar .rdo-h--pat{ margin-top:34px; padding-top:0; border-top:0; }
#view-radar .rdo-row{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:14px 0 12px; border-top:1px solid var(--hair); }
#view-radar .rdo-row:last-of-type{ border-bottom:1px solid var(--hair); }
#view-radar .rdo-row__l{ font:400 14px/1.3 var(--f-body); color:rgb(var(--ink2)); }
#view-radar .rdo-row__v{ font:300 22px/1 var(--f-body); letter-spacing:-.03em; color:rgb(var(--ink)); white-space:nowrap; }
#view-radar .rdo-ic, #view-radar .rdo-bar{ display:none; }
#view-radar #rdo-pat .rd-inst{ margin:6px 0 0; }
#view-radar #rdo-pat .rd-interp{ margin-top:12px; font:500 17px/1.35 var(--f-disp); letter-spacing:-.01em; }
#view-radar #rdo-pat .rd-legend{ margin-top:10px; font-size:12px; line-height:1.5; color:rgb(var(--ink3)); }
#view-radar .rdo-head{ margin-bottom:0; }
#view-radar .rdo-title{ margin:14px 0 12px; }
#view-radar .rdo-sub{ font-size:16px; line-height:1.55; }
#view-radar .rdo-stamp{ margin-top:8px; }
#view-radar .rd-rows{ margin-top:18px; }
#view-radar .rd-row{ padding:14px 2px; }
#view-radar .rd-links{ margin-top:28px; }
@media (max-width:1023px){ #view-radar .rdo{ gap:20px; } #view-radar .rdo-r{ margin-top:0; } }


/* ── Radar, the art-direction pass: fewer things, each placed ── */
#view-radar .rdo-cl{ font:400 13px var(--f-body); fill:rgb(var(--ink3)); }
#view-radar .rdo-cv{ font:500 14px var(--f-body); fill:rgb(var(--ink2)); }
#view-radar .rdo-stage.rdo-3d .rdo-num{ font:300 22px var(--f-body); fill:#eaf6ff; paint-order:stroke; stroke:rgba(0,20,45,.35); stroke-width:4px; }
@media (max-width:767px){ #view-radar .rdo-lead, #view-radar .rdo-cl, #view-radar .rdo-cv{ display:none; } #view-radar .rdo-stage.rdo-3d .rdo-num{ font-size:34px; } }
#view-radar .rdo-r{ margin-top:18px; }


/* ── THE DIAL (her 09-07 mood board): the Radar anchor, face on, on the Intercept field ── */
#view-radar .rdo-stage{ visibility:visible; display:block; width:min(100%,640px); margin:0 auto; aspect-ratio:1000/600; }
#view-radar .rdo-num{ font:300 26px var(--f-body); letter-spacing:-.03em; fill:#eaf6ff; }
#view-radar .rdo-t{ font:400 13px var(--f-body); fill:rgb(var(--ink3)); }
#view-radar .rdo-arc{ transition:stroke-dasharray 1.2s var(--ease-inst); }
#view-radar .rdo-dist--live{ animation:rdo-spread 7s ease-out infinite; }
@media (prefers-reduced-motion:reduce){ #view-radar .rdo-dist--live{ animation:none; } }
@media (max-width:1023px){ #view-radar .rdo-stage{ width:100%; } #view-radar .rdo-num{ font-size:34px; } #view-radar .rdo-t{ font-size:18px; } }

/* ── Radar composition: statement · dial · readings on one line, the dial where the eye lands ── */
@media (min-width:1024px){
  #view-radar .rdo{ grid-template-columns:minmax(260px,1fr) minmax(360px,460px) 280px; gap:48px; align-items:center; }
  #view-radar .rdo-l{ display:contents; }
  #view-radar .rdo-head{ align-self:center; }
  #view-radar .rdo-stage{ width:100%; margin:0; }
  #view-radar .rdo-r{ margin-top:0; align-self:center; }
  #view-radar .rdo-title{ max-width:14ch; }
}
@media (min-width:1024px) and (max-width:1279px){ #view-radar .rdo{ grid-template-columns:minmax(220px,1fr) minmax(300px,380px) 250px; gap:32px; } }
@media (max-width:1023px){ #view-radar .rdo-head{ text-align:left; } #view-radar .rdo-stage{ margin:8px auto 4px; } }

#view-radar .rdo-stage{ aspect-ratio:600/640; }
@media (min-width:1024px){ #view-radar .rdo-title{ max-width:none; } #view-radar .rdo-title em{ display:block; } }


/* ── the reading is an input: Radar speaks in sentences, Decide shows one number ── */
#view-radar .rdo-say{ margin:0; padding:12px 0; border-top:1px solid var(--hair); font:400 15px/1.5 var(--f-body); color:rgb(var(--ink)); }
#view-radar .rdo-say:last-of-type{ border-bottom:1px solid var(--hair); }
#view-radar .rd-rows{ display:none; }

/* ══════════════════════════════════════════════════════════════════════════
   32. ONE INSTRUMENT (founder 09-07): density, one grid, one job per room.
   The reading is an input: it is taken on Today, kept on Record. Nowhere
   else repeats it. Intercept and Record set the material; the others follow.
   ══════════════════════════════════════════════════════════════════════════ */
/* the grid: one width, one gutter, one rhythm */
:root{ --room-max:1180px; --room-pad:24px; --room-gap:20px; }
.view.p-6{ padding:var(--room-pad) 28px !important; }
:is(#view-brief,#view-simulator,#view-radar,#view-signature) > *{ max-width:var(--room-max); }
.ui-row{ padding:11px 2px; }
.ui-head{ margin-bottom:8px; }

/* ── TODAY: state, verdict, the one thing ahead. Two columns, left-aligned, no hero. ── */
#view-brief .td{ text-align:left; }
@media (min-width:1024px){
  #view-brief .td{ grid-template-columns:minmax(0,1fr) 420px !important; grid-template-areas:"state cube" "meaning cube" "side side" !important; column-gap:40px; row-gap:0; align-items:start; padding-top:34px; }
  #view-brief .td-state{ align-items:flex-start; padding-top:0; }
  #view-brief .td-state__top{ justify-content:flex-start; }
  #view-brief .td-cube{ grid-area:cube; --ics:112px; width:360px; height:300px; margin:0 auto; order:0; align-self:center; justify-self:center; }
  #view-brief .td-meaning{ grid-area:meaning; max-width:560px; margin:0; text-align:left; }
  #view-brief .td-actions{ justify-content:flex-start; }
  #view-brief .td-side{ grid-area:side; display:grid; grid-template-columns:1fr 1fr; gap:0 40px; margin-top:22px; padding-top:18px; border-top:1px solid var(--hair); max-width:none; }
}
#view-brief .td-state .ui-display{ font-size:clamp(64px,7vw,96px); }
#view-brief .td-verdict{ font-size:clamp(24px,2.4vw,32px); margin-top:6px; }
#view-brief .td-sub{ font-size:15px; margin-top:8px; }
#view-brief .td-what{ display:none; }
/* the readings leave Today's face: no evidence rows, no counts. "Take today's reading" is the input's door. */
#view-brief .td-evidence, #view-brief .td-record{ display:none !important; }
#view-brief .td-attn-wrap:empty{ display:none; }

/* ── DECIDE: the decision is the subject. No frame, no hero, the check beside the words. ── */
#view-simulator{ border:0 !important; background:transparent !important; box-shadow:none !important; padding:var(--room-pad) 28px !important; max-width:var(--room-max); }
#view-simulator .dc-head{ padding-bottom:12px; }
#view-simulator .dc-state__num{ font-size:30px; }
@media (min-width:1024px){
  #view-simulator .dc{ grid-template-columns:minmax(0,5fr) minmax(0,7fr); grid-template-areas:"head head" "side main" "record record"; column-gap:40px; row-gap:16px; } /* founder 09-07: the anchor and its panel on the LEFT */
  #view-simulator .dc-side{ grid-template-columns:1fr; grid-template-areas:"step" "gauge" "read" "row"; padding:20px 22px 18px; align-self:start; }
  #view-simulator .dc-side .dc-gauge{ max-width:260px; height:250px; }
  #view-simulator .dc-side .dc-gauge canvas{ height:250px !important; }
  #view-simulator .vv-actions{ margin-top:2px; }
}
#view-simulator .dc-input{ font-size:clamp(22px,2vw,28px); }
#view-simulator .dc-step{ margin-top:18px; }
#view-simulator .dc-actions{ margin-top:16px; }
#view-simulator .vv-num__v{ font-size:34px; }
#view-simulator .vv-line{ display:none; }
#view-simulator .dc-side .dc-verdict{ font-size:22px; }

/* ── RADAR: the dial, and Areté's sentences beside it. Tighter. ── */
#view-radar{ padding-top:var(--room-pad) !important; }
@media (min-width:1024px){ #view-radar .rdo{ grid-template-columns:minmax(240px,1fr) minmax(320px,400px) 300px; gap:40px; } }
#view-radar .rdo-title{ margin:10px 0 8px; font-size:clamp(24px,2.3vw,30px); }
#view-radar .rdo-sub{ font-size:15px; }
#view-radar .rd-links{ margin-top:18px; }

/* ── YOU: the enduring profile; a quiet column, not a dashboard. ── */
#view-signature.grid{ gap:32px !important; }
#view-signature .card.card-hero{ padding:22px !important; }
#view-signature #sig-arch{ font-size:clamp(24px,2.2vw,30px) !important; }
#view-signature #sig-share, #view-signature #sig-card{ min-height:40px; font-size:13px; }
#view-signature #sig-fns > div{ padding:12px 2px !important; }
#view-signature #sig-fns .font-mono{ font-size:18px !important; }

/* ── everywhere: the room's onward links are quiet text, not a second bar ── */
.page-links, #page-links{ margin-top:18px; }
/* Today, corrected: the cube lives inside the state block, so the state block is the two-column grid */
@media (min-width:1024px){
  #view-brief .td{ grid-template-columns:minmax(0,1fr) !important; grid-template-areas:"state" "meaning" "side" !important; }
  #view-brief .td-state{ display:grid !important; grid-template-columns:minmax(0,1fr) 400px; column-gap:40px; align-items:center; }
  #view-brief .td-state > :not(.td-cube){ grid-column:1; }
  #view-brief .td-cube{ grid-column:2; grid-row:1 / span 8; align-self:center; justify-self:center; margin:0; }
  #view-brief .td-meaning{ margin:6px 0 0 !important; padding:0 !important; max-width:calc(100% - 440px); }
}
@media (min-width:1024px){
  #view-brief .td-state > :not(.td-cube){ justify-self:start; text-align:left; margin-left:0 !important; margin-right:0 !important; }
  #view-brief .td-state .ui-value{ margin:6px 0 0 !important; }
  #view-brief .td-meaning, #view-brief .td-meaning h1, #view-brief .td-meaning p{ text-align:left !important; }
  #view-brief .td-actions{ justify-content:flex-start !important; }
  #view-brief .td-side{ grid-template-columns:minmax(0,1fr); max-width:720px; }
}

/* the count of readings is Record's fact, not Today's */
#view-brief .td-state .ui-delta{ display:none; }
@media (min-width:1024px){
  #view-brief .td > *{ justify-self:stretch !important; width:100%; }
  #view-brief .td-meaning{ max-width:calc(100% - 440px); }
  #view-brief .td-cube{ --ics:96px; width:300px; height:240px; grid-row:1 / span 8; }
  #view-brief .td-state{ align-content:center; min-height:0; }
  #view-brief .td-side{ margin-top:14px; }
}
@media (min-width:1024px){
  #view-brief .td-meaning{ width:auto !important; max-width:640px !important; justify-self:start !important; }
  #view-brief .td-meaning > *, #view-brief .td-side, #view-brief .td-side > *{ text-align:left !important; margin-left:0 !important; margin-right:0 !important; }
  #view-brief .td-side{ width:auto !important; max-width:720px !important; justify-self:start !important; }
  #view-brief .td-actions{ display:flex; justify-content:flex-start !important; }
}

/* the reading count belongs to Record, not the Radar statement */
#view-radar .rdo-stamp{ display:none; }

/* ── 33. TODAY, STRUCTURED LIKE DECIDE (founder 09-07): words on the left, the state as the glass
       instrument panel on the right, exactly the Decide verdict panel's material. ── */
@media (min-width:1024px){
  #view-brief .td{ grid-template-columns:minmax(0,7fr) minmax(0,5fr) !important; grid-template-areas:"head head" "meaning state" "side state" !important; column-gap:40px; row-gap:16px; align-items:start; padding-top:22px; }
  #view-brief .td-head{ grid-area:head; position:static; margin-bottom:4px; }
  /* the state panel: Decide's verdict panel, with the cube inside */
  #view-brief .td-state{ grid-area:state; display:flex !important; flex-direction:column; align-items:center; text-align:center; gap:0; min-height:0;
    padding:22px 24px 26px; border-radius:18px; border:1px solid var(--mg-glass-edge); background:radial-gradient(80% 120% at 30% 0%,rgba(31,126,219,.28),rgba(11,30,51,.85) 65%),rgba(15,23,36,.6); box-shadow:var(--mg-glass-shadow); position:relative; align-self:start; }
  #view-brief .td-state::before{ content:''; position:absolute; left:8%; right:8%; top:-1px; height:1px; background:linear-gradient(90deg,transparent,rgba(127,211,255,.55),transparent); }
  #view-brief .td-state > :not(.td-cube){ justify-self:center; text-align:center; margin-left:auto !important; margin-right:auto !important; }
  #view-brief .td-cube{ order:0; --ics:104px; width:320px; height:250px; margin:0 auto; grid-row:auto; grid-column:auto; }
  #view-brief .td-state__top{ order:1; justify-content:center; margin-top:4px; }
  #view-brief .td-state .ui-value{ order:2; margin:8px auto 0 !important; }
  #view-brief .td-state .ui-display{ font-size:clamp(64px,6vw,84px); }
  #view-brief .td-state .ui-delta{ display:none; }
  /* the words: left, at the top of the column */
  #view-brief .td-meaning{ grid-area:meaning; margin:8px 0 0 !important; padding:0 !important; max-width:none !important; width:auto !important; justify-self:stretch !important; }
  #view-brief .td-meaning > *{ text-align:left !important; margin-left:0 !important; margin-right:0 !important; }
  #view-brief .td-verdict{ font-size:clamp(30px,3vw,40px); margin-top:0; }
  #view-brief .td-actions{ display:flex; justify-content:flex-start !important; }
  #view-brief .td-side{ grid-area:side; margin-top:0; padding-top:16px; border-top:1px solid var(--hair); max-width:none !important; width:auto !important; }
}
html[data-theme="light"] #view-brief .td-state{ background:rgba(255,255,255,.55); }

@media (min-width:1024px){ #view-brief .td-meaning, #view-brief .td-meaning *{ margin-left:0 !important; padding-left:0 !important; text-align:left !important; } #view-brief .td-meaning .td-actions{ padding-left:0 !important; } }

@media (min-width:1024px){ #view-brief .td-meaning{ display:block !important; justify-items:start !important; align-items:start !important; } #view-brief .td-meaning > *{ width:auto !important; max-width:none !important; } }

/* ── 34. TODAY PLACED LIKE DECIDE (founder 09-08: "place Today that way too"): the same centred
       room width as Decide, the glass panel on the LEFT, the words on the right, 5fr/7fr, one gutter. ── */
#view-brief{ max-width:var(--room-max); margin:0 auto; padding:var(--room-pad) 28px !important; }
@media (min-width:1024px){
  #view-brief .td{ grid-template-columns:minmax(0,5fr) minmax(0,7fr) !important; grid-template-areas:"head head" "state meaning" "state side" !important; column-gap:40px; row-gap:16px; padding-top:0; }
  #view-brief .td-head{ border-bottom:1px solid var(--hair); padding-bottom:12px; margin-bottom:4px; }
  #view-brief .td-state{ align-self:start; }
  #view-brief .td-meaning{ margin-top:8px !important; }
}

/* ── founder 09-08: Integrity is shown once on Decide, in the state strip above; the panel keeps the vessel, the chip and the verdict ── */
#view-simulator .dc-side .vv-num{ display:none; }

/* ── design audit 2026-09-08 (structure step 1 follow-through): You is the room's name; the share card and the
       "How your judgment bends" link retire until the bends section lands on You (step 4) ── */
#view-signature #sig-share, #view-signature #sig-card, #view-signature #sig-share-msg, #view-signature #deep-share,
#view-signature .dr-quiet[onclick*="blindspots"]{ display:none !important; }

/* ═══ RECORD ON THE INTERCEPT PALETTE (founder 2026-09-16: "get Record right,
   colour-wise, against the Intercept"). The sheets already carry the Intercept
   frame verbatim. What did not: the pad under them burned raw #00BFFF at .55 to
   .8 with 60px glows, and the front sheet's foot was filled from --container-low,
   a grey that belongs to no Intercept surface. The pad now uses the Intercept
   card's own two lights (47,123,255 and 122,92,255) and the ice ladder at
   restrained alphas; the foot is the Intercept ground (0,31,63). ═══ */
.rc-pad span{ border-color:rgba(47,123,255,.32); box-shadow:0 0 14px rgba(47,123,255,.22),inset 0 0 20px rgba(47,123,255,.10); }
.rc-pad .r1{ border-color:rgba(47,123,255,.14); box-shadow:0 0 24px rgba(47,123,255,.10); }
.rc-pad .r2{ border-color:rgba(47,123,255,.22); }
.rc-pad .r3{ border-color:rgba(127,211,255,.34); box-shadow:0 0 22px rgba(47,123,255,.28),inset 0 0 26px rgba(47,123,255,.12); }
.rc-pad .r4{ border-color:rgba(223,244,255,.5); box-shadow:0 0 26px rgba(127,211,255,.4),inset 0 0 32px rgba(122,92,255,.16); }
.rc-pad .core{ background:radial-gradient(50% 50% at 50% 50%,rgba(223,244,255,.78),rgba(47,123,255,.42) 45%,transparent 72%); box-shadow:0 0 48px rgba(47,123,255,.45); }
.rc-beams b{ background:linear-gradient(180deg,rgba(47,123,255,0),rgba(47,123,255,.08) 55%,rgba(127,211,255,.22)); }
.rc-motes i{ background:#dff4ff; box-shadow:0 0 8px rgba(127,211,255,.8); }
.rc-sheet.is-cur::after{ background:linear-gradient(180deg,transparent 45%,rgba(0,31,63,.78) 78%,rgba(0,31,63,.92)); }
.rc-sheet.is-held{ box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 40px 80px -36px rgba(18,64,184,1),0 0 40px rgba(47,123,255,.18); }
html[data-theme="light"] .rc-sheet.is-cur::after{ background:linear-gradient(180deg,transparent 45%,rgba(243,246,250,.82) 78%,rgba(243,246,250,.95)); }

/* ── R6 · THE STRIP, THE AESTHETIC PASS (2026-09-20) ──────────────────────
   Her word: more aesthetically. The shape was right and the reading was right,
   but it was drawn as tally marks. Nothing here is allowed to carry meaning:
   the side of the line is still the only signal (§3). What changes is what
   the marks are MADE of. They stop being ticks and become light standing off
   the horizon, brightest where they meet it and giving out as they go, which
   is the same behaviour the horizon itself has and the same language the
   Intercept uses. A mirrored ghost was considered and refused: a second mark
   on the far side of the line would read as an outcome, and this asset has
   exactly one thing to say per call. */

/* Light standing off the line, not a tick drawn on it. The first attempt faded
   each stem from the line outward to almost nothing, which looked better and
   said nothing: the only visible part of every mark ended up sitting ON the
   horizon, so up and down became indistinguishable and the asset lost the one
   thing it exists to show. The taper belongs at the FAR tip. The stem keeps its
   full weight for the first three quarters, so the mass is unmistakably on one
   side of the line, and only then gives out. */
.rc-mark--up i{ background:linear-gradient(to top,rgba(200,240,255,.92) 0%,rgba(190,235,255,.88) 68%,rgba(160,220,255,.22) 100%); }
.rc-mark--down i{ background:linear-gradient(to bottom,rgba(200,240,255,.92) 0%,rgba(190,235,255,.88) 68%,rgba(160,220,255,.22) 100%); }
.rc-mark--up i, .rc-mark--down i{ box-shadow:0 0 9px -3px rgba(0,191,255,.55); }

/* the horizon gets a core, so it is a level the light stands on */
.rc-strip__line{ height:1px; box-shadow:0 0 18px -4px rgba(0,191,255,.30); }
.rc-strip::after{ content:""; position:absolute; left:8%; right:8%; top:50%; height:34px;
  margin-top:-17px; pointer-events:none; z-index:-1;
  background:radial-gradient(60% 100% at 50% 50%,rgba(0,191,255,.10),transparent 70%); }

/* the record arrives the way Today does: from the line outward, in order,
   oldest first, so you watch your own record being laid down */
/* The offset that puts a mark above or below the horizon lives in `transform`.
   An animation that ends at `transform:none` therefore erases it — which is
   exactly what happened on the first cut of this pass, and every mark collapsed
   onto the line. Each direction carries its own keyframes, ending where the
   static rule would have put it. */
@keyframes rc-strip-rise-up{
  from{ opacity:0; transform:translateY(-12px) scaleY(.12); }
  to{ opacity:1; transform:translateY(-12px) scaleY(1); } }
@keyframes rc-strip-rise-down{
  from{ opacity:0; transform:translateY(12px) scaleY(.12); }
  to{ opacity:1; transform:translateY(12px) scaleY(1); } }
@keyframes rc-strip-rise-open{
  from{ opacity:0; transform:scale(.2); } to{ opacity:1; transform:none; } }
.rc-mark--up i{ transform-origin:bottom; animation-name:rc-strip-rise-up !important; }
.rc-mark--down i{ transform-origin:top; animation-name:rc-strip-rise-down !important; }
.rc-mark--open i{ transform-origin:center; animation-name:rc-strip-rise-open !important; }
.rc-mark:nth-child(2) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 0ms both; }
.rc-mark:nth-child(3) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 16ms both; }
.rc-mark:nth-child(4) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 32ms both; }
.rc-mark:nth-child(5) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 48ms both; }
.rc-mark:nth-child(6) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 64ms both; }
.rc-mark:nth-child(7) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 80ms both; }
.rc-mark:nth-child(8) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 96ms both; }
.rc-mark:nth-child(9) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 112ms both; }
.rc-mark:nth-child(10) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 128ms both; }
.rc-mark:nth-child(11) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 144ms both; }
.rc-mark:nth-child(12) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 160ms both; }
.rc-mark:nth-child(13) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 176ms both; }
.rc-mark:nth-child(14) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 192ms both; }
.rc-mark:nth-child(15) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 208ms both; }
.rc-mark:nth-child(16) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 224ms both; }
.rc-mark:nth-child(17) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 240ms both; }
.rc-mark:nth-child(18) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 256ms both; }
.rc-mark:nth-child(19) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 272ms both; }
.rc-mark:nth-child(20) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 288ms both; }
.rc-mark:nth-child(21) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 304ms both; }
.rc-mark:nth-child(22) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 320ms both; }
.rc-mark:nth-child(23) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 336ms both; }
.rc-mark:nth-child(24) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 352ms both; }
.rc-mark:nth-child(25) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 368ms both; }
.rc-mark:nth-child(26) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 384ms both; }
.rc-mark:nth-child(27) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 400ms both; }
.rc-mark:nth-child(28) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 416ms both; }
.rc-mark:nth-child(29) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 432ms both; }
.rc-mark:nth-child(30) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 448ms both; }
.rc-mark:nth-child(31) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 464ms both; }
.rc-mark:nth-child(32) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 480ms both; }
.rc-mark:nth-child(33) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 496ms both; }
.rc-mark:nth-child(34) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 512ms both; }
.rc-mark:nth-child(35) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 528ms both; }
.rc-mark:nth-child(36) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 544ms both; }
.rc-mark:nth-child(37) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 560ms both; }
.rc-mark:nth-child(38) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 576ms both; }
.rc-mark:nth-child(39) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 592ms both; }
.rc-mark:nth-child(40) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 608ms both; }
.rc-mark:nth-child(41) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 624ms both; }
.rc-mark:nth-child(42) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 640ms both; }
.rc-mark:nth-child(43) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 656ms both; }
.rc-mark:nth-child(44) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 672ms both; }
.rc-mark:nth-child(45) i{ animation:rc-strip-rise-up .5s cubic-bezier(.2,.7,.2,1) 688ms both; }
@media (prefers-reduced-motion:reduce){ .rc-mark i{ animation:none !important; } }

/* the one you are looking at breathes, so the eye finds it without a colour */
@keyframes rc-mark-breathe{ 0%,100%{ opacity:.55; transform:scale(1); } 50%{ opacity:1; transform:scale(1.12); } }
.rc-mark.is-cur::after{ animation:rc-mark-breathe 3.2s ease-in-out infinite; }
@media (prefers-reduced-motion:reduce){ .rc-mark.is-cur::after{ animation:none; } }

/* ── R6 · THE STRIP IS OUT (her 2026-09-20 ruling) ────────────────────────
   The row of ticks under the cards is gone at the source: js/23 builds no strip
   and wires no marks. The rule below stays as a belt for any cached copy of the
   old module, and the styles above are left unused, so the asset is one revert
   away instead of one rebuild away. */
#view-record .rc-split > .rc-strip{ display:none !important; }

/* AND THE READING GOES BACK BESIDE THE CARDS (her 2026-09-20 ruling: "it should be
   visually next to the visual anchor not on the bottom"). Two declarations used to
   stand here, orphaned out of a media query whose braces had been cut, so they
   applied at EVERY width: grid-row 3 and grid-column 1 pinned the learning panel
   under the deck and beat the side-by-side grid in pilot.css, which carries her
   09-14 ruling that the orbit is the anchor and the reading stands next to it.
   They are deleted, with the two stray closing braces that came with them; the
   file balances again and .rl places itself in the second column. */

/* ── 19b. THE CHECK LEDGER, under the Record's deck (2026-09-20) ──────────────
      What the INSTRUMENT claimed, and whether it held. The card's glass, border,
      blur and shadow are the .rc-sheet values above, copied off the running rule
      rather than designed again; only the geometry differs, because this one
      stands still in the column instead of turning in the ring. No new colour,
      no new type ramp, no severity hue — the ledger states facts, not alarm. ── */
#rc-checks{ width:100%; max-width:640px; margin:34px auto 0; }
.ck-block{ text-align:center; }
.ck-head{ font:400 13px/1.5 var(--f-body); letter-spacing:0; text-transform:none; color:rgb(var(--ink3)); margin:0 0 10px; }
.ck-note{ font:400 15px/1.5 var(--f-body); color:rgb(var(--ink2)); margin:0 auto 18px; max-width:52ch; }
.ck-note--dim{ color:rgb(var(--ink3)); font-size:14px; }
/* Measured off the running .int-card, not designed again: the same glass, the
   same hairline, the same inset highlight and drop, and — the layer that was
   missing and that carries the whole premium read — the ambient ::before glow.
   Padding follows the Intercept's proportion (72/64/40 on a 640 card), stepped
   down for the Record's narrower column. */
.ck-card{ position:relative; box-sizing:border-box; padding:56px 44px 30px; border-radius:24px; text-align:center; isolation:isolate;
  background:linear-gradient(150deg,rgba(0,191,255,.08),rgba(10,122,205,.06) 55%,rgba(255,255,255,.012));
  border:1px solid rgba(160,225,255,.16); -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 30px 70px -40px rgba(18,64,184,.95); }
.ck-card::before{ content:""; position:absolute; inset:-1px; border-radius:inherit; z-index:-1; pointer-events:none;
  background:radial-gradient(60% 50% at 20% 0%,rgba(47,123,255,.22),transparent 70%),radial-gradient(50% 50% at 90% 100%,rgba(122,92,255,.18),transparent 70%); }
.ck-card--due{ border-color:rgba(180,235,255,.28); }
/* the call's own fate: the same card, one step back in the light, so the surface
   never reads as two questions competing for the same answer */
.ck-card--call{ border-color:rgba(160,225,255,.14); }
/* which of the three the operator is on, in the Intercept's own armed-marker
   language: a mark at the corner, never a bar across the card (no lines) */
.ck-step{ position:absolute; top:22px; right:26px; display:inline-flex; align-items:center; gap:7px; }
.ck-step i{ width:5px; height:5px; border-radius:50%; background:rgb(var(--ink3)); opacity:.35; transition:opacity .25s, box-shadow .25s; }
.ck-step i.on{ opacity:1; background:var(--ice2); }
.ck-stamp{ position:absolute; top:16px; left:22px; }
.ck-claim{ font:400 20px/1.35 var(--f-disp); letter-spacing:-.01em; color:rgb(var(--ink)); margin:0 0 10px; }
/* on the call card the claim is context, not the question: it steps back so the
   question the operator is being asked is the one thing the eye lands on */
.ck-claim--quiet{ font:400 16px/1.45 var(--f-body); letter-spacing:0; color:rgb(var(--ink3)); max-width:44ch; margin:0 auto 16px; }
/* the question carries .int-verdict's measure: balanced, capped at 22ch, so it
   never runs to the card's edge and never breaks on a lonely word */
.ck-ask{ margin:0 auto; max-width:22ch; text-wrap:balance; }
/* the Intercept's own answer row: 28px apart, each answer its own 44px target */
.ck-quiet{ display:flex; align-items:center; justify-content:center; gap:2px 28px; flex-wrap:wrap; margin-top:18px; }
/* each step arrives rather than snapping; the card is re-rendered per step, so
   the animation runs on its own */
@keyframes ck-step-in{ from{ opacity:0; transform:translateY(7px); } to{ opacity:1; transform:none; } }
.ck-card--call .ck-ask, .ck-card--call .ck-quiet{ animation:ck-step-in .34s cubic-bezier(.2,.8,.2,1) both; }
.ck-card--call .ck-quiet{ animation-delay:.05s; }
@media (prefers-reduced-motion:reduce){ .ck-card--call .ck-ask, .ck-card--call .ck-quiet{ animation:none; } }
.ck-sub{ font:400 13px/1.5 var(--f-body); letter-spacing:0; text-transform:none; color:rgb(var(--ink3)); margin:26px 0 8px; }
/* THE LINK: the one sentence the whole ledger exists to produce. It sits at the
   foot with room around it and, once it stands on enough calls, it is read at
   the Record's own status size rather than as a footnote. */
.ck-sub--link{ margin-top:44px; }
.ck-link{ font:400 16px/1.5 var(--f-body); color:rgb(var(--ink2)); margin:0 auto; max-width:46ch; }
.ck-link--read{ font:500 22px/1.3 var(--f-disp); letter-spacing:-.018em; color:rgb(var(--ink)); text-wrap:balance; max-width:30ch; margin-top:12px; }
.ck-list{ list-style:none; margin:0; padding:0; }
.ck-row{ display:flex; align-items:baseline; justify-content:space-between; gap:18px; padding:9px 2px; text-align:left;
  border-top:1px solid rgba(160,225,255,.12); font:400 14px/1.45 var(--f-body); color:rgb(var(--ink2)); }
.ck-row__when{ flex:none; color:rgb(var(--ink3)); font-variant-numeric:tabular-nums; }
.ck-row--done .ck-row__claim{ color:rgb(var(--ink3)); }
@media (max-width:767px){
  #rc-checks{ margin-top:26px; padding:0 16px; }
  .ck-card{ padding:52px 22px 24px; }
  .ck-quiet{ gap:2px 20px; }
  .ck-link--read{ font-size:19px; }
  .ck-claim{ font-size:18px; }
  .ck-row{ flex-direction:column; gap:2px; }
}

/* ═══════════ §31 · HOW HARD WAS THIS, AND WHAT THE RECORD SAYS (2026-09-20) ══
   Two surfaces, no new vocabulary.

   1 · #int-diff — the difficulty question in the Intercept. It reuses the
   .int-facts pill the two facts above already live in, but every option stays
   VISIBLE (the Profile row's behaviour, room-more.css:126-131), because the
   rev/stake pattern shows only the chosen word and here nothing is chosen yet.
   Nothing is pre-selected on purpose: a default would be an answer the
   operator never gave, and this is the one field that cannot be corrected
   later. Unanswered reads ink3, answered reads ink. No fill, no colour, no
   border — the selection is weight and light (constitution §3).

   2 · .jg-* — skill and luck, under the Record's deck. Sentences and rows,
   nothing else. No tile, no bar, no gauge, no chart (§8, §13). Labels are
   sentence case: the uppercase tracking used by the neighbouring .ck-head is a
   pre-existing deviation and is deliberately not copied forward (§2). */
/* THREE questions now, one under the other: how much was knowable, how much
   was yours, and when you will know. They wrap at every width, so a
   between-groups dot would strand itself at the end of a line; the rows are
   separated by their own rhythm instead. The dot was rendered and then hidden
   in CSS, which §1.5 does not allow — it is out of the markup rather than
   painted and suppressed. */
#int-diff{ flex-direction:column; align-items:center; flex-wrap:wrap; gap:0; margin-top:10px; padding:4px 16px; }
#int-diff .int-fact{ flex-wrap:wrap; justify-content:center; }
#int-diff .int-pill{ display:inline-flex; align-items:center; padding:0 6px; min-height:44px; margin:-4px 0;
  color:rgb(var(--ink3)); transition:color .15s; }
#int-diff .int-pill + .int-pill{ position:relative; margin-left:6px; }
#int-diff .int-pill + .int-pill::before{ content:'·'; position:absolute; left:-7px; color:rgb(var(--ink3)); opacity:.6; pointer-events:none; }
#int-diff .int-pill:hover{ color:rgb(var(--ink2)); }
#int-diff .int-pill.sel{ color:rgb(var(--ink)); }
#int-diff .int-pill:focus-visible{ outline:2px solid var(--ice2); outline-offset:3px; }
@media (max-width:640px){
  /* phone: the same two rows, a softer radius, no horizontal scroll (§11) */
  #int-diff{ padding:6px 14px; border-radius:18px; }
}

.jg-block{ text-align:center; margin-top:44px; }
.jg-sub{ font:400 13px/1.5 var(--f-body); color:rgb(var(--ink3)); margin:0 0 10px; }
.jg-block .jg-sub ~ .jg-sub{ margin-top:46px; }
/* The conclusion of a block. Sized DOWN from the room's anchor deliberately:
   the Record's anchor is the sheet, and a finding two or three lines long is a
   paragraph doing a headline's job if it wears the 22px ramp at a 34ch measure
   — it broke into five four-word lines in a 723px column. 19px against 44ch
   reads as one thought, and the sheet keeps its place as the loudest thing in
   the room (§2, §7: one anchor per room). */
.jg-line{ font:500 19px/1.42 var(--f-disp); letter-spacing:-.014em; color:rgb(var(--ink));
  margin:0 auto 12px; max-width:44ch; text-wrap:pretty; }
/* the provenance line — the one Cormorant turn this surface is allowed */
.jg-honest{ font:italic 500 17px/1.5 var(--f-em); color:rgb(var(--ink2));
  margin:0 auto 20px; max-width:46ch; }
/* a refusal is a sentence, never a zero and never a spinner (§9) */
.jg-note{ font:400 15px/1.55 var(--f-body); color:rgb(var(--ink3)); margin:0 auto; max-width:50ch; }
.jg-list{ list-style:none; margin:14px auto 0; padding:0; max-width:56ch; }
.jg-row{ display:flex; align-items:baseline; justify-content:space-between; gap:18px;
  min-height:44px; padding:10px 2px; text-align:left;
  font:400 15px/1.45 var(--f-body); color:rgb(var(--ink2));
  border-top:1px solid rgba(160,225,255,.10); }
.jg-row:first-child{ border-top:0; }
.jg-row__l{ color:rgb(var(--ink2)); }
.jg-row__v{ flex:none; color:rgb(var(--ink)); font-variant-numeric:tabular-nums; }
@media (max-width:640px){
  .jg-line{ font-size:18px; }
  .jg-honest{ font-size:16px; }
  .jg-row{ flex-direction:column; gap:2px; min-height:0; padding:9px 2px; }
  .jg-row__v{ color:rgb(var(--ink)); }
}

/* the recall: ten numbers in the room's own answer pill. Narrower cells than a
   worded answer because a digit needs no room, tabular so the row does not
   shift as the eye runs along it, and it wraps rather than scrolling sideways
   on a phone (§11). Same pill, same hairline separators, no new control. */
.rc-ans__pill--n{ flex-wrap:wrap; justify-content:center; row-gap:2px; }
.rc-ans__pill--n .rc-q{ padding:0 9px; font-variant-numeric:tabular-nums; }
@media (max-width:420px){ .rc-ans__pill--n .rc-q{ padding:0 7px; } }
/* a state, not a number: their own sentence on the left, what became of it on
   the right, in the word rather than a hue (§3). Left column takes the measure
   so a long condition wraps instead of squeezing the state off the row. */
.jg-row__v--word{ color:rgb(var(--ink2)); font-variant-numeric:normal; }
.jg-list .jg-row__l{ flex:1 1 auto; }
/* the waiting list sits further from the findings than the findings sit from
   each other, so the eye reads evidence first and the queue second */
.jg-sub--wait{ margin-top:56px; }

/* ── THE DISCLOSURE (2026-09-20, design pass) ──────────────────────────────
   One finding stands; the rest are a word. A quiet text exit in the register
   the Intercept already uses for its exits (.int-quiet, §9): Manrope 500 14px,
   ink2 rising to ink, no underline, no box, no chevron. It is not a control
   with a surface; it is a sentence you can press. 44px of height so the thumb
   has it (§11), and the height comes from padding rather than a min-height so
   the line keeps its own rhythm above the rows it opens. */
.jg-more{ display:inline-block; margin:26px auto 0; padding:12px 6px;
  background:none; border:0; cursor:pointer;
  font:500 14px/1.4 var(--f-body); letter-spacing:0; color:rgb(var(--ink2));
  transition:color .15s; }
.jg-more:hover{ color:rgb(var(--ink)); }
.jg-more:focus-visible{ outline:2px solid var(--ice2); outline-offset:3px; border-radius:6px; }
/* what it opens is the same blocks, unchanged, with the first of them given
   the distance from the disclosure that the blocks give each other */
.jg-rest{ margin-top:6px; }
.jg-rest > .jg-sub:first-child{ margin-top:40px; }
@media (prefers-reduced-motion:no-preference){
  .jg-rest{ animation:jg-rest-in .32s cubic-bezier(.2,.8,.2,1) both; }
}
@keyframes jg-rest-in{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }

/* ═══════════ §32 · HAVE I BEEN HERE BEFORE (2026-09-20) ══════════════════
   One quiet line under the model line, in the same register: a count, then
   the operator's own earlier sentence one rung dimmer. It is a finding, not a
   warning, so it carries no colour, no icon, no border and no weight above
   the verdict (§3, §13). The earlier sentence is shown so the match can be
   dismissed by eye; it is their wording, so it is set in the body face and
   never restyled into a quote. */
.int-recur{ margin:10px auto 0; max-width:38ch; }
.int-recur__line{ margin:0; font:400 15px/1.5 var(--f-body); color:rgb(var(--ink2)); text-align:center; }
.int-recur__eg{ margin:4px 0 0; font:400 13.5px/1.45 var(--f-body); color:rgb(var(--ink3)); text-align:center; }
@media (max-width:767px){ .int-recur{ margin-top:8px; } .int-recur__eg{ font-size:13px; } }


/* ═══════════ §33 · THE BODY, IN THE SENSORS ROOM (2026-09-20) ══════════════
   One more block under the four channels, in the room's own rhythm. Sentences
   and rows; no tile, no bar, no gauge, no chart, no hue carrying meaning (§8,
   §13). It sits on the ground behind a hairline rather than in a frame, because
   glass in Areté holds an object and this block holds words (§4). */
.sn-nights{ margin-top:34px; padding-top:26px; border-top:1px solid var(--hair); text-align:left; }
.sn-nights:empty{ display:none; }
.bd-sub{ font:400 13px/1.5 var(--f-body); color:rgb(var(--ink3)); margin:0 0 10px; }
.bd-sub--2{ margin-top:38px; }
/* the conclusion. Sized under the room's anchor — the arcs and the load number
   are the loudest thing in Sensors and stay that way (§7). */
.bd-line{ font:500 18px/1.42 var(--f-disp); letter-spacing:-.012em; color:rgb(var(--ink));
  margin:0 0 10px; max-width:44ch; text-wrap:pretty; }
/* the one Cormorant turn this block is allowed: where the number came from */
.bd-honest{ font:italic 500 16px/1.5 var(--f-em); color:rgb(var(--ink2)); margin:0 0 16px; max-width:46ch; }
/* a refusal is a sentence (§9) */
.bd-note{ font:400 15px/1.55 var(--f-body); color:rgb(var(--ink3)); margin:0; max-width:50ch; }
.bd-list{ list-style:none; margin:14px 0 0; padding:0; max-width:56ch; }
.bd-row{ display:flex; align-items:baseline; gap:18px; min-height:44px; padding:10px 2px;
  font:400 15px/1.45 var(--f-body); color:rgb(var(--ink2));
  border-top:1px solid var(--hair); }
.bd-row:first-child{ border-top:0; }
.bd-row__l{ flex:1 1 auto; color:rgb(var(--ink2)); }
.bd-row__v{ flex:none; color:rgb(var(--ink)); font-variant-numeric:tabular-nums; }
.bd-row__v--word{ color:rgb(var(--ink2)); font-variant-numeric:normal; }
/* the one act that genuinely exists. A quiet text exit, not a danger button:
   there is no red in Areté (§3), and the sentence beside it carries the weight. */
.bd-revoke{ flex:none; margin-left:4px; padding:0 6px; min-height:44px;
  background:none; border:0; cursor:pointer;
  font:500 14px/1.4 var(--f-body); color:rgb(var(--ink3)); transition:color .15s; }
.bd-revoke:hover{ color:rgb(var(--ink)); }
.bd-revoke:disabled{ opacity:.35; cursor:default; }
.bd-revoke:focus-visible{ outline:2px solid var(--ice2); outline-offset:3px; border-radius:6px; }
@media (max-width:640px){
  .bd-line{ font-size:17px; }
  .bd-honest{ font-size:15px; }
  .bd-row{ flex-wrap:wrap; gap:2px 12px; min-height:0; padding:9px 2px; }
  .bd-row__l{ flex:1 0 100%; }
}

/* the company's promise, where the roster used to be (js/08). Not a footnote:
   it is the reason there is nothing else here. */
.ws-promise{ margin:18px 0 0; padding-top:18px; border-top:1px solid var(--hair);
  max-width:52ch; font:400 15px/1.6 var(--f-body); color:rgb(var(--ink2)); text-wrap:pretty; }

/* ═══════════ §34 · THE RECORD'S ONE DOOR (2026-09-20, her ruling) ══════════
   "We should access it through a button. It should not be spread like that."

   Everything the record has to say is behind this. The room is the deck, the
   light and one line again; the evidence opens as a sheet on the Intercept's
   own lit scrim.

   The door is a quiet text exit, not a second primary: §9 allows one primary
   action per room and the Record's is "Add a decision". It sits centred under
   the deck with a hairline above it, the same separation every supporting
   block in this product gets, and it never glows. */
.rc-door{ margin:38px auto 0; padding-top:24px; border-top:1px solid var(--hair);
  max-width:56ch; text-align:center; }
.rc-door__btn{ padding:12px 8px; min-height:44px; background:none; border:0; cursor:pointer;
  font:500 15px/1.4 var(--f-body); letter-spacing:0; color:rgb(var(--ink2));
  transition:color .15s; }
.rc-door__btn:hover{ color:rgb(var(--ink)); }
.rc-door__btn:focus-visible{ outline:2px solid var(--ice2); outline-offset:3px; border-radius:8px; }
/* closed, it is not in the room at all — not rendered and hidden, but out of
   the flow until the sheet takes it (§1.5) */
.rc-evidence.hidden{ display:none; }
/* inside the sheet the blocks keep their own rhythm, but the first one does not
   need the 44px it used to need to clear the deck above it */
.rc-evidence .jg-block{ margin-top:34px; }
.rc-evidence .ck-block{ text-align:center; }

/* ═══════════ §33 · THE LOOP CLOSES WHERE YOU ALREADY ARE (2026-09-23) ═════
   Shown only in the seconds after a commit, in the Intercept's own frame and
   its own controls. Deliberately quieter than the verdict above it: this is
   an old call, and the new one is what they came for. Their words sit one
   rung brighter than the frame around them, because the sentence is theirs
   and everything else here is ours. */
/* NAMED int-loop, not int-close: `.int-close` is already the Intercept's
   dismiss button, absolutely positioned at 44x44 in the corner, and a block
   that borrowed the name silently inherited it and rendered outside the card.
   Found by looking at it, not by a test.

   The Intercept's column is a grid with justify-items:center, so an item
   sized by its content lands beside the column rather than in it. This takes
   the full track and centres its own measure inside it, which is how every
   other block in that stack behaves. */
.int-loop{ grid-column:1 / -1; width:100%; box-sizing:border-box;
  margin:18px auto 0; max-width:40ch; text-align:center;
  padding-top:16px; border-top:1px solid rgba(160,225,255,.12); }
.int-loop__head{ margin:0; font:400 13px/1.5 var(--f-body); color:rgb(var(--ink3)); }
.int-loop__words{ margin:4px 0 12px; font:500 17px/1.35 var(--f-disp); letter-spacing:-.012em; color:rgb(var(--ink)); text-wrap:balance; }
.int-loop__fx{ margin:0 0 8px; font:400 13.5px/1.45 var(--f-body); color:rgb(var(--ink3)); }
.int-loop__q{ margin:0 0 10px; font:400 15px/1.5 var(--f-body); color:rgb(var(--ink2)); }
.int-loop .rc-ans{ display:flex; justify-content:center; }
.int-loop__skip{ display:block; margin:12px auto 0; min-height:44px; }
@media (max-width:767px){
  .int-loop{ margin-top:14px; max-width:100%; }
  .int-loop__words{ font-size:16px; }
}
