:root{
  --paper:#ECEFF3; --panel:#FFFFFF; --ink:#0C1A2B; --ink2:#53627A; --line:#CBD3DE;
  --accent:#2740F5; --client:#E4570F; --client-soft:#FCE9DD; --field:#51607A; --field-soft:#E2E7EF;
  --good:#157A5B; --bad:#B3361F; --warn:#9A6A00;
  --rail:240px; --ease:cubic-bezier(.2,.8,.2,1);
  --display:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;
  --body:'IBM Plex Sans','Segoe UI',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--paper);color:var(--ink);font:15px/1.55 var(--body);overflow:hidden}
button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3,h4{font-family:var(--display);margin:0;letter-spacing:-.02em;line-height:1.08}
p{margin:0}
.grid-bg{position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:48px 48px;opacity:.45;mask-image:radial-gradient(ellipse at 70% 30%,#000 10%,transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse at 70% 30%,#000 10%,transparent 75%)}

/* rail */
.rail{position:fixed;left:0;top:0;bottom:0;width:var(--rail);z-index:5;background:var(--ink);color:#DCE3EE;
  padding:26px 18px;display:flex;flex-direction:column;gap:6px}
.rail .brand{font:700 18px/1.2 var(--display);color:#fff;padding:0 10px 4px}
.rail .brand-sub{font-size:12.5px;color:#93A1B8;padding:0 10px 22px}
.rail button.nav{display:flex;gap:12px;align-items:baseline;text-align:left;background:none;border:0;padding:9px 10px;border-radius:6px;color:#A9B5C8;position:relative;transition:color .2s,background .2s}
.rail button.nav b{font:500 12px var(--mono);color:#6F7F99;width:18px}
.rail button.nav:hover{color:#fff;background:#16273D}
.rail button.nav.on{color:#fff;background:#16273D}
.rail button.nav.on::before{content:"";position:absolute;left:-18px;top:8px;bottom:8px;width:3px;background:var(--accent);border-radius:0 3px 3px 0}
.rail button.nav.on b{color:#7C92FF}
.rail .grow{flex:1}
.rail .tools{display:flex;gap:8px;padding:0 10px}
.rail .tools button{flex:1;background:#16273D;border:1px solid #243752;color:#DCE3EE;border-radius:6px;padding:8px;font-size:13px}
.rail .tools button:hover{border-color:var(--accent)}
.rail .hint{font-size:12px;color:#6F7F99;padding:10px 10px 0}

/* stage */
.stage{position:fixed;left:var(--rail);right:0;top:0;bottom:0;z-index:1}
.chapter{position:absolute;inset:0;overflow-y:auto;padding:52px 56px 120px;visibility:hidden}
.chapter.is-active{visibility:visible}
.chapter>*{max-width:1080px}
[data-reveal]{opacity:0;transform:translateY(16px);filter:blur(4px);
  transition:opacity .7s var(--ease),transform .7s var(--ease),filter .7s var(--ease);transition-delay:calc(var(--i,0)*70ms + 360ms)}
.is-active [data-reveal]{opacity:1;transform:none;filter:none}

.ch-head{margin-bottom:30px}
.ch-head .num{font:500 13px var(--mono);color:var(--accent);margin-bottom:12px;display:flex;align-items:center;gap:10px}
.ch-head .num::after{content:"";height:1px;width:64px;background:var(--accent);opacity:.5}
.ch-head h2{font-size:clamp(30px,3.6vw,48px);font-weight:800;max-width:760px}
.ch-head .lead{font-size:17px;color:var(--ink2);max-width:640px;margin-top:14px}

/* generic surfaces */
.card{background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:20px 22px;position:relative}
.card::before,.card::after{content:"";position:absolute;width:9px;height:9px;border:solid var(--ink);opacity:.55}
.card::before{left:-1px;top:-1px;border-width:2px 0 0 2px}
.card::after{right:-1px;bottom:-1px;border-width:0 2px 2px 0}
.cards{display:grid;gap:16px}
.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.big{font:800 44px/1 var(--display);letter-spacing:-.03em}
.mono{font-family:var(--mono)}
.muted{color:var(--ink2)}
.small{font-size:13px}
.chip{display:inline-block;font:500 12px var(--mono);padding:2px 8px;border-radius:3px;border:1px solid var(--line);background:var(--panel)}
.chip.c{background:var(--client-soft);border-color:#F3C3A4;color:#A63D07}
.chip.f{background:var(--field-soft);border-color:#C5CFDF;color:#3D4C66}
.chip.good{color:var(--good)} .chip.bad{color:var(--bad)} .chip.warn{color:var(--warn)}
.banner{display:inline-block;background:#FFF3C9;border:1px solid #E7CF7A;color:#6B5200;padding:6px 12px;border-radius:4px;font-size:13px;margin-top:22px}
.btn{background:var(--ink);color:#fff;border:0;border-radius:4px;padding:12px 20px;font-weight:600;transition:background .2s,transform .2s}
.btn:hover{background:var(--accent);transform:translateY(-1px)}
.filters{display:flex;gap:8px;margin-bottom:18px;flex-wrap:wrap}
.filters button{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:6px 14px;font-size:13px;transition:all .2s}
.filters button.on{background:var(--ink);color:#fff;border-color:var(--ink)}

/* cover */
.cover{display:grid;grid-template-columns:1.05fr .95fr;gap:20px;align-items:center;min-height:calc(100vh - 170px)}
.cover h1{font-size:clamp(42px,5.6vw,82px);font-weight:800}
.cover .sub{font-size:18px;color:var(--ink2);margin-top:20px;max-width:520px}
.cover .facts{display:flex;gap:34px;margin:34px 0 30px;flex-wrap:wrap}
.cover .facts .big{font-size:34px}
.cover .facts .small{color:var(--ink2);margin-top:4px}
.cover .where{margin-top:16px;color:var(--ink2);font-size:14px}
.constellation{width:100%;max-width:520px;justify-self:center}
.constellation .ring{fill:none;stroke:var(--line);stroke-dasharray:3 6}
.constellation .spin{transform-origin:260px 260px;animation:spin 90s linear infinite}
.cl-line{stroke:var(--ink2);stroke-width:1;stroke-dasharray:1;stroke-dashoffset:1;opacity:.6;transition:stroke-dashoffset 1.2s var(--ease);transition-delay:calc(var(--i)*110ms + 500ms)}
.is-active .cl-line{stroke-dashoffset:0}
.cl-node{transform-box:fill-box;transform-origin:center;transform:scale(0);transition:transform .7s var(--ease);transition-delay:calc(var(--i)*110ms + 900ms)}
.is-active .cl-node{transform:scale(1)}
.cl-node.client{fill:var(--client)} .cl-node.field{fill:var(--field)}
.cl-txt{font:600 12px var(--mono);fill:#fff;text-anchor:middle;dominant-baseline:central}
.cl-val{font:500 12px var(--mono);fill:var(--ink);text-anchor:middle;dominant-baseline:central}
.cl-core{font:800 40px var(--display);fill:var(--ink);text-anchor:middle}
.cl-core-s{font:500 12px var(--body);fill:var(--ink2);text-anchor:middle}
@keyframes spin{to{transform:rotate(360deg)}}

/* roster */
.roster{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.cand{text-align:left;padding:0;border:0;background:none}
.cand .card{height:100%;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.cand:hover .card{transform:translateY(-4px);box-shadow:0 14px 30px -18px rgba(12,26,43,.45);border-color:var(--ink)}
.cand.hide{display:none}
.avatar{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font:700 16px var(--mono);color:#fff;margin-bottom:14px}
.avatar.client{background:var(--client)} .avatar.field{background:var(--field)}
.cand h3{font-size:21px}
.cand .party{color:var(--ink2);font-size:13px;margin:2px 0 12px}
.cand dl,.dossier dl{display:grid;grid-template-columns:auto 1fr;gap:5px 14px;margin:14px 0 0;font-size:13px}
.cand dt,.dossier dt{color:var(--ink2)}
.cand dd,.dossier dd{margin:0}
.cand .open{margin-top:14px;font-size:13px;color:var(--accent);font-weight:600}

/* bars */
.bar-row{display:grid;grid-template-columns:170px 1fr 54px;gap:14px;align-items:center;margin:11px 0}
.bar-name{font-weight:600;font-size:14px;line-height:1.2}
.bar-name small{display:block;color:var(--ink2);font-weight:400;font-size:12px}
.bar{height:20px;background:var(--field-soft);border-radius:2px;overflow:hidden}
.bar i{display:block;height:100%;width:var(--w);background:var(--field);transform-origin:left;transition:width 1.1s var(--ease);transition-delay:calc(var(--i)*80ms + 500ms)}
.bar i.client{background:var(--client)}
.bar i.hatch{background:repeating-linear-gradient(135deg,#9AA7BB 0 4px,#C9D2E0 4px 8px)}
.chapter:not(.is-active) .bar i{width:0}
.bar-val{font:600 14px var(--mono);text-align:right}
.stack{display:flex;height:44px;border-radius:3px;overflow:hidden;margin-top:12px}
.stack span{display:grid;place-items:center;color:#fff;font:600 13px var(--mono);width:var(--w);transition:width 1.2s var(--ease) .6s;white-space:nowrap}
.chapter:not(.is-active) .stack span{width:0}

/* table */
table{width:100%;border-collapse:collapse;font-size:14px}
th{font-weight:600;text-align:left;color:var(--ink2);font-size:13px;padding:8px 10px;border-bottom:1px solid var(--ink)}
td{padding:9px 10px;border-bottom:1px solid var(--line)}
td.n,th.n{text-align:right;font-family:var(--mono)}
.tbl{overflow-x:auto}
.heat td.cell{text-align:center;font:500 13px var(--mono);min-width:54px}
.heat td.lead{outline:2px solid var(--ink);outline-offset:-2px;font-weight:700}
.heat tr.grp td{background:var(--paper);font-weight:700;font-family:var(--display);padding-top:14px}
.legend{display:flex;gap:18px;font-size:13px;color:var(--ink2);margin-top:12px;flex-wrap:wrap}
.legend i{display:inline-block;width:12px;height:12px;border-radius:2px;margin-right:6px;vertical-align:-1px}

/* sparklines */
.spark{width:100%;height:44px;display:block}
.spark polyline{fill:none;stroke:var(--field);stroke-width:2;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.3s var(--ease) .7s}
.spark.client polyline{stroke:var(--client)}
.is-active .spark polyline,.drawer.open .spark polyline{stroke-dashoffset:0}
.spark circle{fill:var(--ink)}

/* voices */
.voice h3{font-size:19px}
.voice .meta{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 12px;align-items:center}
.voice ul,.plain-list{margin:10px 0 0;padding-left:18px}
.voice li,.plain-list li{margin:6px 0}
.voice.hide{display:none}
.tone-Positive{color:var(--good)} .tone-Critical{color:var(--bad)} .tone-Mixed{color:var(--warn)}

/* actions */
.action{display:grid;grid-template-columns:90px 1fr;gap:18px;align-items:start}
.pri{font:600 12px var(--mono);padding:4px 0;text-align:center;border-radius:3px}
.pri.High{background:#F8DDD6;color:var(--bad)} .pri.Medium{background:#FBEDC7;color:var(--warn)} .pri.Watch{background:var(--field-soft);color:var(--field)}

/* drawer */
.scrim{position:fixed;inset:0;background:rgba(12,26,43,.45);opacity:0;pointer-events:none;transition:opacity .4s;z-index:20}
.scrim.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(480px,100%);background:var(--panel);z-index:21;transform:translateX(102%);transition:transform .55s var(--ease);padding:30px 30px 60px;overflow-y:auto;border-left:2px solid var(--ink)}
.drawer.open{transform:none}
.drawer .x{position:absolute;right:18px;top:16px;background:none;border:1px solid var(--line);border-radius:4px;width:34px;height:34px}
.dossier h3{font-size:30px;margin:6px 0 4px}
.dossier h4{font-size:16px;margin:26px 0 8px}
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px}
.stat-row div{border:1px solid var(--line);padding:10px;border-radius:4px}
.stat-row .big{font-size:28px}

/* wipe */
.wipe{position:fixed;inset:0;z-index:30;background:var(--ink);color:#fff;display:grid;place-items:center;transform:translateX(-101%);pointer-events:none}
.wipe span{font:500 15px var(--mono);letter-spacing:.04em;opacity:0}
.wipe::after{content:"";position:absolute;top:0;bottom:0;right:0;width:3px;background:var(--accent);box-shadow:0 0 28px 6px var(--accent)}
.wipe.run{animation:wipe-f .8s var(--ease) forwards}
.wipe.run span{animation:wipe-t .8s ease forwards}
.wipe.run.back{animation-name:wipe-b}
.wipe.back::after{right:auto;left:0}
@keyframes wipe-f{0%{transform:translateX(-101%)}42%,58%{transform:translateX(0)}100%{transform:translateX(101%)}}
@keyframes wipe-b{0%{transform:translateX(101%)}42%,58%{transform:translateX(0)}100%{transform:translateX(-101%)}}
@keyframes wipe-t{0%,25%{opacity:0}40%,60%{opacity:1}75%,100%{opacity:0}}

/* pager */
.pager{position:fixed;right:28px;bottom:22px;z-index:6;display:flex;gap:8px}
.pager button{background:var(--panel);border:1px solid var(--ink);border-radius:4px;padding:9px 16px;font-weight:600;transition:all .2s}
.pager button:hover:not(:disabled){background:var(--ink);color:#fff}
.pager button:disabled{opacity:.35;cursor:default}

.error{padding:60px;max-width:620px}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

@media (max-width:980px){
  .cols-3,.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cover{grid-template-columns:1fr}
}
@media (max-width:760px){
  :root{--rail:0px}
  .rail{position:fixed;top:0;bottom:auto;left:0;right:0;width:auto;height:54px;flex-direction:row;padding:0 10px;overflow-x:auto;align-items:center}
  .rail .brand,.rail .brand-sub,.rail .grow,.rail .tools,.rail .hint{display:none}
  .rail button.nav{white-space:nowrap}.rail button.nav.on::before{display:none}
  .stage{top:54px}
  .chapter{padding:28px 18px 110px}
  .cols-2,.cols-3,.cols-4{grid-template-columns:1fr}
  .bar-row{grid-template-columns:1fr 54px}.bar-row .bar{grid-column:1/-1;order:3}
  .action{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important;transition-delay:0ms!important}
  [data-reveal]{filter:none}
  .cl-line{stroke-dashoffset:0}.cl-node{transform:none}
}
@media print{
  body{overflow:visible;background:#fff}
  .rail,.pager,.wipe,.scrim,.drawer,.grid-bg,.filters,.btn{display:none!important}
  .stage{position:static}
  .chapter{position:static;visibility:visible;overflow:visible;padding:20px 0;page-break-after:always}
  [data-reveal]{opacity:1;transform:none;filter:none}
  .bar i,.stack span{width:var(--w)!important}
  .cl-line{stroke-dashoffset:0}.cl-node{transform:none}.spark polyline{stroke-dashoffset:0}
  .cand.hide,.voice.hide{display:block}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}