/* generated by portal/build.py from ilist/render/theme.py — do not edit */
.fscen{
 --tx:var(--ink); --tx2:var(--ink-2); --mut:var(--ink-3); --dim:var(--ink-3);
 --gold:var(--accent); --em:var(--good); --red:var(--bad); --cy:var(--teal);
 --card:var(--surface); --card2:var(--surface-2); --line:var(--border);
 --sans:inherit;
 background:var(--surface); border:1px solid var(--border);
 /* A comfortable measure. Full-bleed on a 1800px screen would set the
    flag bullets on 200-character lines. */
 max-width:1040px;
 border-radius:var(--r-lg); padding:20px 22px; margin:var(--s5) 0 0}
.fscen>.k{font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;
 color:var(--accent);font-weight:800}
.fscen>.s{font-size:12.5px;color:var(--ink-2);margin-top:5px}
.fscen .num{font-variant-numeric:tabular-nums}
.fscen a{color:var(--teal)}

.card.fscen{padding-bottom:16px}
.fs-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
 flex-wrap:wrap;font-size:11px;letter-spacing:.13em;text-transform:uppercase;
 color:var(--mut);font-weight:700;margin:2px 0 12px}
.fs-head .num{color:var(--tx);letter-spacing:.04em}
.fs-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.fs-case{background:var(--card2);border:1px solid var(--line);border-radius:11px;
 padding:11px 12px 10px;min-width:0}
.fs-case .fs-lab{font-size:10px;letter-spacing:.2em;font-weight:800;color:var(--mut)}
.fs-bear .fs-lab{color:var(--red)} .fs-base .fs-lab{color:var(--gold)}
.fs-bull .fs-lab{color:var(--em)}
.fs-val{font-size:21px;font-weight:750;color:var(--tx);margin-top:5px;line-height:1.15;
 font-variant-numeric:tabular-nums}
.fs-delta{font-size:12.5px;font-weight:700;margin-top:1px;font-variant-numeric:tabular-nums}
.fs-delta.pos{color:var(--em)} .fs-delta.neg{color:var(--red)}
.fs-cagr{color:var(--mut);font-weight:600;font-size:11px;margin-left:6px;
 letter-spacing:.01em}
.fs-in{font-size:10.5px;color:var(--mut);margin-top:7px;letter-spacing:.02em}
/* The cone is fixed-ratio, so an unconstrained width makes it grow taller
   than the screen on a wide card. Capped at a size where the endpoint
   labels still read without the chart dominating the page. */
svg.fan{width:100%;max-width:820px;height:auto;display:block;
 margin:16px auto 4px;overflow:visible}
.fan-x{font-size:9.5px;fill:var(--dim);letter-spacing:.1em;text-transform:uppercase;
 font-family:var(--sans);font-weight:700}
.fan-e{font-size:11px;font-weight:750;font-family:var(--sans);
 font-variant-numeric:tabular-nums}
.fs-band{margin-top:12px}
.fs-band-l{font-size:10px;letter-spacing:.18em;text-transform:uppercase;
 color:var(--mut);font-weight:700;margin-bottom:7px}
.bandstrip .bs-track{position:relative;height:9px;border-radius:5px;
 background:linear-gradient(90deg,rgba(255,255,255,.05),rgba(255,255,255,.11))}
.bs-box{position:absolute;top:0;bottom:0;background:rgba(244,194,90,.28);
 border-radius:5px}
.bs-med{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--gold)}
.bs-rec{position:absolute;top:-1px;bottom:-1px;width:2px;background:var(--cy);opacity:.8}
.bs-now{position:absolute;top:-5px;bottom:-5px;width:2.5px;background:var(--tx);
 box-shadow:0 0 0 2px var(--card)}
.bs-now.out{background:var(--red)}
.bs-legend{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
 margin-top:7px;font-size:10.5px;color:var(--dim);font-variant-numeric:tabular-nums}
.bs-legend b{color:var(--tx2);font-weight:700} .bs-legend b.bs-warn{color:var(--red)}
.fs-note{font-size:11px;color:var(--mut);margin-top:11px;font-style:italic}
.fs-flags{margin:11px 0 0;padding-left:16px;font-size:11.5px;color:var(--mut);
 line-height:1.6} .fs-flags li{margin-bottom:3px}
.fs-more{margin-top:13px;border-top:1px solid var(--line);padding-top:10px}
.fs-more summary{cursor:pointer;font-size:11px;letter-spacing:.12em;
 text-transform:uppercase;color:var(--mut);font-weight:700;list-style:none}
.fs-more summary::-webkit-details-marker{display:none}
.fs-more summary:before{content:"+ ";color:var(--gold)}
.fs-more[open] summary:before{content:"\2212 "}
.fs-more summary:hover{color:var(--tx2)}
.fs-tbl{width:100%;border-collapse:collapse;margin-top:10px;font-size:11.5px}
.fs-tbl th{text-align:left;padding:5px 12px 5px 0;color:var(--mut);font-weight:700;
 white-space:nowrap;vertical-align:top;width:1%}
.fs-tbl td{padding:5px 0;color:var(--tx2);vertical-align:top}
.fs-foot{margin-top:13px;font-size:10.5px;color:var(--dim);line-height:1.55;
 border-top:1px solid var(--line);padding-top:9px}
@media(max-width:620px){.fs-cases{grid-template-columns:1fr;gap:7px}
 .fs-case{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:10px}
 .fs-case .fs-in{grid-column:1/-1;margin-top:2px}.fs-val{font-size:18px;margin-top:0}}
:root[data-theme="light"] .bandstrip .bs-track{
 background:linear-gradient(90deg,rgba(26,21,6,.06),rgba(26,21,6,.13))}
:root[data-theme="light"] .bs-box{background:rgba(143,106,18,.22)}
@media print{.fs-more[open] summary:before{content:""}.fs-more summary{display:none}}

/* Scenario board — /scenarios */
.sb-head{margin:var(--s6) 0 var(--s5);max-width:70ch}
.sb-dek{color:var(--ink-2);font-size:15px;line-height:1.65;margin:var(--s3) 0}
.sb-legend{display:flex;flex-wrap:wrap;align-items:center;color:var(--ink-3);
 margin:var(--s5) 0 var(--s2);text-transform:uppercase;letter-spacing:.1em}
.sb-legend span{display:inline-flex;align-items:center;margin:0 18px 6px 0}
.sb-legend .sb-k{margin-right:6px}
.sb-k{width:10px;height:10px;border-radius:2px;display:inline-block}
.sb-k-bear{background:var(--bad)} .sb-k-base{background:var(--accent)}
.sb-k-bull{background:var(--good)} .sb-k-zero{width:2px;height:13px;background:var(--ink)}
.sb-scale{position:relative;height:16px;margin-left:clamp(108px,17vw,212px);
 margin-right:240px}
.sb-scale span{position:absolute;transform:translateX(-50%);white-space:nowrap}
.sb-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--border)}
.sb-row{display:grid;column-gap:12px;grid-template-columns:clamp(96px,17vw,200px) 1fr 56px 172px;
 align-items:center;padding:9px 0;border-bottom:1px solid var(--border);
 /* SKIP WHAT IS OFF SCREEN. The board is 397 rows and ~900 KB of DOM; the
    network side is fine (120 KB brotli in 0.4s) but the browser was laying
    out and painting every row before first paint. content-visibility lets it
    do that work only as rows approach the viewport. contain-intrinsic-size
    supplies a placeholder height so the scrollbar does not jump, and `auto`
    lets the real height replace the estimate once a row has been rendered
    once. Filtering still works: board.js toggles [hidden], not visibility. */
 content-visibility:auto;contain-intrinsic-size:auto 116px}
.sb-row:hover{background:var(--surface)}
.sb-name{display:flex;flex-direction:column;gap:1px;text-decoration:none;min-width:0}
.sb-name b{color:var(--accent);font-size:12.5px;letter-spacing:.04em}
.sb-co{color:var(--ink-3);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;
 white-space:nowrap}
.sb-track{position:relative;height:22px}
.sb-bar{position:absolute;top:7px;height:8px;border-radius:4px;
 background:linear-gradient(90deg,var(--bad),var(--accent),var(--good));opacity:.75}
.sb-base{position:absolute;top:3px;height:16px;width:2px;background:var(--ink);
 box-shadow:0 0 0 1px var(--bg)}
.sb-zero{position:absolute;top:-2px;bottom:-2px;width:1px;background:var(--ink-3);
 opacity:.55}
.sb-nums{display:flex;justify-content:flex-end;font-size:11.5px;
 font-variant-numeric:tabular-nums}
/* Level over percentage, stacked. The ₹ figure is the model's output and gets
   the weight; the % is the distance from today and rides underneath at 88%. */
.sb-n{min-width:70px;text-align:right;margin-left:10px;display:flex;
 flex-direction:column;line-height:1.25}
.sb-n b{font-weight:500;font-size:12.5px}
.sb-n i{font-style:normal;font-size:10.5px;opacity:.72}
.sb-neg{color:var(--bad)} .sb-mid{color:var(--ink)} .sb-pos{color:var(--good)}
@media(max-width:900px){ .sb-n{min-width:58px} .sb-n b{font-size:11.5px} }
.sb-meta{grid-column:2/3;margin-top:-4px}
.sb-over-r:after{content:'\203A';position:absolute;right:-9px;top:2px;
 color:var(--good);font-size:13px}
.sb-over-l:before{content:'\2039';position:absolute;left:-9px;top:2px;
 color:var(--bad);font-size:13px}
.sb-rec{display:flex;align-items:center;justify-content:flex-end;font-size:10px;
 letter-spacing:1px;min-width:44px}
.sb-rec i{font-style:normal}
.sb-rec .m-beat{color:var(--good)} .sb-rec .m-met{color:var(--accent)}
.sb-rec .m-missed{color:var(--bad)}
.sb-rec.none{color:var(--ink-3);opacity:.45;letter-spacing:0}
.sb-sec{margin:var(--s7) 0 var(--s3)}
.sb-sec h2{font-size:16px;font-weight:500;margin:0 0 6px}
/* Uncapped: a tier heading's description is a full-width block with nothing
   beside it, so 72ch only ever left the right of the page empty. */
.sb-sec p{color:var(--ink-3);font-size:13px;line-height:1.6;margin:0}
/* Outlook — company page */
.ol-wrap{border-left:2px solid var(--border-2);padding-left:14px;margin:10px 0 0}
.ol-target{color:var(--accent);margin-bottom:10px;letter-spacing:.03em}
.ol-item{color:var(--ink-2);font-size:14px;line-height:1.65;margin:0 0 9px}
.ol-item.ol-spec{color:var(--ink)}
.ol-spec-n{margin-top:10px;line-height:1.6}
/* Pace gauge — company page */
.pace-box{border:0.5px solid var(--border);border-radius:12px;padding:14px 16px;margin-top:10px}
.pace-head{display:flex;justify-content:space-between;align-items:baseline;
 color:var(--ink-3);letter-spacing:.1em;margin-bottom:10px}
.pace-tone{text-transform:none;letter-spacing:.02em}
.pace-tone.t-ok{color:var(--good)} .pace-tone.t-mid{color:var(--accent)}
.pace-tone.t-warn{color:var(--warn)} .pace-tone.t-bad{color:var(--bad)}
.pace-track{position:relative;height:12px;border-radius:6px;background:var(--surface-2);
 box-shadow:inset 0 0 0 0.5px var(--border)}
.pace-track i{position:absolute;left:0;top:0;bottom:0;border-radius:6px;display:block;
 transition:width .35s ease}
/* Provisional: the ratio is real, the verdict is not yet earned. */
.pace-track i.pace-prov{opacity:.55}
.pace-prov-note{color:var(--ink-3);font-style:italic}
.pace-track i.t-ok{background:linear-gradient(90deg,var(--good),#5CB88A)}
.pace-track i.t-mid{background:linear-gradient(90deg,var(--accent-deep),var(--accent))}
.pace-track i.t-warn{background:linear-gradient(90deg,#B97A18,var(--warn))}
.pace-track i.t-bad{background:linear-gradient(90deg,#8E2F2F,var(--bad))}
/* Beating guidance is the rarest outcome here; it gets a moving spectrum. */
.pace-track i.pace-over{
 background:linear-gradient(90deg,#E24B4A,#EF9F27,#97C459,#1D9E75,#378ADD,#7F77DD,#D4537E);
 background-size:260% 100%;animation:pace-flow 4.5s linear infinite;
 box-shadow:0 0 10px rgba(127,119,221,.45)}
@keyframes pace-flow{from{background-position:0% 50%}to{background-position:260% 50%}}
@media (prefers-reduced-motion:reduce){.pace-track i.pace-over{animation:none}}
/* The 100% mark sits at 100/130 of the track: filed growth exactly matching the
   guided rate, with room to the right for beating it. */
.pace-mark{position:absolute;left:76.9%;top:-3px;bottom:-3px;width:2px;
 background:var(--ink-3);opacity:.7}
.pace-legs{display:flex;justify-content:space-between;margin-top:9px;color:var(--ink-3)}
.pace-legs b{color:var(--ink);font-weight:500}
.lead-foot{display:flex;flex-wrap:wrap;margin-top:6px}
.lead-foot span{margin-right:10px}
.lead-mat{color:var(--accent);text-transform:uppercase;letter-spacing:.08em}
.lead-verify{color:var(--ink-3);margin-top:5px;line-height:1.5}
.hold-h{margin-top:var(--s4);padding-top:var(--s3);border-top:0.5px solid var(--border)}
.holds{list-style:none;margin:9px 0 0;padding:0}
/* THE MARK HAS TO BE READABLE AT A GLANCE, since it is the entire content of
   the row. A 12px mono tick at 50% opacity was a smudge — the label carried all
   the meaning and the mark carried none. Held rows get a filled disc with the
   glyph knocked out of it, which reads as a state rather than as punctuation;
   absent rows get a hollow ring at the same size so the column stays even. */
.holds li{display:flex;align-items:center;padding:4px 0;font-size:12.5px;
 color:var(--ink-3);letter-spacing:.01em}
.holds li.on{color:var(--ink)}
.holds i{font-style:normal;flex:0 0 auto;width:15px;height:15px;margin-right:9px;
 border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
 font-size:9.5px;font-weight:700;line-height:1;
 border:1px solid var(--border-2);color:transparent}
.holds li.on i{background:var(--good);border-color:var(--good);color:#fff}
:root[data-theme="light"] .holds li.on i{background:#15703F;border-color:#15703F}
:root[data-theme="light"] .holds li{color:var(--ink-3)}
:root[data-theme="light"] .holds li.on{color:var(--ink)}
.mt-l{margin-top:var(--s5)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
 white-space:nowrap}
:root[data-theme="light"] .pace-track{background:rgba(26,21,6,.10)}
:root[data-theme="light"] .pace-mark{background:var(--ink);opacity:.55}

/* Masthead: prose left, sector chips right. The prose column is capped in ch
   so it stays readable; the chip column takes whatever the shell has spare,
   which on a wide desktop was empty space and on a narrow one is nothing —
   hence the single-column fallback rather than a squeezed two. */
.sb-top{display:grid;grid-template-columns:minmax(0,68ch) minmax(300px,1fr);
 gap:var(--s7);align-items:start;margin:var(--s6) 0 var(--s5)}
.sb-top .sb-head{margin:0;max-width:none}
/* The legend now lives in the left column. Given a rule and its own air so it
   reads as a key to the chart rather than a fourth paragraph of prose. */
.sb-top .sb-legend{margin-top:var(--s5);padding-top:var(--s4);
 border-top:1px solid var(--border)}
/* min-width:0 IS LOAD-BEARING, not tidiness. A grid item defaults to
   min-width:auto, so the nowrap chip strip below sized itself to its content
   and pushed the PAGE to 4,056px wide at a 375px viewport instead of scrolling
   inside its own box. The overflow container cannot contain anything until its
   ancestors are allowed to be narrower than their contents. */
.sb-aside{position:relative;min-width:0}
.sb-aside-h{margin-bottom:9px;letter-spacing:.16em}
.sb-aside .sb-sectors{margin:0;max-height:none;min-width:0}
/* BALANCED BY MEASUREMENT, NOT BY A ROW COUNT.
   The masthead is a fixed amount of prose; the chip list grows every time a
   sector enters coverage, and at 40 sectors it ran ~300px past the text beside
   it and left the left column looking half-empty. Hard-coding "three rows"
   would balance today's build and go stale on the next one, so static/sbfit.js
   clamps the list to whatever the masthead ACTUALLY occupies at this viewport
   and offers the rest behind a toggle. Nothing is hidden: every sector name is
   also matched by the search field above. */
.sb-aside .sb-sectors.sb-clamp{overflow:hidden;
 mask-image:linear-gradient(180deg,#000 74%,transparent);
 -webkit-mask-image:linear-gradient(180deg,#000 74%,transparent)}
.sb-more{margin-top:10px;font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;
 text-transform:uppercase;color:var(--ink-3);background:none;border:0;padding:0;cursor:pointer}
.sb-more:hover{color:var(--accent)}
@media(max-width:1040px){
 .sb-top{grid-template-columns:minmax(0,1fr);gap:var(--s4)}
 .sb-aside-h{margin-top:var(--s3)}
 /* ONE SWIPEABLE ROW, NOT TWENTY-EIGHT STACKED ONES.
    Stacked, these chips are ~1,900px of filter above the first bar — the board
    itself would start three screens down. A carousel is the wrong answer for an
    ARCHIVE (it hides content behind a gesture) and the right one for FILTER
    CHIPS, which are a control rather than the thing being read. Nothing is lost
    either: every sector name is also matched by the search field above. */
 .sb-aside .sb-sectors{flex-wrap:nowrap;overflow-x:auto;padding-bottom:8px;
  -webkit-overflow-scrolling:touch;scrollbar-width:thin;
  mask-image:linear-gradient(90deg,#000 88%,transparent);
  -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent)}
 .sb-aside .sb-sc{flex:0 0 auto}
}
.sb-sectors{display:flex;flex-wrap:wrap;margin:var(--s4) 0 var(--s2)}
.sb-sc{display:inline-flex;align-items:baseline;background:none;border:0.5px solid var(--border);
 border-radius:var(--r-full);padding:5px 11px;margin:0 7px 7px 0;cursor:pointer;
 font:inherit;font-size:11.5px;color:var(--ink-2)}
.sb-sc:hover{border-color:var(--border-hi)}
.sb-sc.on{border-color:var(--accent);color:var(--ink);background:var(--surface)}
.sb-sc b{font-weight:500;margin-right:7px}
.sb-sc i{font-style:normal;color:var(--accent);font-variant-numeric:tabular-nums}
.sb-sc u{text-decoration:none;color:var(--ink-3);margin-left:6px;font-size:10.5px}
.sb-controls{display:flex;flex-wrap:wrap;align-items:center;margin:var(--s3) 0 var(--s2);
 color:var(--ink-3)}
.sb-controls label{display:inline-flex;align-items:center;margin:0 16px 6px 0}
.sb-controls select{margin-left:7px;font-size:11.5px;padding:3px 6px}
.sb-controls input[type=checkbox]{margin-right:6px}
.sb-controls button{font-size:11px;padding:3px 10px}
.sb-controls #sb-count{margin-left:auto}
/* Search, first in the control bar. Wider than the selects because a company
   name is longer than "base case", and given a little more air so it reads as
   the entry point to the row rather than one more dropdown. */
.sb-find{margin-right:20px!important}
.sb-find input{font:inherit;font-size:12px;width:210px;max-width:46vw;
 padding:5px 11px;border-radius:var(--r-full);border:0.5px solid var(--border-2);
 background:var(--surface);color:var(--ink);outline:0}
.sb-find input::placeholder{color:var(--ink-3);opacity:.75}
.sb-find input:focus{border-color:var(--accent)}
.sb-none{margin:var(--s5) 0;color:var(--ink-2);font-size:14px}
.sb-none[hidden]{display:none}
:root[data-theme="light"] .sb-find input{background:rgba(26,21,6,.04)}
.sb-score{display:inline-block;min-width:26px;text-align:center;border-radius:4px;
 background:var(--surface-2);color:var(--ink);padding:1px 5px;margin-right:9px;
 font-variant-numeric:tabular-nums}
.sb-meta span{margin-right:11px}
.sb-bp{position:relative;display:inline-block;width:52px;height:7px;border-radius:4px;
 background:var(--surface-2);vertical-align:middle}
.sb-bp i{position:absolute;top:0;bottom:0;background:rgba(229,195,106,.32);border-radius:4px}
.sb-bp b{position:absolute;top:-2px;bottom:-2px;width:2px;background:var(--ink)}
.sb-bp.out b{background:var(--bad)}
.sb-pace{position:relative;display:inline-block;width:44px;height:7px;border-radius:4px;
 background:var(--surface-2);vertical-align:middle;overflow:hidden}
.sb-pace i{position:absolute;left:0;top:0;bottom:0;border-radius:4px}
.sb-pace.t-ok i{background:var(--good)} .sb-pace.t-mid i{background:var(--accent)}
.sb-pace.t-warn i{background:var(--warn)} .sb-pace.t-bad i{background:var(--bad)}
.sb-quote{grid-column:2/-1;color:var(--ink-3);font-size:12.5px;line-height:1.55;
 margin:2px 0 0;max-width:82ch;font-family:var(--font-voice,inherit)}
.sb-calib{margin-top:var(--s4);line-height:1.7}
@media(max-width:720px){.sb-quote{grid-column:1/-1}.sb-controls #sb-count{margin-left:0}}
.sb-under .sb-bar{opacity:.4}
/* LIGHT MODE. The bars are translucent fills over a near-white surface, which
   on a light ground leaves them barely distinguishable from the track — the
   opacity that reads as "subtle" at 8% lightness reads as "absent" at 96%.
   Stronger fills, a darker track, and full-opacity strokes. */
:root[data-theme="light"] .sb-bar{opacity:1}
:root[data-theme="light"] .sb-under .sb-bar{opacity:.6}
:root[data-theme="light"] .sb-bp,
:root[data-theme="light"] .sb-pace{background:rgba(26,21,6,.13)}
:root[data-theme="light"] .sb-bp i{background:rgba(143,106,18,.55)}
:root[data-theme="light"] .sb-bp b{background:var(--ink);width:2.5px}
:root[data-theme="light"] .sb-zero{background:var(--ink-2);opacity:.85;width:1.5px}
:root[data-theme="light"] .sb-base{background:var(--ink);width:2.5px}
:root[data-theme="light"] .sb-score{background:rgba(26,21,6,.09);color:var(--ink)}
:root[data-theme="light"] .sb-quote{color:var(--ink-2)}
:root[data-theme="light"] .sb-rec .m-met{color:var(--accent-hi)}
@media (prefers-color-scheme:light){
 :root:not([data-theme="dark"]) .sb-bar{opacity:1}
 :root:not([data-theme="dark"]) .sb-bp,
 :root:not([data-theme="dark"]) .sb-pace{background:rgba(26,21,6,.13)}
 :root:not([data-theme="dark"]) .sb-bp i{background:rgba(143,106,18,.55)}
 :root:not([data-theme="dark"]) .sb-zero{background:var(--ink-2);opacity:.85}
}

.sb-under .sb-name b{color:var(--ink-3)}
.sb-nolink b{color:var(--ink-2)}
/* Same treatment as the site disclaimer: capped at 80ch this ran five short
   lines down the left of a 1,392px page with the right two-thirds empty.
   Columns use the width at a readable measure instead of stretching one line
   across it. Collapses to a single column on its own below ~800px. */
/* M cap on the row. The label is set in small caps and dimmer than the figure
   so the eye reads the number first and the kind only if it needs to. */
.sb-mc em{font-style:normal;opacity:.62;letter-spacing:.08em}
/* Earnings-base quality. Shown only where there is evidence either way, so an
   absent chip means "not established" and never "fine". */
.sb-bq{border:1px solid var(--border);border-radius:3px;padding:0 5px;
  letter-spacing:.06em;text-transform:uppercase;font-size:.58rem}
.sb-bq.warn{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 42%,transparent)}
.sb-bq.ok{color:var(--ink-3)}
/* FULL WIDTH, SINGLE COLUMN. These were columnised to use the space, and that
   was the wrong fix: a three-line paragraph split into two columns makes the
   reader go down the left, then back up to the top of the right, for one
   sentence. Newspaper columns work for long continuous prose, not for a note.
   Reading order beats density — the text runs left to right across the page. */
.sb-foot{margin-top:var(--s6);line-height:1.7}
@media(max-width:720px){
 .sb-row{grid-template-columns:1fr auto;gap:6px}
 .sb-track{grid-column:1/-1} .sb-meta{grid-column:1/-1}
 .sb-rec{justify-content:flex-start}
 .sb-scale{display:none}}