/* ---- Broker Analytics family layer (design master tokens only) ----
   Ported from the page's old inline <style> block + the sig-pro shell
   classes this page actually uses (.sig-wrap/.sig-fresh/.sig-kicker/
   .sig-lede/.sig-foot), so sig-pro.css is no longer loaded here.
   Fixes vs the inline block: active-tab gradients no longer use the
   retired off-brand #D4F34A/#9BCB24 pair (now color-mix from --nd-lime,
   the sig-pro G1 pattern); pagers are kit classes, not inline styles. */

/* ---- Canvas pin (theme-scoped; beats theme.css [data-theme] body rules) ---- */
html[data-theme="dark"] body.nd[data-page="brokers"],
html[data-theme="light"] body.nd[data-page="brokers"],
html[data-nd-ed="dark"] body.nd[data-page="brokers"],
html[data-nd-ed="light"] body.nd[data-page="brokers"]{background:var(--nd-bg)}
body.nd[data-page="brokers"]{font-family:var(--nd-font-sans)}

/* ---- Shell (ported from sig-pro.css — only the classes this page uses) ---- */
.sig-wrap{max-width:1080px;margin:0 auto;padding:28px 20px 72px}
.sig-wrap h1{font-family:var(--nd-font-display,Georgia,serif);font-size:2.1rem;margin:0 0 8px;color:var(--nd-text,#fff);letter-spacing:-.01em}
.sig-kicker{color:var(--nd-dim,#8E98A8);font-size:.85rem;margin:0 0 6px;letter-spacing:.14em;text-transform:uppercase;font-weight:600}
.sig-lede{color:var(--nd-muted,#B8C0CE);max-width:660px;margin:0 0 6px;line-height:1.6}
.sig-lede strong{color:var(--nd-text,#fff)}
.sig-foot{color:var(--nd-dim,#8E98A8);font-size:.85rem;margin:36px 0 0;line-height:1.6}
.sig-fresh{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;color:var(--nd-muted,#B8C0CE);
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,0) 45%),var(--nd-panel,#12141A);
  border:1px solid var(--nd-border,#1E2430);border-radius:999px;padding:8px 16px;margin:14px 0 2px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),inset 0 -3px 6px rgba(0,0,0,.15),0 3px 10px rgba(0,0,0,.4)}
.sig-fresh .dot{width:8px;height:8px;border-radius:50%;background:var(--nd-lime,#B8E62E);flex:none;box-shadow:0 0 8px var(--nd-lime,#B8E62E)}

/* ---- Freshness line (checked time + next check + failure honesty) ---- */
.bk-fresh{font-family:var(--nd-font-mono);font-size:12.5px;color:var(--nd-dim,#8E98A8);margin:10px 0 18px;line-height:1.6}
.bk-fresh .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--nd-lime,#B8E62E);margin-right:6px;vertical-align:1px}
.bk-fresh.fail{color:var(--nd-down,#F87171)}
.bk-fresh.fail .dot{background:var(--nd-down,#F87171);box-shadow:none}
.bk-fresh .bk-new{color:var(--nd-lime,#B8E62E);font-weight:700}

/* ---- Provisional banner (delayed-state chip pair) ---- */
.bk-prov{background:var(--nd-chip-delayed-bg,rgba(184,230,46,.12));border:1px solid var(--nd-border,#1E2430);
  border-left:4px solid var(--nd-lime,#B8E62E);border-radius:16px;padding:14px 18px;margin:0 0 18px;
  font-size:.9rem;line-height:1.6;color:var(--nd-text,#fff)}
.bk-prov strong{color:var(--nd-lime,#B8E62E)}
[data-theme="light"] .bk-prov{background:rgba(77,124,15,.10);color:var(--nd-text)}
[data-theme="light"] .bk-prov strong{color:#3f6212} /* AA on the pale chip bg: axe measured #4d7c0f (var --nd-lime) at 4.11:1, want >=4.5:1; lime-800 computes 5.83:1 on the composited #e5ebe2 bg (PR #96 axe finding, 2026-10-29). Dark theme untouched (passes). */

/* ---- View tabs: dimensional pills, lime active ---- */
.bk-tabs{display:flex;gap:10px;margin:0 0 28px;flex-wrap:wrap}
.bk-tabs button{padding:10px 20px;color:var(--nd-muted,#B8C0CE);font:inherit;font-weight:600;font-size:.9rem;cursor:pointer;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0) 50%),var(--nd-panel,#12141A);
  border:1px solid var(--nd-border,#1E2430);border-radius:999px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 2px 5px rgba(0,0,0,.35);
  transition:border-color .15s,color .15s,transform .15s}
.bk-tabs button:hover:not(.active){border-color:var(--nd-lime,#B8E62E);color:var(--nd-text,#fff);transform:translateY(-1px)}
.bk-tabs button.active{color:var(--nd-on-lime,#0A0C10);font-weight:700;
  background:linear-gradient(180deg,color-mix(in srgb,var(--nd-lime,#B8E62E) 88%,white) 0%,var(--nd-lime,#B8E62E) 55%,color-mix(in srgb,var(--nd-lime,#B8E62E) 82%,black) 100%);
  border-color:color-mix(in srgb,var(--nd-lime,#B8E62E) 88%,white);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.5),inset 0 -3px 6px rgba(0,0,0,.18),0 2px 6px rgba(0,0,0,.5),0 6px 18px rgba(184,230,46,.35),0 0 24px rgba(184,230,46,.3)}
.bk-tabs button:focus-visible,.periods button:focus-visible,.ctl select:focus-visible,.ctl input:focus-visible,
.bk-sec select:focus-visible,.bk-pager button:focus-visible{outline:none;box-shadow:var(--nd-focus-ring)}

/* ---- Period pills: smaller variant ---- */
.periods{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 24px;align-items:center}
/* A11y 2026-10-29: the tablist wrapper is display:contents so the tab
   buttons (and the as-of picker between them) stay flex items of
   #periodBar in their original order; only the range controls + Apply
   moved out of the tablist, so the tablist owns tabs and nothing else. */
.periods .bk-tablist{display:contents}
.periods button{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0) 50%),var(--nd-panel,#12141A);
  color:var(--nd-muted,#B8C0CE);border:1px solid var(--nd-border,#1E2430);border-radius:999px;
  font:inherit;font-size:.8rem;font-weight:600;padding:7px 14px;cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 2px 5px rgba(0,0,0,.35);
  transition:border-color .15s,color .15s,transform .15s}
.periods button:hover:not(.active){border-color:var(--nd-lime,#B8E62E);color:var(--nd-text,#fff)}
.periods button.active{color:var(--nd-on-lime,#0A0C10);font-weight:700;
  background:linear-gradient(180deg,color-mix(in srgb,var(--nd-lime,#B8E62E) 88%,white) 0%,var(--nd-lime,#B8E62E) 55%,color-mix(in srgb,var(--nd-lime,#B8E62E) 82%,black) 100%);
  border-color:color-mix(in srgb,var(--nd-lime,#B8E62E) 88%,white);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.5),0 2px 6px rgba(0,0,0,.5),0 6px 18px rgba(184,230,46,.35)}
.periods input[type="date"]{border:1px solid var(--nd-border,#1E2430);border-radius:999px;padding:6px 12px;
  font:inherit;font-size:.82rem;background:var(--nd-panel,#12141A);color:var(--nd-text,#fff);color-scheme:light dark}
.periods .p-label{font-size:.85rem;color:var(--nd-dim,#8E98A8)}

/* ---- Tables ---- */
.bk-table{width:100%;border-collapse:separate;border-spacing:0;font-size:.85rem;
  background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0) 60px),var(--nd-panel,#12141A);
  border:1px solid var(--nd-border,#1E2430);border-radius:20px;overflow:hidden;color:var(--nd-text,#fff)}
.bk-table th,.bk-table td{padding:11px 13px;text-align:right;border-bottom:1px solid var(--nd-border,#1E2430);
  white-space:nowrap;font-variant-numeric:tabular-nums}
.bk-table th:first-child,.bk-table td:first-child,.bk-table th.bk-name,.bk-table td.bk-name{text-align:left}
.bk-table th{background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0)),var(--nd-panel-2,#161A23);
  font-weight:700;color:var(--nd-text,#fff);font-size:.76rem;letter-spacing:.07em;text-transform:uppercase;
  text-shadow:0 1px 2px rgba(0,0,0,.4);border-bottom:1px solid var(--nd-border-strong,#2A3342)}
.bk-table tr:last-child td{border-bottom:none}
.bk-table tbody tr{transition:background .12s}
.bk-table tbody tr:hover td{background:rgba(255,255,255,.025)}
.bk-table td strong{color:var(--nd-text,#fff)}
.bk-table th[data-sort]{cursor:pointer}
.bk-table th[data-sort]:hover{text-decoration:underline}
.bk-table th.sorted{color:var(--nd-text,#fff);text-shadow:0 1px 2px rgba(0,0,0,.4)}
.scrollx{overflow-x:auto}

/* ---- Stat cards ---- */
.stat-row{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:24px 0}
@media(min-width:760px){.stat-row{grid-template-columns:repeat(4,1fr)}}
.stat{background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0) 38%),var(--nd-panel,#12141A);
  border:1px solid var(--nd-border,#1E2430);border-radius:20px;padding:18px 20px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),inset 0 -2px 6px rgba(0,0,0,.15),0 3px 8px rgba(0,0,0,.45),0 18px 44px rgba(0,0,0,.4);
  transition:transform .2s ease,box-shadow .2s ease}
.stat:hover{transform:translateY(-2px)}
.stat .l{font-size:.78rem;color:var(--nd-dim,#8E98A8);margin-bottom:6px;font-weight:600}
.stat .v{font-family:var(--nd-font-display,Georgia,serif);font-size:1.5rem;font-weight:700;color:var(--nd-text,#fff);letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---- Info cover: lime-bordered note ---- */
.cover{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0) 45%),var(--nd-panel,#12141A);
  border:1px solid var(--nd-border,#1E2430);border-left:4px solid var(--nd-lime,#B8E62E);border-radius:16px;
  padding:17px 22px;margin:22px 0;font-size:.92rem;color:var(--nd-muted,#B8C0CE);line-height:1.65;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 3px 8px rgba(0,0,0,.4),0 14px 34px rgba(0,0,0,.3)}
.cover strong{color:var(--nd-text,#fff)}

/* ---- Controls ---- */
.ctl{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 18px;align-items:center}
.ctl select,.ctl input{border:1px solid var(--nd-border,#1E2430);border-radius:12px;padding:9px 14px;
  font:inherit;font-size:.9rem;background:var(--nd-inset,#0D0F14);color:var(--nd-text,#fff);max-width:100%}

/* ---- Static snapshot card ---- */
.snap{margin-bottom:20px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0) 38%),var(--nd-panel,#12141A);
  border:1px solid var(--nd-border,#1E2430);border-radius:20px;padding:22px 24px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),inset 0 -2px 6px rgba(0,0,0,.15),0 3px 8px rgba(0,0,0,.45),0 18px 44px rgba(0,0,0,.4)}
.snap h2{font-family:var(--nd-font-display,Georgia,serif);font-size:1.15rem;font-weight:700;margin:0 0 4px;color:var(--nd-text,#fff)}
.snap-asof{font-size:.78rem;font-weight:500;color:var(--nd-dim,#8E98A8)}
.snap-note{font-size:.82rem;color:var(--nd-muted,#B8C0CE);margin:12px 0 0;line-height:1.6}

/* ---- In-view section headings ---- */
h2.bk-h{font-family:var(--nd-font-display,Georgia,serif);font-size:1.35rem;margin:34px 0 8px;color:var(--nd-text,#fff);letter-spacing:-.01em;font-weight:700}
.two h2.bk-h{margin-top:4px}
.two{display:grid;gap:16px}
@media(min-width:900px){.two{grid-template-columns:1fr 1fr}}

/* ---- Pos/neg ---- */
.pos{color:var(--nd-up,#4ADE80);font-weight:700}
.neg{color:var(--nd-down,#F87171);font-weight:700}

/* ---- Kit pagers (quiet Prev, lime primary Next, Showing X–Y of Z) ---- */
.bk-pager{display:flex;gap:8px;align-items:center;justify-content:center;margin:12px 0;flex-wrap:wrap}
.bk-pager button{font:inherit;font-size:.85rem;font-weight:600;padding:8px 16px;border-radius:999px;cursor:pointer;
  background:var(--nd-panel,#12141A);color:var(--nd-muted,#B8C0CE);border:1px solid var(--nd-border,#1E2430)}
.bk-pager button:disabled{opacity:.45;cursor:default}
.bk-pager .bk-next{background:var(--nd-lime,#B8E62E);color:var(--nd-on-lime,#0A0C10);border-color:var(--nd-lime,#B8E62E)}
.bk-pager .bk-next:disabled{background:var(--nd-panel,#12141A);color:var(--nd-muted,#B8C0CE);border-color:var(--nd-border,#1E2430)}
.bk-showing{font-family:var(--nd-font-mono);font-size:.8rem;color:var(--nd-dim,#8E98A8)}

/* ---- Viz: concentration + net-flow bars (kit rank pattern) ---- */
.bk-viz{display:grid;gap:16px;margin:24px 0}
@media(min-width:900px){.bk-viz{grid-template-columns:1fr 1fr}}
.bk-viz-card{background:var(--nd-panel,#12141A);border:1px solid var(--nd-border,#1E2430);border-radius:20px;padding:20px 22px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 3px 8px rgba(0,0,0,.4)}
.bk-viz-card h3{font-family:var(--nd-font-display,Georgia,serif);font-size:1.05rem;margin:0 0 4px;color:var(--nd-text,#fff)}
.bk-viz-card .bk-cap{font-size:.8rem;color:var(--nd-dim,#8E98A8);margin:0 0 14px;line-height:1.5}
.bk-rank{display:grid;grid-template-columns:150px 1fr auto;gap:10px;align-items:center;margin:8px 0;font-size:.85rem}
.bk-rank .bk-rl{overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:var(--nd-text,#fff);font-weight:600;line-height:1.3}
.bk-rank .bk-track{display:block;height:10px;border-radius:999px;background:var(--nd-inset,#0D0F14);overflow:hidden}
.bk-rank .bk-fill{display:block;height:100%;width:var(--w,0%);background:var(--nd-lime,#B8E62E);border-radius:999px}
.bk-rank .bk-fill.neg{background:var(--nd-down,#F87171)}
.bk-rank .bk-rv{font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--nd-muted,#B8C0CE)}
.bk-totals{display:flex;flex-wrap:wrap;gap:10px 22px;margin:4px 0 0;font-size:.85rem;color:var(--nd-muted,#B8C0CE)}
.bk-totals b{color:var(--nd-text,#fff);font-variant-numeric:tabular-nums}

/* ---- Sector block (same pattern as news/actions) ---- */
.bk-sec{margin:34px 0 8px}
.bk-sec h2{font-family:var(--nd-font-display,Georgia,serif);font-size:1.35rem;margin:0 0 4px;color:var(--nd-text,#fff)}
.bk-sec p.bk-cap{font-size:.85rem;color:var(--nd-dim,#8E98A8);margin:0 0 14px;line-height:1.6}
.bk-sec select{width:100%;background:var(--nd-inset,#0D0F14);color:var(--nd-text,#fff);
  border:1px solid var(--nd-border,#1E2430);border-radius:12px;padding:12px 14px;
  font-size:15px;font-family:var(--nd-font-sans);margin-bottom:4px}
.bk-sec-sum{font-family:var(--nd-font-mono);font-size:13px;color:var(--nd-dim,#8E98A8);margin:10px 0 14px}
.bk-sec-note{font-size:13px;color:var(--nd-dim,#8E98A8);margin-top:14px;line-height:1.6}
.bk-sec .bk-mark{color:var(--nd-lime,#B8E62E);font-weight:700}

/* ---- Light theme ---- */
[data-theme="light"] .bk-tabs button,[data-theme="light"] .periods button{background:linear-gradient(180deg,var(--nd-panel) 0%,#EDF1F5 100%);
  border:1px solid #CBD4DE;border-top-color:#E8EEF3;color:#3F4753;
  box-shadow:inset 0 2px 0 var(--nd-white),0 1px 2px rgba(10,12,16,.1),0 4px 12px rgba(10,12,16,.08)}
[data-theme="light"] .bk-tabs button:hover:not(.active),[data-theme="light"] .periods button:hover:not(.active){border-color:var(--nd-lime);color:var(--nd-text)}
[data-theme="light"] .bk-tabs button.active,[data-theme="light"] .periods button.active{
  background:linear-gradient(180deg,color-mix(in srgb,var(--nd-lime) 76%,white) 0%,var(--nd-lime) 60%,color-mix(in srgb,var(--nd-lime) 84%,black) 100%);border-color:#3E650C;border-top-color:color-mix(in srgb,var(--nd-lime) 70%,white);color:var(--nd-on-lime);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.4),inset 0 -3px 6px rgba(0,0,0,.18),0 2px 4px rgba(77,124,15,.4),0 8px 20px rgba(77,124,15,.3)}
[data-theme="light"] .bk-table{background:var(--nd-panel);color:var(--nd-text)}
[data-theme="light"] .bk-table th{background:linear-gradient(180deg,var(--nd-panel),#F2F5F8);color:var(--nd-text);text-shadow:none}
[data-theme="light"] .bk-table th,[data-theme="light"] .bk-table td{border-bottom-color:var(--nd-border)}
[data-theme="light"] .bk-table td{color:#3F4753}
[data-theme="light"] .bk-table td strong{color:var(--nd-text)}
[data-theme="light"] .bk-table tbody tr:hover td{background:#F0F5EA}
[data-theme="light"] .bk-table th.sorted{color:var(--nd-text);text-shadow:none}
[data-theme="light"] .stat{background:linear-gradient(180deg,var(--nd-panel) 0%,#F2F5F8 100%);border:1px solid #CBD4DE;border-top-color:#E8EEF3;
  box-shadow:inset 0 2px 0 var(--nd-white),inset 0 -3px 8px rgba(10,12,16,.05),0 1px 2px rgba(10,12,16,.12),0 8px 24px rgba(10,12,16,.12)}
[data-theme="light"] .stat .l{color:#6B7280}
[data-theme="light"] .stat .v{color:var(--nd-text)}
[data-theme="light"] .cover{background:linear-gradient(180deg,var(--nd-panel) 0%,#F4F7FA 100%);border:1px solid #CBD4DE;border-left:4px solid var(--nd-lime);color:#3F4753;
  box-shadow:inset 0 2px 0 var(--nd-white),0 1px 2px rgba(10,12,16,.1),0 8px 24px rgba(10,12,16,.1)}
[data-theme="light"] .cover strong{color:var(--nd-text)}
[data-theme="light"] .snap{background:linear-gradient(180deg,var(--nd-panel) 0%,#F2F5F8 100%);border:1px solid #CBD4DE;border-top-color:#E8EEF3;
  box-shadow:inset 0 2px 0 var(--nd-white),0 1px 2px rgba(10,12,16,.1),0 8px 24px rgba(10,12,16,.1)}
[data-theme="light"] .snap h2{color:var(--nd-text)}
[data-theme="light"] .snap-asof,[data-theme="light"] .snap-note{color:#6B7280}
[data-theme="light"] .bk-viz-card{background:var(--nd-panel)}
[data-theme="light"] .bk-viz-card h3{color:var(--nd-text)}
[data-theme="light"] .bk-rank .bk-rl{color:var(--nd-text)}
[data-theme="light"] .bk-totals b{color:var(--nd-text)}
[data-theme="light"] .bk-pager button{background:var(--nd-panel);color:#3F4753;border-color:#CBD4DE}
[data-theme="light"] .bk-pager .bk-next{background:var(--nd-lime);color:var(--nd-on-lime);border-color:var(--nd-lime)}
[data-theme="light"] .bk-pager .bk-next:disabled{background:var(--nd-panel);color:var(--nd-dim);border-color:#CBD4DE}
[data-theme="light"] .sig-lede strong{color:var(--nd-text)}

/* ---- Small screens ---- */
@media(max-width:520px){.stat-row{grid-template-columns:1fr}.bk-rank{grid-template-columns:110px 1fr auto}}

/* ---- CLS reservations (2026-10-29) ---- */
/* Three late fills above the tab bars pushed tabs/periods/table down
   (measured local Lighthouse CLS ~0.04): the freshness badge
   (0 -> 42px in its filled .fb-live state; 28px unfilled, 30px while
   "Checking…", so 42 covers every state), the bkFresh line
   (0 -> 40px, two lines), and the snap heading, which wraps to two lines
   when labelSnapshot() appends the sessions-behind note (28 -> 56px).
   Floors, not fixed heights: longer content still grows. */
.sig-fresh{min-height:42px}
.bk-fresh{min-height:40px}
.snap h2{min-height:56px}