/* politic.design illustrations — shared frame */
[data-illo]{position:relative;width:100%;height:100%}
.il{position:relative;width:100%;height:100%;background:#0E2240;color:#fff;overflow:hidden;container-type:size;font-family:'IBM Plex Mono',ui-monospace,monospace}
.il i{font-style:normal}
.il-count{position:absolute;left:5cqw;top:4cqh;display:flex;align-items:center;gap:3cqw;z-index:2}
.il-big{font-family:Montserrat,Arial,sans-serif;font-weight:900;font-size:13cqw;line-height:1;color:#F2B33D}
.il-lab{font-size:3.2cqw;line-height:1.3;letter-spacing:.08em;text-transform:uppercase}
.il-lab em{font-style:normal;color:#9FB6DA}
.il-ctl{position:absolute;left:5cqw;right:5cqw;bottom:2.5cqh;display:flex;align-items:center;gap:2cqw;z-index:3}
.il-play{font:11px 'IBM Plex Mono',monospace;letter-spacing:.1em;padding:0 10px;min-height:44px;background:#fff;color:#0E2240;border:0;cursor:pointer}
.il-cap{flex:1;font-size:max(11px,2.6cqw);line-height:1.3;color:#DCE6F5}
.il-chip{font:12px 'IBM Plex Mono',monospace;width:44px;height:44px;border:1px solid #fff;background:transparent;color:#fff;cursor:pointer}
.il-chip.on{background:#F2B33D;color:#0E2240}
.paused *{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){.il *{animation-duration:.001s!important;animation-iteration-count:1!important}}

/* weight transfer */
.iw-root .il-count{left:4cqw}
.iw-root .il-lab{font-size:2.2cqw}
.iw-num{position:relative;display:block;width:22cqw;height:9cqw;font-family:Montserrat,Arial,sans-serif;font-weight:900;font-size:8.5cqw;line-height:1}
.iw-num span{position:absolute;left:0;top:0}
.iw-y24{color:#E97D74;animation:iw-a 9s infinite}.iw-y26{color:#F2B33D;animation:iw-b 9s infinite}
@keyframes iw-a{0%,24%{opacity:1}34%,94%{opacity:0}100%{opacity:1}}
@keyframes iw-b{0%,30%{opacity:0}42%,90%{opacity:1}100%{opacity:0}}
.iw-key{position:absolute;right:4cqw;top:5cqh;display:flex;gap:1.6cqw;font-size:2cqw;letter-spacing:.08em}
.iw-key span,.tb-key span,.hs-key span,.sv-key span{display:flex;align-items:center;gap:.8cqw}
.iw-key i{display:block;width:1.7cqw;height:1.7cqw}
.iw-beam{position:absolute;left:6%;right:6%;top:66%;height:0;transform-origin:50% 50%;animation:iw-tilt 9s ease-in-out infinite}
.iw-bar{position:absolute;left:0;right:0;top:0;height:1cqw;background:#fff;border-radius:1cqw}
@keyframes iw-tilt{0%,14%{transform:rotate(2.4deg)}44%,86%{transform:rotate(-6deg)}100%{transform:rotate(2.4deg)}}
.iw-pile{position:absolute;bottom:0;width:12.6cqw;margin-left:-6.3cqw}
.iw-pile.women{animation:iw-w 9s ease-in-out infinite}.iw-pile.men{animation:iw-m 9s ease-in-out infinite}
@keyframes iw-w{0%,14%{left:35%}44%,86%{left:15%}100%{left:35%}}
@keyframes iw-m{0%,14%{left:73%}44%,86%{left:46%}100%{left:73%}}
.iw-u{position:absolute;width:1.7cqw;height:1.7cqw;animation:iw-drop .55s cubic-bezier(.3,1.4,.5,1) both}
.women .iw-u{background:#2F6FE4}
.men .iw-u{background:#D2443B;animation:iw-drop .55s cubic-bezier(.3,1.4,.5,1) both,iw-men 9s ease-in-out infinite}
@keyframes iw-drop{from{transform:translateY(-40cqh);opacity:0}}
@keyframes iw-men{0%,14%{background:#D2443B}44%,86%{background:#9FC0FA}100%{background:#D2443B}}
.iw-pivot{position:absolute;left:50%;top:66%;width:0;height:0;border-left:3cqw solid transparent;border-right:3cqw solid transparent;border-bottom:6cqw solid #F2B33D;transform:translate(-50%,1cqw)}
.iw-pl,.iw-d,.iw-r{position:absolute;top:calc(66% + 8.5cqw);font-size:2cqw;letter-spacing:.1em}
.iw-pl{left:50%;transform:translateX(-50%);color:#F2B33D;white-space:nowrap}
.iw-d{left:6%;color:#9FB6DA}.iw-r{right:6%;color:#9FB6DA}
.iw-root .il-ctl .il-cap{font-size:max(11px,2.1cqw)}

/* receipt */
.ir-paper{position:absolute;left:9cqw;right:9cqw;top:22cqh;bottom:16cqh;background:#fff;color:#0E2240;padding:4cqw 5cqw;display:flex;flex-direction:column;gap:2.2cqw;box-shadow:0 2cqw 5cqw rgba(0,0,0,.4);animation:ir-feed 10s ease-in-out infinite}
@keyframes ir-feed{0%{transform:translateY(30%) rotate(-2deg)}12%,88%{transform:translateY(0) rotate(-2deg)}100%{transform:translateY(30%) rotate(-2deg)}}
.ir-head{font-family:Montserrat,Arial,sans-serif;font-weight:900;font-size:6cqw;text-align:center;letter-spacing:.06em}
.ir-dash{border-top:1px dashed #4B5B75}
.ir-line{display:flex;flex-direction:column;gap:1cqw}
.ir-row{display:flex;justify-content:space-between;font-size:3.2cqw;font-weight:600}
.ir-units{display:flex;flex-wrap:wrap;gap:.6cqw;min-height:3.2cqw}
.ir-u{display:block;width:3.2cqw;height:3.2cqw;animation:ir-ink 10s ease-out infinite}
.ir-u.d{background:#2F6FE4}.ir-u.r{background:#D2443B}
@keyframes ir-ink{0%,8%{opacity:0;transform:scale(.3)}12%,86%{opacity:1;transform:scale(1)}94%,100%{opacity:0;transform:scale(.3)}}
.ir-tot{border-top:2px solid #0E2240;margin-top:auto;padding-top:1.5cqw;display:flex;justify-content:space-between;font-weight:600;font-size:4cqw}

/* blue wave */
.bw-field{position:absolute;left:5cqw;right:5cqw;top:22cqh;bottom:24cqh}
.bw-u{position:absolute;width:1.9cqw;height:1.9cqw;animation:bw-drop .5s cubic-bezier(.3,1.4,.5,1) both}
.bw-u.f{background:#2F6FE4}.bw-u.h{background:#D2443B}.bw-u.rd{box-shadow:inset 0 0 0 .5cqw #F2B33D}
@keyframes bw-drop{from{transform:translateY(-60cqh);opacity:0}}
.bw-sea{position:absolute;left:0;bottom:0;top:4cqh;background:rgba(47,111,228,.42);border-right:.6cqw solid #9FC0FA;transform-origin:0 50%;animation:bw-flood 9s ease-in-out infinite}
@keyframes bw-flood{0%,20%{transform:scaleX(0)}48%,86%{transform:scaleX(1)}100%{transform:scaleX(0)}}
.bw-crest{position:absolute;left:0;right:0;top:-2cqw;height:2cqw;background:radial-gradient(circle at 50% 100%,rgba(159,192,250,.9) 45%,transparent 47%) 0 0/5cqw 2cqw repeat-x;animation:bw-crest 1.8s ease-in-out infinite alternate}
@keyframes bw-crest{to{transform:translateY(-1cqw)}}
.bw-axis{position:absolute;left:0;right:0;bottom:-1cqw;height:.5cqw;background:#fff}
.bw-tick{position:absolute;bottom:-6cqw;transform:translateX(-50%);font-size:2.6cqw;color:#9FB6DA;white-space:nowrap}
.bw-note{position:absolute;left:5cqw;bottom:15cqh;font-size:2.6cqw;color:#9FC0FA}

/* borderlands */
.tb-map{position:absolute;left:8cqw;right:8cqw;top:30cqh;bottom:22cqh}
.tb-base{position:absolute;width:.9cqw;height:.9cqw;margin:-.45cqw 0 0 -.45cqw;border-radius:50%;background:rgba(220,230,245,.45)}
.tb-spike{position:absolute;width:.55cqw;margin-left:-.275cqw;transform-origin:50% 100%;animation:tb-rise 9s cubic-bezier(.2,.8,.2,1) infinite}
.tb-spike i{position:absolute;left:50%;top:-.7cqw;width:1.4cqw;height:1.4cqw;margin-left:-.7cqw;border-radius:50%;background:inherit}
@keyframes tb-rise{0%,6%{transform:scaleY(0)}30%,86%{transform:scaleY(1)}96%,100%{transform:scaleY(0)}}
.tb-key{position:absolute;left:5cqw;bottom:15cqh;display:flex;gap:3cqw;font-size:2.6cqw;color:#DCE6F5}
.tb-key i,.hs-key i{display:block;width:2cqw;height:2cqw;border-radius:50%}

/* convention hall */
.hs-yr{position:absolute;left:5cqw;top:23cqh;height:5cqw;width:60cqw;font-family:Montserrat,Arial,sans-serif;font-weight:900;font-size:4.2cqw;text-transform:uppercase}
.hs-yr span{position:absolute;left:0;top:0}
.yr24{animation:y-a 9s infinite}.yr26{color:#9FC0FA;animation:y-b 9s infinite}
@keyframes y-a{0%,34%{opacity:1}42%,94%{opacity:0}100%{opacity:1}}
@keyframes y-b{0%,38%{opacity:0}46%,90%{opacity:1}100%{opacity:0}}
.hs-grid{position:absolute;left:4.6cqw;top:calc(23cqh + 7cqw);width:91cqw;height:76cqw}
.hs-key{position:absolute;left:5cqw;right:5cqw;top:calc(23cqh + 85cqw);display:flex;flex-wrap:wrap;gap:1cqw 3cqw;font-size:2.6cqw;color:#DCE6F5}
.hs-key i{border-radius:0}
.hs{position:absolute;width:2.1cqw;height:2.1cqw;animation:hs-in .4s ease-out both}
@keyframes hs-in{from{opacity:0;transform:scale(0)}}
.hs.hD,.hs.hR,.hs.hO{background:#2F6FE4}.hs.tR,.hs.tD,.hs.tO{background:#D2443B}.hs.nD,.hs.nR,.hs.nO{background:#F2B33D}.hs.oD,.hs.oR,.hs.oO{background:#8E98A3}
.hs.hR{animation:hs-in .4s ease-out both,c-br 9s ease-in-out infinite}.hs.hO{animation:hs-in .4s ease-out both,c-bg 9s ease-in-out infinite}
.hs.tD{animation:hs-in .4s ease-out both,c-rb 9s ease-in-out infinite}.hs.tO{animation:hs-in .4s ease-out both,c-rg 9s ease-in-out infinite}
.hs.nD{animation:hs-in .4s ease-out both,c-ab 9s ease-in-out infinite}.hs.nR{animation:hs-in .4s ease-out both,c-ar 9s ease-in-out infinite}.hs.nO{animation:hs-in .4s ease-out both,c-ag 9s ease-in-out infinite}
.hs.oD{animation:hs-in .4s ease-out both,c-gb 9s ease-in-out infinite}.hs.oR{animation:hs-in .4s ease-out both,c-gr 9s ease-in-out infinite}
@keyframes c-br{0%,30%{background:#2F6FE4}44%{background:#D2443B;transform:scale(1.8)}50%,86%{background:#D2443B;transform:scale(1)}100%{background:#2F6FE4}}
@keyframes c-bg{0%,30%{background:#2F6FE4}44%{background:#8E98A3;transform:scale(1.8)}50%,86%{background:#8E98A3;transform:scale(1)}100%{background:#2F6FE4}}
@keyframes c-rb{0%,30%{background:#D2443B}44%{background:#5D93F2;transform:scale(1.8)}50%,86%{background:#5D93F2;transform:scale(1)}100%{background:#D2443B}}
@keyframes c-rg{0%,30%{background:#D2443B}44%{background:#8E98A3;transform:scale(1.8)}50%,86%{background:#8E98A3;transform:scale(1)}100%{background:#D2443B}}
@keyframes c-ab{0%,30%{background:#F2B33D}44%{background:#5D93F2;transform:scale(1.8)}50%,86%{background:#5D93F2;transform:scale(1)}100%{background:#F2B33D}}
@keyframes c-ar{0%,30%{background:#F2B33D}44%{background:#D2443B;transform:scale(1.8)}50%,86%{background:#D2443B;transform:scale(1)}100%{background:#F2B33D}}
@keyframes c-ag{0%,30%{background:#F2B33D}44%{background:#8E98A3;transform:scale(1.8)}50%,86%{background:#8E98A3;transform:scale(1)}100%{background:#F2B33D}}
@keyframes c-gb{0%,30%{background:#8E98A3}44%{background:#5D93F2;transform:scale(1.8)}50%,86%{background:#5D93F2;transform:scale(1)}100%{background:#8E98A3}}
@keyframes c-gr{0%,30%{background:#8E98A3}44%{background:#D2443B;transform:scale(1.8)}50%,86%{background:#D2443B;transform:scale(1)}100%{background:#8E98A3}}

/* into the senate */
.sv-head{position:absolute;left:3cqw;top:2.6cqw;display:flex;align-items:center;gap:1.6cqw}
.sv-key{position:absolute;right:3cqw;top:2.8cqw;display:flex;gap:1.6cqw;font-size:1.05cqw;letter-spacing:.06em}
.sv-key i{display:block;width:1.1cqw;height:1.1cqw;border-radius:50%}
.sv-title{position:absolute;left:50cqw;top:3.4cqw;transform:translateX(-50%);font-family:Montserrat,Arial,sans-serif;font-weight:900;font-size:1.5cqw;letter-spacing:.14em;color:#9FB6DA;white-space:nowrap}
.ss{position:absolute;width:1.25cqw;height:1.25cqw;margin:-.625cqw 0 0 -.625cqw;border-radius:50%}
.ss.D{background:#2F6FE4}.ss.R{background:#D2443B}.ss.P{background:#8E98A3}
.ss.F{background:#F2B33D;box-shadow:0 0 0 .35cqw rgba(242,179,61,.35);animation:ss-pulse 2.4s ease-in-out 3s infinite}
@keyframes ss-pulse{50%{box-shadow:0 0 0 .9cqw rgba(242,179,61,0)}}
.sv-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.sv-link{fill:none;stroke:#F2B33D;stroke-width:.18;stroke-dasharray:.7 .5;opacity:0;animation:sv-link 1s ease 2.6s forwards,sv-flow 1.2s linear 2.6s infinite}
@keyframes sv-link{to{opacity:.85}}
@keyframes sv-flow{to{stroke-dashoffset:-1.2}}
.sv-col{position:absolute;bottom:3.4cqw;animation:sv-in 3s cubic-bezier(.2,.7,.2,1) both,sv-step .9s ease-in-out 3s infinite alternate}
@keyframes sv-in{from{transform:translateY(26cqw);opacity:0}30%{opacity:1}}
@keyframes sv-step{to{transform:translateY(-.25cqw)}}
.sv-plac{position:absolute;left:50%;transform-origin:50% 100%;animation:sv-sway 2.6s ease-in-out infinite alternate}
@keyframes sv-sway{from{transform:translateX(-50%) rotate(-2.2deg)}to{transform:translateX(-50%) rotate(2.2deg)}}
.sv-card{background:#fff;padding:.35cqw;box-shadow:0 .6cqw 1.4cqw rgba(0,0,0,.45)}
.sv-card img{display:block;width:100%;aspect-ratio:4/5;image-rendering:pixelated}
.sv-name{background:#0E2240;color:#fff;font-family:Montserrat,Arial,sans-serif;font-weight:900;line-height:1.05;text-transform:uppercase;text-align:center;padding:.35cqw .2cqw}
.sv-pole{width:.35cqw;margin:0 auto;background:#C9D2DE}
.sv-fig{position:absolute;width:1cqw;height:1.9cqw;animation:sv-bob .46s ease-in-out infinite alternate}
.sv-fig::before{content:"";position:absolute;left:.2cqw;top:0;width:.6cqw;height:.6cqw;border-radius:50%;background:#DCE6F5}
.sv-fig::after{content:"";position:absolute;left:0;top:.7cqw;width:1cqw;height:1.2cqw;border-radius:.5cqw .5cqw .15cqw .15cqw;background:#5D93F2}
@keyframes sv-bob{to{transform:translateY(-.3cqw)}}
.sv-lab{position:absolute;bottom:1cqw;transform:translateX(-50%);text-align:center;font-size:.95cqw;line-height:1.3;white-space:nowrap;color:#DCE6F5}
.sv-lab b{color:#fff}.sv-lab span{color:#9FC0FA}
.sv-side{position:absolute;left:3cqw;top:9cqw;display:flex;flex-direction:column;gap:.8cqw;max-width:22cqw;font-size:max(10px,1.05cqw);line-height:1.45;color:#DCE6F5}
.sv-side .il-play{align-self:flex-start}

/* enlarged text: drop keys and captions that would collide inside the fixed-proportion canvas */
.bigtext :is(.iw-key,.iw-pl,.iw-d,.iw-r,.tb-key,.hs-key,.sv-key,.il-cap){display:none}
.bigtext .il-count{right:5cqw;flex-wrap:wrap}
.bigtext .il-ctl{justify-content:flex-end}
