:root{
  --bg:#f3f5f9;--panel:#ffffff;--panel2:#f7f8fb;--grid:#e6e9f1;
  --amber:#b8720f;--amber-dim:#fbeed9;--green:#0e9f5f;--green-dim:#e3f7ec;
  --red:#d9313f;--red-dim:#fbe7e9;--cyan:#0b7c93;--violet:#6d4fd6;
  --text:#1a2233;--dim:#697086;--dimmer:#9aa1b3;
  --shadow:0 1px 2px rgba(16,24,40,.04),0 2px 8px rgba(16,24,40,.05);
  --radius:12px;--sbw:236px;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;
  --disp:'Oswald','IBM Plex Mono',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--bg);color:var(--text);font-family:var(--mono);font-size:12px;
  line-height:1.45;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:#d3d8e3;border-radius:5px}
::-webkit-scrollbar-thumb:hover{background:var(--amber)}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------- shell layout: sidebar + topbar + page content ---------- */
.app-shell{display:flex;min-height:100vh}
.sidebar{width:var(--sbw);flex:0 0 var(--sbw);background:var(--panel);
  border-right:1px solid var(--grid);display:flex;flex-direction:column;
  position:sticky;top:0;height:100vh;z-index:20}
.sidebar-brand{display:flex;align-items:center;gap:9px;padding:16px 18px 14px}
.brand-icon{width:28px;height:28px;border-radius:7px;flex:0 0 auto;box-shadow:0 2px 6px -2px rgba(20,25,40,.35)}
.sidebar-brand b{font-family:var(--disp);font-weight:600;letter-spacing:.03em;font-size:14px;color:var(--text);white-space:nowrap}
.sidebar-brand span{color:var(--dimmer);font-size:9.5px;letter-spacing:.12em;margin-left:-2px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--amber-dim);flex:0 0 auto}
.dot.ok{background:var(--green)}
.dot.err{background:var(--red)}
.dot.busy{background:var(--amber);animation:pulse 1.1s infinite}
@keyframes pulse{50%{opacity:.35}}
.sidebar-nav{display:flex;flex-direction:column;gap:2px;padding:10px 10px;flex:1}
.nav-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;
  color:var(--dim);font-size:12px;font-weight:500;letter-spacing:.01em}
.nav-item .nav-ic{width:16px;text-align:center;font-size:13px;color:var(--dimmer)}
.nav-item:hover{background:var(--panel2);color:var(--text)}
.nav-item.on{background:var(--amber-dim);color:var(--amber);font-weight:600}
.nav-item.on .nav-ic{color:var(--amber)}
.sidebar-foot{padding:14px 18px 18px;border-top:1px solid var(--grid)}
.sidebar-scrim{display:none}

.app-main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;align-items:center;gap:14px;padding:12px 22px;background:var(--panel);
  border-bottom:1px solid var(--grid);position:sticky;top:0;z-index:15;flex-wrap:wrap}
.hamburger{display:none}
.topbar-pills{display:flex;gap:8px;flex-wrap:wrap}
.topbar-right{display:flex;align-items:center;gap:12px;margin-left:auto;flex-wrap:wrap}
.page-content{flex:1;padding:22px;min-width:0}
@media(max-width:1080px){.page-content{padding:16px}}

/* ---------- buttons / inputs / pills (light) ---------- */
button{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;cursor:pointer;
  background:var(--panel);color:var(--text);border:1px solid var(--grid);border-radius:8px;
  padding:7px 12px;transition:.12s}
button:hover{border-color:var(--amber);color:var(--amber)}
button:focus-visible{outline:2px solid var(--cyan);outline-offset:1px}
button.on{background:var(--amber);color:#fff;border-color:var(--amber);font-weight:600}
select,input[type=text]{font-family:var(--mono);font-size:11px;background:var(--panel2);
  color:var(--text);border:1px solid var(--grid);border-radius:8px;padding:6px 9px}
select:focus,input:focus{outline:none;border-color:var(--amber)}
input[type=range]{accent-color:var(--amber);width:100px}
.pill{font-size:9.5px;letter-spacing:.08em;padding:4px 9px;border:1px solid var(--grid);
  color:var(--dim);border-radius:20px;background:var(--panel2);white-space:nowrap}
.pill.live{color:var(--green);border-color:var(--green);background:var(--green-dim)}
.pill.warn{color:var(--amber);border-color:var(--amber);background:var(--amber-dim)}

/* ---------- cards ---------- */
.card{background:var(--panel);border:1px solid var(--grid);border-radius:var(--radius);
  box-shadow:var(--shadow);margin-bottom:16px}
.card-pad{padding:16px 18px}

/* ---------- cmd / filter bar ---------- */
.cmd{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.cmd .seg{display:flex;align-items:center;gap:7px}
.cmd label{color:var(--dimmer);font-size:9.5px;letter-spacing:.1em}
.mobile-only{display:none}
.cmd-extra{display:contents}

/* ---------- table ---------- */
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
thead th{position:sticky;top:0;z-index:5;background:var(--panel);color:var(--dimmer);font-weight:600;
  font-size:9.5px;letter-spacing:.08em;text-align:right;padding:9px 8px;border-bottom:1px solid var(--grid);
  cursor:pointer;white-space:nowrap}
thead th:hover{color:var(--amber)}
thead th.l{text-align:left}
thead th.sorted{color:var(--amber)}
tbody td{padding:8px;border-bottom:1px solid var(--grid);text-align:right;white-space:nowrap;font-size:11.5px}
tbody td.l{text-align:left}
tbody tr{cursor:pointer}
tbody tr:hover{background:var(--panel2)}
tbody tr.sel{background:var(--amber-dim)}
.rk{color:var(--dimmer);font-size:10px}
.sym{font-weight:700;color:var(--amber);letter-spacing:.03em}
.nm{color:var(--dim);font-size:10.5px}
.up{color:var(--green)}.dn{color:var(--red)}.na{color:var(--dimmer)}

.scorecell{display:flex;align-items:center;gap:7px;justify-content:flex-end}
.sbar{width:52px;height:7px;background:var(--grid);border-radius:4px;position:relative;overflow:hidden}
.sbar i{position:absolute;left:0;top:0;bottom:0;display:block;border-radius:4px}
.sval{width:26px;text-align:right;font-weight:600}

.rsibar{width:52px;height:7px;border-radius:4px;position:relative;overflow:visible;
  background:linear-gradient(to right,var(--green-dim) 0%,var(--green-dim) 30%,var(--grid) 30%,var(--grid) 70%,var(--red-dim) 70%,var(--red-dim) 100%)}
.rsibar i{position:absolute;top:-2px;width:2px;height:11px;border-radius:1px;transform:translateX(-1px)}
.rsi-gauge{margin:8px 0 2px}
.rsi-track{position:relative;height:8px;border-radius:4px;
  background:linear-gradient(to right,var(--green-dim) 0%,var(--green-dim) 30%,var(--grid) 30%,var(--grid) 70%,var(--red-dim) 70%,var(--red-dim) 100%)}
.rsi-marker{position:absolute;top:-3px;width:2px;height:14px;background:var(--text);border-radius:1px;transform:translateX(-1px)}
.rsi-scale{display:flex;justify-content:space-between;font-size:9px;letter-spacing:.03em;color:var(--dimmer);margin-top:5px}

.rt{font-size:9.5px;letter-spacing:.05em;padding:3px 8px;font-weight:600;display:inline-block;
  min-width:74px;text-align:center;border-radius:6px}
.rt.sb{background:var(--green);color:#fff}
.rt.b{background:var(--green-dim);color:var(--green)}
.rt.h{background:var(--panel2);color:var(--dim);border:1px solid var(--grid)}
.rt.r{background:var(--red-dim);color:var(--red)}
.rt.a{background:var(--red);color:#fff}
.gates{display:inline-flex;gap:3px;vertical-align:middle}
.led{width:9px;height:9px;border-radius:3px;border:1px solid var(--grid);display:inline-block}
.led.pass{background:var(--green);border-color:var(--green)}
.led.fail{background:var(--red);border-color:var(--red)}
.led.unk{background:var(--grid)}

.sh{padding:12px 16px;border-bottom:1px solid var(--grid);font-family:var(--disp);
  letter-spacing:.1em;font-size:11px;color:var(--amber);font-weight:600;background:var(--panel2);
  border-radius:var(--radius) var(--radius) 0 0}
.sb2{padding:14px 16px;border-bottom:1px solid var(--grid)}
.sb2:last-child{border-bottom:none;border-radius:0 0 var(--radius) var(--radius)}
.kv{display:flex;justify-content:space-between;gap:10px;padding:3px 0;font-size:11px}
.kv span{color:var(--dim)}.kv b{font-weight:600}
.stack{display:flex;height:22px;margin:10px 0 4px;border-radius:6px;overflow:hidden;border:1px solid var(--grid)}
.stack div{position:relative}
.stack div span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:9px;color:#fff;font-weight:700}
.legend{display:flex;flex-wrap:wrap;gap:9px;font-size:9px;color:var(--dim)}
.legend i{display:inline-block;width:8px;height:8px;margin-right:4px;vertical-align:-1px;border-radius:2px}
.big{font-family:var(--disp);font-size:30px;font-weight:600;line-height:1}
.spark{width:100%;height:44px;display:block}
.spark-fc{height:56px}
.note{font-size:10px;color:var(--dimmer);line-height:1.55}

.log{border-top:1px solid var(--grid);height:70px;overflow:auto;padding:6px 12px}
.log div{font-size:10px;color:var(--dimmer);white-space:nowrap}
.log div b{color:var(--dim);font-weight:600}
.log div.ok b{color:var(--green)}.log div.error b{color:var(--red)}.log div.warn b{color:var(--amber)}
.empty{padding:52px 24px;text-align:center;color:var(--dimmer);font-size:12px;line-height:2}
.empty b{color:var(--amber);display:block;font-family:var(--disp);letter-spacing:.14em;font-size:15px;margin-bottom:8px}
.empty code{color:var(--cyan);background:var(--panel2);padding:2px 7px;border-radius:4px}

/* ---------- reference tables (legend page) ---------- */
.ref-sec{margin-top:22px}
.ref-sec h4{font-family:var(--disp);letter-spacing:.1em;font-size:12px;color:var(--cyan);
  font-weight:600;margin-bottom:9px;padding-top:16px;border-top:1px solid var(--grid)}
.ref-sec:first-child h4{border-top:none;padding-top:0}
.ref-sec p{color:var(--dim);font-size:11.5px;line-height:1.7;margin-bottom:10px}
.ref-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:6px}
.ref-table th{text-align:left;font-size:9px;letter-spacing:.08em;color:var(--dimmer);
  padding:6px 8px;border-bottom:1px solid var(--grid);overflow-wrap:break-word;white-space:normal}
.ref-table th:nth-child(1){width:17%}.ref-table th:nth-child(2){width:21%}
.ref-table td{font-size:11px;padding:7px 8px;border-bottom:1px solid var(--grid);vertical-align:top;
  text-align:left;white-space:normal;overflow-wrap:break-word;word-break:break-word}
.ref-table td.k{color:var(--text);font-weight:700}
.ref-table td.v{color:var(--dim)}
.ref-table tr:hover td{background:var(--panel2)}
.rtag{display:inline-block;font-size:9px;letter-spacing:.05em;padding:2px 7px;font-weight:600;
  white-space:nowrap;border-radius:5px}
.rtag.sb{background:var(--green);color:#fff}.rtag.b{background:var(--green-dim);color:var(--green)}
.rtag.h{background:var(--panel2);color:var(--dim);border:1px solid var(--grid)}
.rtag.r{background:var(--red-dim);color:var(--red)}
.rtag.a{background:var(--red);color:#fff}
.ref-note{font-size:10.5px;color:var(--dim);line-height:1.6;margin-top:14px;padding:12px 14px;
  border:1px solid var(--grid);background:var(--panel2);border-radius:9px}

/* ---------- congress/gov trades table (wide, scrolls horizontally) ---------- */
.gov-wrap{overflow-x:auto;border:1px solid var(--grid);border-radius:9px}
.gov-table{width:100%;border-collapse:collapse;font-size:11px}
.gov-table th{text-align:left;font-size:9px;letter-spacing:.08em;color:var(--dimmer);
  padding:7px 10px;border-bottom:1px solid var(--grid);white-space:nowrap;background:var(--panel2);
  position:sticky;top:0}
.gov-table td{padding:7px 10px;border-bottom:1px solid var(--grid);white-space:nowrap;vertical-align:top}
.gov-table td b{color:var(--text);font-weight:700}
.gov-table td .nm{color:var(--dimmer);font-size:10px}
.gov-table tr:hover td{background:var(--panel2)}
.party{display:inline-block;font-size:9px;font-weight:700;letter-spacing:.02em;padding:2px 6px;
  border-radius:4px;vertical-align:1px}
.party.d{background:#e3f0ff;color:#1671c9}
.party.r{background:var(--red-dim);color:var(--red)}
.party.i{background:#efe9ff;color:var(--violet)}
.party.q{background:var(--panel2);color:var(--dimmer)}
.cong-filters{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin:12px 0 16px;
  padding:12px;border:1px solid var(--grid);background:var(--panel2);border-radius:10px}
.cong-filters input,.cong-filters select{font-family:var(--mono);font-size:11px;background:var(--panel);
  color:var(--text);border:1px solid var(--grid);padding:6px 9px;border-radius:8px}
.cong-filters label{color:var(--dimmer);font-size:9.5px;letter-spacing:.09em;margin-right:4px}
.cong-stats{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:6px}
.cong-stats div{font-size:10px;color:var(--dimmer)}
.cong-stats b{color:var(--amber);font-size:14px;font-family:var(--disp)}
/* Pill-shaped tab buttons — same light-tint-badge language as .pill/.nav-item.on elsewhere
   in the app. Both rules below explicitly set background/color/border/font-weight on a
   two-class selector (.cong-tab.on, .pred-tab.on) so they reliably out-specificity the
   generic button.on{background:var(--amber);color:#fff} rule (element+class, one class
   lower) instead of losing just the background half of the fight to it — that half-loss
   is what previously rendered the active tab as an unreadable solid-amber block (amber
   text from the two-class rule sitting on an amber fill from the generic one-class rule). */
.cong-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 16px;padding-bottom:12px;border-bottom:1px solid var(--grid)}
.cong-tab{background:var(--panel2);border:1px solid var(--grid);border-radius:20px;
  padding:7px 14px;color:var(--dim);font-size:10.5px;letter-spacing:.08em}
.cong-tab:hover{border-color:var(--amber);color:var(--amber)}
.cong-tab.on{background:var(--amber-dim);color:var(--amber);border-color:var(--amber);font-weight:600}
.pred-tabs{display:flex;gap:8px;flex-wrap:wrap;padding:10px 12px 12px}
.pred-tab{background:var(--panel2);border:1px solid var(--grid);border-radius:20px;
  padding:7px 14px;color:var(--dim);font-size:10.5px;letter-spacing:.08em}
.pred-tab:hover{border-color:var(--amber);color:var(--amber)}
.pred-tab.on{background:var(--amber-dim);color:var(--amber);border-color:var(--amber);font-weight:600}
.pred-pane{padding:0}
.calc-presets{display:flex;flex-wrap:wrap;gap:6px}
.calc-pill{padding:6px 10px}
#calc-amount,#calc-date{font-family:var(--mono);font-size:11px;background:var(--panel);
  color:var(--text);border:1px solid var(--grid);padding:6px 9px;border-radius:8px}
.cc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.cc-card{border:1px solid var(--grid);background:var(--panel);padding:14px;display:flex;
  flex-direction:column;gap:9px;border-radius:10px;box-shadow:var(--shadow)}
.cc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.cc-sym{color:var(--amber);font-weight:700;font-size:15px;letter-spacing:.02em;cursor:pointer}
.cc-sym:hover{text-decoration:underline}
.cc-name{color:var(--dim);font-size:10px;margin-top:1px}
.cc-bar{height:6px;background:var(--grid);display:flex;overflow:hidden;border-radius:4px}
.cc-bar div.b{background:var(--green)}.cc-bar div.s{background:var(--red)}
.cc-meta{font-size:10px;color:var(--dimmer);display:flex;justify-content:space-between}
.cc-people{font-size:10px;color:var(--dim);line-height:1.6}
.cc-news a{display:block;color:var(--text);text-decoration:none;font-size:10.5px;line-height:1.5;
  padding:5px 0;border-top:1px solid var(--grid)}
.cc-news a:hover{color:var(--cyan)}
.cc-untracked{font-size:9.5px;color:var(--dimmer);border:1px dashed var(--grid);padding:2px 6px;
  display:inline-block;width:fit-content;border-radius:5px}
.pc-wrap{overflow-x:auto;border:1px solid var(--grid);border-radius:9px}
.pc-table{width:100%;border-collapse:collapse;font-size:11px}
.pc-table th{text-align:left;font-size:9px;letter-spacing:.08em;color:var(--dimmer);
  padding:8px 10px;border-bottom:1px solid var(--grid);white-space:nowrap;background:var(--panel2);
  position:sticky;top:0}
.pc-table td{padding:8px 10px;border-bottom:1px solid var(--grid);white-space:nowrap}
.pc-table tr{cursor:pointer}
.pc-table tr:hover td{background:var(--panel2)}
.pc-table td b{color:var(--text);font-weight:700}
.pc-bar{width:60px;height:6px;background:var(--grid);display:inline-flex;overflow:hidden;
  border-radius:4px;vertical-align:middle;margin-right:6px}
.pc-bar div.b{background:var(--green)}.pc-bar div.s{background:var(--red)}

/* ---------- company page 2-col layout ---------- */
.company-head{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.company-head h1{font-family:var(--disp);font-size:20px;font-weight:600;letter-spacing:.02em}
.company-head .back{color:var(--dim);font-size:11px;display:inline-flex;align-items:center;gap:5px;margin-bottom:8px}
.company-head .back:hover{color:var(--amber)}
.company-cols{display:grid;grid-template-columns:2fr 1fr;gap:16px;align-items:start;min-width:0}
.company-cols>div{min-width:0}
@media(max-width:980px){.company-cols{grid-template-columns:1fr}}
.card{min-width:0}

/* ---------- mobile ---------- */
@media(max-width:900px){
  .hamburger{display:block;background:none;border:none;font-size:18px;color:var(--text);padding:4px 8px}
  .sidebar{position:fixed;left:0;top:0;bottom:0;transform:translateX(-100%);
    transition:transform .2s ease;box-shadow:0 0 30px rgba(0,0,0,.15)}
  .sidebar.open{transform:translateX(0)}
  .sidebar-scrim{display:none;position:fixed;inset:0;background:rgba(15,20,30,.35);z-index:19}
  .sidebar-scrim.show{display:block}
  .topbar{padding:10px 14px}
}
@media(max-width:760px){
  .mobile-only{display:inline-block;margin:6px 0}
  .cmd{position:relative}
  .cmd-extra{display:none;width:100%;flex-wrap:wrap;gap:10px}
  .cmd-extra.show{display:flex}
  select,input[type=text]{width:100%;padding:9px 8px;font-size:13px}
  input[type=range]{width:100%}
  .mh{display:none!important}
  tbody td{padding:9px 8px;font-size:12.5px}
  thead th{padding:9px 8px;font-size:9px}
  .sym{font-size:12.5px}
  .nm{font-size:9.5px}
  .log{display:none}
}