:root{--paper:#f3e9d6;--paper2:#efe0c8;--card:#fbf6e9;--ink:#20201d;--text:#534e41;--muted:#7a7465;--gold:#d9a33d;--teal:#197c83;--rust:#bd4c3c;--green:#47724c;--plum:#7a5aa0;--line:#20201d33;--shadow:#20201d59;--night:#14181f}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--text);font:300 19px/1.6 Newsreader,Georgia,serif;overflow-x:hidden}
::selection{background:var(--ink);color:var(--paper)}
a{color:var(--teal)}a:hover{color:var(--rust)}
b,strong{font-weight:500;color:var(--ink)}
h1,h2,h3{font-family:Newsreader,Georgia,serif;font-weight:400;color:var(--ink);letter-spacing:-.02em;margin:0}
h1{font-size:clamp(44px,7vw,100px);line-height:.98;letter-spacing:-.025em;text-wrap:balance}
h2{font-size:clamp(32px,4.4vw,58px);line-height:1.04}
h3{font-size:22px;line-height:1.25;font-weight:500;letter-spacing:0}
p{margin:0 0 16px}
.k{display:inline-block;font:400 11px/1 Silkscreen,'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.02em;color:var(--ink);background:var(--gold);padding:7px 10px;border-radius:8px;margin:0 0 18px}
.mono{font-family:'IBM Plex Mono',monospace}
.muted{color:var(--muted)}
.lead{font-size:clamp(19px,1.5vw,24px);line-height:1.55;color:var(--ink);max-width:40em}
.btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 20px;border-radius:10px;font:400 11px/1 Silkscreen,'IBM Plex Mono',monospace;text-transform:uppercase;text-decoration:none;background:var(--card);color:var(--ink);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--shadow);transition:transform .15s ease}
.btn:hover{transform:translate(-1px,-1px);color:var(--ink)}
.btn.primary{background:var(--gold);outline:3px solid var(--ink);outline-offset:3px}
.btn.live{background:var(--rust);color:var(--card)}.btn.live:hover{color:var(--card)}
.btns{display:flex;flex-wrap:wrap;gap:18px}

/* menu bar */
header.bar{position:fixed;top:0;left:0;right:0;z-index:80;display:flex;align-items:center;gap:clamp(14px,2.4vw,30px);height:34px;padding:0 clamp(16px,4vw,44px);background:var(--card);border-bottom:2px solid var(--ink)}
header.bar .brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);flex:none;font:400 11px Silkscreen,monospace;letter-spacing:.02em}
header.bar .brand svg{animation:spinSlow 40s linear infinite}
header.bar nav{display:flex;gap:clamp(8px,1.6vw,22px);font:400 10px Silkscreen,monospace}
header.bar nav a{color:inherit;text-decoration:none;padding:3px 6px;white-space:nowrap}
header.bar nav a:hover{background:var(--ink);color:var(--card)}
header.bar .status{margin-left:auto;display:inline-flex;align-items:center;gap:10px;font:400 10px Silkscreen,monospace;color:var(--ink);white-space:nowrap}
header.bar .status i{width:9px;height:9px;background:var(--rust);border:2px solid var(--ink);animation:blinkSoft 2s ease-in-out infinite}

/* sections */
section{position:relative;padding:clamp(80px,12vh,150px) clamp(20px,7vw,110px);border-top:2px solid var(--ink);scroll-margin-top:36px}
.wrap{max-width:1180px;margin:0 auto}
.narrow{max-width:800px;margin:0 auto}
.center{text-align:center}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:var(--card);border:2px solid var(--ink);border-radius:3px;box-shadow:6px 6px 0 #20201dcc;padding:20px 22px}
.card h3{margin-bottom:8px}.card p{font-size:17px;line-height:1.5;margin:0}
.card .k{margin-bottom:12px}
.win{border:2px solid var(--ink);border-radius:3px;background:var(--card);box-shadow:6px 6px 0 #20201dcc;overflow:hidden}
.win .tb{position:relative;display:flex;align-items:center;height:26px;border-bottom:2px solid var(--ink);background:repeating-linear-gradient(180deg,transparent 0 5px,var(--ink) 5px 6px,transparent 6px 9px,var(--ink) 9px 10px,transparent 10px 13px,var(--ink) 13px 14px,transparent 14px 17px,var(--ink) 17px 18px)}
.win .tb i{display:inline-flex;margin-left:9px;background:var(--card);padding:0 5px}.win .tb i:before{content:'';display:block;width:11px;height:11px;border:2px solid var(--ink);background:var(--card)}
.win .tb span{position:absolute;left:50%;transform:translateX(-50%);background:var(--card);padding:0 10px;font:400 10px Silkscreen,monospace;color:var(--ink);white-space:nowrap}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* hero */
#hero{min-height:100svh;display:flex;align-items:center;padding-top:110px;padding-bottom:80px;border-top:0}
#hero .grid2{grid-template-columns:1fr 1.05fr;max-width:1340px;margin:0 auto;width:100%}
#hero h1 span{display:inline-block;opacity:0;animation:riseIn .9s cubic-bezier(.2,.7,.2,1) forwards}
#hero .sub{margin:26px 0 0;font-size:clamp(18px,1.6vw,24px);line-height:1.6;color:var(--text);max-width:34em;opacity:0;animation:riseIn .9s cubic-bezier(.2,.7,.2,1) 1.1s forwards}
#hero .btns{margin-top:34px;opacity:0;animation:riseIn .9s cubic-bezier(.2,.7,.2,1) 1.3s forwards}
#hero .art{position:relative;padding-bottom:70px;opacity:0;animation:riseIn .9s cubic-bezier(.2,.7,.2,1) .5s forwards}
#hero .win.map{--tilt:-0.8deg;animation:floaty 8s ease-in-out infinite}
#hero .win.map .screen{aspect-ratio:16/10.4;background:#07090d;position:relative}
#hero .win.map svg{position:absolute;inset:0;width:100%;height:100%}
#hero .win.log{--tilt:1deg;position:absolute;left:-4%;bottom:0;width:min(420px,86%);background:#101720;animation:floaty 7s ease-in-out .8s infinite}
#hero .win.log .tb{background:var(--card)}
#hero .win.log pre{margin:0;padding:14px 14px 16px;min-height:112px;font:400 12px/1.75 'IBM Plex Mono',monospace;letter-spacing:.03em;color:#8fd7c5;white-space:pre-wrap}
#hero .win.log pre i{display:inline-block;width:8px;height:14px;vertical-align:-2px;background:#e6b455;animation:blink 1.1s step-end infinite}
.net .ln{stroke:#d9a33d;stroke-width:1.2;stroke-dasharray:4 5;opacity:.55;animation:ants 1.4s linear infinite}
.net .ln.t{stroke:#8fd7c5}
.net .nd{fill:#e6b455;stroke:#07090d;stroke-width:1.5}
.net .nd.s{fill:#8fd7c5}
.net .halo{fill:none;stroke:#e6b455;stroke-width:1;opacity:0;animation:halo 3.2s ease-out infinite}
.net text{font:500 9px 'IBM Plex Mono',monospace;fill:#cfd6dc;letter-spacing:.06em}
.net .pool{fill:#0f1a22;stroke:#e6b455;stroke-width:1.5}
.net .pool+text{fill:#e6b455;font-size:8.5px}

/* story: Indian societies */
#story{background:var(--paper)}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
.three .card{padding-top:16px}
.three .card .k{background:var(--card);border:2px solid var(--ink)}
.three .card.a .k{background:#f2d7a4}.three .card.b .k{background:#bdd7d7}.three .card.c .k{background:#c9d7b2}
.three .card p{font-size:17px}
.three .card em{display:block;margin-top:12px;font-style:italic;color:var(--muted);font-size:16px}
.limit{margin-top:48px;padding:22px 26px;border-left:6px solid var(--gold);background:var(--card);max-width:860px}
.limit p{margin:0;font-size:clamp(18px,1.4vw,22px);line-height:1.55;color:var(--ink)}

/* question band */
#question{background:var(--night);color:#fbf3e3;border-top:2px solid var(--ink);padding:clamp(70px,11vh,120px) clamp(20px,7vw,110px)}
#question h2{color:#fbf3e3;font-size:clamp(30px,4vw,56px);text-wrap:balance}
#question p{color:rgba(251,243,227,.82);font-size:clamp(18px,1.5vw,23px);line-height:1.6}
#question .def{display:inline-block;margin-top:22px;padding:12px 16px;border:1.5px solid rgba(251,243,227,.35);font:400 13px/1.6 'IBM Plex Mono',monospace;color:#e6b455;text-align:left}
.marquee{overflow:hidden;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);background:var(--gold);color:var(--ink);font:400 10px Silkscreen,monospace;height:30px;display:flex;align-items:center}
.marquee div{display:flex;white-space:nowrap;animation:marquee 26s linear infinite}
.marquee span{padding:0 18px}

/* model: steps */
#model{background:var(--paper)}
.steps{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;counter-reset:s}
.steps li{position:relative;background:var(--card);border:2px solid var(--ink);border-radius:3px;box-shadow:4px 4px 0 var(--shadow);padding:18px 16px 16px;counter-increment:s;min-width:0}
.steps li:before{content:counter(s,decimal-leading-zero);display:block;font:400 10px Silkscreen,monospace;color:var(--muted);margin-bottom:12px}
.steps li i{display:block;width:12px;height:12px;border:2px solid var(--ink);margin-bottom:12px}
.steps li.p1 i{background:var(--gold)}.steps li.p2 i{background:var(--teal)}.steps li.p3 i{background:var(--plum)}.steps li.p4 i{background:var(--green)}.steps li.p5 i{background:var(--rust)}
.steps li b{display:block;font:400 10px/1.3 Silkscreen,monospace;text-transform:uppercase;margin-bottom:8px}
.steps li p{margin:0;font-size:16px;line-height:1.45}
.steps li:after{content:'→';position:absolute;right:-16px;top:50%;transform:translateY(-50%);font:500 16px 'IBM Plex Mono',monospace;color:var(--ink);z-index:2}
.steps li:last-child:after{content:'↺';right:auto;left:50%;top:auto;bottom:-30px;transform:translateX(-50%)}
.steps li.live{background:#fff8ec;outline:3px solid var(--gold);outline-offset:3px}
.steps li.live b:after{content:' · live';color:var(--rust)}
.rule{margin-top:64px}
.rule .grid2{align-items:start;grid-template-columns:1fr 1.15fr}
.rule ol{margin:14px 0 0;padding-left:0;list-style:none;counter-reset:r}
.rule ol li{counter-increment:r;position:relative;padding:12px 0 12px 46px;border-top:1px solid var(--line);font-size:17px;line-height:1.5}
.rule ol li:before{content:counter(r);position:absolute;left:0;top:11px;width:30px;height:30px;border:2px solid var(--ink);background:var(--gold);font:500 14px/28px 'IBM Plex Mono',monospace;text-align:center;color:var(--ink)}
.ladder{display:grid;gap:10px}
.ladder div{display:flex;align-items:center;gap:14px;background:var(--card);border:2px solid var(--ink);border-radius:3px;padding:12px 16px;box-shadow:3px 3px 0 var(--shadow);font-size:16px}
.ladder div b{font:400 10px Silkscreen,monospace;text-transform:uppercase;flex:0 0 150px}
.ladder div:nth-child(2){margin-left:22px}.ladder div:nth-child(3){margin-left:44px}.ladder div:nth-child(4){margin-left:66px}
.ladder small{display:block;color:var(--muted);font-size:14px;margin-top:2px}

/* evidence */
#evidence{background:var(--paper2)}
.cases{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px);margin-top:40px;align-items:start}
.cases h3{font:400 11px Silkscreen,monospace;text-transform:uppercase;margin-bottom:14px;color:var(--ink)}
.cases ul{list-style:none;margin:0;padding:0}
.cases li{padding:12px 0;border-top:1px solid var(--line);font-size:17px;line-height:1.45}
.cases li b{display:inline;font-weight:500}
.cases li .fl{font-size:21px;margin-right:8px;vertical-align:-2px}
.findings{margin-top:56px}
.findings .grid3{margin-top:22px}
.findings .card{padding-top:18px}
.findings .big{display:block;font:500 clamp(28px,3vw,40px)/1 'IBM Plex Mono',monospace;color:var(--ink);letter-spacing:-.03em;margin-bottom:10px}
.findings .src{display:block;margin-top:10px;font:400 13px/1.4 'IBM Plex Mono',monospace;color:var(--muted)}
.caveat{margin-top:22px;font-size:16px;color:var(--muted);max-width:820px}

/* evidence: the two halves, animated */
.halves{max-width:900px;margin:36px auto 0}
.halves .win{background:var(--card)}
.halves .win{overflow:auto}.halves svg{display:block;width:100%;min-width:560px;height:auto}
.halves text{font:500 9px 'IBM Plex Mono',monospace;fill:var(--muted);letter-spacing:.06em}
.halves text.t{font:400 8.5px Silkscreen,monospace;fill:var(--ink)}
.halves text.big{font:500 11px 'IBM Plex Mono',monospace;fill:var(--ink)}
.halves .panel{fill:none;stroke:var(--line);stroke-width:1}
.halves .grid{fill:url(#hgrid)}
.halves .person{fill:var(--card);stroke:var(--ink);stroke-width:1.3}
.halves .kitty{fill:var(--card);stroke:var(--ink);stroke-width:1.5}
.halves .fill{fill:var(--gold)}
.halves .slot{fill:none;stroke:var(--ink);stroke-width:1.2;stroke-dasharray:3 3}
.halves .card{fill:#fff8ec;stroke:var(--ink);stroke-width:1.3}
.halves .node{fill:var(--teal);stroke:var(--card);stroke-width:1}
.halves .scan{fill:var(--teal);opacity:.18}
.halves .ballot{fill:var(--ink)}
.halves .ln{stroke:var(--line);stroke-width:1}
.halves .arrow{stroke:var(--ink);stroke-width:1.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.halves .cap{font:400 14px/1.5 'IBM Plex Mono',monospace;color:var(--muted);margin:10px 4px 0;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.halves [data-a]{transform-box:fill-box;transform-origin:center}
.halves.in .scan{animation:hScan 8s linear infinite}
.halves.in .node{animation:hNode 8s ease-in-out infinite}
.halves.in .node:nth-child(2){animation-delay:.3s}.halves.in .node:nth-child(3){animation-delay:.6s}.halves.in .node:nth-child(4){animation-delay:.9s}.halves.in .node:nth-child(5){animation-delay:1.2s}
.halves.in .draft{animation:hDraft 8s cubic-bezier(.2,.7,.2,1) infinite}
.halves.in .ballot{animation:hBallot 8s ease-in infinite}
.halves.in .ballot.b2{animation-delay:.25s}.halves.in .ballot.b3{animation-delay:.5s}.halves.in .ballot.b4{animation-delay:.75s}.halves.in .ballot.b5{animation-delay:1s}.halves.in .ballot.b6{animation-delay:1.25s}
.halves.in .fill{animation:hFill 8s ease-out infinite}
.halves.in .count{animation:hCount 8s steps(1,end) infinite}
.halves.in .tick{animation:hTick 8s ease-out infinite}
@keyframes hScan{0%{transform:translateX(0);opacity:0}5%{opacity:.18}25%{transform:translateX(250px);opacity:.18}30%{opacity:0}100%{transform:translateX(250px);opacity:0}}
@keyframes hNode{0%,20%{opacity:.35}26%,100%{opacity:1}}
@keyframes hDraft{0%,28%{transform:translate(0,0);opacity:0}32%{transform:translate(0,0);opacity:1}44%,46%{transform:translate(-352px,0);opacity:1}94%{transform:translate(-352px,0);opacity:1}100%{transform:translate(-352px,0);opacity:0}}
@keyframes hBallot{0%,46%{transform:translate(0,0);opacity:0}48%{opacity:1}62%{transform:translate(0,-62px);opacity:1}64%,100%{opacity:0}}
@keyframes hFill{0%,50%{transform:scaleY(0)}74%,100%{transform:scaleY(1)}}
@keyframes hCount{0%,47%{opacity:0}48%,100%{opacity:1}}
@keyframes hTick{0%,76%{opacity:0;transform:scale(.6)}82%,100%{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.halves .scan{opacity:0}.halves .fill{transform:none}.halves .draft,.halves .count,.halves .tick{opacity:1}.halves .draft{transform:translate(-352px,0)}.halves .ballot{opacity:0}}

/* governments */
#gov{background:var(--paper)}
.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
.offers .card{position:relative;padding-top:30px}
.offers .card .k{position:absolute;top:-14px;left:16px;margin:0}
.offers .card p.need{margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-size:15px;color:var(--muted)}
.open{margin-top:48px;display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px);align-items:start}
.open ul{margin:10px 0 0;padding-left:22px;font-size:17px}
.open li{margin:8px 0}.open li::marker{color:var(--gold)}
.who{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.who span{display:inline-block;border:1px solid var(--ink);border-radius:999px;padding:6px 12px;font-size:15px;color:var(--ink);background:var(--card)}

/* Goa */
#goa{background:#fff2d4;overflow:hidden}
#goa:before{content:'';position:absolute;inset:0;background:radial-gradient(60% 50% at 80% 20%,rgba(217,163,61,.28),transparent 70%),radial-gradient(40% 40% at 10% 90%,rgba(143,215,197,.25),transparent 70%);pointer-events:none}
#goa .wrap{position:relative}
#goa .k{background:var(--rust);color:#fbf6e9}
#goa .grid2{grid-template-columns:1.05fr 1fr;align-items:start;margin-top:40px}
.livepill{display:inline-flex;align-items:center;gap:9px;font:400 9px Silkscreen,monospace;color:#fbf6e9;background:var(--rust);padding:6px 10px;border:2px solid var(--ink)}
.livepill i{position:relative;display:block;width:8px;height:8px;border-radius:50%;background:#fbf6e9}
.livepill i:after{content:'';position:absolute;inset:0;border-radius:50%;background:#fbf6e9;animation:signalWave 1.6s ease-out infinite}
.facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px 18px;margin:22px 0 6px}
.facts div{font:400 13px/1.4 'IBM Plex Mono',monospace;color:var(--muted)}
.facts b{display:block;font:500 32px 'IBM Plex Mono',monospace;color:var(--ink);letter-spacing:-.02em;margin-bottom:4px;font-variant-numeric:tabular-nums}
.fund{margin:18px 0 4px;max-width:560px}
.fund .track{display:flex;height:24px;border:2px solid var(--ink);border-radius:4px;overflow:hidden;background:var(--card)}
.fund .seg{display:block;height:100%;width:0;transition:width 1.6s cubic-bezier(.2,.7,.2,1)}
.fund .asked{background:repeating-linear-gradient(135deg,var(--gold) 0 4px,transparent 4px 9px)}
.in .fund .seg.asked{width:51.6%}
.fund .lg{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:8px;font:400 12px/1.6 'IBM Plex Mono',monospace;color:var(--muted)}
.fund .lg i{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-1px;margin-right:6px;border:1px solid var(--line)}
.tl{list-style:none;margin:22px 0 6px;padding:0 0 0 2px;position:relative;max-width:560px}
.tl::before{content:'';position:absolute;left:9px;top:10px;bottom:10px;width:2px;background:var(--line)}
.tl li{position:relative;display:grid;grid-template-columns:118px 1fr;gap:12px;padding:0 0 22px 30px;color:var(--muted)}
.tl li:last-child{padding-bottom:4px}
.tl li::before{content:'';position:absolute;left:3px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--paper);border:2px solid var(--line);box-sizing:content-box}
.tl li.done{color:var(--ink)}.tl li.done::before{background:var(--ink);border-color:var(--ink)}.tl li.done time{color:var(--ink)}
.tl li.now{color:var(--ink)}.tl li.now::before{background:var(--gold);border-color:var(--ink);box-shadow:0 0 0 4px #d9a33d55}.tl li.now time{color:var(--ink)}
.tl time{font:400 10px/1 Silkscreen,'IBM Plex Mono',monospace;text-transform:uppercase;padding-top:5px;color:var(--muted)}
.tl b{font-weight:500;color:var(--ink)}
.tl em{font:400 9px/1 Silkscreen,'IBM Plex Mono',monospace;text-transform:uppercase;font-style:normal;background:var(--gold);color:var(--ink);padding:4px 6px;border-radius:8px;margin-left:8px;vertical-align:middle}
.tl span{display:block;font-size:15px;line-height:1.4;margin-top:2px}
#goa .btns{margin-top:30px}
.board{margin:0}
.board .tb span{animation:none}
.board ol{list-style:none;margin:0;padding:0}
.board li{display:grid;grid-template-columns:22px 1fr auto auto;gap:12px;align-items:center;padding:11px 14px;border-top:1px solid var(--line);font-size:16px;opacity:0;transform:translateX(-14px)}
.board li:first-child{border-top:0}
.in .board li{animation:rowIn .5s cubic-bezier(.2,.7,.2,1) forwards}
.in .board li:nth-child(1){animation-delay:.2s}.in .board li:nth-child(2){animation-delay:.5s}.in .board li:nth-child(3){animation-delay:.8s}.in .board li:nth-child(4){animation-delay:1.1s}.in .board li:nth-child(5){animation-delay:1.4s}.in .board li:nth-child(6){animation-delay:1.7s}
.board .n{font:400 10px Silkscreen,monospace;color:var(--muted)}
.board b{display:block;font-weight:500;font-size:16px;line-height:1.25}
.board .ai{display:inline-block;font:400 8px Silkscreen,monospace;text-transform:uppercase;background:var(--gold);color:var(--ink);padding:3px 6px;border-radius:6px;margin-left:6px;vertical-align:middle}
.board .amt{font:500 14px 'IBM Plex Mono',monospace;color:var(--ink);white-space:nowrap}
.board .th{display:inline-flex;align-items:center;gap:5px;border:2px solid var(--ink);border-radius:999px;background:var(--paper);padding:4px 9px;font:500 13px 'IBM Plex Mono',monospace;color:var(--ink)}
.board .th svg{width:14px;height:14px;stroke:var(--ink);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.board .foot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;border-top:2px solid var(--ink);background:var(--paper);font:400 12px 'IBM Plex Mono',monospace;color:var(--muted)}
.board .foot i{display:inline-block;width:7px;height:12px;background:var(--rust);vertical-align:-2px;margin-left:4px;animation:blink 1.1s step-end infinite}
#goa .twin{background:var(--card);border:2px solid var(--ink);border-radius:3px;box-shadow:6px 6px 0 #20201dcc;padding:20px 22px;margin-top:22px}
#goa .twin p{margin:0 0 10px;font-size:16px;line-height:1.55}#goa .twin p:last-child{margin:0}
#goa .twin .k{margin-bottom:12px}
@keyframes rowIn{to{opacity:1;transform:none}}
/* communities */
#communities{background:var(--paper2)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
article.story{display:flex;flex-direction:column;border:2px solid var(--ink);border-radius:3px;overflow:hidden;background:var(--card);box-shadow:5px 5px 0 rgba(32,32,29,.7);min-width:0}
article.story.live{border-color:var(--rust);animation:livePulse 2.2s ease-out infinite}
article.story .tb{position:relative;display:flex;align-items:center;height:24px;border-bottom:2px solid var(--ink);background:repeating-linear-gradient(180deg,transparent 0 5px,var(--ink) 5px 6px,transparent 6px 9px,var(--ink) 9px 10px,transparent 10px 13px,var(--ink) 13px 14px,transparent 14px 17px,var(--ink) 17px 18px)}
article.story .tb span{position:absolute;left:50%;transform:translateX(-50%);background:var(--card);padding:0 8px;font:400 9px Silkscreen,monospace;color:var(--ink);white-space:nowrap}
article.story .tint{position:relative;height:118px;background-image:linear-gradient(0deg,rgba(32,32,29,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(32,32,29,.05) 1px,transparent 1px);background-size:24px 24px}
article.story .tint .place{position:absolute;left:12px;top:12px;font:400 9px Silkscreen,monospace;color:#fbf3e3;background:rgba(20,24,31,.55);padding:4px 8px}
article.story .tint .livepill{position:absolute;left:12px;bottom:12px}
article.story .body{display:flex;flex-direction:column;gap:14px;flex:1;padding:20px}
article.story .body p{margin:0;font-size:17px;line-height:1.5}
article.story .body .btn{margin-top:auto;align-self:flex-start;min-height:40px;padding:0 16px;font-size:10px;cursor:pointer}
dialog.story{width:min(620px,calc(100% - 32px));max-height:88vh;border:2px solid var(--ink);border-radius:3px;background:var(--card);box-shadow:10px 10px 0 rgba(32,32,29,.8);padding:0;color:var(--text);font:300 17px/1.7 Newsreader,Georgia,serif}
dialog.story::backdrop{background:rgba(20,24,31,.55)}
dialog.story .tb{position:sticky;top:0;z-index:2;display:flex;align-items:center;height:28px;border-bottom:2px solid var(--ink);background:repeating-linear-gradient(180deg,var(--card) 0 5px,var(--ink) 5px 6px,var(--card) 6px 9px,var(--ink) 9px 10px,var(--card) 10px 13px,var(--ink) 13px 14px,var(--card) 14px 17px,var(--ink) 17px 18px,var(--card) 18px)}
dialog.story .tb button{display:inline-flex;margin-left:9px;padding:2px;background:var(--card);border:0;cursor:pointer}
dialog.story .tb button i{display:block;width:12px;height:12px;border:2px solid var(--ink);background:var(--card)}
dialog.story .tb span{position:absolute;left:50%;transform:translateX(-50%);background:var(--card);padding:0 10px;font:400 10px Silkscreen,monospace;color:var(--ink);white-space:nowrap}
dialog.story .tint{height:140px;background-image:linear-gradient(0deg,rgba(32,32,29,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(32,32,29,.05) 1px,transparent 1px);background-size:24px 24px;position:relative}
dialog.story .tint span{position:absolute;left:18px;bottom:14px;font:400 9px Silkscreen,monospace;color:#fbf3e3;background:rgba(20,24,31,.55);padding:4px 8px}
dialog.story .in{padding:26px clamp(22px,4vw,40px) 32px}
dialog.story h2{font-size:clamp(24px,2.6vw,34px);font-weight:500;line-height:1.15;margin-bottom:18px}
dialog.story p{margin:0 0 14px}
dialog.story .note{margin-top:8px;font-size:15px;color:var(--muted)}

/* contact */
dialog.write{width:min(560px,calc(100% - 32px));border:2px solid var(--ink);border-radius:3px;background:var(--card);box-shadow:10px 10px 0 rgba(32,32,29,.8);padding:0;color:var(--text);font:300 17px/1.5 Newsreader,Georgia,serif}
dialog.write::backdrop{background:rgba(20,24,31,.55)}
dialog.write .tb{position:sticky;top:0;z-index:2;display:flex;align-items:center;height:28px;border-bottom:2px solid var(--ink);background:repeating-linear-gradient(180deg,var(--card) 0 5px,var(--ink) 5px 6px,var(--card) 6px 9px,var(--ink) 9px 10px,var(--card) 10px 13px,var(--ink) 13px 14px,var(--card) 14px 17px,var(--ink) 17px 18px,var(--card) 18px)}
dialog.write .tb button{display:inline-flex;margin-left:9px;padding:2px;background:var(--card);border:0;cursor:pointer}
dialog.write .tb button i{display:block;width:12px;height:12px;border:2px solid var(--ink);background:var(--card)}
dialog.write .tb span{position:absolute;left:50%;transform:translateX(-50%);background:var(--card);padding:0 10px;font:400 10px Silkscreen,monospace;color:var(--ink);white-space:nowrap}
dialog.write .in{padding:24px clamp(20px,4vw,34px) 30px}
dialog.write h2{font-size:clamp(24px,2.6vw,32px);font-weight:500;line-height:1.15;margin-bottom:6px}
dialog.write p.hint{font-size:15px;color:var(--muted);margin:0 0 14px}
dialog.write label{display:block;margin-top:14px;font-weight:500;color:var(--ink);font-size:15px}
dialog.write input,dialog.write textarea,dialog.write select{font:400 16px 'IBM Plex Mono',monospace;padding:10px 12px;border:2px solid var(--ink);border-radius:3px;width:100%;margin:6px 0 0;background:#fff;color:var(--ink)}
dialog.write input:focus,dialog.write textarea:focus,dialog.write select:focus{outline:3px solid var(--gold);outline-offset:1px}
dialog.write textarea{min-height:110px;resize:vertical}
dialog.write .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
dialog.write .want{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:6px}
dialog.write .want label{margin:0;border:2px solid var(--ink);border-radius:10px;padding:10px 8px;text-align:center;background:var(--card);box-shadow:3px 3px 0 var(--shadow);font:400 9px/1.3 Silkscreen,monospace;text-transform:uppercase;cursor:pointer}
dialog.write .want input{position:absolute;opacity:0;width:0;height:0;margin:0}
dialog.write .want label:has(input:checked){background:var(--gold)}
dialog.write .hp{position:absolute;left:-9999px;top:-9999px}
dialog.write .send{margin-top:20px;width:100%;justify-content:center;cursor:pointer;font-size:12px;min-height:50px}
dialog.write .send[disabled]{opacity:.6;cursor:wait}
dialog.write .err{display:none;margin-top:12px;padding:10px 12px;border-left:5px solid var(--rust);background:#fbe9e4;font-size:15px;color:var(--ink)}
dialog.write .done{display:none;text-align:center;padding:10px 0 4px}
dialog.write .done .tick{width:72px;height:72px;margin:0 auto 14px}
dialog.write .done .tick svg{width:72px;height:72px;stroke:var(--ink);stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}
dialog.write .done .tick circle{stroke-dasharray:180;stroke-dashoffset:180;animation:draw .7s ease-out forwards}
dialog.write .done .tick path{stroke:var(--green);stroke-dasharray:40;stroke-dashoffset:40;animation:draw .5s .5s ease-out forwards}
dialog.write .done p{font-size:17px}
dialog.write.sent form{display:none}dialog.write.sent .done{display:block}
@keyframes draw{to{stroke-dashoffset:0}}
@media(max-width:560px){dialog.write .row,dialog.write .want{grid-template-columns:1fr}}
#contact{background:var(--paper);text-align:center}
#contact .btns{justify-content:center;margin-top:30px}
#contact .mail{display:block;margin-top:26px;font:400 14px 'IBM Plex Mono',monospace;color:var(--muted)}
footer{padding:36px clamp(20px,7vw,110px);background:#0a0d11;color:rgba(251,243,227,.55);display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;font:400 11px 'IBM Plex Mono',monospace;letter-spacing:.06em}
footer a{color:#9ec3c5;text-decoration:none}footer a:hover{color:#e6b455}
footer .t{font:400 9px Silkscreen,monospace;text-transform:uppercase}

@keyframes riseIn{from{opacity:0;transform:translateY(44px)}to{opacity:1;transform:translateY(0)}}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(var(--tilt,0deg))}50%{transform:translateY(-8px) rotate(var(--tilt,0deg))}}
@keyframes spinSlow{to{transform:rotate(360deg)}}
@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes blinkSoft{50%{opacity:.35}}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes ants{to{stroke-dashoffset:-18}}
@keyframes halo{0%{r:4;opacity:.8}100%{r:22;opacity:0}}
@keyframes signalWave{0%{transform:scale(.4);opacity:.85}100%{transform:scale(2.4);opacity:0}}
@keyframes livePulse{0%{box-shadow:5px 5px 0 rgba(32,32,29,.7),0 0 0 0 rgba(189,76,60,.6)}70%,100%{box-shadow:5px 5px 0 rgba(32,32,29,.7),0 0 0 16px rgba(189,76,60,0)}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}#hero .sub,#hero .btns,#hero .art,#hero h1 span,.reveal,.board li{opacity:1;transform:none}.fund .seg.asked{width:51.6%}}

@media(max-width:980px){
  .steps{grid-template-columns:repeat(2,1fr)}.steps li:after{display:none}.steps li:last-child:after{display:none}
  .three,.grid3,.offers,.cards{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
  #hero .grid2,.grid2,.cases,.open,.rule .grid2,#goa .grid2{grid-template-columns:1fr!important;gap:40px}
  #hero{padding-top:90px}
  .ladder div:nth-child(n){margin-left:0}
}
@media(max-width:640px){
  header.bar nav a:not(.cta){display:none}
  .three,.grid3,.offers,.cards,.steps{grid-template-columns:1fr}
  .three,.offers,.cards{max-width:480px}
  body{font-size:18px}
  section{padding-left:16px;padding-right:16px}
  .tl li{grid-template-columns:1fr;gap:2px}
  .board li{grid-template-columns:22px 1fr;gap:6px 12px}.board .amt,.board .th{grid-column:2}
  .ladder div b{flex-basis:110px}
}

/* note pages */
.note{max-width:820px;margin:0 auto;padding:78px clamp(20px,6vw,60px) 30px}
.note .meta{font:400 10px/1 Silkscreen,'IBM Plex Mono',monospace;text-transform:uppercase;color:var(--muted);margin:0 0 16px}.note .meta a{color:inherit;text-decoration:none}
.note h1{font-size:clamp(36px,5.2vw,62px);line-height:1.02;margin:0 0 18px}
.note h2{font-size:clamp(26px,3.2vw,40px);margin:48px 0 14px}
.note p{font-size:18px;line-height:1.6}.note p.lead{font-size:clamp(19px,1.6vw,23px)}
.note .steps{margin-top:22px}.note .rule{margin-top:36px}.note .cases{margin-top:16px}.note .findings{margin-top:36px}.note .offers{margin-top:22px}.note .open{margin-top:36px}.note .halves{margin-top:22px}
.note ul.plain{padding-left:22px;font-size:17px}.note ul.plain li{margin:8px 0}.note ul.plain li::marker{color:var(--gold)}
.note .sources{margin-top:40px;padding-top:18px;border-top:1px solid var(--line)}.note .sources li{font-size:14px;color:var(--muted);margin:5px 0;line-height:1.45}
.note .next{margin-top:44px;padding-top:22px;border-top:2px solid var(--ink)}
.note section{border-top:0;padding:40px 0 0}
/* home: teasers and the notes list */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;justify-content:center}.chips span{display:inline-block;border:1px solid var(--ink);border-radius:999px;padding:6px 12px;font-size:15px;color:var(--ink);background:var(--card)}.chips .fl{font-size:18px;margin-right:6px;vertical-align:-2px}
.teaser{text-align:center;max-width:760px;margin:26px auto 0}.teaser p{font-size:17px;color:var(--text);margin:0 0 18px}.teaser .btns{justify-content:center}
.posts{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:36px}
.post{display:block;border:2px solid var(--ink);border-radius:3px;background:var(--card);box-shadow:6px 6px 0 #20201dcc;padding:18px 20px;text-decoration:none;color:var(--ink)}
.post .when{display:block;font:400 12px 'IBM Plex Mono',monospace;color:var(--muted);margin-bottom:8px}
.post b{display:block;font:500 21px/1.2 Newsreader,Georgia,serif}
.post .blurb{display:block;font-size:16px;line-height:1.45;color:var(--muted);margin-top:8px;font-weight:300}
.post .more{display:inline-block;margin-top:12px;font:400 10px/1 Silkscreen,'IBM Plex Mono',monospace;text-transform:uppercase;border-bottom:2px solid var(--gold);padding-bottom:3px}
.post:hover b{text-decoration:underline;text-decoration-color:var(--gold)}
#notes{background:var(--paper)}

/* before you say yes */
#trust{background:var(--paper2)}
.two{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(28px,5vw,64px);margin-top:40px;align-items:start}
h3.sub{font:400 11px Silkscreen,monospace;text-transform:uppercase;margin:0 0 14px;color:var(--ink)}
.nots{list-style:none;margin:0;padding:0}.nots li{padding:12px 0 12px 30px;border-top:1px solid var(--line);font-size:17px;line-height:1.5;position:relative}
.nots li:before{content:'';position:absolute;left:0;top:19px;width:12px;height:12px;border:2px solid var(--ink);background:var(--card);transform:rotate(45deg)}
.two p{font-size:17px;line-height:1.6}.two .btns{margin-top:18px}
header.bar nav a.cta{background:var(--gold);border:1.5px solid var(--ink);border-radius:6px;padding:4px 8px}
.note .nots{margin-top:10px}.note .two{margin-top:20px}
@media(max-width:860px){.two{grid-template-columns:1fr;gap:32px}}

/* questions */
#faq{background:var(--paper2)}
.faq{max-width:800px;margin:36px auto 0}
.faq div{border-top:1px solid var(--line);padding:18px 0}
.faq dt{font:500 21px/1.3 Newsreader,Georgia,serif;color:var(--ink);margin:0 0 8px}
.faq dd{margin:0;font-size:17px;line-height:1.55}
.faq dd a{white-space:nowrap}
.faq dd .btn{margin-top:14px;display:inline-flex}

.klive{display:inline-flex;align-items:center;gap:12px;margin-bottom:18px}.klive .k{margin:0}
.livepill{animation:liveBlink 1.6s steps(2,end) infinite}
@keyframes liveBlink{50%{background:#8a2f22}}

.klive .livepill{background:none;border:0;padding:0;color:var(--rust);animation:liveText 1.6s steps(2,end) infinite}
.klive .livepill i{background:var(--rust)}.klive .livepill i:after{background:var(--rust)}
@keyframes liveText{50%{color:#8a2f22}}
/* who did this before: the twelve places */
.places{margin-top:40px;display:grid;gap:30px}
.pg .k{margin-bottom:12px}
.tiles{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.pl{margin:0;border:2px solid var(--ink);border-radius:3px;overflow:hidden;background:var(--card);box-shadow:4px 4px 0 rgba(32,32,29,.7);min-width:0}
.pl img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-bottom:2px solid var(--ink);filter:saturate(.82) sepia(.1)}
.pl figcaption{padding:9px 10px 10px;line-height:1.25}
.pl b{display:block;font-weight:500;font-size:16px;color:var(--ink)}
.pl span{display:block;margin-top:3px;font:400 11px 'IBM Plex Mono',monospace;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.teaser .credits{margin-top:22px;font:400 12px/1.6 'IBM Plex Mono',monospace;color:var(--muted)}
.teaser .credits a{color:var(--muted)}
@media(max-width:980px){.tiles{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.tiles{grid-template-columns:repeat(2,1fr)}.pl b{font-size:15px}}
.teaser .sub{margin:22px 0 0;font-size:15px;line-height:1.6;color:var(--muted)}