/* getgoal.fun — matchday. A white pitch with chalk lines, black ink, BNB yellow only where money is: the pot, the net
   filling up, the button that launches. Archivo squeezed to its narrowest width for the calls (a stadium scoreboard),
   Instrument Sans for reading, IBM Plex Mono for every number.
   Signature: the goal — a net that fills with yellow as the pot nears its target; every executed vote is a ball in it. */
@font-face{font-family:"Archivo";src:url(/fonts/archivo.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(/fonts/instrument-sans.woff2) format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/fonts/plex-mono.woff2) format("woff2");font-weight:400 600;font-display:swap}
:root{
  --pitch:#FFFFFF;--turf:#F4F3EE;--chalk:#E4E2DA;--chalk2:#CFCCC1;
  --ink:#0E0E0C;--ink2:#3A3A35;--mut:#77756C;
  --bnb:#F0B90B;--bnb2:#FFD84A;--bnbink:#5A4300;--score:#1E8A4C;--card:#D9412B;--grey:#B9B6AC;
  --disp:"Archivo",system-ui,sans-serif;--body:"Instrument Sans",system-ui,sans-serif;--mono:"Plex Mono",ui-monospace,monospace;
  --r:10px;--wrap:1260px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--pitch)}
body{margin:0;min-height:100vh;color:var(--ink);font:400 16px/1.55 var(--body);-webkit-font-smoothing:antialiased;background:var(--pitch)}
a{color:inherit;text-decoration:none}
img{display:block}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--bnb);outline-offset:2px;border-radius:4px}
::selection{background:var(--bnb);color:var(--ink)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}
.mono{font-family:var(--mono);font-feature-settings:"tnum"}
.mut{color:var(--mut)}
.up{color:var(--score)}.down{color:var(--card)}
.lab{font:500 11.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
/* the scoreboard face: Archivo at its narrowest, heavy, upper case */
h1,h2,h3,h4,.disp{font-family:var(--disp);font-stretch:62%;font-weight:800;text-transform:uppercase;letter-spacing:-.005em;line-height:.92;margin:0}

/* ───── preloader: a ball into the net ───── */
#pre{position:fixed;inset:0;z-index:100;background:var(--bnb);display:grid;place-items:center;align-content:center;gap:18px;transition:opacity .45s,visibility .45s}
body:not(.booting) #pre{opacity:0;visibility:hidden}
.pre-g .post{fill:none;stroke:var(--ink);stroke-width:7;stroke-linejoin:round;stroke-linecap:round}
.pre-g .net{stroke:var(--ink);stroke-opacity:.35;stroke-width:1.5}
.pre-g .ball{transform:translate(-150px,70px) scale(.6);animation:shot .7s .25s cubic-bezier(.3,.6,.35,1) forwards}
.pre-g .netg{transform-origin:100px 95px;animation:bulge .5s .9s ease-out}
@keyframes shot{to{transform:none}}
@keyframes bulge{40%{transform:scale(1.06,1.08)}}
.pre-wm{font:800 54px/1 var(--disp);font-stretch:62%;text-transform:uppercase;letter-spacing:.01em}
.pre-tip{font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--bnbink)}

/* ───── nav ───── */
.nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:30px;height:66px;padding:0 28px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:2px solid var(--ink)}
.brand{display:flex;align-items:center;gap:10px}
.brand b{font:800 30px/1 var(--disp);font-stretch:62%;text-transform:uppercase;letter-spacing:.01em}
.links{display:flex;gap:2px}
.links a{padding:8px 12px;font:600 14px/1 var(--body);color:var(--ink2);border-radius:6px}
.links a:hover{background:var(--turf);color:var(--ink)}
.links a.on{background:var(--ink);color:#fff}
.nav .right{margin-left:auto;display:flex;align-items:center;gap:10px}
.net{display:inline-flex;align-items:center;gap:8px;font:500 11px/1 var(--mono);color:var(--mut);letter-spacing:.08em;text-transform:uppercase;padding:0 6px}
.net i{width:9px;height:9px;transform:rotate(45deg);background:var(--bnb);border:1.5px solid var(--ink)}

/* ───── buttons and inputs ───── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 18px;border-radius:8px;border:2px solid var(--ink);background:#fff;font:700 14px/1 var(--body);white-space:nowrap;transition:transform .1s,box-shadow .15s,background .15s}
.btn:hover{box-shadow:3px 3px 0 var(--ink);transform:translate(-1px,-1px)}
.btn:active{box-shadow:none;transform:translate(1px,1px)}
.btn.ghost{background:transparent}
.btn.gold{background:var(--bnb)}
.btn.ink{background:var(--ink);color:#fff}
.btn.lg{height:54px;padding:0 26px;font-size:16px;border-radius:10px}
.btn.sm{height:30px;padding:0 10px;font-size:12px;border-radius:6px;border-width:1.5px}
.btn.wide{width:100%}
.btn.busy{opacity:.55;pointer-events:none}
.btn.yes{color:var(--score)}.btn.no{color:var(--card)}
.in{width:100%;height:46px;padding:0 14px;border-radius:8px;border:2px solid var(--chalk2);background:#fff;color:var(--ink);font:inherit;outline:none}
textarea.in{height:96px;padding:12px 14px;resize:vertical}
.in:focus{border-color:var(--ink)}
select.in{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 18px) 20px,calc(100% - 13px) 20px;background-size:5px 5px;background-repeat:no-repeat}
.fl{display:grid;gap:8px;margin-bottom:18px}
.seg,.tabs{display:flex;flex-wrap:wrap;gap:6px}
.tabs{margin-bottom:16px}
.seg button,.tabs button{height:36px;padding:0 13px;border-radius:7px;border:2px solid var(--chalk2);background:#fff;color:var(--ink2);font:700 13px/1 var(--body)}
.seg button:hover,.tabs button:hover{border-color:var(--ink)}
.seg button.on,.tabs button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.range-in{width:100%;accent-color:var(--ink)}
.note{font-size:13.5px;color:var(--mut);margin:10px 0 0}

/* ───── shared blocks ───── */
.panel{background:#fff;border:2px solid var(--ink);border-radius:var(--r)}
.panel+.panel{margin-top:18px}
.panel>.ph2{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:2px solid var(--ink);background:var(--turf);border-radius:8px 8px 0 0}
.panel>.ph2 h3{font-size:24px}
.panel>.pb{padding:18px}
.empty{padding:26px;text-align:center;color:var(--mut);border:2px dashed var(--chalk2);border-radius:8px}
.pill{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:4px;font:600 10.5px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;border:1.5px solid var(--ink);background:#fff}
.pill.OPEN{background:var(--bnb)}
.pill.EXECUTED,.pill.PASSED{background:var(--score);border-color:var(--score);color:#fff}
.pill.REJECTED,.pill.FAILED,.pill.NO_QUORUM,.pill.EXEC_FAILED{background:var(--card);border-color:var(--card);color:#fff}
.chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;border:1.5px solid var(--ink);background:#fff;font:500 11px/1 var(--mono);letter-spacing:.03em;white-space:nowrap}
.chip.y{background:var(--bnb)}
.logo{width:42px;height:42px;border-radius:50%;object-fit:cover;background:var(--turf);border:2px solid var(--ink);flex:none}
.logo.sm{width:28px;height:28px;border-width:1.5px}
.logo.lg{width:72px;height:72px;border-width:3px}
/* the scoreline: the fee split, to scale */
.split{display:flex;height:10px;border:1.5px solid var(--ink);border-radius:3px;overflow:hidden}
.split i{display:block;height:100%}
.split i+i{border-left:1.5px solid var(--ink)}
.split .c{background:var(--bnb)}.split .r{background:var(--ink)}.split .p{background:var(--grey)}
.bar{height:10px;border:1.5px solid var(--ink);border-radius:3px;background:#fff;overflow:hidden}
.bar i{display:block;height:100%;background:var(--bnb);border-right:1.5px solid var(--ink)}
.toasts{position:fixed;right:18px;bottom:18px;z-index:50;display:grid;gap:8px}
.toast{padding:12px 16px;border-radius:8px;background:#fff;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);font-size:14px;max-width:360px;animation:tin .25s}
.toast.ok{background:#E9F6EE}.toast.err{background:#FBE9E5}
@keyframes tin{from{transform:translateY(8px);opacity:0}}
.legend{display:grid;gap:8px}
.legend>div{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px;color:var(--ink2)}
.legend span{display:inline-flex;align-items:center;gap:8px}
.legend i{width:12px;height:12px;border:1.5px solid var(--ink);border-radius:2px;flex:none}
.legend b{font:600 14px/1 var(--mono);color:var(--ink)}

/* ───── the goal (signature) ───── */
.goalviz svg{display:block;max-width:100%;height:auto;overflow:visible}

/* ───── home: hero ───── */
.hero-band{background:var(--bnb);border-bottom:2px solid var(--ink);position:relative;overflow:hidden}
/* chalk markings on the band: the halfway line and the centre circle */
.hero-band::before{content:"";position:absolute;left:50%;top:-10%;bottom:-10%;width:2px;background:rgba(14,14,12,.12)}
.hero-band::after{content:"";position:absolute;left:50%;top:50%;width:380px;height:380px;margin:-190px 0 0 -190px;border:2px solid rgba(14,14,12,.12);border-radius:50%}
.hero{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;padding:64px 0 76px}
.kick{display:inline-flex;align-items:center;gap:8px;font:600 11.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;padding:8px 12px;border:2px solid var(--ink);border-radius:999px;background:#fff}
.kick i{width:8px;height:8px;transform:rotate(45deg);background:var(--ink)}
.hero h1{font-size:clamp(64px,9.2vw,138px);line-height:.86;margin:22px 0 22px}
.hero h1 .w{display:block}
.hero h1 .o{-webkit-text-stroke:2.5px var(--ink);color:transparent}
.lead{font-size:18.5px;line-height:1.55;color:var(--ink);max-width:560px;margin:0}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero .btn.gold{background:#fff}
.tally{display:grid;grid-template-columns:repeat(4,1fr);margin-top:36px;border:2px solid var(--ink);border-radius:10px;background:#fff;overflow:hidden}
.tally>div{padding:13px 15px;border-left:2px solid var(--ink)}
.tally>div:first-child{border-left:0}
.tally b{display:block;margin-top:8px;font:600 24px/1 var(--mono);letter-spacing:-.02em}
/* the carousel: one fixture card at a time */
.deck{position:relative;height:540px}
.mcard{position:absolute;inset:0;display:grid;grid-template-rows:auto 1fr auto;gap:14px;padding:22px;border-radius:14px;background:#fff;border:2px solid var(--ink);box-shadow:8px 8px 0 var(--ink);opacity:0;transform:translateY(14px) rotate(-.6deg);transition:opacity .55s,transform .55s;pointer-events:none}
.mcard.on{opacity:1;transform:none;pointer-events:auto}
.mcard .top{display:flex;align-items:center;gap:12px}
.mcard .top b{font:800 26px/1 var(--disp);font-stretch:62%;text-transform:uppercase}
.mcard .top small{display:block;color:var(--mut);font-size:12.5px;margin-top:3px}
.mcard .top .chip{margin-left:auto}
.mcard .goal{font:800 34px/.95 var(--disp);font-stretch:62%;text-transform:uppercase}
.mcard .nums{display:flex;justify-content:space-between;align-items:baseline;margin:12px 0 0}
.mcard .nums b{font:600 26px/1 var(--mono)}
.mcard .foot2{display:grid;grid-template-columns:120px auto 1fr auto;align-items:center;gap:12px;padding-top:12px;border-top:2px solid var(--ink);font-size:13.5px;color:var(--ink2)}
.mcard .foot2 .mono{font-weight:600;color:var(--ink)}
.dots{position:absolute;left:0;right:0;bottom:-30px;display:flex;justify-content:center;gap:6px}
.dots button{width:24px;height:6px;border-radius:0;border:1.5px solid var(--ink);background:#fff;padding:0}
.dots button.on{background:var(--ink)}

/* ───── sections: a chalk halfway line between them ───── */
.sec{padding:68px 0;border-top:2px solid var(--ink);position:relative}
.sec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:26px}
.sec-h h2{font-size:clamp(44px,5.4vw,76px)}
.sec-h p{margin:10px 0 0;color:var(--ink2);max-width:640px}
.sec-h .more{font:600 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;padding:9px 12px;border:2px solid var(--ink);border-radius:6px}
.sec-h .more:hover{background:var(--bnb)}
.film{padding:0 0 0;border-top:0;background:var(--bnb)}
.film .wrap{padding-bottom:64px}
.film video{display:block;width:100%;aspect-ratio:16/9;border-radius:14px;border:2px solid var(--ink);background:#000;box-shadow:8px 8px 0 var(--ink)}
/* models: five formations */
.models{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.model{display:grid;grid-template-rows:auto auto 1fr auto auto;gap:12px;padding:18px;border-radius:12px;background:#fff;border:2px solid var(--ink);transition:transform .15s,box-shadow .15s}
.model:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink)}
.model .glyph{width:44px;height:44px}
.model h3{font-size:30px}
.model p{margin:0;color:var(--ink2);font-size:14px;line-height:1.5}
.model .ex{font:500 11.5px/1.45 var(--mono);color:var(--mut)}
/* live coins: the league table */
.ctable{border:2px solid var(--ink);border-radius:12px;background:#fff;overflow:hidden}
.crow{display:grid;grid-template-columns:44px minmax(200px,1.3fr) minmax(200px,1.6fr) 120px 180px 150px 60px;gap:16px;align-items:center;padding:13px 18px;border-top:1.5px solid var(--chalk2);transition:background .12s}
.crow:first-child{border-top:0}
.crow.head{padding:11px 18px;background:var(--ink);color:#fff}
.crow.head span{font:600 10.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}
a.crow:hover{background:#FFF8DC}
.crow .pos{font:800 26px/1 var(--disp);font-stretch:62%;text-align:center}
.crow .who{display:flex;align-items:center;gap:12px;min-width:0}
.crow .who b{font:800 22px/1 var(--disp);font-stretch:62%;text-transform:uppercase}
.crow .who small{display:block;color:var(--mut);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}
.crow .mis{font-size:14.5px;color:var(--ink2);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.crow .num{font:600 15px/1 var(--mono)}
.crow .prog,.crow .sp{display:grid;gap:7px}
.crow .prog small,.crow .sp small{font:500 11px/1 var(--mono);color:var(--mut)}
/* cards */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ccard{display:grid;gap:14px;padding:18px;border-radius:12px;background:#fff;border:2px solid var(--ink);transition:transform .15s,box-shadow .15s}
.ccard:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink)}
.ccard .top{display:flex;align-items:center;gap:12px}
.ccard .top b{display:block;font:800 22px/1 var(--disp);font-stretch:62%;text-transform:uppercase}
.ccard .top small{color:var(--mut);font-size:12px}
.ccard .top .pct{margin-left:auto;font:800 40px/1 var(--disp);font-stretch:62%}
.ccard .top .chip{margin-left:auto}
.ccard .goal{font:800 26px/.98 var(--disp);font-stretch:62%;text-transform:uppercase;min-height:52px}
.ccard .nums{display:flex;justify-content:space-between;font:500 12.5px/1 var(--mono);color:var(--mut)}
.ccard .nums b{color:var(--ink)}
.ccard .row2{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--mut)}
.ccard .row2 .split{flex:1;max-width:150px}
.ccard .kv{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding-top:12px;border-top:1.5px solid var(--chalk2)}
.ccard .kv b{display:block;margin-top:6px;font:600 14px/1 var(--mono)}
.ccard .goalviz{margin:-4px 0}
/* feed: the match report */
.feed .row{display:grid;grid-template-columns:28px 84px 1fr auto;gap:12px;align-items:center;padding:11px 0;border-top:1.5px solid var(--chalk);font-size:14.5px}
.feed .row:first-child{border-top:0}
.feed .row .k{font:600 10px/1 var(--mono);letter-spacing:.07em;text-transform:uppercase;padding:5px 6px;border-radius:4px;text-align:center;border:1.5px solid var(--ink)}
.k.claim{background:var(--bnb)}
.k.executed{background:var(--score);border-color:var(--score)!important;color:#fff}
.k.proposal{background:#fff}
.k.vote{background:var(--turf)}
.k.failed{background:var(--card);border-color:var(--card)!important;color:#fff}
.k.launch{background:var(--ink);color:#fff}
.feed .row small{font:500 11.5px/1 var(--mono);color:var(--mut);white-space:nowrap}
.feed .row small a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.feed .row .t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink2)}
.feed .row .t b{color:var(--ink)}
.feedbox{border:2px solid var(--ink);border-radius:12px;background:#fff;padding:4px 18px}
/* how it works: a real sequence, numbered like a team sheet */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border:2px solid var(--ink);border-radius:12px;overflow:hidden;background:#fff}
.step{padding:22px 18px;border-left:2px solid var(--ink)}
.step:first-child{border-left:0}
.step .n{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--bnb);border:2px solid var(--ink);font:800 24px/1 var(--disp);font-stretch:62%}
.step h3{font-size:30px;margin:16px 0 8px}
.step p{margin:0;color:var(--ink2);font-size:14px;line-height:1.5}
/* final CTA */
.final{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;padding:46px;border-radius:16px;border:2px solid var(--ink);background:var(--bnb);box-shadow:8px 8px 0 var(--ink)}
.final h2{font-size:clamp(48px,6vw,88px)}
.final p{margin:14px 0 0;color:var(--ink);max-width:560px}
.final .btn{background:var(--ink);color:#fff}

/* ───── proposals ───── */
.prop{display:grid;grid-template-columns:52px 1fr auto;gap:14px;align-items:start;padding:16px 0;border-top:1.5px solid var(--chalk)}
.prop:first-child{border-top:0}
.prop .ic{height:28px;display:grid;place-items:center;border-radius:5px;font:700 10px/1 var(--mono);letter-spacing:.06em;border:1.5px solid var(--ink);background:#fff}
.ic.BUY_STOCK{background:var(--bnb)}.ic.PAY{background:var(--turf)}.ic.BUYBACK{background:var(--score);color:#fff;border-color:var(--score)}.ic.DISBAND{background:var(--card);color:#fff;border-color:var(--card)}
.prop h4{font:700 16px/1.3 var(--body);text-transform:none}
.prop h4 a{text-decoration:underline;text-underline-offset:3px}
.prop .meta{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;margin-top:7px;font-size:13px;color:var(--mut)}
.prop .meta a{color:var(--ink);text-decoration:underline}
.vbar{position:relative;display:flex;height:10px;margin-top:10px;border:1.5px solid var(--ink);border-radius:3px;background:#fff;max-width:520px}
.vbar .y{background:var(--score)}
.vbar .n{background:var(--card)}
.vbar .q{position:absolute;top:-6px;width:3px;height:19px;background:var(--ink)}
.vbtns{display:flex;gap:6px}
.dlist{border:2px solid var(--ink);border-radius:12px;background:#fff;padding:2px 18px}

/* ───── pages ───── */
.page{padding:44px 0 76px}
.page-h{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:26px;flex-wrap:wrap;padding-bottom:22px;border-bottom:2px solid var(--ink)}
.page-h h1{font-size:clamp(60px,7.5vw,110px)}
.page-h p{margin:10px 0 0;color:var(--ink2);max-width:640px}
.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:18px}
.toolbar .in{max-width:300px;height:38px}
/* docs */
.docs{display:grid;grid-template-columns:230px 1fr;gap:44px}
.docs nav{position:sticky;top:90px;align-self:start;display:grid;gap:2px}
.docs nav a{padding:9px 12px;border-radius:6px;color:var(--ink2);font-weight:600;font-size:14px}
.docs nav a:hover{background:var(--turf)}
.docs nav a.on{background:var(--ink);color:#fff}
.doc{max-width:780px}
.doc section{padding:0 0 36px;margin-bottom:36px;border-bottom:1.5px solid var(--chalk2);scroll-margin-top:90px}
.doc h2{font-size:50px;margin-bottom:14px}
.doc p,.doc li{color:var(--ink2);line-height:1.65}
.doc ul{padding-left:20px}
.kvt{width:100%;border-collapse:collapse;font-size:14.5px}
.kvt td{padding:11px 14px;border-top:1.5px solid var(--chalk)}
.kvt tr:first-child td{border-top:0}
.kvt td:last-child{text-align:right;font-family:var(--mono);color:var(--ink)}
.tablebox{border:2px solid var(--ink);border-radius:10px;background:#fff;overflow:hidden;margin:14px 0}

/* ───── coin page ───── */
.qhead{display:grid;grid-template-columns:1fr 420px;gap:28px;padding:36px 0 28px}
.qid{display:flex;gap:18px;align-items:flex-start}
.qid h1{font-size:86px;line-height:.85}
.qid .sub{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;color:var(--mut);font-size:14px}
.price{display:flex;align-items:baseline;gap:14px;margin-top:24px}
.price b{font:600 36px/1 var(--mono);letter-spacing:-.02em}
.price span{font:600 14px/1 var(--mono)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:22px;border:2px solid var(--ink);border-radius:10px;background:#fff;overflow:hidden}
.stats>div{padding:13px 15px;border-left:2px solid var(--ink)}
.stats>div:first-child{border-left:0}
.stats b{display:block;margin-top:8px;font:600 17px/1 var(--mono)}
.latest{margin-top:20px}
.latest .feed{margin-top:6px}
.latest .feed .row{padding:9px 0}
.mside{padding:20px;border-radius:14px;background:#fff;border:2px solid var(--ink);box-shadow:8px 8px 0 var(--bnb),8px 8px 0 2px var(--ink)}
.mside .goal{font:800 36px/.95 var(--disp);font-stretch:62%;text-transform:uppercase;margin:10px 0 0}
.mside .detail{color:var(--ink2);font-size:14px;margin:8px 0 0}
.mside .nums{display:flex;justify-content:space-between;align-items:baseline;margin:14px 0 8px}
.mside .nums b{font:600 24px/1 var(--mono)}
.gone{margin:0 0 22px;padding:14px 18px;border-radius:10px;border:2px solid var(--card);background:#FBE9E5;font-size:14.5px}
.gone b{color:var(--card)}
.qtabs{display:flex;gap:4px;border-bottom:2px solid var(--ink);margin-bottom:22px;overflow-x:auto}
.qtabs a{padding:12px 16px;font:800 20px/1 var(--disp);font-stretch:62%;text-transform:uppercase;color:var(--mut);border:2px solid transparent;border-bottom:0;border-radius:8px 8px 0 0;margin-bottom:-2px;white-space:nowrap}
.qtabs a:hover{color:var(--ink)}
.qtabs a.on{color:var(--ink);border-color:var(--ink);background:#fff;box-shadow:0 2px 0 #fff}
.qtabs a .n{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:6px;padding:0 5px;border-radius:10px;background:var(--bnb);border:1.5px solid var(--ink);color:var(--ink);font:600 11px/1 var(--mono);vertical-align:2px}
.qgrid{display:grid;grid-template-columns:1fr 400px;gap:22px;align-items:start;padding-bottom:76px}
.chart{position:relative;height:300px}
.chart svg{width:100%;height:100%;display:block}
.rows .row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-top:1.5px solid var(--chalk)}
.rows .row:first-child{border-top:0}
.rows .row b{font-weight:700}
.rows .row small{display:block;color:var(--mut);font-size:12.5px;margin-top:3px}
.rows .row a{font:500 12px/1 var(--mono);text-decoration:underline;margin-left:8px}
.bigeth{font:600 40px/1 var(--mono);letter-spacing:-.02em;margin:10px 0 8px}
.alloc{display:flex;height:14px;border:1.5px solid var(--ink);border-radius:3px;overflow:hidden;margin:16px 0}
.alloc i+i{border-left:1.5px solid var(--ink)}
.kgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--ink);border:2px solid var(--ink);border-radius:10px;overflow:hidden}
.kgrid>div{padding:14px 16px;background:#fff}
.kgrid b{display:block;margin-top:8px;font:500 14px/1.3 var(--mono);word-break:break-all}
.kgrid a{text-decoration:underline}
.svote{display:grid;grid-template-columns:46px 1fr;gap:12px;align-items:start;padding:12px 0;border-top:1.5px solid var(--chalk)}
.svote:first-child{border-top:0;padding-top:0}
.svote .ic{height:24px;display:grid;place-items:center;border-radius:4px;font:700 9.5px/1 var(--mono);border:1.5px solid var(--ink);background:var(--bnb)}
.svote b{display:block;font-weight:700;font-size:14px;line-height:1.3}
.svote small{display:block;margin-top:4px;color:var(--mut);font:500 11.5px/1.3 var(--mono)}
.svote:hover b{text-decoration:underline}

/* ───── launch ───── */
.tpls{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:12px 0 30px}
.tpl{display:grid;gap:8px;align-content:start;text-align:left;padding:14px;border-radius:10px;background:#fff;border:2px solid var(--chalk2);min-height:128px}
.tpl:hover{border-color:var(--ink)}
.tpl.on{border-color:var(--ink);background:#FFF6D1;box-shadow:4px 4px 0 var(--ink)}
.tpl b{font:800 22px/1 var(--disp);font-stretch:62%;text-transform:uppercase}
.tpl small{color:var(--ink2);font-size:12.5px;line-height:1.4}
.tpl .glyph{width:30px;height:30px}
.launch{display:grid;grid-template-columns:1fr 430px;gap:36px;align-items:start}
.launch .prev{position:sticky;top:90px;padding:22px;border-radius:14px;background:#fff;border:2px solid var(--ink);box-shadow:8px 8px 0 var(--ink)}
.launch .prev .goalviz{margin:16px 0}
.drop{display:flex;align-items:center;gap:14px;padding:12px;border-radius:10px;border:2px dashed var(--chalk2);cursor:pointer}
.drop:hover{border-color:var(--ink)}
.drop .img{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:var(--turf) center/cover;border:2px solid var(--ink);font-size:24px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.flow{display:grid;gap:10px;margin-top:24px}
.flow>div{display:flex;align-items:center;gap:12px;color:var(--mut)}
.flow i{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;border:2px solid var(--chalk2);font:600 12px/1 var(--mono);font-style:normal}
.flow .done{color:var(--ink)}.flow .done i{background:var(--score);border-color:var(--score);color:#fff}
.flow .now{color:var(--ink)}.flow .now i{border-color:var(--ink);background:var(--bnb)}
.stepl{font:800 30px/1 var(--disp);font-stretch:62%;text-transform:uppercase;margin:6px 0 14px}

/* ───── footer ───── */
.foot{border-top:2px solid var(--ink);padding:28px 0 40px;background:var(--ink);color:#fff}
.foot .wrap{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center;font-size:13.5px}
.foot .wrap>span:first-child{display:inline-flex;align-items:center;gap:10px;font:800 22px/1 var(--disp);font-stretch:62%;text-transform:uppercase}
.foot nav{display:flex;gap:16px}
.foot nav a:hover{color:var(--bnb)}
.foot .mut{flex-basis:100%;font-size:12.5px;color:#A8A69C}

/* ───── responsive ───── */
@media (max-width:1120px){
  .models,.tpls{grid-template-columns:repeat(3,1fr)}
  .steps{grid-template-columns:repeat(3,1fr)}
  .step:nth-child(4){border-left:0}
  .step:nth-child(n+4){border-top:2px solid var(--ink)}
  .crow{grid-template-columns:40px minmax(200px,1.4fr) minmax(160px,1.4fr) 110px 150px}
  .crow>:nth-child(6),.crow>:nth-child(7){display:none}
}
@media (max-width:900px){
  .links{display:none}
  .hero,.qhead,.qgrid,.launch,.docs{grid-template-columns:1fr}
  .hero{padding-top:44px;gap:60px}
  .grid3{grid-template-columns:1fr 1fr}
  .docs nav{position:static;display:flex;flex-wrap:wrap}
  .launch .prev{position:static}
  .final{grid-template-columns:1fr}
}
@media (max-width:640px){
  .wrap{padding:0 16px}
  .nav{padding:0 14px;gap:12px}
  .net{display:none}
  .nav .right .btn.gold{display:none}
  .models,.tpls,.grid3{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .step{border-left:0!important;border-top:2px solid var(--ink)}
  .step:first-child{border-top:0}
  .tally,.stats{grid-template-columns:1fr 1fr}
  .tally>div:nth-child(3),.stats>div:nth-child(3){border-left:0}
  .tally>div:nth-child(n+3),.stats>div:nth-child(n+3){border-top:2px solid var(--ink)}
  .crow{grid-template-columns:30px 1fr 100px}
  .crow>:nth-child(3),.crow>:nth-child(5){display:none}
  .deck{height:600px}
  .feed .row{grid-template-columns:28px 1fr auto}
  .feed .row .k{display:none}
  .prop{grid-template-columns:1fr}
  .prop .ic{width:52px}
  .two{grid-template-columns:1fr}
  .final{padding:28px}
  .hero-band::after{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important}
}
/* the net fills from the ground up; executed votes drop in as balls */
.goalviz .fill{transform-box:view-box;transform-origin:50% 249px;animation:rise 1.1s cubic-bezier(.2,.8,.2,1) both}
.goalviz .ball{animation:drop .55s cubic-bezier(.3,1.4,.5,1) both}
@keyframes rise{from{transform:scaleY(0)}}
@keyframes drop{from{transform:translateY(-120px);opacity:0}}
/* the official BNB Chain mark wherever the chain is named */
.bnb{display:inline-block;vertical-align:-3px;flex:none}
.net .bnb,.kick .bnb{vertical-align:middle}
.foot .bnb{vertical-align:-2px;margin-right:4px}
