/* ============================================================
   plug. — creator-fee memecoin launchpad
   Robinhood-inspired: near-black ground, one loud neon green,
   acid lime as the electric secondary, tabular numbers.
   Retheme the whole site from the tokens below.
   ============================================================ */
:root{
  --bg:#080A08;
  --bg-2:#0D110D;
  --panel:#111611;
  --panel-2:#171D17;
  --line:#1F281F;
  --line-2:#2C382C;
  --text:#E9F5EA;
  --text-2:#C3D2C4;
  --muted:#879688;
  --accent:#00E24B;
  --accent-2:#4DFF88;
  --accent-ink:#04160A;
  --volt:#C6FF3D;
  --volt-ink:#0E1A00;
  --copper:#2E8C55;
  --money:#35F08A;
  --down:#FF5000;
  --radius:12px;
  --radius-sm:7px;
  --shadow:0 12px 34px rgba(0,0,0,.5);
  --font-display:"Bricolage Grotesque","Arial Black",Impact,"Segoe UI",sans-serif;
  --font-body:"Instrument Sans","Segoe UI",Helvetica,Arial,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Consolas,monospace;
  --hazard:repeating-linear-gradient(135deg,var(--volt) 0 12px,#0D110D 12px 24px);
  /* A drawn tick, used as a mask so it takes whatever color the list sets.
     Inline SVG in a variable: no extra request, no icon font, and it can't
     fall back to a missing-glyph box the way an emoji or a webfont can. */
  --tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8.8l3.6 3.6L13.6 4.9' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --gutter:clamp(16px,4vw,32px);
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
/* The `hidden` attribute is how the JS shows and hides panels. Component
   rules below set `display`, which would otherwise beat the UA sheet's
   [hidden] and leave "hidden" elements on screen. */
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--bg);color:var(--text);font:15px/1.55 var(--font-body);min-height:100%;overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select{font:inherit;color:inherit}
ul{margin:0;padding:0}
:focus-visible{outline:2px solid var(--volt);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:1200px;margin-inline:auto;padding-inline:var(--gutter)}
.mono{font-family:var(--font-mono)}
.num{font-variant-numeric:tabular-nums}
.money{color:var(--money)}
.hide{display:none!important}

/* ---- type ---------------------------------------------------- */
h1,h2,h3,h4{font-family:var(--font-display);font-weight:800;letter-spacing:-.02em;line-height:1.02;margin:0;text-wrap:balance}
h1{font-size:clamp(42px,7vw,88px)}
h2{font-size:clamp(30px,4.2vw,50px)}
h3{font-size:20px;letter-spacing:-.01em}
p{margin:0}
.eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--volt)}
.lede{font-size:clamp(16px,1.6vw,19px);color:var(--text-2);max-width:56ch;line-height:1.5}
.section{padding-block:clamp(56px,8vw,96px)}
.section--tight{padding-block:clamp(36px,5vw,60px)}
.section__head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:16px 32px;margin-bottom:32px}
.section__head p{margin-top:10px;color:var(--muted);max-width:60ch}
.section__head .eyebrow{display:block;margin-bottom:12px}

/* ---- hazard tape divider ------------------------------------- */
.hazard{height:6px;background:var(--hazard)}

/* ---- ticker -------------------------------------------------- */
.ticker{background:var(--bg-2);border-bottom:1px solid var(--line);overflow:hidden;font-family:var(--font-mono);font-size:12.5px;color:var(--text-2)}
.ticker__track{display:flex;width:max-content;animation:ticker 70s linear infinite}
.ticker__item{display:inline-flex;align-items:center;gap:10px;padding:9px 22px;border-right:1px solid var(--line);white-space:nowrap}
.ticker__item b{color:var(--volt);font-weight:600}
.ticker__item .money{font-weight:600}
.ticker__item .plug{color:var(--accent)}
.ticker:hover .ticker__track{animation-play-state:paused}
body.cook .ticker__track{animation-duration:16s}
@keyframes ticker{to{transform:translateX(-50%)}}

/* ---- nav ----------------------------------------------------- */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:60;background:rgba(8,10,8,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav__in{display:flex;align-items:center;gap:16px;min-height:66px;position:relative}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:800;font-size:25px;letter-spacing:-.03em;line-height:1}
.brand svg{width:36px;height:36px;flex:none}
.brand small{font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.1em;color:var(--accent);margin-left:2px;align-self:end;padding-bottom:3px}
.nav__links{display:flex;gap:2px;margin-left:8px}
.nav__links a{padding:8px 12px;border-radius:8px;color:var(--text-2);font-weight:500;font-size:14px;white-space:nowrap}
/* Seven links and three buttons only just fit one row between the burger's
   breakpoint and a wide screen, so the gaps close up first, then the ghost
   "Launch a coin" button goes (Launch is still in the links). */
@media (max-width:1240px){.nav__links a{padding:8px 9px}.nav__in{gap:12px}}
@media (max-width:1160px){.nav__cta .btn--ghost{display:none}}
.nav__links a:hover{background:var(--panel-2);color:var(--text)}
.nav__cta{margin-left:auto;display:flex;gap:8px;align-items:center}
.nav__burger{display:none;width:40px;height:40px;place-items:center;border:1px solid var(--line-2);border-radius:8px}
.nav__burger span{width:18px;height:2px;background:var(--text);display:block;position:relative}
.nav__burger span::before,.nav__burger span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--text)}
.nav__burger span::before{top:-6px}.nav__burger span::after{top:6px}
@media (max-width:1000px){
  .nav__links{display:none}
  .nav__burger{display:grid}
  .nav--open .nav__links{display:flex;flex-direction:column;position:absolute;top:100%;left:calc(var(--gutter) * -1);right:calc(var(--gutter) * -1);background:var(--bg-2);border-bottom:1px solid var(--line);padding:10px var(--gutter) 16px;margin:0;gap:2px}
  .nav__cta .btn--ghost{display:none}
}
@media (max-width:560px){.brand small{display:none}}

/* ---- buttons ------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 18px;border-radius:999px;font-weight:600;font-size:14px;border:1px solid transparent;transition:transform .12s ease,background .15s ease,border-color .15s ease,color .15s ease;white-space:nowrap;line-height:1.2}
.btn:active{transform:translateY(1px)}
.btn svg{width:16px;height:16px}
.btn--primary{background:var(--accent);color:var(--accent-ink)}
.btn--primary:hover{background:var(--accent-2)}
.btn--volt{background:var(--volt);color:var(--volt-ink)}
.btn--volt:hover{background:#DBFF7A}
.btn--ghost{border-color:var(--line-2);color:var(--text)}
.btn--ghost:hover{border-color:var(--accent);background:var(--panel)}
.btn--dark{background:#0A0D0A;color:var(--text)}
.btn--dark:hover{background:var(--panel-2)}
.btn--sm{padding:7px 12px;font-size:13px}
.btn--lg{padding:14px 24px;font-size:16px}
.btn[aria-disabled="true"]{opacity:.55;pointer-events:none}

/* ---- hero ---------------------------------------------------- */
.hero{padding-block:clamp(40px,6vw,84px) clamp(32px,5vw,64px);position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;left:-10%;right:40%;bottom:-30%;height:70%;background:radial-gradient(ellipse at center,rgba(0,226,75,.13),transparent 62%);pointer-events:none}
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,64px);align-items:center;position:relative}
@media (max-width:900px){.hero__grid{grid-template-columns:1fr}}
.hero__copy{display:grid;gap:22px}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero h1 .u{text-decoration:underline;text-decoration-color:var(--volt);text-decoration-thickness:.08em;text-underline-offset:.1em}
.hero__ctas{display:flex;flex-wrap:wrap;gap:10px}
.hero__proof{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13px;color:var(--muted)}
.hero__proof span{display:inline-flex;align-items:center;gap:6px}
.hero__proof i{width:7px;height:7px;border-radius:50%;background:var(--money);display:inline-block}

/* CA bar */
.ca{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line-2);border-radius:var(--radius);padding:8px 8px 8px 14px;max-width:640px}
.ca__label{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);flex:none}
.ca__chain{font-family:var(--font-mono);font-size:11px;padding:3px 7px;border-radius:5px;background:var(--bg-2);border:1px solid var(--line);color:var(--text-2);flex:none}
.ca__val{font-family:var(--font-mono);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;color:var(--text)}
.ca__val.is-empty{color:var(--muted);font-style:italic}
.ca .btn{flex:none}
@media (max-width:480px){.ca__label{display:none}}

/* launchpad badges */
.pads{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;color:var(--muted);font-size:13px}
.pad{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg-2);font-weight:600;font-size:12.5px;color:var(--text-2)}
.pad i{width:8px;height:8px;border-radius:2px;background:var(--copper);display:inline-block}
.pad small{color:var(--muted);font-weight:400}

/* board (hero right) */
.board{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow);position:relative}
.board__head{display:flex;justify-content:space-between;align-items:center;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.live{display:inline-flex;align-items:center;gap:7px;color:var(--money)}
.live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--money);box-shadow:0 0 0 0 rgba(53,240,138,.6);animation:pulse 1.6s infinite}
@keyframes pulse{to{box-shadow:0 0 0 8px rgba(53,240,138,0)}}
.board svg{width:100%;height:auto;overflow:visible}
.board .cord{fill:none;stroke:var(--copper);stroke-width:2.5;stroke-linecap:round;opacity:.6}
.board .cord--hot{stroke:var(--accent);stroke-dasharray:5 11;opacity:1;animation:flow 1.1s linear infinite}
@keyframes flow{to{stroke-dashoffset:-32}}
.board .chip{fill:var(--bg-2);stroke:var(--line-2)}
.board .chip-t{font-family:var(--font-mono);font-weight:600;font-size:13px;fill:var(--text)}
.board .chip-s{font-family:var(--font-mono);font-size:9.5px;fill:var(--muted)}
.board .hub{fill:var(--accent)}
.board .hub-ring{fill:none;stroke:var(--accent);opacity:.35}
.board .av-t{font-family:var(--font-display);font-weight:800;font-size:15px;fill:#04160A;text-anchor:middle;dominant-baseline:central}
.board .h-t{font-family:var(--font-mono);font-size:11.5px;fill:var(--text);font-weight:600}
.board .h-s{font-family:var(--font-mono);font-size:9.5px;fill:var(--money)}
.board .packet{fill:var(--volt)}
.board__recent{display:flex;gap:10px;align-items:center;margin-top:10px;padding-top:12px;border-top:1px dashed var(--line-2);font-size:13.5px;color:var(--text-2)}
.board__recent b{color:var(--money);font-family:var(--font-mono)}
/* Ring behind each profile picture: the photo is clipped to the same circle,
   so the ring reads as a frame and covers the 0.5px of anti-aliased edge a
   clip-path leaves behind. */
.board .av-ring{fill:var(--bg-2);stroke:var(--money);stroke-width:1.5;opacity:.9}
.board__legal{margin-top:10px;font-size:11.5px;line-height:1.5;color:var(--muted)}
.board__legal b{color:var(--text-2)}

/* ---- stats --------------------------------------------------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.stat{background:var(--panel);padding:20px 22px;display:grid;gap:6px;align-content:start}
.stat__label{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:flex;justify-content:space-between;gap:8px}
.stat__val{font-family:var(--font-display);font-weight:800;font-size:clamp(26px,3vw,38px);letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1}
.stat__sub{font-size:12.5px;color:var(--muted)}
@media (max-width:760px){.stats{grid-template-columns:repeat(2,1fr)}}

/* ---- empty states -------------------------------------------
   These replaced the "sample" pill and the invented rows behind it. A panel
   with nothing in it has one job: say that it is empty on purpose, and say
   what will fill it. Sized so an empty card still holds the shape of a full
   one — a collapsed card next to a populated one looks like a load failure. */
.empty{display:grid;gap:5px;place-content:center;text-align:center;
  padding:30px 20px;min-height:104px;border-radius:10px;
  border:1px dashed var(--line-2);background:rgba(255,255,255,.012)}
.empty b{font-family:var(--font-display);font-weight:700;font-size:14.5px;color:var(--text-2)}
.empty span{font-size:12.5px;color:var(--muted);max-width:46ch;margin-inline:auto;line-height:1.5}
/* Inside a table cell and a list item the dashes would double up. */
td .empty,li .empty{border:0;background:none;min-height:0;padding:26px 16px}
.feed li:has(.empty),.rank li:has(.empty){display:block;padding:0}

/* ---- steps --------------------------------------------------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:860px){.steps{grid-template-columns:1fr}}
.step{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:24px;display:grid;gap:12px;align-content:start}
.step__n{font-family:var(--font-mono);font-size:12px;color:var(--volt);letter-spacing:.12em;display:flex;justify-content:space-between}
.step h3{font-size:24px}
.step p{color:var(--text-2)}
.step__tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.tag{font-family:var(--font-mono);font-size:11.5px;padding:4px 8px;border-radius:6px;background:var(--bg-2);border:1px solid var(--line);color:var(--text-2)}
.tag--hot{border-color:var(--accent);color:var(--accent)}

/* ---- cards / tables ----------------------------------------- */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.card__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line)}
.card__head h3{font-size:17px;display:flex;align-items:center;gap:10px}
.card__head a{font-size:13px;color:var(--accent);font-weight:600}
.card__body{padding:18px}
.split{display:grid;grid-template-columns:1.45fr 1fr;gap:20px;align-items:start}
@media (max-width:960px){.split{grid-template-columns:1fr}}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:left;padding:11px 18px;border-bottom:1px solid var(--line);font-weight:500;white-space:nowrap}
td{padding:12px 18px;border-bottom:1px solid var(--line);vertical-align:middle;white-space:nowrap}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover td{background:var(--panel-2)}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;font-family:var(--font-mono);font-size:13px}
.tok{display:flex;align-items:center;gap:10px}
.tok__ico{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:12px;color:#04160A;flex:none}
.tok__sym{font-family:var(--font-mono);font-weight:600}
.tok__pad{font-size:12px;color:var(--muted);display:block}
.chg{font-family:var(--font-mono);font-size:12.5px}
.chg.up{color:var(--money)}.chg.down{color:var(--down)}
.to{display:inline-flex;align-items:center;gap:8px}
.to .avatar{width:24px;height:24px;font-size:10px}
.to>span:last-child{display:grid;gap:2px;line-height:1.25}
/* coins launched here */
.tok__ico img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
.tok__ico:has(img){background:var(--bg-2)}
a.tok:hover .tok__sym{color:var(--volt)}
.tok__name{font-size:12px;color:var(--muted);display:block;max-width:22ch;overflow:hidden;text-overflow:ellipsis}
.to a{color:inherit}.to a:hover{color:var(--volt)}
.to .addr{font-family:var(--font-mono);font-size:11.5px;color:var(--muted)}
td small{display:block;color:var(--muted);font-size:11px}
.grad{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--volt);border:1px solid var(--volt);border-radius:5px;padding:2px 6px}
.curvebar{display:block;height:3px;border-radius:2px;background:var(--line-2);margin-top:5px;overflow:hidden;margin-left:auto;width:64px}
.curvebar i{display:block;height:100%;background:var(--money)}
/* On a phone each coin becomes a small card, so the numbers are on screen
   instead of behind a sideways scroll. */
@media (max-width:640px){
  table.coins thead{display:none}
  table.coins,table.coins tbody{display:block}
  table.coins tr{display:grid;grid-template-columns:repeat(3,1fr);gap:10px 12px;padding:14px 16px;border-bottom:1px solid var(--line)}
  table.coins tbody tr:last-child{border-bottom:0}
  table.coins td{display:block;padding:0;border:0;white-space:normal}
  table.coins tbody tr:hover td{background:none}
  table.coins td:nth-child(1),table.coins td:nth-child(2){grid-column:1 / -1}
  table.coins td.num{text-align:left}
  table.coins td[data-k]::before{content:attr(data-k);display:block;font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
  table.coins .curvebar{margin-left:0}
  table.coins td:has(.empty){grid-column:1 / -1}
  table.coins tr:has(.empty){display:block;padding:0}
}
.addcoin{display:grid;gap:8px;padding:14px 18px 16px;border-top:1px solid var(--line)}
.addcoin label{font-size:13px;font-weight:600;color:var(--text-2)}
.addcoin__row{display:flex;gap:8px;flex-wrap:wrap}
.addcoin input{flex:1 1 260px;min-width:0;background:var(--bg-2);border:1px solid var(--line-2);border-radius:999px;padding:10px 16px;color:var(--text);font-size:13px}
.addcoin input:focus{border-color:var(--volt);outline:none}
.addcoin__note{font-size:12.5px;color:var(--muted);margin:0}
.addcoin__note.ok{color:var(--money)}.addcoin__note.bad{color:var(--down)}
.glossary{display:grid;gap:14px;margin:0}
.glossary dt{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--volt)}
.glossary dd{margin:3px 0 0;font-size:13.5px;color:var(--text-2);line-height:1.5}

/* avatars */
.avatar{width:36px;height:36px;border-radius:50%;display:inline-grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:13px;color:#04160A;flex:none;letter-spacing:0}
.avatar--lg{width:54px;height:54px;font-size:19px}
.hue-0{background:#6CF0A6}.hue-1{background:#C6FF3D}.hue-2{background:#35F08A}.hue-3{background:#8FE0C4}
.hue-4{background:#A8F04A}.hue-5{background:#5FD9C4}.hue-6{background:#7FE3FF}.hue-7{background:#DFFF7A}
.plat{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.plat::before{content:"";width:6px;height:6px;border-radius:2px;background:var(--copper)}
.plat--x::before{background:#E7E9EA}.plat--twitch::before{background:#A970FF}.plat--kick::before{background:#53FC18}.plat--tiktok::before{background:#FE2C55}.plat--ig::before{background:#F58529}

/* feed */
.feed{list-style:none;max-height:452px;overflow:auto}
.feed li{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 18px;border-bottom:1px solid var(--line);animation:drop .35s ease}
.feed li:last-child{border-bottom:0}
@keyframes drop{from{opacity:0;transform:translateY(-6px)}}
.feed__who{display:grid;gap:2px;min-width:0}
.feed__who b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feed__who span{font-size:11.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feed__who .plat{font-size:9.5px;letter-spacing:.06em}
.feed__amt{font-family:var(--font-mono);color:var(--money);font-weight:600;text-align:right;font-size:14px}
.feed__amt small{display:block;color:var(--muted);font-weight:400;font-size:11px;letter-spacing:.04em}

/* ---- people -------------------------------------------------- */
.people{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:1000px){.people{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.people{grid-template-columns:1fr}}
.person{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px;display:grid;gap:14px;transition:border-color .15s,transform .15s;align-content:start}
.person:hover{border-color:var(--accent);transform:translateY(-2px)}
.person__top{display:flex;align-items:center;gap:12px;min-width:0}
.person__id{min-width:0}
.person__name{font-weight:600;display:flex;align-items:center;gap:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.person__handle{font-family:var(--font-mono);font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.person__stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:12.5px;color:var(--muted)}
.person__stats b{display:block;color:var(--text);font-family:var(--font-mono);font-size:14px;font-weight:600}
.person__stats b.money{color:var(--money)}
.verified{width:14px;height:14px;color:var(--accent);flex:none}

/* ---- leaderboards ------------------------------------------- */
.boards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:960px){.boards{grid-template-columns:1fr}}
.rank{list-style:none}
.rank li{display:grid;grid-template-columns:24px auto 1fr auto;gap:12px;align-items:center;padding:11px 18px;border-bottom:1px solid var(--line);font-size:14px}
.rank li:last-child{border-bottom:0}
.rank__n{font-family:var(--font-mono);color:var(--muted);font-size:12px}
.rank li:first-child .rank__n{color:var(--volt)}
.rank__who{min-width:0;display:grid}
.rank__who b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rank__who span{font-family:var(--font-mono);font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rank__val{font-family:var(--font-mono);color:var(--money);font-weight:600;font-size:13.5px}
.rank__val.plain{color:var(--text)}

/* ---- tokenomics --------------------------------------------- */
.tokenomics{display:grid;grid-template-columns:1.1fr .9fr;gap:20px;align-items:start}
@media (max-width:900px){.tokenomics{grid-template-columns:1fr}}
.alloc{display:grid;gap:14px}
.alloc__bar{display:flex;height:22px;border-radius:6px;overflow:hidden;border:1px solid var(--line-2);background:var(--bg-2)}
.alloc__bar span{display:block;height:100%}
.alloc__legend{list-style:none;display:grid;gap:9px;font-size:14px}
.alloc__legend li{display:grid;grid-template-columns:12px 1fr auto;gap:10px;align-items:center}
.alloc__legend i{width:12px;height:12px;border-radius:3px;display:block}
.alloc__legend b{font-family:var(--font-mono);font-weight:600}
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.fact{background:var(--panel);padding:16px 18px;display:grid;gap:4px}
.fact__k{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.fact__v{font-weight:800;font-size:19px;font-family:var(--font-display);letter-spacing:-.01em}
.fact__v.ok{color:var(--money)}
.burn{display:grid;gap:10px}
.burn__row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.burn__row b{font-family:var(--font-display);font-size:30px;font-weight:800;color:var(--accent)}
.burn__row span{font-family:var(--font-mono);font-size:12.5px;color:var(--muted)}
.burn__track{height:12px;border-radius:999px;background:var(--bg-2);border:1px solid var(--line-2);overflow:hidden}
.burn__fill{height:100%;background:linear-gradient(90deg,var(--copper),var(--accent));border-radius:999px;width:0;transition:width 1.2s cubic-bezier(.2,.8,.2,1)}

/* community plug */
.cplug{display:grid;gap:14px}
.cplug__now{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid var(--accent);border-radius:var(--radius);background:rgba(0,226,75,.08)}
.cplug__now b{font-family:var(--font-mono);font-size:18px}
.cplug__now span{color:var(--muted);font-size:13px;display:block}
.cplug__now .btn{margin-left:auto}
.votes{list-style:none;display:grid;gap:10px}
.votes li{display:grid;gap:6px}
.votes li .bar{height:6px;border-radius:999px;background:var(--bg-2);overflow:hidden}
.votes li .bar i{display:block;height:100%;background:var(--volt);width:0;transition:width .8s ease}

/* The whole row is the vote control, so the tap target is the row and not a
   6px bar. It is a real <button>, so it keyboard-focuses and announces its
   pressed state without extra wiring. */
.vote{display:flex;align-items:center;gap:10px;width:100%;padding:7px 9px;border:1px solid transparent;
  border-radius:10px;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer;
  transition:background .15s ease,border-color .15s ease}
.vote:hover{background:var(--bg-2);border-color:var(--line)}
.vote:focus-visible{outline:2px solid var(--volt);outline-offset:2px}
.vote__who{display:grid;line-height:1.25;min-width:0}
.vote__who b{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vote__who i{font-style:normal;font-size:12px;color:var(--muted)}
.vote__pct{margin-left:auto;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.votes li.picked .vote__pct{color:var(--volt)}
/* Your own vote, so you can find it again without counting bars. */
.votes li.mine .vote{border-color:var(--accent);background:rgba(0,226,75,.09)}
.votes li.mine .vote__pct{color:var(--accent)}
.votes li.mine .vote__who b::after{content:" · your vote";font-weight:500;font-size:11.5px;color:var(--accent)}

.cplug__note{font-size:12.5px;color:var(--muted);margin:0}
/* The nomination disclaimer. Quiet, but it never gets to be invisible —
   it is the sentence that keeps a nominated name from reading as a partner. */
.cplug__legal{font-size:11.5px;line-height:1.5;color:var(--muted);margin:0;padding-top:10px;border-top:1px solid var(--line)}

/* A supplied picture fills the same circle the monogram uses, so a board with
   some avatars set and some not still lines up. */
.avatar--img{overflow:hidden;background:var(--bg-2)}
.avatar--img img{width:100%;height:100%;object-fit:cover;display:block}

/* ---- tiers --------------------------------------------------- */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:860px){.tiers{grid-template-columns:1fr}}
.tier{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:22px;display:grid;gap:14px;align-content:start;position:relative}
.tier--hot{border-color:var(--accent)}
.tier__badge{position:absolute;top:-11px;left:22px;background:var(--accent);color:var(--accent-ink);font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;border-radius:5px;font-weight:600}
.tier__hold{font-family:var(--font-mono);font-size:12.5px;color:var(--muted)}
.tier__hold b{color:var(--text);font-size:22px;font-family:var(--font-display);display:block;letter-spacing:-.01em}
.tier ul{list-style:none;display:grid;gap:8px;font-size:14px;color:var(--text-2)}
.tier li{padding-left:20px;position:relative}
.tier li::before{content:"";position:absolute;left:0;top:8px;width:9px;height:9px;border-radius:2px;background:var(--copper)}
.tier--hot li::before{background:var(--accent)}

/* ---- toolkit ------------------------------------------------- */
.toolkit{display:grid;grid-template-columns:1fr 1.25fr;gap:20px;align-items:start}
@media (max-width:960px){.toolkit{grid-template-columns:1fr}}
.links{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:16px 18px}
@media (max-width:420px){.links{grid-template-columns:1fr}}
.link{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg-2);font-weight:600;font-size:14px;transition:border-color .15s}
.link:hover{border-color:var(--accent)}
.link small{color:var(--muted);font-weight:400;font-size:12px;font-family:var(--font-mono)}
.link[aria-disabled="true"]{opacity:.5;pointer-events:none}
.chart{aspect-ratio:16/10;max-width:100%;background:var(--bg-2);border-radius:var(--radius-sm);overflow:hidden;position:relative;margin:16px 18px 18px;border:1px solid var(--line)}
.chart iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.chart__empty{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:10px;text-align:center;padding:24px;color:var(--muted);font-size:14px}
.chart__empty svg{width:120px;height:auto;opacity:.9}
.chart__empty code{font-family:var(--font-mono);font-size:12px;color:var(--volt)}
.raid{display:grid;gap:10px;padding:16px 18px;border-top:1px solid var(--line)}
.raid p{font-size:13.5px;color:var(--muted)}

/* ---- simulator ----------------------------------------------- */
.sim{display:grid;grid-template-columns:1fr 1fr;gap:0}
@media (max-width:860px){.sim{grid-template-columns:1fr}}
.sim__in{padding:22px;display:grid;gap:18px;border-right:1px solid var(--line)}
@media (max-width:860px){.sim__in{border-right:0;border-bottom:1px solid var(--line)}}
.field{display:grid;gap:7px}
.field label{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:flex;justify-content:space-between}
.field label output{color:var(--text);font-weight:600}
.input{background:var(--bg-2);border:1px solid var(--line-2);border-radius:var(--radius-sm);padding:11px 12px;font-size:15px;width:100%}
.input:focus{border-color:var(--accent);outline:0}
.input--handle{font-family:var(--font-mono)}
select.input{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:36px}
input[type=range]{width:100%;accent-color:var(--accent);margin:0}
.sim__out{padding:22px;display:grid;gap:16px;align-content:start}
.sim__to{display:flex;align-items:center;gap:12px}
.sim__to .avatar{width:44px;height:44px;font-size:15px}
.sim__to b{font-family:var(--font-mono)}
.sim__to span{display:block;font-size:12.5px;color:var(--muted)}
.sim__big{font-family:var(--font-display);font-size:clamp(38px,4.6vw,60px);font-weight:800;color:var(--money);letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.sim__big small{font-size:14px;font-family:var(--font-mono);color:var(--muted);font-weight:500;letter-spacing:0;margin-left:8px}
.sim__rows{display:grid;gap:8px;font-size:14px}
.sim__rows div{display:flex;justify-content:space-between;gap:12px;padding-bottom:8px;border-bottom:1px dashed var(--line)}
.sim__rows div:last-child{border-bottom:0}
.sim__rows span{color:var(--muted)}
.sim__rows b{font-family:var(--font-mono);font-weight:600}
.sim__note{font-size:12px;color:var(--muted)}

/* ---- receipts ------------------------------------------------ */
.receipts{list-style:none}
.receipts li{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 18px;border-bottom:1px solid var(--line);font-size:14px}
.receipts li:last-child{border-bottom:0}
.receipts .ok{width:22px;height:22px;border-radius:50%;background:rgba(53,240,138,.15);color:var(--money);display:grid;place-items:center;font-size:12px;font-weight:700}
.receipts .pending{background:rgba(198,255,61,.12);color:var(--volt)}
.receipts span{font-family:var(--font-mono);font-size:12px;color:var(--muted)}
.receipts a.tx{font-family:var(--font-mono);font-size:12px;color:var(--accent)}

/* ---- roadmap ------------------------------------------------- */
.road{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media (max-width:1000px){.road{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.road{grid-template-columns:1fr}}
.phase{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:22px;display:grid;gap:12px;align-content:start}
.phase--now{border-color:var(--accent);box-shadow:0 0 0 1px rgba(0,226,75,.28) inset}
.phase__n{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:flex;justify-content:space-between}
.phase--done .phase__n{color:var(--money)}
.phase--now .phase__n{color:var(--accent)}
.phase h3{font-size:22px}
.phase ul{list-style:none;display:grid;gap:8px;font-size:14px;color:var(--text-2)}
.phase li{padding-left:22px;position:relative}
.phase li::before{content:"";position:absolute;left:0;top:5px;width:12px;height:12px;border-radius:3px;border:1px solid var(--line-2)}
.phase li.done::before{background:var(--money);border-color:var(--money)}
.phase li.done{color:var(--text)}

/* ---- memes --------------------------------------------------- */
.memes{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:1000px){.memes{grid-template-columns:repeat(2,1fr)}}
.meme{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:grid}
.meme__art{aspect-ratio:1;display:grid;place-items:center;padding:18px;max-width:100%}
.meme__art svg{width:100%;height:100%}
.meme__cap{padding:12px 14px;font-size:13px;color:var(--text-2);border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:8px}
.meme__cap a,.meme__cap button{color:var(--accent);font-weight:600;font-size:12.5px;font-family:var(--font-mono);white-space:nowrap}
.meme--a .meme__art{background:#00E24B}.meme--b .meme__art{background:#C6FF3D}.meme--c .meme__art{background:#08090A}.meme--d .meme__art{background:#35F08A}

/* ---- faq ----------------------------------------------------- */
.faq{display:grid;gap:8px;max-width:820px}
.faq details{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.faq details[open]{border-color:var(--line-2)}
.faq summary{cursor:pointer;padding:16px 20px;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:12px;font-size:15.5px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--font-mono);color:var(--accent);font-size:18px;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 20px 18px;color:var(--text-2);max-width:68ch;line-height:1.6}
.faq details p+p{margin-top:-8px}

/* ---- cta band ------------------------------------------------ */
.band{background:var(--accent);color:var(--accent-ink);border-radius:20px;padding:clamp(28px,5vw,56px);display:grid;grid-template-columns:1.3fr auto;gap:24px;align-items:center;position:relative;overflow:hidden}
.band::after{content:"";position:absolute;right:-40px;top:-40px;width:220px;height:220px;border-radius:50%;border:26px solid rgba(4,22,10,.12);pointer-events:none}
@media (max-width:760px){.band{grid-template-columns:1fr}}
.band h2{color:var(--accent-ink)}
.band p{color:rgba(4,22,10,.78);margin-top:10px;max-width:50ch;font-size:16px}
.band__ctas{display:flex;flex-wrap:wrap;gap:10px;position:relative}

/* ---- footer -------------------------------------------------- */
.footer{border-top:1px solid var(--line);padding-block:44px 32px;color:var(--muted);font-size:13.5px}
.footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:28px 24px}
@media (max-width:860px){.footer__grid{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.footer__grid{grid-template-columns:1fr}}
.footer h4{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-2);margin:0 0 12px;font-weight:500}
.footer ul{list-style:none;display:grid;gap:8px}
.footer a:hover{color:var(--text)}
.footer__brand{display:grid;gap:12px;align-content:start}
.footer__brand p{max-width:34ch}
.footer__legal{margin-top:30px;padding-top:20px;border-top:1px solid var(--line);font-size:12.5px;line-height:1.65;display:grid;gap:10px}
.footer__legal p{max-width:100ch}
.footer__row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px}

/* ---- toast, cook mode, sparks -------------------------------- */
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translate(-50%,16px);background:var(--volt);color:var(--volt-ink);padding:10px 16px;border-radius:999px;font-weight:600;opacity:0;transition:.25s;pointer-events:none;z-index:100;font-size:14px;white-space:nowrap;max-width:calc(100vw - 32px);overflow:hidden;text-overflow:ellipsis}
.toast.show{opacity:1;transform:translate(-50%,0)}
.cook-toggle{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;flex-shrink:0;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.06em;color:var(--muted);padding:6px 8px;border-radius:8px}
.cook-toggle:hover{color:var(--text)}
.cook-toggle i{width:32px;height:18px;border-radius:999px;background:var(--line-2);position:relative;transition:.2s;flex:none}
.cook-toggle i::after{content:"";position:absolute;top:3px;left:3px;width:12px;height:12px;border-radius:50%;background:var(--text);transition:.2s}
body.cook .cook-toggle{color:var(--accent)}
body.cook .cook-toggle i{background:var(--accent)}
body.cook .cook-toggle i::after{left:17px;background:var(--accent-ink)}
body.cook .hero h1 em{text-shadow:0 0 26px rgba(0,226,75,.8)}
body.cook .stat__val.money{text-shadow:0 0 18px rgba(53,240,138,.55)}
#sparks{position:fixed;inset:0;pointer-events:none;z-index:90;display:none}
body.cook #sparks{display:block}

/* ---- motion -------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}

/* ==============================================================
   LAUNCH PANEL — the real one
   Styled as a workbench, not a marketing card: the form is the
   left two thirds, the contract's own live terms sit on the right
   where you can read them while you type.
   ============================================================== */
.lp__head{display:flex;align-items:end;gap:14px}
.lp__head .field{min-width:230px}
.lp__net{display:flex;align-items:center;color:var(--text);cursor:default}

.lp__warn{border:1px solid var(--line-2);border-left:3px solid var(--volt);background:linear-gradient(90deg,rgba(198,255,61,.07),transparent 60%);border-radius:var(--radius-sm);padding:14px 16px;font-size:13.5px;color:var(--text-2);line-height:1.6;margin-bottom:18px;max-width:100ch}
.lp__warn b{color:var(--volt);font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;display:block;margin-bottom:5px}

.lp{overflow:hidden}
.lp__bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:13px 18px;border-bottom:1px solid var(--line);background:var(--panel-2)}
.lp__bar .field{gap:0}
.lp__bar .field label{display:none}
.lp__bar .input{padding:7px 10px;font-size:13px}
.lp__bar select.input{padding-right:30px;background-position:calc(100% - 14px) 50%,calc(100% - 9px) 50%}
.lp__spacer{flex:1}
.lp__count{font-size:11.5px;color:var(--muted)}
.lp__acctlink{font-size:12.5px;color:var(--text-2);border:1px solid var(--line-2);border-radius:99px;padding:5px 11px}
.lp__acctlink:hover{border-color:var(--accent);color:var(--accent)}
.lp__chip{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;padding:6px 11px;border-radius:99px;border:1px solid var(--line-2);color:var(--muted);white-space:nowrap}
.lp__chip.is-ok{border-color:rgba(0,226,75,.45);color:var(--accent);background:rgba(0,226,75,.09)}
.lp__chip.is-bad{border-color:rgba(255,80,0,.5);color:var(--down);background:rgba(255,80,0,.09)}

.lp__status{padding:12px 18px;font-size:13.5px;border-bottom:1px solid var(--line);line-height:1.55}
.lp__status.is-ok{color:var(--money);background:rgba(53,240,138,.07)}
.lp__status.is-bad{color:var(--down);background:rgba(255,80,0,.08)}
.lp__status.is-warn{color:var(--volt);background:rgba(198,255,61,.06)}
.lp__status.is-wait{color:var(--text-2);background:var(--bg-2)}

.lp__grid{display:grid;grid-template-columns:1.35fr 1fr}
.lp__form{padding:20px;display:grid;gap:20px;border-right:1px solid var(--line)}
.lp__side{padding:20px;display:grid;gap:18px;align-content:start;background:var(--bg-2)}

.lp__set{border:1px solid var(--line);border-radius:var(--radius-sm);padding:16px;display:grid;gap:13px;min-width:0}
.lp__set legend{display:flex;align-items:center;gap:9px;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-2);padding:0 8px}
.lp__set legend i{display:grid;place-items:center;width:19px;height:19px;border-radius:5px;background:var(--accent);color:var(--accent-ink);font-style:normal;font-weight:700;font-size:11px}
.lp__row{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.lp__inline{display:flex;gap:8px;align-items:center}
.lp__inline .input{min-width:0}
.lp__inline .btn{flex:none}
.lp__salt{flex:1;font-size:12.5px;color:var(--text-2);background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:10px 12px;overflow:hidden;text-overflow:ellipsis}
textarea.input{resize:vertical;font-family:var(--font-body);line-height:1.5}

.lp__note{font-size:12.5px;color:var(--muted);line-height:1.6}
.lp__note a{color:var(--accent)}
.lp__note.is-ok{color:var(--money)}
/* Build stamp: quiet enough to ignore, present enough to check against the
   version you last uploaded when something behaves like a stale file. */
.lp__build{display:inline-block;margin-top:4px;font-size:11px;opacity:.55}
.lp__note.is-bad{color:var(--down)}
.lp__note.is-loud{color:var(--text-2);border-left:2px solid var(--line-2);padding-left:11px}
.lp__note.is-loud b,.lp__note.is-loud em{color:var(--text);font-style:normal}

/* ---- logo: a file off your computer ------------------------
   The native file input is styled through ::file-selector-button rather than
   hidden behind a <label>, so the keyboard focus ring, the "no file chosen"
   text and the platform's own file dialog all keep working — a hidden input
   with a fake button is the usual version of this and it loses all three. */
.lp__file{display:flex;gap:8px;align-items:center}
.lp__file .input{min-width:0;flex:1}
.lp__file .btn{flex:none}
.input--file{padding:7px 9px;font-size:12.5px;color:var(--muted);cursor:pointer;
  font-family:var(--font-body);line-height:1.4}
.input--file::file-selector-button{font:inherit;font-weight:600;cursor:pointer;
  margin-right:10px;padding:7px 12px;border-radius:7px;
  border:1px solid var(--line-2);background:var(--bg-2);color:var(--text);
  transition:border-color .16s ease,color .16s ease,background .16s ease}
.input--file:hover::file-selector-button{border-color:var(--accent);color:var(--accent)}
.input--file:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* The chosen filename, echoed under the control: the native input truncates it
   from the middle at this width, and a wrong file is the whole thing you are
   checking for. Breaks anywhere because filenames have no spaces to break on. */
.lp__filename{color:var(--text-2);overflow-wrap:anywhere}
/* The link fallback, which only unhides when the uploader can't be used. Set
   in from the field above it so it reads as a way out of a problem rather than
   as a second, equal way to choose a logo. */
.lp__fallback{margin-top:11px;padding:11px 12px;border:1px dashed var(--line-2);
  border-radius:var(--radius-sm);background:var(--bg-2);display:grid;gap:8px}
.lp__fallback label{font-size:12px;color:var(--text-2);letter-spacing:.01em}

/* ---- the dev buy -------------------------------------------
   An amount in ETH with its unit pinned beside it, and four one-tap presets.
   The presets exist because the useful range here spans four orders of
   magnitude and typing 0.0001 into a phone keyboard is where typos live. */
.lp__unit{flex:none;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;color:var(--muted)}
.lp__quick{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.lp__quick .btn{padding:5px 10px;font-size:11.5px;font-family:var(--font-mono)}
.lp__quick .btn.is-on{border-color:var(--accent);color:var(--accent)}

.lp__checks{display:grid;gap:9px}
.lp__check{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--text-2);line-height:1.5;cursor:pointer}
.lp__check input{accent-color:var(--accent);width:16px;height:16px;margin:1px 0 0;flex:none}
.lp__agree{background:var(--panel);border:1px solid var(--line-2);border-radius:var(--radius-sm);padding:13px}
.lp__agree b{color:var(--accent)}

.lp__block{display:grid;gap:11px}
.lp__block h3{font-size:14px;font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:500}
.lp__blockhead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.lp__terms{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;font-size:13px}
.lp__term{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:9px 12px;background:var(--panel)}
.lp__term span{color:var(--muted);font-size:12.5px;flex:none}
.lp__term b{text-align:right;font-weight:600;min-width:0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.lp__term b.mono,.lp__term b .mono{font-size:11.5px;font-weight:500}
.lp__term b.is-ok{color:var(--money)}
.lp__term a{color:var(--accent)}
.lp__simout{border-color:rgba(0,226,75,.35)}

.lp__blockers{display:grid;gap:5px;font-size:12.5px;color:var(--volt);list-style:none;padding-left:0}
.lp__blockers li::before{content:"↳ ";color:var(--muted)}
.lp__actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.lp__actions .btn{justify-content:center}
.lp__actions .btn:disabled{opacity:.42;cursor:not-allowed}

.lp__result{border:1px solid var(--accent);border-radius:var(--radius-sm);background:linear-gradient(180deg,rgba(0,226,75,.1),transparent 70%),var(--panel);padding:16px;display:grid;gap:12px}
.lp__result h3{font-family:var(--font-display);font-size:19px;letter-spacing:-.01em;color:var(--accent);text-transform:none}
/* Live preview of the card an explorer will draw, shown while you type. */
.lp__card{display:flex;align-items:center;gap:12px;padding:11px 13px;border:1px solid var(--line-2);
  border-radius:var(--radius-sm);background:var(--bg-2)}
.lp__cardimg{width:42px;height:42px;border-radius:10px;flex:none;display:grid;place-items:center;overflow:hidden;
  background:var(--accent);color:#04160A;font-family:var(--font-display);font-weight:800;font-size:15px}
.lp__cardimg.has-img{background:var(--bg-3)}
.lp__cardimg img{width:100%;height:100%;object-fit:cover;display:block}
.lp__cardtxt{display:grid;line-height:1.25;min-width:0}
.lp__cardtxt b{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lp__cardtxt i{font-style:normal;font-size:12.5px;color:var(--muted)}
.lp__cardtag{margin-left:auto;font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}

/* The name read straight back off the deployed token. This is the answer to
   "why does the explorer call it an unnamed token", so it gets to be the
   loudest thing in the result panel rather than another row in the table. */
.lp__named{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 12px;margin:0 0 10px;padding:13px 15px;
  border:1px solid var(--accent);border-radius:var(--radius-sm);background:rgba(0,226,75,.08)}
.lp__named .lp__namedk{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--accent);width:100%}
.lp__named b{font-family:var(--font-display);font-size:21px;line-height:1.15;word-break:break-word}
.lp__named i{font-style:normal;font-size:14px;color:var(--muted)}
.lp__named.is-bad{border-color:var(--down);background:rgba(255,77,77,.08)}
.lp__named.is-bad .lp__namedk{color:var(--down)}

/* The logo, shown back after a launch. Quieter than .lp__named — the name is
   the thing people doubt, the picture is the thing they want to eyeball — so
   it borrows the card thumbnail and sits on a plain surface. */
.lp__logoshown{display:flex;align-items:center;gap:12px;margin:0 0 10px;padding:11px 13px;
  border:1px solid var(--line-2);border-radius:var(--radius-sm);background:var(--bg-2)}
.lp__logoshown b{display:block;font-size:13px;color:var(--text)}
.lp__logoshown i{display:block;font-style:normal;font-size:11.5px;color:var(--muted);
  overflow-wrap:anywhere;margin-top:2px}

.lp__res{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;font-size:13px}
.lp__resact{display:flex;gap:8px;flex-wrap:wrap}

.lp__foot{margin-top:18px;font-size:12.5px;color:var(--muted);line-height:1.7;max-width:96ch}
.lp__foot a{color:var(--accent)}

/* ---- the launch section on the MAIN site -------------------
   The panel lives on its own hostname now, so what's left on the marketing
   page is a door: why it's elsewhere on the left, the warning and the button
   on the right. Two columns, not three, and the right one is narrower so the
   button sits where the eye lands after reading the reasons. */
.lp-away{display:grid;grid-template-columns:1.15fr .85fr;gap:0;padding:0;overflow:hidden}
.lp-away__why{padding:22px;border-right:1px solid var(--line)}
.lp-away__why h3{font-size:14px;font-family:var(--font-mono);letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);font-weight:500;margin-bottom:13px}
.lp-away__go{padding:22px;display:grid;gap:13px;align-content:start;background:var(--panel)}
.lp-away__go .lp__warn{margin-bottom:0;max-width:none}
.lp-away__go .btn{justify-self:start}
/* Reasons, each one a claim. The marker is a drawn tick rather than a bullet
   or an emoji, and it's positioned rather than laid out in its own grid
   column: these items hold a <b> followed by loose text, and each run of that
   becomes its own grid item, which flows the sentence into the 16px marker
   track one word per line. Absolute positioning keeps the marker out of flow
   and still hangs the wrapped lines off the text's left edge. */
.ticks{display:grid;gap:11px;list-style:none}
.ticks li{position:relative;padding-left:26px;
  font-size:13.5px;color:var(--muted);line-height:1.6}
.ticks li::before{content:"";position:absolute;left:0;top:3px;width:16px;height:16px;
  background:var(--accent);opacity:.85;
  -webkit-mask:var(--tick) center/13px no-repeat;mask:var(--tick) center/13px no-repeat}
.ticks b{color:var(--text);font-weight:600}
@media (max-width:860px){
  .lp-away{grid-template-columns:1fr}
  .lp-away__why{border-right:0;border-bottom:1px solid var(--line)}
}

@media (max-width:960px){
  .lp__grid{grid-template-columns:1fr}
  .lp__form{border-right:0;border-bottom:1px solid var(--line)}
}
@media (max-width:560px){
  .lp__row{grid-template-columns:1fr}
  .lp__actions{grid-template-columns:1fr}
  .lp__head{width:100%}
  .lp__head .field{min-width:0;flex:1}
  .lp__term{flex-wrap:wrap}
  .lp__term b{text-align:left}
}

/* ============================================================
   WALLET PICKER (EIP-6963)
   Native <dialog>: the UA gives us the focus trap, Esc handling
   and background inertness. Only override display for [open] so
   `dialog:not([open]){display:none}` from the UA sheet survives.
   ============================================================ */
.wm{border:0;padding:0;background:transparent;max-width:none;max-height:none}
.wm[open]{display:block}
.wm::backdrop{background:rgba(4,10,6,.74);backdrop-filter:blur(3px)}
.wm[open]{
  width:min(420px,calc(100vw - 32px));
  border:1px solid var(--line);border-radius:var(--radius);
  background:var(--bg-1);color:var(--text);
  box-shadow:0 24px 70px rgba(0,0,0,.6);
  overflow:hidden;
}
.wm__head{display:flex;align-items:center;gap:12px;padding:18px;border-bottom:1px solid var(--line)}
.wm__logo{flex:0 0 auto;width:38px;height:38px;display:block}
.wm__logo svg{width:100%;height:100%;display:block}
.wm__titles{flex:1 1 auto;min-width:0}
.wm__titles h3{margin:0;font-size:17px;line-height:1.2}
.wm__titles p{margin:2px 0 0;font-size:13px;color:var(--text-2)}
.wm__titles b{color:var(--accent);font-weight:600}
.wm__x{flex:0 0 auto;width:30px;height:30px;border:1px solid var(--line);border-radius:8px;
  background:var(--bg-2);color:var(--text-2);font-size:19px;line-height:1;cursor:pointer}
.wm__x:hover{color:var(--text);border-color:var(--accent)}
.wm__body{padding:14px;max-height:52vh;overflow-y:auto}
.wm__list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.wm__btn{
  width:100%;display:flex;align-items:center;gap:12px;text-align:left;
  padding:11px 12px;border:1px solid var(--line);border-radius:var(--radius-sm);
  background:var(--bg-2);color:var(--text);font:inherit;font-weight:600;cursor:pointer;
  transition:border-color .15s,background .15s;
}
.wm__btn:hover{border-color:var(--accent);background:var(--bg-3,var(--bg-2))}
.wm__btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.wm__ico{flex:0 0 auto;width:30px;height:30px;border-radius:8px;object-fit:contain;background:var(--bg-1)}
.wm__mono{flex:0 0 auto;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;
  font-weight:800;font-size:14px;color:#0B0F0B}
.wm__txt{flex:1 1 auto;min-width:0}
.wm__nm{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wm__hint{display:block;font-size:11.5px;font-weight:500;color:var(--text-2);letter-spacing:.02em}
.wm__last{flex:0 0 auto;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--accent);border:1px solid var(--accent);border-radius:99px;padding:2px 7px}
.wm__go{flex:0 0 auto;color:var(--text-2);font-size:15px}
.wm__empty{margin:0 0 12px;font-size:13.5px;color:var(--text-2);line-height:1.5}
.wm__more{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line)}
.wm__sub{margin:0 0 8px;font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--text-2)}
.wm__foot{margin:0;padding:12px 18px 16px;border-top:1px solid var(--line);
  background:var(--bg-2);font-size:11.5px;line-height:1.55;color:var(--text-2)}
.wm__foot b{color:var(--text)}
.lp__wallet{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--text-2)}
.lp__wallet img{border-radius:4px;object-fit:contain}
@media (prefers-reduced-motion:no-preference){
  .wm[open]{animation:wmIn .16s ease-out}
  @keyframes wmIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
}

/* ---------- phone width: stop the page scrolling sideways --------------
   Grid and flex items default to min-width:auto, so an item can never get
   narrower than its own content. That is what was propping the whole page
   open on a phone: the payouts table (660px of columns) and a 42-character
   contract address were each holding their card wider than the screen, and
   the body scrolled sideways as a result — on a page whose whole job is to
   be opened from a phone, off a link in a group chat.

   min-width:0 lets those items shrink to the column, which is what makes
   .table-wrap's own overflow-x:auto finally do its job: the table scrolls
   inside its own box and leaves the page alone. Verified 320–1280px. */
.hero__grid > *, .boards > *, .lp__grid > *, .lp__row > *,
.card, .table-wrap { min-width: 0 }

/* The CA row wraps rather than forcing the hero open. */
.ca { flex-wrap: wrap }

/* A mono address has no break opportunity in it, so give it one. */
.lp__note a.mono, .lp__block .mono, .lp__terms .mono { overflow-wrap: anywhere }

@media (max-width:420px){ .nav__in{gap:10px} }
/* Icon-only switch below 380px — it still reads as a switch, and the
   button keeps its aria-label, so nothing is lost but the 80px of text. */
@media (max-width:440px){ .cook-toggle span{display:none} .cook-toggle{padding:6px} }
@media (max-width:340px){ .brand{font-size:22px} }

/* ---- the leaderboard page -----------------------------------
   leaderboard.html opens with a page header instead of a hero: the same
   headline scale one step down, the two buttons, then the four totals. The
   nav marks the page you're on the way launch.html does. */
.nav__links a.is-here{background:var(--panel-2);color:var(--text)}
.pagehead{padding-block:clamp(40px,6vw,72px) clamp(28px,4vw,44px)}
.pagehead h1{font-size:clamp(38px,6vw,72px)}
.pagehead h1 em{font-style:normal;color:var(--accent)}
.pagehead__ctas{display:flex;flex-wrap:wrap;gap:10px}
/* The #people anchor left behind on index.html, so /#people still lands on
   the leaderboard door. It takes no space and html's scroll-padding-top
   keeps it clear of the sticky nav. */
.anchor{display:block;height:0;overflow:hidden}

/* ---- Pair picker (launch panel, "Trades against") ---------------------- */
.field .field__label{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.pairpick{position:relative}
.pairpick__btn{display:flex;align-items:center;gap:11px;text-align:left;cursor:pointer;color:var(--text);padding:9px 38px 9px 10px;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat}
.pairpick__btn:focus-visible{border-color:var(--accent);outline:0}
.pairpick__btn[aria-expanded="true"]{border-color:var(--accent)}
.pairpick__ico{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:#fff;border:1px solid var(--line-2)}
.pairpick__ico img{width:100%;height:100%;object-fit:contain;display:block}
.pairpick__ico--eth{background:#627EEA;color:#fff;font-weight:700;font-size:15px;border-color:transparent}
.pairpick__ico--paste{background:var(--bg-2);color:var(--text-2);font-family:var(--font-mono);font-size:15px}
.pairpick__ico--mono{background:var(--bg-2);color:var(--text);font-family:var(--font-mono);font-size:10px;font-weight:600}
.pairpick__txt{display:grid;gap:1px;min-width:0}
.pairpick__txt b{font-family:var(--font-mono);font-size:13.5px;font-weight:600;letter-spacing:.02em}
.pairpick__txt small{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pairpick__menu{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 6px);margin:0;padding:5px;list-style:none;background:var(--panel);border:1px solid var(--line-2);border-radius:var(--radius-sm);box-shadow:var(--shadow);max-height:min(380px,60vh);overflow-y:auto}
.pairpick__menu:focus{outline:0}
.pairpick__opt{display:flex;align-items:center;gap:11px;padding:8px 9px;border-radius:6px;cursor:pointer}
.pairpick__opt[aria-selected="true"]{background:var(--bg-2)}
.pairpick__opt.is-active{background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line-2)}
.pairpick__opt .pairpick__tick{margin-left:auto;color:var(--accent);font-size:13px;visibility:hidden}
.pairpick__opt[aria-selected="true"] .pairpick__tick{visibility:visible}
.pairpick__sep{height:1px;background:var(--line);margin:5px 4px}
.pairpick__group{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:7px 9px 4px}
.pad__logo{width:16px;height:16px;border-radius:50%;background:#fff;object-fit:contain;flex:none}

/* ---- live chart (drawn from the Pons curve feed) ------------ */
.chart.is-live{aspect-ratio:auto;display:flex;flex-direction:column;gap:10px;padding:14px 14px 10px}
.lc__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.lc__mc{font-family:var(--font-display);font-size:clamp(24px,4vw,30px);font-weight:800;line-height:1.05;font-variant-numeric:tabular-nums}
.lc__sub{font-family:var(--font-mono);font-size:12px;color:var(--muted);margin-top:4px;font-variant-numeric:tabular-nums}
.lc__chg{font-weight:700}
.lc__chg.is-up{color:var(--money)}
.lc__chg.is-down{color:var(--down)}
.lc__ranges{display:flex;gap:2px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:2px}
.lc__ranges button{font:600 11.5px var(--font-mono);color:var(--muted);background:none;border:0;border-radius:6px;padding:6px 9px;cursor:pointer}
.lc__ranges button:hover{color:var(--text)}
.lc__ranges button[aria-pressed="true"]{background:var(--line-2);color:var(--text)}
.lc__plot{position:relative;height:clamp(190px,28vw,260px);touch-action:pan-y;cursor:crosshair}
.lc__plot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.lc__line{fill:none;stroke:var(--accent);stroke-width:2;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.lc__area{fill:url(#lcFill);stroke:none}
.lc__grid{fill:none;stroke:var(--line);stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:3 4}
.lc__g0{stop-color:var(--accent);stop-opacity:.26}
.lc__g1{stop-color:var(--accent);stop-opacity:0}
.chart.is-down .lc__line{stroke:var(--down)}
.chart.is-down .lc__g0,.chart.is-down .lc__g1{stop-color:var(--down)}
.lc__axis span{position:absolute;right:2px;transform:translateY(-120%);font:11px var(--font-mono);color:var(--muted);font-variant-numeric:tabular-nums;pointer-events:none}
.lc__cross{position:absolute;top:0;bottom:0;width:1px;background:var(--line-2);pointer-events:none}
.lc__tip{position:absolute;transform:translate(10px,-50%);background:var(--panel-2);border:1px solid var(--line-2);border-radius:7px;padding:6px 9px;font:12px var(--font-mono);white-space:nowrap;pointer-events:none;display:grid;gap:2px;box-shadow:var(--shadow);z-index:2}
.lc__tip.is-left{transform:translate(calc(-100% - 10px),-50%)}
.lc__tip b{font-size:13px;color:var(--text)}
.lc__tip span{color:var(--muted)}
.lc__msg{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:16px;color:var(--muted);font-size:14px}
.lc__foot{display:flex;align-items:center;gap:8px;font:11.5px var(--font-mono);color:var(--muted);flex-wrap:wrap}
.lc__foot a{margin-left:auto;color:var(--accent);font-weight:600}
.lc__dot{width:7px;height:7px;border-radius:50%;background:var(--money);box-shadow:0 0 0 3px rgba(53,240,138,.18);flex:none}
.lc__dot.is-off{background:var(--muted);box-shadow:none}
@media (prefers-reduced-motion:no-preference){.lc__dot:not(.is-off){animation:lcPulse 1.6s ease-in-out infinite}}
@keyframes lcPulse{50%{box-shadow:0 0 0 6px rgba(53,240,138,0)}}