/* ---------- Graph Funding, the Courts, citizens' assemblies, the bounty ---------- */
.alloc3{grid-template-columns:repeat(4,1fr)}
.rt i.graph{background:linear-gradient(90deg,#5fe3a1,#bff7dc)}
select{width:100%;background:#03040c;border:1px solid #1f3a6e;color:var(--hi);padding:10px 12px;border-radius:4px;font:inherit;font-size:13px}

/* the graph */
.gtree{display:grid;gap:8px;margin:4px 0 6px}
.gn{border:1px solid #1f3a6e;background:#0b1430;border-radius:6px;padding:10px 12px}
.gh2{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:baseline}
.gh2 b{color:var(--hi);font-weight:500;font-size:14px}.gh2 small{grid-column:1;color:var(--grey);font-size:10.5px}
.gh2 em{grid-row:1/3;grid-column:2;font-style:normal;color:#5fe3a1;font-size:18px;font-family:Disp,'Inter Display',sans-serif;font-weight:300}
.gps{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.gps span{font-size:11px;color:#cfe6ff;border:1px solid #1f3a6e;border-radius:999px;padding:3px 10px}
.gps i{font-style:normal;color:#5fe3a1;margin-left:4px}
.gplace{display:grid;gap:10px}
.graphfig .ge{fill:none;stroke:#1f3a6e;stroke-linecap:round}
.graphfig .gflow{fill:none;stroke:#5fe3a1;stroke-width:1.2;stroke-dasharray:2 10;opacity:.55;animation:dgrun12 1.4s linear infinite}
.graphfig .gdrop{fill:#bff7dc;filter:drop-shadow(0 0 5px #5fe3a1)}
.graphfig .gnode circle:first-child{filter:drop-shadow(0 0 10px rgba(158,240,255,.45))}
.graphfig .com{animation:spin 14s linear infinite}
.graphfig .gnode:nth-of-type(2n) .com{animation-duration:18s;animation-direction:reverse}
.graphfig .com circle{fill:#e8f4ff;opacity:.85}
.graphfig .gleaf rect{fill:#0b1430;stroke:#2a4a7a;stroke-width:1.4;transition:all .6s}
.graphfig .gleaf text{fill:#9ec3ef;font-size:11px}
.graphfig .gleaf.two rect{stroke:#5fe3a1}
.graphfig .gleaf.top rect{stroke:#9ef0ff;filter:drop-shadow(0 0 6px rgba(158,240,255,.6))}

/* the Courts */
.courtfig .room{fill:rgba(11,20,48,.7);stroke:#2a4a7a;stroke-width:1.2}
.courtfig .room.lone{stroke-dasharray:4 4}
.courtfig .wall{stroke:#ffcf9a;stroke-width:1.4;stroke-dasharray:2 6;opacity:.7}
.courtfig .talk{fill:none;stroke:#9ef0ff;stroke-width:1.4;stroke-dasharray:3 5;animation:dgrun8 1.2s linear infinite,talkp 4s ease-in-out infinite}
.courtfig .talk.b{animation-delay:0s,2s}
@keyframes talkp{0%,100%{opacity:.15}50%{opacity:.9}}
.courtfig .judge circle{fill:#0b1430;stroke:#9ef0ff;stroke-width:1.4}
.courtfig .judge text{fill:#e8f4ff;font-size:11px}
.courtfig .scale{stroke:#2a4a7a;stroke-width:2}
.courtfig .tick{stroke:#6b8ac0;stroke-width:1.4}
.courtfig .view{fill:#9ef0ff;filter:drop-shadow(0 0 5px #9ef0ff);opacity:0;animation:vfall 9s cubic-bezier(.4,.1,.3,1) infinite}
.courtfig .view.t{fill:#ffcf9a;filter:drop-shadow(0 0 5px #ffcf9a)}
@keyframes vfall{0%{opacity:0;transform:translate(0,0)}6%{opacity:1;transform:translate(0,0)}22%{transform:translate(var(--dx),var(--dy));opacity:1}88%{transform:translate(var(--dx),var(--dy));opacity:1}96%,100%{transform:translate(var(--dx),var(--dy));opacity:0}}
.courtfig .median rect{fill:none;stroke:#5fe3a1;stroke-width:1.6;opacity:0;animation:med 9s ease infinite}
.courtfig .median text{fill:#5fe3a1;opacity:0;animation:med 9s ease infinite}
@keyframes med{0%,52%{opacity:0}60%,88%{opacity:1}96%,100%{opacity:0}}

/* the room */
.roomfig .stage{fill:#0b1430;stroke:#2a4a7a}
.roomfig .podium{fill:#ffcf9a;opacity:.85;animation:pod 3s ease-in-out infinite}
@keyframes pod{50%{opacity:.35}}
.roomfig .tbl{fill:#0b1430;stroke:#1f3a6e;stroke-width:1.4}
.roomfig .chair{fill:#060a1c;stroke:#2a4a7a;stroke-width:1.2}
.roomfig .chair.sat{fill:#9ef0ff;stroke:#9ef0ff;filter:drop-shadow(0 0 4px rgba(158,240,255,.7))}
.roomfig .chair.loop{animation:sit 14s ease infinite}
@keyframes sit{0%,4%{fill:#060a1c;stroke:#2a4a7a}10%,86%{fill:#9ef0ff;stroke:#9ef0ff}94%,100%{fill:#060a1c;stroke:#2a4a7a}}
.podium-q{font-family:Disp,'Inter Display',sans-serif;font-weight:300;font-size:16px;color:#ffe6c4 !important}

/* the bounty */
.bountyfig .bstep rect{fill:#0b1430;stroke:#2a4a7a;stroke-width:1.3}
.bountyfig .bstep.net rect{stroke:#9ef0ff;filter:drop-shadow(0 0 8px rgba(158,240,255,.35))}
.bountyfig .bstep.out rect{stroke:#ff9b66}.bountyfig .bstep.pay rect{stroke:#5fe3a1}
.bountyfig .pt{font-size:17px}
.bountyfig .pdot.r{fill:#ff9b66;filter:drop-shadow(0 0 6px #ff9b66)}.bountyfig .pdot.g{fill:#5fe3a1;filter:drop-shadow(0 0 6px #5fe3a1)}
#bnList{margin-top:14px}

/* the bench and the committee */
.seatin .tabs{flex-wrap:wrap}
.booth+.booth{margin-top:16px;padding-top:16px;border-top:1px solid #1a3a6a}
.booth .prop{margin-bottom:8px}
.booth .ems{border-left:2px solid #ffcf9a;padding-left:10px;color:#ffe6c4;font-size:12.5px;line-height:1.7}.booth .ems i{color:#ffcf9a;font-style:normal}
.wrow{display:grid;grid-template-columns:1fr 140px 36px;gap:12px;align-items:center;padding:8px 0;border-bottom:1px solid #12224a}
.wrow span{color:var(--hi);font-size:13px}.wrow small{display:block;color:var(--grey);font-size:10.5px;line-height:1.5;margin-top:2px}
.wrow input[type=range]{accent-color:#5fe3a1;width:100%}
.wrow em{font-style:normal;color:#5fe3a1;text-align:right;font-size:13px}

/* still in the book */
.notyet{margin-top:28px;border:1px solid var(--line);padding:22px}
.notyet .gh{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:14px;font-size:11px;color:var(--grey)}
.ny{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.proofmsg{margin:8px 0 10px;padding:10px 12px;border:1px solid #2a4a7a;border-left:2px solid #ffcf9a;background:#03040c;color:#ffe6c4;font-size:12px;line-height:1.7;white-space:pre-wrap}
.ny div{border:1px dashed #2a4a7a;border-radius:6px;padding:14px;background:rgba(11,20,48,.45)}
.ny b{display:block;color:var(--hi);font-weight:500;font-size:13.5px;margin-bottom:6px}
.ny span{display:block;color:var(--txt);font-size:12.5px;line-height:1.7}

@media (max-width:1180px){.ny{grid-template-columns:repeat(3,1fr)}}
@media (max-width:980px){
  .ny{grid-template-columns:1fr 1fr}
  .wrow{grid-template-columns:1fr 90px 30px}
  .alloc3{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){.ny{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){
  .graphfig .gflow,.graphfig .com,.courtfig .talk,.roomfig .podium,.roomfig .chair.loop{animation:none}
  .courtfig .view{animation:none;opacity:1;transform:translate(var(--dx),var(--dy))}
  .courtfig .median rect,.courtfig .median text{animation:none;opacity:1}
}

/* ---------- Part III: the machine, the four groups, your place ---------- */
:root{--g1:#9ef0ff;--g2:#5fe3a1;--g3:#ffcf9a;--g4:#c9a8ff}
.machine svg{max-height:none !important}
.machfig .mst rect{fill:#0b1430;stroke:#24407a;stroke-width:1.2;transition:fill .9s ease,stroke .9s ease,filter .9s ease}
.machfig .mst .mt{transition:fill .9s ease}
.machfig .mst.hit rect{fill:#10275a;stroke:#9ef0ff;filter:drop-shadow(0 0 12px rgba(158,240,255,.4))}
.machfig .mst.fire.hit rect{stroke:#ffcf9a;filter:drop-shadow(0 0 12px rgba(255,155,102,.45))}
.machfig .mst.hit .mt{fill:#fff}
.machfig .mst:hover rect,.machfig .mst:focus rect{fill:#12305a;stroke:#7fbcff}
.machfig .mt{fill:#dbeaff;font-family:Disp,'Inter Display',sans-serif;font-weight:400;font-size:15px}
.machfig .ms{fill:#6b8ac0;font-size:10px;letter-spacing:.04em}
.machfig .mm{fill:none;stroke:#2a4a7a;stroke-width:1.6}
.machfig .mc{fill:none;stroke:#3d70c3;stroke-width:1.1;stroke-dasharray:4 6;opacity:.55;animation:dgrun10 3.2s linear infinite}
.machfig .ml{font-size:10.5px;letter-spacing:.06em;fill:#6f9fd8}
.machfig .mhalo{fill:#9ef0ff;opacity:.45}
.machfig .mcore{fill:#f2fbff}
/* the legend row, like the row under the title */
.mstrip{display:grid;grid-template-columns:1fr 1fr 2fr;border:1px solid var(--line);background:rgba(10,14,39,.6);margin-top:14px}
.mstrip div{padding:16px 18px;border-right:1px solid var(--line);min-width:0}
.mstrip div:last-child{border-right:0}
.mstrip small{font-size:10px;letter-spacing:.2em;color:var(--grey);text-transform:uppercase}
.mstrip p{display:flex;align-items:center;gap:10px;font-family:Disp,'Inter Display',sans-serif;font-weight:300;font-size:19px;color:var(--hi);margin:6px 0 0}
.mstrip .ln{flex:none;width:34px;height:0;border-top:1.6px solid #7fbcff}
.mstrip .ln.dash{border-top:1.4px dashed #3d70c3}
.mstrip .now p{color:#fff}
.mstrip .now p.in{animation:nowin .9s ease both}
@keyframes nowin{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (max-width:700px){.mstrip{grid-template-columns:1fr 1fr}.mstrip .now{grid-column:1/-1;border-top:1px solid var(--line)}.mstrip p{font-size:16px}}
.groups4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}
.groups4 a{display:block;border:1px solid var(--line);padding:16px;background:rgba(11,20,48,.45);transition:border-color .3s,transform .3s}
.groups4 a:hover{border-color:#3d70c3;transform:translateY(-2px)}
.groups4 i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px;vertical-align:1px}
.c1{--gc:var(--g1)}.c2{--gc:var(--g2)}.c3{--gc:var(--g3)}.c4{--gc:var(--g4)}
.groups4 i{background:var(--gc);box-shadow:0 0 10px var(--gc)}
.groups4 b{color:var(--hi);font-weight:500;font-size:14px}
.groups4 span{display:block;margin-top:8px;color:var(--txt);font-size:12.5px;line-height:1.7}


.toplace{display:flex;align-items:center;gap:10px;margin-top:14px;padding:10px 12px;border:1px dashed #2f7a5c;border-radius:6px;color:#bfe9d3;font-size:12px;transition:background .3s,border-color .3s}
.toplace i{width:10px;height:10px;border-radius:50%;background:#5fe3a1;box-shadow:0 0 8px #5fe3a1;flex:none;animation:chk 1.8s ease-in-out infinite}
.toplace::after{content:'→';margin-left:auto;color:#5fe3a1}
.toplace:hover{background:#0b1f1a;border-color:#5fe3a1}
.seat{margin-top:0}
.seat.ping{animation:ping 1.6s ease}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(95,227,161,.0)}25%{box-shadow:0 0 0 3px rgba(95,227,161,.55),0 0 40px rgba(95,227,161,.25)}100%{box-shadow:0 0 0 0 rgba(95,227,161,0)}}
.seattabs button{padding-left:10px;padding-right:10px}

.rolefig .rline{stroke:#2a4a7a;stroke-width:1.4;stroke-dasharray:3 6;fill:none}
.rolefig .rline.later{stroke:#c9a8ff;opacity:.6}
.rolefig .role{cursor:pointer;outline:none}
.rolefig .role circle{fill:#0b1430;stroke:#2a4a7a;stroke-width:1.5;transition:all .5s}
.rolefig .role .rt{fill:#cfe6ff;font-family:Disp,'Inter Display',sans-serif;font-size:13px}
.rolefig .role.lit circle,.rolefig .role:hover circle,.rolefig .role:focus circle{stroke:#9ef0ff;fill:#12305a;filter:drop-shadow(0 0 10px rgba(158,240,255,.55))}
.rolefig .role.mine circle{stroke:#5fe3a1;fill:#0b1f1a}
.rolefig .you{fill:#5fe3a1;font-size:11px;letter-spacing:.2em}
.rolefig .rdot{fill:#e8f4ff;filter:drop-shadow(0 0 6px #9ef0ff)}

.zm-sub{font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:#6b8ac0;margin:10px 0 0 32px}

@media (max-width:980px){.groups4{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.groups4{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.machfig .mc{animation:none}.toplace i{animation:none}}

/* off screen: everything stands still */
.off *, .off *::before, .off *::after{animation-play-state:paused !important}

/* the hero: what is on the page now */
/* your place: what each seat holds */
.seatroles{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:20px;padding-top:16px;border-top:1px solid #1a3a6a}
.seatroles div{padding:10px 12px;border:1px solid #1a2f5a;background:#0b1430}
.seatroles b{display:block;color:var(--hi);font-weight:500;font-size:12.5px;margin-bottom:4px}
.seatroles span{font-size:11.5px;color:var(--grey);line-height:1.6}
@media (max-width:560px){.seatroles{grid-template-columns:1fr}}

/* phones: the figures shrink to two thirds, so their writing grows to stay readable */
@media (max-width:560px){
  .v9fig svg .ps{font-size:13.5px;letter-spacing:.02em}
  .v9fig svg .pc{font-size:15px}
  .v9fig svg .pt{font-size:22px}
  .courtfig .judge text,.roomfig .tbl+text{font-size:14px}
  .rolefig .role .rt{font-size:15px}
  .graphfig .gleaf text{font-size:14px}
  .drawfig .seat text{font-size:13px}
  .passfig .vn{font-size:16px}
  .v9fig figcaption{font-size:11.5px}
}

/* the older figures */
.mxfig .psm{font-size:9.5px}
.v9fig svg.tallfig{display:none}
@media (max-width:560px){
  .v9fig svg.widefig{display:none}.v9fig svg.tallfig{display:block}
  .mxfig .psm{font-size:10.5px;letter-spacing:0}
  .pollfig .pbt{font-size:16px}
  .tallfig .pt{font-size:17px}
}
/* where am I: the part lights up in the navigation, a thin line shows how far down */
nav#nav{position:sticky}
.navprog{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:linear-gradient(90deg,#3d70c3,var(--pc,#9ef0ff));box-shadow:0 0 8px var(--pc,#9ef0ff);transition:width .15s linear,background .6s ease;pointer-events:none;z-index:2}
.links a.here{color:var(--hi)}
.links a.here::after{content:'';display:block;height:1px;margin-top:4px;background:var(--pc,#9ef0ff)}

/* sections kept in the page for later: shown again by removing the class "later" */
section.later{display:none !important}

/* Part III: one section per group, its two stations behind tabs */
.gsec .sh .n{color:var(--gc)}
.tabs.gtabs{display:flex;gap:10px;flex-wrap:wrap;border:0;margin:6px 0 22px}
.tabs.gtabs button{display:inline-flex;align-items:center;gap:9px;border:1px solid #1f3a6e;border-radius:999px;padding:10px 18px;font-size:11.5px;letter-spacing:.14em;color:#9fb6d8;background:transparent;transition:border-color .3s,color .3s,background .3s}
.tabs.gtabs button i{width:8px;height:8px;border-radius:50%;background:#1f3a6e;transition:background .3s,box-shadow .3s}
.tabs.gtabs button:hover{color:#dfeeff;border-color:#2f5a9e}
.tabs.gtabs button.on{color:var(--hi);border-color:var(--gc);background:rgba(20,40,80,.35)}
.tabs.gtabs button.on i{background:var(--gc);box-shadow:0 0 10px var(--gc)}
.plede{max-width:860px;font-size:14px;line-height:1.85;color:#b9cbe6;margin:0 0 30px}
.gsec .heralds{margin-top:28px}
.zm-read small{font-size:10.5px;color:var(--grey);letter-spacing:.06em;margin-left:auto;text-align:right}
@media (max-width:560px){.tabs.gtabs{gap:8px}.tabs.gtabs button{padding:9px 14px;font-size:10.5px}.zm-read small{display:none}}

/* ---------- Part III, quieter ---------- */
/* your place: the device and the figure side by side, the same size */
@media (min-width:981px){#place .twin{grid-template-columns:1fr 1fr}}
#place .rolefig{max-height:none}
.rolefig .rline{stroke:#24407a;stroke-width:1.1;stroke-dasharray:3 6;fill:none;animation:dgrun9 2.4s linear infinite}
.rolefig .rline.later{stroke:#3d70c3;opacity:.7}
.rolefig .role circle{fill:#0b1430;stroke:#24407a;stroke-width:1.3;transition:fill 1s ease,stroke 1s ease,filter 1s ease}
.rolefig .role .rt{transition:fill 1s ease}
.rolefig .role.lit circle,.rolefig .role:hover circle,.rolefig .role:focus circle{stroke:#9ef0ff;fill:#10275a;filter:drop-shadow(0 0 12px rgba(158,240,255,.4))}
.rolefig .role.lit .rt{fill:#fff}
.rolefig .rhalo{fill:#9ef0ff;opacity:.45}
.rolefig .rdot{fill:#f2fbff}
@keyframes dgrun9{to{stroke-dashoffset:-36}}

/* the green buttons: square, plain letters */
.device button.green{border-radius:2px;padding:12px 18px;gap:10px;font-family:Mono,ui-monospace,monospace;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:#d8fff0;background:#0b1f1a;border:1px solid #2f7a5c;transition:background .3s,border-color .3s,box-shadow .3s}
.device button.green i{width:7px;height:7px;border-radius:1px;background:#5fe3a1;box-shadow:0 0 8px rgba(95,227,161,.8);animation:gsq 2.6s ease-in-out infinite}
.device button.green:hover{border-color:#5fe3a1;background:#0e2a22;box-shadow:0 0 18px rgba(95,227,161,.18)}
.device button.green.ghost{background:transparent}
@keyframes gsq{0%,100%{opacity:.55}50%{opacity:1}}
.toplace{border-radius:2px;font-family:Mono,ui-monospace,monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:12px 14px}
.toplace i{width:7px;height:7px;border-radius:1px}

/* the draw: the field breathes, and while no seat is filled the figure rehearses the draw */
.drawfig .field circle{opacity:.35;animation:fbreath 5s ease-in-out infinite}
.drawfig .field circle:nth-child(3n){animation-delay:-1.7s}.drawfig .field circle:nth-child(3n+1){animation-delay:-3.3s}
@keyframes fbreath{0%,100%{opacity:.18}50%{opacity:.5}}
.drawfig .seat circle{transition:fill .9s ease,stroke .9s ease,filter .9s ease}
.drawfig .seat.pre circle{fill:#10275a;stroke:#9ef0ff;filter:drop-shadow(0 0 8px rgba(158,240,255,.55))}
.drawfig .seat.pre text{fill:#fff}
.drawfig .dseed{fill:#7fa6d8;font-size:10px;letter-spacing:.04em}
@media (prefers-reduced-motion:reduce){.rolefig .rline,.drawfig .field circle,.device button.green i{animation:none}}

/* ---------- Part III figures, the quiet versions (figs4.js) ---------- */
/* 13 of 21 */
.passfig .vtrack{fill:#0a1230;stroke:#1a2f5c}
.passfig .vfill.y{fill:#7fbcff}.passfig.passed .vfill.y{fill:#9ef0ff}
.passfig .vfill.n{fill:#2f4c80}
.passfig .vline{stroke:#1a2f5c;stroke-width:2}
.passfig .vprog{stroke:#7fbcff;stroke-width:2;transition:stroke .8s}
.passfig.passed .vprog{stroke:#9ef0ff}
.passfig .vmark{stroke:#cfe6ff;stroke-width:1.2}
.passfig .vcount{fill:#e8f4ff;font-family:Disp,'Inter Display',sans-serif;font-weight:300;font-size:26px}
.passfig .vword{letter-spacing:.06em}
/* quadratic squares */
.qffig2 .qown{fill:#16294f;stroke:#7fbcff;stroke-width:1}
.qffig2 .qbig{fill:none;stroke:#9ef0ff;stroke-width:1.2;stroke-dasharray:100 100}
.qffig2 .qmatch{fill:rgba(158,240,255,.08);stroke:none}
.qffig2 .qlab{fill:#9ec3ef;font-size:11px;letter-spacing:.08em}
/* the graph */
.graphfig .ge2{fill:none;stroke:#24407a;stroke-linecap:round}
.graphfig .gpulse{fill:none;stroke:#9ef0ff;stroke-width:2;stroke-linecap:round;stroke-dasharray:14 100}
.graphfig .gn{fill:#0b1430;stroke:#9ef0ff;stroke-width:1.2}
.graphfig .gname{font-size:17px}
.graphfig .gcom{fill:#6f9fd8}
.graphfig .gleaf2{fill:#0b1430;stroke:#2a4a7a;stroke-width:1.2}
.graphfig .gleaf2.two{stroke:#7fbcff}.graphfig .gleaf2.top{stroke:#9ef0ff}
.graphfig .gleaft{fill:#9ec3ef;font-size:11px}
/* the Courts */
.courtfig .room2{fill:rgba(11,20,48,.6);stroke:#24407a;stroke-width:1.1}
.courtfig .room2.lone{stroke-dasharray:3 4}
.courtfig .wall2{stroke:#3d5a8a;stroke-width:1;stroke-dasharray:2 5}
.courtfig .talk2{fill:none;stroke:#7fbcff;stroke-width:1.1;stroke-dasharray:3 5;animation:dgrun8 1.6s linear infinite}
.courtfig .jseat{fill:#0b1430;stroke:#3d70c3;stroke-width:1.2}
.courtfig .jtext{fill:#cfe6ff;font-size:11px}
.courtfig .scale2{stroke:#24407a;stroke-width:1.6}
.courtfig .tick2{stroke:#6b8ac0;stroke-width:1.2}
.courtfig .vglow{fill:#9ef0ff;opacity:.5}.courtfig .vcore{fill:#f2fbff}
.courtfig .med2{fill:none;stroke:#9ef0ff;stroke-width:1.2;stroke-dasharray:3 3}
/* the bounty */
.bountyfig .bseat{fill:#0b1430;stroke:#24407a;stroke-width:1.1;transition:fill .8s,stroke .8s,opacity .8s}
.bountyfig .bseat.four{stroke:#3d70c3}
.bountyfig .bseat.four.hit{fill:#10275a;stroke:#9ef0ff}
.bountyfig .bseat.four.gone{fill:transparent;stroke:#ffcf9a;stroke-dasharray:2 2}
.bountyfig .bseat.four.back{fill:#0b1430;stroke:#7fbcff}
.bountyfig .bcard{fill:rgba(11,20,48,.7);stroke:#24407a}
.bountyfig .bmsg{fill:#cfe6ff;font-size:12px}
.bountyfig .bsig{fill:#6f9fd8;font-size:10.5px}
.bountyfig .bcheck{fill:none;stroke:#9ef0ff;stroke-width:1.1;stroke-dasharray:100 100}
.bountyfig .bstepdot{fill:#7fbcff}
.bountyfig .bstept{fill:#cfe6ff;font-size:12px}
/* the room */
.roomfig .stage2{fill:#0b1430;stroke:#24407a}
.roomfig .podium2{fill:#cfe6ff}
.roomfig .tbl2{fill:#0b1430;stroke:#1f3a6e;stroke-width:1.2}
.roomfig .chair2{fill:#060a1c;stroke:#24407a;stroke-width:1.1;transition:fill .9s ease,stroke .9s ease}
.roomfig .chair2.sat{fill:#3d70c3;stroke:#9ef0ff}
@media (max-width:560px){.passfig .vcount{font-size:30px}.bountyfig .bmsg,.bountyfig .bstept{font-size:14px}.graphfig .gleaft{font-size:14px}.courtfig .jtext{font-size:14px}}

/* ---------- Part III figures, set two (figs5.js) ---------- */
.qffig2 .qb{fill:#16294f;stroke:#7fbcff;stroke-width:1}
.qffig2 .qn{fill:#6f9fd8;font-size:9px}
.qffig2 .qr{stroke:#9ef0ff;stroke-width:3;stroke-linecap:butt}.qffig2 .qr.alt{stroke:#5f9fe0}
.qffig2 .qsq{fill:rgba(158,240,255,.07);stroke:#9ef0ff;stroke-width:1.1}
.qffig2 .qown{fill:#3d70c3;opacity:.7}
.graphfig .gpot{fill:#16294f;stroke:#9ef0ff;stroke-width:1}
.graphfig .gband{fill:rgba(127,188,255,.14);stroke:rgba(158,240,255,.35);stroke-width:.8}
.graphfig .gband.l1{fill:rgba(95,159,224,.10)}
.graphfig .gnode2{fill:#0b1430;stroke:#9ef0ff;stroke-width:1}
.graphfig .gproj{fill:#16294f;stroke:#7fbcff}.graphfig .gproj.two{stroke:#cfe6ff;fill:#1d3a74}
.graphfig .gdot2{fill:#e8f6ff}
.courtfig .room3{fill:rgba(11,20,48,.55);stroke:#24407a}.courtfig .room3.lone{stroke-dasharray:3 4}
.courtfig .jseat2{fill:#0b1430;stroke:#7fbcff;stroke-width:1.2}
.courtfig .talk3{fill:none;stroke:#9ef0ff;stroke-width:1.1;stroke-dasharray:3 4;animation:dgrun8 1.8s linear infinite}
.courtfig .scale3{stroke:#24407a;stroke-width:1.4}
.courtfig .vcard{fill:#10275a;stroke:#9ef0ff;stroke-width:1}
.courtfig .med3{fill:none;stroke:#cfe6ff;stroke-width:1.2;stroke-dasharray:3 3}
.roomfig .stage3{fill:#0b1430;stroke:#3d70c3}
.roomfig .wave{fill:none;stroke:#9ef0ff;stroke-width:1}
.roomfig .tbl3{fill:#0b1430;stroke:#1f3a6e}
.roomfig .chair3{fill:#060a1c;stroke:#24407a;stroke-width:1;transition:fill .9s ease,stroke .9s ease}
.roomfig .chair3.sat{fill:#3d70c3;stroke:#9ef0ff}
.roomfig .thread{fill:none;stroke:#7fbcff;stroke-opacity:.6;stroke-width:.9;stroke-dasharray:100 100}
.roomfig .gather{fill:none;stroke:#5fe3a1;stroke-opacity:.55;stroke-width:1;stroke-dasharray:100 100}
.roomfig .emcard{fill:#0b1f1a;stroke:#5fe3a1}
.rolefig .acd{fill:#16294f;transition:fill .5s ease}.rolefig .acd.lit{fill:#5f9fe0}
.rolefig .acme{fill:#9ef0ff}
.rolefig .you2{fill:#9ef0ff;font-size:10px;letter-spacing:.16em}
.rolefig .slot{cursor:pointer;outline:none}
.rolefig .slr{fill:#0b1430;stroke:#24407a;stroke-width:1.1;transition:fill .8s ease,stroke .8s ease,filter .8s ease}
.rolefig .slr.mine{stroke:#5fe3a1}
.rolefig .slt{fill:#dbeaff;font-family:Disp,'Inter Display',sans-serif;font-size:16px}
.rolefig .slot.lit .slr,.rolefig .slot:hover .slr,.rolefig .slot:focus .slr{fill:#10275a;stroke:#9ef0ff;filter:drop-shadow(0 0 10px rgba(158,240,255,.35))}
.rolefig .pbeam{fill:#9ef0ff}
.rolefig .ppath{fill:none;stroke:#9ef0ff;stroke-width:1.1}
.rolefig .pspark{fill:#e8f6ff}
.robe{display:block;width:180px;margin:auto auto 0;padding-top:12px}
.robe .robeline{fill:none;stroke:#7fbcff;stroke-width:4;stroke-linecap:round}
.robe .robeenv{fill:none;stroke:#cceeff;stroke-width:3;stroke-linejoin:round}
.robe .rcell{fill:#5fe3a1}
.robe .emline{stroke:#5fe3a1;stroke-width:1.2;filter:drop-shadow(0 0 4px #5fe3a1)}
.device:has(#lsText){display:flex;flex-direction:column}