:root{
  color-scheme:light;
  --paper:#f8f8f8;--paper-sunk:#eef3ef;--ink:#181818;--ink-2:#3d443f;--ink-3:#6b746e;
  --rule:#dbe6de;--rule-strong:#b9cdbf;--accent:#54d97e;--accent-deep:#248a42;--accent-ink:#1e302a;--accent-wash:#d8f8e0;
  --accent-bright:#54fc84;--down:#e5484d;
  --font-sans:'Geist',system-ui,-apple-system,'Segoe UI',sans-serif;--font-serif:var(--font-sans);--font-mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --inset:72px;--max:1180px;
}
html[data-theme="dark"]{
  color-scheme:dark;
  --paper:#0e1411;--paper-sunk:#161e19;--ink:#e8efe9;--ink-2:#b4c2b8;--ink-3:#7f8f85;
  --rule:#233029;--rule-strong:#35493c;--accent:#54d97e;--accent-deep:#7ef2a4;--accent-ink:#0e1411;--accent-wash:#16301f;
  --accent-bright:#54fc84;--down:#ff6b6f;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--paper);color:var(--ink);font:15px/1.55 var(--font-sans);letter-spacing:-.005em;-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
body{min-height:100vh;display:flex;flex-direction:column;padding-top:64px}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit;background:none;border:0;border-radius:0}
button{cursor:pointer}
.mono,td.num,th.num,.num{font-family:var(--font-mono)}
.micro{font-family:var(--font-sans);font-size:12px;line-height:1.45;letter-spacing:-.005em;text-transform:none;color:var(--ink-3)}
.micro.num,.micro .num,.mono.micro{font-family:var(--font-mono);letter-spacing:0}
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--inset)}
hr.rule{border:0;border-top:1px solid var(--rule)}

/* header */
header.top{border-bottom:1px solid var(--rule);position:fixed;top:0;left:0;right:0;background:rgba(248,248,248,.72);backdrop-filter:saturate(180%) blur(12px);z-index:40}
header.top .wrap{display:flex;align-items:center;height:64px;gap:8px}
.brand{display:flex;align-items:baseline;gap:7px;margin-right:28px}
.brand-mark{font-family:var(--font-sans);font-weight:500;font-size:19px;letter-spacing:-.005em;color:var(--ink)}
.brand-sub{font-size:19px;letter-spacing:-.01em;color:var(--ink-2)}
.brand i{color:var(--accent);font-style:normal;font-size:19px;margin-left:-5px}
.brand:hover .brand-sub{color:var(--ink)}
nav.main{display:flex;align-items:center;gap:2px}
nav.main a{position:relative;display:flex;align-items:center;padding:7px 12px;border-radius:999px;font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;color:var(--ink-3);transition:color .16s ease,background .16s ease}
nav.main a:hover{color:var(--ink);background:var(--paper-sunk)}
nav.main a.active{color:var(--ink)}
nav.main a.active::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:1.5px;background:var(--accent);border-radius:2px;animation:navUnderline .22s ease}
@keyframes navUnderline{from{transform:scaleX(.2);opacity:0}to{transform:scaleX(1);opacity:1}}
.spacer{flex:1}
.hdr-right{display:flex;align-items:center;gap:10px}
.ccy-wrap{position:relative;display:inline-flex;align-items:center}
.ccy-btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;padding:8px 11px 8px 13px;border:1px solid transparent;border-radius:999px;background:var(--paper-sunk);color:var(--ink);cursor:pointer;transition:border-color .16s ease,background .16s ease}
.ccy-btn:hover{border-color:var(--rule-strong)}
.ccy-wrap.open .ccy-btn{border-color:var(--ink);background:var(--paper)}
.ccy-btn .caret{width:9px;height:6px;color:var(--ink-3);transition:transform .18s ease}
.ccy-wrap.open .ccy-btn .caret{transform:rotate(180deg)}
.ccy-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:60;min-width:158px;padding:6px;border:1px solid var(--rule-strong);border-radius:12px;background:var(--paper);box-shadow:0 16px 40px rgba(24,24,24,.13),0 2px 6px rgba(24,24,24,.06);max-height:340px;overflow:auto;animation:ccyIn .14s ease}
@keyframes ccyIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.ccy-opt{display:flex;align-items:center;gap:10px;width:100%;padding:7px 10px;border:0;border-radius:8px;background:none;font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;color:var(--ink);cursor:pointer;text-align:left}
.ccy-opt .sym{margin-left:auto;color:var(--ink-3);font-size:10.5px;letter-spacing:0}
.ccy-opt .tick{width:6px;height:6px;border-radius:50%;background:transparent;flex:none}
.ccy-opt:hover{background:var(--paper-sunk)}
.ccy-opt[aria-selected="true"]{background:var(--accent-wash)}
.ccy-opt[aria-selected="true"] .tick{background:var(--accent-deep)}
header.top .btn{border-radius:999px;font-weight:500}
.btn{font-family:var(--font-mono);font-size:11px;letter-spacing:.09em;text-transform:uppercase;padding:8px 14px;border:1px solid var(--ink);border-radius:2px;background:var(--paper);color:var(--ink);white-space:nowrap}
.btn:hover{background:var(--paper-sunk)}
.btn.primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn.primary:hover{background:#000}
.btn.accent{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.accent:hover{background:var(--accent-deep)}
.btn.sell{background:var(--paper);color:var(--accent-ink);border-color:var(--accent)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.block{width:100%;padding:12px 14px;font-size:12px}

/* ticker */
.ticker{border-bottom:1px solid var(--rule);background:var(--paper-sunk);overflow:hidden;white-space:nowrap;height:32px;display:flex;align-items:center}
.ticker .track{display:inline-flex;animation:tick 60s linear infinite}
.ticker span{font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;padding:0 20px;border-right:1px solid var(--rule);color:var(--ink-2)}
.ticker b{font-weight:500;color:var(--ink)}
.ticker .up{color:var(--accent-deep)}.ticker .down{color:var(--down)}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* layout */
main{flex:1}
section.block{padding:48px 0}
section.block + section.block{border-top:1px solid var(--rule)}
.display{font-size:clamp(32px,4vw,56px);line-height:1.06;letter-spacing:-.035em;max-width:900px;font-weight:500;font-synthesis:none}
.display em{font-style:normal;font-weight:600;color:var(--accent)}
.lede{font-size:19px;color:var(--ink-2);max-width:640px;margin-top:24px}
h1,h2{font-weight:500;font-synthesis:none;letter-spacing:-.022em}h2{font-size:21px}
h3{font-size:17px;font-weight:500;letter-spacing:-.015em}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:12px;border-bottom:1px solid var(--ink);margin-bottom:0}
.sec-head .micro{color:var(--ink-3)}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--rule);border-radius:2px;margin-top:32px}
.stats-row>div{padding:16px;border-left:1px solid var(--rule)}
.stats-row>div:first-child{border-left:0}
.stat-v{font-family:var(--font-mono);font-size:22px;margin-top:4px}
.stat-s{font-family:var(--font-sans);font-size:12px;color:var(--ink-3);margin-top:2px}

/* tables */
.tbl-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th{font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;color:var(--ink-3);text-align:left;padding:10px 12px 8px;border-bottom:1px solid var(--rule);font-weight:400;white-space:nowrap}
td{padding:11px 12px;border-bottom:1px solid var(--rule);vertical-align:middle;white-space:nowrap}
th.num,td.num{text-align:right}
tr.row{cursor:pointer}
tr.row:hover td{background:var(--paper-sunk)}
td.pair{font-family:var(--font-mono);font-size:13px}
td.pair small{color:var(--ink-3)}
td.name{color:var(--ink-3)}
.prog{width:120px;height:2px;background:var(--rule);position:relative}
.prog i{position:absolute;left:0;top:0;bottom:0;background:var(--ink)}
.prog.hot i{background:var(--accent)}
.tag{font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;border:1px solid var(--rule-strong);padding:2px 6px;border-radius:2px;color:var(--ink-2)}
.tag.pool{border-color:var(--ink);color:var(--ink)}
.tag.live{border-color:var(--accent);color:var(--accent-ink);background:var(--accent-wash)}
.pos{color:var(--accent-deep)}.neg{color:var(--down)}
.empty{padding:32px 12px;color:var(--ink-3);text-align:center}
.controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:12px 0}
.controls .seg{display:inline-flex;border:1px solid var(--rule-strong);border-radius:2px}
.controls .seg button{font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;padding:6px 10px;color:var(--ink-3);border-left:1px solid var(--rule-strong)}
.controls .seg button:first-child{border-left:0}
.controls .seg button.on{background:var(--ink);color:var(--paper)}
.pager{display:flex;gap:8px;justify-content:flex-end;padding:12px 0}

/* matrix */
.matrix td,.matrix th{padding:7px 8px;font-size:12px}
.matrix th:first-child,.matrix td:first-child{color:var(--ink-3);font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em}
.matrix td.diag{color:var(--rule-strong)}

/* forms */
.form{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:48px;margin-top:32px}
.field{display:flex;flex-direction:column;gap:6px;padding:16px 0;border-bottom:1px solid var(--rule)}
.field label{font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;color:var(--ink-3);font-weight:500}
.field input,.field select,.field textarea{border:1px solid var(--rule-strong);border-radius:2px;padding:10px 12px;font-family:var(--font-sans);font-size:14px;background:var(--paper)}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--ink)}
.field textarea{font-family:var(--font-serif);font-size:15px;min-height:88px;resize:vertical}
.field .hint{font-size:13px;color:var(--ink-3)}
.locked-field{display:block;width:100%;padding:10px 12px;border:1px solid var(--rule);border-radius:2px;background:var(--paper-sunk);color:var(--ink-2);font-family:var(--font-sans);font-size:12px;line-height:1.55;user-select:text;cursor:default;min-height:40px;word-break:break-word}
.locked-field::after{content:"locked";float:right;margin-left:10px;font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);border:1px solid var(--rule-strong);border-radius:999px;padding:1px 7px}
.err{color:var(--accent-ink);font-family:var(--font-sans);font-size:12px;padding:8px 0;min-height:20px}
.panel{border:1px solid var(--rule);border-radius:2px;padding:24px;align-self:start;position:sticky;top:88px}
.panel .kv{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--rule);font-size:14px}
.panel .kv:last-child{border-bottom:0}
.panel .kv span:last-child{font-family:var(--font-mono);font-size:13px;text-align:right}
.panel .big{font-family:var(--font-mono);font-size:26px;letter-spacing:-.01em;margin:8px 0 16px}

/* coin page */
.coin{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:48px;margin-top:32px}
.coin-title{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap}
.coin-title h1{font-size:clamp(28px,3vw,42px);font-weight:500;letter-spacing:-.02em;font-family:var(--font-sans)}
.coin-title h1 small{color:var(--ink-3);font-size:.7em}
.coin-name{color:var(--ink-3);font-size:18px}
.price-big{font-family:var(--font-mono);font-size:34px;margin-top:16px;letter-spacing:-.01em}
.price-sub{font-family:var(--font-sans);font-size:13px;color:var(--ink-3);margin-top:4px}
.chart-box{margin-top:24px;border:1px solid var(--rule);border-radius:2px}
.chart-canvas{position:relative;width:100%;height:320px}
.chart-canvas .tv-lightweight-charts{border-radius:0}
.chart-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:7px 12px;border-top:1px solid var(--rule);background:var(--paper-sunk)}
.chart-foot .micro{letter-spacing:0}
#chartLive{display:flex;align-items:center;gap:6px;color:var(--ink-3)}
#chartLive::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--accent);animation:pulseLive 1.8s ease-in-out infinite}
@keyframes pulseLive{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.72)}}
.chart-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;color:var(--ink-3);background:var(--paper);pointer-events:none}
.chart-empty[hidden]{display:none}
.chart-bar{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-bottom:1px solid var(--rule)}
.grid-stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--rule);border-radius:2px;margin-top:24px}
.grid-stats>div{padding:14px 16px;border-left:1px solid var(--rule);border-top:1px solid var(--rule)}
.grid-stats>div:nth-child(-n+4){border-top:0}
.grid-stats>div:nth-child(4n+1){border-left:0}
.grid-stats .v{font-family:var(--font-mono);font-size:17px;margin-top:4px}
.sub-sec{margin-top:40px}
.pool-box{border:1px solid var(--rule);border-radius:2px;padding:20px 24px;margin-top:12px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pool-box.pending{background:var(--paper-sunk);display:block;color:var(--ink-2)}
.pool-box .v{font-family:var(--font-mono);font-size:16px;margin-top:4px}
.rail .trade{border:1px solid var(--ink);border-radius:2px;position:sticky;top:88px}
.tabs{display:flex;border-bottom:1px solid var(--ink)}
.tabs button{flex:1;font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;padding:12px;color:var(--ink-3);border-left:1px solid var(--rule);font-weight:500}
.tabs button:first-child{border-left:0}
.tabs button.on{color:var(--ink);box-shadow:inset 0 -2px 0 var(--ink)}
.tabs button.on.sell{color:var(--accent-ink);box-shadow:inset 0 -2px 0 var(--accent)}
.trade .body{padding:20px}
.amt{display:flex;border:1px solid var(--rule-strong);border-radius:2px}
.amt input{flex:1;padding:12px;font-family:var(--font-mono);font-size:18px;min-width:0}
.amt input:focus{outline:0}
.amt span{font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;padding:0 12px;display:flex;align-items:center;border-left:1px solid var(--rule-strong);color:var(--ink-3)}
.quick{display:flex;gap:6px;margin-top:8px}
.quick button{flex:1;font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;border:1px solid var(--rule);padding:5px 0;border-radius:2px;color:var(--ink-2)}
.quick button:hover{border-color:var(--ink)}
.preview{margin:16px 0;font-size:13px}
.preview .kv{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--rule)}
.preview .kv span:last-child{font-family:var(--font-mono)}
.bal{font-family:var(--font-sans);font-size:12px;color:var(--ink-3);margin-top:12px;display:flex;justify-content:space-between}
.about{margin-top:16px;color:var(--ink-2);font-size:14px}
.copy{font-family:var(--font-sans);font-size:12px;color:var(--ink-3);cursor:pointer}
.copy:hover{color:var(--ink)}

/* docs */
.docs-layout{display:grid;grid-template-columns:minmax(0,1fr) 208px;gap:56px;align-items:start;margin-top:28px}
.docs{max-width:760px;margin-top:0}
.docs .lede{font-size:18px;line-height:1.6;color:var(--ink-2);margin-top:14px;max-width:66ch}
.docs h1.display{letter-spacing:-.02em}
.docs h2{position:relative;margin-top:64px;padding:0 0 10px;border-bottom:0;font-size:23px;letter-spacing:-.025em;scroll-margin-top:104px}
.docs h2::after{content:'';position:absolute;left:0;bottom:0;width:100%;height:1px;background:linear-gradient(to right,var(--accent) 0,var(--accent) 34px,var(--rule) 34px,var(--rule) 100%)}
.docs h3{margin-top:34px;font-size:17px;color:var(--ink);scroll-margin-top:104px}
.docs p,.docs li{font-size:15.5px;color:var(--ink-2);margin-top:14px;line-height:1.68;max-width:70ch}
.docs ul{list-style:none;padding-left:0;margin-top:6px}
.docs li{position:relative;padding-left:22px}
.docs li::before{content:'';position:absolute;left:2px;top:.72em;width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--accent-wash)}
.docs code{font-family:var(--font-mono);font-size:12.5px;background:var(--accent-wash);color:var(--accent-ink);padding:2px 6px;border-radius:999px;white-space:nowrap}
.docs pre{font-family:var(--font-mono);font-size:12.5px;line-height:1.72;color:var(--ink-2);background:var(--paper-sunk);border:1px solid var(--rule);border-radius:12px;padding:18px 20px;margin-top:16px;overflow-x:auto;box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.docs pre code{background:none;padding:0;border-radius:0;font-size:inherit;color:inherit}
.docs .tbl{margin-top:18px;border:1px solid var(--rule);border-radius:12px;overflow:hidden;background:rgba(255,255,255,.55);backdrop-filter:saturate(140%) blur(6px)}
.docs .tbl table{margin:0;font-size:14px}
.docs .tbl th{background:var(--paper-sunk);border-bottom:1px solid var(--rule)}
.docs .tbl tbody tr:last-child td{border-bottom:0}
.docs .tbl tbody tr{transition:background .15s ease}
.docs .tbl tbody tr:hover{background:var(--accent-wash)}
.docs .mono{font-size:12.5px;word-break:break-all}
.docs a:not(.btn){color:var(--accent-deep);box-shadow:inset 0 -1px 0 rgba(36,138,66,.32);transition:box-shadow .16s ease}
.docs a:not(.btn):hover{box-shadow:inset 0 -2px 0 var(--accent-deep)}
.docs-toc{position:sticky;top:104px;padding-left:20px;border-left:1px solid var(--rule)}
.docs-toc .micro{display:block;margin-bottom:12px;font-weight:500;color:var(--ink-2)}
.docs-toc a{display:block;padding:5px 0;font-size:13px;line-height:1.35;color:var(--ink-3);transition:color .16s ease,transform .16s ease}
.docs-toc a.sub{padding-left:12px;font-size:12.5px}
.docs-toc a:hover{color:var(--ink);transform:translateX(2px)}
.docs-toc a.on{color:var(--accent-deep)}
@media (max-width:1080px){.docs-layout{grid-template-columns:minmax(0,1fr);gap:0}.docs-toc{display:none}}
.callout{position:relative;border:1px solid var(--rule);border-left:3px solid var(--accent);border-radius:12px;padding:16px 20px;background:linear-gradient(120deg,var(--accent-wash),rgba(255,255,255,.6));margin-top:20px;font-size:15px;line-height:1.62;color:var(--accent-ink);box-shadow:0 10px 30px -22px rgba(36,138,66,.6)}

footer{position:relative;border-top:0;padding:64px 0 26px;margin-top:150px;background:rgba(255,255,255,.62);backdrop-filter:blur(26px) saturate(118%);-webkit-backdrop-filter:blur(26px) saturate(118%)}
footer::before{content:'';position:absolute;left:0;right:0;top:-220px;height:220px;pointer-events:none;background:linear-gradient(to bottom,rgba(255,255,255,0) 0,rgba(255,255,255,.22) 40%,rgba(255,255,255,.46) 72%,rgba(255,255,255,.62) 100%);backdrop-filter:blur(26px) saturate(118%);-webkit-backdrop-filter:blur(26px) saturate(118%);-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,.18) 26%,rgba(0,0,0,.62) 58%,rgba(0,0,0,1) 92%);mask-image:linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,.18) 26%,rgba(0,0,0,.62) 58%,rgba(0,0,0,1) 92%)}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px;align-items:start}
.foot-brand{max-width:320px}
.foot-mark{width:26px;height:26px;fill:var(--ink);stroke:var(--ink);display:block;margin-bottom:16px}
.foot-tag{font-size:14px;line-height:1.55;color:var(--ink-2)}
.foot-col{display:flex;flex-direction:column;gap:9px}
.foot-head{color:var(--ink-3);margin-bottom:5px}
.foot-col a,.foot-static{font-size:14px;color:var(--ink-2)}
.foot-col a.mono,.foot-static{font-family:var(--font-sans);font-size:12.5px;letter-spacing:.01em}
.foot-col a:hover{color:var(--accent-deep)}
.foot-bar{border-top:0;margin-top:36px;padding-top:18px}
.foot-bar .micro{font-size:12.5px;color:var(--ink-3)}
@media (max-width:860px){
  .foot-grid{grid-template-columns:1fr 1fr;gap:28px}
  .foot-brand{grid-column:1 / -1;max-width:none}
}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--paper);font-family:var(--font-sans);font-size:12px;padding:10px 16px;border-radius:2px;opacity:0;transition:opacity .2s;pointer-events:none;z-index:9}
.toast.show{opacity:1}
.toast.bad{background:var(--accent-deep)}
.to-top{position:fixed;left:24px;bottom:24px;z-index:30;width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--rule-strong);border-radius:999px;background:var(--paper);color:var(--ink-2);box-shadow:0 10px 30px -14px rgba(24,48,42,.35);opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .22s ease,transform .22s cubic-bezier(.2,.7,.2,1),border-color .2s,color .2s}
.to-top.on{opacity:1;transform:none;pointer-events:auto}
.to-top:hover{border-color:var(--accent-deep);color:var(--accent-deep)}
@media (max-width:760px){.to-top{left:14px;bottom:14px}}

@media (max-width:900px){
  :root{--inset:24px}
  header.top .wrap{height:auto;flex-wrap:wrap;padding-top:10px;padding-bottom:10px;gap:10px}
  nav.main{order:3;width:100%;height:auto;min-height:36px;flex-wrap:wrap;margin-left:0}
  body{padding-top:110px}
  nav.main a{padding:8px 9px;font-size:10px;letter-spacing:.06em;border-bottom:1px solid var(--rule);border-left:0}
  nav.main a:last-child{border-right:0}
  nav.main a.active{box-shadow:inset 0 -2px 0 var(--ink)}
  .form,.coin{grid-template-columns:1fr;gap:32px}
  .panel,.rail .trade{position:static}
  .stats-row,.grid-stats{grid-template-columns:repeat(2,1fr)}
  .grid-stats>div:nth-child(-n+4){border-top:1px solid var(--rule)}
  .grid-stats>div:nth-child(-n+2){border-top:0}
  .grid-stats>div:nth-child(4n+1){border-left:1px solid var(--rule)}
  .grid-stats>div:nth-child(2n+1){border-left:0}
  .pool-box{grid-template-columns:1fr}
  section.block{padding:32px 0}
}

.chain-note{font-size:12px;color:var(--ink-2);border:1px dashed var(--rule-strong);padding:8px 10px;border-radius:2px;margin:6px 0;line-height:1.5}
.chain-note .tag{margin-right:6px}

.modal{position:fixed;inset:0;background:rgba(22,21,15,.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:50;padding:16px}
.modal-card{background:var(--paper);border:1px solid var(--rule-strong);border-top:3px solid var(--accent);border-radius:2px;width:100%;max-width:380px;box-shadow:0 24px 64px rgba(22,21,15,.35),0 2px 6px rgba(22,21,15,.12)}
.modal-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--rule);font-weight:600}
.modal-head .x{background:none;border:0;color:var(--ink-2);cursor:pointer;font-size:12px;letter-spacing:-.005em}
.wallet-list{display:flex;flex-direction:column;padding:8px}
.wallet-opt{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:12px;padding:10px 12px;background:none;border:1px solid transparent;border-radius:3px;color:var(--ink);cursor:pointer;text-align:left;font:inherit}
.wallet-opt:hover{border-color:var(--rule-strong);background:var(--paper-sunk)}
.wallet-opt[data-missing]{opacity:.55}
.wallet-opt .glyph{width:36px;height:36px;border-radius:8px;display:grid;place-items:center;font-size:11px;font-weight:700;letter-spacing:.04em;background:var(--accent);color:var(--ink)}
.wallet-opt .wname{font-weight:600}
.wallet-opt .wstate{font-size:12px;color:var(--ink-2);letter-spacing:-.005em}
.modal-foot{padding:10px 16px 16px;border-top:1px solid var(--rule);display:flex;flex-direction:column;gap:8px}
.wallet-paper{background:var(--paper-sunk);border:1px dashed var(--rule-strong);color:var(--ink-2);padding:8px;border-radius:3px;cursor:pointer;font:inherit;font-size:12px}
.wallet-paper:hover{color:var(--ink)}

/* motion */
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes flash{0%{background:var(--accent-wash)}100%{background:transparent}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(29,107,58,.45)}60%{box-shadow:0 0 0 5px rgba(29,107,58,0)}}
#view>section{animation:rise .42s cubic-bezier(.2,.7,.2,1) both}
#view>section:nth-child(2){animation-delay:.06s}#view>section:nth-child(3){animation-delay:.12s}
.stats-row>div{position:relative;overflow:hidden}
.stats-row>div::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.stats-row>div:hover::after{transform:scaleX(1)}
/* rates board */
/* Rules are drawn by the cells themselves, not by grid gaps showing the
   container background. The old gap trick let the rule colour paint past the
   final row while overflow:hidden clipped the container's bottom border, so
   the columns ran off into white space. Dropping the right/bottom border on
   the container and letting each cell supply its own keeps the edge closed at
   any column count, which matters because the breakpoints reflow 4/3/2. */
.rates-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--rule);border-right:0;border-bottom:0;border-radius:2px;overflow:hidden;background:var(--paper);gap:0}
.rates-grid>.rate{border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.rate{background:var(--paper);padding:14px 16px;display:grid;grid-template-columns:28px 1fr;grid-template-rows:auto auto;column-gap:12px;row-gap:10px;align-items:center;animation:rise .5s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i)*40ms);transition:background .25s,transform .25s;position:relative}
.rate{color:inherit;text-decoration:none;cursor:pointer}
.rate:hover{background:var(--paper-sunk);transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.06)}
.rate:active{transform:translateY(0)}
.rate-go{grid-column:1/-1;font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;color:var(--accent-ink);opacity:0;transform:translateY(-4px);transition:opacity .25s,transform .25s;margin-top:-4px}
.rate:hover .rate-go,.rate:focus-visible .rate-go{opacity:1;transform:translateY(0)}
.rate:focus-visible{outline:1px solid var(--accent-ink);outline-offset:-1px}
.rate.flash{animation:flash 1.2s ease-out}
.rate.base{background:var(--paper-sunk)}
.rate.base::before{content:"display";position:absolute;top:8px;right:10px;font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;color:var(--accent-ink)}
.rate .flag{width:28px;height:28px;border-radius:50%;box-shadow:0 0 0 1px var(--rule);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.rate:hover .flag{transform:scale(1.08) rotate(-6deg)}
.rate-id{display:flex;flex-direction:column;line-height:1.2}
.rate-id b{font-family:var(--font-mono);font-size:13px;letter-spacing:.06em}
.rate-id span{font-size:11px;color:var(--ink-3)}
.rate-v{grid-column:1/-1;display:flex;align-items:baseline;gap:6px;font-family:var(--font-mono)}
.rate-v .num{font-size:20px;font-weight:500;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.rate-v .unit{font-size:11px;color:var(--ink-3);letter-spacing:.06em}
@media (max-width:900px){.rates-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:600px){.rates-grid{grid-template-columns:repeat(2,1fr)}.rate{padding:12px;column-gap:8px}.rate-v .num{font-size:17px}.rate-id span{display:none}}
/* wallet modal motion + logos */
.modal{animation:fade .18s ease both}
.modal.out{animation:fade .18s ease reverse both}
.modal-card{animation:pop .28s cubic-bezier(.2,.7,.2,1) both;overflow:hidden}
.modal.out .modal-card{animation:pop .18s ease reverse both}
.wallet-opt{animation:rise .35s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(60ms + var(--i)*45ms);transition:background .2s,border-color .2s,transform .2s}
.wallet-opt:hover{transform:translateX(3px)}
.wallet-opt:active{transform:translateX(3px) scale(.99)}
.wallet-opt .glyph{background:var(--paper-sunk);border:1px solid var(--rule);color:inherit;overflow:hidden;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.wallet-opt .glyph img{width:24px;height:24px;display:block}
.wallet-opt:hover .glyph{transform:scale(1.08)}
.wallet-opt[data-missing] .glyph img{filter:grayscale(1);opacity:.7}
.wstate{display:inline-flex;align-items:center;gap:6px}
.wstate .dot{width:6px;height:6px;border-radius:50%;background:#1d6b3a;animation:pulse 1.8s ease-out infinite}
.wstate.ok{color:#1d6b3a}
.btn#connect{transition:transform .15s,background .2s}
.btn#connect:active{transform:scale(.97)}
@media (max-width:760px){.to-top{left:14px;bottom:14px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* image upload */
.drop{border:1px dashed var(--rule-strong);border-radius:2px;background:var(--paper-sunk);padding:16px;cursor:pointer;transition:border-color .2s,background .2s,transform .2s}
.drop:hover,.drop:focus-visible{border-color:var(--accent);background:var(--accent-wash);outline:none}
.drop.over{border-color:var(--accent);background:var(--accent-wash);transform:scale(1.01)}
.drop.busy{cursor:progress;opacity:.7}
.drop.filled{border-style:solid;background:var(--paper);cursor:default}
[hidden]{display:none!important}
.drop-idle{display:flex;flex-direction:column;gap:4px;text-align:center}
.drop-idle b{font-size:13px}
.drop-idle span{font-size:11px;color:var(--ink-3);line-height:1.5}
.drop-has{display:flex;align-items:center;gap:14px;animation:rise .3s cubic-bezier(.2,.7,.2,1) both}
.drop-has img{width:56px;height:56px;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px var(--rule);background:var(--paper-sunk);flex:0 0 auto}
.drop-meta{display:flex;flex-direction:column;gap:2px;min-width:0}
.drop-meta b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.drop-meta span{font-family:var(--font-sans);font-size:12px;color:var(--ink-3);letter-spacing:-.005em}
.lnk{background:none;border:0;padding:0;align-self:flex-start;color:var(--accent-ink);font:inherit;font-size:11px;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.coin-img{width:44px;height:44px;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px var(--rule);margin-right:12px;animation:rise .4s cubic-bezier(.2,.7,.2,1) both}
.row-img{width:20px;height:20px;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px var(--rule);margin-right:8px;vertical-align:-5px;display:inline-block}
.row-img.ph{background:var(--paper-sunk);color:var(--ink-3);font-family:var(--font-sans);font-size:12px;text-align:center;line-height:20px}

.crop-card{max-width:360px}
.crop-body{padding:14px 16px 6px}
.crop-stage{position:relative;width:300px;height:300px;margin:0 auto;border:1px solid var(--rule-strong);background:var(--paper-sunk);overflow:hidden}
.crop-stage canvas{display:block;cursor:grab;touch-action:none}
.crop-stage canvas.grabbing{cursor:grabbing}
.crop-grid{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(250,249,246,.65)}
.crop-grid::before,.crop-grid::after{content:"";position:absolute;background:rgba(250,249,246,.5)}
.crop-grid::before{left:33.33%;right:33.33%;top:0;bottom:0;border-left:1px solid rgba(250,249,246,.5);border-right:1px solid rgba(250,249,246,.5);background:none}
.crop-grid::after{top:33.33%;bottom:33.33%;left:0;right:0;border-top:1px solid rgba(250,249,246,.5);border-bottom:1px solid rgba(250,249,246,.5);background:none}
.crop-ctl{display:flex;align-items:center;gap:10px;margin:12px 2px 0}
.crop-ctl input[type=range]{flex:1;accent-color:var(--accent);height:2px}
.crop-hint{font-size:12px;color:var(--ink-2);line-height:1.5;margin:8px 2px 0}
.crop-card .modal-foot{display:flex;flex-direction:column;gap:8px;padding:12px 16px 14px;border-top:1px solid var(--rule)}
.drop-acts{display:flex;gap:10px}
.modal.out{opacity:0;transition:opacity .18s ease}

.feeclaim{display:flex;align-items:center}
.feeclaim .mono{font-variant-numeric:tabular-nums;font-family:var(--font-mono)}
.claim-pill{display:inline-flex;align-items:center;gap:7px;font-size:12px;padding:5px 12px;border-color:var(--accent);color:var(--accent-deep);background:var(--paper);animation:claimIn .32s cubic-bezier(.2,.7,.2,1) both}
.claim-pill:hover:not(:disabled){background:var(--accent);color:var(--paper);border-color:var(--accent)}
.claim-pill:disabled{opacity:.5}
.claim-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 var(--accent);animation:claimPulse 2.4s ease-out infinite}
.claim-pill:hover .claim-dot{background:var(--paper);box-shadow:none}
@keyframes claimIn{from{opacity:0;transform:translateY(-4px) scale(.96)}to{opacity:1;transform:none}}
@keyframes claimPulse{0%{box-shadow:0 0 0 0 rgba(84,217,126,.45)}70%{box-shadow:0 0 0 6px rgba(84,217,126,0)}100%{box-shadow:0 0 0 0 rgba(84,217,126,0)}}
@media (max-width:640px){.claim-pill{padding:4px 9px;font-size:11px}}
.btn.small { padding: 2px 10px; font-size: 12px; line-height: 20px; }

/* contract address handoff after a launch */
.ca-card{margin-top:14px;padding:14px 16px;border:1px solid var(--rule);background:var(--paper-sunk);animation:caIn .35s ease both}
@keyframes caIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ca-head{display:flex;align-items:center;gap:8px;font-size:13px;margin-bottom:10px}
.ca-label{display:block;font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;color:var(--ink-3);margin-bottom:4px}
.ca-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ca-row.inline{margin-top:8px}
.ca-addr{font-family:var(--font-mono);font-size:11.5px;word-break:break-all;padding:5px 8px;border:1px solid var(--rule);background:var(--paper)}
.ca-meta{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;font-family:var(--font-sans);font-size:12px;color:var(--ink-3)}
.ca-meta .copy{cursor:pointer;border-bottom:1px dotted var(--ink-3)}
.btn.block{display:block;text-align:center;margin-top:12px}
.claim-note{margin-left:8px;color:var(--ink-3)}

/* coin header: identity left, the coin's own facts beside it */
.coin-head{display:flex;gap:32px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.coin-head-l{min-width:260px;flex:1 1 320px}
.coin-meta{flex:1 1 340px;max-width:520px;padding:14px 16px;border:1px solid var(--rule);background:var(--paper-sunk);animation:rise .4s cubic-bezier(.2,.7,.2,1) both}
.coin-desc{font-size:14px;line-height:1.5;color:var(--ink-2)}
.coin-by{margin-top:8px;color:var(--ink-3)}
.coin-meta .ca-row{margin-top:10px}
.coin-meta .ca-addr{font-size:11px}
@media (max-width:860px){.coin-head{gap:18px}.coin-meta{max-width:none}}


/* recent launches: cards */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
@media (max-width:980px){.card-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.card-grid{grid-template-columns:1fr}}
.lcard{display:flex;flex-direction:column;gap:14px;padding:18px;border:1px solid var(--rule);border-radius:4px;background:var(--paper);position:relative;overflow:hidden;
  animation:cardIn .26s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:calc(min(var(--i,0),3)*26ms);transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease}
@keyframes cardIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.lcard:hover{border-color:var(--rule-strong);transform:translateY(-2px);box-shadow:0 8px 22px -14px rgba(22,21,15,.4)}
.lcard::before{content:"";position:absolute;inset:0;border:1.5px solid var(--accent);border-radius:inherit;pointer-events:none;opacity:0;transform:scale(.988);transition:opacity .2s ease,transform .22s cubic-bezier(.2,.7,.2,1),box-shadow .22s ease}
.lcard:hover::before{opacity:1;transform:scale(1);box-shadow:0 0 0 3px rgba(84,217,126,.14),0 0 18px -4px rgba(84,217,126,.5)}
.lcard-top{display:flex;align-items:center;gap:11px}
.lcard-img{width:38px;height:38px;border-radius:4px;object-fit:cover;box-shadow:0 0 0 1px var(--rule);flex:none;background:var(--paper-sunk)}
.lcard-img.ph{display:flex;align-items:center;justify-content:center;font-family:var(--font-sans);font-size:14px;color:var(--ink-3)}
.lcard-id{min-width:0;flex:1}
.lcard-sym{font-family:var(--font-mono);font-size:13px;letter-spacing:.04em;display:flex;align-items:center;gap:6px}
.lcard-sym small{color:var(--ink-3);font-size:11px}
.lcard-name{font-size:14px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lcard-px{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.lcard-px b{font-family:var(--font-mono);font-size:17px;font-weight:500;letter-spacing:-.01em}
.lcard-px .sub{font-family:var(--font-mono);font-size:11px;color:var(--ink-3);display:block;margin-top:3px}
.lcard-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;font-family:var(--font-sans);font-size:12px;letter-spacing:-.005em;color:var(--ink-3)}
.lcard .prog{width:100%;height:3px;border-radius:2px;overflow:hidden}
.lcard .prog i{background:var(--ink);transition:width .5s ease}
.lcard .prog.hot i{background:var(--accent)}
.card-empty{grid-column:1/-1;padding:40px;text-align:center;color:var(--ink-3);border:1px dashed var(--rule);border-radius:4px}
.coin-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

/* treasury */
.tre-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:2px;margin:14px 0}
.tre-cards .stat{background:var(--paper);padding:14px 16px;display:flex;flex-direction:column;gap:4px}
.tre-cards .stat .k{font-size:12px;letter-spacing:-.005em;color:var(--ink-3)}
.tre-cards .stat .v{font:600 20px/1.2 var(--mono);color:var(--ink)}
.tre-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:6px}

/* footer buttons that behave like the footer links around them */
.foot-link{background:none;border:0;padding:0;text-align:left;cursor:pointer;font:inherit;font-size:14px;color:var(--ink-2)}
.foot-col .foot-link.mono{font-family:var(--font-sans);font-size:12.5px;letter-spacing:.01em}
.foot-link:hover{color:var(--accent-deep)}
.foot-bar{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* favourite quote currencies */
.fav-star{position:absolute;top:8px;right:8px;width:22px;height:22px;display:grid;place-items:center;border:0;background:none;padding:0;cursor:pointer;color:var(--ink-3);opacity:0;transform:scale(.8);transition:opacity .2s,transform .2s,color .2s}
.rate:hover .fav-star,.rate:focus-within .fav-star,.fav-star.on{opacity:1;transform:scale(1)}
.fav-star svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6}
.fav-star:hover{color:var(--accent-deep);transform:scale(1.15)}
.fav-star.on{color:var(--accent);animation:favpop .32s cubic-bezier(.2,.7,.2,1)}
.fav-star.on svg{fill:currentColor}
.rate.base::before{right:34px}
@keyframes favpop{0%{transform:scale(.7)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
.rate.is-fav{background:linear-gradient(180deg,rgba(84,217,126,.045),transparent 60%)}

/* long-form modal, used by the licence, risk and disclaimer dialogs */
.modal-card.wide{max-width:560px}
.modal-body-scroll{padding:16px;max-height:min(62vh,460px);overflow:auto;font-size:14px;line-height:1.6;color:var(--ink-2)}
.modal-body-scroll h4{font-size:13px;letter-spacing:-.005em;color:var(--ink-3);margin:16px 0 6px}
.modal-body-scroll h4:first-child{margin-top:0}
.modal-body-scroll p{margin:0 0 10px}
.modal-body-scroll pre{font-family:var(--font-mono);font-size:11.5px;line-height:1.6;white-space:pre-wrap;color:var(--ink-2);margin:0}
/* cookie notice, slim bar on the paper palette */
.cookie-note{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--paper);border-top:1px solid var(--rule-strong);box-shadow:0 -10px 30px rgba(22,21,15,.10);transform:translateY(110%);transition:transform .34s cubic-bezier(.2,.7,.2,1)}
.cookie-note.in{transform:translateY(0)}
.cookie-in{display:flex;align-items:center;gap:20px;justify-content:space-between;padding:13px 0}
.cookie-in p{font-size:13px;line-height:1.55;color:var(--ink-2);margin:0;max-width:820px}
.cookie-in .lnk{font-size:13px}
@media(max-width:700px){.cookie-in{flex-direction:column;align-items:stretch;gap:11px;padding:13px 0 15px}.cookie-in .btn{width:100%}}

/* fancy layer */
body{background:
  radial-gradient(1100px 520px at 12% -10%,rgba(84,217,126,.22),transparent 60%),
  radial-gradient(900px 480px at 100% 0%,rgba(84,252,132,.14),transparent 60%),
  var(--paper)}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.55;
  background-image:radial-gradient(rgba(24,24,24,.08) 1px,transparent 1px);background-size:22px 22px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),transparent 70%)}
main,footer{position:relative;z-index:1}
header.top{border-bottom:1px solid rgba(219,230,222,.7);box-shadow:0 8px 30px -20px rgba(24,48,42,.25)}
.display em{background:linear-gradient(95deg,var(--accent-deep),var(--accent) 45%,var(--accent-bright) 70%,var(--accent-deep));
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 7s linear infinite}
@keyframes sheen{to{background-position:220% 0}}
.display,.lede,.stats-row,.grid-stats,.card-grid>*,.sec-head,table,.panel{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
.lede{animation-delay:.08s}.stats-row,.grid-stats{animation-delay:.16s}
.card-grid>*:nth-child(2){animation-delay:.08s}.card-grid>*:nth-child(3){animation-delay:.16s}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.stats-row,.grid-stats,.panel,.card-grid>*,.modal{border-radius:14px;background:rgba(255,255,255,.62);backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 20px 50px -30px rgba(24,48,42,.35)}
.stats-row>div:first-child,.grid-stats>div:first-child{border-top-left-radius:14px}
.card-grid>*,.panel,tbody tr{transition:transform .22s cubic-bezier(.2,.7,.2,1),box-shadow .22s,background .18s}
.card-grid>*:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px rgba(36,138,66,.45);border-color:var(--accent)}
tbody tr:hover{background:rgba(84,217,126,.08)}
.btn{border-radius:999px;transition:transform .16s,box-shadow .16s,background .16s,color .16s}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px -14px rgba(24,48,42,.6)}
.btn:active{transform:translateY(0)}
.btn.primary,.btn.buy,button.buy{background:linear-gradient(120deg,var(--accent) 0%,var(--accent-bright) 100%);border-color:transparent;color:var(--accent-ink);
  box-shadow:0 10px 30px -14px rgba(84,217,126,.9)}
.sec-head{border-bottom-color:var(--rule-strong)}
.sec-head h2{position:relative}
.sec-head h2::after{content:"";position:absolute;left:0;bottom:-13px;width:42px;height:2px;background:linear-gradient(90deg,var(--accent-deep),var(--accent-bright));border-radius:2px}
.tag{border-radius:999px;background:rgba(84,217,126,.10);border-color:rgba(36,138,66,.25);color:var(--accent-ink)}
.ticker{background:linear-gradient(90deg,rgba(84,217,126,.10),transparent 20%,transparent 80%,rgba(84,217,126,.10))}
.ticker span{border-right-color:rgba(185,205,191,.6)}
input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 3px rgba(84,217,126,.28);border-color:var(--accent)!important;border-radius:6px}
.claim-pill{background:linear-gradient(120deg,var(--accent-wash),#fff);border-color:var(--accent)}
.claim-dot{box-shadow:0 0 0 0 rgba(84,217,126,.7);animation:pulse 1.8s ease-out infinite}
@keyframes pulse{to{box-shadow:0 0 0 10px rgba(84,217,126,0)}}
::selection{background:var(--accent-wash);color:var(--accent-ink)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* clip accent lines to the rounded corners */
.stats-row,.grid-stats,.tre-cards,.panel,.modal{overflow:hidden}
.stats-row>div,.grid-stats>div{position:relative}
.stats-row>div::after,.grid-stats>div::after{border-radius:2px 2px 0 0}
.brand-logo{display:block;width:26px;height:26px;object-fit:contain;flex:none;transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.brand:hover .brand-logo{transform:rotate(-12deg) scale(1.06)}
.brand{display:flex;align-items:center;gap:9px}
.brand-logo{width:32px;height:32px}
.bg3d{position:fixed;inset:0;z-index:0;pointer-events:none}
body.bg3d-hit{cursor:pointer}
body::before{opacity:.35}

/* live launch feed: new coins pop bottom right for every visitor */
.lfeed{position:fixed;right:24px;bottom:24px;z-index:60;display:flex;flex-direction:column;gap:10px;align-items:flex-end;pointer-events:none;max-width:min(330px,calc(100vw - 32px))}
.lfeed-card{pointer-events:auto;cursor:pointer;display:grid;grid-template-columns:38px 1fr 16px;gap:11px;align-items:center;width:100%;padding:11px 12px;background:var(--paper);border:1px solid var(--rule-strong);border-radius:4px;box-shadow:0 18px 44px -20px rgba(24,48,42,.5);opacity:0;transform:translateY(12px) scale(.98);transition:opacity .24s ease,transform .24s cubic-bezier(.2,.7,.2,1),border-color .18s}
.lfeed-card.in{opacity:1;transform:none}
.lfeed-card.out{opacity:0;transform:translateY(6px) scale(.98)}
.lfeed-card:hover{border-color:var(--accent-deep)}
.lf-art{width:38px;height:38px;border-radius:3px;overflow:hidden;display:grid;place-items:center;background:var(--accent-wash);border:1px solid var(--rule)}
.lf-art img{width:100%;height:100%;object-fit:cover;display:block}
.lf-art span{font-family:var(--font-mono);font-size:11px;color:var(--accent-deep)}
.lf-body{min-width:0}
.lf-kicker{display:flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.lf-kicker b{color:var(--accent-deep);font-weight:500}
.lf-kicker i{width:5px;height:5px;border-radius:999px;background:var(--accent);font-style:normal;animation:lfPulse 1.6s ease-in-out infinite}
.lf-pair{font-family:var(--font-mono);font-size:13px;color:var(--ink);margin-top:2px}
.lf-name{font-size:11px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lf-x{pointer-events:auto;background:none;border:0;padding:0;line-height:1;font-size:15px;color:var(--ink-2);cursor:pointer}
.lf-x:hover{color:var(--accent-deep)}
@keyframes lfPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.8)}}
@media (max-width:760px){.lfeed{right:14px;bottom:14px;left:14px;max-width:none}}
@media (prefers-reduced-motion:reduce){.lfeed-card{transition:opacity .2s}.lf-kicker i{animation:none}}

/* currency wall: one coin, priced in every quote currency at once */
.wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:4px;overflow:hidden}
.wall-cell{background:var(--paper);padding:10px 12px}
.wall-cell .v{font-family:var(--font-mono);font-size:13px;color:var(--ink);margin:3px 0 1px}
.wall-cell .dim{color:var(--ink-3)}
.wall-cell.native{background:var(--accent-wash)}
.wall-cell.native .v{color:var(--accent-deep)}

/* ---------- fx split ---------- */
/* The currency leg is tiny next to memecoin moves, so the bars are scaled to
   the larger leg on each card. That keeps a 0.1% currency move visible as a
   sliver rather than rounding it away to an empty track. */
.fxs-wrap{display:grid;gap:16px;margin-top:22px}
.fxs-card{border:1px solid var(--rule);border-radius:14px;background:rgba(255,255,255,.55);backdrop-filter:saturate(140%) blur(6px);padding:18px 20px;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .15s ease}
.fxs-card:hover{background:var(--accent-wash);border-color:var(--accent);transform:translateY(-1px)}
.fxs-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.fxs-head .pair{display:flex;align-items:center;gap:8px;font-weight:500}
.fxs-head .pair small{color:var(--ink-3);font-weight:400}
.fxs-bars{display:grid;gap:9px}
.fxs-row{display:grid;grid-template-columns:72px 1fr 96px;align-items:center;gap:12px}
.fxs-k{font-size:12px;color:var(--ink-3);letter-spacing:.01em}
.fxs-track{height:8px;border-radius:999px;background:var(--paper-sunk);overflow:hidden}
.fxs-track i{display:block;height:100%;border-radius:999px;transition:width .5s ease}
.fxs-track i.tok{background:var(--ink)}
.fxs-track i.fx{background:var(--accent)}
.fxs-track i.neg{background:var(--neg,#c0392b)}
.fxs-n{font-family:var(--font-mono);font-size:13px;text-align:right}
.fxs-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:15px;padding-top:13px;border-top:1px solid var(--rule)}
.fxs-leg{display:flex;align-items:baseline;gap:8px}
.fxs-lbl{font-size:12px;color:var(--ink-3)}
.fxs-val{font-family:var(--font-mono);font-size:15px}
.fxs-foot .micro{text-align:right;color:var(--ink-3)}
@media(max-width:620px){.fxs-row{grid-template-columns:60px 1fr 80px;gap:8px}.fxs-foot{flex-direction:column;align-items:flex-start;gap:6px}.fxs-foot .micro{text-align:left}}

/* ---------- 45 quote currencies ---------- */
/* Twelve currencies fit in a row. Forty five do not, so the filter row keeps
   favourites as buttons and pushes the long tail into a select, and the board
   gets a live filter. */
.seg-sel{margin-left:8px;height:30px;border:1px solid var(--rule);border-radius:8px;background:var(--paper);color:var(--ink-2);font-family:var(--font-sans);font-size:12px;padding:0 8px;cursor:pointer;max-width:190px}
.seg-sel:hover{border-color:var(--accent)}
.ccy-filter{margin-left:auto;height:30px;width:200px;border:1px solid var(--rule);border-radius:8px;background:var(--paper);color:var(--ink);font-family:var(--font-sans);font-size:12px;padding:0 10px}
.ccy-filter:focus{outline:none;border-color:var(--accent);background:var(--accent-wash)}
.ccy-foot{margin-top:12px;color:var(--ink-3);max-width:760px}
.ccy-foot a{color:var(--accent-deep)}
.rate.hide{display:none}
/* A currency priced off the broader feed rather than the ECB fix. Marked, not hidden. */
.tier-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--ink-3);opacity:.55;vertical-align:middle;margin-left:5px}
/* 45x45 is 2025 cells: pin the headers so the table stays readable while scrolling. */
.matrix{font-variant-numeric:tabular-nums}
.matrix thead th{position:sticky;top:0;z-index:2;background:var(--paper)}
.matrix th:first-child,.matrix td:first-child{position:sticky;left:0;z-index:1;background:var(--paper)}
.matrix thead th:first-child{z-index:3}
.tbl-wrap{max-height:560px;overflow:auto}
@media (max-width:900px){.rates-grid{grid-template-columns:repeat(3,1fr)}.ccy-filter{width:140px}.seg-sel{max-width:130px}}


/* ---------- service notice ---------- */
/* Drops down from above the header, pushes the page instead of covering it. */
.notice-bar{position:fixed;top:0;left:0;right:0;z-index:60;background:var(--accent-wash);border-bottom:1px solid var(--rule-strong);
  transform:translateY(-100%);transition:transform .42s cubic-bezier(.22,1,.36,1)}
.notice-bar.in{transform:translateY(0)}
.notice-in{max-width:var(--max);margin:0 auto;padding:9px 20px;display:flex;align-items:center;gap:10px}
.notice-in p{font-size:13px;line-height:1.45;color:var(--accent-ink);letter-spacing:-.005em}
.notice-in p b{font-weight:600}
.notice-dot{flex:none;width:7px;height:7px;border-radius:50%;background:var(--accent-deep);box-shadow:0 0 0 3px rgba(36,138,66,.16);animation:noticePulse 2.4s ease-in-out infinite}
@keyframes noticePulse{0%,100%{opacity:1}50%{opacity:.35}}
.notice-x{margin-left:auto;flex:none;width:24px;height:24px;border-radius:6px;color:var(--accent-ink);opacity:.5;font-size:18px;line-height:1}
.notice-x:hover{opacity:1;background:rgba(36,138,66,.1)}
/* While the notice is up, the fixed header and the page sit below it. */
html.has-notice header.top{top:var(--notice-h,40px);transition:top .42s cubic-bezier(.22,1,.36,1)}
html.has-notice body{padding-top:calc(64px + var(--notice-h,40px));transition:padding-top .42s cubic-bezier(.22,1,.36,1)}
@media (max-width:640px){.notice-in{padding:8px 14px}.notice-in p{font-size:12px}html.has-notice header.top{top:var(--notice-h,56px)}html.has-notice body{padding-top:calc(64px + var(--notice-h,56px))}}
@media (prefers-reduced-motion:reduce){.notice-bar{transition:none}.notice-dot{animation:none}}

/* ------------------------------------------------------------------
   dark mode surface overrides
   The token block at the top of this file recolours anything that reads
   from a var. These rules cover what does not: the frosted glass panels,
   the paper coloured gradients, and the handful of literal hex values
   that were baked in before the theme existed. Appended last so they win
   on the cascade without needing !important.
   ------------------------------------------------------------------ */
html[data-theme="dark"] body{
  background:
    radial-gradient(1100px 520px at 12% -10%,rgba(84,217,126,.10),transparent 60%),
    radial-gradient(900px 480px at 100% 0%,rgba(84,252,132,.07),transparent 60%),
    var(--paper);
}
html[data-theme="dark"] body::before{
  background-image:radial-gradient(rgba(232,239,233,.07) 1px,transparent 1px);
}
html[data-theme="dark"] header.top{
  background:rgba(14,20,17,.72);
  border-bottom:1px solid rgba(35,48,41,.8);
  box-shadow:0 8px 30px -20px rgba(0,0,0,.8);
}
html[data-theme="dark"] .stats-row,
html[data-theme="dark"] .grid-stats,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .card-grid>*,
html[data-theme="dark"] .modal-card{
  background:rgba(22,30,25,.62);
  box-shadow:0 1px 0 rgba(232,239,233,.04) inset,0 20px 50px -30px rgba(0,0,0,.9);
}
html[data-theme="dark"] footer{background:rgba(22,30,25,.62)}
html[data-theme="dark"] footer::before{
  background:linear-gradient(to bottom,rgba(22,30,25,0) 0,rgba(22,30,25,.22) 40%,rgba(22,30,25,.46) 72%,rgba(22,30,25,.62) 100%);
}
html[data-theme="dark"] .docs pre{box-shadow:inset 0 1px 0 rgba(232,239,233,.05)}
html[data-theme="dark"] .docs .tbl{background:rgba(22,30,25,.55)}
html[data-theme="dark"] .docs a:not(.btn){box-shadow:inset 0 -1px 0 rgba(126,242,164,.34)}
html[data-theme="dark"] .callout{
  background:linear-gradient(120deg,var(--accent-wash),rgba(22,30,25,.6));
  color:var(--ink);
  box-shadow:0 10px 30px -22px rgba(0,0,0,.8);
}
html[data-theme="dark"] .btn.primary:hover{background:var(--accent-deep);color:var(--paper)}
html[data-theme="dark"] .btn.accent{color:var(--accent-ink)}
html[data-theme="dark"] .btn:hover{box-shadow:0 10px 24px -14px rgba(0,0,0,.9)}
html[data-theme="dark"] .card-grid>*:hover{box-shadow:0 30px 60px -30px rgba(84,217,126,.28)}
html[data-theme="dark"] .lcard:hover{box-shadow:0 8px 22px -14px rgba(0,0,0,.9)}
html[data-theme="dark"] .rate:hover{box-shadow:0 6px 18px rgba(0,0,0,.4)}
html[data-theme="dark"] tbody tr:hover{background:rgba(84,217,126,.07)}
html[data-theme="dark"] .wstate .dot{background:var(--accent)}
html[data-theme="dark"] .wstate.ok{color:var(--accent)}
html[data-theme="dark"] .crop-grid{box-shadow:inset 0 0 0 1px rgba(14,20,17,.65)}
html[data-theme="dark"] .crop-grid::before,
html[data-theme="dark"] .crop-grid::after{background:rgba(14,20,17,.5)}
html[data-theme="dark"] .crop-grid::before{border-left-color:rgba(14,20,17,.5);border-right-color:rgba(14,20,17,.5)}
html[data-theme="dark"] .crop-grid::after{border-top-color:rgba(14,20,17,.5);border-bottom-color:rgba(14,20,17,.5)}
html[data-theme="dark"] .ticker span{border-right-color:rgba(53,73,60,.7)}
html[data-theme="dark"] .tag{background:rgba(84,217,126,.12);border-color:rgba(126,242,164,.25);color:var(--accent-deep)}
html[data-theme="dark"] .cookie-note{box-shadow:0 -10px 30px rgba(0,0,0,.6)}
html[data-theme="dark"] .to-top{box-shadow:0 10px 30px -14px rgba(0,0,0,.8)}
html[data-theme="dark"] .ccy-menu{box-shadow:0 16px 40px rgba(0,0,0,.6),0 2px 6px rgba(0,0,0,.4)}
html[data-theme="dark"] .modal{background:rgba(0,0,0,.66)}

/* theme toggle button */
.theme-btn{display:inline-grid;place-items:center;width:32px;height:32px;border:1px solid transparent;border-radius:999px;background:var(--paper-sunk);color:var(--ink-2);cursor:pointer;transition:border-color .16s ease,color .16s ease,background .16s ease}
.theme-btn:hover{border-color:var(--rule-strong);color:var(--ink)}
.theme-btn svg{width:15px;height:15px;display:block}
.theme-btn .i-moon{display:none}
html[data-theme="dark"] .theme-btn .i-sun{display:none}
html[data-theme="dark"] .theme-btn .i-moon{display:block}