/* Civicdesk TV: the shell Newsdesk and Electiondesk TV share (header with the scene tab, up next, the countdown ring
   and the clock; the strip under it; one big scene; dots, progress and the two-tier lower third). Party colours mark
   who a member is; how they voted has its own pair (green yes, orange no), so a position never reads as a party.
   Two typefaces: Barlow Condensed for headlines, labels and numbers, IBM Plex Sans for sentences. Sizes follow the
   screen (vh). */
/* Barlow Condensed Bold and IBM Plex Sans, both under the SIL Open Font License (fonts/OFL-*.txt) */
@font-face{font-family:"Barlow Condensed";src:url("/fonts/display.ttf") format("truetype");font-weight:700 900;font-display:swap}
@font-face{font-family:"Civicdesk Text";src:url("/fonts/text.ttf") format("truetype");font-weight:400 500;font-display:swap}
@font-face{font-family:"Civicdesk Text";src:url("/fonts/text-semibold.ttf") format("truetype");font-weight:600 800;font-display:swap}
:root{
  --disp:"Barlow Condensed","Arial Narrow",system-ui,sans-serif;--text:"Civicdesk Text","Segoe UI",system-ui,sans-serif;
  /* type scale */
  --fs-label:clamp(10px,1.55vh,21px);--fs-small:clamp(12px,1.95vh,26px);--fs-body:clamp(14px,2.45vh,33px);
  --fs-title:clamp(19px,3.6vh,49px);--fs-head:clamp(28px,6.5vh,88px);
  /* palette: Civicdesk's statesig.tv colour #c98500 runs through the chrome; data colours stay fixed */
  --bg:#0f1015;--line:#3b3836;--line-2:#4d4a4b;--ink:#f3f6fc;--ink-2:#b8c2d8;--ink-3:#7b87a3;
  --brand:#a86b00;--brand-hi:#ffc857;--brand-deep:#4a3000;--brand-top:#d69a1f;--glow-1:rgba(168,107,0,.16);--glow-2:rgba(168,107,0,.12);--hi-glow:rgba(255,200,87,.45);--gold:#f7b733;--live:#e5262e;--amber:#f2a93b;
  --d:#2f7bff;--d-hi:#86b4ff;--d-tint:#173468;--r:#f0464b;--r-hi:#ff9a9a;--r-tint:#5a1d25;--o:#a37fe0;--o-hi:#cdb6f5;--o-tint:#33274d;
  --flag-red:#e63946;--flag-white:#f4f6fb;--flag-blue:#2f62e6;--scene:var(--brand-hi);
  --glass:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.012) 38%,rgba(0,0,0,.2)),rgba(26,28,35,.82);
  --glass-edge:inset 0 1px 0 rgba(255,255,255,.13),inset 0 0 0 1px rgba(255,200,87,.12),0 2.2vh 5vh -1.2vh rgba(0,0,0,.7)}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font-family:var(--text);cursor:none}
body{display:flex;flex-direction:column;
  background:radial-gradient(ellipse at 100% 100%,var(--glow-1) 0,transparent 55%),radial-gradient(ellipse at 0% 0%,var(--glow-2) 0,transparent 45%),var(--bg)}
body.pointer{cursor:default}
body::before{content:"";flex:none;height:.45vh;background:linear-gradient(90deg,var(--flag-red) 0 33.4%,var(--flag-white) 33.4% 66.6%,var(--flag-blue) 66.6%)}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(155,179,209,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(155,179,209,.035) 1px,transparent 1px);background-size:4.2vh 4.2vh;
  mask-image:radial-gradient(ellipse at 50% 45%,#000 30%,transparent 80%)}
.d{color:var(--d-hi)}.r{color:var(--r-hi)}.o{color:var(--o-hi)}
.muted{color:var(--ink-3)}

/* Header: the logo, the scene tab, up next, the ring and the clock */
header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1vh 1.5vw;padding:2.2vh 3vw 0}
.brand{display:flex;align-items:center;gap:1.4vw;white-space:nowrap;min-width:0}
.logo{display:flex;align-items:center;gap:.08em;font:800 clamp(18px,3.5vh,47px)/1 var(--disp);letter-spacing:.05em}
.logo svg{width:1em;height:1em;margin-right:.3em;fill:var(--gold);filter:drop-shadow(0 0 .25em rgba(247,183,51,.45))}
/* the name as on statesig.tv: the first word white, DESK in the desk's own colour */
.logo b{color:var(--ink);font-weight:800}.logo span{color:#c98500;filter:brightness(1.3) saturate(1.1)}
.logo em{font-style:normal;font-size:.55em;letter-spacing:.08em;margin-left:.6em;padding:.25em .45em;border-radius:.25em;background:var(--brand);color:#fff}
.logo em:empty{display:none}
#section{font:800 clamp(13px,2.3vh,31px)/1 var(--disp);font-style:normal;letter-spacing:.12em;color:#fff;background:linear-gradient(180deg,var(--brand-top),var(--brand));
  padding:.45em 1em;border-radius:.35em;box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
#section:empty{display:none}
.hud{display:flex;align-items:center;gap:1.2vw;min-width:0}
#clock{flex:none;font:800 clamp(20px,4vh,54px)/1 var(--disp);letter-spacing:.03em;font-variant-numeric:tabular-nums;white-space:nowrap}
#clock small{font-size:.5em;color:var(--ink-3);margin-left:.35em;letter-spacing:.1em}
#upnext{min-width:0;max-width:38vw;display:flex;align-items:baseline;gap:.7em;color:var(--ink);font:600 clamp(12px,1.9vh,25px) var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  background:var(--glass);box-shadow:var(--glass-edge);border-radius:.5em;padding:.5em 1em}
#upnext[hidden]{display:none}
#upnext span{flex:none;color:var(--brand-hi);font:800 .85em var(--disp);letter-spacing:.14em;text-transform:uppercase}
#upnext.pop{animation:pop .5s cubic-bezier(.2,.8,.2,1)}
@keyframes pop{from{opacity:0;transform:translateX(2vw)}to{opacity:1;transform:none}}
#ring{flex:none}
#ring svg{display:block;width:3.6vh;height:3.6vh;transform:rotate(-90deg)}
#ring circle{fill:none;stroke-width:3.5}
#ring .rt{stroke:var(--line)}
#ring .rf{stroke:var(--brand-hi);stroke-dasharray:97.4;stroke-linecap:round}
body.paused #ring .rf{stroke:var(--ink-3)}
/* Congress is out: each chamber's return day */
.rcs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2.4vw;align-items:stretch}
.rc{background:var(--glass);box-shadow:var(--glass-edge);border-radius:1.4vh;padding:4vh 2vw;border-top:.6vh solid var(--line-2);min-width:0}
.rc.senate{border-top-color:var(--flag-blue)}.rc.house{border-top-color:var(--flag-red)}
.rc h3{margin:0 0 3vh;font:800 var(--fs-title)/1 var(--disp);letter-spacing:.14em;text-transform:uppercase}
.rc-k{margin:0;color:var(--ink-3);font:700 var(--fs-label) var(--disp);letter-spacing:.18em;text-transform:uppercase}
.rc-d{display:block;margin:.6vh 0;font:800 var(--fs-head)/1.05 var(--disp)}
.rc-n{margin:0;color:var(--gold);font:800 var(--fs-title) var(--disp);letter-spacing:.04em}
.rc-s{margin:3vh 0 0;color:var(--ink-3);font:400 var(--fs-body) var(--text)}

@media (max-aspect-ratio:1/1){#upnext{display:none !important}}

/* The strip: where the night stands (each chamber's count), what just happened on the right; pop-ups play in it */
#alertbar{display:flex;align-items:stretch;margin:1.4vh 3vw 0;height:7vh;min-height:44px;border-radius:1vh;overflow:hidden;white-space:nowrap;
  background:var(--glass);border:1px solid var(--ab-b,var(--line));box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1.4vh 3vh -1vh rgba(0,0,0,.6);transition:border-color .6s}
#alertbar>*{display:flex;align-items:center;flex:none;padding:0 1.1vw}
#alertbar>*+*{border-left:1px solid rgba(255,200,87,.1)}
#alertbar[data-state=live]{--ab:var(--live);--ab-a:rgba(229,38,46,.18);--ab-b:rgba(229,38,46,.45)}
#alertbar[data-state=test]{--ab:var(--amber);--ab-a:rgba(242,169,59,.14);--ab-b:rgba(242,169,59,.35)}
.ab-title{flex-direction:column;align-items:flex-start!important;justify-content:center;gap:.4vh;min-width:11vw;
  background:var(--ab-a,var(--glow-1));border-left:.45vw solid var(--ab,var(--brand))}
.ab-k{display:flex;align-items:center;gap:.5vw;color:var(--ink-3);font:700 var(--fs-label) var(--disp);letter-spacing:.18em}
#ab-state{color:var(--ab,var(--ink));font:800 clamp(17px,3.1vh,42px)/1 var(--disp);letter-spacing:.08em}
.livedot{width:.75em;height:.75em;border-radius:50%;background:var(--brand-hi);box-shadow:0 0 .7em var(--brand-hi);flex:none}
#alertbar[data-state=live] .livedot{background:var(--live);box-shadow:0 0 .7em var(--live);animation:pulse 1.4s infinite}
#alertbar[data-state=test] .livedot{background:var(--amber);box-shadow:0 0 .7em var(--amber)}
#ab-chips{gap:0;padding:0!important;min-width:0;overflow:hidden;flex:0 1 auto!important}
.ac{display:flex;flex-direction:column;justify-content:center;gap:.5vh;padding:0 1.2vw;height:100%}
.ac+.ac{border-left:1px solid rgba(255,200,87,.07)}
.ac b{font:800 clamp(17px,3.1vh,42px)/1 var(--disp);display:flex;gap:.6em;align-items:baseline;letter-spacing:.02em}
.ac>span{color:var(--ink-2);font:700 var(--fs-label) var(--disp);letter-spacing:.12em;text-transform:uppercase}
.ac.won>span{color:var(--gold)}
#ab-lead{flex:1 1 0!important;min-width:12vw;white-space:normal;line-height:1.3;color:var(--ink);font:400 clamp(12px,1.95vh,26px) var(--text)}
#ab-lead>span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#ab-lead em{flex:none;margin-right:.9vw;font:800 var(--fs-label) var(--disp);letter-spacing:.18em;color:var(--brand-hi);font-style:normal}
#ab-toast{display:none!important;align-items:center!important;gap:.8vw;min-width:0;flex:1 1 0!important}
#alertbar.toasting #ab-chips,#alertbar.toasting #ab-lead{display:none!important}
#alertbar.toasting #ab-toast{display:flex!important;animation:toastin .45s cubic-bezier(.2,.8,.2,1) both}
#alertbar.toasting{border-color:var(--tk,var(--brand));box-shadow:0 0 1.5vh -.3vh var(--tk,var(--brand))}
#alertbar.t-d{--tk:var(--d)}#alertbar.t-r{--tk:var(--r)}#alertbar.t-o{--tk:var(--o)}#alertbar.t-gold{--tk:var(--gold)}
@keyframes toastin{from{opacity:0;transform:translateX(3vw)}to{opacity:1;transform:none}}
#ab-toast em{flex:none;font:800 clamp(10px,1.6vh,22px) var(--disp);letter-spacing:.1em;padding:.3em .6em;border-radius:.3em;background:var(--tk,var(--brand));color:#fff;font-style:normal;text-transform:uppercase}
#alertbar.t-gold #ab-toast em{color:#1b1203}
#ab-toast b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink);font:600 clamp(12px,2vh,27px) var(--text)}

/* The stage: one scene at a time under its caption bar, in the screen's own units */
#stagebox{flex:1;min-height:0;position:relative;display:flex;flex-direction:column;overflow:hidden}
main{flex:1;display:flex;flex-direction:column;justify-content:center;padding:0 3vw 1vh;min-height:0;position:relative}
.waiting{color:var(--ink-3);font-size:3vh;text-align:center}
.scene{animation:fade .45s ease .18s both;min-height:0;height:100%;display:flex;flex-direction:column}
.sbody{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:safe center;overflow:hidden;
  padding:.8vh;margin:-.8vh}  /* room for the member photos' party rings, which draw outside the photo */
.capbar{flex:none;display:flex;align-items:center;gap:1.4vw;margin:2.4vh 0 1.8vh;height:4.6vh;padding:0 1.4vw 0 0;border-radius:.6vh;overflow:hidden;
  background:var(--glass);box-shadow:var(--glass-edge);font:700 clamp(13px,2.3vh,31px)/1 var(--disp);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-2);
  animation:capin .5s cubic-bezier(.2,.8,.2,1) .15s both}
.capbar::before{content:"";align-self:stretch;width:.8vw;background:linear-gradient(180deg,var(--brand-top),var(--brand))}
.capbar span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.capbar b{flex:none;color:var(--gold);font-weight:800}
@keyframes capin{from{opacity:0;transform:translateX(-3vw)}to{opacity:1;transform:none}}
/* A number that changed on a redraw lights up gold and settles */
.chg{animation:chg 2.4s ease-out!important}
.scene.still .chg{animation:chg 2.4s ease-out!important}
@keyframes chg{0%,35%{color:var(--gold);text-shadow:0 0 2vh rgba(247,183,51,.8)}}
/* odometer digits clip a glow into boxes, so they only change colour */
.odo.chg{animation-name:chgc!important}
@keyframes chgc{0%,35%{color:var(--gold)}}
@keyframes fade{from{opacity:0;transform:translateY(1.5vh)}to{opacity:1;transform:none}}
@keyframes rise{from{opacity:0;transform:translateX(4vw)}to{opacity:1;transform:none}}
@keyframes pulse{50%{opacity:.55}}
@keyframes grow{from{transform:scaleX(0)}to{transform:none}}
.rise{animation:rise .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--dl,0ms)}
/* a redraw with fresh numbers doesn't replay the entrance */
.scene.still,.scene.still *:not(.chg){animation:none!important}
#dots{display:flex;justify-content:center;gap:.8vw;padding:1.5vh 0}
#dots i{width:1vh;height:1vh;border-radius:50%;background:var(--line)}
#dots i.on{background:var(--brand-hi)}
#progress{height:.5vh;background:var(--line)}
#progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--brand),var(--brand-hi))}

/* Map scenes: real state shapes; solid = called, stripes = ahead, lighter grey = race with no votes yet */
.mapscene{display:flex;gap:3vw;align-items:center;min-height:0}
.mapscene .mapbox{flex:1.9;min-width:0}
.usmap{display:block;width:100%;max-height:55vh}
.usmap .st{stroke:var(--bg);stroke-width:1.2;stroke-linejoin:round}
.usmap .st:not([fill]){fill:#162038}
.usmap .st.wait{fill:#26345a}
.usmap .st.d.won{fill:var(--d)}.usmap .st.r.won{fill:var(--r)}.usmap .st.o.won{fill:var(--o)}
.usmap .st.won{animation:fillin .7s ease both;animation-delay:var(--dl,0ms)}
@keyframes fillin{from{fill:#162038}}
.usmap .hb.d{fill:var(--d-tint)}.usmap .hs.d{fill:#3f7ef0}
.usmap .hb.r{fill:var(--r-tint)}.usmap .hs.r{fill:#e0484d}
.usmap .hb.o{fill:var(--o-tint)}.usmap .hs.o{fill:var(--o)}
.usmap .lb{font:800 15px var(--disp);letter-spacing:.04em;text-anchor:middle;dominant-baseline:central;fill:rgba(255,255,255,.3);pointer-events:none}
.usmap .lb.won,.usmap .lb.lean{fill:#fff}.usmap .lb.wait{fill:var(--ink-2)}
.usmap .lb.lean{paint-order:stroke;stroke:rgba(5,10,22,.85);stroke-width:3px}
.usmap .lead-ln{stroke:rgba(184,194,216,.4);stroke-width:1}
.heads{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2.2vh}
.heads li{font:800 clamp(18px,3.8vh,50px)/1.12 var(--disp);letter-spacing:.005em}
.heads small{display:block;margin-top:.6vh;color:var(--ink-3);font:400 var(--fs-small) var(--text);letter-spacing:0}

/* The lower third: a top tier with the CIVIC DESK plate, the part of the crawl going past, when it last updated
   and the LIVE bug; the scrolling results under it, each race on a chip in its leader's colour (solid once called) */
footer{flex:none;display:flex;flex-direction:column;color:var(--ink);contain:paint;box-shadow:0 -1.5vh 4vh -1vh rgba(0,0,0,.7)}
.lt-top{display:flex;align-items:stretch;height:3.6vh;font:800 clamp(12px,2.2vh,30px)/1 var(--disp);letter-spacing:.12em;text-transform:uppercase}
.lt-plate{flex:none;display:flex;align-items:center;gap:.35em;padding:0 2vw;color:#fff;background:linear-gradient(180deg,var(--brand-top),var(--brand-deep));box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.lt-plate b{color:#fff;font-weight:800}.lt-plate em{font-style:normal;color:#fff3d1;text-shadow:0 1px 2px rgba(0,0,0,.35)}  /* pale on the gold plate */
#crawl-sec{flex:1;min-width:0;display:flex;align-items:center;padding:0 1.4vw;color:var(--ink);
  background:linear-gradient(90deg,rgba(74,48,0,.9),rgba(8,14,30,.94) 60%);border-top:1px solid rgba(255,200,87,.2)}
#crawl-sec.pop{animation:secin .5s cubic-bezier(.2,.8,.2,1)}
@keyframes secin{from{opacity:0;transform:translateY(60%)}to{opacity:1;transform:none}}
#lt-upd{flex:none;display:flex;align-items:center;padding:0 1.4vw;color:var(--ink-3);background:rgba(8,14,30,.94);font-size:.8em;letter-spacing:.1em}
#lt-upd:empty{display:none}
#lt-live{flex:none;display:flex;align-items:center;gap:.5em;padding:0 1.4vw;background:#2a3550;color:#fff}
#lt-live:empty{display:none}
#lt-live[data-state=live]{background:linear-gradient(180deg,#ff3b42,#a80f16)}
#lt-live[data-state=live]::before{content:"";width:.6em;height:.6em;border-radius:50%;background:#fff;animation:pulse 1.4s infinite}
#lt-live[data-state=test]{background:linear-gradient(180deg,#ffbf5c,#b7700b);color:#1b1203}
.lt-bot{display:flex;align-items:center;height:5.6vh;font-size:clamp(14px,2.4vh,32px);overflow:hidden;
  background:linear-gradient(180deg,#f4f6fb,#d5dbe8);color:#0a1020;border-top:.3vh solid var(--flag-red)}
footer b#crawl-label{flex:none;padding:0 2vw;height:100%;display:flex;align-items:center;background:#0a1020;color:#fff;font:800 1.05em var(--disp);letter-spacing:.12em}
.track{flex:1;overflow:hidden;white-space:nowrap}
#crawl-track{display:inline-block;white-space:nowrap;animation:crawl linear infinite;animation-duration:120s;will-change:transform;backface-visibility:hidden}
@keyframes crawl{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.ti{display:inline-flex;align-items:center;gap:.6em;margin-right:2.6vw;font:700 1em var(--disp);letter-spacing:.02em}
.ti b.chip{font:800 .9em/1 var(--disp);letter-spacing:.06em;padding:.25em .5em;border-radius:.3em;background:#c3cad8;color:#0a1020}
.ti b.chip.d.lead{background:#d4e3ff;color:#123a86;box-shadow:inset 0 0 0 .18em var(--d)}
.ti b.chip.r.lead{background:#ffdcdc;color:#8a1414;box-shadow:inset 0 0 0 .18em var(--r)}
.ti b.chip.o.lead{background:#ece2ff;color:#4a2f7e;box-shadow:inset 0 0 0 .18em var(--o)}
.ti b.chip.d.won{background:#2463d8;color:#fff}.ti b.chip.r.won{background:#d23439;color:#fff}.ti b.chip.o.won{background:#7d55b8;color:#fff}
.ti em{font-style:normal;font-weight:800}
.ti .d{color:#1b4fb8}.ti .r{color:#b71f1f}.ti .o{color:#5e3c99}
.ti small{color:#4d5873;font:700 .7em var(--disp);letter-spacing:.06em;text-transform:uppercase}
.ti .called{font:800 .62em var(--disp);letter-spacing:.1em;background:#0a1020;color:#fff;padding:.25em .5em;border-radius:.3em}
.ti.sum b{font:800 .9em var(--disp);color:#0a1020;letter-spacing:.06em}
#crawl.alert .lt-bot{background:#1e0407;color:#fff;border-top-color:var(--gold)}
#crawl.alert b#crawl-label{background:#b00000;color:#fff;animation:pulse 1.2s infinite}
#crawl-hold{flex:1;min-width:0;display:flex;align-items:center;height:100%;overflow:hidden}
#crawl-hold[hidden],#crawl.holding .track{display:none}
#crawl-hold .ch-h{flex:1;min-width:0;padding:0 1em;font:800 1.1em var(--disp);letter-spacing:.02em;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;animation:chin .55s cubic-bezier(.2,.8,.2,1) both}
@keyframes chin{from{opacity:0;transform:translateY(60%)}to{opacity:1;transform:none}}

/* Takeovers: a major House vote the moment it closes. The flash bar
   holds still (a light sweeps across it twice) so the words stay readable. */
#takeover{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;cursor:pointer;animation:fade .4s ease;
  background:radial-gradient(ellipse at 50% 30%,#132552 0,var(--bg) 70%);--tkc:var(--brand)}
#takeover[hidden]{display:none}
#takeover.tone-d{--tkc:var(--d);background:radial-gradient(ellipse at 50% 30%,#0b2a5e 0,#020814 70%)}
#takeover.tone-r{--tkc:var(--r);background:radial-gradient(ellipse at 50% 30%,#4a0d14 0,#120203 70%)}
#takeover.tone-o{--tkc:var(--o);background:radial-gradient(ellipse at 50% 30%,#2f2150 0,#0b0714 70%)}
#takeover.tone-gold{--tkc:var(--gold);background:radial-gradient(ellipse at 50% 30%,#3a2a06 0,#120c02 70%)}
#takeover.tone-navy{--tkc:var(--brand)}
#takeover.tone-alert{--tkc:#d4141f;background:radial-gradient(ellipse at 50% 30%,#3d0a10 0,#0c0204 70%)}
.tk-flash{position:relative;background:var(--tkc);padding:2.5vh 4vw;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 1vh 3vh rgba(0,0,0,.5)}
.tk-flash::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);transform:translateX(-100%);animation:sheen 1.4s ease .4s 2}
@keyframes sheen{to{transform:translateX(100%)}}
.tk-flash span{display:block;font:800 clamp(44px,12vh,170px)/1 var(--disp);letter-spacing:.1em;color:#fff;text-transform:uppercase;white-space:nowrap}
#takeover.tone-gold .tk-flash span{color:#1b1203}
#takeover.control .tk-flash{background:linear-gradient(90deg,var(--tkc),var(--tkc) 70%,var(--gold))}
/* key race alert: red with slow gold-edged hazard stripes */
#takeover.tone-alert .tk-flash{background:repeating-linear-gradient(-45deg,#d4141f 0 4vh,#a00c15 4vh 8vh);background-size:11.3vh 11.3vh;animation:hazard 3s linear infinite;border-bottom:.6vh solid var(--gold)}
@keyframes hazard{to{background-position:11.3vh 0}}
.tk-flash .preview{display:inline;font-size:.32em;letter-spacing:.1em;vertical-align:.6em;margin-left:1em}
.tk-body{flex:1;display:flex;flex-direction:column;justify-content:center;padding:0 5vw;min-height:0}
.tk-kicker{color:var(--ink-2);font:800 clamp(16px,3.2vh,42px) var(--disp);letter-spacing:.1em;text-transform:uppercase;margin-bottom:2vh}
#takeover h1{margin:0;color:#fff;font:800 clamp(40px,11vh,160px)/1.02 var(--disp);letter-spacing:.005em}
#takeover h1 small{font-size:.45em;color:var(--ink-2)}
.tk-cands{margin-top:4.5vh;max-width:78vw}
.tk-cands .cand{font-size:clamp(18px,4vh,54px);margin-bottom:2.2vh}
.tk-cands .cand .cbar{height:1.6vh}
.tk-on{margin:1.5vh 0 0;color:var(--ink-2);font:400 clamp(14px,2.7vh,36px) var(--text)}
.tk-chamber{margin-top:3vh;max-width:70vw}
.tk-chamber .ch{min-height:46vh}
.tk-h2h{margin-top:3.5vh}
.tk-h2h .side{padding:2.4vh 2vw}.tk-h2h .side .pct{font-size:min(14vh,7vw)}
.tk-states{display:flex;flex-wrap:wrap;gap:1.6vh;margin-top:3vh}
.tk-states span{font:800 clamp(26px,8.5vh,116px)/1 var(--disp);background:rgba(255,255,255,.08);box-shadow:var(--glass-edge);border-radius:1vh;padding:.2em .4em;animation:rise .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--dl,0ms)}
.tk-list{list-style:none;margin:4vh 0 0;padding:0;columns:2;column-gap:5vw;font:400 clamp(14px,2.7vh,36px) var(--text)}
.tk-list li{break-inside:avoid;padding:.6vh 0}.tk-list b{font:800 1.1em var(--disp);letter-spacing:.02em;margin-right:.5em}
.tk-progress{height:.8vh;background:rgba(255,255,255,.08)}
.tk-progress i{display:block;height:100%;width:0;background:#fff}

/* Odometer numbers: one column of digits per place, rolled into position */
.odo{display:inline-flex;vertical-align:baseline}
.odo .dg{display:inline-block;height:1em;line-height:1;overflow:hidden;font-variant-numeric:tabular-nums}
.odo .col{display:flex;flex-direction:column}
.odo .col i{display:block;height:1em;font-style:normal;text-align:center}
.odo.go .col{transition:transform 1.5s cubic-bezier(.2,.8,.2,1)}
.odo.go .dg:nth-child(2) .col{transition-delay:.12s}.odo.go .dg:nth-child(3) .col{transition-delay:.24s}

/* The scene change: a thin red, white and blue stripe sweeps across the stage */
#wipe{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:4}
#wipe .band{position:absolute;top:-10%;bottom:-10%;left:0;width:9vw;display:flex;transform:translateX(-20vw) skewX(-22deg);opacity:0}
#wipe .band i{flex:none;height:100%}
#wipe .band i:nth-child(1){width:2.6vw;background:var(--flag-red)}
#wipe .band i:nth-child(2){width:1.4vw;background:var(--flag-white)}
#wipe .band i:nth-child(3){width:5vw;background:linear-gradient(90deg,var(--flag-blue),rgba(47,98,230,0))}
#wipe.go .band{animation:wipe .6s cubic-bezier(.5,0,.3,1) both}
@keyframes wipe{0%{transform:translateX(-20vw) skewX(-22deg);opacity:1}100%{transform:translateX(110vw) skewX(-22deg);opacity:1}}

/* Messages, screen off, full screen */
#notice{position:fixed;left:50%;bottom:9vh;transform:translateX(-50%);z-index:31;max-width:80vw;padding:2.2vh 3.5vw;border-radius:1.6vh;
  background:#0f1526f2;border:.35vh solid var(--gold);box-shadow:0 2vh 6vh #000c;color:var(--ink);font:600 clamp(18px,4.2vh,56px)/1.25 var(--text);text-align:center;animation:fade .4s ease}
#notice[hidden],#screenoff[hidden]{display:none}
#screenoff{position:fixed;inset:0;z-index:30;background:#000}
body.tk-on #screenoff{display:none}
#fullscreen{position:fixed;left:1.2vw;bottom:8vh;background:none;border:1px solid var(--line);color:var(--ink-3);border-radius:8px;font-size:22px;padding:4px 10px;cursor:pointer;opacity:0;transition:opacity .3s;z-index:5}
/* the corner button sits bottom left, clear of the station bug; the public TVs have Full screen in their channel bar instead */
body[data-public="1"] #fullscreen{display:none}
body.pointer #fullscreen{opacity:1}


/* ----- Civicdesk ----- */
:root{--yea:#2fbf8f;--yea-hi:#7fe0bd;--nay:#f08a3c;--nay-hi:#ffbb85;--nv:#3a4566}
.yea{color:var(--yea-hi)}.nay{color:var(--nay-hi)}
#alertbar .ac b .o{color:var(--o-hi)}

/* Official outcome badges and positions */
.oc{display:inline-block;font:800 var(--fs-body)/1 var(--disp);letter-spacing:.08em;text-transform:uppercase;padding:.3em .6em;border-radius:.3em;background:#2a3550;color:#fff}
.oc-pass{background:linear-gradient(180deg,#3fd19f,#1d8e68);color:#04170f}.oc-fail{background:linear-gradient(180deg,#ffa25e,#c4611b);color:#1f0d02}
.need{margin-left:1vw;color:var(--ink-3);font:400 var(--fs-small) var(--text)}
.pos{flex:none;font:800 var(--fs-body)/1 var(--disp);letter-spacing:.08em;text-transform:uppercase;padding:.25em .55em;border-radius:.3em;background:var(--nv);color:var(--ink-2)}
.pos.yea{background:var(--yea);color:#04170f}.pos.nay{background:var(--nay);color:#1f0d02}.pos.pres{background:#5a6688;color:#fff}

/* Member photos: a party-coloured ring; initials show if the photo is missing */
.ph{position:relative;flex:none;display:inline-flex;align-items:center;justify-content:center;width:13vh;height:13vh;border-radius:50%;overflow:hidden;
  background:#1a2440;box-shadow:0 0 0 .45vh var(--o),0 1vh 3vh rgba(0,0,0,.5)}
.ph.d{box-shadow:0 0 0 .45vh var(--d),0 1vh 3vh rgba(0,0,0,.5)}.ph.r{box-shadow:0 0 0 .45vh var(--r),0 1vh 3vh rgba(0,0,0,.5)}
.ph b{font:800 4.5vh/1 var(--disp);color:var(--ink-3)}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.ph.sm{width:6.4vh;height:6.4vh;box-shadow:0 0 0 .3vh var(--o)}.ph.sm b{font-size:2.4vh}
.ph.sm.d{box-shadow:0 0 0 .3vh var(--d)}.ph.sm.r{box-shadow:0 0 0 .3vh var(--r)}

/* How each party voted: one bar per party */
.splits{display:flex;flex-direction:column;gap:1.3vh}
.sb{display:grid;grid-template-columns:9.5em minmax(0,1fr) 8.5em;gap:1vw;align-items:center;font:700 var(--fs-body) var(--disp);letter-spacing:.04em}
.sb-p{text-transform:uppercase}.sb-p.d{color:var(--d-hi)}.sb-p.r{color:var(--r-hi)}.sb-p.o{color:var(--o-hi)}
.sb-bar{display:flex;height:2.4vh;border-radius:.5vh;overflow:hidden;background:#0f1730}
.sb-bar i{display:block;height:100%;transform-origin:left;animation:grow 1.1s cubic-bezier(.2,.8,.2,1) .4s both}
.sb-bar i.yea{background:linear-gradient(180deg,#63e0b4,var(--yea))}.sb-bar i.nay{background:linear-gradient(180deg,#ffae73,var(--nay))}
.sb-bar i.pres{background:#7d88a8}.sb-bar i.nv{background:var(--nv)}
.sb-n{display:flex;align-items:baseline;gap:.25em;white-space:nowrap;font-size:1.05em}.sb-n small{margin-left:.6em;color:var(--ink-3);font:400 .62em var(--text)}

/* The latest vote: the half-circle on the left, what it was and how it went on the right */
.lv{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:3.5vw;align-items:center}
.vhemi{margin:0}.vhemi svg{display:block;width:100%;max-height:50vh}
.vhemi circle{fill:var(--nv)}
.vhemi circle.yea.d{fill:var(--d)}.vhemi circle.yea.r{fill:var(--r)}.vhemi circle.yea.o{fill:var(--o)}
.vhemi circle.nay{fill:transparent;stroke-width:.95}.vhemi circle.nay.d{stroke:var(--d)}.vhemi circle.nay.r{stroke:var(--r)}.vhemi circle.nay.o{stroke:var(--o)}
.vhemi circle.pres{fill:#7d88a8}.vhemi circle.nv{fill:#26304a}
.vh-y{font:800 26px var(--disp);fill:var(--yea-hi)}.vh-dash{fill:var(--ink-3)}.vh-n{fill:var(--nay-hi)}
.vh-k{font:800 6px var(--disp);letter-spacing:.2em;fill:var(--ink-3)}
.key{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.6vh 1.6vw;margin:2vh 0 0;font:700 var(--fs-label) var(--disp);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.key i{display:inline-block;width:1.6vh;height:1.6vh;border-radius:50%;margin-right:-.9vw;vertical-align:-.2em}
.key i.yea{background:var(--ink-2)}.key i.nay{border:.3vh solid var(--ink-2)}.key i.nv{background:#26304a}
.key i.dd{background:var(--d)}.key i.rr{background:var(--r)}.key i.oo{background:var(--o)}.key i.vv{background:var(--nv)}
.key .kp{display:flex;gap:.9vw}.key .kp b{font-size:1.3em}
.lv-bill{color:var(--gold);font:800 var(--fs-title)/1 var(--disp);letter-spacing:.1em;text-transform:uppercase}
.lv-q{margin:1vh 0 1.4vh;font:800 var(--fs-head)/1 var(--disp);letter-spacing:.01em}
.lv-t{margin:0 0 2.4vh;color:var(--ink-2);font:400 var(--fs-body)/1.35 var(--text);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.lv-r .splits{margin-top:3vh}
.lv-mine{list-style:none;margin:3vh 0 0;padding:2vh 0 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:1.4vh}
.lv-mine li{display:flex;align-items:center;gap:1.2vw;font:800 var(--fs-title)/1 var(--disp)}
.lv-mine li>span:not(.ph){flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lv-mine small{color:var(--ink-3);font:700 .55em var(--disp);letter-spacing:.1em}

/* Your delegation: a card per member */
.mcs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.4vw}
.mcs.n1{grid-template-columns:minmax(0,1fr);max-width:60vw}.mcs.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mc{display:flex;flex-direction:column;background:var(--glass);box-shadow:var(--glass-edge);border-radius:1.4vh;padding:3vh 1.6vw 2.4vh;min-width:0}
.mc-top{display:flex;gap:1.4vw;align-items:center}
.mc-top>div{min-width:0}
.mc h3{margin:0;font:800 var(--fs-title)/1.05 var(--disp)}
.mc-sub{margin:.8vh 0 0;color:var(--ink-3);font:400 var(--fs-small)/1.3 var(--text)}
.pty{font:800 .95em var(--disp);letter-spacing:.06em;text-transform:uppercase}.pty.d{color:var(--d-hi)}.pty.r{color:var(--r-hi)}.pty.o{color:var(--o-hi)}
.mc-stats{display:grid;grid-template-columns:1fr 1fr;gap:1vw;margin:3vh 0 2vh;padding:2vh 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.mc-stats dt{color:var(--ink-3);font:700 var(--fs-label) var(--disp);letter-spacing:.14em;text-transform:uppercase}
.mc-stats dd{margin:.6vh 0 0;font:800 clamp(26px,7vh,96px)/1 var(--disp)}
.mc-stats dd small{display:block;margin-top:.6vh;color:var(--ink-3);font:400 var(--fs-small) var(--text)}
.mc-votes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.2vh}
.mc-votes li{display:flex;align-items:center;justify-content:space-between;gap:1vw;font:700 var(--fs-small)/1.2 var(--disp);letter-spacing:.03em;color:var(--ink-2)}
.mc-votes li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mc-votes .pos{font-size:var(--fs-small)}

/* Lists of votes: major, closest */
.vrows{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.4vh}
.vrows li{display:grid;grid-template-columns:5.2em minmax(0,1fr) minmax(0,.9fr) 14vw;gap:1.6vw;align-items:center;border-bottom:1px solid var(--line);padding-bottom:1.2vh}
.ch-tag{font:800 var(--fs-label)/1 var(--disp);letter-spacing:.14em;text-align:center;padding:.5em 0;border-radius:.3em;background:#2a3550}
.ch-tag.senate{background:var(--brand-deep);color:var(--brand-hi)}
.vrows .lbl{font:800 clamp(16px,3vh,40px)/1.05 var(--disp);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vrows .lbl small{display:block;margin-top:.5vh;color:var(--ink-3);font:400 var(--fs-small) var(--text);overflow:hidden;text-overflow:ellipsis}
.vrows .splits{gap:.4vh}.vrows .sb{grid-template-columns:1.4em minmax(0,1fr) 4.4em;font-size:var(--fs-small)}.vrows .sb-bar{height:1.4vh}.vrows .sb-n small{display:none}
.vrows .tot{display:flex;flex-direction:column;align-items:flex-end;gap:.8vh;font:800 var(--fs-title)/1 var(--disp);white-space:nowrap}
.vrows .tot .oc{font-size:var(--fs-label);max-width:14vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* The Senate vote map */
.mapside{flex:1;min-width:0}
.usmap .st.yea{fill:var(--yea)}.usmap .st.nay{fill:var(--nay)}.usmap .st.split{fill:#7d6bd1}.usmap .st.nv{fill:#3a4566}
.usmap .st.yea,.usmap .st.nay,.usmap .st.split,.usmap .st.nv{animation:fillin .7s ease both;animation-delay:var(--dl,0ms)}
@keyframes fillin{from{fill:#162038}}
.usmap .lb.yea,.usmap .lb.nay{fill:#0a1020}.usmap .lb.split,.usmap .lb.nv{fill:#fff}
.mapside .lv-q{font-size:var(--fs-title)}
.mkey{list-style:none;margin:3vh 0 2vh;padding:0;display:flex;flex-direction:column;gap:1.3vh}
.mkey li{display:flex;align-items:center;gap:1vw;font:700 var(--fs-body) var(--disp);letter-spacing:.04em}
.mkey li b{margin-left:auto;font:800 var(--fs-title)/1 var(--disp)}
.mkey i{width:2.4vh;height:2.4vh;border-radius:.4vh}.mkey i.yea{background:var(--yea)}.mkey i.nay{background:var(--nay)}.mkey i.split{background:#7d6bd1}.mkey i.nv{background:#3a4566}
.mapside .muted{font:400 var(--fs-body) var(--text)}

/* Crossing party lines, missed votes: two columns */
.bks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3vw}
.bk h2{margin:0 0 2vh;font:800 var(--fs-title)/1 var(--disp);letter-spacing:.1em;text-transform:uppercase;padding-bottom:1.2vh;border-bottom:.5vh solid var(--brand)}
.bk.d h2{border-color:var(--d);color:var(--d-hi)}.bk.r h2{border-color:var(--r);color:var(--r-hi)}
.bk ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.6vh}
.bk li{display:flex;align-items:center;gap:1.2vw}
.bk .nm{flex:1;min-width:0;font:800 var(--fs-title)/1.05 var(--disp);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bk .nm small{display:block;margin-top:.4vh;color:var(--ink-3);font:700 var(--fs-label) var(--disp);letter-spacing:.12em}
.bk-n{flex:none;text-align:right}.bk-n b{font:800 clamp(24px,5.6vh,76px)/1 var(--disp)}
.bk-n small{display:block;color:var(--ink-3);font:400 var(--fs-small) var(--text)}

/* Who holds the seats */
.seats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4vw;align-items:end}
.shemi{margin:0}.shemi svg{display:block;width:100%;max-height:48vh}
.shemi circle{fill:var(--nv)}.shemi circle.d{fill:var(--d)}.shemi circle.r{fill:var(--r)}.shemi circle.o{fill:var(--o)}
.shemi text.big{font:800 22px var(--disp)}.shemi text.d{fill:var(--d-hi)}.shemi text.r{fill:var(--r-hi)}
.shemi figcaption{display:flex;flex-direction:column;align-items:center;gap:.6vh;margin-top:1vh}
.shemi figcaption b{font:800 var(--fs-title) var(--disp);letter-spacing:.08em;text-transform:uppercase}
.shemi figcaption span{color:var(--ink-3);font:400 var(--fs-small) var(--text)}

/* This week on the House floor */
.floor{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.2vh 2vw}
.floor li{background:var(--glass);box-shadow:var(--glass-edge);border-radius:1vh;padding:1.8vh 1.2vw;min-width:0}
.floor b{display:block;color:var(--gold);font:800 var(--fs-title)/1 var(--disp);letter-spacing:.04em}
.floor span{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-top:.8vh;color:var(--ink-2);font:400 var(--fs-small)/1.3 var(--text)}

/* How to read this */
.explain{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.6vh 2.2vw}
.ex{background:var(--glass);box-shadow:var(--glass-edge);border-radius:1.4vh;padding:2.6vh 1.6vw}
.ex h3{margin:0;color:var(--gold);font:800 var(--fs-title)/1 var(--disp);letter-spacing:.06em;text-transform:uppercase}
.ex p{margin:1.4vh 0 0;color:var(--ink-2);font:400 var(--fs-small)/1.4 var(--text)}

/* The crawl */
.ti b.chip.house{background:#c3cad8;color:#0a1020}.ti b.chip.senate{background:var(--brand-deep);color:#fff}
.ti b.chip.d.won{background:#2463d8;color:#fff}.ti b.chip.r.won{background:#d23439;color:#fff}.ti b.chip.o.won{background:#7d55b8;color:#fff}
.ti .oc-t{font:800 .7em var(--disp);letter-spacing:.08em;text-transform:uppercase;padding:.25em .5em;border-radius:.3em;background:#0a1020;color:#fff}
.ti .oc-t.pass{background:#1d8e68}.ti .oc-t.fail{background:#c4611b}
.ti em .yea{color:#137a56}.ti em .nay{color:#b4520f}
.ti .pos{font-size:.75em}
.ti .d{color:#1b4fb8}.ti .r{color:#b71f1f}.ti .o{color:#5e3c99}

/* The takeover: a House vote */
#takeover.tone-yea{--tkc:#1d8e68;background:radial-gradient(ellipse at 50% 30%,#0b3a2a 0,#020a07 70%)}
#takeover.tone-nay{--tkc:#c4611b;background:radial-gradient(ellipse at 50% 30%,#3d1d06 0,#0c0602 70%)}
.tk-t{margin:2vh 0 0;max-width:80vw;color:var(--ink-2);font:400 clamp(16px,3vh,40px)/1.3 var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tk-vote{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:4vw;align-items:center;margin-top:4vh}
.tk-vote .lv-mine{margin:0;border:0;padding:0}
.tk-vote .sb{font-size:clamp(16px,3.4vh,46px)}.tk-vote .sb-bar{height:3.4vh}.tk-vote .splits{gap:2vh}
.tk-vote .lv-mine li{font-size:clamp(20px,4.6vh,62px)}.tk-vote .ph.sm{width:10vh;height:10vh}

@media (max-aspect-ratio:1/1){
  .lv,.mcs,.mcs.n2,.bks,.seats,.explain,.floor,.tk-vote{grid-template-columns:minmax(0,1fr)}
  .vrows li{grid-template-columns:4.4em minmax(0,1fr) 22vw}.vrows .splits{display:none}
  .mapscene{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){
  .scene,.rise,#takeover,#alertbar.toasting #ab-toast,.tk-flash::after,#crawl-sec.pop,.capbar,.chg,.sb-bar i,.usmap .st{animation:none!important}
  #wipe{display:none}
  #crawl-track{animation:none!important}
}

/* bills, money, stock trades */
.lv-sum{margin:1.6vh 0 0;color:var(--ink-2);font:400 var(--fs-small)/1.35 var(--text);display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.lv-sum small{display:block;margin-top:.6vh;color:var(--gold);font:700 var(--fs-label) var(--disp);letter-spacing:.12em;text-transform:uppercase}
.laws{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2vh}
.laws li{display:grid;grid-template-columns:10vw minmax(0,1fr) auto;gap:1.6vw;align-items:start;border-bottom:1px solid var(--line);padding-bottom:1.6vh}
.laws b{white-space:nowrap;color:var(--gold);font:800 var(--fs-title)/1 var(--disp);letter-spacing:.04em}
.laws span{font:800 var(--fs-title)/1.08 var(--disp);min-width:0}
.laws span small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:.6vh;color:var(--ink-3);font:400 var(--fs-small)/1.3 var(--text)}
.laws em{font:800 var(--fs-small) var(--disp);font-style:normal;text-align:right;color:var(--ink-2);letter-spacing:.06em}
.laws em small{display:block;color:var(--ink-3);font-weight:400}
.mcs .mc-stats{grid-template-columns:1fr 1fr}
.trl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.5vh}
.trl li{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.1fr) auto;gap:1.2vw;align-items:center}
.trl .nm{font:800 var(--fs-title)/1.05 var(--disp);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trl .nm small{display:block;margin-top:.4vh;color:var(--ink-3);font:700 var(--fs-label) var(--disp);letter-spacing:.12em}
.trl .tr{font:800 var(--fs-title)/1.05 var(--disp);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trl .tr small{display:block;color:var(--ink-3);font:400 var(--fs-small) var(--text);overflow:hidden;text-overflow:ellipsis}
.trl .bk-n b{font-size:var(--fs-title)}
.sc-late .key{margin-top:3vh}

/* party-line sparkline on member cards */
.pline{margin:0 0 2vh}
.pline svg{display:block;width:100%;height:4.4vh;overflow:visible}
.pl-top{stroke:var(--line-2);stroke-width:1;stroke-dasharray:2 3;vector-effect:non-scaling-stroke}
.pl-ln{fill:none;stroke:var(--brand-hi);stroke-width:2.5;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.pline.d .pl-ln{stroke:var(--d-hi)}.pline.r .pl-ln{stroke:var(--r-hi)}.pline.o .pl-ln{stroke:var(--o-hi)}
.pl-br{stroke:var(--gold);stroke-width:2;vector-effect:non-scaling-stroke}
.pline figcaption{margin-top:.7vh;color:var(--ink-3);font:700 var(--fs-label) var(--disp);letter-spacing:.12em;text-transform:uppercase}
.pline figcaption b{color:var(--gold)}
.mc .mc-stats{margin-bottom:1.6vh}

/* Bill spotlight */
.bs{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:3.5vw;align-items:start}
.bs-t{margin:1vh 0 0;font:800 clamp(24px,5.4vh,74px)/1.02 var(--disp);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bs-sum{-webkit-line-clamp:6;font-size:var(--fs-body)}
.bs-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6vh 2vw;margin:3vh 0 0;padding-top:2vh;border-top:1px solid var(--line)}
.bs-facts dt{color:var(--ink-3);font:700 var(--fs-label) var(--disp);letter-spacing:.14em;text-transform:uppercase}
.bs-facts dd{margin:.4vh 0 0;font:800 var(--fs-title)/1.05 var(--disp);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bs-r{background:var(--glass);box-shadow:var(--glass-edge);border-radius:1.4vh;padding:2.8vh 1.6vw}
.bs-r h3{margin:0 0 1.4vh;color:var(--gold);font:800 var(--fs-title)/1 var(--disp);letter-spacing:.1em;text-transform:uppercase}
.bs-now{margin:0 0 2vh;font:600 var(--fs-body)/1.3 var(--text);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bs-now b{display:inline-block;margin-right:.6em;padding:.1em .45em;border-radius:.3em;background:var(--yea);color:#04170f;font:800 .9em var(--disp);letter-spacing:.06em}
.bs-now small{display:block;margin-top:.5vh;color:var(--ink-3);font:400 var(--fs-small) var(--text)}
.bs-votes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.2vh}
.bs-votes li{display:grid;grid-template-columns:4.6em minmax(0,1fr) auto auto;gap:1vw;align-items:center;border-top:1px solid var(--line);padding-top:1.2vh}
.bs-votes .lbl{font:800 var(--fs-body)/1.05 var(--disp);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bs-votes .lbl small{display:block;color:var(--ink-3);font:400 var(--fs-small) var(--text)}
.bs-votes .tot{font:800 var(--fs-title)/1 var(--disp);white-space:nowrap}
.bs-votes .oc{font-size:var(--fs-label)}
.bs-lobby{margin:2.2vh 0 0;color:var(--ink-2);font:400 var(--fs-small) var(--text)}.bs-lobby b{color:var(--gold);font:800 1.4em var(--disp)}

/* Said and did: headlines on the left, roll calls on the right, dates down the middle */
.said{display:flex;flex-direction:column;min-height:0}
.said-h{display:flex;align-items:baseline;gap:1.4vw;margin-bottom:2vh;min-width:0}
.said-h b{flex:none;color:var(--gold);font:800 var(--fs-title)/1 var(--disp);letter-spacing:.08em}
.said-h span{min-width:0;font:800 var(--fs-title)/1.1 var(--disp);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.said-cols,.said-tl li{display:grid;grid-template-columns:minmax(0,1fr) 8vw minmax(0,1fr);gap:1.4vw;align-items:center}
.said-cols{margin-bottom:1vh;color:var(--ink-3);font:700 var(--fs-label) var(--disp);letter-spacing:.16em;text-transform:uppercase}
.said-cols span:first-child{text-align:right}
.said-tl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.1vh;position:relative}
.said-tl::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:.3vh;margin-left:-.15vh;background:var(--line-2)}
.said-tl time{position:relative;justify-self:center;padding:.3em .7em;border-radius:2em;background:var(--bg);box-shadow:0 0 0 1px var(--line-2);
  color:var(--ink-2);font:800 var(--fs-small)/1 var(--disp);letter-spacing:.06em;white-space:nowrap}
.said-tl li.v time{background:var(--brand-deep);box-shadow:0 0 0 1px var(--brand);color:#fff}
.said-tl .sl{text-align:right;font:600 var(--fs-small)/1.25 var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.said-tl .sl small{display:block;margin-top:.3vh;color:var(--ink-3);font:700 var(--fs-label) var(--disp);letter-spacing:.12em;text-transform:uppercase}
.said-tl .sr{display:flex;align-items:center;gap:1vw;min-width:0}
.said-tl .sr .ch-tag{flex:none;width:4.6em}
.said-tl .sr .q{flex:1;min-width:0;font:800 var(--fs-body)/1.05 var(--disp);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.said-tl .sr .tot{font:800 var(--fs-title)/1 var(--disp);white-space:nowrap}
.said-tl .sr .oc{font-size:var(--fs-label)}

/* Most-lobbied bills */
.lob{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.4vh}
.lob li{display:grid;grid-template-columns:9vw minmax(0,1.3fr) minmax(0,1fr) 9vw;gap:1.6vw;align-items:center;border-bottom:1px solid var(--line);padding-bottom:1.4vh}
.lb-id{color:var(--gold);font:800 var(--fs-title)/1 var(--disp);letter-spacing:.04em;white-space:nowrap}
.lb-t{min-width:0;font:800 var(--fs-body)/1.1 var(--disp);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-t small{display:block;margin-top:.5vh;color:var(--ink-3);font:400 var(--fs-small) var(--text);overflow:hidden;text-overflow:ellipsis}
.lb-bar{height:2.2vh;border-radius:.5vh;background:#0f1730;overflow:hidden}
.lb-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--brand-hi));transform-origin:left;animation:grow 1.1s cubic-bezier(.2,.8,.2,1) .4s both}
.lb-n{text-align:right}.lb-n b{font:800 clamp(24px,5.4vh,72px)/1 var(--disp)}
.lb-n small{display:block;color:var(--ink-3);font:400 var(--fs-small) var(--text)}
.sc-lobbied .key{margin-top:2.4vh;text-transform:none;letter-spacing:.02em;font:400 var(--fs-small) var(--text)}

/* In your legislature */
.sbills .sv{font:800 .8em var(--disp);letter-spacing:.06em;text-transform:uppercase;padding:.15em .45em;border-radius:.3em;background:var(--nv);color:var(--ink)}
.sbills .sv.yea{background:var(--yea);color:#04170f}.sbills .sv.nay{background:var(--nay);color:#1f0d02}
.sbills em{white-space:nowrap}

/* the strip's pop-up for a major vote: one yes/no bar, cut by party */
.tbar{flex:0 0 22vw;display:flex;height:2.4vh;border-radius:.4vh;overflow:hidden;background:#0f1730;transform-origin:left;animation:grow 1s cubic-bezier(.2,.8,.2,1) .35s both}
.tbar i{display:block;height:100%;border-top:.55vh solid var(--nv)}
.tbar i.yea{background:var(--yea)}.tbar i.nay{background:var(--nay)}
.tbar i.d{border-top-color:var(--d)}.tbar i.r{border-top-color:var(--r)}.tbar i.o{border-top-color:var(--o)}
.tbar i+i{box-shadow:inset 1px 0 0 rgba(0,0,0,.45)}

/* the takeover: the half-circle sweeps in, the count runs up, the result lands */
.tk-vote{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.tk-hemi .vhemi svg{max-height:46vh}
.tk-hemi circle{transform-box:fill-box;transform-origin:center;animation:dotin .45s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--dl,0ms)}
.tk-hemi text{animation:fade .5s ease 1.2s both}
@keyframes dotin{from{opacity:0;transform:scale(0)}}
.tk-side{display:flex;flex-direction:column;gap:3vh;min-width:0}
.tk-stamp{display:inline-block;padding:0 .18em;border:.08em solid currentColor;border-radius:.08em;transform-origin:50% 60%;animation:stamp .5s cubic-bezier(.3,1.5,.5,1) 1.3s both}
#takeover.tone-yea .tk-stamp{color:var(--yea-hi)}#takeover.tone-nay .tk-stamp{color:var(--nay-hi)}
@keyframes stamp{from{opacity:0;transform:scale(1.9) rotate(-4deg)}to{opacity:1;transform:rotate(-2deg)}}
@media (max-aspect-ratio:1/1){.bs,.tk-vote{grid-template-columns:minmax(0,1fr)}.lob li{grid-template-columns:minmax(0,1fr) 9vw}.lob .lb-id,.lob .lb-bar{display:none}}
@media (prefers-reduced-motion:reduce){.tk-hemi circle,.tk-hemi text,.tk-stamp,.tbar,.lb-bar i{animation:none!important}}

/* hearings, watching, your week */
.hears li{grid-template-columns:8vw minmax(0,1fr) auto}
.hears b small{display:block;margin-top:.5vh;color:var(--ink-3);font:400 var(--fs-label) var(--text);letter-spacing:0;white-space:nowrap}
.hears li.mine span small i{font-style:normal;color:var(--gold)}
.tvweek{max-width:70vw;margin:0 auto;columns:1}
.tvweek p{margin:0 0 2.4vh;font:400 var(--fs-body)/1.45 var(--text);color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.tvweek p:first-child{font:800 var(--fs-title)/1.2 var(--disp);color:var(--ink)}

/* the StateSig mark, just above the strip and crawl */
/* the station bug: lined up with the clock's right edge, centred on the scene dots */
body .lab-mark.lab-tv{right:3vw;bottom:10.2vh}

/* a bill that became law: its summary under the title */
#takeover .tk-law{max-width:70vw;margin:2.4vh 0 0;color:var(--ink-2);font:400 var(--fs-body)/1.45 var(--text)}
@media (max-aspect-ratio:1/1){.rcs{grid-template-columns:minmax(0,1fr)}}