/* web.css: the public view as an app-style dashboard. Same brand as the TV (tv.css).
   Phone (< 760px): bottom tab bar, one screen at a time, DASH fits one screen. Text >= 15px; uppercase condensed labels >= 13px.
   Tablet: stacked dashboard (may scroll a little). Desktop (>= 1000 x 600): a TV-style main board that fits the viewport;
   everything is in rem and the root size scales with the window, so the board just gets bigger on big screens. */
:root{
  --bg:#060f2a; --panel:#0e1c44; --panel2:#132759; --line:#26407f; --ink:#fff; --mute:#a9b8d8; --dim:#7385ad;
  --cyan:#9fe3f0; --blue:#0a58e8; --vivid:#1f6bff; --sky:#8fc0ff; --pale:#dbe8fb; --navy:#101f42; --deep:#050d24;
  --orange:#e2540c; --orange2:#ff7a2e; --gold:#e8a900; --gold2:#ffc933; --red:#d6272d; --grey:#6b7686;
  --cond:"Avenir Next Condensed","Roboto Condensed","Arial Narrow",sans-serif; --sans:"Avenir Next","Helvetica Neue",Roboto,Arial,sans-serif;
  --gap:.5rem; --pad:.625rem; --r:14px;
  --hdrH:52px; --tabH:58px; --safeB:env(safe-area-inset-bottom,0px);
  --vh:100vh;
}
@supports (height:100dvh){:root{--vh:100dvh}}
*{box-sizing:border-box}
html{font-size:16px;background:var(--bg);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;min-height:var(--vh);font:500 1.0625rem/1.4 var(--sans);color:var(--ink);overflow-x:hidden;
  padding-bottom:calc(var(--tabH) + var(--safeB));
  background:radial-gradient(1200px 600px at 20% -10%,#12286a 0%,transparent 70%),radial-gradient(900px 600px at 110% 40%,#0b1d55 0%,transparent 70%),var(--bg);
  background-attachment:fixed;-webkit-tap-highlight-color:transparent}
a{color:var(--sky)}
h1,h2,h3,p{margin:0}
button{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;text-align:inherit;cursor:pointer;-webkit-appearance:none;appearance:none}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--gold2);outline-offset:2px;border-radius:6px}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--gold2);color:#3a2400;padding:10px 14px;font:800 1.125rem/1 var(--cond);text-transform:uppercase}
.skip:focus{left:8px;top:8px}
.kick,.k{font:800 .8125rem/1.1 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--cyan)}
.led{font:800 1em/1 var(--cond);font-variant-numeric:tabular-nums;color:#fff;text-shadow:0 0 14px rgba(90,160,255,.6),0 0 2px rgba(255,255,255,.6)}
.bdg{display:block;flex:none;width:2.25rem;height:2.25rem}
.bdg.nb{border-radius:50%;border:2px dashed #2b437c;width:2rem;height:2rem;margin:.125rem}
.expl{font:500 .9375rem/1.4 var(--sans);color:#cfdaf2;margin-top:.5rem}
.bad{color:var(--orange2)}
.up{color:#8fc0ff}.dn{color:#ff7a2e}.flat{color:#a9b8d8}
.card{background:linear-gradient(180deg,var(--panel2),var(--panel));border:2px solid var(--line);border-radius:var(--r);padding:var(--pad);min-width:0;
  position:relative;box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 8px 24px rgba(0,0,0,.28)}
.none{color:var(--mute);padding:0 .25rem}

/* ================= header ================= */
#hdr{position:sticky;top:0;z-index:50;background:rgba(6,15,42,.94);border-bottom:2px solid var(--line);padding-top:env(safe-area-inset-top)}
@supports (backdrop-filter:blur(4px)) or (-webkit-backdrop-filter:blur(4px)){#hdr{background:rgba(6,15,42,.86);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}}
.hin{max-width:1900px;margin:0 auto;display:flex;align-items:center;gap:.625rem;padding:.375rem .75rem;min-height:3rem}
.brand{flex:1 1 auto;display:flex;align-items:center;gap:.5rem;min-width:0;color:#fff;text-decoration:none}
.logo{width:2rem;height:2rem;flex:none;animation:spin 60s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.mark{font:800 1.0625rem/.98 var(--cond);text-transform:uppercase;letter-spacing:.005em;padding-top:2px;min-width:0;max-width:11.5rem;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.mark i{color:#4d8dff;padding-right:.06em}
.dnav{display:none}
.hmeta{display:flex;align-items:center;gap:.625rem;flex:none}
.clock{display:flex;flex-direction:column;align-items:flex-end;white-space:nowrap;line-height:1}
.clock .ck{font:800 .8125rem/1 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--mute);margin-bottom:3px}
.clock.sim .ck{color:var(--gold2)}
.clock b{font:800 1.25rem/1 var(--cond);font-variant-numeric:tabular-nums}
.tag{font:800 .8125rem/1 var(--cond);letter-spacing:.1em;text-transform:uppercase;padding:.3rem .5rem .25rem;border-radius:6px;white-space:nowrap;display:none}
.tag.clk{background:var(--gold2);color:#3a2400}
.tag.clk{display:none!important} /* the clock's gold SIM TIME label says it; keeps the header from overflowing */
.tag.sim{background:var(--orange2);color:#1a0701}
.tvl{display:inline-flex;align-items:center;gap:.3rem;flex:none;font:800 .8125rem/1 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:#fff;text-decoration:none;
  background:#13285e;border:2px solid #4f6fb5;border-radius:8px;padding:.3rem .45rem .25rem;white-space:nowrap;touch-action:manipulation}
.tvl:hover,.tvl:focus-visible{background:var(--vivid);border-color:#9cc4ff}
.tvl .tvi{width:1.05rem;height:1.05rem;flex:none;margin-top:-2px}
.tvx{display:none}
@media (max-width:389px){
  .hin{gap:.5rem;padding:.375rem .625rem}
  .mark{font-size:.9375rem}
  .conn.on b{display:none}
}
.conn{display:inline-flex;align-items:center;gap:.375rem;font:800 .8125rem/1 var(--cond);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;
  padding:.3rem 0 .25rem;border-radius:999px;border:2px solid transparent;color:#3ddc84}
.conn .dot{width:.6rem;height:.6rem;border-radius:50%;background:#3ddc84;box-shadow:0 0 0 0 rgba(61,220,132,.7);animation:live 2s ease-out infinite}
.conn.off{background:var(--red);border-color:#ff8a8f;color:#fff;padding:.3rem .55rem .25rem;animation:pblink 1.6s ease-in-out infinite}
.conn.off .dot{background:#fff;animation:none}
@keyframes live{0%{box-shadow:0 0 0 0 rgba(61,220,132,.7)}100%{box-shadow:0 0 0 9px rgba(61,220,132,0)}}
@keyframes pblink{50%{opacity:.55}}
html.offline .clock{display:none}
.simbar{background:repeating-linear-gradient(-45deg,#ff7a2e 0 14px,#f06a1e 14px 28px);color:#1a0701;text-align:center;padding:.25rem .75rem .2rem;
  font:800 .8125rem/1.15 var(--cond);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ================= bottom tab bar (phones) ================= */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));
  background:rgba(5,12,34,.97);border-top:2px solid var(--line);padding:0 max(env(safe-area-inset-left),4px) var(--safeB) max(env(safe-area-inset-right),4px);
  box-shadow:0 -8px 24px rgba(0,0,0,.35)}
.tb{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:var(--tabH);padding:.375rem 0 .4rem;
  text-decoration:none;color:var(--mute);min-width:0;touch-action:manipulation}
.tb .tv{font:800 1.1875rem/1 var(--cond);font-variant-numeric:tabular-nums;color:#c6d2ec;white-space:nowrap;min-height:1.1875rem}
.tb .tn{font:800 .8125rem/1 var(--cond);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.tb.on{color:#fff}
.tb.on .tv{color:#fff;text-shadow:0 0 12px rgba(90,160,255,.8)}
.tb.on::before{content:"";position:absolute;top:-2px;left:18%;right:18%;height:4px;border-radius:0 0 4px 4px;background:var(--vivid);box-shadow:0 0 12px rgba(31,107,255,.9)}

/* ================= screens ================= */
main{max-width:1900px;margin:0 auto;padding:.625rem}
.scr{min-width:0}

/* ---------------- DASH (phone first) ---------------- */
.dgrid{display:flex;flex-direction:column;gap:var(--gap);
  min-height:calc(var(--vh) - var(--hdrH) - var(--tabH) - var(--safeB) - 1.25rem)}
.vpanel{padding:.625rem .75rem .75rem;overflow:hidden;container-type:inline-size;flex:none}
.vpanel::after{content:"";position:absolute;left:0;right:0;bottom:0;height:60%;pointer-events:none;opacity:.1;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 150' preserveAspectRatio='none'%3E%3Cpath d='M0 70 C120 20 220 120 340 70 S560 20 680 70 S900 120 1000 60 V150 H0Z' fill='%231f6bff'/%3E%3C/svg%3E") bottom/100% 100% no-repeat}
.vpanel>*{position:relative;z-index:1}
.vtxt{font:800 clamp(2.5rem,9.5vh,6rem)/.95 var(--cond);text-transform:uppercase;white-space:nowrap;letter-spacing:-.01em;margin:.2rem 0 .3rem;padding-top:.04em;
  background:linear-gradient(180deg,#fff 0%,#fff 55%,#bcd6ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 3px 0 rgba(10,88,232,.55))}
.vtxt.ffs{background-image:linear-gradient(180deg,#fff 0%,#ffd2b8 100%);filter:drop-shadow(0 3px 0 rgba(226,84,12,.6))}
.vtxt.tsu{background-image:linear-gradient(180deg,#fff3c4 0%,#ffc933 100%);filter:drop-shadow(0 3px 0 rgba(120,80,0,.6))}
.vtxt.hold{background-image:linear-gradient(180deg,#fff 0%,#dbe8fb 100%);filter:drop-shadow(0 3px 0 rgba(60,90,160,.6))}
.vlev{display:flex;align-items:center;gap:.5rem;min-width:0}
.vlev .bdg{width:1.875rem;height:1.875rem}
.vlev b{font:800 1.0625rem/1 var(--cond);letter-spacing:.05em;color:var(--sky);text-transform:uppercase;white-space:nowrap;flex:none;padding-top:2px}
.vlev .ln{font:600 .9375rem/1.2 var(--sans);color:#dfe8fb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.vlev .ovr{font:800 .8125rem/1 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:#3a2400;background:var(--gold2);padding:.3rem .5rem .25rem;border-radius:6px;white-space:nowrap}
/* wave points + meter */
.mrow{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.625rem;align-items:start;margin-top:.625rem}
.wp{display:flex;align-items:center;gap:.5rem;background:linear-gradient(180deg,#0a58e8,#0a3cab);border:2px solid #7fb3ff;border-radius:10px;padding:.3rem .5rem .3rem .55rem;height:3.0rem}
.wp .k{color:#fff;font-size:.8125rem;line-height:1.02;letter-spacing:.06em}
.wp .led{font-size:2rem}
.meter{min-width:0;padding-top:.25rem}
.mbar{position:relative;height:1.5rem}
.mseg{position:absolute;top:0;bottom:0;display:flex;align-items:center;justify-content:center;border-left:2px solid var(--panel);overflow:hidden;opacity:.5;transition:opacity .8s}
.mseg:first-child{border-left:0;border-radius:7px 0 0 7px}
.mseg:nth-child(5){border-radius:0 7px 7px 0}
.mseg span{font:800 .8125rem/1 var(--cond);letter-spacing:.01em;text-transform:uppercase;white-space:nowrap;padding-top:2px}
.mseg.ffs{background:#e2540c;color:#fff}.mseg.welp{background:#6b7686;color:#fff}.mseg.good{background:#8fc0ff;color:#0d1b3d}
.mseg.yeah{background:#1f6bff;color:#fff}.mseg.tsu{background:#e8a900;color:#2a1a00}
.mseg.on{opacity:1;box-shadow:0 0 0 2px #fff inset,0 0 16px rgba(120,180,255,.6);z-index:1}
.mpin{position:absolute;top:-5px;bottom:-5px;width:0;z-index:2;transition:left 1.6s cubic-bezier(.3,1.3,.4,1)}
.mpin i{position:absolute;left:-2px;top:0;bottom:0;width:4px;border-radius:2px;background:#fff;box-shadow:0 0 8px rgba(255,255,255,.9),0 0 0 1px rgba(5,13,36,.6)}
.mpin b{display:none}
.mseg span{display:none}
.mticks{position:relative;height:1.05rem;margin-top:.3rem}
.mticks span{position:absolute;top:0;transform:translateX(-50%);font:800 .8125rem/1 var(--cond);color:var(--mute)}
.mcap{display:none}
.cells{display:none}
/* the three tiles */
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);flex:1 1 auto;min-height:6.25rem;max-height:11rem}
.tile2{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:.2rem;padding:.5rem .625rem;text-align:left;min-width:0;overflow:hidden;
  touch-action:manipulation;transition:transform .15s}
.tile2:active{transform:scale(.97)}
.tile2 .k{font-size:.8125rem}
.tile2 .big{display:flex;align-items:baseline;gap:.3rem;white-space:nowrap}
.tile2 .big .led{font-size:clamp(1.9rem,6.2vh,3.25rem);line-height:.9}
.tile2 .big small{font:800 .8125rem/1 var(--cond);letter-spacing:.04em;text-transform:uppercase;color:var(--mute)}
.tile2 .sub{font:800 .9375rem/1.05 var(--cond);letter-spacing:.03em;text-transform:uppercase;color:var(--gold2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.tile2 .sub em{font-style:normal}
.tile2 .fc{font:800 .8125rem/1.05 var(--cond);letter-spacing:.04em;text-transform:uppercase;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.tile2 .fc i{font-style:normal}.tile2 .fc .d{color:var(--sky)}.tile2 .fc .r{color:#ff9d9d}
.tile2.up{border-color:#4f7fd6}
.tile2.win{border-color:#cfe0ff;box-shadow:0 0 18px rgba(31,107,255,.55)}
.pips{display:none;gap:3px;margin-top:.35rem;width:100%;overflow:hidden}
.pip{display:block;flex:0 1 .7rem;min-width:3px;height:.7rem;border-radius:2px;background:#1b2c5c;border:1px solid #2a4384}
.pip.flip{background:var(--vivid);border-color:#9cc4ff}.pip.held{background:#3d7be0;border-color:#9cc4ff}
.pip.ind{background:#6b4fd8;border-color:var(--gold2)}.pip.lost{background:var(--orange);border-color:#ffb08a}.pip.rwin{background:#7a3a3a;border-color:#a35a5a}
.pip.count{background:transparent;border:1px dashed var(--sky)}.pip.pick{box-shadow:0 0 0 1px var(--gold2)}
.psep{display:block;flex:none;width:4px}
.hpips{display:flex;gap:2px;margin-top:.3rem;width:100%;max-width:7rem}
.hpips i{display:block;height:.45rem;flex:1;border-radius:2px;background:#1b2c5c}
.hpips i.r{flex:.55;background:#3a1a10}.hpips i.done{background:#2459c9}.hpips i.on{background:#fff;box-shadow:0 0 8px rgba(160,200,255,.9)}
.hpips i.r.on{background:var(--orange2)}
/* next poll close strip */
.nextc{display:flex;align-items:center;justify-content:space-between;gap:.625rem;padding:.5rem .625rem;width:100%;text-align:left;touch-action:manipulation}
.nextc .nl{min-width:0;display:flex;flex-direction:column;gap:.2rem}
.nextc .nn{font:800 1.0625rem/1.05 var(--cond);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nextc .cd{font:800 1.625rem/1 var(--cond);font-variant-numeric:tabular-nums;background:#030a1f;border:2px solid #1b3570;border-radius:9px;padding:.3rem .5rem .2rem;white-space:nowrap;
  text-shadow:0 0 12px rgba(90,160,255,.75);flex:none}
.nextc .cd.done{color:var(--sky)}
/* just in */
.justin{padding:.5rem .625rem .375rem;flex:0 1 auto;display:flex;flex-direction:column}
.jk{display:flex;align-items:baseline;gap:.5rem;font:800 .8125rem/1.1 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--cyan);margin-bottom:.25rem;white-space:nowrap;min-width:0}
.jk>span{color:var(--mute);overflow:hidden;text-overflow:ellipsis;min-width:0}
.jall{margin-left:auto;color:var(--sky);text-decoration:none;flex:none}
.jl{display:flex;flex-direction:column;flex:1 1 auto;justify-content:center}
.ji{display:grid;grid-template-columns:1.625rem minmax(0,1fr) auto;align-items:center;gap:.5rem;width:100%;min-height:2.25rem;padding:.2rem 0;border-top:2px solid #1e3366;text-align:left;touch-action:manipulation}
.ji:first-child{border-top:0}
.ji .bdg{width:1.625rem;height:1.625rem}
.jt{font:600 .9375rem/1.2 var(--sans);color:#dfe8fb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.jt b{font:800 1rem/1 var(--cond);text-transform:uppercase;color:#fff;margin-right:.15rem}
.jp{font:800 1.0625rem/1 var(--cond);white-space:nowrap}
.jm{display:none}
.ji.up .jt b{color:var(--sky)}
.ji.up{grid-template-columns:1.625rem minmax(0,1fr)}
.ji.bfd .jt b{color:var(--gold2)}
.ji.fresh{animation:fresh 2.4s ease-out}
@keyframes fresh{0%{background-color:rgba(143,192,255,.35)}100%{background-color:transparent}}
.ji:nth-child(n+4){display:none}
.board{display:none}
@media (max-width:759px){.tile2.hse .big small{display:none}}
@media (max-width:759px) and (min-height:780px){
  .vlev{align-items:flex-start}
  .vlev .ln{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .wp{height:3.4rem}.wp .led{font-size:2.4rem}
  .mbar{height:1.875rem}
  .ji{min-height:2.875rem}
  .tiles{max-height:13rem}
  .dgrid{justify-content:space-between}
}

/* small phones: make DASH fit 360x640 */
@media (max-width:759px) and (max-height:760px){
  .vpanel>.kick{display:none}
  .vtxt{margin-top:.1rem}
  .tiles{min-height:5.5rem}
  .tile2 .pips,.tile2 .hpips{display:none}
}
@media (max-width:759px) and (max-height:700px){
  .tile2 .fc{display:none}
  .tiles{min-height:5rem}
  .nextc{padding:.375rem .625rem}
  .nextc .cd{font-size:1.375rem}
  .ji{min-height:2.05rem;padding:.1rem 0}
  .vpanel{padding:.5rem .75rem .625rem}
  .mrow{margin-top:.5rem}
}
@media (max-width:759px) and (max-height:620px){
  .vlev .ln{display:none}
  .ji:nth-child(n+3){display:none}
  .tile2 .fc{display:none}
}

/* ---------------- RACES ---------------- */
.hchips{position:sticky;top:var(--hdrH);z-index:40;display:flex;gap:.375rem;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;
  margin:-.625rem -.625rem .5rem;padding:.5rem .625rem;background:rgba(6,15,42,.97);border-bottom:2px solid var(--line);scroll-behavior:smooth}
.hchips::-webkit-scrollbar{display:none}
.hc{flex:none;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:4.1rem;padding:.4rem .55rem .35rem;border-radius:12px;
  background:#0b1838;border:2px solid #23396f;touch-action:manipulation}
.hc b{font:800 1.25rem/1 var(--cond);font-variant-numeric:tabular-nums}
.hc span{font:800 .8125rem/1 var(--cond);letter-spacing:.08em;text-transform:uppercase;color:var(--mute);white-space:nowrap}
.hc.closed b{color:var(--sky)}
.hc.hit span{color:var(--gold2)}
.hc.cur{border-color:#fff;box-shadow:0 0 0 1px #fff inset}
.hc.nxt{background:var(--vivid);border-color:#9cc4ff;box-shadow:0 0 14px rgba(31,107,255,.6)}
.hc.nxt b,.hc.nxt span{color:#fff}
.hgrp{margin-top:.5rem;scroll-margin-top:calc(var(--hdrH) + 4.6rem)}
.hhd{display:flex;align-items:center;gap:.625rem;width:100%;padding:.5rem .25rem;border-bottom:2px solid #1e3366;touch-action:manipulation}
.hhd .ht{font:800 1.375rem/1 var(--cond);text-transform:uppercase;white-space:nowrap}
.hhd .hs{font:800 .8125rem/1.1 var(--cond);letter-spacing:.08em;text-transform:uppercase;color:var(--mute);min-width:0}
.hhd .chev{margin-left:auto}
.hgrp.closed .ht{color:var(--sky)}
.hgrp.nxt .ht{color:#fff}.hgrp.nxt .hs{color:var(--gold2)}
.hgrp.open .hhd .chev{transform:rotate(225deg) translate(-3px,-3px)}
.hbody{display:grid;gap:.375rem;padding-top:.375rem}
.chev{flex:none;width:11px;height:11px;border-right:3px solid var(--sky);border-bottom:3px solid var(--sky);transform:rotate(45deg) translate(-3px,-3px);transition:transform .25s}
.rr{background:linear-gradient(180deg,var(--panel2),var(--panel));border:2px solid var(--line);border-left:6px solid #2b437c;border-radius:12px;min-width:0}
.rrh{display:grid;grid-template-columns:1.875rem minmax(0,1fr) auto 14px;align-items:center;gap:.5rem;width:100%;padding:.5rem .625rem;text-align:left;touch-action:manipulation}
.rrh .bdg{width:1.875rem;height:1.875rem}.rrh .bdg.nb{width:1.625rem;height:1.625rem}
.rrt{min-width:0;display:flex;flex-direction:column;gap:2px}
.rl1{display:flex;align-items:baseline;gap:.5rem;min-width:0;white-space:nowrap}
.rl1 b{font:800 1.0625rem/1.1 var(--cond);text-transform:uppercase;letter-spacing:.01em;flex:none}
.stt{font:800 .8125rem/1.2 var(--cond);letter-spacing:.06em;text-transform:uppercase;color:var(--mute);overflow:hidden;text-overflow:ellipsis;min-width:0}
.rh{font:600 .9375rem/1.25 var(--sans);color:#dfe8fb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rr.open .rh{white-space:normal}
.rr.open .chev{transform:rotate(225deg) translate(-3px,-3px)}
.pts{font:800 1.125rem/1 var(--cond);white-space:nowrap}
.rr.yeah{border-left-color:var(--vivid)}.rr.yeah .stt{color:var(--sky)}
.rr.good{border-left-color:var(--pale)}.rr.good .stt{color:#cfe0ff}
.rr.welp{border-left-color:#8a94aa}
.rr.ffs{border-left-color:var(--orange2)}.rr.ffs .stt{color:var(--orange2)}
.rr.count{border-left-color:var(--sky);border-style:dashed;border-left-style:solid}.rr.count .stt{color:var(--sky)}
.rr.called{border-left-color:#5d6f98}
.rr.bfd{box-shadow:0 0 0 2px var(--gold2),0 0 14px rgba(255,201,51,.3)}
.rrb{padding:0 .625rem .75rem}
/* card body (inline + popover) */
.rsub{font:800 .8125rem/1.3 var(--cond);letter-spacing:.04em;text-transform:uppercase;color:var(--cyan)}
.stamp{display:inline-block;color:var(--orange2);border:2px solid var(--orange2);border-radius:5px;padding:1px 6px 0;margin-left:4px;transform:rotate(-2deg)}
.ctx{font:500 .9375rem/1.4 var(--sans);color:#cfdaf2;margin-top:.375rem}
.ocs{list-style:none;margin:.5rem 0 0;padding:0;display:grid;gap:.375rem}
.oc{display:grid;grid-template-columns:2rem minmax(0,1fr);gap:.5rem;padding:.5rem;border-radius:10px;background:#081433;border:2px solid #1b3570}
.oc .bdg{width:2rem;height:2rem}
.ok{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px}
.oh{display:block;font:800 1.0625rem/1.15 var(--cond);text-transform:uppercase;margin:.3rem 0 .15rem}
.oc p{font:500 .9375rem/1.4 var(--sans);color:#cfdaf2}
.om{display:flex;flex-wrap:wrap;gap:6px 10px;margin-top:.4rem}
.oc.hit{border-color:#fff;background:#13306f;box-shadow:0 0 14px rgba(120,180,255,.35)}
.oc.hit.ffs{background:#3a1405;border-color:var(--orange2)}
.hitt{font:800 .8125rem/1 var(--cond);letter-spacing:.06em;text-transform:uppercase;background:#fff;color:var(--navy);padding:4px 7px 3px;border-radius:5px}
.holds{display:grid;grid-template-columns:1.75rem 1fr;gap:.5rem;margin-top:.5rem;padding:.5rem;border-radius:10px;border:2px dashed #3a5694}
.holds .bdg{width:1.75rem;height:1.75rem}
.holds b{font:800 1rem/1 var(--cond);text-transform:uppercase;color:var(--cyan)}
.holds ul,.notes{margin:.3rem 0 0;padding-left:1.1rem;font:500 .9375rem/1.4 var(--sans);color:#cfdaf2}
.notes{margin-top:.5rem}
/* chips, cues, tags */
.rt{display:inline-block;font:800 .8125rem/1 var(--cond);letter-spacing:.06em;text-transform:uppercase;padding:4px 6px 3px;border-radius:5px;color:#fff;white-space:nowrap}
.rt.senate{background:#6d28d9}.rt.house{background:#0e7490}.rt.gov{background:#15803d}.rt.check{background:#e2e8f0;color:#0b1838}
.cue{display:inline-flex;align-items:center;gap:5px;font:800 .8125rem/1 var(--cond);letter-spacing:.06em;text-transform:uppercase;color:var(--navy);background:var(--cyan);
  border-radius:5px;padding:4px 7px 3px;white-space:nowrap}
.cue svg{width:15px;height:15px;flex:none}
.cue.gold{background:var(--gold2);color:#3a2400}
.bfdtag{display:inline-flex;align-items:center;gap:5px;font:800 .8125rem/1 var(--cond);letter-spacing:.06em;text-transform:uppercase;color:var(--gold2);
  border:2px solid var(--gold2);border-radius:5px;padding:3px 6px 2px;white-space:nowrap;transform:rotate(-2deg)}
.bfdtag svg{width:13px;height:13px}
.lvn{font:800 .8125rem/1 var(--cond);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.lvn.yeah{color:#8fc0ff}.lvn.good{color:#cfe0ff}.lvn.welp{color:#a9b8d8}.lvn.ffs{color:#ff7a2e}

/* ---------------- SENATE / HOUSE / GOV pages ---------------- */
.pg{display:flex;flex-direction:column;gap:var(--gap)}
.sh{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 10px;margin-bottom:.375rem}
.sh h2{font:800 1.5rem/1 var(--cond);text-transform:uppercase;letter-spacing:.005em}
.sh .kick{color:var(--mute)}
h3.sub{font:800 1.0625rem/1.1 var(--cond);text-transform:uppercase;margin:.75rem 0 .375rem;letter-spacing:.02em}
h3.sub:first-child{margin-top:0}
h3.sub span{font-size:.8125rem;color:var(--mute);letter-spacing:.06em}
.bignum{display:flex;align-items:flex-end;flex-wrap:wrap;gap:4px 10px}
.led.huge{font-size:4rem;line-height:.85}
.bignum .of{font:800 .9375rem/1.05 var(--cond);color:var(--mute);text-transform:uppercase;padding-bottom:3px}
.cap{font:800 1.0625rem/1.15 var(--cond);text-transform:uppercase;color:var(--gold2);margin-top:.5rem}
/* senate */
.lamps{display:flex;gap:5px;margin-left:auto;padding-bottom:3px}
.lamp{width:2.4rem;height:2.4rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font:800 .8125rem/1 var(--cond);
  background:radial-gradient(circle at 40% 35%,#1b2c5c,#091433);border:3px solid #2a4384;color:#5d6f98}
.lamp.on{background:radial-gradient(circle at 40% 35%,#9cc4ff,#1f6bff 55%,#0a3cab);border-color:#cfe0ff;color:#fff;box-shadow:0 0 16px rgba(60,140,255,.8)}
.sgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.375rem}
#sen-grid .sgrid:last-of-type{grid-template-columns:repeat(3,minmax(0,1fr))}
.st{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"ab bd" "nm nm";align-items:center;align-content:start;gap:2px 4px;padding:.4rem .45rem;border-radius:10px;
  background:#0b1838;border:2px solid #1e3366;min-width:0}
.st .ab{grid-area:ab;font:800 1.375rem/1 var(--cond);display:flex;align-items:baseline;gap:4px;min-width:0}
.st .ab small{font:800 .8125rem/1 var(--cond);letter-spacing:.04em;color:var(--mute);text-transform:uppercase}
.st .bdg{grid-area:bd;width:1.5rem;height:1.5rem}
.st .bdg.nb{width:1.3rem;height:1.3rem}
.st .nmw{grid-area:nm;min-width:0}
.st .nm{font:800 .9375rem/1.05 var(--cond);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st .ss{font:800 .8125rem/1.1 var(--cond);letter-spacing:.03em;text-transform:uppercase;color:var(--mute);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st.flip{background:linear-gradient(160deg,#2a78ff,#0a4fd6);border-color:#a9cbff;box-shadow:0 0 14px rgba(31,107,255,.45)}
.st.flip .ss,.st.held .ss{color:#dfeaff}.st.flip .ab small,.st.held .ab small{color:#cfe0ff}
.st.held{background:#174a9e;border-color:#5f8fd6}
.st.ind{background:#3b2a8a;border:2px dashed var(--gold2)}.st.ind .ss{color:var(--gold2)}
.st.lost{background:#2b0f04;border-color:var(--orange)}.st.lost .ss{color:var(--orange2)}.st.lost .nm,.st.lost .ab{color:#f3c3a8}
.st.count{border:2px dashed var(--sky);animation:pulse 3s ease-in-out infinite}.st.count .ss{color:var(--sky)}
.st.later .ab,.st.later .nm{color:#c6d2ec}
@keyframes pulse{50%{border-color:#2c4c8c;background-color:#10224f}}
/* house */
.bignum .tier{font:800 1.25rem/1 var(--cond);text-transform:uppercase;padding-bottom:3px;flex-basis:100%}
.hcalled{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin-top:.5rem}
.hcalled b{font:800 1.25rem/1 var(--cond)}
.hcalled i{font-style:normal}.hcalled .d{color:var(--sky)}.hcalled .r{color:#ff9d9d}
.htally{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.375rem;margin-top:.5rem}
.htally>div{display:grid;grid-template-columns:auto auto minmax(0,1fr);grid-template-areas:"b n l";align-items:center;gap:2px 8px;background:#040b22;border:2px solid #1b3570;border-radius:9px;padding:.3rem .45rem}
.htally .bdg{grid-area:b;width:1.5rem;height:1.5rem}
.htally b{grid-area:n;font:800 1.375rem/1 var(--cond)}
.htally span{grid-area:l;font:800 .8125rem/1.05 var(--cond);text-transform:uppercase;color:var(--mute);letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hbar{position:relative;height:1.875rem;margin-top:1.75rem}
.hseg{position:absolute;top:0;bottom:0;display:flex;align-items:center;justify-content:center;border-left:2px solid var(--panel);background:#13244f;overflow:hidden}
.hseg:first-child{border-left:0;border-radius:7px 0 0 7px}.hseg:nth-child(5){border-radius:0 7px 7px 0}
.hseg span{font:800 .8125rem/1 var(--cond);letter-spacing:.02em;text-transform:uppercase;white-space:nowrap;color:#dfe8fb;padding-top:2px}
.hseg.r{background:#3a1a10}.hseg.r span{color:#e9a27f}.hseg.take{background:#1d3a7a}.hseg.solid{background:#2459c9}
.hseg.y2018{background:#1f6bff}.hseg.holy{background:#b88a00}.hseg.holy span{color:#fff6d6}
.hseg.on{box-shadow:0 0 0 3px #fff inset,0 0 18px rgba(120,180,255,.7);z-index:1}.hseg.on span{color:#fff}
.hbar .mpin{top:-1.6rem;bottom:-5px}
.hbar .mpin i{top:1.25rem}
.hbar .mpin b{display:block;position:absolute;top:0;left:0;transform:translateX(calc(-1% * var(--sh,50)));font:800 .9375rem/1 var(--cond);color:var(--navy);background:#fff;border-radius:5px;padding:3px 6px 1px;white-space:nowrap;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.hrung,.hrow{display:grid;align-items:center;gap:.5rem;padding:.375rem .5rem;border-radius:10px;background:#0b1838;border:2px solid #1e3366;margin-top:.375rem}
.hrung{grid-template-columns:1.875rem minmax(0,1fr) auto}
.hrung .bdg{width:1.875rem;height:1.875rem}.hrung .bdg.nb{width:1.625rem;height:1.625rem}
.hrung .rw{min-width:0}
.hrung .k{margin-bottom:2px}
.hrung b{font:800 1rem/1.1 var(--cond);text-transform:uppercase;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hrung .lv{font:800 .8125rem/1.1 var(--cond);letter-spacing:.04em;text-transform:uppercase;color:var(--mute);text-align:right;max-width:6.5rem}
.hrung.yeah,.hrow.yeah{background:linear-gradient(160deg,#1a3f9a,#0f2a6e);border-color:#5f8fd6}
.hrung.ffs,.hrow.ffs{background:#2b0f04;border-color:var(--orange)}
.hrung.count,.hrow.count{border-style:dashed;border-color:var(--sky)}
.hrow{grid-template-columns:1.625rem auto minmax(0,1fr) auto;padding:.3rem .5rem;margin-top:.3rem}
.hrow .bdg{width:1.625rem;height:1.625rem}.hrow .bdg.nb{width:1.4rem;height:1.4rem}
.hrow .lb{font:800 1rem/1 var(--cond);text-transform:uppercase;white-space:nowrap}
.hrow .tx{font:600 .9375rem/1.2 var(--sans);color:#dfe8fb;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hrow .tx i{font-style:normal;color:var(--mute)}
.hrow .tm{font:800 .8125rem/1 var(--cond);color:var(--mute);white-space:nowrap}
.hcol>div+div{margin-top:.25rem}
/* governors */
.gstats{display:flex;gap:6px;margin-left:auto;padding-bottom:3px}
.gstats>div{display:flex;align-items:baseline;gap:5px;background:#040b22;border:2px solid #1b3570;border-radius:9px;padding:.3rem .5rem}
.gstats b{font:800 1.375rem/1 var(--cond)}
.gstats span{font:800 .8125rem/1 var(--cond);text-transform:uppercase;color:var(--mute);letter-spacing:.03em}
.gstats .good b{color:var(--sky)}.gstats .bad b{color:var(--orange2)}
.jac{margin-top:.5rem}
.jsc{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;margin-top:4px}
.jsc>div{background:#040b22;border:2px solid #1b3570;border-radius:8px;padding:.3rem .35rem;display:flex;flex-direction:column;gap:2px;min-width:0}
.jsc b{font:800 .9375rem/1 var(--cond)}
.jsc span{font:800 .8125rem/1.05 var(--cond);text-transform:uppercase;color:var(--mute);letter-spacing:.01em}
.jsc .on{background:var(--vivid);border-color:#9cc4ff;box-shadow:0 0 12px rgba(31,107,255,.6)}.jsc .on span{color:#fff}
.ggrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.3rem}
.gt{border-radius:9px;padding:.3rem .4rem .25rem;background:#0b1838;border:2px solid #1e3366;min-width:0}
.gh{display:flex;align-items:center;justify-content:space-between;gap:4px}
.gh b{font:800 1.25rem/1 var(--cond)}
.held{font:800 .8125rem/1 var(--cond);border-radius:4px;padding:2px 4px 1px}
.held.d{background:#1d3a7a;color:#cfe0ff}.held.r{background:#4a1d1d;color:#ffb3b3}
.gm{font:600 .9375rem/1.15 var(--cond);color:#cfdaf2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.gs{font:800 .8125rem/1.1 var(--cond);text-transform:uppercase;letter-spacing:.02em;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.gt.dwin{background:linear-gradient(160deg,#2a78ff,#0a4fd6);border-color:#a9cbff}.gt.dwin .gs,.gt.dwin .gm{color:#fff}
.gt.pick{box-shadow:0 0 0 3px var(--gold2),0 0 14px rgba(255,201,51,.5)}
.gt.rwin{background:#3a1d1d;border-color:#7a3a3a}.gt.rwin .gs{color:#ffb3b3}
.gt.loss{background:#2b0f04;border-color:var(--orange)}.gt.loss .gs{color:var(--orange2)}
.gt.count{border:2px dashed var(--sky);animation:pulse 3s ease-in-out infinite}.gt.count .gs{color:var(--sky)}
.legend{font:600 .9375rem/1.3 var(--sans);color:var(--mute);margin-top:.5rem}
.legend .held{margin:0 2px}

/* footer (bottom of RACES / GOV) */
.foot{margin:1rem auto 0;padding:.5rem .5rem .75rem;color:var(--mute);font:500 .9375rem/1.45 var(--sans);text-align:center;max-width:44rem}
.foot b{color:#cfdaf2}
.foot .fl{margin-top:.5rem}
.foot .fl a{font:800 .8125rem/1 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--mute);text-decoration:none;border:2px solid var(--line);border-radius:6px;padding:5px 9px 4px;display:inline-block}

/* ================= popover (race card on the board) ================= */
.pop{position:fixed;z-index:90;overflow:auto;overscroll-behavior:contain;border-radius:14px;background:linear-gradient(180deg,#16306a,#0e1c44);border:2px solid #4f6fb5;
  box-shadow:0 20px 60px rgba(0,0,0,.65),0 0 0 1px rgba(0,0,0,.4)}
.popin{padding:.75rem .875rem .875rem}
.ph{display:grid;grid-template-columns:2.25rem minmax(0,1fr) auto auto;align-items:center;gap:.625rem;padding-bottom:.5rem;border-bottom:2px solid #2b4a8f;margin-bottom:.375rem}
.ph .bdg{width:2.25rem;height:2.25rem}
.ph h2{font:800 1.25rem/1.05 var(--cond);text-transform:uppercase}
.ph .stt{display:block;margin-top:2px}
.px{width:2rem;height:2rem;border-radius:8px;border:2px solid var(--line);font:800 1rem/1 var(--sans);color:var(--sky);display:flex;align-items:center;justify-content:center}
.px:hover{background:#1b3570}

/* ================= takeover toasts ================= */
#toasts{position:fixed;left:0;right:0;top:calc(8px + env(safe-area-inset-top));z-index:100;display:flex;justify-content:center;pointer-events:none;padding:0 8px}
.toast{pointer-events:auto;cursor:pointer;width:min(37.5rem,100%);border-radius:18px;overflow:hidden;position:relative;color:#fff;
  background:linear-gradient(150deg,#2a78ff,#0a3cab);border:3px solid #a9cbff;box-shadow:0 18px 50px rgba(0,0,0,.6),0 0 30px rgba(31,107,255,.45);
  animation:tin .55s cubic-bezier(.2,1.3,.4,1) both}
.toast.out{animation:tout .4s ease-in both}
@keyframes tin{0%{transform:translateY(-130%)}100%{transform:translateY(0)}}
@keyframes tout{to{transform:translateY(-130%);opacity:0}}
.toast.good{background:linear-gradient(150deg,#eef4ff,#c7dafa);border-color:#fff;color:var(--navy)}
.toast.welp{background:linear-gradient(150deg,#6b7590,#4a536b);border-color:#a9b2c6}
.toast.ffs{background:linear-gradient(150deg,#f06a1e,#9c3008);border-color:#ffb08a;box-shadow:0 18px 50px rgba(0,0,0,.6),0 0 30px rgba(226,84,12,.5)}
.toast.bfd{border:4px solid var(--gold2);box-shadow:0 18px 50px rgba(0,0,0,.6),0 0 0 3px rgba(58,36,0,.6),0 0 40px rgba(255,201,51,.7)}
.tstamp{display:flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(90deg,#e8a900,#ffd65a,#e8a900);background-size:200% 100%;color:#3a2400;
  font:800 1.125rem/1 var(--cond);letter-spacing:.12em;text-transform:uppercase;padding:7px 10px 5px;animation:shine 2.4s linear infinite}
.tstamp svg{width:16px;height:16px}
@keyframes shine{to{background-position:-200% 0}}
.tin{display:grid;grid-template-columns:3.5rem minmax(0,1fr);gap:.75rem;padding:.75rem .875rem .875rem}
.tin .tb{width:3.5rem;height:3.5rem;filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))}
.tk{display:flex;flex-wrap:wrap;align-items:center;gap:5px 6px}
.tk b{font:800 1.125rem/1 var(--cond);text-transform:uppercase;margin-left:2px}
.tk .rt{box-shadow:0 0 0 2px rgba(255,255,255,.55)}
.tk .more{margin-left:auto;font:800 .8125rem/1 var(--cond);letter-spacing:.06em;text-transform:uppercase;opacity:.85}
.ttag{font:800 .8125rem/1 var(--cond);letter-spacing:.08em;text-transform:uppercase;background:#fff;color:var(--navy);border-radius:5px;padding:3px 6px 2px}
.tw{font:800 1.875rem/1 var(--cond);text-transform:uppercase;margin-top:5px;letter-spacing:.01em}
.toast.ffs .tw{color:#fff3ea}
.th{font:700 1.125rem/1.2 var(--sans);margin-top:3px;overflow-wrap:anywhere}
.tm{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:.5rem}
.tm .pts{font-size:1.125rem;color:inherit}
.vz{font:800 .8125rem/1.1 var(--cond);letter-spacing:.06em;text-transform:uppercase;opacity:.9}
.vz.chg{background:#fff;color:var(--navy);padding:4px 7px 3px;border-radius:5px;opacity:1}
.toast.good .vz.chg{background:var(--navy);color:#fff}
.toast .cue{box-shadow:0 0 0 2px rgba(255,255,255,.4)}
.timer{height:5px;background:rgba(255,255,255,.85);transform-origin:left;animation:timer linear both}
.toast.good .timer{background:var(--blue)}.toast.bfd .timer{background:var(--gold2)}
@keyframes timer{from{transform:scaleX(1)}to{transform:scaleX(0)}}

/* ================= tablet + desktop (>= 760px) ================= */
@media (min-width:760px){
  :root{--gap:.75rem;--pad:1rem;--r:16px}
  body{padding-bottom:0}
  .tabbar{display:none}
  .hin{gap:1rem;padding:.4rem 1rem}
  .logo{width:2.4rem;height:2.4rem}
  .brand{flex:0 1 auto;min-width:2.4rem}
  .mark{font-size:1.375rem;max-width:none;display:block;white-space:nowrap;text-overflow:ellipsis}
  .dnav{display:flex;gap:.125rem;margin:0 auto;flex:none}
  .dn{display:flex;align-items:baseline;gap:.35rem;padding:.45rem .5rem .35rem;border-radius:10px;border:2px solid transparent;text-decoration:none;color:var(--mute);white-space:nowrap}
  .dn .tn{font:800 1rem/1 var(--cond);letter-spacing:.1em;text-transform:uppercase;order:-1}
  .dn .tv{font:800 1rem/1 var(--cond);font-variant-numeric:tabular-nums;color:var(--dim)}
  .dn:hover{border-color:var(--line);color:#fff}
  .dn.on{background:var(--vivid);border-color:#9cc4ff;color:#fff;box-shadow:0 0 14px rgba(31,107,255,.5)}
  .dn.on .tv{color:#dfeaff}
  .tag{display:none}
  .mark{display:none}
  .clock .ck{display:block}
  .conn{border-color:var(--line);padding:.3rem .55rem .25rem}
  main{padding:var(--gap)}
  .hchips{margin:calc(-1 * var(--gap)) calc(-1 * var(--gap)) .5rem;padding:.5rem var(--gap)}

  /* tablet dashboard: stacked, may scroll a little */
  .dgrid{display:grid;min-height:0;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);
    grid-template-areas:"v t" "n n" "j j" "b b"}
  .vpanel{grid-area:v;padding:var(--pad)}
  .tiles{grid-area:t;min-height:0;max-height:none;grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(3,minmax(0,1fr))}
  .nextc{grid-area:n}
  .justin{grid-area:j}
  .board{grid-area:b}
  .vpanel>.kick{display:block;font-size:.875rem}
  .vtxt{font-size:min(18cqi,8rem)}
  .vlev .bdg{width:2.5rem;height:2.5rem}.vlev b{font-size:1.375rem}.vlev .ln{font-size:1.0625rem}
  .mrow{grid-template-columns:minmax(0,1fr);margin-top:.75rem}
  .wp{display:none}
  .meter{padding-top:1.85rem}
  .mbar{height:2.25rem}
  .mseg span{font-size:.9375rem}
  .mseg span{display:inline}
  .mpin{top:-1.85rem;bottom:-6px}
  .mpin i{top:1.45rem}
  .mpin b{display:block;position:absolute;top:0;left:0;transform:translateX(calc(-1% * var(--sh,50)));font:800 1rem/1 var(--cond);color:var(--navy);background:#fff;border-radius:6px;padding:4px 7px 2px;white-space:nowrap;box-shadow:0 2px 8px rgba(0,0,0,.4)}
  .mpin.pre b{background:var(--pale)}
  .mcap{display:flex;justify-content:space-between;gap:10px;font:800 .8125rem/1 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--cyan);margin-top:.15rem}
  .mcap span:last-child{color:var(--sky)}
  .cells{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) minmax(0,1.3fr);gap:.5rem;margin-top:.75rem}
  .cell{background:#040b22;border:2px solid #1b3570;border-radius:12px;padding:.45rem .65rem .4rem;display:flex;flex-direction:column;justify-content:space-between;gap:.3rem;min-width:0}
  .cell .k{color:var(--mute);letter-spacing:.06em;white-space:nowrap;display:flex;align-items:center;gap:4px;font-size:.875rem}
  .cell .k em{font:800 .8125rem/1 var(--cond);font-style:normal;color:var(--gold2);letter-spacing:.02em;text-transform:lowercase}
  .cell .led{font-size:2.125rem}
  .cell.tot{background:linear-gradient(180deg,#0a58e8,#0a3cab);border-color:#7fb3ff;flex-direction:row;align-items:center;justify-content:space-between;padding:.4rem .75rem}
  .cell.tot .k{color:#fff;line-height:1.05}
  .cell.tot .led{font-size:2.75rem}
  .tile2{padding:.75rem .9rem;justify-content:flex-start}
  .cells{grid-template-columns:repeat(4,minmax(0,1fr))}
  .cell.tot{grid-column:1/-1}
  .tile2 .k{font-size:.9375rem}
  .tile2 .big .led{font-size:3.25rem}
  .tile2 .big small{font-size:.9375rem}
  .tile2 .sub{font-size:1.0625rem}
  .tile2 .fc{font-size:.875rem}
  .pips{display:flex}
  .hpips{max-width:none}.hpips i{height:.55rem}
  .nextc{padding:.6rem .9rem}
  .nextc .k{font-size:.875rem}
  .nextc .nn{font-size:1.375rem}
  .nextc .cd{font-size:2.25rem;padding:.35rem .65rem .25rem}
  .justin{padding:.6rem .9rem .5rem}
  .jk{font-size:.875rem}
  .ji{grid-template-columns:2rem minmax(0,1fr) auto auto;min-height:2.6rem;gap:.625rem}
  .ji.up{grid-template-columns:2rem minmax(0,1fr)}
  .ji .bdg{width:2rem;height:2rem}
  .ji:nth-child(n+4){display:none}
  .jt{font-size:1rem}.jt b{font-size:1.125rem}
  .jp{font-size:1.25rem}
  .jm{display:block;font:800 .875rem/1 var(--cond);color:var(--mute);white-space:nowrap;min-width:4.2rem;text-align:right}
  .ji:hover{background:rgba(143,192,255,.06)}
  /* the board */
  .board{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-auto-rows:3.4rem;gap:.35rem;padding:.45rem}
  .rtile{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-width:0;overflow:hidden;border-radius:9px;padding:.35rem .5rem .3rem;text-align:left;
    background:#0b1838;border:2px solid #1e3366;color:var(--dim);transition:transform .15s,box-shadow .15s}
  .rtile:hover{transform:translateY(-2px);box-shadow:0 0 0 2px #fff}
  .rtile .tl{font:800 1.25rem/1 var(--cond);text-transform:uppercase;white-space:nowrap;display:block}
  .rtile .ts{display:flex;align-items:center;justify-content:space-between;gap:4px;font:800 .9375rem/1 var(--cond);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
  .rtile .ts>span:first-child{overflow:hidden;text-overflow:ellipsis;min-width:0}
  .rtile .bs{display:flex;gap:2px}
  .rtile .bs .bdg{width:1.5rem;height:1.5rem;filter:drop-shadow(0 1px 1px rgba(0,0,0,.4))}
  .rtile.wait{background:#13244f;border-color:#2f4a8a;color:#fff}.rtile.wait .ts{color:var(--sky)}
  .rtile.hold{background:#13244f;border:2px dashed var(--sky);color:#fff;animation:pulse 3s ease-in-out infinite}.rtile.hold .ts{color:var(--sky)}
  .rtile.nexth{border-color:var(--sky);color:#dfe8fb}.rtile.nexth .ts{color:var(--gold2)}
  .rtile.yeah{background:linear-gradient(160deg,#2a78ff,#0a4fd6);border-color:#a9cbff;color:#fff;box-shadow:0 0 16px rgba(31,107,255,.45)}
  .rtile.good{background:var(--pale);border-color:#fff;color:var(--navy)}.rtile.good .ts{color:#1769c9}
  .rtile.welp{background:#56607a;border-color:#8a94aa;color:#fff}
  .rtile.ffs{background:linear-gradient(160deg,#f06a1e,#c2410c);border-color:#ffb08a;color:#fff}
  .rtile.bfd{box-shadow:0 0 0 3px var(--gold2),0 0 18px rgba(255,201,51,.55)}
  .rtile .star{position:absolute;right:5px;top:4px;width:1.05rem;height:1.05rem;color:var(--gold2);filter:drop-shadow(0 0 3px rgba(0,0,0,.5))}
  .rtile.fresh{animation:tflip 1.4s cubic-bezier(.3,1.4,.5,1) both}
  @keyframes tflip{0%{transform:perspective(600px) rotateX(-90deg)}100%{transform:perspective(600px) rotateX(0)}}

  /* pages: two columns, TV-page style */
  .pg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:var(--gap);align-items:start}
  .pg-house{grid-template-areas:"top mid" "top tells"}
  .pg-house #house-top{grid-area:top}.pg-house .hcol{grid-area:mid}.pg-house #house-tells{grid-area:tells}
  .sh h2{font-size:2rem}
  .led.huge{font-size:6rem}
  .bignum .of{font-size:1.125rem}
  .cap{font-size:1.375rem}
  .expl{font-size:1rem}
  .lamps{gap:8px}.lamp{width:3.2rem;height:3.2rem;font-size:1rem}
  h3.sub{font-size:1.25rem}
  .st{padding:.6rem .7rem;gap:4px 8px}
  .st .ab{font-size:1.75rem}.st .bdg{width:2rem;height:2rem}.st .nm{font-size:1.125rem}.st .ss{font-size:.9375rem}
  .htally{grid-template-columns:repeat(4,minmax(0,1fr))}
  .htally>div{grid-template-columns:auto 1fr;grid-template-areas:"b n" "l l"}
  .htally span{font-size:.875rem}
  .hbar{height:2.4rem;margin-top:2.25rem}.hseg span{font-size:.9375rem}
  .hbar .mpin{top:-2.1rem}.hbar .mpin i{top:1.6rem}.hbar .mpin b{font-size:1.0625rem}
  .hrung b{font-size:1.1875rem}.hrung .bdg{width:2.25rem;height:2.25rem}
  .hrow .lb{font-size:1.125rem}.hrow .tx{font-size:1rem}.hrow .bdg{width:1.9rem;height:1.9rem}.hrow{padding:.45rem .6rem}
  .ggrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem}
  .gt{padding:.55rem .65rem .5rem}.gh b{font-size:1.625rem}.gm{font-size:1.0625rem}.gs{font-size:.9375rem}
  .jsc b{font-size:1.125rem}.jsc span{font-size:.875rem}
  #s-races .rlist{max-width:60rem;margin:0 auto}
  .hchips{justify-content:safe center}
  .rl1 b{font-size:1.25rem}.rh{font-size:1rem}
  #s-gov .foot,#s-races .foot{margin-top:1.5rem}
}

@media (min-width:1000px){ .dn{padding:.45rem .7rem .35rem} .dnav{gap:.25rem} .tvx{display:inline} }
@media (min-width:1100px){ .mark{display:block} }
@media (min-width:1240px){ .tag{display:inline-block} }

/* ================= desktop dashboard: fits the viewport (>= 1000 x 600) ================= */
@media (min-width:1000px) and (min-height:600px){
  html{font-size:clamp(13px,min(1.25vw,2vh),26px)}
  /* no overflow:hidden: if a window is too short for the board, the page scrolls instead of clipping */
  html[data-tab="dash"] main{height:calc(var(--vh) - var(--hdrH))}
  html[data-tab="dash"] #s-dash{height:100%}
  .dgrid{height:100%;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
    grid-template-rows:auto auto minmax(0,1fr) auto;
    grid-template-areas:"v t" "v n" "v j" "b b"}
  .vpanel{display:flex;flex-direction:column;justify-content:space-between}
  .vtxt{font-size:min(22cqi,15vh,10rem);margin:.15rem 0 .2rem}
  .vlev b{font-size:1.5rem}.vlev .ln{font-size:1.125rem}.vlev .bdg{width:2.75rem;height:2.75rem}
  .mbar{height:2.5rem}
  .mseg span{font-size:1rem}
  .meter{padding-top:2rem}
  .mpin{top:-2rem}.mpin i{top:1.6rem}.mpin b{font-size:1.125rem}
  .cell .led{font-size:2.5rem}.cell.tot .led{font-size:3.25rem}
  .tiles{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto}
  .ji:nth-child(n+4){display:grid}
  .cells{grid-template-columns:repeat(4,minmax(0,1fr)) minmax(0,1.3fr)}
  .cell.tot{grid-column:auto}
  .justin{min-height:0;overflow:hidden;display:flex;flex-direction:column}
  .jl{min-height:0;overflow:hidden}
  .board{grid-template-columns:repeat(10,minmax(0,1fr));grid-auto-rows:3.3rem;padding:.45rem;gap:.35rem}
  .rtile .tl{font-size:1.1875rem}
  .rtile .ts{font-size:.875rem}
  /* pages get the scaled root too; keep them from going wall-to-wall on huge screens */
  .pg{max-width:120rem;margin:0 auto}
}
@media (min-width:1000px) and (min-height:600px) and (max-aspect-ratio:3/2){
  /* squarer windows: a bit less verdict, a bit more right column */
  .dgrid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}

/* ================= motion ================= */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .toast,.toast.out{animation:none}
  .toast.out{opacity:0}
  .timer{animation:none;display:none}
  .conn .dot{box-shadow:none}
}

/* Senate: must-holds are their own, emphasized group */
.mustwrap{border:2px solid var(--gold2,#ffc933);border-radius:14px;padding:4px 10px 10px;margin:6px 0 10px;background:rgba(255,201,51,.06)}
.sub.must{color:var(--gold2,#ffc933)}
.sub.wild{opacity:.85}
