/* gw2-markets */
:root[data-ui-g] .gw2-lede{font:500 var(--fs-read)/var(--lh-read) var(--font);color:var(--ink-2);margin:0 0 var(--sp-6);max-width:70ch}
/* the unit line under a vital-signs number (S-CARDS) — quieter than the band word above it */
:root[data-ui-g] .gw2-gloss{display:block;font:500 var(--fs-fine)/var(--lh-body) var(--font);color:var(--ink-3);margin-top:var(--sp-2)}
:root[data-ui-g] .gw2-gh{font:700 var(--fs-body)/var(--lh-tight) var(--font);letter-spacing:var(--ls-caps);text-transform:uppercase;
  color:var(--ink-3);margin:var(--sp-6) 0 var(--sp-4);display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--sp-3)}
:root[data-ui-g] .gw2-gh small{font:500 var(--fs-body)/var(--lh-body) var(--font);letter-spacing:0;text-transform:none;color:var(--ink-3)}
/* auto-FILL, not auto-fit: a collapsed empty track let a short group stretch its cards to fill
   the row, so the last group on the Markets landing measured 312px per card against 232px in the
   three groups above it. Keeping the empty track holds one rhythm down the page. */
:root[data-ui-g] .gw2-gg{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:var(--sp-3)}
:root[data-ui-g] .gw2-gc{display:block;background:var(--bg-1);border:1px solid var(--line);
  border-radius:var(--r-card);padding:var(--sp-4) var(--sp-5);text-decoration:none}
:root[data-ui-g] .gw2-gc:hover{border-color:var(--accent);background:var(--bg-2)}
:root[data-ui-g] .gw2-gc b{display:block;font:700 var(--fs-read)/var(--lh-body) var(--font);color:var(--ink)}
:root[data-ui-g] .gw2-gc span{display:block;font:500 var(--fs-body)/var(--lh-body) var(--font);color:var(--ink-3);margin-top:var(--sp-2)}
/* `.gw2-sub` (the duplicate pill row) was DELETED 2026-08-05 with its renderer — see GROUPS. */
/* `.gw2-seg` (the pill row that looked like the FREE|PRO plan toggle) was retired
   2026-08-05 — every control on this page now uses the shared `.g-ctl` family. */
/* settled-vs-provisional flow panel (D175) */
:root[data-ui-g] .gw2-fl-wrap{margin:0 0 var(--sp-5);max-width:100%;overflow-x:auto}
:root[data-ui-g] .gw2-fl{width:100%;border-collapse:collapse;font:500 var(--fs-body)/var(--lh-body) var(--font);margin:var(--sp-3) 0 var(--sp-3)}
:root[data-ui-g] .gw2-fl th,:root[data-ui-g] .gw2-fl td{padding:var(--sp-3) var(--sp-3);border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
:root[data-ui-g] .gw2-fl th.r,:root[data-ui-g] .gw2-fl td.r{text-align:right}
:root[data-ui-g] .gw2-fl thead th{color:var(--ink-3);font-weight:600;font-size:var(--fs-label);letter-spacing:var(--ls-caps)}
:root[data-ui-g] .gw2-fl-h td{background:var(--bg-2);border-bottom:1px solid var(--line-2)}
:root[data-ui-g] .gw2-fl-s{display:block;color:var(--ink-3);font:500 var(--fs-label)/var(--lh-body) var(--font);margin-top:var(--sp-1);white-space:normal}
:root[data-ui-g] .gw2-fl-n{display:block;color:var(--ink-3);font:500 var(--fs-fine)/var(--lh-body) var(--mono);margin-top:var(--sp-1)}
:root[data-ui-g] .gw2-fl-na{color:var(--ink-3);font-style:italic;cursor:help}
:root[data-ui-g] .gw2-fl-fence{border:1px solid var(--warn);border-radius:var(--r-card);padding:var(--sp-3) var(--sp-4);
  color:var(--ink);font:500 var(--fs-body)/var(--lh-body) var(--font);background:var(--bg-1)}
:root[data-ui-g] .gw2-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:var(--sp-3);margin:0 0 var(--sp-4)}
:root[data-ui-g] .gw2-tile{background:var(--bg-0);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--sp-4) var(--sp-4)}
:root[data-ui-g] .gw2-tile .n{font:800 var(--fs-display)/var(--lh-tight) var(--mono);font-variant-numeric:tabular-nums}
:root[data-ui-g] .gw2-tile .l{font-size:var(--fs-label);font-weight:700;margin-top:var(--sp-2);color:var(--ink)}
:root[data-ui-g] .gw2-tile .s{font-size:var(--fs-fine);color:var(--ink-3);margin-top:var(--sp-1);line-height:var(--lh-body)}
:root[data-ui-g] .gw2-scroll{max-height:340px;overflow-y:auto;overflow-x:auto;scrollbar-width:thin;
  scrollbar-color:var(--line-2) transparent;border:1px solid var(--line);border-radius:var(--r-card);background:var(--bg-0)}
:root[data-ui-g] .gw2-scroll.sm{max-height:220px}
:root[data-ui-g] .gw2-scroll.lg{max-height:440px}
/* §19: no vertical cap — the page scrolls instead. For a zone's PRIMARY table, a nested scroll
   box is worse than none: the wheel only works while the pointer is inside it, so a 13-row list
   in a 220px window reads as "the list doesn't scroll". Keeps overflow-x for narrow screens. */
:root[data-ui-g] .gw2-scroll.free{max-height:none;overflow-y:visible}
:root[data-ui-g] table.gw2-t{width:100%;border-collapse:collapse;font-size:var(--fs-body)}
:root[data-ui-g] table.gw2-t th{position:sticky;top:0;z-index:1;background:var(--bg-1);color:var(--ink-3);
  font:600 var(--fs-fine)/var(--lh-body) var(--font);letter-spacing:var(--ls-caps);text-transform:uppercase;text-align:right;padding:var(--sp-3) var(--sp-3);
  border-bottom:1px solid var(--line-2);white-space:nowrap}
:root[data-ui-g] table.gw2-t td{padding:var(--sp-2) var(--sp-3);text-align:right;border-bottom:1px solid var(--line);
  font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--ink-2)}
:root[data-ui-g] table.gw2-t th.l,:root[data-ui-g] table.gw2-t td.l{text-align:left}
:root[data-ui-g] table.gw2-t td.k{color:var(--ink);font-weight:700}
:root[data-ui-g] table.gw2-t tr:last-child td{border-bottom:0}
:root[data-ui-g] .gw2-pill{display:inline-block;font:700 var(--fs-fine)/var(--lh-body) var(--mono);padding:var(--sp-1) var(--sp-3);
  border-radius:var(--r-round);background:var(--bg-3);border:1px solid var(--line-2);color:var(--ink-2)}
:root[data-ui-g] .gw2-pill.up{color:var(--up);border-color:var(--up)}
:root[data-ui-g] .gw2-pill.dn{color:var(--down);border-color:var(--down)}
:root[data-ui-g] .gw2-pill.wn{color:var(--warn);border-color:var(--warn)}
/* 🔴 The F&O positioning label is NOT a value verdict. `up`/`dn` paint the estate's P&L contract —
   the same green a gain is drawn in — and the board's own fence says nothing on it "ranks, scores
   or implies a forward return". Green-for-long-buildup IS an implied forward return, drawn in the
   ink the reader has learned means money. These four are CATEGORIES on the price×OI sign pair, so
   they read as categories: one neutral chip, and the sign pair spelled out beside the name. */
:root[data-ui-g] .gw2-pill.q{color:var(--ink-2);border-color:var(--line-2)}
:root[data-ui-g] .gw2-qs{font:var(--fs-micro)/1 var(--mono);opacity:.6;margin-left:var(--sp-2);
  letter-spacing:var(--ls-caps)}
:root[data-ui-g] .up{color:var(--up)} :root[data-ui-g] .dn{color:var(--down)}
/* A cell rule sets colour on every td, and outranks the bare direction classes above, so
   up and down rendered the SAME GREY as a flat cell on four screens at once - measured
   62 of 97 rows on one of them, and a whole column named for the direction it could not
   show. The same class on a span always worked, which is why it went unnoticed. These two
   rules only restate the direction at cell strength; nothing existing is altered. */
:root[data-ui-g] table.gw2-t td.up{color:var(--up)}
:root[data-ui-g] table.gw2-t td.dn{color:var(--down)}
/* The chart-caption class is emitted by two of these pages, and its only rule lives in the
   infographics module, which they do not load - so it arrived with no styling on Flows and
   Events while working correctly on the F&O and open-interest screens. Same shape as the
   table stylesheet that never reached its own page. Declarations copied verbatim so the two
   places cannot drift. */
:root[data-ui-g] .rd-htr{margin:-4px 0 14px;font-size:var(--fs-body)}
:root[data-ui-g] .gw2-h3{font:700 var(--fs-read)/var(--lh-body) var(--font);margin:var(--sp-5) 0 var(--sp-3);color:var(--ink)}
:root[data-ui-g] .gw2-h3 small{font-weight:400;color:var(--ink-3);font-size:var(--fs-label);margin-left:var(--sp-3)}
:root[data-ui-g] .gw2-read{background:var(--bg-0);border:1px solid var(--line);border-left:3px solid var(--warn);
  border-radius:var(--r-card);padding:var(--sp-3) var(--sp-4);margin:var(--sp-4) 0 var(--sp-2);font-size:var(--fs-body);color:var(--ink-2);line-height:var(--lh-body)}
:root[data-ui-g] .gw2-read b{color:var(--ink)}
:root[data-ui-g] .gw2-chips{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin:var(--sp-3) 0}
/* A control row long enough to leave the column must FOLD, not be cut off. The shared control
   family is a single non-wrapping line, which is right for four choices; the session picker
   offers twenty, and measured 1133px inside a 918px column with its last four dates clipped
   away and no way to scroll to them. This modifier is opt-in, so every short control is
   untouched. */
:root[data-ui-g] .gw2-ctl-wrap{display:flex;max-width:100%}
:root[data-ui-g] .gw2-ctl-wrap .g-ctl-g{flex-wrap:wrap;min-width:0}
:root[data-ui-g] .gw2-chip{background:var(--bg-0);border:1px solid var(--line);border-radius:var(--r-card);
  padding:var(--sp-3) var(--sp-4);font-size:var(--fs-label);color:var(--ink-2);max-width:330px;line-height:var(--lh-body)}
:root[data-ui-g] .gw2-chip .h{display:block;font:700 var(--fs-micro)/var(--lh-tight) var(--mono);letter-spacing:var(--ls-caps);
  text-transform:uppercase;color:var(--accent);margin-bottom:var(--sp-2)}
:root[data-ui-g] .gw2-chip b{color:var(--ink)}
/* a chip that FILTERS has to look operable — and has to say what it will do before it is clicked */
:root[data-ui-g] .gw2-chip.sel{flex:1 1 300px;max-width:440px}
:root[data-ui-g] .gw2-chip.sel.on{border-color:var(--accent);
  background:color-mix(in srgb,var(--accent) 8%,var(--bg-0))}
:root[data-ui-g] .gw2-chip .h .n{float:right;opacity:.7;letter-spacing:0}
:root[data-ui-g] .gw2-chip a.cta{display:block;margin-top:var(--sp-2);color:var(--accent);
  font-size:var(--fs-micro);text-decoration:none}
:root[data-ui-g] .gw2-chip a.cta:hover{text-decoration:underline}
:root[data-ui-g] .gw2-chip a.cta:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
:root[data-ui-g] .gw2-clear{font-size:var(--fs-micro);font-weight:400;margin-left:var(--sp-2)}
:root[data-ui-g] .gw2-quiet{font-size:var(--fs-label);color:var(--ink-3);margin:var(--sp-2) 0 var(--sp-3)}
:root[data-ui-g] .gw2-lbl{font:600 var(--fs-fine)/var(--lh-body) var(--mono);letter-spacing:var(--ls-caps);text-transform:uppercase;
  color:var(--ink-3);margin:var(--sp-4) 0 var(--sp-2)}
:root[data-ui-g] .gw2-two{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-5)}
@media(min-width:900px){:root[data-ui-g] .gw2-two{grid-template-columns:repeat(2,minmax(0,1fr))}}
:root[data-ui-g] .gw2-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--sp-3);margin:0 0 var(--sp-4)}
:root[data-ui-g] .gw2-form label{display:block;font-size:var(--fs-label);color:var(--ink-3);margin-bottom:var(--sp-2)}
:root[data-ui-g] .gw2-form input{width:100%;background:var(--bg-0);border:1px solid var(--line-2);
  border-radius:var(--r-card);color:var(--ink);font:600 var(--fs-read) var(--mono);padding:var(--sp-3) var(--sp-3)}
:root[data-ui-g] .gw2-out{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--sp-3)}
:root[data-ui-g] .gw2-csv{font-size:var(--fs-label);color:var(--ink-3);margin:var(--sp-3) 0 0}
/* the per-year census bar of the corporate-actions archive — a density map, not a chart: it is
   how a reader picks WHERE to look in 22 years without paging. Dense by construction (18px
   columns), horizontally scrollable, and every bar prints its own number so the height is
   decoration on top of a value, never instead of one. */
:root[data-ui-g] .gw2-yrs{display:flex;gap:var(--sp-1);align-items:flex-end;height:64px;overflow-x:auto;
  padding:var(--sp-2) var(--sp-1) 0;border-bottom:1px solid var(--line);margin-bottom:var(--sp-3);scrollbar-width:thin}
:root[data-ui-g] .gw2-yr{flex:0 0 auto;width:26px;display:flex;flex-direction:column;
  align-items:center;justify-content:flex-end;height:100%}
:root[data-ui-g] .gw2-yr i{display:block;width:100%;background:var(--accent);opacity:.62;border-radius:var(--r-hair) var(--r-hair) 0 0}
:root[data-ui-g] .gw2-yr:hover i{opacity:1}
:root[data-ui-g] .gw2-yrn{font:600 var(--fs-micro)/1.2 var(--mono);color:var(--ink-3);order:-1;margin-bottom:var(--sp-1)}
:root[data-ui-g] .gw2-yry{font:600 var(--fs-micro)/var(--lh-body) var(--mono);color:var(--ink-3);margin-top:var(--sp-1)}
/* S-P4 additions */
:root[data-ui-g] .gw2-mut{font:600 var(--fs-fine)/var(--lh-body) var(--mono);color:var(--ink-3);text-transform:none}
:root[data-ui-g] .gw2-btn{background:var(--bg-2);border:1px solid var(--line-2);color:var(--ink);
  border-radius:var(--r-card);font:600 var(--fs-body) var(--mono);padding:var(--sp-3) var(--sp-5);cursor:pointer}
:root[data-ui-g] .gw2-bar{display:block;height:3px;background:var(--bg-3);border-radius:var(--r-hair);margin-top:var(--sp-2)}
:root[data-ui-g] .gw2-bar>i{display:block;height:100%;background:var(--accent);border-radius:var(--r-hair)}
:root[data-ui-g] .gw2-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--sp-4)}
:root[data-ui-g] .gw2-card{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--sp-4) var(--sp-4)}
:root[data-ui-g] .gw2-card-h{font:600 var(--fs-read)/var(--lh-body) var(--font);color:var(--ink);margin:var(--sp-1) 0 var(--sp-2)}
:root[data-ui-g] .gw2-card-t{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink-2);margin:0}
:root[data-ui-g] .gw2-calt{border-collapse:collapse;width:100%;margin-top:var(--sp-2)}
:root[data-ui-g] .gw2-calt td{vertical-align:top;padding:var(--sp-3) var(--sp-3);border:1px solid var(--line);
  min-width:104px;width:20%;background:color-mix(in srgb,var(--accent) calc(var(--load,0)*32%),transparent)}
:root[data-ui-g] .gw2-cal-d{font:600 var(--fs-fine) var(--mono);color:var(--ink-3)}
:root[data-ui-g] .gw2-cal-s{margin-top:var(--sp-2);line-height:var(--lh-read);font-size:var(--fs-label)}
/* the bipolar magnitude bar in the participants matrix (§3c) */
:root[data-ui-g] .gw2-bp{display:block;height:3px;background:var(--bg-3);border-radius:var(--r-hair);margin-top:var(--sp-2)}
:root[data-ui-g] .gw2-bp>i{display:block;height:100%;border-radius:var(--r-hair)}
:root[data-ui-g] .gw2-bp>i.up{background:var(--up)} :root[data-ui-g] .gw2-bp>i.dn{background:var(--down)}
/* percentile heat cells + the ramp legend (§3d). The VALUE is always printed; colour only ranks. */
:root[data-ui-g] .gw2-t td.gw2-heat{color:var(--ink);background:color-mix(in srgb,var(--accent) calc(var(--t,0)*60%),transparent)}
/* extremity in FORM as well as tint — the two tails are the read, and colour is the one channel
   a reader may not have. Border-inline-start, so it stays on the leading edge in either direction. */
:root[data-ui-g] .gw2-heat.hi{box-shadow:inset 2px 0 0 var(--accent)}
:root[data-ui-g] .gw2-heat.lo{box-shadow:inset 2px 0 0 var(--ink-3)}
/* the legend gradient carries the SAME gamma as the cells (stops at t=.25/.5/.75 shaped by
   t**0.65) — a legend on a different curve from the thing it explains is a second lie, not a key. */
:root[data-ui-g] .gw2-ramp{display:inline-block;width:64px;height:8px;border-radius:var(--r-hair);
  vertical-align:-1px;margin-right:var(--sp-2);
  background:linear-gradient(90deg,transparent,
    color-mix(in srgb,var(--accent) 24%,transparent) 25%,
    color-mix(in srgb,var(--accent) 38%,transparent) 50%,
    color-mix(in srgb,var(--accent) 50%,transparent) 75%,
    color-mix(in srgb,var(--accent) 60%,transparent))}
/* the buyback over-cap banner (§3h) */
:root[data-ui-g] .gw2-warn{background:color-mix(in srgb,var(--warn) 12%,transparent);
  border:1px solid var(--warn);border-radius:var(--r-card);padding:var(--sp-3) var(--sp-4);margin:0 0 var(--sp-4);
  font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink)}
:root[data-ui-g] .gw2-warn[hidden]{display:none}
:root[data-ui-g] .gw2-flag{color:var(--warn);font-size:var(--fs-label)}
/* the buyback sensitivity row matching the reader's own acceptance input */
:root[data-ui-g] #gw2-bb-sens tr.on td{background:var(--bg-2);font-weight:700;color:var(--ink)}
