  :root{
    --sea:#0A1B2E;
    --land:#16375C;
    --member:#2E7F92;
    --founder:#3E9DAF;
    --mono:'IBM Plex Mono',monospace;
    --disp:'Space Grotesk',sans-serif;
  }
  *{box-sizing:border-box;}
  .hud{display:flex;gap:16px;align-items:center;}
  .hud-item{font-size:11px;color:var(--ink-dim);text-align:right;}
  .hud-item b{display:block;font-family:var(--disp);font-size:17px;color:var(--ink);}
  /* map */
  .mapbox{position:relative;background:var(--sea);border:1px solid var(--line-dim);border-radius:3px;overflow:hidden;}
  .mapbox::before,.mapbox::after,.mb-bl,.mb-br{content:"";position:absolute;width:14px;height:14px;border-color:var(--line);border-style:solid;z-index:5;pointer-events:none;}
  .mapbox::before{top:0;left:0;border-width:2px 0 0 2px;}
  .mapbox::after{top:0;right:0;border-width:2px 2px 0 0;}
  .mb-bl{bottom:0;left:0;border-width:0 0 2px 2px;}
  .mb-br{bottom:0;right:0;border-width:0 2px 2px 0;}
  svg.map{display:block;width:100%;height:auto;}
  .cshape{fill:var(--land);stroke:var(--sea);stroke-width:1.1;transition:fill .45s ease;}
  .cshape.member{fill:var(--member);}
  .cshape.founder{fill:var(--founder);}
  .cshape.joining{fill:var(--drill);}
  .cshape.signing{fill:var(--line);}
  .cshape.candidate{fill:#2A4A6B;stroke-dasharray:3 3;stroke:var(--bad);stroke-width:1.2;}
  .cshape.leaving{fill:#5A3B4A;}
  .maplabel{font-family:var(--mono);font-size:13px;fill:var(--ink-dim);letter-spacing:.06em;}
  .pin{position:absolute;transform:translate(-50%,-50%);z-index:4;pointer-events:none;}
  .pin .ring{width:15px;height:15px;border-radius:50%;border:2px solid var(--drill);background:rgba(255,159,90,.25);}
  .pin .pulse{position:absolute;inset:-9px;border-radius:50%;border:1px solid var(--drill);animation:pulse 2.4s ease-out infinite;}
  @keyframes pulse{0%{transform:scale(.5);opacity:.9}100%{transform:scale(1.7);opacity:0}}
  @media(prefers-reduced-motion:reduce){.pin .pulse{animation:none;opacity:.35}}
  .callout{position:absolute;z-index:6;width:290px;background:rgba(15,39,64,.96);border:1px solid var(--line);border-radius:2px;padding:13px 14px;backdrop-filter:blur(3px);}
  .callout .yr{font-family:var(--disp);font-size:11px;letter-spacing:.12em;color:var(--drill);text-transform:uppercase;margin:0 0 3px;}
  .callout h3{font-family:var(--disp);font-size:14.5px;margin:0 0 3px;line-height:1.35;}
  .callout .place{font-size:10.5px;color:var(--ink-dim);margin:0 0 8px;letter-spacing:.05em;}
  .callout p.body{font-size:11.5px;line-height:1.65;color:var(--ink);margin:0;}
  .callout .leg{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px;padding-top:8px;border-top:1px solid var(--line-dim);font-size:10px;color:var(--ink-dim);}
  .callout .tail{position:absolute;width:9px;height:9px;background:rgba(15,39,64,.96);border-left:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg);}
  @media(max-width:780px){.callout{display:none;}}
  /* timeline */
  .tl-shell{margin-top:16px;position:relative;}
  .tl-rail{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:16px 0 6px;scrollbar-width:thin;}
  .tl-rail::-webkit-scrollbar{height:5px;}
  .tl-rail::-webkit-scrollbar-thumb{background:var(--line-dim);border-radius:3px;}
  .tl-track{display:flex;align-items:flex-start;position:relative;}
  .tl-line{position:absolute;top:23px;left:0;right:0;height:1px;background:var(--line-dim);}
  .tl-node{scroll-snap-align:center;flex:0 0 122px;display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;background:none;border:0;padding:0;font-family:var(--mono);color:var(--ink-dim);position:relative;}
  .tl-node .dot{width:12px;height:12px;border-radius:50%;border:2px solid var(--line-dim);background:var(--bg);margin-top:17px;transition:all .2s;}
  .tl-node .yr{font-family:var(--disp);font-size:13px;font-weight:600;}
  .tl-node .lb{font-size:9.5px;line-height:1.35;text-align:center;padding:0 6px;height:26px;overflow:hidden;}
  .tl-node.treaty .dot{border-color:var(--line);}
  .tl-node.accession .dot{border-color:var(--ok);}
  .tl-node.milestone .dot{border-style:dashed;}
  .tl-node.active .dot{background:var(--drill);border-color:var(--drill);transform:scale(1.35);}
  .tl-node.active{color:var(--ink);}
  .tl-node.active .yr{color:var(--drill);}
  .tl-node:focus-visible{outline:2px solid var(--line);outline-offset:3px;}
  .tl-fade{position:absolute;top:0;bottom:6px;width:44px;pointer-events:none;z-index:2;}
  .tl-fade.l{left:0;background:linear-gradient(90deg,var(--bg),transparent);}
  .tl-fade.r{right:0;background:linear-gradient(270deg,var(--bg),transparent);}
  .tl-ctrl{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:6px;flex-wrap:wrap;}
  .hint{font-size:10.5px;color:var(--ink-dim);}
  /* detail panel */
  .detail{margin-top:18px;background:var(--panel);border:1px solid var(--line-dim);border-radius:3px;padding:18px 18px 16px;position:relative;}
  .detail .kick{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--drill);margin:0 0 5px;}
  .detail h2{font-family:var(--disp);font-size:19px;margin:0 0 4px;}
  .detail .meta{font-size:11px;color:var(--ink-dim);margin:0 0 12px;line-height:1.6;}
  .detail p.sum{font-size:13px;line-height:1.75;margin:0 0 14px;}
  .detail .why{font-size:12.5px;line-height:1.7;color:var(--ink-dim);border-left:2px solid var(--line);padding-left:12px;margin:0 0 14px;}
  .statrow{display:flex;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line-dim);border-bottom:1px solid var(--line-dim);padding:11px 0;margin-bottom:13px;}
  .stat{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-dim);}
  .stat b{display:block;font-family:var(--disp);font-size:19px;letter-spacing:0;text-transform:none;color:var(--ink);margin-top:2px;}
  .stat.acc b{color:var(--drill);}
  .grp{margin-bottom:12px;}
  .grp .lab{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-dim);margin:0 0 7px;}
  .chips{display:flex;flex-wrap:wrap;gap:5px;}
  .chip{font-size:11px;padding:4px 9px;border-radius:2px;border:1px solid var(--line-dim);background:var(--panel-2);color:var(--ink);white-space:nowrap;}
  .chip.new{border-color:var(--drill);color:var(--drill);}
  .chip.cand{border-color:var(--bad);color:var(--bad);border-style:dashed;}
  .chip.out{border-color:#8A5A6E;color:#D89AAF;text-decoration:line-through;}
  .legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px;font-size:10px;color:var(--ink-dim);letter-spacing:.05em;}
  .legend i{display:inline-block;width:11px;height:11px;border-radius:2px;margin-right:5px;vertical-align:-1px;}
  .foot{font-size:10.5px;color:var(--ink-dim);line-height:1.7;margin-top:20px;border-top:1px solid var(--line-dim);padding-top:12px;}
