/* =====================================================================
   Mission · 04 and 08 · count, consent, contest; AI and democracy (from the talk's 04b and 11) — graphics
   ms-democracy-publics · ms-democracy-ccc · ms-democracy-cliffs
   Real people are stakeholder green, AI models fjord blue, the rest graphite.
   Every SVG here is drawn in pixel units (viewBox = its rendered size), so type sizes are real px.
   ===================================================================== */

/* the chapter's inner heads and its sources line */
.ms-democracy-sub{padding-top:clamp(48px,6vw,96px)}
/* 04b: count, consent, contest continues chapter 04 (the Venn): no rule, a short gap */
.ms-ch.ms-democracy-cont{border-top:0;padding-top:clamp(8px,2vw,32px)}
.ms-democracy-cont .ms-democracy-sub{padding-top:0}
/* the page's last word, and how to reach us */
.ms-democracy-end .ms-democracy-contact{margin-top:14px}
.ms-democracy-end .ms-democracy-contact a{text-decoration:none;border-bottom:1px solid var(--rule)}
.ms-democracy-end .ms-democracy-contact a:hover{color:var(--amber);border-color:var(--amber)}
.ms-democracy-sources{padding-bottom:clamp(8px,2vw,24px)}
.ms-democracy-sources .ms-fine{max-width:64em}
.ms-democracy-sources .lab{margin-right:.7em}

/* static mode on phones: talk.css keeps the stage sticky at 52vh below 900 px, which a three-chart figure
   overflows. Scoped to this chapter's scrollies (engine gap, see notes/11-democracy.md). */
@media (max-width:900px){
  .ms-static .ms-democracy-scrolly .ms-scrolly__stage{position:relative;top:auto;height:auto;min-height:0}
}

/* ---------------------------------------------------------------------
   Colours (light only, from the site's tokens): graphite rock, the camps' links in the stakeholder wash,
   amber bridges, an ink pill; the stones white inside with their wash as the glow.
   --------------------------------------------------------------------- */
.ms-democracy-scrolly{
  --democracy-pill:var(--ink); --democracy-pill-ink:var(--ground);
  --democracy-ring:var(--ink); --democracy-halo:color-mix(in srgb,var(--gold) 50%,transparent);
  --democracy-bridge:var(--amber);
  --democracy-link:var(--venn-stake); --democracy-link-o:1;
  --democracy-most-mark:color-mix(in srgb,var(--ink-4) 30%,transparent);
  --democracy-glow-o:.6;
  --democracy-rock-0:color-mix(in srgb,var(--ink-4) 3%,var(--field-2)); --democracy-rock-1:color-mix(in srgb,var(--ink-4) 6%,var(--field-2));
  --democracy-rock-2:color-mix(in srgb,var(--ink-4) 9%,var(--field-2)); --democracy-rock-3:color-mix(in srgb,var(--ink-4) 12%,var(--field-2));
  --democracy-rock-4:color-mix(in srgb,var(--ink-4) 15%,var(--field-2));
  --democracy-seam:color-mix(in srgb,var(--ink-4) 21%,var(--field-2)); --democracy-wall:color-mix(in srgb,var(--ink-4) 38%,var(--field-2));
  --democracy-lit:var(--ground); --democracy-edge:var(--ms-old-ink);
}
/* light: stones white inside with their wash as the glow; the second AI line in the fjord wash */
:root .ms-democracy-stone__disc{fill:var(--ground)}
:root .ms-democracy-stone--ai .ms-democracy-stone__glow{fill:var(--venn-ai)}
:root .ms-democracy-stone--inst .ms-democracy-stone__glow{fill:var(--venn-inst)}
:root .ms-democracy-stone--stake .ms-democracy-stone__glow{fill:var(--venn-stake)}
:root .ms-democracy-slope--ailo .ms-democracy-slope__line{stroke:var(--venn-ai);stroke-opacity:1}
:root .ms-democracy-slope--ailo .ms-democracy-slope__dot{fill:var(--venn-ai);fill-opacity:1}

/* an instant state change (resize, static, ?at=): no transitions */
.ms-democracy-now,.ms-democracy-now *{transition:none!important}

/* hover and tap targets */
.ms-democracy-hit{cursor:default;outline:none;-webkit-tap-highlight-color:transparent}
.ms-democracy-hitbox{fill:transparent}
.ms-democracy-hitline{fill:none;stroke:transparent;stroke-width:24;stroke-linecap:round;pointer-events:stroke}
/* labels never swallow the pointer: hovering a label reads as hovering the mark beneath it */
.ms-democracy-sp__svg text,.ms-democracy-cl-text,.ms-democracy-cl-text text{pointer-events:none}

/* extras inside the shared hover card (talk.js .ms-tip) */
.ms-tip .ms-democracy-tip-src{display:block;margin-top:7px;font:700 10.5px/1.4 var(--f-label);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-4)}
.ms-tip .ms-democracy-tip-src i{text-transform:none;font-style:italic;letter-spacing:.02em}
.ms-tip .ms-democracy-sw{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px}
.ms-democracy-sw--stake{background:var(--ms-stake)}
.ms-democracy-sw--inst{background:var(--ms-inst)}
.ms-democracy-sw--ai{background:var(--ms-ai)}

/* SVG type, in px */
.ms-democracy-t-lab{font-family:var(--f-label);font-weight:700;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;fill:var(--ms-label)}
.ms-democracy-t-note{font-family:var(--f-label);font-weight:700;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;fill:var(--ink-4)}
.ms-democracy-t-val{font-family:var(--f-text);font-weight:500;font-size:13.5px;fill:var(--ink)}
.ms-democracy-t-row{font-family:var(--f-label);font-weight:700;font-size:12px;letter-spacing:.08em;fill:var(--ink-4)}
.ms-democracy-t-tick{font-family:var(--f-text);font-size:12px;fill:var(--ink-4)}
.is-nar .ms-democracy-t-lab{font-size:10.5px;letter-spacing:.12em}
.is-nar .ms-democracy-t-note{font-size:9.5px;letter-spacing:.12em}
.is-nar .ms-democracy-t-val{font-size:12.5px}
.ms-democracy-ink-stake{fill:var(--ms-stake-ink)}
.ms-democracy-ink-ai{fill:var(--ms-ai-ink)}

/* =====================================================================
   1 · Synthetic publics
   ===================================================================== */
.ms-democracy-sp{display:flex;flex-direction:column;gap:var(--democracy-gap,30px);width:100%}
.ms-democracy-sp__row{min-width:0}
.ms-democracy-sp__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 14px}
.ms-democracy-sp__who{font:700 11.5px/1.45 var(--f-label);letter-spacing:.14em;text-transform:uppercase;color:var(--ms-label);transition:color .35s ease}
.ms-democracy-sp__who span{color:var(--ink-4);transition:color .35s ease}
.ms-democracy-sp__ref{font:500 11.5px/1.45 var(--f-label);letter-spacing:.02em;color:var(--ink-4);text-decoration:none;border-bottom:1px solid var(--rule);white-space:nowrap;transition:color .2s,border-color .2s}
.ms-democracy-sp__ref:hover{color:var(--amber);border-color:var(--amber)}
.ms-democracy-sp__what{margin-top:3px;font:600 19px/1.25 var(--f-name);letter-spacing:0;color:var(--ink);transition:color .35s ease}
.ms-democracy-sp__box{margin-top:10px}
.ms-democracy-sp__svg{display:block;width:100%;height:auto;overflow:visible}
.ms-democracy-sp__row.is-cur .ms-democracy-sp__who{color:var(--amber)}
.ms-democracy-sp__row.is-wait .ms-democracy-sp__what,.ms-democracy-sp__row.is-wait .ms-democracy-sp__who,.ms-democracy-sp__row.is-wait .ms-democracy-sp__who span{color:var(--ms-dim)}
/* phones and short screens: one chart at a time, cross-fading */
.ms-democracy-sp.is-single{display:grid;align-items:center}
.ms-democracy-sp.is-single .ms-democracy-sp__row{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .45s var(--ms-ease),visibility 0s linear .45s}
.ms-democracy-sp.is-single .ms-democracy-sp__row.is-shown{opacity:1;visibility:visible;transition-delay:0s}

/* frames and value labels: faint until the chart is built */
.ms-democracy-frame{transition:opacity .45s var(--ms-ease)}
.ms-democracy-sp__svg:not(.is-built) .ms-democracy-frame{opacity:.4}
.ms-democracy-sp__svg:not(.is-built) .ms-democracy-hit{pointer-events:none}
.ms-democracy-vlab{opacity:0;transition:opacity .45s var(--ms-ease)}
.is-built .ms-democracy-vlab{opacity:1;transition-delay:var(--d,0s)}
.ms-democracy-axis{stroke:var(--rule);stroke-width:1.2;fill:none}
.ms-democracy-refline{stroke:var(--ink-4);stroke-width:1;stroke-dasharray:3 4;fill:none;opacity:.6}

/* Cai: bars */
.ms-democracy-barfill{transition:opacity .2s}
.ms-democracy-bar--human .ms-democracy-barfill{fill:var(--ms-stake)}
.ms-democracy-bar--ai .ms-democracy-barfill{fill:var(--ms-ai)}
.has-hot .ms-democracy-bar--ai:not(.is-hot) .ms-democracy-barfill{opacity:.3}   /* the people's 1.00 stays: it is the yardstick */

/* Jang: dumbbells */
.ms-democracy-dot--deb{fill:var(--ms-ai);stroke:var(--ground);stroke-width:1.5}
.ms-democracy-dot--sea{fill:var(--ground);stroke:var(--ms-ai);stroke-width:2.2}
.ms-democracy-dot{opacity:0;transition:opacity .3s var(--ms-ease)}
.is-built .ms-democracy-dot{opacity:1;transition-delay:calc(var(--d,0s) + .15s)}
.ms-democracy-dumbline{stroke:var(--ms-old);stroke-width:3;stroke-linecap:round;opacity:0;transition:opacity .3s var(--ms-ease)}
.is-built .ms-democracy-dumbline{opacity:1;transition-delay:calc(var(--d,0s) + .15s)}
.ms-democracy-dumb{transition:opacity .2s}
.has-hot .ms-democracy-dumb:not(.is-hot){opacity:.3}

/* Flechtner: slopes */
.ms-democracy-slope__line{fill:none;stroke-width:3.5;stroke-linecap:butt}
.ms-democracy-slope--stake .ms-democracy-slope__line{stroke:var(--ms-stake);stroke-width:4}
.ms-democracy-slope--ai .ms-democracy-slope__line{stroke:var(--ms-ai)}
.ms-democracy-slope--ailo .ms-democracy-slope__line{stroke:var(--ms-ai);stroke-opacity:.5;stroke-width:3}
.ms-democracy-slope__dot{stroke:var(--ground);stroke-width:2}
.ms-democracy-slope--stake .ms-democracy-slope__dot{fill:var(--ms-stake)}
.ms-democracy-slope--ai .ms-democracy-slope__dot{fill:var(--ms-ai)}
.ms-democracy-slope--ailo .ms-democracy-slope__dot{fill:var(--ms-ai);fill-opacity:.55}
.ms-democracy-draw{stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset .9s var(--ms-ease-io)}
.is-built .ms-democracy-draw{stroke-dashoffset:0;transition-delay:calc(var(--d,0s) + .15s)}
.ms-democracy-slope__dot{opacity:0;transform:scale(.3);transform-box:fill-box;transform-origin:center;transition:opacity .25s,transform .45s cubic-bezier(.34,1.56,.64,1)}
.is-built .ms-democracy-slope__dot--a{opacity:1;transform:none;transition-delay:var(--d,0s)}
.is-built .ms-democracy-slope__dot--b{opacity:1;transform:none;transition-delay:calc(var(--d,0s) + .95s)}
.ms-democracy-slope{transition:opacity .2s}
.has-hot .ms-democracy-slope:not(.is-hot){opacity:.3}

/* =====================================================================
   2 · Count, consent, contest
   ===================================================================== */
.ms-democracy-ccc{width:100%}
.ms-democracy-ccc__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.8vw,24px);align-items:start}
.ms-democracy-ccc__col{min-width:0}
.ms-democracy-ccc__name{font:700 12px/1.3 var(--f-label);letter-spacing:.2em;text-transform:uppercase;color:var(--ms-dim);transition:color .35s ease}
.ms-democracy-ccc__col.is-on .ms-democracy-ccc__name{color:var(--ms-label)}
.ms-democracy-ccc__col.is-cur .ms-democracy-ccc__name{color:var(--ink)}
.ms-democracy-ccc__card{position:relative;margin-top:10px;aspect-ratio:240/210;border-radius:16px;background:var(--ms-old-field);box-shadow:inset 0 0 0 1px var(--rule-soft);
  transition:box-shadow .5s var(--ms-ease),background-color .5s var(--ms-ease);cursor:default;outline:none}
.ms-democracy-ccc__col--contest .ms-democracy-ccc__card{background:var(--ms-card);box-shadow:inset 0 0 0 1px var(--rule)}
.ms-democracy-ccc__card:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.ms-democracy-ccc__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transition:opacity .5s var(--ms-ease)}
.ms-democracy-ccc__line{margin-top:12px;font:600 clamp(15px,1.6vw,23px)/1.15 var(--f-name);letter-spacing:0;color:var(--ms-old-ink);opacity:0;transform:translateY(6px);transition:opacity .45s var(--ms-ease),transform .5s var(--ms-ease),color .4s}
.ms-democracy-ccc__col.is-on .ms-democracy-ccc__line{opacity:1;transform:none;transition-delay:.5s,.5s,0s}
.ms-democracy-ccc__col--contest .ms-democracy-ccc__line{color:var(--ink)}
/* the pill settles on contest; the other two step back; contest glows like the Venn's centre */
.ms-democracy-ccc__pill{position:absolute;left:50%;top:0;z-index:2;transform:translate(-50%,-50%) translateY(-18px);opacity:0;
  font:700 10.5px/1 var(--f-label);letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;color:var(--democracy-pill-ink);background:var(--democracy-pill);
  padding:7px 12px 6px;border-radius:var(--r-pill);box-shadow:0 6px 16px -8px var(--ms-shadow);
  transition:opacity .3s ease,transform .75s cubic-bezier(.34,1.56,.64,1)}
.is-pill .ms-democracy-ccc__pill{opacity:1;transform:translate(-50%,-50%)}
.is-pill .ms-democracy-ccc__col--contest .ms-democracy-ccc__card{box-shadow:inset 0 0 0 1.5px var(--democracy-ring),0 0 0 7px var(--venn-glow),0 18px 42px -14px var(--democracy-halo);transition-delay:.25s}
.is-pill .ms-democracy-ccc__col--count .ms-democracy-ccc__svg,.is-pill .ms-democracy-ccc__col--consent .ms-democracy-ccc__svg{opacity:.42}
.is-pill .ms-democracy-ccc__col--count .ms-democracy-ccc__line,.is-pill .ms-democracy-ccc__col--consent .ms-democracy-ccc__line{color:var(--ms-dim)}
/* pointing: the phrase and its column light up together */
.ms-democracy-ccc__col.is-hot .ms-democracy-ccc__card{box-shadow:inset 0 0 0 1.5px var(--ink)}
.is-pill .ms-democracy-ccc__col--contest.is-hot .ms-democracy-ccc__card{box-shadow:inset 0 0 0 2.5px var(--democracy-ring),0 0 0 7px var(--venn-glow),0 18px 42px -14px var(--democracy-halo)}
.has-hot .ms-democracy-ccc__col.is-hot .ms-democracy-ccc__svg{opacity:1}
/* the closing line, in two tones: graphite points at count, amber at contest's bridges */
.ms-democracy-ccc__close{margin-top:clamp(22px,3.4vh,40px);font-family:var(--f-q);font-style:italic;font-weight:400;font-size:clamp(21px,2.35vw,34px);line-height:1.2;letter-spacing:-.012em;color:var(--ink);text-wrap:balance}
.ms-democracy-ccc__a,.ms-democracy-ccc__b{display:block;opacity:0;transform:translateY(10px);transition:opacity .6s var(--ms-ease),transform .7s var(--ms-ease)}
.is-close .ms-democracy-ccc__a{opacity:1;transform:none;transition-delay:.9s}
.is-close .ms-democracy-ccc__b{opacity:1;transform:none;transition-delay:1.45s}
.ms-democracy-ccc__most{color:var(--ms-old-ink)}
.ms-democracy-ccc__we{color:var(--amber)}
.ms-democracy-ccc__most,.ms-democracy-ccc__we{cursor:default;white-space:nowrap;transition:box-shadow .25s;-webkit-box-decoration-break:clone;box-decoration-break:clone}   /* each phrase breaks as a unit */
.ms-democracy-ccc__most.is-hot{box-shadow:inset 0 -.3em 0 var(--democracy-most-mark)}
.ms-democracy-ccc__we.is-hot{box-shadow:inset 0 -.3em 0 var(--ms-mark)}

/* phones: the column being read widens; only its line shows (the step text carries the others) */
.ms-democracy-ccc.is-narrow .ms-democracy-ccc__cols{grid-template-columns:2.4fr 1fr 1fr;gap:10px;transition:grid-template-columns .7s var(--ms-ease-io)}
.ms-democracy-ccc.is-narrow[data-focus="1"] .ms-democracy-ccc__cols{grid-template-columns:1fr 2.4fr 1fr}
.ms-democracy-ccc.is-narrow[data-focus="2"] .ms-democracy-ccc__cols{grid-template-columns:1fr 1fr 2.4fr}
.ms-democracy-ccc.is-narrow .ms-democracy-ccc__name{font-size:10.5px;letter-spacing:.14em}
.ms-democracy-ccc.is-narrow .ms-democracy-ccc__card{border-radius:12px}
.ms-democracy-ccc.is-narrow .ms-democracy-ccc__line{display:none;font-size:16px}
.ms-democracy-ccc.is-narrow[data-focus="0"] .ms-democracy-ccc__col--count .ms-democracy-ccc__line,
.ms-democracy-ccc.is-narrow[data-focus="1"] .ms-democracy-ccc__col--consent .ms-democracy-ccc__line,
.ms-democracy-ccc.is-narrow[data-focus="2"] .ms-democracy-ccc__col--contest .ms-democracy-ccc__line{display:block}

/* glyphs: the strokes draw themselves (pathLength = 1) */
.ms-democracy-stroke,.ms-democracy-cline,.ms-democracy-arrow,.ms-democracy-doc,.ms-democracy-doclines,.ms-democracy-link,.ms-democracy-bridge{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1;stroke-dashoffset:1;opacity:0}
/* Count */
.ms-democracy-tally{stroke:var(--ms-old-ink);transition:stroke .5s var(--ms-ease)}
.ms-democracy-stroke{stroke-width:3.2;transition:stroke-dashoffset .22s var(--ms-ease),opacity .05s}
.is-on .ms-democracy-stroke{stroke-dashoffset:0;opacity:1;transition-delay:var(--d,0s)}
.is-on .ms-democracy-tally{transition-delay:1.2s}
.is-on .ms-democracy-tally:not(.is-win){stroke:var(--ms-old)}
.is-on .ms-democracy-tally.is-win{stroke:var(--ink)}
.ms-democracy-tick{stroke:var(--ink);stroke-width:4;transition:stroke-dashoffset .35s var(--ms-ease),opacity .05s}
/* Consent */
.ms-democracy-cline{stroke:var(--ms-old);stroke-width:1.3;transition:stroke-dashoffset .45s var(--ms-ease),opacity .2s}
.is-on .ms-democracy-cline{stroke-dashoffset:0;opacity:.8;transition-delay:var(--d,0s)}
.ms-democracy-cghost{fill:none;stroke:var(--ms-old);stroke-width:1.1;opacity:0;transition:opacity .4s}
.is-on .ms-democracy-cghost{opacity:.9;transition-delay:1.35s}
.ms-democracy-cdot{fill:var(--ms-old-ink);opacity:0;transition:opacity .25s}
.is-on .ms-democracy-cdot{opacity:1;transition-delay:var(--d,0s)}
.ms-democracy-cmove{transition:transform .65s var(--ms-ease-io),opacity .3s}
.is-on .ms-democracy-cmove{transform:translate(var(--tx),var(--ty));opacity:0;transition-delay:var(--d,0s),calc(var(--d,0s) + .45s)}
.ms-democracy-hub{fill:var(--ground);stroke:var(--ms-old-ink);stroke-width:2;opacity:0;transform:scale(.4);transform-box:fill-box;transform-origin:center;transition:opacity .3s,transform .5s cubic-bezier(.34,1.56,.64,1)}
.ms-democracy-hub--dot{fill:var(--ms-old-ink);stroke:none}
.is-on .ms-democracy-hub{opacity:1;transform:none;transition-delay:1.4s}
.ms-democracy-arrow{stroke:var(--ms-old-ink);stroke-width:1.8;transition:stroke-dashoffset .35s var(--ms-ease),opacity .05s}
.is-on .ms-democracy-arrow{stroke-dashoffset:0;opacity:1;transition-delay:1.6s}
.ms-democracy-doc{stroke:var(--ink);stroke-width:2;fill:var(--ground);transition:stroke-dashoffset .5s var(--ms-ease),opacity .05s}
.is-on .ms-democracy-doc{stroke-dashoffset:0;opacity:1;transition-delay:1.8s}
.ms-democracy-doclines{stroke:var(--ink);stroke-width:1.8;transition:stroke-dashoffset .4s var(--ms-ease),opacity .05s}
.is-on .ms-democracy-doclines{stroke-dashoffset:0;opacity:1;transition-delay:2.15s}
/* Contest */
.ms-democracy-tmove{transform:translate(var(--tx),var(--ty));opacity:0;transition:transform .85s var(--ms-ease-io),opacity .3s}
.is-on .ms-democracy-tmove{transform:none;opacity:1;transition-delay:var(--d,0s),0s}
.ms-democracy-tdot{fill:var(--ms-stake);stroke:var(--ms-card);stroke-width:1.6}
.ms-democracy-link{stroke:var(--democracy-link);stroke-width:1.8;transition:stroke-dashoffset .45s var(--ms-ease),opacity .2s}
.is-on .ms-democracy-link{stroke-dashoffset:0;opacity:var(--democracy-link-o);transition-delay:var(--d,0s)}
.ms-democracy-split{stroke:var(--ms-old-ink);stroke-width:1.5;stroke-linecap:round;opacity:0;transition:opacity .15s}
.is-on .ms-democracy-split{opacity:.85;transition-delay:var(--d,0s)}
.ms-democracy-bridge{stroke:var(--democracy-bridge);stroke-width:2.6;transition:stroke-dashoffset .6s var(--ms-ease-io),opacity .1s,stroke-width .25s}
.is-on .ms-democracy-bridge{stroke-dashoffset:0;opacity:1;transition-delay:var(--d,0s)}
.ms-democracy-ccc__col--contest.is-hot .ms-democracy-bridge{stroke-width:3.6}

/* =====================================================================
   3 · Between two cliffs
   ===================================================================== */
.ms-democracy-cl{width:100%}
.ms-democracy-cl__svg{display:block;width:100%;height:auto;overflow:hidden}
/* before they rise: where the cliffs will stand, dashed */
.ms-democracy-cl-ghost{fill:none;stroke:var(--ms-old);stroke-width:1.2;stroke-dasharray:3 5;stroke-linejoin:round;opacity:.6;transition:opacity .5s var(--ms-ease)}
.is-l-up .ms-democracy-cl-ghost--l,.is-r-up .ms-democracy-cl-ghost--r{opacity:0}
/* the masses rise from below */
.ms-democracy-cliff{transform:translateY(var(--rise,300px));transition:transform 1.15s var(--ms-ease-io)}
.ms-democracy-cliff.is-up{transform:none}
.ms-democracy-cliff--r.is-up{transition-delay:.25s}
.ms-democracy-rock--0{fill:var(--democracy-rock-0)}
.ms-democracy-rock--1{fill:var(--democracy-rock-1)}
.ms-democracy-rock--2{fill:var(--democracy-rock-2)}
.ms-democracy-rock--3{fill:var(--democracy-rock-3)}
.ms-democracy-rock--4{fill:var(--democracy-rock-4)}
.ms-democracy-rock__seam{fill:none;stroke:var(--democracy-seam);stroke-width:1}
.ms-democracy-cliff__wall{fill:none;stroke:var(--democracy-wall);stroke-width:1.3;stroke-linejoin:round}
.ms-democracy-cliff__lit{fill:none;stroke:var(--democracy-lit);stroke-width:2.2;stroke-linecap:round}
.ms-democracy-cliff__edge{fill:none;stroke:var(--democracy-edge);stroke-width:1.8;stroke-linecap:round;transition:stroke .25s,stroke-width .25s}
.ms-democracy-cliff.is-hot .ms-democracy-cliff__edge,.ms-democracy-cliff.is-cur .ms-democracy-cliff__edge{stroke:var(--ink);stroke-width:2.4}
.ms-democracy-cliff__hit{fill:transparent}
.ms-democracy-cl-text{opacity:0;transition:opacity .5s var(--ms-ease)}
.ms-democracy-cliff.is-up .ms-democracy-cl-text{opacity:1;transition-delay:.75s}
.ms-democracy-cl-name{font-family:var(--f-label);font-weight:700;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;fill:var(--ink-3)}
.ms-democracy-cl-def{font-family:var(--f-q);font-style:italic;font-weight:400;font-size:22px;fill:var(--ink)}
.is-nar .ms-democracy-cl-name{font-size:10.5px;letter-spacing:.14em}
.is-nar .ms-democracy-cl-def{font-size:16px}
.ms-democracy-cl-fade{pointer-events:none}
/* the braided path */
.ms-democracy-strand{fill:none;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.is-nar .ms-democracy-strand{stroke-width:2.4}
.ms-democracy-strand--stake{stroke:var(--ms-stake)}
.ms-democracy-strand--inst{stroke:var(--ms-inst)}
.ms-democracy-strand--ai{stroke:var(--ms-ai)}
.ms-democracy-strand__halo{fill:none;stroke:var(--ground);stroke-width:7.5;stroke-linecap:butt}
.is-nar .ms-democracy-strand__halo{stroke-width:5.6}
.ms-democracy-knot{fill:var(--ms-old-ink)}
.ms-democracy-braid__hit{fill:none;stroke:transparent;stroke-width:26;pointer-events:stroke}
.ms-democracy-cl__svg:not(.is-braid) .ms-democracy-braid__hit{pointer-events:none}
/* the three stones pop in order */
.ms-democracy-pop{opacity:0;transform:scale(0);transform-box:fill-box;transform-origin:center;transition:opacity .2s,transform .6s cubic-bezier(.34,1.56,.64,1)}
.is-stones .ms-democracy-pop{opacity:1;transform:none;transition-delay:var(--d,0s)}
.ms-democracy-cl__svg:not(.is-stones) .ms-democracy-stone{pointer-events:none}
.ms-democracy-stone__disc{stroke-width:2.6;transition:stroke-width .2s}
.ms-democracy-stone.is-hot .ms-democracy-stone__disc{stroke-width:3.6}
.ms-democracy-stone__glow{opacity:var(--democracy-glow-o)}
.ms-democracy-stone--ai .ms-democracy-stone__disc{stroke:var(--ms-ai);fill:var(--venn-ai)}
.ms-democracy-stone--ai .ms-democracy-stone__glow{fill:var(--ms-ai)}
.ms-democracy-stone--ai .ms-democracy-stone__mark,.ms-democracy-stone--ai .ms-democracy-stone__lab{color:var(--ms-ai-ink);fill:var(--ms-ai-ink)}
.ms-democracy-stone--inst .ms-democracy-stone__disc{stroke:var(--ms-inst);fill:var(--venn-inst)}
.ms-democracy-stone--inst .ms-democracy-stone__glow{fill:var(--ms-inst)}
.ms-democracy-stone--inst .ms-democracy-stone__mark,.ms-democracy-stone--inst .ms-democracy-stone__lab{color:var(--ms-inst-ink);fill:var(--ms-inst-ink)}
.ms-democracy-stone--stake .ms-democracy-stone__disc{stroke:var(--ms-stake);fill:var(--venn-stake)}
.ms-democracy-stone--stake .ms-democracy-stone__glow{fill:var(--ms-stake)}
.ms-democracy-stone--stake .ms-democracy-stone__mark,.ms-democracy-stone--stake .ms-democracy-stone__lab{color:var(--ms-stake-ink);fill:var(--ms-stake-ink)}
.ms-democracy-mark--spark line{stroke:currentColor;stroke-width:1.9;stroke-linecap:round}
.ms-democracy-mark--brackets path{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:square}
.ms-democracy-mark--dots circle{fill:currentColor;stroke:none}
.ms-democracy-stone__lab{font-family:var(--f-text);font-weight:600;font-size:15px;letter-spacing:-.005em;opacity:0;transform:translateY(6px);transition:opacity .4s var(--ms-ease),transform .5s var(--ms-ease)}
.is-nar .ms-democracy-stone__lab{font-size:11.5px}
.is-stones .ms-democracy-stone__lab{opacity:1;transform:none;transition-delay:calc(var(--d,0s) + .2s)}