:root{--ink:#0b0d0e;--muted:#5c636a;--line:#e6e8ea;--paper:#f7f8f9;--white:#fff;--green:#00c805;--green-dark:#067a09;--red:#e5484d;--amber:#f5a623;--navy:#0b0d0e;--card:#fff;--fill:#fafbf9;--hair:#edf0ee;--chipbg:#eef0f2;--invert:#0b0d0e;--invert-ink:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif}.wrap{width:min(1120px,calc(100% - 40px));margin-inline:auto}.nav{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font:700 21px "Space Grotesk"}.brand-mark{width:34px;height:34px;display:block;border-radius:9px;overflow:hidden}.brand-mark svg{width:100%;height:100%;display:block}.brand em{font:700 10px "DM Sans";letter-spacing:.12em;background:#dff9dc;color:var(--green-dark);padding:4px 6px;border-radius:4px}.network{font-size:13px;font-weight:600;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:9px 12px}.network i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);margin-right:7px;box-shadow:0 0 0 3px #d7f8d8}.network span{color:var(--muted);margin-left:7px}.hero{padding:90px 0 62px;text-align:center}.eyebrow{color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.17em}.eyebrow span{color:var(--green-dark);margin-right:5px}.hero h1{font:700 clamp(52px,8vw,92px)/.92 "Space Grotesk";letter-spacing:-.065em;margin:23px 0}.hero h1 span{color:var(--green-dark)}.lede{max-width:600px;margin:0 auto 38px;color:var(--muted);font-size:19px;line-height:1.55}.scanner{max-width:790px;margin:auto;padding:22px;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:17px;box-shadow:0 18px 60px rgba(18,39,29,.09)}.scanner label{display:block;font-size:10px;font-weight:700;letter-spacing:.14em;margin:0 0 9px}.input-row{display:flex;gap:10px}.input-row input{min-width:0;flex:1;border:1px solid #cbd3cf;background:var(--fill);border-radius:10px;padding:17px 16px;font:500 16px "DM Sans";outline:none}.input-row input:focus{border-color:var(--green-dark);box-shadow:0 0 0 3px #dcf8dd}.input-row button,.secondary{border:0;background:var(--green);color:#071408;font:700 15px "DM Sans";border-radius:10px;padding:0 23px;cursor:pointer}.input-row button:hover{background:#00b905}.input-row button b{margin-left:17px}.form-foot{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-top:11px}.proof{display:flex;justify-content:center;gap:70px;margin-top:50px}.proof div{display:flex;flex-direction:column}.proof b{font:700 24px "Space Grotesk"}.proof span{color:var(--muted);font-size:12px;margin-top:3px}.hidden{display:none!important}#loading.loading{min-height:480px;display:grid;place-items:center;align-content:center;text-align:center}.loading h2{font:700 30px "Space Grotesk";margin:25px 0 4px}.loading p{color:var(--muted)}.loader-mark{position:relative;width:120px;height:120px;display:grid;place-items:center}.loader-tile{position:relative;z-index:1;width:100%;height:100%;border-radius:24px;overflow:hidden;filter:drop-shadow(0 6px 18px rgba(204,255,0,.45))}.loader-img{width:100%;height:100%;display:block}.loader-halo{position:absolute;inset:-16px;border-radius:50%;background:radial-gradient(circle,rgba(204,255,0,.55),transparent 66%);animation:haloPulse 1.8s ease-in-out infinite}@keyframes haloPulse{0%,100%{transform:scale(.82);opacity:.45}50%{transform:scale(1.14);opacity:1}}.loader-scanbar{position:absolute;left:0;right:0;top:0;height:16px;z-index:2;background:linear-gradient(180deg,rgba(11,13,14,0),rgba(11,13,14,.55),rgba(11,13,14,0));box-shadow:0 0 12px 2px rgba(204,255,0,.5);animation:scanBar 1.6s ease-in-out infinite}@keyframes scanBar{0%{transform:translateY(-16px);opacity:0}12%{opacity:1}88%{opacity:1}100%{transform:translateY(120px);opacity:0}}.report{padding:62px 0 80px}.report-head{display:flex;align-items:flex-end;justify-content:space-between;gap:25px}.report-head h2{font:700 clamp(32px,5vw,52px) "Space Grotesk";letter-spacing:-.04em;margin:8px 0}.report-head h2 small{color:var(--muted);font-size:.45em}.report-head a{color:var(--muted);font-size:13px}.score-card{width:150px;padding:16px;border:1px solid var(--line);border-top:5px solid var(--amber);background:var(--card);border-radius:12px}.score-card span{font-size:9px;letter-spacing:.13em;font-weight:700;color:var(--muted)}.score-card strong{display:block;font:700 42px "Space Grotesk"}.score-card b{font-size:12px}.score-card.high{border-top-color:var(--red)}.score-card.low{border-top-color:var(--green)}.notice{margin:30px 0 18px;padding:14px 17px;background:#fff8e6;border:1px solid #f0d797;border-radius:9px;color:#6b581d;font-size:13px}.report-grid{display:grid;grid-template-columns:1fr 320px;gap:18px}.panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:25px}.panel h3{font:700 18px "Space Grotesk";margin:0 0 20px}.panel-title{display:flex;justify-content:space-between}.panel-title span{font-size:12px;color:var(--muted)}.finding{display:grid;grid-template-columns:30px 1fr;gap:11px;padding:17px 0;border-top:1px solid var(--hair)}.finding i{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:700}.finding.danger i{background:#fee7e5;color:var(--red)}.finding.warn i{background:#fff2d5;color:#9a6d00}.finding.good i{background:#e4f9e2;color:var(--green-dark)}.finding.unknown i{background:var(--hair);color:var(--muted)}.finding b{font-size:14px}.finding p{margin:4px 0 0;color:var(--muted);font-size:13px;line-height:1.45}.facts dl{margin:0}.facts dl div{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-top:1px solid var(--hair);font-size:13px}.facts dt{color:var(--muted)}.facts dd{margin:0;text-align:right;font-weight:600;overflow-wrap:anywhere}.secondary,.ghost{width:100%;padding:13px;margin-top:18px}.ghost{border:1px solid var(--line);background:transparent;border-radius:9px;font-weight:600;cursor:pointer}.method{text-align:center;color:var(--muted);font-size:11px;margin:18px}.how{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:70px}.how div{background:var(--card);padding:30px}.how span{font:700 11px "Space Grotesk";color:var(--green-dark)}.how h3{font:700 20px "Space Grotesk";margin:16px 0 6px}.how p{color:var(--muted);font-size:14px;margin:0;line-height:1.5}footer{border-top:1px solid var(--line);min-height:80px;display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:11px}@media(max-width:760px){.hero{padding-top:65px}.input-row{flex-direction:column}.input-row button{padding:16px}.form-foot{gap:10px}.proof{gap:26px}.report-head{align-items:stretch}.score-card{width:120px}.report-grid{grid-template-columns:1fr}.how{grid-template-columns:1fr}.report-head h2{font-size:30px}footer{flex-direction:column;justify-content:center}.network span{display:none}}@media(max-width:470px){.wrap{width:min(100% - 24px,1120px)}.network{font-size:0}.network i{margin:0}.brand{font-size:18px}.hero h1{font-size:49px}.proof{justify-content:space-between;gap:5px}.scanner{padding:15px}.report-head{display:block}.score-card{margin-top:20px;width:100%;display:grid;grid-template-columns:1fr auto;align-items:center}.score-card strong{grid-row:1/4;grid-column:2}.report-grid .panel{padding:19px}}

/* Shared product scales. Color aliases follow the existing theme values. */
:root {
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:24px; --space-6:32px; --space-7:48px;
  --radius-sm:6px; --radius-md:10px; --radius-lg:16px;
  --font-ui:Inter,-apple-system,"Segoe UI",sans-serif;
  --font-heading:Manrope,Poppins,Inter,sans-serif;
  --font-data:Inter,ui-monospace,monospace;
  --surface-subtle:color-mix(in srgb,var(--ink) 4%,var(--paper));
  --text-secondary:color-mix(in srgb,var(--ink) 72%,var(--paper));
  --accent-ink:#101112;
  --status-danger:var(--red); --status-warning:var(--amber); --status-success:var(--green-dark);
  --focus-ring:var(--green-dark); --shadow-panel:0 4px 8px rgb(0 0 0 / .12);
  --motion-fast:180ms; --motion-ease:cubic-bezier(.2,.8,.2,1);
}
/* ---- rebuilt report: verdict card, coverage, concentration, info status ---- */
.score-card{width:210px}
.score-card strong{display:block;font:700 42px "Space Grotesk";line-height:1}
.score-card #verdict{display:block;font:700 15px "Space Grotesk";letter-spacing:-.01em;margin-top:8px}
.score-card em{display:block;font-style:normal;font-size:12px;color:var(--muted);margin-top:2px}
.score-card small{display:block;font-size:10px;color:var(--muted);margin-top:8px;letter-spacing:.04em}
.score-card{border-top:5px solid var(--amber)}
.score-card.high{border-top-color:var(--red)}.score-card.high #verdict{color:var(--red)}
.score-card.warn{border-top-color:var(--amber)}.score-card.warn #verdict{color:#9a6d00}
.score-card.low{border-top-color:var(--green)}.score-card.low #verdict{color:var(--green-dark)}
.score-card.unknown{border-top-color:#8a94a6}.score-card.unknown #verdict{color:#5b6472}
.notice.high{background:#fdeceb;border-color:#f2b8b3;color:#8a2018}
.notice.unknown{background:#eef1f6;border-color:#cfd6e2;color:#3d4657}
.report-grid{grid-template-columns:1fr 320px;align-items:start}
.report-main{display:flex;flex-direction:column;gap:18px;min-width:0}
.finding.info i{background:#e9eef7;color:#3f5b93}
.finding .evi{display:inline-block;margin-left:2px;color:var(--green-dark);font-weight:600;font-size:12px;white-space:nowrap}
.muted-note{color:var(--muted);font-size:12px;margin:0 0 14px}
.conc .panel-title{margin-bottom:4px}
.conc-row{display:grid;grid-template-columns:34px 120px 1fr 52px;align-items:center;gap:10px;padding:7px 0;font-size:12px}
.conc-rank{color:var(--muted);font-weight:700}
.conc-addr{color:var(--ink);text-decoration:none;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.conc-addr:hover{color:var(--green-dark)}
.conc-track{height:8px;background:var(--hair);border-radius:5px;overflow:hidden}
.conc-fill{display:block;height:100%;border-radius:5px;background:var(--green)}
.conc-fill.warn{background:var(--amber)}.conc-fill.high{background:var(--red)}
.conc-pct{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
@media(max-width:760px){.report-grid{grid-template-columns:1fr}.score-card{width:100%}.conc-row{grid-template-columns:28px 100px 1fr 46px}}

/* ---- deployer reputation panel ---- */
.dep-score{font:700 14px "Space Grotesk";padding:5px 10px;border-radius:999px}
.dep-score.low{background:#e4f9e2;color:var(--green-dark)}
.dep-score.warn{background:#fff2d5;color:#9a6d00}
.dep-score.high{background:#fee7e5;color:var(--red)}
.dep-wallet{display:flex;gap:28px;flex-wrap:wrap;padding:10px 0 14px;border-bottom:1px solid var(--hair);margin-bottom:10px}
.dep-wallet a{color:var(--ink);font-weight:600;text-decoration:none;font-size:13px}
.dep-wallet a:hover{color:var(--green-dark)}
.dep-label{display:block;font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--muted);text-transform:uppercase;margin-bottom:3px}
.dep-meta{color:var(--muted);font-size:12px;margin-left:8px}
.dep-row{display:grid;grid-template-columns:minmax(80px,1fr) auto auto auto;align-items:center;gap:12px;padding:9px 0;border-top:1px solid #f2f4f2;font-size:13px}
.dep-row .dep-meta{margin-left:0;text-align:right;white-space:nowrap}
.dep-sym{color:var(--ink);font-weight:700;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dep-sym:hover{color:var(--green-dark)}
.chip{font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap}
.chip.low{background:#e4f9e2;color:var(--green-dark)}
.chip.warn{background:#fff2d5;color:#9a6d00}
.chip.high{background:#fee7e5;color:var(--red)}
.chip.muted{background:var(--hair);color:var(--muted)}
.dep-overlap{font-size:12px;color:#8a2018;background:#fdeceb;border:1px solid #f2b8b3;border-radius:8px;padding:10px 12px;margin:12px 0 0}
.dep-overlap a{color:#8a2018;font-weight:700}
.dep-foot{margin:12px 0 0}
@media(max-width:470px){.dep-row{grid-template-columns:1fr auto;row-gap:2px}.dep-row .dep-meta{text-align:left}}

/* ---- swap panel ---- */
.swap-panel{margin-top:18px;padding:19px;border-top:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none}
.swap-panel h3{font:700 16px "Space Grotesk";margin:0 0 12px}
.swap-panel .panel-title{margin-bottom:12px}
.swap-gate{background:#fff8e6;border:1px solid #f0d797;border-radius:9px;padding:14px}
.swap-gate.high{background:#fdeceb;border-color:#f2b8b3}
.swap-gate p{margin:0 0 12px;font-size:13px;color:#6b581d;line-height:1.5}
.swap-gate.high p{color:#8a2018}
.secondary.sm{width:auto;padding:8px 14px;margin:0;font-size:12px}
.swap-tabs{display:flex;gap:6px;margin-bottom:14px;background:#f1f3f0;border-radius:9px;padding:4px}
.swap-tab{flex:1;border:0;background:transparent;padding:9px;border-radius:7px;font:700 13px "DM Sans";cursor:pointer;color:var(--muted)}
.swap-tab.active{background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(18,39,29,.08)}
.swap-label{display:block;font-size:11px;font-weight:700;color:var(--muted);margin-bottom:6px}
.swap-input{width:100%;border:1px solid #cbd3cf;background:var(--fill);border-radius:10px;padding:14px;font:600 18px "Space Grotesk";outline:none;box-sizing:border-box}
.swap-input:focus{border-color:var(--green-dark);box-shadow:0 0 0 3px #dcf8dd}
#swap-estimate{margin:8px 0 14px}
.swap-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.swap-row label{font-size:11px;font-weight:700;color:var(--muted)}
.slip-opts{display:flex;gap:6px}
.chip-btn{border:1px solid var(--line);background:var(--card);border-radius:7px;padding:5px 9px;font:700 11px "DM Sans";cursor:pointer;color:var(--muted)}
.chip-btn.active{background:var(--invert);color:#fff;border-color:var(--ink)}
.input-row-button.swap-go{width:100%;border:0;background:var(--green);color:#071408;font:700 15px "DM Sans";border-radius:10px;padding:15px;cursor:pointer}
.input-row-button.swap-go:hover{background:#00b905}
.input-row-button.swap-go:disabled{opacity:.6;cursor:default}
#swap-status{min-height:16px}

/* ---- navbar: post-scan links + new scan ---- */
.nav-right{display:flex;align-items:center;gap:16px}
.nav-links{display:flex;align-items:center;gap:4px}
.nav-links a{color:var(--muted);text-decoration:none;font-weight:600;font-size:13px;padding:8px 12px;border-radius:8px;transition:background .15s,color .15s}
.nav-links a:hover{color:var(--ink);background:var(--chipbg)}
.nav-btn{border:0;background:var(--invert);color:#fff;font:700 13px "DM Sans";border-radius:9px;padding:9px 15px;cursor:pointer;white-space:nowrap;transition:transform .12s,background .15s}
.nav-btn:hover{background:#000;transform:translateY(-1px)}
.brand{transition:opacity .15s}.brand:hover{opacity:.75}
@media(max-width:640px){.nav-links a{padding:8px 9px;font-size:12px}.nav-btn{padding:8px 11px;font-size:12px}}
@media(max-width:470px){.nav-links a[data-nav="report"]{display:none}.nav-right{gap:9px}}

/* ---- score card: risk-tuned animated glow ---- */
.score-card{position:relative;isolation:isolate;overflow:visible;transition:border-color .3s;
  --glow:rgba(0,200,5,.36);--glowStrong:rgba(0,200,5,.55)}
.score-card::before{content:"";position:absolute;inset:-2px;border-radius:14px;z-index:-1;
  background:radial-gradient(120% 120% at 50% 0%,var(--glowStrong),transparent 70%);
  opacity:.0;animation:scoreGlow 2.8s ease-in-out infinite}
.score-card{animation:scoreLift 2.8s ease-in-out infinite}
.score-card.high{--glow:rgba(229,72,77,.5);--glowStrong:rgba(229,72,77,.7)}
.score-card.warn{--glow:rgba(245,166,35,.5);--glowStrong:rgba(245,166,35,.68)}
.score-card.unknown{--glow:rgba(138,148,166,.42);--glowStrong:rgba(138,148,166,.55)}
.score-card.low{--glow:rgba(0,200,5,.42);--glowStrong:rgba(0,200,5,.6)}
.score-card strong{transition:color .3s;text-shadow:0 0 22px var(--glow)}
.score-card.high strong{color:var(--red)}.score-card.warn strong{color:#c07d00}
.score-card.low strong{color:var(--green-dark)}.score-card.unknown strong{color:#5b6472}
@keyframes scoreGlow{0%,100%{opacity:.35;box-shadow:0 6px 26px -10px var(--glow)}50%{opacity:.9;box-shadow:0 14px 48px -8px var(--glowStrong)}}
@keyframes scoreLift{0%,100%{box-shadow:0 4px 18px -10px var(--glow)}50%{box-shadow:0 12px 40px -8px var(--glowStrong)}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .score-card,.score-card::before,.loader-halo,.loader-scanbar,.nav-btn{animation:none;transition:none}
  .score-card::before{opacity:.5}
}

/* ---- swap: wallet balances + MAX (Uniswap-style) ---- */
.swap-wallet{display:flex;align-items:center;gap:8px}
.swap-wallet .addr{font-family:inherit;font-size:12px;font-weight:600;line-height:1.4;color:var(--ink);background:var(--chipbg);border-radius:999px;padding:5px 10px;cursor:pointer;border:1px solid var(--line)}
.swap-wallet .addr:focus-visible{outline:2px solid var(--green-dark);outline-offset:2px}
.swap-wallet .addr:hover{border-color:var(--red);color:var(--red)}
.swap-wallet .addr .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:6px;vertical-align:middle}
.swap-balrow{display:flex;justify-content:space-between;align-items:center;margin:0 0 6px;font-size:12px;color:var(--muted)}
.swap-balrow b{color:var(--ink);font-weight:600}
.max-btn{border:1px solid var(--green-dark);background:#e8fbe6;color:var(--green-dark);font:700 10px "DM Sans";letter-spacing:.04em;border-radius:6px;padding:3px 8px;cursor:pointer;margin-left:8px}
.max-btn:hover{background:var(--green-dark);color:#fff}
.impact.ok{color:var(--muted)}.impact.warn{color:#c07d00;font-weight:600}.impact.high{color:var(--red);font-weight:700}
.swap-holding{font-size:11px;color:var(--muted);margin:8px 0 0}

/* Official Ruginhood brand system */
:root{--green:#ccff00;--green-dark:#587000}
.brand-mark{background:#ccff00 url("ruginhood-logo.svg") center/cover no-repeat}
.brand-mark svg{visibility:hidden}
.brand em{background:#efffc0;color:#3f5100}
.network i{background:#ccff00;box-shadow:0 0 0 3px rgba(204,255,0,.25)}
.input-row button:hover,.input-row-button.swap-go:hover{background:#b7e600}
.input-row input:focus,.swap-input:focus{border-color:#7b9900;box-shadow:0 0 0 3px rgba(204,255,0,.24)}
.loader-mark{background:url("ruginhood-logo.svg") center/contain no-repeat;filter:drop-shadow(0 8px 20px rgba(204,255,0,.48))}
.loader-mark svg{visibility:hidden}
.loader-halo{background:radial-gradient(circle,rgba(204,255,0,.56),transparent 66%)}
.loader-mark::after{content:"";position:absolute;z-index:3;left:8%;right:8%;top:8%;height:3px;border-radius:4px;background:#ccff00;box-shadow:0 0 10px #ccff00,0 0 24px #ccff00;animation:brandScan 1.7s ease-in-out infinite}
@keyframes brandScan{0%{transform:translateY(0);opacity:0}12%{opacity:1}88%{opacity:1}100%{transform:translateY(100px);opacity:0}}
.conc-fill,.score-card.low{--glow:rgba(204,255,0,.46);--glowStrong:rgba(204,255,0,.68)}
@media(prefers-reduced-motion:reduce){.loader-mark::after{animation:none;top:50%}}

/* ---- technical detail panels: economics, taxes, contract, distribution, buyers ---- */
.econ-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:10px}
.econ-cell{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:11px 13px}
.econ-cell span{display:block;font-size:11px;color:var(--muted);margin-bottom:3px}
.econ-cell b{font:700 15px "Space Grotesk";overflow-wrap:anywhere}
.econ-impact{margin-top:18px}
.econ-impact .impact-pt{display:inline-flex;flex-direction:column;gap:2px;margin:8px 22px 0 0;font-size:13px}
.impact-pt b{font-size:12px;color:var(--muted);font-weight:600}
.econ-tax{margin-top:18px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.chip.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:none;font-weight:600}
.ctr-facts{margin:0}
.ctr-facts div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-top:1px solid var(--hair);font-size:13px}
.ctr-facts dt{color:var(--muted)}.ctr-facts dd{margin:0;font-weight:600;text-align:right;overflow-wrap:anywhere}
.ctr-priv{margin-top:14px}
.conc-dist,.conc-buyers{margin-top:20px}
.dist-bar{display:flex;height:12px;border-radius:6px;overflow:hidden;margin:8px 0}
.dist-seg{display:block}
.dist-seg.high{background:var(--red)}.dist-seg.warn{background:var(--amber)}.dist-seg.ok{background:#9bcc00}.dist-seg.low{background:#e0f5a3}
.dist-legend{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--muted)}
.dist-legend .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:middle}
.dot.high{background:var(--red)}.dot.warn{background:var(--amber)}.dot.ok{background:#9bcc00}.dot.low{background:#e0f5a3}
.buyer-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.buyer{display:inline-flex;align-items:center;gap:5px;font-size:12px;background:var(--chipbg);border:1px solid var(--line);border-radius:7px;padding:5px 9px;text-decoration:none;color:var(--ink)}
.buyer:hover{border-color:var(--green-dark)}
.buyer.flag{background:#fdeceb;border-color:#f2b8b3;color:#8a2018;font-weight:700}
.buyer em{font-style:normal;font-size:10px;text-transform:uppercase;letter-spacing:.04em;opacity:.85}

/* ---- approvals & revoke ---- */
.swap-approvals{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.appr-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.appr-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 0;border-top:1px solid var(--hair)}
.appr-row b{font-size:13px}.appr-row .dep-meta{display:block;margin:2px 0 0}
.revoke-btn{border:1px solid var(--red);background:#fdeceb;color:#b0322c;font:700 12px "DM Sans";border-radius:8px;padding:7px 14px;cursor:pointer;white-space:nowrap}
.revoke-btn:hover{background:var(--red);color:#fff}
.revoke-btn:disabled{opacity:.6;cursor:default}
#revoke-status{min-height:14px;margin-top:8px}

/* ---- loader: inline animated mascot (overrides the background-image approach) ---- */
.loader-mark{background:none!important;filter:none!important}
.loader-mark::after{display:none!important}
/* spinning accent ring orbiting the mascot — the clear "working" cue */
.loader-mark::before{content:"";position:absolute;inset:-15px;border-radius:50%;z-index:0;
  background:conic-gradient(from 0deg,transparent 0 55%,rgba(204,255,0,.12) 68%,#ccff00 90%,transparent 100%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 4px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 4px));
  animation:mSpin 1.15s linear infinite}
@keyframes mSpin{to{transform:rotate(360deg)}}
.loader-halo{animation:haloPulse 2.2s ease-in-out infinite}
.loader-svg{position:relative;z-index:1;width:100%;height:100%;overflow:hidden;border-radius:24px;filter:drop-shadow(0 8px 22px rgba(204,255,0,.5));transform-origin:center;animation:mBob 2.6s ease-in-out infinite}
@keyframes mBob{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-5px) scale(1.045)}}
.m-eye{transform-box:fill-box;transform-origin:center;animation:mEye 1.6s ease-in-out infinite}
@keyframes mEye{0%,100%{opacity:.7}45%{opacity:1}}
.m-knife{animation:mGlint 2.4s ease-in-out infinite}
@keyframes mGlint{0%,100%{opacity:1}50%{opacity:.7}}
.m-scan{opacity:.9;mix-blend-mode:overlay;animation:mScan 1.5s ease-in-out infinite}
@keyframes mScan{0%{transform:translateY(-8px);opacity:0}15%{opacity:.95}85%{opacity:.95}100%{transform:translateY(112px);opacity:0}}
/* step text gently pulses so the screen reads as alive even between step changes */
.loading #loading-step{animation:stepFade 1.8s ease-in-out infinite}
@keyframes stepFade{0%,100%{opacity:.65}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.loader-svg,.m-eye,.m-knife,.m-scan,.loader-mark::before,.loading #loading-step{animation:none}}

.loader-mark svg.loader-svg{visibility:visible!important}

/* ---- rebuilt contract details ---- */
.ctr-badge{font:700 12px "Space Grotesk";padding:4px 10px;border-radius:999px}
.ctr-badge.ok{background:#e8fbe6;color:var(--green-dark)}
.ctr-badge.no{background:#f1f3f0;color:var(--muted)}
.ctr-section{margin-top:16px}
.ctr-section:first-of-type{margin-top:14px}
.ctr-facts{margin:6px 0 0}
.ctr-facts div{display:flex;justify-content:space-between;gap:16px;padding:8px 0;border-top:1px solid var(--hair);font-size:13px}
.ctr-facts dt{color:var(--muted);white-space:nowrap}
.ctr-facts dd{margin:0;font-weight:600;text-align:right;overflow-wrap:anywhere}
.ctr-facts dd a{color:var(--green-dark);text-decoration:none;font-weight:600}
.ctr-facts dd a:hover{text-decoration:underline}
.ctr-facts .unk{color:var(--muted);font-weight:500;font-style:italic}
.ctor-row{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-top:1px solid #f2f4f2;font-size:12px}
.ctor-k{color:var(--muted)}.ctor-k em{font-style:normal;opacity:.7;font-size:11px}
.ctor-v{font-weight:600;text-align:right;overflow-wrap:anywhere;max-width:60%}
.ctor-raw{font-size:11px;word-break:break-all;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:9px;margin:6px 0 0}

/* ---- swap section: now shown above the report, right after a scan ---- */
.swap-section{padding:34px 0 6px}
.swap-panel-top{margin-top:0;padding:26px;border-radius:16px;background:var(--card);border:1px solid var(--line);box-shadow:0 12px 40px -14px rgba(0,0,0,.14)}
.swap-panel-top .panel-title h3{font:700 20px "Space Grotesk"}
@media(max-width:470px){.swap-panel-top{padding:18px}}

/* ---- footer social links ---- */
footer{flex-direction:column;align-items:stretch;padding:20px 0;gap:0}
.footer-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;width:100%}
.social-links{display:flex;align-items:center;gap:16px}
.social-links a{display:inline-flex;align-items:center;gap:6px;color:var(--muted);text-decoration:none;font-size:12px;font-weight:600}
.social-links a:hover{color:var(--ink)}
.social-links svg{flex:none}
@media(max-width:640px){.footer-row{flex-direction:column;align-items:flex-start;gap:10px}.social-links{flex-wrap:wrap}}

/* ---- ecosystem growth section (landing) ---- */
.ecosystem{padding:24px 0 70px;text-align:center}
.eco-live{display:inline-flex;align-items:center;gap:7px;font:700 11px "DM Sans";letter-spacing:.14em;color:var(--green-dark);background:#eefbe6;border:1px solid #d6f2b8;border-radius:999px;padding:6px 13px}
.eco-live i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px rgba(0,200,5,.18);animation:ecoPulse 1.6s ease-in-out infinite}
@keyframes ecoPulse{50%{box-shadow:0 0 0 6px rgba(0,200,5,0)}}
.eco-head h2{font:700 clamp(30px,5vw,50px)/1.02 "Space Grotesk";letter-spacing:-.04em;margin:18px 0 12px}
.eco-head h2 span{color:var(--green-dark)}
.eco-head p{max-width:560px;margin:0 auto 34px;color:var(--muted);font-size:17px;line-height:1.5}
.eco-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.eco-stat{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px 10px;transition:transform .15s,border-color .15s}
.eco-stat:hover{transform:translateY(-2px);border-color:#cfe0b8}
.eco-stat b{display:block;font:700 clamp(22px,2.4vw,30px) "Space Grotesk";letter-spacing:-.02em;line-height:1;overflow-wrap:anywhere}
.eco-stat span{display:block;color:var(--muted);font-size:12px;margin-top:8px;font-weight:600}
.eco-stat.accent{background:#0b0d0e;border-color:#0b0d0e}
.eco-stat.accent b{color:var(--green)}
.eco-stat.accent span{color:#c9d0cf}
.eco-foot{color:#8b938f;font-size:11px;margin-top:20px}
@media(max-width:900px){.eco-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:470px){.eco-grid{grid-template-columns:repeat(2,1fr);gap:10px}.eco-stat{padding:18px 8px}}

/* ---- live deployment monitor ---- */
.live{padding:10px 0 70px}
.live-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.live-title{display:flex;align-items:center;gap:10px}
.live-title h2{font:700 clamp(22px,3vw,30px) "Space Grotesk";letter-spacing:-.03em;margin:0}
.live-dot{width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 0 3px rgba(229,72,77,.2)}
.live-dot.on{background:var(--green);box-shadow:0 0 0 3px rgba(0,200,5,.22);animation:ecoPulse 1.4s ease-in-out infinite}
.nav-live-link{display:inline-flex;align-items:center;gap:6px;color:var(--muted);text-decoration:none;font-weight:600;font-size:13px;padding:8px 12px;border-radius:8px}
.nav-live-link:hover{color:var(--ink);background:var(--chipbg)}
.nav-live-link .live-dot{width:7px;height:7px;box-shadow:none}
.live-controls{display:flex;gap:8px}
.live-btn{border:1px solid var(--line);background:var(--card);color:var(--ink);font:700 12px "DM Sans";border-radius:9px;padding:8px 13px;cursor:pointer;white-space:nowrap}
.live-btn:hover{border-color:#cbd3cf}
.live-btn.primary{background:var(--invert);color:#fff;border-color:var(--ink)}
.live-btn.on{background:#eefbe6;border-color:#c7ec9e;color:var(--green-dark)}
.live-sub{color:var(--muted);font-size:15px;margin:12px 0 22px;max-width:620px}
.live-feed{display:flex;flex-direction:column;gap:8px;min-height:80px}
.live-empty{color:var(--muted);font-size:14px;text-align:center;padding:34px;border:1px dashed var(--line);border-radius:12px}
.live-row{display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:13px 16px}
.live-row.fresh{animation:liveIn .5s ease}
@keyframes liveIn{from{opacity:0;transform:translateY(-8px);border-color:var(--green)}to{opacity:1;transform:none}}
.live-tok{min-width:0}
.live-sym{font:700 15px "Space Grotesk";display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.live-addr{color:var(--muted);font-size:12px;text-decoration:none}
.live-addr:hover{color:var(--green-dark)}
.live-liq{font-size:12px;font-weight:700;text-align:right;white-space:nowrap}
.live-liq.real{color:var(--green-dark)}.live-liq.empty{color:var(--muted)}
.live-age{color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap;min-width:44px;text-align:right}
.live-scan{border:0;background:var(--green);color:#0b1a02;font:700 12px "DM Sans";border-radius:8px;padding:8px 12px;cursor:pointer;white-space:nowrap}
.live-scan:hover{background:#b7e600}
@media(max-width:560px){.live-row{grid-template-columns:1fr auto;gap:6px 12px}.live-age{grid-column:2;grid-row:1}.live-liq{grid-column:1;grid-row:2;text-align:left}.live-scan{grid-column:2;grid-row:2}}

/* ---- live feed filters ---- */
.live-filters{display:flex;gap:8px;margin:0 0 16px;flex-wrap:wrap}
.live-filter{border:1px solid var(--line);background:var(--card);color:var(--muted);font:700 12px "DM Sans";border-radius:999px;padding:7px 13px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.live-filter:hover{border-color:#cbd3cf;color:var(--ink)}
.live-filter.active{background:var(--invert);color:#fff;border-color:var(--ink)}
.live-filter span{background:rgba(0,0,0,.08);border-radius:999px;padding:1px 7px;font-size:11px;min-width:18px;text-align:center}
.live-filter.active span{background:rgba(255,255,255,.2)}
/* accessibility: kill the new pulsing dots for reduced-motion users */
@media(prefers-reduced-motion:reduce){.eco-live i,.live-dot,.live-dot.on{animation:none}}

/* ---- token launch interface ---- */
.nav-launch-link{display:inline-flex;align-items:center;color:var(--ink);text-decoration:none;font-weight:700;font-size:13px;padding:8px 13px;border-radius:9px;background:var(--green);}
.nav-launch-link:hover{background:#b7e600}
.launch{padding:20px 0 74px}
.launch-head{text-align:center;max-width:640px;margin:0 auto 30px}
.launch-head h2{font:700 clamp(28px,4.5vw,46px)/1.03 "Space Grotesk";letter-spacing:-.04em;margin:14px 0 12px}
.launch-head h2 span{color:var(--green-dark)}
.launch-head p{color:var(--muted);font-size:16px;line-height:1.55}
.launch-grid{display:grid;grid-template-columns:1fr 340px;gap:18px;align-items:start}
.launch-form{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px}
.lf-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.lf-field{margin-bottom:14px;display:flex;flex-direction:column}
.lf-field label{font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--muted);margin-bottom:6px;text-transform:uppercase}
.lf-field label em{text-transform:none;font-style:normal;font-weight:500;opacity:.7}
.lf-field input,.lf-field textarea{border:1px solid #cbd3cf;background:var(--fill);border-radius:10px;padding:12px 13px;font:500 15px "DM Sans";outline:none;resize:vertical}
.lf-field input:focus,.lf-field textarea:focus{border-color:#7b9900;box-shadow:0 0 0 3px rgba(204,255,0,.24)}
.lf-tick-wrap{display:flex;align-items:center;border:1px solid #cbd3cf;background:var(--fill);border-radius:10px;padding:0 13px}
.lf-tick-wrap:focus-within{border-color:#7b9900;box-shadow:0 0 0 3px rgba(204,255,0,.24)}
.lf-tick-wrap span{font-weight:700;color:var(--muted)}
.lf-tick-wrap input{border:0;background:transparent;padding:12px 4px;box-shadow:none!important;text-transform:uppercase;font-weight:700;letter-spacing:.03em}
.lf-costs{display:flex;flex-direction:column;gap:8px;background:var(--paper);border:1px solid var(--line);border-radius:11px;padding:13px;margin:6px 0 14px;font-size:13px}
.lf-costs div{display:flex;justify-content:space-between}
.lf-costs .lf-total{font-weight:700;border-top:1px solid var(--line);padding-top:8px}
.lf-launch-btn{width:100%;border:0;background:var(--invert);color:#fff;font:700 15px "DM Sans";border-radius:11px;padding:15px;cursor:pointer}
.lf-launch-btn:hover{background:#000}
.lf-launch-btn:disabled{opacity:.6;cursor:default}
.lf-launch-btn.ready{background:var(--green);color:#0b1a02}
.lf-launch-btn.ready:hover{background:#b7e600}
.lf-disclaimer{border-top:1px solid var(--hair);padding-top:12px;margin-top:12px;line-height:1.5}
.launch-preview{background:#0b0d0e;border-radius:16px;padding:22px;position:sticky;top:16px}
.launch-preview .dep-label{color:#c9d0cf}
.lp-chart{margin:12px 0 16px}
.lp-chart svg{width:100%;height:auto;display:block}
.lp-stats{margin:0}
.lp-stats div{display:flex;justify-content:space-between;padding:9px 0;border-top:1px solid rgba(255,255,255,.08);font-size:13px}
.lp-stats dt{color:#9aa2a0}.lp-stats dd{margin:0;color:#fff;font-weight:700}
.lp-stats dd.accent{color:var(--green)}
@media(max-width:820px){.launch-grid{grid-template-columns:1fr}.launch-preview{position:static}}
@media(max-width:470px){.lf-row{grid-template-columns:1fr}}

/* ---- economics: no-liquidity warning ---- */
.econ-cell.dim b{color:var(--muted)}
.econ-liqwarn{margin:14px 0 0;background:#fdeceb;border:1px solid #f2b8b3;color:#8a2018;border-radius:10px;padding:11px 13px;font-size:12px;line-height:1.5}
.econ-noliq{color:var(--red);font-weight:700;font-size:12px}

/* ---- live widget: floating, collapsible, scrollable side panel ---- */
.live-widget{position:fixed;right:18px;bottom:18px;width:320px;max-width:calc(100vw - 24px);z-index:60;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 50px -14px rgba(0,0,0,.3);overflow:hidden}
.live-widget.flash{animation:lwFlash .9s ease}
@keyframes lwFlash{0%,100%{box-shadow:0 18px 50px -14px rgba(0,0,0,.3)}30%{box-shadow:0 0 0 3px var(--green),0 18px 50px -14px rgba(0,0,0,.32)}}
.lw-header{display:flex;align-items:center;gap:9px;width:100%;border:0;background:var(--invert);color:#fff;padding:12px 14px;cursor:pointer;font:700 14px "Space Grotesk"}
.lw-header .live-dot{width:8px;height:8px;box-shadow:none}
.lw-title{flex:1;text-align:left}
.lw-count{background:var(--green);color:#0b1a02;font:700 12px "DM Sans";border-radius:999px;padding:1px 8px;min-width:20px;text-align:center}
.lw-chev{color:#c9d0cf;font-size:11px}
.lw-body{max-height:min(62vh,520px);display:flex;flex-direction:column}
.live-widget.collapsed .lw-body{display:none}
.lw-controls{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line)}
.lw-actions{display:flex;gap:6px}
.lw-icon{border:1px solid var(--line);background:var(--card);border-radius:8px;width:32px;height:30px;cursor:pointer;font-size:13px;display:grid;place-items:center;line-height:1}
.lw-icon:hover{border-color:#cbd3cf}
.lw-icon.on{background:#eefbe6;border-color:#c7ec9e}
.live-feed{overflow-y:auto;padding:5px;flex:1;display:block;min-height:0}
.live-empty{padding:22px 14px;font-size:12px}
.live-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;padding:9px 8px;border:0;border-radius:9px;background:transparent}
.live-row:hover{background:var(--paper)}
.live-row+.live-row{border-top:1px solid #f1f3ef}
.live-row.fresh{animation:liveIn .5s ease}
.lr-tok{min-width:0}
.live-sym{font:700 14px "Space Grotesk";display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:160px}
.lr-sub{display:flex;align-items:center;gap:8px;margin-top:2px}
.live-addr{color:var(--muted);font-size:11px;text-decoration:none}
.live-addr:hover{color:var(--green-dark)}
.live-liq{font-size:11px;font-weight:700;white-space:nowrap}
.live-liq.real{color:var(--green-dark)}.live-liq.empty{color:#a4acaa}
.lr-right{display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.live-age{color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}
.live-scan{border:0;background:var(--green);color:#0b1a02;font:700 11px "DM Sans";border-radius:7px;padding:5px 11px;cursor:pointer}
.live-scan:hover{background:#b7e600}
.live-filters{gap:5px;margin:0;flex-wrap:nowrap}
.live-filter{padding:5px 9px;font-size:11px}
.live-filter span{padding:0 5px;font-size:10px;min-width:14px}
.lw-foot{margin:0;padding:8px 12px;border-top:1px solid var(--line);color:var(--muted);font-size:10.5px;text-align:center}
@media(max-width:760px){.live-widget{right:10px;bottom:10px;width:280px}.lw-body{max-height:54vh}}

/* ---- primary nav tabs ---- */
.nav-primary{display:flex;gap:2px;background:var(--chipbg);border-radius:11px;padding:3px}
.nav-tab{padding:8px 16px;border-radius:8px;text-decoration:none;color:var(--muted);font-weight:700;font-size:14px;transition:background .15s,color .15s}
.nav-tab:hover{color:var(--ink)}
.nav-tab.active{background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.08)}
@media(max-width:560px){.nav-tab{padding:7px 12px;font-size:13px}}

/* ---- beginner-friendly hero ---- */
.hero .eyebrow span{color:var(--green-dark);margin-right:6px;font-size:9px}
.hero h1{margin:20px 0 18px}
.lede b{color:var(--ink);font-weight:700}
.scanner label{text-transform:none;font-size:13px;letter-spacing:0;color:var(--muted);font-weight:600}
.hero-example{border:0;background:transparent;color:var(--green-dark);font:700 12px "DM Sans";cursor:pointer;padding:0}
.hero-example:hover{text-decoration:underline}
.hero-trust{display:flex;justify-content:center;flex-wrap:wrap;gap:10px 22px;margin-top:34px}
.hero-trust span{color:var(--muted);font-size:13px;font-weight:600}
@media(max-width:560px){.hero-trust{gap:8px 14px;font-size:12px}.hero-trust span{font-size:12px}}

/* ---- wanted list ---- */
.wanted{padding:20px 0 74px}
.wanted-head{text-align:center;max-width:620px;margin:0 auto 30px}
.wanted-head .eyebrow span{margin-right:6px}
.wanted-head h2{font:700 clamp(28px,4.5vw,44px) "Space Grotesk";letter-spacing:-.04em;margin:14px 0 12px}
.wanted-head p{color:var(--muted);font-size:16px;line-height:1.55}
.wanted-list{display:flex;flex-direction:column;gap:10px;max-width:760px;margin:0 auto}
.wanted-empty{text-align:center;color:var(--muted);font-size:14px;line-height:1.6;padding:34px;border:1px dashed var(--line);border-radius:14px;max-width:760px;margin:0 auto}
.wanted-row{display:flex;justify-content:space-between;align-items:center;gap:16px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 18px}
.wanted-row:hover{border-color:#f2b8b3}
.wanted-main{min-width:0}
.wanted-top{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.wanted-kind{font:700 10px "DM Sans";letter-spacing:.05em;text-transform:uppercase;border-radius:999px;padding:3px 9px}
.wanted-kind.deployer{background:#fdeceb;color:#8a2018}
.wanted-kind.contract{background:#fff2d5;color:#9a6d00}
.wanted-addr{color:var(--ink);font-weight:700;text-decoration:none;font-size:14px}
.wanted-addr:hover{color:var(--red)}
.wanted-sym{color:var(--muted);font-weight:600;font-size:13px}
.wanted-reasons{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.wanted-reasons span{background:#fdeceb;color:#8a2018;font-size:11px;font-weight:600;border-radius:6px;padding:3px 8px}
.wanted-meta{display:flex;flex-direction:column;align-items:flex-end;gap:8px;white-space:nowrap}
.wanted-count{color:var(--muted);font-size:12px;font-weight:600}
.wanted-scan{border:1px solid var(--ink);background:var(--invert);color:#fff;font:700 12px "DM Sans";border-radius:8px;padding:7px 13px;cursor:pointer;text-decoration:none;display:inline-block}
.wanted-scan:hover{background:#000}
.wanted-scan.alt{background:var(--card);color:var(--ink)}
.wanted-foot{text-align:center;color:var(--muted);font-size:12px;margin-top:20px}
@media(max-width:560px){.wanted-row{flex-direction:column;align-items:flex-start}.wanted-meta{flex-direction:row;align-items:center}}

/* ---- swap as a floating side widget (bottom-left, opposite the live widget) ---- */
.swap-widget{position:fixed;left:18px;bottom:18px;width:340px;max-width:calc(100vw - 24px);z-index:60;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 50px -14px rgba(0,0,0,.3);overflow:hidden;max-height:min(82vh,660px);display:flex;flex-direction:column}
.swap-widget.sw-flash{animation:lwFlash .9s ease}
.sw-header{display:flex;align-items:center;gap:9px;width:100%;border:0;background:var(--green);color:#0b1a02;padding:12px 15px;cursor:pointer;font:700 15px "Space Grotesk"}
.sw-header:hover{background:#b7e600}
.sw-icon{font-size:16px}
.sw-title{flex:1;text-align:left}
.sw-chev{font-size:12px}
.sw-body{overflow-y:auto;padding:16px;flex:1;min-height:0}
.swap-widget.collapsed .sw-body{display:none}
/* neutralise the old inline-panel chrome + drop redundant inner headings */
.swap-widget .swap-panel{margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.swap-widget .swap-panel h3{display:none}
.swap-widget .swap-gate{margin-top:0}
@media(max-width:760px){.swap-widget{left:10px;bottom:10px;width:300px}}
@media(max-width:640px){
  /* on small screens the two corner widgets can crowd — keep them slim when collapsed */
  .swap-widget.collapsed,.live-widget.collapsed{width:auto}
  .swap-widget:not(.collapsed){width:calc(100vw - 20px);left:10px}
  .live-widget:not(.collapsed){width:calc(100vw - 20px);right:10px}
}

/* ---- responsive nav: prevent overflow on narrow screens ---- */
body{overflow-x:hidden}
.nav-right{min-width:0}
@media(max-width:960px){.network{display:none}}
@media(max-width:720px){.nav-links{display:none}.nav-tab{padding:7px 11px;font-size:13px}.nav-live-link{padding:8px 9px}}
@media(max-width:460px){.nav-primary{gap:1px;padding:2px}.nav-tab{padding:6px 9px;font-size:12px}.brand span:not(.brand-mark){font-size:16px}.brand em{display:none}}

/* ============ App-style mobile shell ============ */
.tabbar{display:none}
@media(max-width:720px){
  /* Native-app bottom tab bar */
  .tabbar{
    display:grid;grid-template-columns:repeat(5,1fr);   /* five tabs, one row — was 4, which wrapped the 5th */
    position:fixed;left:0;right:0;bottom:0;z-index:80;
    background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(14px);
    -webkit-backdrop-filter:saturate(1.4) blur(14px);
    border-top:1px solid var(--line);
    padding-bottom:env(safe-area-inset-bottom);
    box-shadow:0 -8px 30px -18px rgba(0,0,0,.35)}
  .tabbar-btn{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    border:0;background:none;cursor:pointer;color:var(--muted);
    font:600 10px "DM Sans";letter-spacing:.005em;padding:9px 0 8px;min-height:54px}
  .tabbar-btn span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tabbar-btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;
    stroke-linecap:round;stroke-linejoin:round}
  /* the active tab gets a top rule so the "you are here" cue survives 5-up crowding */
  .tabbar-btn.active{position:relative}
  .tabbar-btn.active::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
    width:26px;height:2.5px;border-radius:0 0 3px 3px;background:var(--green-dark)}
  .tabbar-btn.active{color:var(--green-dark)}
  .tabbar-btn:active{transform:scale(.94)}
  .tabbar-live{width:23px;height:23px;display:grid;place-items:center}
  .tabbar-live .live-dot{width:9px;height:9px}

  /* Hand the primary nav to the tab bar; keep only brand + live pill up top */
  .nav-primary{display:none}
  .nav-live-link{display:none}
  .nav{height:60px}
  body{padding-bottom:calc(58px + env(safe-area-inset-bottom))}

  /* Widgets become docked bottom sheets sitting above the tab bar */
  .live-widget{left:0;right:0;bottom:0;width:100%;max-width:100%;
    border-radius:18px 18px 0 0;border-bottom:0;
    margin-bottom:calc(58px + env(safe-area-inset-bottom));
    box-shadow:0 -14px 44px -18px rgba(0,0,0,.4)}
  .swap-widget{left:0;right:0;bottom:0;width:100%;max-width:100%;
    border-radius:18px 18px 0 0;border-bottom:0;
    margin-bottom:calc(58px + env(safe-area-inset-bottom));
    max-height:min(76vh,620px)}
  .lw-body{max-height:52vh}
  /* Full-width tap targets, comfortable hit areas */
  .input-row button,.secondary,.ghost{min-height:52px}
  .live-scan{min-height:34px;padding:0 14px}
}
@media(max-width:720px) and (min-width:561px){
  /* mid-size: keep widgets as floating cards but lift above the tab bar */
  .live-widget,.swap-widget{left:auto;right:12px;width:320px;border-radius:16px;
    margin-bottom:calc(58px + env(safe-area-inset-bottom))}
  .swap-widget{left:12px;right:auto}
}
/* Respect the tab-bar space when the on-screen keyboard/scroll settles */
@supports(padding:max(0px)){
  @media(max-width:720px){.tabbar{padding-bottom:max(env(safe-area-inset-bottom),4px)}}
}

/* ============ Launchpad token explorer ============ */
.tokens{padding:56px 0 80px}
.tokens-head{text-align:center;max-width:640px;margin:0 auto 26px}
.tokens-head h2{font:700 clamp(30px,4.5vw,44px) "Space Grotesk";letter-spacing:-.04em;margin:10px 0 8px}
.tokens-head p{color:var(--muted);font-size:15px;line-height:1.55;margin:0}
.tokens-bar{display:flex;justify-content:space-between;align-items:center;gap:14px;max-width:820px;margin:0 auto 14px}
.tokens-filters{display:flex;gap:4px;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:3px}
.tokens-filter{border:0;background:none;border-radius:999px;padding:7px 14px;font:600 13px "DM Sans";color:var(--muted);cursor:pointer}
.tokens-filter.active{background:var(--green);color:#071408}
.tokens-filter span{opacity:.7;margin-left:4px}
.tokens-status{color:var(--muted);font-size:12px;text-align:right}
.tokens-sortwrap{display:flex;align-items:center;gap:6px}
.tokens-sortlabel{color:var(--muted);font:600 12px "DM Sans"}
.tokens-sort{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:6px 12px;font:600 13px "DM Sans";color:var(--ink,#111);cursor:pointer}
.tokens-list{display:flex;flex-direction:column;gap:8px;max-width:820px;margin:0 auto}
.tokens-empty{text-align:center;color:var(--muted);font-size:14px;padding:34px;border:1px dashed var(--line);border-radius:14px}
.token-row{display:flex;justify-content:space-between;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:13px;padding:13px 16px}
.token-row:hover{border-color:var(--green-dark)}
.tr-main{display:flex;align-items:baseline;gap:10px;min-width:0}
.tr-sym{font:700 15px "Space Grotesk";white-space:nowrap}
.tr-name{color:var(--muted);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}
.tr-addr a{color:var(--muted);font-size:12px;text-decoration:none}
.tr-addr a:hover{color:var(--green-dark);text-decoration:underline}
.tr-meta{display:flex;align-items:center;gap:12px;flex-shrink:0}
.tr-liq{font-size:12px;font-weight:700}
.tr-liq.real{color:var(--green-dark)}
.tr-liq.empty{color:#9aa39e}
.tr-age{color:var(--muted);font-size:12px}
.tr-creator a{color:var(--muted);font-size:12px;text-decoration:none}
.tr-creator a:hover{color:var(--green-dark)}
.tr-scan{border:1px solid var(--line);background:var(--card);border-radius:8px;padding:7px 13px;font:600 12px "DM Sans";cursor:pointer}
.tr-scan:hover{background:var(--green);border-color:var(--green)}
.tokens-more{max-width:820px;display:block;margin:14px auto 0}
@media(max-width:640px){
  .token-row{flex-direction:column;align-items:stretch;gap:8px}
  .tr-meta{justify-content:space-between}
  .tr-creator{display:none}
  .tokens-bar{flex-direction:column;align-items:stretch}
  .tokens-status{text-align:center}
}
/* 5-tab bottom bar */
@media(max-width:720px){.tabbar-5{grid-template-columns:repeat(5,1fr)}.tabbar-5 .tabbar-btn{font-size:10px}}

/* ============ Explorer v2: hybrid aggregator cards ============ */
.tokens-head h2 span{color:var(--green-dark)}
.tokens-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:820px;margin:0 auto 18px}
.tokens-stats div{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 10px;text-align:center}
.tokens-stats b{display:block;font:700 22px "Space Grotesk"}
.tokens-stats span{color:var(--muted);font-size:11px}
.tokens-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;max-width:980px;margin:0 auto}
.tokens-grid .tokens-empty{grid-column:1/-1}
.token-card{background:var(--card);border:1px solid var(--line);border-radius:15px;padding:16px;display:flex;flex-direction:column;gap:10px;transition:border-color .15s,box-shadow .15s}
.token-card:hover{border-color:var(--green-dark);box-shadow:0 10px 30px -18px rgba(18,39,29,.35)}
.token-card.is-rh{border-color:var(--green);box-shadow:0 0 0 1px var(--green),0 10px 34px -18px rgba(140,180,0,.5)}
.tc-top{display:flex;gap:11px;align-items:center}
.tc-avatar{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;flex-shrink:0;
  font:700 19px "Space Grotesk";color:#071408;
  background:linear-gradient(135deg,hsl(var(--h) 85% 72%),hsl(calc(var(--h) + 45) 85% 55%))}
.tc-id{min-width:0}
.tc-line1{display:flex;align-items:center;gap:7px;min-width:0}
.tc-sym{font:700 15px "Space Grotesk";overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:130px}
.tc-badge{font:700 9.5px "DM Sans";letter-spacing:.05em;padding:3px 7px;border-radius:999px;white-space:nowrap}
.tc-badge.rh{background:var(--green);color:#071408}
.tc-badge.funded{background:#e4f9e2;color:var(--green-dark)}
.tc-badge.empty{background:#f0f2f0;color:#8a948e}
.tc-addr{color:var(--muted);font-size:11.5px;text-decoration:none}
.tc-addr:hover{color:var(--green-dark);text-decoration:underline}
.tc-barrow{display:flex;justify-content:space-between;align-items:baseline;font-size:11px;color:var(--muted)}
.tc-barrow b{font:700 13px "Space Grotesk";color:var(--ink)}
.tc-bar{height:8px;border-radius:999px;background:#eef1ee;overflow:hidden}
.tc-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#a5d600,var(--green));
  box-shadow:0 0 8px 1px rgba(204,255,0,.55);transition:width .4s}
.tc-stats{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:end;border-top:1px solid #f0f2f0;padding-top:10px}
.tc-stats span{display:block;color:var(--muted);font-size:10px;letter-spacing:.04em}
.tc-stats b{font:600 12.5px "DM Sans"}
.tc-stats b a{color:inherit;text-decoration:none}
.tc-stats b a:hover{color:var(--green-dark)}
.tc-cta .tr-scan{padding:8px 15px}
@media(max-width:640px){
  .tokens-stats{grid-template-columns:repeat(2,1fr)}
  .tokens-grid{grid-template-columns:1fr}
}

/* bonding-curve graduation */
.tc-badge.grad{background:#0b0d0e;color:var(--green)}
.tc-bar.grad i{background:linear-gradient(90deg,var(--green),#eaff70);box-shadow:0 0 12px 2px rgba(204,255,0,.75)}
.token-card.is-grad{border-color:#c9d69a}
.tc-stats{grid-template-columns:1fr 1fr 1fr auto}
@media(max-width:400px){.tc-stats{grid-template-columns:1fr 1fr;row-gap:10px}.tc-cta{grid-column:2;justify-self:end}}
@media(max-width:640px){
  .tokens-filters{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .tokens-filters::-webkit-scrollbar{display:none}
  .tokens-filter{white-space:nowrap;flex-shrink:0}
}

/* anti-rug panel on the launch page */
.lp-antirug{margin-top:16px;border-top:1px solid var(--hair);padding-top:14px}
.lp-antirug-head{font:700 13px "Space Grotesk";margin-bottom:9px}
.lp-antirug ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.lp-antirug li{font-size:12px;color:var(--muted);line-height:1.5;padding-left:16px;position:relative}
.lp-antirug li::before{content:"✓";position:absolute;left:0;color:var(--green-dark);font-weight:700}
.lp-antirug li b{color:var(--ink)}

/* creator-trust chips + community wanted tag */
.tc-dev{font:700 9.5px "DM Sans";padding:2px 6px;border-radius:999px;vertical-align:1px;white-space:nowrap}
.tc-dev.ok{background:#e4f9e2;color:var(--green-dark)}
.tc-dev.bad{background:#fee7e5;color:var(--red)}
.tc-dev.warn{background:#fff2d5;color:#9a6d00}
.tc-dev.mid{background:#f0f2f0;color:#6a746e}
.wanted-src{font:700 9px "DM Sans";letter-spacing:.05em;padding:3px 7px;border-radius:999px;background:#eef2ff;color:#4756b8;text-transform:uppercase}
.wanted-src.mine{background:#e4f9e2;color:var(--green-dark)}

/* ============ Score card v2: gauge + explainer ============ */
.score-card{width:190px;position:relative}
.score-card strong{display:inline-block}
.sc-outof{font:700 15px "Space Grotesk";color:var(--muted);text-decoration:none;margin-left:2px}
.sc-gauge{position:relative;height:7px;border-radius:999px;margin:8px 0 9px;
  background:linear-gradient(90deg,#e5484d 0%,#e5484d 45%,#f2a900 46%,#f2a900 75%,#3fbf46 76%,#3fbf46 100%)}
.sc-gauge i{position:absolute;top:-3.5px;width:3px;height:14px;border-radius:2px;background:var(--invert);
  box-shadow:0 0 0 2px #fff;transform:translateX(-50%);transition:left .5s ease}
.sc-hint{display:inline-grid;place-items:center;width:14px;height:14px;margin-left:4px;border-radius:50%;
  background:#e8ebe8;color:#5c636a;font:700 9px "DM Sans";font-style:normal;cursor:help;position:relative;vertical-align:1px}
.sc-hint:hover .sc-tip,.sc-hint:focus .sc-tip{display:block}
.sc-tip{display:none;position:absolute;top:20px;right:-12px;z-index:30;width:240px;
  background:#0b0d0e;color:#e8ebe8;font:400 11.5px/1.55 "DM Sans";letter-spacing:0;text-align:left;
  padding:11px 13px;border-radius:10px;box-shadow:0 12px 34px -10px rgba(0,0,0,.5)}
.sc-tip b{color:#ccff00}
@media(max-width:470px){.sc-tip{right:auto;left:-80px}}
@media(max-width:470px){
  .score-card{display:block;width:100%}
  .score-card strong{grid-row:auto;grid-column:auto;font-size:38px;margin-right:2px}
  .score-card b{display:inline-block;margin-right:8px}
  .score-card em{display:inline}
  .score-card small{display:block;margin-top:4px}
}

/* DexScreener chart panel */
.chart .panel-title a{color:var(--muted);font-size:12px;text-decoration:none}
.chart .panel-title a:hover{color:var(--green-dark)}
.chart-load{margin-top:0}
.chart-frame{border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.chart-frame iframe{display:block;width:100%;height:460px;border:0}
@media(max-width:640px){.chart-frame iframe{height:380px}}

/* incomplete-evidence scans: the trust number must not read as a verdict */
.score-card.unknown strong,.score-card.unknown .sc-outof{color:#9aa39e}
.score-card.unknown .sc-gauge{opacity:.3}
.score-card.unknown .sc-gauge i{background:#9aa39e}

/* clean-token launch preview */
.clean-token{display:flex;gap:14px;align-items:center;background:#f7fbef;border:1px solid #e3efc9;border-radius:12px;padding:16px}
.ct-badge{font-size:30px;line-height:1}
.ct-lines{display:flex;flex-direction:column;gap:6px}
.ct-lines span{font-size:12.5px;color:var(--green-dark);font-weight:600}

/* ============ Hero v2: single-viewport scan + ecosystem ============ */
.hero{min-height:calc(100vh - 82px);display:flex;flex-direction:column;justify-content:center;
  gap:clamp(28px,5vh,60px);padding:24px 0 34px;text-align:center}
.hero-top{display:flex;flex-direction:column;align-items:center;gap:22px}
.hero h1{font:700 clamp(38px,6.2vw,72px)/1 "Space Grotesk";letter-spacing:-.055em;margin:0}
.hero h1 span{color:var(--green-dark)}
.hero .scanner{width:min(660px,100%);margin:0}
.hero .lede{display:none}
.hero-eco{width:100%;background:linear-gradient(180deg,rgba(204,255,0,.05),transparent);
  border:1px solid var(--line);border-radius:18px;padding:20px 20px 22px;
  box-shadow:0 18px 60px -30px rgba(18,39,29,.18)}
.hero-eco .eco-live{justify-content:center;margin-bottom:16px}
.eco-foot-inline{color:var(--muted);font-weight:500;letter-spacing:0;text-transform:none;margin-left:8px;font-size:11px}
.hero-eco .eco-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:0}
.hero-eco .eco-stat{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:16px 8px;
  transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s,border-color .25s}
.hero-eco .eco-stat:hover{transform:translateY(-4px);border-color:var(--green);box-shadow:0 12px 26px -14px rgba(140,180,0,.5)}
.hero-eco .eco-stat.accent{background:linear-gradient(160deg,#f4ffcf,#fff)}
.hero-eco .eco-stat b{font:700 clamp(18px,2vw,26px) "Space Grotesk";display:block;line-height:1.05}
.hero-eco .eco-stat span{font-size:11px;color:var(--muted);margin-top:4px;display:block}
@media(max-width:900px){.hero-eco .eco-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.hero{min-height:calc(100vh - 60px);padding-bottom:20px}}
@media(max-width:480px){
  .hero-eco .eco-grid{grid-template-columns:repeat(3,1fr);gap:7px}
  .hero-eco{padding:16px 12px}
  .hero-eco .eco-stat{padding:12px 4px}
  .hero h1{font-size:34px}
  .hero{gap:26px}
}
@media(max-width:560px){.eco-foot-inline{display:none}.hero-eco .eco-live{margin-bottom:12px}}

/* ============ Scan report: dashboard motion ============ */
@media (prefers-reduced-motion: no-preference){
  @keyframes rhUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
  @keyframes rhPop{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:none}}
  @keyframes rhGlow{0%,100%{box-shadow:0 0 0 0 var(--rh-glow,transparent)}50%{box-shadow:0 0 26px 2px var(--rh-glow,transparent)}}
  #report:not(.hidden) .report-head{animation:rhUp .5s both cubic-bezier(.2,.8,.2,1)}
  #report:not(.hidden) .score-card{animation:rhPop .55s .05s both cubic-bezier(.2,.8,.2,1)}
  #report:not(.hidden) #verdict-note{animation:rhUp .5s .12s both}
  #report:not(.hidden) .report-main > .panel{animation:rhUp .55s both cubic-bezier(.2,.8,.2,1)}
  #report:not(.hidden) .report-main > .panel:nth-child(1){animation-delay:.16s}
  #report:not(.hidden) .report-main > .panel:nth-child(2){animation-delay:.22s}
  #report:not(.hidden) .report-main > .panel:nth-child(3){animation-delay:.28s}
  #report:not(.hidden) .report-main > .panel:nth-child(4){animation-delay:.34s}
  #report:not(.hidden) .report-main > .panel:nth-child(5){animation-delay:.40s}
  #report:not(.hidden) .report-main > .panel:nth-child(6){animation-delay:.46s}
  #report:not(.hidden) aside.facts{animation:rhUp .55s .26s both}
  .findings .finding{animation:rhUp .45s both;animation-delay:calc(var(--i,0)*42ms + .18s)}
  .econ-grid .econ-cell{animation:rhPop .4s both}
  /* score number gets a gentle pop as it counts */
  #report:not(.hidden) #score{display:inline-block;animation:rhPop .5s .1s both}
}
/* dashboard-style hover motion on every panel */
.report .panel{transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s,border-color .22s}
.report .panel:hover{transform:translateY(-3px);box-shadow:0 16px 40px -22px rgba(18,39,29,.4);border-color:#d6dccf}
/* score-card tone glow */
.score-card{transition:box-shadow .3s}
.score-card.high{--rh-glow:rgba(229,72,77,.35)}
.score-card.warn{--rh-glow:rgba(242,169,0,.32)}
.score-card.low{--rh-glow:rgba(63,191,70,.34)}
@media (prefers-reduced-motion: no-preference){
  .score-card.high,.score-card.warn,.score-card.low{animation:rhGlow 2.6s ease-in-out 1s 2}
}
/* the gauge needle already transitions on left; make it smooth for the count-up */
.sc-gauge i{transition:left .05s linear}

/* ============ Report dashboard hero (score + KPIs + chart) ============ */
.report-hero{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start;margin-bottom:24px}
.report-hero-left{display:flex;flex-direction:column;gap:18px}
.report-hero .report-head{margin:0}
.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 13px;transition:transform .2s,border-color .2s}
.kpi:hover{transform:translateY(-2px);border-color:var(--green)}
.kpi span{font-size:10px;letter-spacing:.05em;color:var(--muted);text-transform:uppercase}
.kpi b{display:block;font:700 18px "Space Grotesk";margin-top:4px;overflow-wrap:anywhere}
.kpi b.pos{color:var(--green-dark)}
.kpi b.neg{color:var(--red)}
#chart.chart{padding:0;overflow:hidden;min-height:420px}
#chart .panel-title{padding:16px 18px 10px}
.chart-frame{background:#0b1220;border-radius:0 0 14px 14px;overflow:hidden}
.chart-frame iframe{display:block;width:100%;height:420px;border:0}
@media(max-width:900px){
  .report-hero{grid-template-columns:1fr}
  #chart.chart{min-height:0}
  .chart-frame iframe{height:360px}
}
@media(max-width:470px){.hero-stats{grid-template-columns:repeat(2,1fr)}}
/* economics source tags */
.econ-cell b .src{font:600 9px "DM Sans";font-style:normal;color:var(--muted);background:#f0f2f0;border-radius:4px;padding:1px 5px;margin-left:5px;vertical-align:1px;letter-spacing:.02em}
/* first-buyers panel reuses buyer chips */
.buyers .buyer-list{display:flex;flex-wrap:wrap;gap:7px;margin-top:6px}
.buyers .buyer{display:inline-flex;align-items:center;gap:5px;font:600 12px "DM Sans";color:var(--ink);background:var(--chipbg);border:1px solid var(--line);border-radius:8px;padding:6px 9px;text-decoration:none}
.buyers .buyer:hover{border-color:var(--green-dark)}
.buyers .buyer.flag{background:#fee7e5;border-color:#f3b0ab;color:#8a2b26}
.buyers .buyer em{font-style:normal;font-size:9px;font-weight:700;text-transform:uppercase;opacity:.75}
/* chart animates into the hero */
@media (prefers-reduced-motion: no-preference){
  #report:not(.hidden) .report-hero #chart{animation:rhUp .55s .12s both cubic-bezier(.2,.8,.2,1)}
  #report:not(.hidden) .hero-stats .kpi{animation:rhPop .45s both}
  #report:not(.hidden) .hero-stats .kpi:nth-child(2){animation-delay:.04s}
  #report:not(.hidden) .hero-stats .kpi:nth-child(3){animation-delay:.08s}
  #report:not(.hidden) .hero-stats .kpi:nth-child(4){animation-delay:.12s}
  #report:not(.hidden) .hero-stats .kpi:nth-child(5){animation-delay:.16s}
  #report:not(.hidden) .hero-stats .kpi:nth-child(6){animation-delay:.20s}
}

/* token-card venue chips (multi-DEX) */
.tc-venues{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.tc-venue{font:700 9px "DM Sans";letter-spacing:.03em;background:#eef2ff;color:#4756b8;border-radius:5px;padding:2px 6px}
.live-venue{font:700 8px "DM Sans";background:#eef2ff;color:#4756b8;border-radius:4px;padding:1px 4px;margin-left:5px;vertical-align:1px;letter-spacing:.02em}

/* ============ Dedicated Swap page ============ */
.swap-page{padding:48px 0 90px}
.swap-page-head{text-align:center;max-width:600px;margin:0 auto 26px}
.swap-page-head h2{font:700 clamp(30px,4.5vw,46px) "Space Grotesk";letter-spacing:-.04em;margin:10px 0 8px}
.swap-page-head p{color:var(--muted);font-size:15px;line-height:1.55;margin:0}
.swap-page-inner{max-width:460px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:0 18px 60px -30px rgba(18,39,29,.18)}
.swap-token-select{display:flex;gap:8px}
.swap-token-select input{flex:1;min-width:0;border:1px solid #cbd3cf;background:var(--fill);border-radius:10px;padding:13px 14px;font:500 14px "DM Sans";outline:none}
.swap-token-select input:focus{border-color:var(--green-dark);box-shadow:0 0 0 3px #dcf8dd}
.swap-token-select .secondary{width:auto;padding:0 20px;margin:0}
#swap-token-msg{margin:8px 2px 0;font-size:12px;min-height:15px}
.swap-page-inner .swap-panel{margin-top:14px}
.report-trade{margin-left:12px;border:0;background:var(--green);color:#071408;font:700 13px "DM Sans";border-radius:8px;padding:8px 14px;cursor:pointer;vertical-align:2px}
.report-trade:hover{background:#00b905}
@media(max-width:470px){.swap-page-inner{padding:15px}}

/* swap page: chart beside the panel + token logo in the title */
.swap-page-grid{display:grid;grid-template-columns:460px 1fr;gap:22px;align-items:start;max-width:1000px;margin:0 auto}
.swap-page-grid .swap-page-inner{margin:0}
#swap-chart.chart{padding:0;overflow:hidden;min-height:420px}
#swap-chart .panel-title{padding:16px 18px 10px}
#swap-chart .panel-title a{color:var(--muted);font-size:12px;text-decoration:none}
#swap-chart .panel-title a:hover{color:var(--green-dark)}
#swap-chart .chart-frame{background:#0b1220;border-radius:0 0 14px 14px;overflow:hidden}
#swap-chart .chart-frame iframe{display:block;width:100%;height:440px;border:0}
.swap-title-img{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;overflow:hidden;vertical-align:-7px;margin-right:10px;background:#eef2ef}
.swap-title-img img{width:100%;height:100%;object-fit:cover;display:block}
.swap-title-img.mono{font:700 15px "Space Grotesk";color:#071408;background:linear-gradient(135deg,hsl(var(--h,90) 85% 72%),hsl(calc(var(--h,90) + 45) 85% 55%))}
@media(max-width:820px){.swap-page-grid{grid-template-columns:1fr;max-width:460px}#swap-chart.chart{min-height:0}#swap-chart .chart-frame iframe{height:360px}}

/* active load-screen progress */
.loading-bar-track{position:relative;width:min(300px,80%);height:6px;border-radius:999px;background:#e6e8ea;margin:18px auto 10px;overflow:hidden}
.loading-bar-track i{display:block;height:100%;width:8%;border-radius:999px;background:linear-gradient(90deg,#a5d600,var(--green));box-shadow:0 0 10px 1px rgba(204,255,0,.5);transition:width .5s cubic-bezier(.3,.9,.3,1)}
/* moving highlight so the bar always reads as active, even between step jumps */
.loading-bar-track::after{content:"";position:absolute;inset:0;border-radius:999px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);transform:translateX(-100%);animation:barShimmer 1.5s ease-in-out infinite}
@keyframes barShimmer{0%{transform:translateX(-100%)}60%,100%{transform:translateX(100%)}}
.loading-meta{color:var(--muted);font-size:12px;margin:0}
@media(prefers-reduced-motion:reduce){.loading-bar-track::after{animation:none;opacity:0}}
#loading-elapsed{font-variant-numeric:tabular-nums;font-weight:600}

/* real token logos on explorer cards */
.tc-avatar.has-img{background:#eef2ef;padding:0}
.tc-avatar.has-img img{width:100%;height:100%;object-fit:cover;display:block;border-radius:12px}

/* token logo in the scan-report header */
.token-logo{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;overflow:hidden;vertical-align:-9px;margin-right:12px;background:#eef2ef}
.token-logo:empty{display:none}
.token-logo img{width:100%;height:100%;object-fit:cover;display:block}
.token-logo.mono{font:700 20px "Space Grotesk";color:#071408;background:linear-gradient(135deg,hsl(var(--h,90) 85% 72%),hsl(calc(var(--h,90) + 45) 85% 55%))}
@media(max-width:470px){.token-logo{width:34px;height:34px;vertical-align:-6px;margin-right:8px}}

/* ============ Revoke page: approval checkup ============ */
.revoke-head{max-width:820px;margin:0 auto 20px;text-align:center}
.revoke-head h2{font:700 clamp(24px,4vw,34px) "Space Grotesk";margin:8px 0}
.revoke-head p{color:var(--muted);font-size:14px;line-height:1.6;max-width:640px;margin:0 auto}
.revoke-connect{text-align:center;padding:38px 20px;border:1px dashed var(--line);border-radius:16px;max-width:560px;margin:0 auto}
.revoke-connect .primary{font:700 15px "Space Grotesk";padding:13px 26px;border-radius:12px;border:0;background:var(--green);color:#071408;cursor:pointer}
.revoke-connect .primary:hover{background:var(--green-dark);color:#fff}
.revoke-connect .muted-note{margin-top:12px}
.revoke-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;max-width:820px;margin:0 auto 14px}
.revoke-wallet{display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:8px 14px;font:600 13px "DM Sans"}
.revoke-stats{display:flex;gap:8px;flex-wrap:wrap;flex:1}
.rv-stat{background:var(--card);border:1px solid var(--line);border-radius:999px;padding:6px 12px;font:600 12px "DM Sans";color:var(--muted)}
.rv-stat.crit{color:#b3261e;border-color:#f2b8b5}
.rv-stat.high{color:#8a5a00;border-color:#eed49f}
.revoke-progress{max-width:820px;margin:0 auto 12px;color:var(--muted);font-size:13px;min-height:18px}
.revoke-list{display:flex;flex-direction:column;gap:10px;max-width:820px;margin:0 auto}
.rv-row{display:flex;justify-content:space-between;align-items:center;gap:16px;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--line);border-radius:13px;padding:14px 16px}
.rv-critical{border-left-color:#d93025}
.rv-high{border-left-color:#e8930c}
.rv-medium{border-left-color:#e3c000}
.rv-low{border-left-color:#9db4a4}
.rv-info{border-left-color:var(--green)}
.rv-done{opacity:.55}
.rv-main{min-width:0}
.rv-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rv-sym{font:700 15px "Space Grotesk"}
.rv-arrow{color:var(--muted)}
.rv-spender{font:600 13px "DM Sans";color:var(--green-dark);text-decoration:none}
.rv-spender:hover{text-decoration:underline}
.rv-chip{font:700 10px "DM Sans";text-transform:uppercase;letter-spacing:.4px;border-radius:999px;padding:3px 8px}
.rv-chip-critical{background:#fbd3d0;color:#b3261e}
.rv-chip-high{background:#fde8c8;color:#8a5a00}
.rv-chip-medium{background:#f6efc0;color:#6d5c00}
.rv-chip-low{background:#e5ece7;color:#4c5f53}
.rv-chip-info{background:#d9f2e2;color:#116932}
.rv-chip-unl{background:#efe3fb;color:#5f2ba5}
.rv-chip-idle{background:#e8e8e8;color:#555}
.rv-reason{color:var(--muted);font-size:13px;line-height:1.5;margin:6px 0 4px}
.rv-meta{color:var(--muted);font-size:11.5px}
.rv-meta a{color:var(--green-dark)}
.rv-btn{border:1px solid #d93025;background:var(--card);color:#d93025;font:700 13px "DM Sans";border-radius:10px;padding:9px 18px;cursor:pointer;white-space:nowrap}
.rv-btn:hover{background:#d93025;color:#fff}
.rv-btn:disabled{opacity:.6;cursor:wait}
.rv-revoked{color:var(--green-dark);font:700 13px "DM Sans";white-space:nowrap}
.revoke-foot{max-width:820px;margin:14px auto 0}
@media(max-width:640px){.rv-row{flex-direction:column;align-items:stretch}.rv-btn{width:100%}}
/* 6-tab bottom bar */
@media(max-width:720px){.tabbar{grid-template-columns:repeat(5,1fr)}.tabbar .tabbar-btn{font-size:10px}}
.wanted-src.auto{background:#fde8c8;color:#8a5a00}

/* ============ Homepage FAQ ============ */
.faq{max-width:740px;margin-inline:auto;padding:10px 0 70px}
.faq h2{font:700 clamp(24px,3.6vw,34px) "Space Grotesk";letter-spacing:-.03em;text-align:center;margin:0 0 22px}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:0 18px;margin-bottom:10px}
.faq summary{cursor:pointer;font:700 15px "Space Grotesk";padding:16px 0;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:700 18px "Space Grotesk";color:var(--green-dark);flex:none}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 16px;color:var(--muted);font-size:14px;line-height:1.6}
.faq details a{color:var(--green-dark);font-weight:600}
.faq-more{text-align:center;color:var(--muted);font-size:13px;margin-top:18px}
.faq-more a{color:var(--green-dark);font-weight:600}

/* ============ Blog ============ */
.blog{padding:56px 0 80px}
.blog-head{text-align:center;max-width:680px;margin:0 auto 40px}
.blog-head h1{font:700 clamp(32px,5vw,52px) "Space Grotesk";letter-spacing:-.045em;margin:14px 0 12px}
.blog-head h1 span{color:var(--green-dark)}
.blog-head p{color:var(--muted);font-size:16px;line-height:1.55}
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;max-width:1000px;margin:0 auto}
.blog-card{display:flex;flex-direction:column;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px;text-decoration:none;color:var(--ink);transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s,border-color .2s}
.blog-card:hover{transform:translateY(-3px);border-color:var(--green-dark);box-shadow:0 16px 40px -22px rgba(18,39,29,.35)}
.blog-tag{display:inline-flex;align-self:flex-start;font:700 10px "DM Sans";letter-spacing:.08em;text-transform:uppercase;color:var(--green-dark);background:#eefbe6;border-radius:999px;padding:4px 10px}
.blog-card h2{font:700 20px "Space Grotesk";letter-spacing:-.01em;margin:0;line-height:1.25}
.blog-card p{color:var(--muted);font-size:14px;line-height:1.55;margin:0}
.blog-meta{color:var(--muted);font-size:12px;margin-top:auto;padding-top:6px}
.blog-cta{padding:44px 0;text-align:center;background:#0b0d0e;border-radius:20px;margin-top:50px;max-width:1000px;margin-inline:auto}
.blog-cta h2{color:#fff;font:700 clamp(24px,3.4vw,34px) "Space Grotesk";margin:0 0 10px}
.blog-cta p{color:#c9d0cf;font-size:14px;margin:0 0 20px}
.blog-cta a{display:inline-block;border:0;background:var(--green);color:#071408;font:700 15px "DM Sans";border-radius:10px;padding:13px 26px;text-decoration:none}
.blog-cta a:hover{background:#b7e600}

.article{padding:50px 0 80px}
.article-head{max-width:740px;margin:0 auto 30px}
.article-head .blog-tag{margin-bottom:14px}
.article-head h1{font:700 clamp(28px,4.6vw,44px)/1.1 "Space Grotesk";letter-spacing:-.03em;margin:0 0 14px}
.article-head p{color:var(--muted);font-size:16px;line-height:1.55;margin:0 0 14px}
.article-meta{color:var(--muted);font-size:12px;display:flex;gap:14px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:14px}
.article-body{max-width:740px;margin:0 auto;font-size:16px;line-height:1.75;color:var(--ink)}
.article-body h2{font:700 26px "Space Grotesk";letter-spacing:-.02em;margin:40px 0 14px}
.article-body h3{font:700 19px "Space Grotesk";margin:28px 0 10px}
.article-body p{margin:0 0 18px}
.article-body ul,.article-body ol{margin:0 0 18px;padding-left:22px}
.article-body li{margin-bottom:8px}
.article-body a{color:var(--green-dark);font-weight:600;text-decoration:underline}
.article-body strong{color:var(--ink)}
.article-body blockquote{margin:24px 0;padding:14px 20px;border-left:3px solid var(--green);background:var(--paper);border-radius:0 10px 10px 0;color:var(--muted);font-style:italic}
.article-callout{max-width:740px;margin:30px auto;background:#eefbe6;border:1px solid #d6f2b8;border-radius:14px;padding:20px 22px}
.article-callout b{display:block;font:700 15px "Space Grotesk";color:var(--green-dark);margin-bottom:6px}
.article-callout p{margin:0 0 12px;color:#3f5100;font-size:14px;line-height:1.55}
.article-callout a{display:inline-block;border:0;background:var(--invert);color:#fff;font:700 13px "DM Sans";border-radius:9px;padding:10px 18px;text-decoration:none}
.article-callout a:hover{background:#000}
.article-nav{max-width:740px;margin:40px auto 0;display:flex;justify-content:space-between;gap:14px;border-top:1px solid var(--line);padding-top:20px}
.article-nav a{color:var(--muted);font-size:13px;font-weight:600;text-decoration:none}
.article-nav a:hover{color:var(--green-dark)}
@media(max-width:640px){.blog-grid{grid-template-columns:1fr}.article-meta{flex-direction:column;gap:4px}}

/* ============ Mobile interface polish ============ */
/* crisper taps: no gray flash, no 300ms double-tap-zoom delay */
button,a,.nav-tab,.tabbar-btn,.live-filter,.tokens-filter,.rv-btn,.wanted-scan,.live-scan,.tc-cta{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
@media(max-width:720px){
  /* the tab bar is ~61px tall (54 min + padding) — 58px clearance left widgets
     overlapping it by a few px. Give everything the true height + breathing room. */
  body{padding-bottom:calc(66px + env(safe-area-inset-bottom))}
  .live-widget,.swap-widget{margin-bottom:calc(62px + env(safe-area-inset-bottom))}
  /* iOS zooms the page when a focused input's font is under 16px — never let one be */
  input,select,textarea{font-size:16px!important}
  /* smooth momentum scrolling inside docked sheets */
  .lw-body,.live-feed{-webkit-overflow-scrolling:touch}
  /* comfortable one-thumb hit areas on list actions */
  .rv-btn,.wanted-scan,.tokens-filter,.live-filter{min-height:40px}
  .tokens-sort{min-height:40px}
  /* section headings scale down gracefully */
  .revoke-head h2,.wanted-head h2,.tokens-head h2,.swap-page-head h2{font-size:clamp(24px,7vw,30px)}
  .revoke-head p,.wanted-head p,.tokens-head p,.swap-page-head p{font-size:13.5px}
  /* keep the revoke summary bar tidy on narrow screens */
  .revoke-bar{flex-direction:column;align-items:stretch;gap:10px}
  .revoke-bar .secondary{width:100%}
  .revoke-stats{justify-content:center}
  /* wanted rows: full-width re-scan buttons for thumbs */
  .wanted-scan{padding:9px 16px}
}
@media(max-width:720px) and (min-width:561px){
  .live-widget,.swap-widget{margin-bottom:calc(62px + env(safe-area-inset-bottom))}
}

/* share row under Copy report link */
.share-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
.share-btn{margin-top:0!important;padding:11px 6px;font-size:13px;white-space:nowrap}
.share-btn:hover{border-color:var(--green-dark);color:var(--green-dark)}

/* live feed auto-scan badge + capability chips */
.lqc{font:700 9px "DM Sans";letter-spacing:.05em;border-radius:999px;padding:2px 7px;margin-left:7px;vertical-align:1px;text-transform:uppercase}
.lqc-scanning{background:var(--hair);color:var(--muted);animation:lqcPulse 1.2s ease-in-out infinite}
@keyframes lqcPulse{50%{opacity:.45}}
.lqc-clear{background:#d9f2e2;color:#116932}
.lqc-caution{background:#f6efc0;color:#6d5c00}
.lqc-risky{background:#fde8c8;color:#8a5a00}
.lqc-honeypot{background:#fbd3d0;color:#b3261e}
.lqc-rug{background:#b3261e;color:#fff}
.lqc-flags{display:inline-flex;gap:4px;margin-left:8px}
.lqc-flags i{font:600 10px ui-monospace,monospace;font-style:normal;color:#8a5a00;background:#fff6e8;border:1px solid #eed49f;border-radius:5px;padding:1px 5px}
@media(prefers-reduced-motion:reduce){.lqc-scanning{animation:none}}

/* swap-page wallet holdings */
.swap-holdings{margin-top:14px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px}
.sh-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.sh-head h3{font:700 15px "Space Grotesk";margin:0}
.sh-refresh{margin-left:auto;border:1px solid var(--line);background:none;border-radius:8px;width:30px;height:30px;cursor:pointer;color:var(--muted)}
.sh-refresh:hover{color:var(--green-dark);border-color:var(--green-dark)}
.sh-row{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:10px 8px;border:0;border-top:1px solid var(--hair);background:none;text-align:left;font:inherit}
.sh-click{cursor:pointer;border-radius:8px}
.sh-click:hover{background:#f3f8f2}
.sh-tok b{font:700 13.5px "Space Grotesk"}
.sh-tok em{font-style:normal;color:var(--muted);font-size:11px;margin-left:8px}
.sh-bal{font:600 13px "DM Sans";white-space:nowrap}
.sh-bal i{font-style:normal;color:var(--muted);font-size:11px}
.sh-bal u{text-decoration:none;color:var(--green-dark);margin-left:8px;font-weight:700}
/* live feed trade button + NEW badge */
.live-trade{border:1px solid var(--green-dark);background:none;color:var(--green-dark);font:700 11px "DM Sans";border-radius:8px;padding:5px 9px;cursor:pointer;white-space:nowrap}
.live-trade:hover{background:var(--green-dark);color:#fff}
.lqc-new{background:#e8edf7;color:#3d5580}

/* relocated, prominent share bar under the report hero */
.share-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 16px;margin:0 0 18px}
.share-bar-label{font:700 13px "Space Grotesk";color:var(--muted)}
.share-bar-btns{display:flex;gap:8px;flex-wrap:wrap}
.share-bar .share-btn{border:1px solid var(--line);background:var(--card);color:var(--ink,#111);
  font:600 13px "DM Sans";border-radius:10px;padding:9px 14px;cursor:pointer;white-space:nowrap;margin:0}
.share-bar .share-btn:hover{border-color:var(--green-dark);color:var(--green-dark)}
.share-bar .primary-btn{background:var(--green);border-color:var(--green);color:#071408}
.share-bar .primary-btn:hover{background:var(--green-dark);border-color:var(--green-dark);color:#fff}
@media(max-width:560px){.share-bar{flex-direction:column;align-items:stretch}.share-bar-btns{justify-content:center}}

/* wallet chooser overlay (mobile deep-link + multi-wallet pick) */
.wc-overlay{position:fixed;inset:0;z-index:200;background:rgba(11,13,14,.55);backdrop-filter:blur(4px);display:grid;place-items:center;padding:20px}
.wc-card{width:min(380px,100%);background:var(--card);border-radius:18px;padding:20px;box-shadow:0 24px 70px rgba(0,0,0,.35)}
.wc-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.wc-head b{font:700 17px "Space Grotesk"}
.wc-x{border:0;background:none;font-size:18px;color:var(--muted);cursor:pointer;line-height:1}
.wc-sub{color:var(--muted);font-size:13px;margin:0 0 12px}
.wc-btn{display:block;width:100%;text-align:center;text-decoration:none;border:1px solid var(--line);background:var(--card);color:var(--ink,#111);font:700 14px "DM Sans";border-radius:12px;padding:13px;margin-bottom:9px;cursor:pointer}
.wc-btn:hover{border-color:var(--green-dark);color:var(--green-dark)}
.wc-or{text-align:center;color:var(--muted);font-size:12px;margin:12px 0}
.wc-note{color:var(--muted);font-size:11.5px;line-height:1.5;margin:8px 0 0}

/* tokens feed refresh button */
.tokens-refresh{border:1px solid var(--line);background:var(--card);border-radius:9px;width:34px;height:34px;cursor:pointer;color:var(--muted);font-size:16px;line-height:1;flex-shrink:0}
.tokens-refresh:hover{color:var(--green-dark);border-color:var(--green-dark)}
.tokens-refresh.spin{animation:tkspin .8s linear infinite}
@keyframes tkspin{to{transform:rotate(360deg)}}

/* share row relocated directly under the score card in the report hero */
.report-score-col{display:flex;flex-direction:column;gap:10px;align-items:stretch}
.report-score-col .share-bar{flex-direction:column;align-items:stretch;gap:6px;padding:10px 12px;margin:0}
.report-score-col .share-bar-label{text-align:center;font:700 10px "DM Sans";letter-spacing:.1em;text-transform:uppercase}
.report-score-col .share-bar-btns{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.report-score-col .share-bar .share-btn{padding:9px 0;font-size:15px;min-width:0;border-radius:9px}
@media(max-width:470px){.report-score-col .share-bar-btns{grid-template-columns:repeat(5,1fr)}}

/* global Connect button in the header */
.nav-connect{border:1px solid var(--green-dark);background:var(--green);color:#071408;font:700 13px "DM Sans";border-radius:999px;padding:9px 16px;cursor:pointer;white-space:nowrap}
.nav-connect:hover{background:var(--green-dark);color:#fff}
.nav-connect.connected{background:var(--card);color:var(--green-dark);font-family:ui-monospace,monospace;font-size:12px}
.nav-connect:disabled{opacity:.6;cursor:wait}
.wc-btn.ghost-btn{background:var(--fill);font-weight:600}
@media(max-width:470px){.nav-connect{padding:8px 12px;font-size:12px}}

/* experimental V4 buy panel */
.v4beta{display:flex;flex-direction:column;gap:12px}
.v4beta-badge{align-self:flex-start;font:800 11px "DM Sans";letter-spacing:.08em;color:#5f2ba5;background:#efe3fb;border:1px solid #d9c2f5;border-radius:999px;padding:5px 12px}
.v4beta-warn{font-size:13px;line-height:1.55;color:#6b581d;background:#fff8e6;border:1px solid #f0d797;border-radius:10px;padding:12px 14px;margin:0}
.v4-lbl{font:700 11px "DM Sans";letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.v4-input{border:1px solid #cbd3cf;background:var(--fill);border-radius:10px;padding:15px 14px;font:600 18px "DM Sans";outline:none}
.v4-input:focus{border-color:var(--green-dark);box-shadow:0 0 0 3px #dcf8dd}
.v4-slip{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.v4beta-btn{border:0;background:linear-gradient(135deg,#7b3ff2,#5f2ba5);color:#fff;font:700 15px "DM Sans";border-radius:12px;padding:15px;cursor:pointer}
.v4beta-btn:hover{filter:brightness(1.08)}
.v4beta-btn:disabled{opacity:.6;cursor:wait}
.v4-foot{font-size:11px;color:var(--muted);margin:0}

/* ============ Navbar & nav UX polish (PC + mobile) ============ */
/* Three zones: brand (left) · primary nav (centre) · utilities (right). The
   primary nav is now a direct child of .nav, not buried in .nav-right, so it can
   sit centred and the wallet/theme/network controls cluster on the right. */
.nav{height:70px;gap:16px}
.nav-primary{margin-inline:auto}          /* pushes utilities to the far right */
.nav-right{gap:10px}
/* a hairline before the wallet controls separates "where am I" from "my account" */
.nav-sep{width:1px;height:22px;background:var(--line);margin:0 2px;flex:none}
.nav-live-txt{margin-left:2px}
@media(max-width:1080px){
  /* tighten before anything is dropped */
  .nav{gap:10px}
  .nav-tab{padding:8px 12px}
  .nav-sep{display:none}
}
/* segmented primary nav — tighter, with an unmistakable active state */
.nav-primary{background:#f1f3f5;padding:4px;gap:2px;border:1px solid #e8ebee;border-radius:12px}
.nav-tab{padding:8px 15px;font:600 13.5px "DM Sans";color:var(--muted);border-radius:9px;transition:background .15s,color .15s}
.nav-tab:hover{color:var(--ink);background:rgba(255,255,255,.55)}
.nav-tab.active{background:var(--card);color:var(--green-dark);font-weight:700;box-shadow:0 1px 5px rgba(16,24,32,.12)}
/* compact, calmer network badge */
.network{font:600 12px "DM Sans";padding:7px 11px;border-radius:999px;background:var(--fill);border-color:#e8ebee;color:var(--muted)}
.network span{color:#9aa0a6;margin-left:6px}
/* Connect — the primary action, gets a subtle lift so it reads as the CTA */
.nav-connect{padding:10px 18px;font-size:13px;box-shadow:0 3px 10px rgba(0,200,5,.28);transition:transform .12s,box-shadow .15s,background .15s}
.nav-connect:hover{transform:translateY(-1px)}
.nav-connect.connected{box-shadow:none}
/* Live pill — quieter, consistent with the network badge */
.nav-live-link{background:var(--fill);border:1px solid #e8ebee;border-radius:999px;font-size:12.5px}
.nav-live-link:hover{background:var(--chipbg)}
.nav-live-link .live-dot{background:var(--green);box-shadow:0 0 0 3px rgba(0,200,5,.18)}

/* mobile: shorter top bar + a clear "you are here" cue on the bottom tab bar */
@media(max-width:720px){
  .nav{height:56px}
  .tabbar-btn{position:relative}
  .tabbar-btn.active{color:var(--green-dark)}
  .tabbar-btn.active::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:24px;height:3px;border-radius:0 0 4px 4px;background:var(--green-dark)}
  .tabbar-btn.active svg{stroke-width:2.2}
}
/* keep the top Connect reachable on small screens */
@media(max-width:400px){.nav-connect{padding:8px 13px}.brand em{display:none}}

/* share-card preview modal (mobile-safe: image is always visible + long-press-save) */
.cp-overlay{position:fixed;inset:0;z-index:210;background:rgba(11,13,14,.62);backdrop-filter:blur(4px);display:grid;place-items:center;padding:18px;overflow:auto}
.cp-card{width:min(520px,100%);background:var(--card);border-radius:18px;padding:16px;box-shadow:0 24px 70px rgba(0,0,0,.4);position:relative}
.cp-x{position:absolute;top:10px;right:12px;border:0;background:rgba(255,255,255,.85);width:30px;height:30px;border-radius:999px;font-size:16px;color:var(--muted);cursor:pointer;line-height:1;z-index:2}
.cp-img{display:block;width:100%;height:auto;border-radius:12px;border:1px solid var(--line)}
.cp-hint{text-align:center;color:var(--muted);font-size:12.5px;margin:12px 0 10px}
.cp-btns{display:flex;gap:10px}
.cp-btn{flex:1;border:1px solid var(--line);background:var(--card);color:var(--ink,#111);font:700 14px "DM Sans";border-radius:12px;padding:13px;cursor:pointer}
.cp-btn:hover{border-color:var(--green-dark);color:var(--green-dark)}
.cp-btn.primary-btn{background:var(--green);border-color:var(--green);color:#071408}
.cp-btn.primary-btn:hover{background:var(--green-dark);border-color:var(--green-dark);color:#fff}

/* ============ Official token band ============ */
/* radius must track .ot-inner: the hover glow is hosted here (.ot-inner::after
   is already taken by the lime radial) and inherits this border-radius, so a
   mismatch draws a hard-cornered glow around the rounded card. */
.ot-band{margin:8px auto 40px;border-radius:20px}
/* Official token promo is a landing-page-only surface: it tracks .hero's own
   hidden class via sibling selector (both are direct <main> children in that
   order), so it disappears on every report/Tokens/Swap/Wanted/Revoke view
   without needing every hero-toggle call site in app.js to also know about it. */
.hero.hidden ~ .ot-band{display:none}
.ot-inner{display:flex;justify-content:space-between;align-items:center;gap:26px;flex-wrap:wrap;
  background:linear-gradient(135deg,#0b0d0e,#141a12);border-radius:20px;padding:26px 30px;
  box-shadow:0 20px 60px -24px rgba(204,255,0,.4);border:1px solid #1e2a18;position:relative;overflow:hidden}
.ot-inner::after{content:"";position:absolute;right:-60px;top:-60px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,rgba(204,255,0,.16),transparent 68%);pointer-events:none}
.ot-left{min-width:260px;flex:1;position:relative;z-index:1}
.ot-badge{font:800 10px "DM Sans";letter-spacing:.14em;color:#ccff00;background:rgba(204,255,0,.12);border:1px solid rgba(204,255,0,.3);border-radius:999px;padding:5px 11px}
.ot-left h2{font:700 30px "Space Grotesk";color:#fff;margin:12px 0 6px}
.ot-left h2 small{font:600 14px "DM Sans";color:#9aa79a;letter-spacing:0}
.ot-left p{color:#c2ccc0;font-size:14px;line-height:1.55;margin:0 0 14px;max-width:440px}
.ot-addr{font:600 13px ui-monospace,monospace;color:#ccff00;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:9px;padding:9px 13px;cursor:pointer}
.ot-addr span{color:#9aa79a;margin-left:8px;font-family:"DM Sans"}
.ot-addr:hover{border-color:rgba(204,255,0,.4)}
.ot-right{position:relative;z-index:1;display:flex;flex-direction:column;gap:14px;min-width:230px}
.ot-stats{display:flex;gap:22px;flex-wrap:wrap}
.ot-stats div{display:flex;flex-direction:column}
.ot-stats b{font:700 20px "Space Grotesk";color:#fff}
.ot-stats b.pos{color:#4ade80}.ot-stats b.neg{color:#f87171}
.ot-stats span{color:#8b968a;font-size:11px;margin-top:2px}
.ot-loading{color:#8b968a;font-size:13px}
.ot-cta{display:flex;gap:10px}
.ot-scan,.ot-buy{border:0;border-radius:11px;font:700 14px "DM Sans";padding:13px 18px;cursor:pointer;white-space:nowrap;flex:1}
.ot-scan{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.16)}
.ot-scan:hover{background:rgba(255,255,255,.18)}
.ot-buy{background:#ccff00;color:#0b0d0e}
.ot-buy:hover{background:#b7e600}
@media(max-width:640px){.ot-inner{padding:22px}.ot-left h2{font-size:24px}.ot-right{width:100%}.ot-cta{width:100%;flex-direction:column}.ot-scan,.ot-buy{width:100%}}

/* ============================================================
   THEME SYSTEM — light (default) + dark
   Surfaces/text/hairlines are tokenized, so dark is a palette
   swap plus targeted fixes for the pale status tints, which do
   not survive a straight inversion.
   ============================================================ */
:root[data-theme="dark"]{
  --ink:#e9eef1;--muted:#8c969d;--line:#242b30;--paper:#0a0c0d;--white:#12171a;
  --card:#12171a;--fill:#0e1315;--hair:#1d2429;--chipbg:#1a2126;
  --green-dark:#b6e400;--red:#ff6b6f;--amber:#ffb340;
  /* inverted surfaces genuinely invert: a black-on-white pill becomes white-on-black */
  --invert:#e9eef1;--invert-ink:#0a0c0d;
  color-scheme:dark;
}
/* these rules hardcode color:#fff against the (now inverted) surface */
:root[data-theme="dark"] .chip-btn.active,
:root[data-theme="dark"] .nav-btn,
:root[data-theme="dark"] .live-btn.primary,
:root[data-theme="dark"] .live-filter.active,
:root[data-theme="dark"] .lf-launch-btn,
:root[data-theme="dark"] .wanted-scan,
:root[data-theme="dark"] .article-callout a{color:var(--invert-ink)}
/* Inverting small pills reads as deliberate; inverting a full-width BAR just
   looks like a bug. The live-widget header stays a raised dark bar in dark. */
:root[data-theme="dark"] .lw-header{background:#171d21;color:var(--ink);border-bottom:1px solid var(--line)}
:root[data-theme="dark"] .lw-chev{color:var(--muted)}
/* translucent white bars: frosted glass has to be frosted *dark* here */
:root[data-theme="dark"] .tabbar{background:rgba(14,19,21,.92);box-shadow:0 -8px 30px -18px rgba(0,0,0,.8)}
:root[data-theme="dark"] .nav-tab:hover{background:rgba(255,255,255,.07)}
:root[data-theme="dark"] .cp-x{background:rgba(30,36,40,.9);color:var(--ink)}
/* dark cards that would vanish against a dark page: raise them instead */
:root[data-theme="dark"] .eco-stat.accent,
:root[data-theme="dark"] .launch-preview,
:root[data-theme="dark"] .blog-cta{background:#171d21;border:1px solid var(--line)}
:root[data-theme="dark"] .eco-live{background:rgba(182,228,0,.12);border-color:rgba(182,228,0,.3)}
/* pale status tints -> luminous-on-dark equivalents */
:root[data-theme="dark"] .finding.danger i{background:rgba(255,107,111,.14);color:var(--red)}
:root[data-theme="dark"] .finding.warn i{background:rgba(255,179,64,.14);color:var(--amber)}
:root[data-theme="dark"] .finding.good i{background:rgba(182,228,0,.14);color:var(--green-dark)}
:root[data-theme="dark"] .finding.unknown i{background:var(--hair);color:var(--muted)}
:root[data-theme="dark"] .notice{background:rgba(255,179,64,.09);border-color:rgba(255,179,64,.28);color:#f0cf94}
:root[data-theme="dark"] .brand em{background:rgba(182,228,0,.15);color:var(--green-dark)}
:root[data-theme="dark"] .max-btn{background:rgba(182,228,0,.13)}
:root[data-theme="dark"] .max-btn:hover{background:var(--green-dark);color:#0a0c0d}
:root[data-theme="dark"] .network i{box-shadow:0 0 0 3px rgba(0,200,5,.18)}
:root[data-theme="dark"] .input-row input:focus{box-shadow:0 0 0 3px rgba(182,228,0,.22)}
:root[data-theme="dark"] .scanner{box-shadow:0 18px 60px rgba(0,0,0,.5)}
:root[data-theme="dark"] .score-card.warn strong{color:var(--amber)}
:root[data-theme="dark"] .score-card.unknown strong{color:#95a0ad}
:root[data-theme="dark"] .impact.warn{color:var(--amber)}
:root[data-theme="dark"] img.loader-img,:root[data-theme="dark"] .brand-mark{filter:none}

/* theme toggle */
.theme-toggle{display:grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid var(--line);
  background:var(--card);color:var(--ink);border-radius:10px;cursor:pointer;line-height:1;font-size:15px;
  transition:border-color .2s,transform .15s}
.theme-toggle:hover{border-color:var(--green-dark);transform:translateY(-1px)}
.theme-toggle:focus-visible{outline:2px solid var(--green-dark);outline-offset:2px}
.theme-toggle .ico-sun{display:none}
:root[data-theme="dark"] .theme-toggle .ico-sun{display:block}
:root[data-theme="dark"] .theme-toggle .ico-moon{display:none}
@media(max-width:470px){.theme-toggle{width:34px;height:34px;font-size:13px}}

/* ============================================================
   DOTFIELD — interactive hero background (vanilla canvas port)
   Sits behind the hero; pointer-events:none so it never eats a
   tap on the scan input. Colors come from the theme via JS.
   ============================================================ */



.hero{position:relative}
/* lift hero content above the canvas, but never restyle the canvas layer itself */



/* ============================================================
   BORDERGLOW — cursor-tracked edge glow (vanilla port)
   The glow angle/proximity are written as CSS vars by JS.
   ============================================================ */
.bglow{--edge-proximity:0;--cursor-angle:45deg;--edge-sensitivity:30;--glow-rgb:0,200,5;
  position:relative;isolation:isolate}
.bglow::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;z-index:2;
  opacity:calc((var(--edge-proximity) - var(--edge-sensitivity)) / (100 - var(--edge-sensitivity)));
  transition:opacity .3s ease-out;
  mask-image:conic-gradient(from var(--cursor-angle) at center,black 2.5%,transparent 12%,transparent 88%,black 97.5%);
  -webkit-mask-image:conic-gradient(from var(--cursor-angle) at center,black 2.5%,transparent 12%,transparent 88%,black 97.5%);
  box-shadow:inset 0 0 0 1px rgba(var(--glow-rgb),.9),inset 0 0 6px 0 rgba(var(--glow-rgb),.45),
    inset 0 0 16px 0 rgba(var(--glow-rgb),.25),0 0 8px 0 rgba(var(--glow-rgb),.35),0 0 22px 2px rgba(var(--glow-rgb),.16)}
.bglow:not(:hover)::after{opacity:0;transition:opacity .6s ease-in-out}
.score-card.high.bglow{--glow-rgb:229,72,77}
.score-card.warn.bglow{--glow-rgb:245,166,35}
.score-card.low.bglow{--glow-rgb:0,200,5}
@media(prefers-reduced-motion:reduce){.bglow::after{display:none}}
/* blog: pale tint chip needs the same dark treatment as the app's tints */
:root[data-theme="dark"] .blog-tag{background:rgba(182,228,0,.14)}
/* blog callout: pale green panel -> luminous-on-dark */
:root[data-theme="dark"] .article-callout{background:rgba(182,228,0,.09);border-color:rgba(182,228,0,.26)}
:root[data-theme="dark"] .article-callout p{color:#c7d9a3}

/* ============================================================
   OFFICIAL TOKEN CARD — light-mode variant
   The .ot-* block is authored for a dark card (color:#fff, white
   alpha chips, lime-on-black). On a light page that renders as a
   black slab, so light mode gets a proper inverted treatment
   rather than the dark card bleeding through.
   ============================================================ */
:root[data-theme="light"] .ot-inner{
  background:linear-gradient(135deg,#ffffff,#f4faea);
  border:1px solid #dfe8d2;
  box-shadow:0 18px 50px -26px rgba(88,112,0,.35)}
:root[data-theme="light"] .ot-inner::after{
  background:radial-gradient(circle,rgba(88,112,0,.10),transparent 68%)}
:root[data-theme="light"] .ot-badge{
  color:var(--green-dark);background:rgba(88,112,0,.10);border-color:rgba(88,112,0,.28)}
:root[data-theme="light"] .ot-left h2{color:var(--ink)}
:root[data-theme="light"] .ot-left h2 small{color:var(--muted)}
:root[data-theme="light"] .ot-left p{color:var(--muted)}
:root[data-theme="light"] .ot-addr{
  color:var(--green-dark);background:rgba(11,13,14,.04);border-color:rgba(11,13,14,.12)}
:root[data-theme="light"] .ot-addr span{color:var(--muted)}
:root[data-theme="light"] .ot-addr:hover{border-color:rgba(88,112,0,.45)}
:root[data-theme="light"] .ot-stats b{color:var(--ink)}
:root[data-theme="light"] .ot-stats b.pos{color:var(--green-dark)}
:root[data-theme="light"] .ot-stats b.neg{color:var(--red)}
:root[data-theme="light"] .ot-stats span{color:var(--muted)}
:root[data-theme="light"] .ot-scan{
  background:rgba(11,13,14,.04);color:var(--ink);border:1px solid rgba(11,13,14,.14)}
:root[data-theme="light"] .ot-scan:hover{background:rgba(11,13,14,.09)}

/* ===== auto-generated: pale tints -> dark-mode washes ===== */
:root[data-theme="dark"] .brand em{background:rgba(223,249,220,.13)}
:root[data-theme="dark"] .notice{background:rgba(255,248,230,.13);border-color:rgba(255,248,230,.3);color:hsl(45 57% 74%)}
:root[data-theme="dark"] .finding.danger i{background:rgba(254,231,229,.13)}
:root[data-theme="dark"] .finding.warn i{background:rgba(255,242,213,.13);color:hsl(42 100% 74%)}
:root[data-theme="dark"] .finding.good i{background:rgba(228,249,226,.13)}
:root[data-theme="dark"] .notice.high{background:rgba(253,236,235,.13);border-color:rgba(253,236,235,.3);color:hsl(4 70% 74%)}
:root[data-theme="dark"] .notice.unknown{background:rgba(238,241,246,.13);border-color:rgba(238,241,246,.3);color:var(--muted)}
:root[data-theme="dark"] .finding.info i{background:rgba(233,238,247,.13);color:hsl(220 40% 74%)}
:root[data-theme="dark"] .dep-score.low{background:rgba(228,249,226,.13)}
:root[data-theme="dark"] .dep-score.warn{background:rgba(255,242,213,.13);color:hsl(42 100% 74%)}
:root[data-theme="dark"] .dep-score.high{background:rgba(254,231,229,.13)}
:root[data-theme="dark"] .chip.low{background:rgba(228,249,226,.13)}
:root[data-theme="dark"] .chip.warn{background:rgba(255,242,213,.13);color:hsl(42 100% 74%)}
:root[data-theme="dark"] .chip.high{background:rgba(254,231,229,.13)}
:root[data-theme="dark"] .dep-overlap{background:rgba(253,236,235,.13);border-color:rgba(253,236,235,.3);color:hsl(4 70% 74%)}
:root[data-theme="dark"] .swap-gate{background:rgba(255,248,230,.13);border-color:rgba(255,248,230,.3)}
:root[data-theme="dark"] .swap-gate.high{background:rgba(253,236,235,.13);border-color:rgba(253,236,235,.3)}
:root[data-theme="dark"] .swap-tabs{background:rgba(241,243,240,.13)}
:root[data-theme="dark"] .max-btn{background:rgba(232,251,230,.13)}
:root[data-theme="dark"] .brand em{background:rgba(239,255,192,.13);color:hsl(73 100% 74%)}
:root[data-theme="dark"] .buyer.flag{background:rgba(253,236,235,.13);border-color:rgba(253,236,235,.3);color:hsl(4 70% 74%)}
:root[data-theme="dark"] .revoke-btn{background:rgba(253,236,235,.13);color:hsl(3 60% 74%)}
:root[data-theme="dark"] .ctr-badge.ok{background:rgba(232,251,230,.13)}
:root[data-theme="dark"] .ctr-badge.no{background:rgba(241,243,240,.13)}
:root[data-theme="dark"] .eco-live{background:rgba(238,251,230,.13);border-color:rgba(238,251,230,.3)}
:root[data-theme="dark"] .live-btn.on{background:rgba(238,251,230,.13);border-color:rgba(238,251,230,.3)}
:root[data-theme="dark"] .econ-liqwarn{background:rgba(253,236,235,.13);border-color:rgba(253,236,235,.3);color:hsl(4 70% 74%)}
:root[data-theme="dark"] .lw-icon.on{background:rgba(238,251,230,.13);border-color:rgba(238,251,230,.3)}
:root[data-theme="dark"] .wanted-kind.deployer{background:rgba(253,236,235,.13);color:hsl(4 70% 74%)}
:root[data-theme="dark"] .wanted-kind.contract{background:rgba(255,242,213,.13);color:hsl(42 100% 74%)}
:root[data-theme="dark"] .wanted-reasons span{background:rgba(253,236,235,.13);color:hsl(4 70% 74%)}
:root[data-theme="dark"] .tc-badge.funded{background:rgba(228,249,226,.13)}
:root[data-theme="dark"] .tc-badge.empty{background:rgba(240,242,240,.13);color:var(--muted)}
:root[data-theme="dark"] .tc-bar{background:rgba(238,241,238,.13)}
:root[data-theme="dark"] .tc-dev.ok{background:rgba(228,249,226,.13)}
:root[data-theme="dark"] .tc-dev.bad{background:rgba(254,231,229,.13)}
:root[data-theme="dark"] .tc-dev.warn{background:rgba(255,242,213,.13);color:hsl(42 100% 74%)}
:root[data-theme="dark"] .tc-dev.mid{background:rgba(240,242,240,.13);color:var(--muted)}
:root[data-theme="dark"] .wanted-src{background:rgba(238,242,255,.13);color:hsl(232 44% 74%)}
:root[data-theme="dark"] .wanted-src.mine{background:rgba(228,249,226,.13)}
:root[data-theme="dark"] .sc-hint{background:rgba(232,235,232,.13);color:var(--muted)}
:root[data-theme="dark"] /* clean-token launch preview */ .clean-token{background:rgba(247,251,239,.13);border-color:rgba(247,251,239,.3)}
:root[data-theme="dark"] /* economics source tags */ .econ-cell b .src{background:rgba(240,242,240,.13)}
:root[data-theme="dark"] .buyers .buyer.flag{background:rgba(254,231,229,.13);border-color:rgba(254,231,229,.3);color:hsl(3 57% 74%)}
:root[data-theme="dark"] .tc-venue{background:rgba(238,242,255,.13);color:hsl(232 44% 74%)}
:root[data-theme="dark"] .live-venue{background:rgba(238,242,255,.13);color:hsl(232 44% 74%)}
:root[data-theme="dark"] .swap-title-img{background:rgba(238,242,239,.13)}
:root[data-theme="dark"] /* active load-screen progress */ .loading-bar-track{background:rgba(230,232,234,.13)}
:root[data-theme="dark"] /* real token logos on explorer cards */ .tc-avatar.has-img{background:rgba(238,242,239,.13)}
:root[data-theme="dark"] .rv-chip-critical{background:rgba(251,211,208,.13);color:hsl(3 71% 74%)}
:root[data-theme="dark"] .rv-chip-high{background:rgba(253,232,200,.13);color:hsl(39 100% 74%)}
:root[data-theme="dark"] .rv-chip-medium{background:rgba(246,239,192,.13);color:hsl(51 100% 74%)}
:root[data-theme="dark"] .rv-chip-low{background:rgba(229,236,231,.13);color:var(--muted)}
:root[data-theme="dark"] .rv-chip-info{background:rgba(217,242,226,.13);color:hsl(143 72% 74%)}
:root[data-theme="dark"] .rv-chip-unl{background:rgba(239,227,251,.13);color:hsl(266 59% 74%)}
:root[data-theme="dark"] .rv-chip-idle{background:rgba(232,232,232,.13)}
:root[data-theme="dark"] .wanted-src.auto{background:rgba(253,232,200,.13);color:hsl(39 100% 74%)}
:root[data-theme="dark"] .blog-tag{background:rgba(238,251,230,.13)}
:root[data-theme="dark"] .article-callout{background:rgba(238,251,230,.13);border-color:rgba(238,251,230,.3)}
:root[data-theme="dark"] .lqc-clear{background:rgba(217,242,226,.13);color:hsl(143 72% 74%)}
:root[data-theme="dark"] .lqc-caution{background:rgba(246,239,192,.13);color:hsl(51 100% 74%)}
:root[data-theme="dark"] .lqc-risky{background:rgba(253,232,200,.13);color:hsl(39 100% 74%)}
:root[data-theme="dark"] .lqc-honeypot{background:rgba(251,211,208,.13);color:hsl(3 71% 74%)}
:root[data-theme="dark"] .lqc-flags i{background:rgba(255,246,232,.13);border-color:rgba(255,246,232,.3);color:hsl(39 100% 74%)}
:root[data-theme="dark"] .sh-click:hover{background:rgba(243,248,242,.13)}
:root[data-theme="dark"] .lqc-new{background:rgba(232,237,247,.13);color:hsl(219 40% 74%)}
:root[data-theme="dark"] .v4beta-badge{background:rgba(239,227,251,.13);border-color:rgba(239,227,251,.3);color:hsl(266 59% 74%)}
:root[data-theme="dark"] .v4beta-warn{background:rgba(255,248,230,.13);border-color:rgba(255,248,230,.3);color:hsl(45 57% 74%)}
:root[data-theme="dark"] /* segmented primary nav — tighter, with an unmistakable active state */ .nav-primary{background:rgba(241,243,245,.13);border-color:rgba(241,243,245,.3)}

/* ===== contrast fixes (both themes) =====
   These sit after the generated washes so they win. Several are pre-existing
   light-mode failures (amber/red on white), not dark-mode regressions. */
/* muted chip text: one var serves both themes (darker on light, lighter on dark) */
.chip.muted{color:var(--muted)}
.tc-badge.empty{color:var(--muted)}
/* amber/red on light surfaces needs to be darker than the brand tones */
:root[data-theme="light"] .impact.warn{color:#8a5a00}
:root[data-theme="light"] .impact.high{color:#c62a2f}
:root[data-theme="light"] .dep-score.high{color:#a81f24}
:root[data-theme="light"] .finding.warn i{color:#7a5600}
:root[data-theme="light"] .dep-score.warn{color:#7a5600}
/* verdict label: #9a6d00 is tuned for a white card and goes muddy on a dark one */
:root[data-theme="dark"] .score-card.warn #verdict{color:var(--amber)}
:root[data-theme="dark"] .chip.warn{color:var(--amber)}
:root[data-theme="dark"] .wanted-kind.contract{color:var(--amber)}
:root[data-theme="dark"] .tc-dev.warn{color:var(--amber)}

/* ===== hover states on inverted surfaces =====
   These buttons are dark-on-light normally, so :hover{background:#000} reads as
   "go darker". In dark mode the base surface is INVERTED to near-white with
   dark text, so the same hover turned them black-on-black — the button
   vanished under the cursor. In dark, hover must brighten instead. */
:root[data-theme="dark"] .nav-btn:hover,
:root[data-theme="dark"] .lf-launch-btn:hover,
:root[data-theme="dark"] .wanted-scan:hover,
:root[data-theme="dark"] .article-callout a:hover{background:#ffffff;color:var(--invert-ink)}
/* lime "ready" state is brand-correct in both themes — keep it */
:root[data-theme="dark"] .lf-launch-btn.ready:hover{background:#b7e600;color:#0a0c0d}
/* light-grey hover borders read as glare on dark controls */
:root[data-theme="dark"] .live-btn:hover,
:root[data-theme="dark"] .live-filter:hover{border-color:var(--muted)}

/* ===== accent hovers =====
   `:hover{background:var(--green-dark);color:#fff}` was written for the light
   palette, where --green-dark is a dark olive. In dark that var flips to bright
   lime, so white text landed on lime at ~1.5:1. Keep the lime, darken the text. */
:root[data-theme="dark"] .max-btn:hover,
:root[data-theme="dark"] .revoke-connect .primary:hover,
:root[data-theme="dark"] .live-trade:hover,
:root[data-theme="dark"] .share-bar .primary-btn:hover,
:root[data-theme="dark"] .nav-connect:hover,
:root[data-theme="dark"] .cp-btn.primary-btn:hover{background:var(--green-dark);color:#0a0c0d}

/* ============================================================
   SPOTLIGHT — vanilla port of React Bits SpotlightCard.
   Mechanics only: the upstream component also hardcodes its own
   #111 background / #222 border / 2rem padding, which would fight
   our card system, so we take just the cursor-tracked radial.
   Applied to the card GRIDS (tokens, blog, eco stats) — the panels
   and score card already carry the BorderGlow, and doubling the two
   effects on one card reads as noise.
   ============================================================ */
.spotlight{position:relative;overflow:hidden;--mouse-x:50%;--mouse-y:50%;
  --spotlight-color:rgba(11,13,14,.07)}
:root[data-theme="dark"] .spotlight{--spotlight-color:rgba(204,255,0,.14)}
.spotlight::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  border-radius:inherit;
  background:radial-gradient(circle at var(--mouse-x) var(--mouse-y),var(--spotlight-color),transparent 80%);
  opacity:0;transition:opacity .45s ease}
.spotlight:hover::before,.spotlight:focus-within::before{opacity:1}
/* lift card content above the radial so the spotlight washes the surface,
   not the text (upstream lets it tint the copy) */
.spotlight > *{position:relative;z-index:1}
@media(prefers-reduced-motion:reduce){.spotlight::before{transition:none}}

/* ============================================================
   TRADING TERMINAL — watchlist, portfolio, price alerts.
   Built entirely from existing tokens (--card/--line/--hair/--muted/
   --green-dark) so it inherits both themes without a separate
   light/dark pass, and reuses .chip for status badges.
   ============================================================ */
.terminal .swap-page-head p{max-width:640px}
.term-tabs{display:flex;gap:6px;margin:22px 0 18px;overflow-x:auto}
.term-tab{border:0;background:none;border-radius:999px;padding:9px 16px;font:700 13px "DM Sans";color:var(--muted);cursor:pointer;white-space:nowrap}
.term-tab:hover{color:var(--ink)}
.term-tab.active{background:var(--card);color:var(--green-dark);box-shadow:0 1px 0 var(--line) inset,0 4px 14px -8px rgba(0,0,0,.25);border:1px solid var(--line)}
.term-add-row{display:flex;gap:10px;margin-bottom:14px}
.term-add-row input{min-width:0;flex:1;border:1px solid var(--line);background:var(--fill);border-radius:10px;padding:13px 14px;font:500 14px "DM Sans";color:var(--ink);outline:none}
.term-add-row input:focus{border-color:var(--green-dark)}
.term-grid{display:grid;grid-template-columns:380px 1fr;gap:20px;align-items:start}
.term-list-col{min-width:0}
.term-row{display:flex;align-items:center;gap:12px;width:100%;padding:13px;border:1px solid var(--line);background:var(--card);border-radius:13px;margin-bottom:8px;cursor:pointer;text-align:left;font:inherit;transition:border-color .15s}
.term-row:hover{border-color:var(--green-dark)}
.term-row.active{border-color:var(--green-dark);box-shadow:0 0 0 1px var(--green-dark) inset}
.term-row-main{min-width:0;flex:1}
.term-row-sym{font:700 14px "Space Grotesk";display:block}
.term-row-addr{color:var(--muted);font-size:11px;font-family:ui-monospace,monospace}
.term-row-stats{text-align:right;white-space:nowrap}
.term-row-price{font:700 13px "DM Sans";display:block}
.term-row-chg{font-size:11px;font-weight:700}
.term-row-chg.pos{color:var(--green-dark)}
.term-row-chg.neg{color:var(--red)}
.term-row-rm{border:0;background:none;color:var(--muted);font-size:16px;line-height:1;cursor:pointer;padding:4px}
.term-row-rm:hover{color:var(--red)}
.term-detail{min-height:260px}
.term-empty{color:var(--muted);font-size:14px;text-align:center;padding:60px 20px}
.term-detail-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px;flex-wrap:wrap}
.term-detail-head h3{font:700 22px "Space Grotesk";margin:0}
.term-detail-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:14px;margin:16px 0 22px;padding:16px 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.term-detail-stats div{display:flex;flex-direction:column;gap:3px}
.term-detail-stats b{font:700 16px "Space Grotesk"}
.term-detail-stats span{color:var(--muted);font-size:11px}
.term-detail-actions{display:flex;gap:10px;margin-bottom:22px}
.term-alert-form{background:var(--fill);border:1px solid var(--line);border-radius:13px;padding:16px;margin-bottom:18px}
.term-alert-form h4{margin:0 0 12px;font:700 13px "DM Sans"}
.term-alert-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.term-alert-row select,.term-alert-row input{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:9px;padding:9px 11px;font:500 13px "DM Sans"}
.term-alert-row input{width:120px}
.term-order-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 0;border-top:1px solid var(--hair)}
.term-order-row:first-child{border-top:0}
.term-order-main{min-width:0}
.term-order-main b{font-size:13px}
.term-order-main span{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.term-order-actions{display:flex;gap:6px;align-items:center}
.term-order-fire{border:0;background:var(--green-dark);color:#fff;font:700 11px "DM Sans";border-radius:7px;padding:6px 10px;cursor:pointer}
:root[data-theme="dark"] .term-order-fire{color:#0a0c0d}
.term-order-cancel{border:0;background:none;color:var(--muted);font-size:15px;line-height:1;cursor:pointer;padding:4px}
.term-order-cancel:hover{color:var(--red)}
.term-disclaimer{display:flex;gap:8px;align-items:flex-start;background:var(--fill);border:1px solid var(--line);border-radius:11px;padding:12px 14px;color:var(--muted);font-size:12px;line-height:1.5;margin-bottom:16px}
.term-portfolio-total{font:700 28px "Space Grotesk";margin:0 0 4px}
.term-portfolio-sub{color:var(--muted);font-size:12px;margin:0 0 18px}
@media(max-width:900px){.term-grid{grid-template-columns:1fr}}
@media(max-width:640px){.term-tabs{margin:16px 0 12px}.term-add-row{flex-direction:column}.term-add-row button{width:100%}}

.report-track{margin-left:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:700 13px "DM Sans";border-radius:8px;padding:8px 14px;cursor:pointer;vertical-align:2px}
.report-track:hover{border-color:var(--green-dark);color:var(--green-dark)}
.report-track.tracked{border-color:var(--green-dark);color:var(--green-dark);background:rgba(0,200,5,.08)}
:root[data-theme="dark"] .report-track.tracked{background:rgba(182,228,0,.1)}

/* terminal v2: risk badges, sorting, buy presets, portfolio P&L + risk exposure */
.term-list-head{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:12px;color:var(--muted)}
.term-list-head select{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:8px;padding:6px 9px;font:600 12px "DM Sans"}
.term-row-sym .chip.term-risk{margin-left:6px;font-size:10px;padding:2px 7px;vertical-align:1px}
.term-detail-head .chip.term-risk{font-size:12px;vertical-align:3px}
.term-row-static{cursor:default}
.term-cost-btn{font-size:13px}
.term-pnl{display:block;font-size:11px;font-weight:700;margin-top:2px}
.term-pnl.pos{color:var(--green-dark)}
.term-pnl.neg{color:var(--red)}
.term-exposure{margin:12px 0 0;font-size:13px;font-weight:600;color:var(--muted);background:var(--fill);border:1px solid var(--line);border-radius:10px;padding:11px 13px}
.term-exposure.hot{color:var(--red);border-color:rgba(229,72,77,.3);background:rgba(229,72,77,.06)}
:root[data-theme="dark"] .term-exposure.hot{background:rgba(255,107,111,.08)}
.term-buy-presets{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--muted)}
.term-buy-presets button{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:7px;padding:7px 10px;font:700 12px "DM Sans";cursor:pointer}
.term-buy-presets button:hover{border-color:var(--green-dark);color:var(--green-dark)}
@media(max-width:640px){.term-detail-actions{flex-wrap:wrap}.term-buy-presets{order:3;width:100%;margin-top:4px}}

/* ============================================================
   TERMINAL — mobile polish
   ============================================================ */
@media(max-width:640px){
  /* alert form: a tidy 2-column grid instead of 4 controls wrapping raggedly.
     condition (the main choice) spans the top; dir + value share a row; Add spans. */
  .term-alert-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:stretch}
  .term-alert-row #term-alert-cond{grid-column:1/-1;order:-1}
  .term-alert-row #term-alert-dir{grid-column:1}
  .term-alert-row #term-alert-val{grid-column:2;width:auto}
  .term-alert-row #term-alert-add{grid-column:1/-1;padding:12px}
  .term-alert-row select,.term-alert-row input{width:auto;min-width:0}
  /* a shorter chart on phones so stats + alerts aren't buried under a tall iframe */
  .term-detail .chart-frame iframe{height:300px}
  /* comfortable full-width buy presets */
  .term-buy-presets button{flex:1;padding:11px 0}
  .term-detail-head h3{font-size:19px}
}

/* terminal detail actions: the global .secondary is full-width + margin (for the
   swap page) — in the compact action row Scan/Trade/presets should sit inline */
.term-detail-actions{align-items:center;flex-wrap:wrap}
.term-detail-actions .secondary{width:auto;margin-top:0;padding:11px 16px;flex:0 0 auto}
@media(max-width:640px){
  .term-detail-actions .secondary{flex:1 1 calc(50% - 5px)}
}

/* terminal inline trade ticket — the relocated #swap panel sits below the token
   detail (chart/stats/alerts), so you trade where you watch */
.term-trade{margin-top:16px}
.term-trade .swap-panel{margin:0}

/* ============================================================
   TRADING TERMINAL — pro "trading-bot" skin
   (BonkBot / Telemetry / Photon genre): a framed dark terminal
   panel, dense rows, tabular monospace numerics, neon buy/sell,
   segmented tabs and prominent quick-buy. Built on the theme
   tokens so it stays coherent in dark (default) and light.
   Everything is scoped to #terminal.
   ============================================================ */
#terminal {
  --buy: #20d47a; --sell: #ff5470;
  --mono: ui-monospace, "SF Mono", "Roboto Mono", Menlo, Consolas, monospace;
  border: 1px solid var(--line); border-radius: 18px;
  padding: 20px 20px 26px; margin-top: 18px; background: var(--card);
}
:root[data-theme="dark"] #terminal { background: #0c1116; border-color: #1b242c; }

/* compact, terminal-style header */
#terminal .swap-page-head { margin-bottom: 6px; }
#terminal .swap-page-head h2 { font-size: 21px; margin: 6px 0 4px; }
#terminal .swap-page-head p { font-size: 12px; max-width: 640px; }
#terminal .eyebrow { font-size: 10px; }

/* tabs → segmented control */
#terminal .term-tabs {
  display: inline-flex; gap: 3px; margin: 12px 0 16px; padding: 4px;
  background: var(--fill); border: 1px solid var(--line); border-radius: 11px; overflow: visible;
}
:root[data-theme="dark"] #terminal .term-tabs { background: #0a0e12; border-color: #1b242c; }
#terminal .term-tab { border-radius: 8px; padding: 8px 15px; font: 700 12.5px "DM Sans"; letter-spacing: .01em; }
#terminal .term-tab.active { background: var(--card); color: var(--ink); box-shadow: none; border: 0; }
:root[data-theme="dark"] #terminal .term-tab.active { background: #1b252e; color: #fff; }

/* track / sort controls */
#terminal .term-add-row input, #terminal .term-list-head select, #terminal .term-alert-row select, #terminal .term-alert-row input {
  background: var(--fill); border: 1px solid var(--line); color: var(--ink);
}
:root[data-theme="dark"] #terminal .term-add-row input,
:root[data-theme="dark"] #terminal .term-list-head select,
:root[data-theme="dark"] #terminal .term-alert-row select,
:root[data-theme="dark"] #terminal .term-alert-row input { background: #0a0e12; border-color: #1b242c; }
#terminal .term-list-head { text-transform: uppercase; letter-spacing: .06em; font-size: 10px; }

/* watchlist rows: dense, mono numerics, neon change, lime active rail */
#terminal .term-row {
  padding: 10px 12px; border-radius: 10px; margin-bottom: 6px; gap: 10px;
  background: var(--fill); position: relative; overflow: hidden;
}
:root[data-theme="dark"] #terminal .term-row { background: #10171d; border-color: #1b242c; }
#terminal .term-row::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: transparent; transition: background .15s;
}
#terminal .term-row:hover { border-color: #2a3742; }
#terminal .term-row.active { border-color: var(--green-dark); box-shadow: none; }
#terminal .term-row.active::before { background: var(--green-dark); }
#terminal .term-row-sym { font: 700 13.5px "Space Grotesk"; }
#terminal .term-row-addr { font-size: 10px; letter-spacing: .01em; }
#terminal .term-row-price { font-family: var(--mono); font-variant-numeric: tabular-nums; font-weight: 600; font-size: 13px; }
#terminal .term-row-chg { font-family: var(--mono); font-variant-numeric: tabular-nums; font-weight: 700; }
#terminal .term-row-chg.pos { color: var(--buy); }
#terminal .term-row-chg.neg { color: var(--sell); }

/* detail panels */
:root[data-theme="dark"] #terminal .term-detail,
:root[data-theme="dark"] #terminal .term-trade { background: #10171d; border-color: #1b242c; }
#terminal .term-detail-head h3 { font: 700 20px "Space Grotesk"; letter-spacing: -.01em; }

/* stats → a row of bordered mono chips */
#terminal .term-detail-stats {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
  padding: 0; margin: 14px 0 18px; border: 0;
}
#terminal .term-detail-stats div {
  background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; gap: 4px;
}
:root[data-theme="dark"] #terminal .term-detail-stats div { background: #0a0e12; border-color: #1b242c; }
#terminal .term-detail-stats b { font: 600 15px var(--mono); font-variant-numeric: tabular-nums; }
#terminal .term-detail-stats span { font-size: 9.5px; text-transform: uppercase; letter-spacing: .06em; }

/* quick-buy → prominent neon-green presets (the signature bot control) */
#terminal .term-buy-presets { gap: 6px; font-size: 11px; }
#terminal .term-buy-presets button {
  background: rgba(32, 212, 122, .13); border: 1px solid rgba(32, 212, 122, .42);
  color: var(--buy); border-radius: 9px; padding: 10px 13px; font: 800 13px "DM Sans";
}
#terminal .term-buy-presets button:hover { background: var(--buy); color: #04140b; border-color: var(--buy); }

/* the inline trade ticket's action numbers, tabular */
#terminal .term-detail-stats,
#terminal .swap-est, #terminal .swap-balrow b { font-variant-numeric: tabular-nums; }

/* alert form: tighter, dark */
#terminal .term-alert-form h4 { font-size: 13px; letter-spacing: .01em; }
#terminal .term-order-row { border-radius: 10px; }

@media (max-width: 640px) {
  #terminal { padding: 14px 13px 20px; }
  #terminal .term-detail-stats { grid-template-columns: repeat(2, 1fr); }
  #terminal .term-tabs { display: flex; width: 100%; }
  #terminal .term-tab { flex: 1; text-align: center; }
}
/* neon reads fine on the dark terminal, but as text on a light surface it needs
   to be darker — keep the buy/sell hues legible in light mode */
:root[data-theme="light"] #terminal { --buy: #0a8f4f; --sell: #d1394d; }

/* ============================================================
   RADAR — live intelligence feed animations (in / eliminate)
   ============================================================ */
#terminal .radar-row { max-height: 200px; will-change: transform, opacity; }
@keyframes radarIn {
  0%   { opacity: 0; transform: translateY(-12px); box-shadow: 0 0 0 1px var(--buy) inset, 0 0 22px -4px var(--buy); }
  55%  { opacity: 1; transform: none; }
  100% { opacity: 1; transform: none; box-shadow: none; }
}
#terminal .radar-in { animation: radarIn .5s ease-out; }
@keyframes radarOut {
  0%   { opacity: 1; }
  100% { opacity: 0; transform: translateX(30px); max-height: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; border-width: 0; }
}
#terminal .radar-out { animation: radarOut .5s ease forwards; overflow: hidden; pointer-events: none; }
@keyframes radarBad {
  0%   { opacity: 1; }
  8%   { background: rgba(255,84,112,.24); box-shadow: 0 0 0 1px var(--sell) inset, 0 0 26px -4px var(--sell); transform: translateX(-3px); }
  16%  { transform: translateX(3px); }
  26%  { background: rgba(255,84,112,.12); transform: none; }
  100% { opacity: 0; transform: translateX(34px); max-height: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; border-width: 0; }
}
#terminal .radar-out.radar-bad { animation: radarBad .72s ease forwards; }

/* instant-buy ⚡ button on radar rows */
#terminal .radar-buy {
  flex: 0 0 auto; margin-left: 8px; width: 36px; height: 36px;
  border: 1px solid rgba(32,212,122,.5); background: rgba(32,212,122,.14);
  color: var(--buy); border-radius: 9px; font-size: 16px; line-height: 1; cursor: pointer;
  transition: background .12s, transform .1s;
}
#terminal .radar-buy:hover { background: var(--buy); color: #04140b; }
#terminal .radar-buy:active { transform: scale(.92); }
#terminal .radar-age { font-size: 11px; color: var(--muted); }

@media(prefers-reduced-motion: reduce) {
  #terminal .radar-in, #terminal .radar-out, #terminal .radar-out.radar-bad { animation-duration: .01s; }
}

/* launchpad reputation chip (live feed + radar) */
.lp-chip { display:inline-flex; align-items:center; gap:2px; font:700 9.5px "DM Sans"; letter-spacing:.02em; padding:1px 6px; border-radius:5px; margin-left:6px; vertical-align:1px; border:1px solid transparent; white-space:nowrap; }
.lp-chip.lp-good { color:#20d47a; background:rgba(32,212,122,.14); border-color:rgba(32,212,122,.32); }
.lp-chip.lp-ok   { color:#5bb8f5; background:rgba(91,184,245,.13); border-color:rgba(91,184,245,.3); }
.lp-chip.lp-unk  { color:var(--muted); background:var(--fill); border-color:var(--line); }
.lp-chip.lp-bad  { color:#ff5470; background:rgba(255,84,112,.14); border-color:rgba(255,84,112,.32); }
.lp-chip .lp-safe { font-style:normal; color:#20d47a; font-weight:800; margin-left:1px; }

/* ============================================================
   MOVERS — timeframe performance board
   ============================================================ */
.movers-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; flex-wrap:wrap; }
.movers-tf, .movers-dir { display:inline-flex; gap:3px; padding:3px; background:var(--fill); border:1px solid var(--line); border-radius:9px; }
:root[data-theme="dark"] .movers-tf, :root[data-theme="dark"] .movers-dir { background:#0a0e12; border-color:#1b242c; }
.mv-tf, .mv-dir { border:0; background:none; color:var(--muted); font:700 12px "DM Sans"; padding:6px 11px; border-radius:7px; cursor:pointer; white-space:nowrap; }
.mv-tf:hover, .mv-dir:hover { color:var(--ink); }
.mv-tf.active { background:var(--card); color:var(--ink); }
:root[data-theme="dark"] .mv-tf.active { background:#1b252e; color:#fff; }
.mv-dir.active[data-mvdir="gainers"] { color:#20d47a; }
.mv-dir.active[data-mvdir="losers"] { color:#ff5470; }
.mover-row .mv-rank { flex:0 0 22px; font:700 12px var(--mono,monospace); color:var(--muted); text-align:center; }
.mover-row .mv-chg { font:800 14px var(--mono,monospace); font-variant-numeric:tabular-nums; }
.mover-row .mv-chg.pos { color:#20d47a; }
.mover-row .mv-chg.neg { color:#ff5470; }
.mover-row .mv-liq { font-size:10px; color:var(--muted); font-weight:600; }

/* deployer past-behaviour flag (repeat rugger / honeypot dev) */
.lp-chip.dev-flag { color:#ff5470; background:rgba(255,84,112,.16); border-color:rgba(255,84,112,.4); animation:devFlagPulse 1.6s ease-in-out infinite; }
@keyframes devFlagPulse { 0%,100%{ box-shadow:0 0 0 0 rgba(255,84,112,0);} 50%{ box-shadow:0 0 8px -1px rgba(255,84,112,.6);} }

/* ============================================================
   SWAP — Uniswap-familiar layout (You pay / flip / You receive)
   ============================================================ */
.uni-swap { max-width:440px; }
.uni-card { background:var(--fill); border:1px solid var(--line); border-radius:20px; padding:15px 16px; margin-bottom:4px; transition:border-color .15s; }
.uni-card:focus-within { border-color:var(--green-dark); }
:root[data-theme="dark"] .uni-card { background:#0e1418; border-color:#1b242c; }
.uni-card-head { display:flex; justify-content:space-between; align-items:center; font-size:12.5px; color:var(--muted); margin-bottom:8px; }
.uni-max { border:0; background:none; color:var(--green-dark); font:700 12px "DM Sans"; cursor:pointer; padding:0; }
.uni-max:hover { text-decoration:underline; }
.uni-card-row { display:flex; align-items:center; gap:10px; }
.uni-amount { flex:1; min-width:0; border:0; background:none; outline:none; color:var(--ink); font:600 30px "Space Grotesk"; padding:0; letter-spacing:-.02em; width:100%; }
.uni-amount::placeholder { color:var(--muted); opacity:.5; }
.uni-out { flex:1; min-width:0; font:600 24px "Space Grotesk"; color:var(--ink); letter-spacing:-.02em; overflow:hidden; }
.uni-out .muted-note, .uni-out .impact { font:600 12px "DM Sans"; display:inline; }
.uni-pill { display:inline-flex; align-items:center; gap:7px; background:var(--card); border:1px solid var(--line); border-radius:999px; padding:6px 13px 6px 6px; font-weight:700; flex:0 0 auto; white-space:nowrap; }
:root[data-theme="dark"] .uni-pill { background:#1b242c; border-color:#28323b; }
.uni-pill img { width:24px; height:24px; border-radius:50%; object-fit:cover; }
.uni-pill-mono { width:24px; height:24px; border-radius:50%; display:grid; place-items:center; background:var(--green-dark); color:#04140b; font:800 12px "Space Grotesk"; }
.uni-pill b { font-size:15px; }
.uni-arrow { display:block; margin:-13px auto; position:relative; z-index:2; width:38px; height:38px; border-radius:12px; border:4px solid var(--card); background:var(--fill); color:var(--ink); font-size:16px; cursor:pointer; transition:transform .2s, background .15s, color .15s; }
:root[data-theme="dark"] .uni-arrow { border-color:#10171d; background:#1b242c; }
.uni-arrow:hover { background:var(--green-dark); color:#04140b; transform:rotate(180deg); }
.uni-slip { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:14px 0 10px; font-size:13px; color:var(--muted); }
.uni-slip .slip-opts { display:inline-flex; gap:4px; }
.uni-go { width:100%; border:0; border-radius:16px; padding:16px; font:800 17px "DM Sans"; background:var(--green); color:#04140b; cursor:pointer; transition:filter .15s; margin-top:2px; }
.uni-go:hover { filter:brightness(1.06); }
.uni-go:disabled { opacity:.55; cursor:default; }

/* ============================================================
   TERMINAL as the hero — bigger, degen-friendly header
   ============================================================ */
.term-hero { margin-bottom: 4px; }
.term-hero h2 { font: 800 clamp(26px,3.6vw,40px)/1.02 "Space Grotesk"; letter-spacing:-.03em; margin: 0 0 12px; }
.term-hero h2 span { color: var(--green-dark); }

/* infinite-scroll feature strip — the three pillars keep moving so the hero
   sells Live launches · Chart · Instant swap without a wall of text */
.term-marquee { position:relative; overflow:hidden; border:1px solid var(--line); border-radius:11px; background:var(--card); padding:9px 0; -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); }
:root[data-theme="dark"] .term-marquee { background:#0a0e12; border-color:#1b242c; }
.term-marquee-track { display:inline-flex; align-items:center; gap:20px; white-space:nowrap; will-change:transform; animation:termScroll 26s linear infinite; }
.term-marquee-track span { font:800 12.5px "DM Sans"; letter-spacing:.05em; color:var(--ink); }
.term-marquee-track i { color:var(--green-dark); font-style:normal; font-weight:900; }
.term-marquee:hover .term-marquee-track { animation-play-state:paused; }
@keyframes termScroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@media(prefers-reduced-motion:reduce){ .term-marquee-track{animation:none} }

.term-hero-actions { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:14px; }
.term-hero-scan { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); background:var(--card); color:var(--ink); border-radius:11px; padding:10px 16px; font:700 13px "DM Sans"; text-decoration:none; transition:border-color .15s,color .15s; }
.term-hero-scan:hover { border-color:var(--green-dark); color:var(--green-dark); }
.term-hero-hint { font-size:11px; color:var(--muted); letter-spacing:.02em; }

/* "Enter Terminal" button on the scan report */
.report-terminal { margin-left:8px; border:1px solid var(--green-dark); background:rgba(0,200,5,.08); color:var(--green-dark); font:800 13px "DM Sans"; border-radius:9px; padding:8px 14px; cursor:pointer; vertical-align:2px; }
:root[data-theme="dark"] .report-terminal { background:rgba(182,228,0,.12); }
.report-terminal:hover { background:var(--green-dark); color:#04140b; }

/* the TRUSTED live badge — a touch brighter than plain CLEAR */
.lqc-clear { }
.term-row-sym .lqc:not(.lqc-scanning) { font-weight:800; }

/* ============================================================
   TERMINAL UI/UX fixes (PC + mobile)
   ============================================================ */
/* the hero headline was being out-specified by the pro-skin → render it hero-sized */
#terminal .term-hero h2 { font: 800 clamp(26px,6vw,40px)/1.03 "Space Grotesk"; letter-spacing:-.03em; margin:8px 0 10px; }
#terminal .term-hero p { font-size:14.5px; }

/* mobile: 5 tabs don't fit — scroll them instead of overflowing off-screen */
@media(max-width:640px){
  #terminal .term-tabs { display:flex; width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding:4px; }
  #terminal .term-tabs::-webkit-scrollbar { display:none; }
  #terminal .term-tab { flex:0 0 auto; text-align:center; }
  /* don't waste a screen of dead space on the "pick a token" placeholder */
  #term-detail.is-empty { display:none; }
  #terminal .term-hero p { font-size:13.5px; }
  #terminal .term-hero-actions { margin-top:12px; }
}
/* desktop: a lighter, centered empty-state instead of a cramped line */
.term-empty { display:grid; place-items:center; min-height:180px; text-align:center; color:var(--muted); font-size:14px; padding:20px; }

/* tablet gap (721–900px): the full desktop nav overflowed to horizontal scroll
   before the bottom tab bar takes over at 720px. Trim the decorative items so
   navigation never pushes the page sideways. */
@media(min-width:721px) and (max-width:900px){
  .network { display:none; }
  .nav-live-link { display:none; }
  .nav-tab { padding:7px 10px; font-size:12.5px; }
  .nav-right { gap:8px; }
}

/* whale-intelligence chip on token cards (HoodWatch-inspired) */
.tc-whale { font: 700 12px "DM Sans"; color: var(--ink); display:inline-flex; align-items:center; gap:2px; }
.tc-whale.tc-loading { color: var(--muted); opacity:.7; }
.tc-whale.hot { color: #ff9f1c; }
:root[data-theme="dark"] .tc-whale.hot { color: #ffb340; }

/* ============================================================
   TOKENS TAB — dense accumulation leaderboard (HoodWatch-style)
   Sortable table with our on-chain rug/whale intelligence per row.
   Coexists with the card grid (.is-cards) via the Table/Live toggle.
   ============================================================ */
.tokens-search { flex: 1 1 200px; min-width: 140px; }
.tokens-search input {
  width: 100%; background: var(--fill); border: 1px solid var(--line); color: var(--ink);
  border-radius: 10px; padding: 8px 12px; font: 500 13px "DM Sans"; outline: none;
}
.tokens-search input:focus { border-color: var(--green-dark); }
:root[data-theme="dark"] .tokens-search input { background: #0a0e12; border-color: #1b242c; }
.tokens-view { display: inline-flex; gap: 3px; padding: 3px; background: var(--fill); border: 1px solid var(--line); border-radius: 10px; }
:root[data-theme="dark"] .tokens-view { background: #0a0e12; border-color: #1b242c; }
.tokens-viewbtn { border: 0; background: transparent; color: var(--muted); border-radius: 7px; padding: 6px 11px; font: 700 12px "DM Sans"; cursor: pointer; }
.tokens-viewbtn.active { background: var(--card); color: var(--ink); }
:root[data-theme="dark"] .tokens-viewbtn.active { background: #1b252e; color: #fff; }

/* the table wrapper stops the parent grid from imposing card columns */
#tokens-list:not(.is-cards) { display: block; }
.tk-table { width: 100%; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--card); font-variant-numeric: tabular-nums; }
:root[data-theme="dark"] .tk-table { background: #0c1116; border-color: #1b242c; }

/* CMC-style columns: star | # | token | price | 24h | mcap | vol | liq | whales | source | actions */
.tk-tr {
  display: grid;
  grid-template-columns: 30px 30px minmax(150px, 1.6fr) 92px 78px 94px 94px 92px 60px minmax(84px, .9fr) 74px;
  align-items: center; gap: 10px; padding: 10px 16px; border-bottom: 1px solid var(--hair);
  cursor: pointer; position: relative;
}
.tk-tr:last-child { border-bottom: 0; }
.tk-head {
  cursor: default; font: 800 10px "DM Sans"; letter-spacing: .06em; text-transform: uppercase;
  color: var(--muted); background: var(--fill); position: sticky; top: 0; z-index: 2;
}
:root[data-theme="dark"] .tk-head { background: #0a0e12; }
.tk-head .tk-sortable { cursor: pointer; user-select: none; }
.tk-head .tk-sortable:hover { color: var(--ink); }
.th-arr { font-style: normal; color: var(--green-dark); }
.tk-tr:not(.tk-head):hover { background: var(--fill); }
:root[data-theme="dark"] .tk-tr:not(.tk-head):hover { background: #10171d; }

/* subtle row-appear */
.tk-tr.tk-anim { animation: tkIn .28s ease both; animation-delay: min(calc(var(--i) * 10ms), 300ms); }
@keyframes tkIn { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: none; } }

/* danger / thin-liquidity tints */
.tk-tr.tk-danger { background: rgba(255,84,112,.06); }
.tk-tr.tk-danger:hover { background: rgba(255,84,112,.11); }
.tk-tr.tk-thin { opacity: .74; }

.tk-rank { color: var(--muted); font: 700 12px "DM Sans"; text-align: center; }
.tk-tok { display: flex; align-items: center; gap: 9px; min-width: 0; }
.tk-av { width: 26px; height: 26px; flex: 0 0 26px; border-radius: 8px; display: grid; place-items: center;
  font: 800 12px "Space Grotesk"; color: #fff; background: hsl(var(--h,210) 70% 45%); overflow: hidden; }
.tk-av.has-img { background: var(--fill); }
.tk-av img { width: 100%; height: 100%; object-fit: cover; }
.tk-idcol { min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.tk-sym { font: 800 13.5px "Space Grotesk"; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tk-addr { font: 500 10.5px ui-monospace, monospace; color: var(--muted); text-decoration: none; }
.tk-addr:hover { color: var(--green-dark); }
.tk-flag { color: var(--red); font-size: 13px; }
.tk-whales, .tk-wshare, .tk-price, .tk-chg, .tk-mcap, .tk-liq { font: 600 12.5px ui-monospace, "SF Mono", monospace; color: var(--ink); text-align: right; white-space: nowrap; }
.tk-whales, .tk-wshare { text-align: left; }
.tk-whales.hot, .tk-wshare.hot { color: #ff9f1c; }
:root[data-theme="dark"] .tk-whales.hot, :root[data-theme="dark"] .tk-wshare.hot { color: #ffb340; }
.tk-age { font: 500 11px "DM Sans"; color: var(--muted); text-align: right; white-space: nowrap; }
.mk-chg.pos { color: #20d47a; } .mk-chg.neg { color: #ff5470; }
.mk-load { color: var(--muted); opacity: .55; } .mk-dash { color: var(--muted); opacity: .5; }
.tk-nolq { color: #ff5470; font-weight: 700; font-size: 11px; }
.tk-src { font: 600 11px "DM Sans"; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tk-src-safe { color: #20a35f; } .tk-src-flag { color: #ff5470; }
.tk-act { text-align: right; }
.tk-scan { border: 1px solid var(--line); background: var(--fill); color: var(--ink); border-radius: 8px;
  padding: 6px 12px; font: 800 11.5px "DM Sans"; cursor: pointer; }
.tk-scan:hover { background: var(--green-dark); color: #04140b; border-color: var(--green-dark); }

/* mobile: collapse to the columns that matter, horizontal scroll for the rest */
/* (table width + mobile collapse handled in the consolidated rules below) */

/* whale-flow delta (▲ new whales in / ▼ whales out), from our own snapshots */
.tk-flow { font: 800 10px "DM Sans"; font-style: normal; margin-left: 5px; letter-spacing: .02em; vertical-align: 1px; }
.tk-flow.up { color: #20d47a; }
.tk-flow.down { color: #ff5470; }

/* row actions: one-tap ⚡ trade (opens Terminal) + Scan */
.tk-act { display: inline-flex; gap: 5px; justify-content: flex-end; }
.tk-buy {
  border: 1px solid rgba(32,212,122,.45); background: rgba(32,212,122,.12); color: #20d47a;
  border-radius: 8px; padding: 6px 9px; font: 800 12px "DM Sans"; cursor: pointer; line-height: 1;
}
.tk-buy:hover { background: #20d47a; color: #04140b; }

/* mobile: search takes the full row, controls wrap cleanly */
@media (max-width: 640px) {
  .tokens-bar { flex-wrap: wrap; gap: 8px; }
  .tokens-search { flex-basis: 100%; order: -1; }
  .tokens-search input { padding: 10px 12px; font-size: 14px; }
}

/* pointer from the leaderboard to the ONE live-launches surface (Terminal Radar) */
.tokens-radar-link {
  display: inline-flex; align-items: center; gap: 7px; white-space: nowrap;
  border: 1px solid var(--line); background: var(--fill); color: var(--ink);
  border-radius: 10px; padding: 8px 13px; font: 700 12px "DM Sans"; text-decoration: none;
}
.tokens-radar-link:hover { border-color: var(--green-dark); color: var(--green-dark); }
:root[data-theme="dark"] .tokens-radar-link { background: #0a0e12; border-color: #1b242c; }

/* holder tier chip (nav) + fee row + referral row in the swap panel */
.tier-chip {
  display: inline-flex; align-items: center; white-space: nowrap;
  border: 1px solid rgba(204,255,0,.4); background: rgba(204,255,0,.08); color: var(--ink);
  border-radius: 999px; padding: 6px 12px; font: 800 11.5px "DM Sans"; cursor: default;
}
.uni-feerow b { font-variant-numeric: tabular-nums; }
.ref-row {
  display: flex; align-items: center; gap: 10px; justify-content: space-between;
  margin: 10px 0 2px; padding: 10px 12px; border: 1px dashed var(--line); border-radius: 12px;
  font: 500 12px "DM Sans"; color: var(--muted);
}
.ref-row button { flex: 0 0 auto; }
@media (max-width: 720px) { .tier-chip { display: none; } .ref-row { flex-direction: column; align-items: flex-start; } }

/* terminal dot-grid: alive on hover but at whisper opacity — texture, not noise */
#terminal { position: relative; overflow: hidden; }





/* radar add-row: the search INPUT is the wide element, the button compact */
#terminal .term-add-row { display: flex; gap: 8px; align-items: stretch; }
#terminal .term-add-row input { flex: 1 1 auto; min-width: 0; }
#terminal .term-add-row button { flex: 0 0 auto; padding-left: 22px; padding-right: 22px; }
#terminal .term-add-row button { width: auto; }

/* ---- Terminal: contain the live-launch list + tidy the chart column ---- */
/* the launch feed scrolls INSIDE its own column so a busy radar never turns
   the whole page into an endless scroll */
#term-list { max-height: 60vh; overflow-y: auto; overflow-x: hidden; padding-right: 6px; scrollbar-width: thin; scrollbar-color: var(--line) transparent; scroll-behavior: smooth; }
#term-list::-webkit-scrollbar { width: 8px; }
#term-list::-webkit-scrollbar-thumb { background: var(--line); border-radius: 8px; }
#term-list::-webkit-scrollbar-thumb:hover { background: var(--green-dark); }
#term-list::-webkit-scrollbar-track { background: transparent; }
/* a subtle fade at the bottom hints "more below" */
.term-list-col { position: relative; }

/* chart + detail spacing: give the chart room to breathe, tighten the header */
#terminal .term-detail { padding: 18px 18px 20px; }
#terminal .term-detail-head { margin-bottom: 14px; }
#terminal .term-detail .chart-frame { margin: 2px 0 18px; box-shadow: 0 1px 0 var(--hair); }
#terminal .term-detail .chart-frame iframe { height: 420px; }
#terminal .term-detail-actions { margin: 4px 0 20px; align-items: center; }

/* keep the detail/trade column in view while scrolling the launch feed (desktop) */
@media (min-width: 901px) {
  .term-detail-col { position: sticky; top: 14px; align-self: start; }
}
@media (max-width: 900px) {
  #term-list { max-height: 52vh; }
  #terminal .term-detail .chart-frame iframe { height: 340px; }
}

/* ---- Terminal detail flow: chart → quick-buy → TICKET → alerts (last) ---- */
/* quick-buy is the primary action row now: presets lead, full-scan trails */
#terminal .term-detail-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:6px 0 2px; }
#terminal .term-buy-presets { font:800 12px "DM Sans"; letter-spacing:.02em; }

/* the swap ticket sits right under the chart — give it a touch of prominence */
#terminal .term-trade { margin-top:12px; }
#terminal .term-trade:not(.hidden) { border-color:var(--green-dark); }
:root[data-theme="dark"] #terminal .term-trade:not(.hidden) { box-shadow:0 0 0 1px rgba(32,212,122,.25) inset; }

/* alerts: a quiet collapsible panel BELOW the ticket, never in the way */
#terminal .term-alerts-panel { margin-top:12px; padding:6px 14px; }
#terminal .term-alerts-panel:empty, #terminal .term-alerts-panel.hidden { display:none; }
.term-alertbox { border:0; }
.term-alertbox > summary {
  list-style:none; cursor:pointer; padding:10px 2px; font:700 12.5px "DM Sans";
  color:var(--muted); display:flex; align-items:center; gap:6px; user-select:none;
}
.term-alertbox > summary::-webkit-details-marker { display:none; }
.term-alertbox > summary::after { content:"▾"; margin-left:auto; transition:transform .2s; color:var(--muted); }
.term-alertbox[open] > summary { color:var(--ink); }
.term-alertbox[open] > summary::after { transform:rotate(180deg); }
.term-alertbox > summary:hover { color:var(--green-dark); }
.term-alertbox .term-alert-row { padding:4px 0 8px; }

@media (max-width:900px){
  /* on mobile the ticket must be reachable fast — no sticky, tight gaps */
  #terminal .term-trade, #terminal .term-alerts-panel { margin-top:10px; }
}

/* =====================================================================
   TERMINAL DASHBOARD — list | chart | swap, all visible without scroll
   Mobile: stacked (base rules). Tablet: list rail + stacked chart/trade.
   Wide desktop (≥1120): true 3-pane, viewport-height, internal scroll.
   ===================================================================== */
@media (min-width: 901px) {
  .term-grid { grid-template-columns: 340px minmax(0,1fr); grid-template-areas: "list detail" "list trade"; column-gap: 20px; row-gap: 16px; }
  .term-list-col  { grid-area: list; }
  .term-detail-col{ grid-area: detail; position: static; }
  .term-trade-col { grid-area: trade; min-width: 0; }
}
@media (min-width: 1120px) {
  /* the dashboard uses more screen width than the default reading column */
  #terminal.wrap { width: min(1460px, calc(100% - 48px)); max-width: none; }
  /* pull the whole terminal into a fixed-height dashboard */
  .term-grid {
    grid-template-columns: 310px minmax(0,1fr) 380px;
    grid-template-areas: "list detail trade";
    height: calc(100vh - 222px); min-height: 500px; row-gap: 0;
  }
  .term-list-col, .term-detail-col, .term-trade-col { height: 100%; min-height: 0; display: flex; flex-direction: column; }
  .term-list-col { overflow: hidden; }
  #term-list { flex: 1 1 auto; max-height: none; min-height: 0; }

  /* middle column: bounded chart (DexScreener embeds render a black void if the
     iframe is over-tall), then stats + quick-buy always visible below it. The
     column scrolls internally only if a token's content runs long. */
  #term-detail { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; overflow-y: auto; }
  #term-detail .term-detail-head { flex: 0 0 auto; }
  /* the native canvas fills any height, so let the chart GROW to consume the
     column's leftover space — head/stats/actions are fixed, the chart eats the
     rest. This kills the dead gap that a fixed height left below the actions and
     keeps every state (canvas / loader / "no pool" note) filling the same box so
     nothing reflows or jumps when the data state changes. */
  #term-detail .chart-frame { flex: 1 1 0; min-height: clamp(300px, 44vh, 520px); height: auto; margin: 0 0 12px; }
  /* STRUCTURAL GUARANTEE: only the chart may grow. The head/stats/actions are
     capped to their content so a stray global class (this bit us once when a
     chip reused the page-level `.loading` class and inherited min-height:480px)
     can never inflate a sibling and squeeze the chart. */
  #term-detail .term-detail-head { flex: 0 0 auto; max-height: 84px; overflow: hidden; }
  #term-detail .term-detail-head h3 { max-height: 84px; overflow: hidden; }
  #term-detail .term-detail-stats, #term-detail .term-detail-actions { flex: 0 0 auto; max-height: 132px; }
  #term-detail > .muted-note { flex: 0 0 auto; }
  /* placeholder chips must never impose their own box */
  #term-detail .term-detail-head .chip,
  #term-detail .term-detail-head .lp-chip,
  #term-detail .term-detail-head .tc-whale { min-height: 0; max-height: 26px; }
  #terminal .term-detail .chart-frame iframe { height: 100%; display: block; }
  #term-detail .term-detail-stats, #term-detail .term-detail-actions { flex: 0 0 auto; }

  /* right column: the swap ticket + collapsed alerts, scrolls on its own */
  .term-trade-col { overflow-y: auto; gap: 12px; padding-right: 2px; scrollbar-width: thin; }
  #terminal .term-trade { margin-top: 0; }

  /* compact hero so the three panes own the vertical space */
  #terminal .term-hero h2 { font-size: 22px; margin: 0 0 8px; }
  #terminal .term-marquee { display: none; }
  #terminal .term-hero-actions { display: none; }
  #terminal .term-tabs { margin: 8px 0 12px; }

  /* empty right column before a token is picked reads as intentional */
  .term-trade-col:empty::before,
  .term-trade-col:has(> .hidden:only-child)::before { content: ""; }
}

/* custom quick-buy amount field, sits inline with the ETH presets */
#terminal .term-buy-custom { display: inline-flex; align-items: stretch; gap: 0; margin-left: 2px; }
#terminal .term-buy-custom input {
  width: 76px; border: 1px solid rgba(32,212,122,.42); border-right: 0;
  background: rgba(32,212,122,.08); color: var(--ink);
  border-radius: 9px 0 0 9px; padding: 8px 10px; font: 700 12px "DM Sans"; outline: none;
  -moz-appearance: textfield;
}
#terminal .term-buy-custom input::-webkit-outer-spin-button,
#terminal .term-buy-custom input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
#terminal .term-buy-custom input:focus { border-color: var(--buy); background: rgba(32,212,122,.14); }
#terminal .term-buy-custom input::placeholder { color: var(--muted); font-weight: 600; }
#terminal .term-buy-custom button {
  border: 1px solid var(--buy); background: rgba(32,212,122,.16); color: var(--buy);
  border-radius: 0 9px 9px 0; padding: 8px 11px; font: 800 12px "DM Sans"; cursor: pointer; white-space: nowrap;
}
#terminal .term-buy-custom button:hover { background: var(--buy); color: #04140b; }
@media (max-width: 640px) {
  #terminal .term-buy-presets { flex-wrap: wrap; }
  #terminal .term-buy-custom { margin-left: 0; }
  #terminal .term-buy-custom input { flex: 1; width: auto; }
}

/* launchpad SOURCE label on live radar rows (always shown) */
.term-row-src { font-weight: 700; }
.term-row-src.lp-good { color: #20a35f; }
.term-row-src.lp-ok   { color: var(--muted); }
.term-row-src.lp-bad  { color: #ff5470; }
.term-row-src.lp-unk  { color: var(--muted); }
:root[data-theme="dark"] .term-row-src.lp-good { color: #38d98a; }
.term-row-src.lp-resolving { color: var(--muted); opacity: .7; font-weight: 600; }
.term-row-src.lp-resolving { animation: srcPulse 1.2s ease-in-out infinite; }
@keyframes srcPulse { 0%,100% { opacity: .45 } 50% { opacity: .85 } }

/* live pulse dot on the "Live Terminal" nav tab */
.nav-live-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:#20d47a; margin-right:6px; vertical-align:1px; box-shadow:0 0 0 0 rgba(32,212,122,.6); animation:navLive 1.8s ease-out infinite; }
@keyframes navLive { 0%{box-shadow:0 0 0 0 rgba(32,212,122,.55)} 70%{box-shadow:0 0 0 5px rgba(32,212,122,0)} 100%{box-shadow:0 0 0 0 rgba(32,212,122,0)} }

/* Track buttons in the terminal detail (header star + actions button) */
.td-track {
  margin-left: 10px; border: 1px solid var(--line); background: var(--fill); color: var(--muted);
  border-radius: 8px; padding: 5px 11px; font: 800 11.5px "DM Sans"; cursor: pointer; vertical-align: 3px;
}
.td-track:hover { border-color: var(--green-dark); color: var(--green-dark); }
.td-track.on { border-color: var(--green-dark); color: var(--green-dark); background: rgba(32,212,122,.1); }
.term-detail-actbtns { display: inline-flex; gap: 8px; }
:root[data-theme="dark"] .td-track.on { background: rgba(32,212,122,.14); color:#38d98a; border-color:#20a35f; }
@media (max-width: 480px) { .td-track { display: none; } } /* keep header clean on phones; actions button remains */

/* ===== Terminal Radar load screen — a scanning "radar sweep" animation ===== */
.radar-loader { display: flex; flex-direction: column; align-items: center; gap: 18px; padding: 30px 12px 20px; }
.radar-scope {
  position: relative; width: 156px; height: 156px; border-radius: 50%;
  background: radial-gradient(circle, rgba(32,212,122,.07), transparent 70%);
  border: 1px solid var(--line); overflow: hidden;
}
:root[data-theme="dark"] .radar-scope { border-color: #1b242c; background: radial-gradient(circle, rgba(32,212,122,.09), transparent 72%); }
.radar-scope::before, .radar-scope::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(32,212,122,.18); }
.radar-scope::before { inset: 24%; }
.radar-scope::after { inset: 44%; }
.radar-grid {
  position: absolute; inset: 0;
  background:
    linear-gradient(rgba(32,212,122,.14), rgba(32,212,122,.14)) 0 50% / 100% 1px no-repeat,
    linear-gradient(90deg, rgba(32,212,122,.14), rgba(32,212,122,.14)) 50% 0 / 1px 100% no-repeat;
}
.radar-sweep {
  position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(from 0deg, rgba(32,212,122,.5), rgba(32,212,122,.05) 42%, transparent 55%);
  animation: radarSweep 1.9s linear infinite;
}
@keyframes radarSweep { to { transform: rotate(360deg); } }
.radar-blip {
  position: absolute; left: var(--x); top: var(--y); width: 7px; height: 7px; border-radius: 50%;
  background: #20d47a; box-shadow: 0 0 9px #20d47a; transform: translate(-50%,-50%) scale(.4); opacity: 0;
  animation: radarBlip 1.9s ease-in-out infinite; animation-delay: var(--d);
}
@keyframes radarBlip { 0%,100% { opacity: 0; transform: translate(-50%,-50%) scale(.4); } 18% { opacity: 1; transform: translate(-50%,-50%) scale(1); } 55% { opacity: 0; } }
.radar-loader-txt { text-align: center; }
.radar-loader-txt b { display: block; font: 800 15px "Space Grotesk"; color: var(--ink); letter-spacing: -.01em; }
.radar-loader-txt span { display: inline-block; margin-top: 4px; font: 600 12px "DM Sans"; color: var(--muted); }
.rl-dots::after { content: "…"; animation: rlDots 1.4s steps(4) infinite; }
@keyframes rlDots { 0% { content: ""; } 25% { content: "·"; } 50% { content: "··"; } 75% { content: "···"; } }
.radar-skel { width: 100%; display: flex; flex-direction: column; gap: 8px; margin-top: 2px; }
.skel-row {
  height: 54px; border-radius: 13px; border: 1px solid var(--line);
  background: linear-gradient(100deg, var(--card) 30%, var(--fill) 50%, var(--card) 70%);
  background-size: 220% 100%; animation: skelShimmer 1.5s linear infinite;
}
:root[data-theme="dark"] .skel-row { border-color: #1b242c; background: linear-gradient(100deg, #10171d 30%, #172029 50%, #10171d 70%); background-size: 220% 100%; }
.skel-row:nth-child(2) { animation-delay: .15s; }
.skel-row:nth-child(3) { animation-delay: .3s; }
.skel-row:nth-child(4) { animation-delay: .45s; }
@keyframes skelShimmer { to { background-position: -220% 0; } }
@media (prefers-reduced-motion: reduce) { .radar-sweep, .radar-blip, .skel-row, .rl-dots::after { animation: none; } }

/* ===== Native on-chain price chart (Terminal) ===== */
#term-chart-host { position: relative; height: 360px; background: #0a0e12; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
:root[data-theme="dark"] #term-chart-host { border-color: #1b242c; }
:root[data-theme="light"] #term-chart-host { background: #0b1220; }   /* chart reads on dark in both themes */
#term-chart-canvas { display: block; width: 100%; height: 100%; }
.tc-overlay { position: absolute; left: 14px; top: 12px; pointer-events: none; }
.tc-price { font: 800 20px "Space Grotesk"; color: #fff; font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: 8px; }
.tc-price span { font: 800 12px "DM Sans"; }
.tc-price .pos { color: #38d98a; } .tc-price .neg { color: #ff6b81; }
.tc-hilo { margin-top: 2px; font: 600 10.5px "DM Sans"; color: rgba(255,255,255,.5); letter-spacing: .02em; }
.tc-modes { position: absolute; right: 10px; top: 10px; z-index: 2; display: inline-flex; gap: 3px; padding: 3px; background: rgba(10,14,18,.75); border: 1px solid #1b242c; border-radius: 9px; backdrop-filter: blur(4px); }
.tc-modes button { border: 0; background: transparent; color: rgba(255,255,255,.55); border-radius: 6px; padding: 5px 10px; font: 800 11px "DM Sans"; cursor: pointer; }
.tc-modes button.active { background: #1b252e; color: #fff; }
.tc-load { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 9px; color: rgba(255,255,255,.6); font: 600 13px "DM Sans"; }
.tc-spin { width: 15px; height: 15px; border: 2px solid rgba(255,255,255,.2); border-top-color: #20d47a; border-radius: 50%; animation: tcSpin .8s linear infinite; }
@keyframes tcSpin { to { transform: rotate(360deg); } }
.tc-dexframe { display: block; width: 100%; height: 100%; border: 0; }
.tc-none { display: flex; align-items: center; justify-content: center; height: 100%; margin: 0; color: rgba(255,255,255,.5); }
.tc-modes .tc-sep { width: 1px; align-self: stretch; margin: 2px 3px; background: rgba(255,255,255,.14); }
.tc-modes button[data-charttype] { font-size: 13px; padding: 5px 9px; }

/* per-subtab grid reshape: list-only views go full width, portfolio is 2-pane */
@media (min-width: 901px) {
  .term-grid.term-solo { grid-template-columns: 1fr; grid-template-areas: "list"; }
  .term-grid.term-pf { grid-template-columns: 340px minmax(0,1fr); grid-template-areas: "list detail"; }
}
@media (min-width: 1120px) {
  .term-grid.term-solo { grid-template-columns: 1fr; grid-template-areas: "list"; }
  .term-grid.term-pf { grid-template-columns: 320px minmax(0,1fr); grid-template-areas: "list detail"; }
}

/* chart timeframe selector (age-gated) + zoom/nav controls */
.tc-tfs { position: absolute; left: 14px; top: 48px; z-index: 3; display: inline-flex; gap: 2px; padding: 3px; max-width: calc(100% - 28px); overflow-x: auto; background: rgba(10,14,18,.72); border: 1px solid #1b242c; border-radius: 9px; backdrop-filter: blur(4px); scrollbar-width: none; }
.tc-tfs::-webkit-scrollbar { display: none; }
.tc-tfs button { border: 0; background: transparent; color: rgba(255,255,255,.55); border-radius: 6px; padding: 4px 8px; font: 800 10.5px "DM Sans"; cursor: pointer; }
.tc-tfs button.active { background: #1b252e; color: #38d98a; }
.tc-tfs button:hover { color: #fff; }
.tc-modes button[data-czoom] { font-size: 14px; padding: 4px 8px; line-height: 1; }
#term-chart-host { cursor: grab; }
#term-chart-host.tc-grabbing { cursor: grabbing; }
#term-chart-host .tc-modes, #term-chart-host .tc-tfs, #term-chart-host button { cursor: pointer; }
/* deep (Pro-backed) timeframe buttons read slightly distinct */
.tc-tfs button.deep { color: rgba(120,180,255,.75); }
.tc-tfs button.deep.active { background: #12253a; color: #7cc0ff; }

/* Swap ⇄ Bridge toggle + bridge hand-off card */
.swap-mode-toggle { display: inline-flex; gap: 3px; margin-top: 16px; padding: 4px; background: var(--fill); border: 1px solid var(--line); border-radius: 12px; }
:root[data-theme="dark"] .swap-mode-toggle { background: #0a0e12; border-color: #1b242c; }
.swap-mode-btn { border: 0; background: transparent; color: var(--muted); border-radius: 9px; padding: 9px 16px; font: 800 13px "DM Sans"; cursor: pointer; }
.swap-mode-btn.active { background: var(--card); color: var(--ink); }
:root[data-theme="dark"] .swap-mode-btn.active { background: #1b252e; color: #fff; }

.bridge-panel { max-width: 560px; }
.bridge-card { border: 1px solid var(--line); background: var(--card); border-radius: 18px; padding: 30px 26px; text-align: center; }
:root[data-theme="dark"] .bridge-card { background: #0c1116; border-color: #1b242c; }
.bridge-glyph { font-size: 40px; line-height: 1; margin-bottom: 6px; }
.bridge-card h3 { font: 800 22px "Space Grotesk"; margin: 6px 0 10px; letter-spacing: -.02em; }
.bridge-card p { color: var(--muted); font-size: 14px; line-height: 1.55; margin: 0 auto 16px; max-width: 460px; }
.bridge-card p b { color: var(--ink); }
.bridge-chains { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-bottom: 20px; }
.bridge-chains span { font: 700 11px "DM Sans"; color: var(--muted); background: var(--fill); border: 1px solid var(--line); border-radius: 999px; padding: 5px 11px; }
:root[data-theme="dark"] .bridge-chains span { background: #10171d; border-color: #1b242c; }
.bridge-cta { display: inline-flex; align-items: center; justify-content: center; gap: 6px; background: var(--green); color: #071408; font: 800 15px "DM Sans"; border-radius: 12px; padding: 14px 26px; text-decoration: none; transition: background .15s; }
.bridge-cta:hover { background: #00b905; }
.bridge-note { font-size: 11.5px !important; margin-top: 16px !important; }

/* interactive bridge form */
.bridge-form { margin-top: 18px; text-align: left; }
.bridge-chain-row { display: flex; gap: 8px; margin-bottom: 12px; }
.bridge-chain { flex: 1; border: 1px solid var(--line); background: var(--fill); color: var(--muted); border-radius: 11px; padding: 11px 8px; font: 800 13px "DM Sans"; cursor: pointer; }
.bridge-chain.active { border-color: var(--green-dark); color: var(--ink); background: rgba(32,212,122,.1); }
:root[data-theme="dark"] .bridge-chain { background: #10171d; border-color: #1b242c; }
:root[data-theme="dark"] .bridge-chain.active { color: #fff; background: rgba(32,212,122,.14); border-color: #20a35f; }
.bridge-amt-row { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: var(--fill); border-radius: 12px; padding: 4px 14px; margin-bottom: 14px; }
:root[data-theme="dark"] .bridge-amt-row { background: #0a0e12; border-color: #1b242c; }
.bridge-amt-row input { flex: 1; border: 0; background: transparent; color: var(--ink); font: 700 22px "Space Grotesk"; padding: 12px 0; outline: none; -moz-appearance: textfield; }
.bridge-amt-row input::-webkit-outer-spin-button, .bridge-amt-row input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.bridge-amt-row span { font: 800 14px "DM Sans"; color: var(--muted); }
.bridge-quote { border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; margin-bottom: 14px; background: var(--card); }
:root[data-theme="dark"] .bridge-quote { background: #0a0e12; border-color: #1b242c; }
.bq-row { display: flex; justify-content: space-between; align-items: baseline; padding: 4px 0; font: 600 13px "DM Sans"; }
.bq-row b { font: 800 14px "Space Grotesk"; }
.bq-row.muted { color: var(--muted); font-size: 12px; }
.bridge-cta { width: 100%; border: 0; cursor: pointer; }
.bridge-cta[disabled] { opacity: .6; cursor: default; }
.bridge-status { margin-top: 12px !important; text-align: center; }
.bridge-status.err { color: var(--red); }

/* ===== Bridge — Relay-style two-panel card, themed to our palette ===== */
.bridge-panel { max-width: 460px; margin: 0 auto; }
.bridge-shell { border: 1px solid var(--line); background: var(--card); border-radius: 20px; padding: 16px; }
:root[data-theme="dark"] .bridge-shell { background: #0c1116; border-color: #1b242c; }
.bridge-topbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 2px 4px 12px; flex-wrap: wrap; }
.bridge-topbar b { font: 800 15px "Space Grotesk"; }
.bridge-chainpick { display: inline-flex; gap: 3px; padding: 3px; background: var(--fill); border: 1px solid var(--line); border-radius: 10px; }
:root[data-theme="dark"] .bridge-chainpick { background: #0a0e12; border-color: #1b242c; }
.bchip { border: 0; background: transparent; color: var(--muted); border-radius: 7px; padding: 6px 10px; font: 800 11.5px "DM Sans"; cursor: pointer; }
.bchip.active { background: var(--card); color: var(--ink); }
:root[data-theme="dark"] .bchip.active { background: #1b252e; color: #fff; }

/* the two panels reuse .uni-* from the swap; just tune the bridge pill sublabel */
.bridge-uni .uni-card-out .uni-out { color: var(--ink); }
.bridge-pill { align-items: center; }
.bridge-pill-txt { display: inline-flex; flex-direction: column; line-height: 1.1; text-align: left; }
.bridge-pill-txt b { font: 800 14px "Space Grotesk"; }
.bridge-pill-txt i { font: 600 10px "DM Sans"; font-style: normal; color: var(--muted); }
.bridge-arrow { pointer-events: none; }

.bridge-route { border: 1px solid var(--line); border-radius: 12px; padding: 6px 12px; margin: 12px 0 4px; background: var(--fill); }
:root[data-theme="dark"] .bridge-route { background: #0a0e12; border-color: #1b242c; }
.br-row { display: flex; justify-content: space-between; padding: 6px 0; font: 600 12.5px "DM Sans"; color: var(--muted); }
.br-row span:last-child { color: var(--ink); font-weight: 700; font-variant-numeric: tabular-nums; }
.bridge-status { margin-top: 12px !important; text-align: center; }
.bridge-status.err { color: var(--red); }
.bridge-note { text-align: center; margin-top: 14px !important; font-size: 11.5px !important; }

/* the old paste-address box is replaced by the token-pill search modal */
.swap-token-select { display: none; }

/* clickable token pill (opens the token search) */
.uni-pill-btn { border: 0; cursor: pointer; font: inherit; }
.uni-pill-btn:hover { filter: brightness(1.08); }
.uni-pill-cv { font-size: 10px; opacity: .7; margin-left: 1px; }
.bridge-arrow { cursor: pointer; }

/* ===== Uniswap-style token selector modal ===== */
.token-modal { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; }
.tm-backdrop { position: absolute; inset: 0; background: rgba(4,8,10,.66); backdrop-filter: blur(3px); }
.tm-card { position: relative; width: min(440px, calc(100% - 28px)); max-height: 80vh; display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--line); border-radius: 20px; padding: 18px; box-shadow: 0 24px 70px rgba(0,0,0,.4); }
:root[data-theme="dark"] .tm-card { background: #0c1116; border-color: #1b242c; }
.tm-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.tm-head h3 { font: 800 18px "Space Grotesk"; margin: 0; }
.tm-close { border: 0; background: var(--fill); color: var(--muted); width: 30px; height: 30px; border-radius: 9px; font-size: 15px; cursor: pointer; }
.tm-close:hover { color: var(--ink); }
:root[data-theme="dark"] .tm-close { background: #10171d; }
.tm-search { border: 1px solid var(--line); background: var(--fill); color: var(--ink); border-radius: 12px; padding: 13px 15px; font: 500 15px "DM Sans"; outline: none; margin-bottom: 12px; }
.tm-search:focus { border-color: var(--green-dark); }
:root[data-theme="dark"] .tm-search { background: #0a0e12; border-color: #1b242c; }
.tm-list { overflow-y: auto; display: flex; flex-direction: column; gap: 2px; margin: 0 -6px; padding: 0 6px; scrollbar-width: thin; }
.tm-row { display: flex; align-items: center; gap: 12px; width: 100%; border: 0; background: transparent; border-radius: 12px; padding: 10px 10px; cursor: pointer; text-align: left; }
.tm-row:hover { background: var(--fill); }
:root[data-theme="dark"] .tm-row:hover { background: #10171d; }
.tm-av { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 50%; overflow: hidden; display: grid; place-items: center; }
.tm-av img { width: 100%; height: 100%; object-fit: cover; }
.tm-mono { width: 100%; height: 100%; display: grid; place-items: center; color: #fff; font: 800 14px "Space Grotesk"; background: hsl(var(--h,210) 70% 45%); }
.tm-id { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.tm-id b { font: 800 14.5px "Space Grotesk"; color: var(--ink); }
.tm-id i { font: 500 12px "DM Sans"; font-style: normal; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tm-meta { font: 700 11.5px "DM Sans"; color: var(--muted); }
.tm-import { font: 800 11px "DM Sans"; color: #04140b; background: var(--green); border-radius: 999px; padding: 4px 10px; }
.tm-empty { color: var(--muted); font-size: 13px; text-align: center; padding: 30px 10px; }
/* empty "Select token" pill */
.uni-pill-empty { background: var(--green) !important; color: #04140b !important; font-weight: 800; }
:root[data-theme="dark"] .uni-pill-empty { background: var(--green) !important; color: #04140b !important; }

/* numeric headers right-align to sit over their right-aligned values */
.tk-head .tk-num { text-align: right; }
.tk-head .tk-src { text-align: left; }
.tk-head .tk-act { text-align: right; }
/* the whole table scrolls horizontally if the window is narrow (never clips) */
#tokens-list:not(.is-cards) { overflow-x: auto; -webkit-overflow-scrolling: touch; }
/* tablet/desktop keep a comfortable minimum so columns never crush (scrolls if tight) */
@media (min-width: 521px) { .tk-table { min-width: 840px; } }
/* actions column: ⚡ + Scan, right-aligned, never clipped */
.tk-act { display: inline-flex; align-items: center; justify-content: flex-end; gap: 6px; white-space: nowrap; }
.tk-scan { flex: 0 0 auto; }
/* phones: collapse to the essentials, no horizontal scroll */
@media (max-width: 520px) {
  .tk-tr { grid-template-columns: 22px minmax(96px,1.3fr) 44px 84px 84px 84px; gap: 8px; padding: 10px 12px; }
  .tk-wshare, .tk-chg, .tk-liq, .tk-src,
  .tk-head [data-sort="wshare"], .tk-head [data-sort="gain"], .tk-head [data-sort="liq"], .tk-head .tk-src { display: none; }
  .tk-table { min-width: 0; }
  .tk-scan { padding: 6px 9px; }
  .tk-act { gap: 4px; }
}

/* Refer & earn nav entry + modal */
.nav-refer { border: 1px solid rgba(204,255,0,.45); background: rgba(204,255,0,.08); color: var(--ink); border-radius: 999px; padding: 8px 13px; font: 800 12.5px "DM Sans"; cursor: pointer; white-space: nowrap; }
.nav-refer:hover { background: rgba(204,255,0,.16); border-color: var(--green-dark); }
@media (max-width: 900px) { .nav-refer { display: none; } }
.refer-card { text-align: left; }
.refer-pitch { color: var(--muted); font-size: 14px; line-height: 1.55; margin: 0 0 16px; }
.refer-linkbox { display: flex; gap: 8px; margin-bottom: 12px; }
.refer-linkbox input { flex: 1; min-width: 0; border: 1px solid var(--line); background: var(--fill); color: var(--ink); border-radius: 11px; padding: 12px 14px; font: 600 12.5px ui-monospace, monospace; }
:root[data-theme="dark"] .refer-linkbox input { background: #0a0e12; border-color: #1b242c; }
.refer-linkbox button { flex: 0 0 auto; padding: 0 18px; margin: 0; }
.refer-share { display: flex; gap: 8px; margin-bottom: 16px; }
.refer-sbtn { flex: 1; text-align: center; text-decoration: none; border: 1px solid var(--line); border-radius: 11px; padding: 11px; font: 800 13px "DM Sans"; color: var(--ink); }
.refer-sbtn:hover { border-color: var(--green-dark); color: var(--green-dark); }
:root[data-theme="dark"] .refer-sbtn { border-color: #1b242c; }
.refer-how { margin: 0; padding-left: 18px; color: var(--muted); font-size: 12.5px; line-height: 1.7; }
.refer-how li { margin-bottom: 3px; }

/* live count badge on the Wanted nav tab */
.nav-badge { display: inline-block; min-width: 16px; text-align: center; margin-left: 5px; background: var(--red); color: #fff; font: 800 10px "DM Sans"; border-radius: 999px; padding: 1px 5px; vertical-align: 1px; }
.refer-linkbox button.secondary { width: auto; margin-top: 0; }
/* the separate "● Live" link is redundant now that Live Terminal leads the nav */
.nav-live-link { display: none; }

/* ============ Scan landing refresh (trust bar · how-it-works · FAQ) ============ */
/* Trust bar — honest, live social proof under the scan form */
.trust-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:13px;max-width:790px;margin:13px auto 0;padding:11px 18px;font-size:13px;color:var(--muted);background:var(--card);border:1px solid var(--line);border-radius:12px}
.trust-stat{display:inline-flex;align-items:center;gap:6px;font-weight:600;white-space:nowrap}
.trust-stat b{font:700 15px "Space Grotesk";color:var(--ink);font-variant-numeric:tabular-nums}
.trust-link{color:var(--muted);text-decoration:none;transition:color .15s}
.trust-link:hover{color:var(--red)}
.trust-link b{color:var(--red)}
.trust-free{color:var(--green-dark)}
.trust-dot{width:4px;height:4px;border-radius:50%;background:var(--muted);opacity:.4}
@media(max-width:520px){.trust-bar{gap:8px 12px;font-size:12px;padding:10px 12px}.trust-dot{display:none}}

/* How it works — 3 step cards */
.how{display:block!important;background:transparent!important;border:0!important;border-radius:0!important;overflow:visible!important;margin:26px auto 66px!important;padding:0}
.how-head{background:transparent!important;padding:0 0 22px!important;text-align:center}
.how-head .eyebrow{display:block;margin-bottom:8px}
.how-head h2{font:700 clamp(24px,3.6vw,34px) "Space Grotesk";letter-spacing:-.03em;margin:0}
.how-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.how-step{position:relative;background:var(--card)!important;border:1px solid var(--line);border-radius:16px;padding:26px 24px!important;overflow:hidden}
.how-num{position:absolute;top:15px;right:18px;font:700 13px "Space Grotesk";color:var(--muted);opacity:.35}
.how-ic{width:46px;height:46px;display:grid;place-items:center;font-size:22px;background:var(--fill);border:1px solid var(--hair);border-radius:12px;margin-bottom:16px}
.how-step h3{font:700 18px "Space Grotesk";margin:0 0 7px}
.how-step p{color:var(--muted);font-size:13.5px;line-height:1.5;margin:0}
@media(max-width:760px){.how-steps{grid-template-columns:1fr}}

/* FAQ — two-column accordion cards */
.faq{max-width:920px}
.faq-head{text-align:center;margin-bottom:22px}
.faq-head .eyebrow{display:block;margin-bottom:8px}
.faq-head h2{margin:0}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:start}
.faq-grid .faq-card{margin:0}
@media(max-width:680px){.faq-grid{grid-template-columns:1fr}}

/* ============================================================
   TERMINAL DESIGN SYSTEM v2 — token-driven trading surface.
   Foundations follow the Robinhood Chain explorer brief (Inter,
   semantic tokens, WCAG 2.2 AA focus rules, 200ms motion) applied
   to a dense, dark-first terminal in the spirit of telemetry.io;
   space-conserving components (hint tooltips, truncate + copy,
   collapse-by-default) follow Blockscout. Scoped to #terminal —
   the global nav and other views keep the app design system.
   ============================================================ */
#terminal {
  /* color tokens — light values; dark overrides below */
  --bs-text-primary: #101112;
  --bs-text-secondary: #1f3f60;
  --bs-text-muted: #5b6b7b;   /* ≥4.5:1 on white AND on the 4% tint tiles (AA small text) */
  --bs-text-subtle: #a0aec0;
  --bs-surface: #ffffff;
  --bs-surface-subtle: rgba(16, 17, 18, .04);
  --bs-surface-hover: rgba(31, 63, 96, .06);
  --bs-surface-active: rgba(31, 63, 96, .1);
  --bs-border: #e2e8f0;
  --bs-border-strong: #cbd5e0;
  --bs-action: #1c180d;
  --bs-focus: #1f3f60;
  --bs-positive: #087a38;
  --bs-negative: #c53030;
  --bs-accent: #587000;
  /* scale tokens */
  --bs-s1: 4px; --bs-s2: 8px; --bs-s3: 12px; --bs-s4: 16px; --bs-s5: 24px; --bs-s6: 36px;
  --bs-r1: 4px; --bs-r2: 8px; --bs-r3: 12px;
  --bs-fast: 200ms;
  --bs-mono: ui-monospace, "SFMono-Regular", Consolas, monospace;
  --buy: var(--bs-positive); --sell: var(--bs-negative); --mono: var(--bs-mono);
  font-family: Inter, InterFallback, sans-serif;
}
:root[data-theme="dark"] #terminal {
  --bs-text-primary: #f2f6f9; --bs-text-secondary: #b8c7d4; --bs-text-muted: #93a4b1; --bs-text-subtle: #64747e;
  --bs-surface: #101416; --bs-surface-subtle: rgba(255,255,255,.05); --bs-surface-hover: rgba(255,255,255,.08);
  --bs-surface-active: rgba(255,255,255,.12); --bs-border: #232c33; --bs-border-strong: #38444e;
  --bs-action: #ffffff; --bs-focus: #9ecbff; --bs-positive: #2fd575; --bs-negative: #ff7a7a; --bs-accent: #ccff00;
}

/* full-bleed terminal frame — the dashboard owns the width (telemetry-style) */
#terminal.wrap {
  width: min(1720px, calc(100% - 32px)); margin: 16px auto 48px; padding: 20px 24px;
  color: var(--bs-text-primary); background: var(--bs-surface);
  border: 1px solid var(--bs-border); border-radius: var(--bs-r3);
  box-shadow: 0 1px 2px rgba(16,17,18,.03); scroll-margin-top: 80px;
}
body:has(#terminal:not(.hidden)) .live-widget { display: none; }   /* radar IS the live feed */
              /* subtle depth, not noise */

/* hero — one compact row: title left, scan action right */
#terminal .term-hero { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--bs-s3) var(--bs-s5); margin: 0 0 var(--bs-s4); padding: 0; max-width: none; text-align: left; }
#terminal .term-hero h2 { white-space: nowrap; }
#terminal .term-hero h2 { margin: 0; color: var(--bs-text-primary); font: 700 clamp(20px, 2.4vw, 26px)/1.2 Poppins, Inter, sans-serif; letter-spacing: -.02em; }
#terminal .term-hero h2 span { color: var(--bs-text-primary); }
#terminal .term-marquee { display: none; }
#terminal .term-hero-actions { display: flex; margin: 0; justify-content: flex-end; }
#terminal .term-hero-scan { min-height: 36px; padding: 0 var(--bs-s3); border: 0; border-radius: var(--bs-r2); background: var(--bs-action); color: var(--bs-surface); font: 600 13px Inter, sans-serif; transition: opacity var(--bs-fast); }
#terminal .term-hero-scan:hover { opacity: .85; color: var(--bs-surface); }
#terminal .term-hero-hint { max-width: 420px; color: var(--bs-text-muted); font-size: 12px; line-height: 1.45; }

/* subtab bar — segmented control */
#terminal .term-tabs { display: inline-flex; margin: 0 0 var(--bs-s3); padding: 3px; gap: 2px; overflow-x: auto; border: 1px solid var(--bs-border); border-radius: var(--bs-r2); background: var(--bs-surface-subtle); }
#terminal .term-tab { min-height: 32px; padding: 6px var(--bs-s3); border-radius: 6px; color: var(--bs-text-secondary); font: 600 12.5px Inter, sans-serif; transition: background var(--bs-fast), color var(--bs-fast); }
#terminal .term-tab:hover { background: var(--bs-surface-hover); color: var(--bs-text-primary); }
#terminal .term-tab.active { border: 0; background: var(--bs-surface); color: var(--bs-text-primary); box-shadow: 0 1px 3px rgba(16,17,18,.18); }

/* dashboard grid — columns come from the responsive base layer (1 / 2 / 3-pane);
   this layer only tokenizes the gap so the 3-pane desktop layout survives */
#terminal .term-grid { gap: var(--bs-s3); }
#terminal .panel, #terminal .term-row, #terminal .term-alert-form, #terminal .term-exposure {
  border: 1px solid var(--bs-border); border-radius: var(--bs-r2); background: var(--bs-surface); box-shadow: none;
}
#terminal .panel { padding: var(--bs-s4); }

/* list rows — dense, tabular, calm (telemetry density) */
#terminal .term-row { min-height: 52px; margin-bottom: 6px; padding: 9px var(--bs-s3); gap: 10px; color: var(--bs-text-primary); transition: background var(--bs-fast), border-color var(--bs-fast); }
#terminal .term-row::before { display: none; }
#terminal .term-row:hover { background: var(--bs-surface-hover); border-color: var(--bs-border-strong); }
#terminal .term-row.active { background: var(--bs-surface-active); border-color: var(--bs-border-strong); box-shadow: inset 2px 0 0 var(--bs-accent); }
#terminal .term-row-sym { color: var(--bs-text-primary); font: 600 13.5px Inter, sans-serif; }
#terminal .term-row-addr { color: var(--bs-text-muted); font: 500 10.5px var(--bs-mono); }
#terminal .term-row-price { color: var(--bs-text-primary); font: 600 12.5px var(--bs-mono); font-variant-numeric: tabular-nums; }
#terminal .term-row-chg { font: 600 11px var(--bs-mono); font-variant-numeric: tabular-nums; }
#terminal .term-empty { color: var(--bs-text-muted); }
#terminal .mv-chg { font: 700 13px var(--bs-mono); font-variant-numeric: tabular-nums; }

/* detail head — symbol + evidence chips + truncated address with copy */
#terminal .term-detail-head h3 { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; color: var(--bs-text-primary); font: 700 18px Poppins, Inter, sans-serif; }
#terminal .term-detail-head .muted-note { color: var(--bs-text-muted); font: 500 11px var(--bs-mono); }
#terminal .td-copy { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; min-height: 24px; padding: 0 4px; border: 0; border-radius: var(--bs-r1); background: transparent; color: var(--bs-text-muted); font-size: 12px; cursor: pointer; transition: background var(--bs-fast), color var(--bs-fast); }
#terminal .td-copy:hover { background: var(--bs-surface-hover); color: var(--bs-text-primary); }
#terminal .td-copy.ok { color: var(--bs-positive); }
#terminal .td-copy.err { color: var(--bs-negative); }
/* chip colors from the older layers fail AA on the v2 white rows — re-map to tokens
   (light resolves #087a38/#c53030, dark the brighter pair, both AA on their surfaces) */
#terminal .term-row-src.lp-good { color: var(--bs-positive); }
#terminal .lp-chip.dev-flag { color: var(--bs-negative); }
#terminal .td-track { display: inline-flex; align-items: center; gap: 4px; min-height: 26px; padding: 2px 9px; border: 1px solid var(--bs-border); border-radius: 999px; background: var(--bs-surface); color: var(--bs-text-secondary); font: 600 11px Inter, sans-serif; cursor: pointer; transition: background var(--bs-fast), color var(--bs-fast), border-color var(--bs-fast); }
#terminal .td-track:hover { background: var(--bs-surface-hover); color: var(--bs-text-primary); }
#terminal .td-track.on { border-color: var(--bs-accent); color: var(--bs-text-primary); }

/* stat strip — flat micro-tiles, uppercase labels, mono numbers */
#terminal .term-detail-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--bs-s2); padding: var(--bs-s3) 0; border: 0; }
#terminal .term-detail-stats div { padding: 8px 10px; border: 0; border-radius: var(--bs-r2); background: var(--bs-surface-subtle); }
#terminal .term-detail-stats b { color: var(--bs-text-primary); font: 600 14px var(--bs-mono); font-variant-numeric: tabular-nums; }
#terminal .term-detail-stats span { color: var(--bs-text-muted); font: 600 9.5px Inter, sans-serif; letter-spacing: .07em; text-transform: uppercase; }

/* inputs, buttons */
#terminal input, #terminal select { min-height: 38px; border: 1px solid transparent; border-radius: var(--bs-r2); background: var(--bs-surface-subtle); color: var(--bs-text-primary); font: 500 13.5px Inter, sans-serif; outline: none; }
#terminal input:hover, #terminal select:hover { border-color: var(--bs-border-strong); }
#terminal input::placeholder { color: var(--bs-text-muted); opacity: 1; }
#terminal .term-add-row input { padding: 0 var(--bs-s3); }
#terminal .term-add-row .secondary, #terminal .term-alert-row .secondary { width: auto; min-height: 38px; margin: 0; padding: 0 var(--bs-s4); border: 0; border-radius: var(--bs-r2); background: var(--bs-action); color: var(--bs-surface); font: 600 13px Inter, sans-serif; }
#terminal .term-buy-presets { color: var(--bs-text-muted); font: 600 10.5px Inter, sans-serif; letter-spacing: .05em; text-transform: uppercase; }
#terminal .term-buy-presets button, #terminal .radar-buy { min-height: 32px; border: 1px solid var(--bs-border); border-radius: var(--bs-r2); background: var(--bs-surface); color: var(--bs-positive); font: 700 12px var(--bs-mono); transition: background var(--bs-fast), border-color var(--bs-fast); }
#terminal .term-buy-presets button:hover, #terminal .radar-buy:hover { background: var(--bs-surface-hover); border-color: var(--bs-positive); color: var(--bs-positive); }
#terminal .term-buy-custom input { min-height: 32px; }
#terminal .term-order-fire { border-radius: var(--bs-r2); background: var(--bs-action); color: var(--bs-surface); }
#terminal .err { color: var(--bs-negative); border-color: var(--bs-negative); }
#terminal .loading { color: var(--bs-text-muted); }
#terminal .pos { color: var(--bs-positive); }
#terminal .neg { color: var(--bs-negative); }
#terminal button:disabled, #terminal input:disabled, #terminal select:disabled { opacity: .5; cursor: not-allowed; }

/* alerts — collapsed by default (blockscout expander) */
#terminal .term-alertbox > summary { color: var(--bs-text-secondary); font: 600 12.5px Inter, sans-serif; cursor: pointer; }
#terminal .term-alertbox > summary:hover { color: var(--bs-text-primary); }

/* list column scrollbar — thin, quiet */
#terminal #term-list { scrollbar-width: thin; scrollbar-color: var(--bs-border-strong) transparent; }

/* ---- SVG icon system ----
   The sprite holds <defs> only, but an <svg> element still occupies layout
   (default 300x150) unless removed from flow — and every <svg class="ic">
   MUST carry an explicit size or it inherits that same default and blows up
   the container. Both rules are load-bearing; never drop them. */
.ic-sprite { display: none !important; }
.ic {
  width: 1.05em; height: 1.05em; flex: none; display: inline-block;
  vertical-align: -.16em; overflow: visible; color: inherit; fill: none;
}
/* icons sized in px where they sit alongside fixed-size text/controls */
.nav-tab .ic, .nav-refer .ic, .nav-turbo .ic, .theme-toggle .ic { width: 18px; height: 18px; vertical-align: middle; }
.term-tab .ic { width: 15px; height: 15px; }
.tc-modes .ic, .tc-tfs .ic { width: 14px; height: 14px; }
.td-copy .ic, .term-row-rm .ic, .tm-close .ic, .share-btn .ic, .lw-icon .ic { width: 15px; height: 15px; }
.radar-buy .ic { width: 14px; height: 14px; }
.how-ic .ic { width: 22px; height: 22px; }
.bridge-glyph .ic { width: 28px; height: 28px; }
.term-row-src .ic, .lp-chip .ic, .tc-whale .ic { width: 11px; height: 11px; vertical-align: -.12em; }

/* ---- hint tooltip (blockscout pattern): one fixed-position #tt-pop bubble,
   positioned by JS above/below the [data-tip] anchor. Fixed positioning
   escapes every overflow-clipping container (list column, detail scroller,
   live widget) and z-index clears the sticky nav (100). Escape dismisses;
   the bubble itself is hoverable (WCAG 1.4.13). ---- */
.tt { cursor: help; }
#tt-pop {
  position: fixed; z-index: 300; max-width: min(260px, 80vw); padding: 8px 10px; border-radius: 8px;
  background: #16191c; color: #f2f6f9; border: 1px solid #38444e;
  font: 500 11.5px/1.5 Inter, sans-serif; letter-spacing: 0; text-transform: none; white-space: normal; text-align: left;
  box-shadow: 0 10px 26px -12px rgba(0,0,0,.55);
}
#tt-pop[hidden] { display: none; }

/* focus-visible must be visible in BOTH themes (the app rule's navy fails on dark) */
:root[data-theme="dark"] :is(button, a, input, select, textarea, [tabindex]):focus-visible { outline-color: #9ecbff !important; }

@media (max-width: 900px) {
  #terminal.wrap { width: min(100% - 24px, 1104px); padding: var(--bs-s4); }
  #terminal .term-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  #terminal.wrap { width: calc(100% - 16px); margin-top: 8px; padding: var(--bs-s3); border-radius: var(--bs-r2); }
  #terminal .term-hero { grid-template-columns: 1fr; }
  #terminal .term-hero-actions { justify-content: flex-start; }
  #terminal .term-tabs { display: flex; width: 100%; scrollbar-width: none; }
  #terminal .term-tab { flex: 0 0 auto; min-height: 38px; }
  #terminal .term-detail-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #terminal .term-add-row { flex-direction: column; }
  #terminal .term-add-row .secondary { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  #terminal *, #terminal *::before, #terminal *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important; scroll-behavior: auto !important;
  }
}
/* ============================================================
   BLOCKSCOUT APP DESIGN SYSTEM
   Whole-product cascade: Scan, Tokens, Swap, Wanted, Revoke, reports,
   dialogs, navigation and mobile chrome share the explorer foundations.
   ============================================================ */
:root,
:root[data-theme="light"] {
  --ink: #101112;
  --muted: #718096;
  --line: #e2e8f0;
  --paper: #ffffff;
  --white: #ffffff;
  --card: #ffffff;
  --fill: rgba(16, 17, 18, .04);
  --hair: #edf2f7;
  --chipbg: rgba(16, 17, 18, .04);
  --invert: #1c180d;
  --invert-ink: #ffffff;
  --green: #ccff00;
  --green-dark: #587000;
  --red: #c53030;
  --amber: #975a16;
}

body {
  background: var(--paper); color: var(--ink);
  font-family: Inter, InterFallback, -apple-system, "Segoe UI", sans-serif;
  font-size: 16px; line-height: 1.5;
}
h1, h2, h3, h4, h5, h6,
.brand, .score, .score-card strong, .token-name, .term-row-sym {
  font-family: Poppins, Inter, sans-serif;
}
#hero, #tokens, #swap-section, #wanted, #revoke, #report {
  scroll-margin-top: 80px;
}
.wrap { width: min(1120px, calc(100% - 32px)); }

/* Header and navigation */
.nav {
  width: 100%; height: 64px; padding: 8px 24px; border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--card) 96%, transparent); position: sticky; top: 0; z-index: 100;
  backdrop-filter: blur(12px);
}
.brand { gap: 9px; color: var(--ink); font-size: 18px; font-weight: 700; }
.brand-mark { width: 32px; height: 32px; border-radius: 8px; }
.brand em { border-radius: 4px; padding: 3px 6px; background: var(--fill); color: var(--muted); }
.nav-primary { padding: 3px; gap: 2px; border: 1px solid var(--line); border-radius: 8px; background: var(--fill); }
.nav-tab { min-height: 36px; padding: 8px 12px; border-radius: 6px; color: #1f3f60; font: 600 13px Inter, sans-serif; }
.nav-tab:hover { background: rgba(31, 63, 96, .06); color: var(--ink); }
.nav-tab.active { background: var(--card); color: var(--ink); box-shadow: 0 1px 3px rgba(16,17,18,.1); }
.network, .theme-toggle, .nav-refer { min-height: 40px; border-color: var(--line); border-radius: 8px; background: var(--card); box-shadow: none; }
.nav-connect, .nav-btn { min-height: 40px; border: 0; border-radius: 8px; background: #1c180d; color: #fff; box-shadow: none; font-family: Inter, sans-serif; }
.nav-connect:hover, .nav-btn:hover { background: #000; color: #fff; transform: none; }

/* Shared surfaces */
.panel, .scanner, .token-card,
.score-card, .how-step, .faq-card, .tokens-stats, .tokens-bar,
.bridge-card, .bridge-shell, .tm-card, .refer-card, .wanted-card,
.revoke-connect, .revoke-bar, .live-widget, .ot-inner {
  background: var(--card); border: 1px solid var(--line); border-radius: 12px; box-shadow: none;
}
.panel { padding: 24px; }
.panel:hover, .token-card:hover, .how-step:hover, .faq-card:hover { border-color: #cbd5e0; }
.token-card, .wanted-card, .faq-card, .how-step { transition: background 200ms, border-color 200ms; }
.token-card:hover, .wanted-card:hover, .faq-card:hover, .how-step:hover { background: rgba(31,63,96,.025); transform: none; }

/* Forms and stateful controls */
input, select, textarea,
.input-row input, .tokens-search input, .tm-search, .refer-linkbox input {
  min-height: 40px; border: 1px solid transparent; border-radius: 8px; background: var(--fill);
  color: var(--ink); font: 500 14px Inter, sans-serif; outline: none;
}
input:hover, select:hover, textarea:hover { border-color: #cbd5e0; }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
.input-row button, .primary, .secondary, .wanted-scan, .live-btn.primary,
.uni-go, .bridge-cta, .report-trade, .revoke-connect .primary {
  min-height: 40px; border: 0; border-radius: 8px; background: #1c180d; color: #fff;
  font: 600 14px Inter, sans-serif; box-shadow: none; transition: background 200ms, color 200ms;
}
.input-row button:hover, .primary:hover, .secondary:hover, .wanted-scan:hover,
.uni-go:hover, .bridge-cta:hover, .report-trade:hover { background: #000; color: #fff; transform: none; filter: none; }
.ghost, .chip-btn, .tokens-filter, .live-filter, .swap-mode-btn,
.tokens-refresh, .share-btn, .report-track, .report-terminal {
  border: 1px solid var(--line); border-radius: 8px; background: var(--card); color: #1f3f60;
  font-family: Inter, sans-serif;
}
.ghost:hover, .chip-btn:hover, .tokens-filter:hover, .live-filter:hover,
.tokens-refresh:hover, .share-btn:hover, .report-track:hover, .report-terminal:hover {
  border-color: #1f3f60; background: rgba(31,63,96,.06); color: var(--ink);
}
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid #1f3f60 !important; outline-offset: 2px; box-shadow: none !important;
}
button:disabled, input:disabled, select:disabled, textarea:disabled { opacity: .5; cursor: not-allowed; }
button:active, a:active { transform: translateY(1px); }

/* Scan landing */
.hero { padding: 64px 0 48px; }
.hero h1 { margin: 16px auto 28px; max-width: 820px; color: var(--ink); font: 700 clamp(42px, 6vw, 64px)/1.02 Poppins, Inter, sans-serif; letter-spacing: -.045em; }
.hero h1 span { color: #1f3f60; }
.eyebrow { color: var(--muted); font: 600 12px Inter, sans-serif; letter-spacing: .08em; }
.scanner { max-width: 820px; padding: 16px; border-radius: 12px; }
.scanner .input-row input { min-height: 48px; padding: 0 14px; }
.scanner .input-row button { min-height: 48px; padding-inline: 20px; }
.trust-bar { max-width: 820px; border-color: var(--line); border-radius: 8px; background: var(--fill); }
.hero-eco { margin-top: 32px; }
.eco-grid { gap: 8px; }
.eco-stat { border: 1px solid var(--line); border-radius: 8px; background: var(--card); }
.eco-stat.accent { background: var(--fill); }
.ot-inner { overflow: hidden; }

/* Section headers */
.swap-page-head, .tokens-head, .wanted-head, .revoke-head { padding-top: 48px; }
.swap-page-head h2, .tokens-head h2, .wanted-head h2, .revoke-head h2,
.report-head h2, .loading h2 {
  color: var(--ink); font: 700 clamp(28px, 4vw, 40px)/1.15 Poppins, Inter, sans-serif; letter-spacing: -.03em;
}
.swap-page-head p, .tokens-head p, .wanted-head p, .revoke-head p { color: var(--muted); line-height: 1.65; }

/* Token explorer */
.tokens-stats { overflow: hidden; }
.tokens-stats > div { border-color: var(--hair); }
.tokens-bar { padding: 12px; }
.tokens-filters, .tokens-view, .swap-mode-toggle { border-radius: 8px; background: var(--fill); border-color: var(--line); }
.tokens-filter, .tokens-viewbtn, .swap-mode-btn { min-height: 36px; border-radius: 6px; }
.tokens-filter.active, .tokens-viewbtn.active, .swap-mode-btn.active { background: var(--card); color: var(--ink); box-shadow: 0 1px 3px rgba(16,17,18,.1); }
.tk-table { border-color: var(--line); border-radius: 12px; box-shadow: none; }
.tk-head { background: var(--fill); color: var(--muted); }
.tk-tr { border-color: var(--hair); }
.tk-tr:not(.tk-head):hover { background: rgba(31,63,96,.04); }

/* Reports, risk evidence and account tools */
.report { padding-top: 48px; }
.score-card { border-top-width: 4px; }
.notice, .term-disclaimer, .v4beta-warn { border-radius: 8px; }
.finding, .facts dl div, .term-order-row { border-color: var(--hair); }
.finding i, .chip, .lqc, .lp-chip, .dep-score, .wanted-kind, .wanted-src { border-radius: 4px; }
.revoke-connect, .revoke-bar { padding: 20px; }
.wanted-card { padding: 20px; }

/* Swap, bridge, dialogs and overlays */
.swap-page-grid { gap: 16px; }
.uni-card { border-color: var(--line); border-radius: 12px; background: var(--fill); }
.uni-pill { border-color: var(--line); background: var(--card); }
.uni-go { border-radius: 8px; }
.bridge-card, .bridge-shell { border-radius: 12px; }
.tm-backdrop { background: rgba(16,17,18,.56); }
.tm-card { border-radius: 12px; }
.tm-row { border-radius: 8px; }
.tm-row:hover { background: var(--fill); }

/* Floating live monitor */
.live-widget { border-radius: 12px; box-shadow: 0 16px 36px -18px rgba(16,17,18,.3); }
.lw-header { background: #1c180d; color: #fff; }
.lw-body { background: var(--card); }

/* Dark theme retains the same hierarchy */
:root[data-theme="dark"] {
  --ink: #f7fafc; --muted: #a0aec0; --line: #2d3748; --paper: #101112;
  --card: #17191b; --fill: rgba(255,255,255,.06); --hair: #24282c; --chipbg: rgba(255,255,255,.06);
  --invert: #ffffff; --invert-ink: #101112; --green-dark: #ccff00; --red: #fc8181; --amber: #f6ad55;
}
:root[data-theme="dark"] .nav { background: rgba(16,17,18,.94); }
:root[data-theme="dark"] .nav-tab { color: #cbd5e0; }
:root[data-theme="dark"] .nav-connect, :root[data-theme="dark"] .nav-btn,
:root[data-theme="dark"] .input-row button, :root[data-theme="dark"] .primary,
:root[data-theme="dark"] .secondary, :root[data-theme="dark"] .uni-go,
:root[data-theme="dark"] .bridge-cta { background: #fff; color: #101112; }
:root[data-theme="dark"] .hero h1 span { color: #cbd5e0; }
:root[data-theme="dark"] .lw-header { background: #fff; color: #101112; }

@media (max-width: 900px) {
  .nav { padding-inline: 16px; }
  .nav-primary { overflow-x: auto; scrollbar-width: none; }
  .nav-primary::-webkit-scrollbar { display: none; }
}
@media (max-width: 720px) {
  body { padding-bottom: 72px; }
  .nav { height: 60px; }
  .nav-primary, .network, .nav-refer { display: none; }
  .hero { padding-top: 40px; }
  .hero h1 { font-size: clamp(38px, 12vw, 52px); }
  .scanner { padding: 12px; }
  .scanner .input-row { flex-direction: column; }
  .scanner .input-row button { width: 100%; }
  .panel { padding: 18px; }
  .tabbar { background: rgba(255,255,255,.96); border-top: 1px solid var(--line); box-shadow: 0 -8px 24px -20px rgba(16,17,18,.35); backdrop-filter: blur(12px); }
  :root[data-theme="dark"] .tabbar { background: rgba(16,17,18,.96); }
  .tabbar-btn { min-height: 54px; color: var(--muted); }
  .tabbar-btn.active { color: var(--ink); }
  .live-widget { right: 8px; bottom: 72px; max-width: calc(100vw - 16px); }
}
@media (max-width: 520px) {
  .wrap { width: calc(100% - 16px); }
  .form-foot, .report-head, .tokens-bar, .revoke-bar { gap: 12px; }
  .hero h1 { letter-spacing: -.04em; }
  .score-card { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* ============ Icon nav + Turbo wallet ============ */
.nav-tab{display:inline-flex;align-items:center;gap:7px}
@media(min-width:1101px){.nav-tab-txt{display:inline}}
@media(max-width:1100px){.nav-tab-txt{display:none}.nav-tab{padding:8px 10px}}
.nav-turbo,.nav-refer{display:inline-flex;align-items:center;justify-content:center;width:40px;min-height:40px;padding:0;border:1px solid var(--line);border-radius:8px;background:var(--card);color:#1f3f60;cursor:pointer;transition:background 200ms,color 200ms,border-color 200ms}
.nav-turbo:hover,.nav-refer:hover{border-color:#1f3f60;background:rgba(31,63,96,.06);color:var(--ink)}
.nav-turbo.on{border-color:var(--green-dark);background:rgba(88,112,0,.1);color:var(--green-dark)}
:root[data-theme="dark"] .nav-turbo.on{border-color:#ccff00;background:rgba(204,255,0,.14);color:#ccff00}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:40px;padding:0}
.turbo-card{max-width:440px;padding:0 20px 20px}
.turbo-warn{display:flex;gap:10px;margin:4px 0 16px;padding:12px 14px;border:1px solid #f0d797;border-radius:8px;background:#fff8e6;color:#6b581d;font-size:12.5px;line-height:1.5}
:root[data-theme="dark"] .turbo-warn{border-color:#5c4a1a;background:rgba(246,173,85,.1);color:#f6ad55}
.turbo-warn .ic{flex:none;width:18px;height:18px;margin-top:1px}
.turbo-field{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:13px}
.turbo-field span{flex:1;color:var(--muted)}
.turbo-field input,.turbo-field select{width:150px}
.turbo-field i{width:28px;color:var(--muted);font-style:normal;font-size:12px}
.turbo-go{width:100%;margin:6px 0 4px;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.turbo-live{margin:4px 0 14px;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.turbo-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--hair);font-size:13px}
.turbo-row:last-child{border-bottom:0}
.turbo-row span{flex:1;color:var(--muted)}
.turbo-row b{font-family:ui-monospace,Consolas,monospace;font-variant-numeric:tabular-nums}
.turbo-fund{margin-bottom:12px;padding:10px 12px;border-radius:8px;background:var(--fill);font-size:12.5px;line-height:1.5}
.turbo-fund .ic{width:15px;height:15px;vertical-align:-.2em}
.turbo-actions{display:flex;flex-wrap:wrap;gap:8px}
.turbo-actions .secondary{flex:1;min-width:120px;width:auto;margin:0;display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:12.5px}
.turbo-burn{border-color:var(--red)!important;color:var(--red)!important;background:transparent!important}
.turbo-key{display:block;margin-top:6px;padding:8px;border-radius:6px;background:var(--fill);font:500 11px ui-monospace,Consolas,monospace;word-break:break-all;user-select:all}
.turbo-toast{position:fixed;left:50%;bottom:24px;z-index:400;transform:translate(-50%,14px);opacity:0;pointer-events:none;display:flex;align-items:center;gap:8px;max-width:min(460px,92vw);padding:11px 16px;border-radius:10px;background:#16191c;color:#f2f6f9;border:1px solid #38444e;font:500 13px Inter,sans-serif;box-shadow:0 14px 34px -14px rgba(0,0,0,.6);transition:opacity 200ms,transform 200ms}
.turbo-toast.on{opacity:1;transform:translate(-50%,0)}
.turbo-toast .ic{width:16px;height:16px;flex:none}
.turbo-toast .mono{font-family:ui-monospace,Consolas,monospace}

/* compact network chip: dot + feather + RHC (full name in tooltip) */
.network{display:inline-flex;align-items:center;gap:6px;padding:0 12px;font-size:12.5px;font-weight:600;cursor:default}
.network .ic{width:15px;height:15px;color:var(--green-dark)}
:root[data-theme="dark"] .network .ic{color:#ccff00}
.network b{font-weight:700;letter-spacing:.02em}
.network span{display:none}
/* terminal subtabs: icon + label, labels fold away when space is tight */
#terminal .term-tab{display:inline-flex;align-items:center;gap:6px}
@media(max-width:820px){#terminal .term-tab .tt-lbl{display:none}#terminal .term-tab{padding:6px 10px}}
.term-hero-hint{cursor:help}

/* ===== Tokens table: CMC-style refinements ===== */
.tk-star{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:0;border-radius:6px;background:transparent;color:var(--muted);opacity:.5;cursor:pointer;transition:opacity 200ms,color 200ms,background 200ms}
.tk-star:hover{opacity:1;color:var(--amber);background:var(--fill)}
.tk-star.on{opacity:1;color:var(--amber)}
.tk-star.on .ic{fill:currentColor}
.tk-star .ic{width:15px;height:15px}
.tk-head .th-arr{margin-left:4px;font-size:9px;opacity:.35;transition:opacity 200ms}
.tk-head .tk-sortable:hover .th-arr{opacity:.7}
.tk-head .tk-sortable.is-sorted{color:var(--ink)}
.tk-head .tk-sortable.is-sorted .th-arr{opacity:1;color:var(--green-dark)}
:root[data-theme="dark"] .tk-head .tk-sortable.is-sorted .th-arr{color:#ccff00}
.tk-vol{font-variant-numeric:tabular-nums;text-align:right;font-size:12.5px}
.tk-whales{font-variant-numeric:tabular-nums;text-align:right;cursor:help}
.tk-act{display:inline-flex;gap:4px;justify-content:flex-end}
.tk-buy,.tk-scan{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;border:1px solid var(--line);border-radius:7px;background:var(--card);cursor:pointer;transition:background 200ms,border-color 200ms,color 200ms}
.tk-buy{color:var(--green-dark)}
.tk-buy:hover{border-color:var(--green-dark);background:rgba(88,112,0,.1)}
:root[data-theme="dark"] .tk-buy{color:#ccff00}
:root[data-theme="dark"] .tk-buy:hover{border-color:#ccff00;background:rgba(204,255,0,.14)}
.tk-scan{color:#1f3f60}
.tk-scan:hover{border-color:#1f3f60;background:rgba(31,63,96,.08)}
:root[data-theme="dark"] .tk-scan{color:#cbd5e0}
.tk-buy .ic,.tk-scan .ic{width:15px;height:15px}
.mk-chg{font-variant-numeric:tabular-nums;font-weight:600}
/* narrower desktops: shed the least-critical columns before wrapping */
@media(max-width:1180px){.tk-tr{grid-template-columns:28px 26px minmax(130px,1.5fr) 84px 72px 88px 84px 56px 70px}.tk-tr>.tk-vol,.tk-tr>.tk-src{display:none}}

/* ===== Tokens page: fit the container, no clipped controls ===== */
/* The bar used to overflow, squeezing the status text into a deformed column and
   pushing the row actions past the edge. It now wraps, and the status gets its
   own full-width line instead of a 90px gutter. */
.tokens-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.tokens-bar > * { flex: 0 0 auto; }
.tokens-search { flex: 1 1 180px; min-width: 150px; }
.tokens-search input { width: 100%; }
.tokens-status, #tokens-status { flex: 1 0 100%; order: 99; margin: 2px 0 0; color: var(--muted); font-size: 12px; }
.tokens-sortwrap { display: inline-flex; align-items: center; gap: 6px; }
.tokens-sortlabel { color: var(--muted); font-size: 12px; }

/* long text controls → icon buttons with tooltips */
.tokens-refresh, #tokens-radar-link {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 36px; padding: 0 10px; border-radius: 8px; white-space: nowrap;
}
.tokens-refresh { width: 36px; padding: 0; }
.tokens-refresh .ic, #tokens-radar-link .ic { width: 15px; height: 15px; }

/* filter pills must never break a word across lines */
.tokens-filter { white-space: nowrap; display: inline-flex; align-items: center; gap: 5px; }

/* table: trim to fit 1120px, and keep a scroll safety valve so a cell can never
   be clipped out of reach on any width */
.tk-table { overflow-x: auto; scrollbar-width: thin; }
.tk-tr {
  grid-template-columns: 28px 28px minmax(140px, 1.5fr) 88px 74px 92px 88px 88px 56px minmax(72px, .8fr) 70px;
  gap: 8px; padding: 10px 14px;
}
.tk-sym { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-src { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-act { min-width: 0; }

/* ============================================================
   MOBILE + TELEGRAM MINI APP
   Priorities, in order: speed, clarity, thumb reach.
   Follows the Telegram Mini App conventions — full-bleed layout, safe-area
   insets honoured, native-feeling 44px tap targets, no hover-only affordances,
   and no decorative animation competing with live data.
   ============================================================ */

/* Telegram injects its own theme vars; adopt them when present so the mini app
   matches the user's Telegram theme instead of fighting it. */
:root {
  --tg-bg: var(--tg-theme-bg-color, var(--paper));
  --tg-text: var(--tg-theme-text-color, var(--ink));
  --tg-hint: var(--tg-theme-hint-color, var(--muted));
  --tg-link: var(--tg-theme-link-color, #1f3f60);
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}
body.tg-miniapp { background: var(--tg-bg); color: var(--tg-text); }
body.tg-miniapp .nav { padding-top: calc(8px + var(--safe-top)); }
body.tg-miniapp .tabbar { padding-bottom: var(--safe-bottom); }
/* inside Telegram the app is already "the page" — drop our own chrome */
body.tg-miniapp footer, body.tg-miniapp .nav-live-link { display: none; }

@media (max-width: 900px) {
  /* --- dot grid: barely-there texture, and never animated on mobile ---
     It was a distracting moving field on small screens and cost real frames
     on the live terminal. Keep a hint of depth, kill the motion. */

  /* decorative motion off — data motion (row enter/exit) stays, it carries meaning */
  .loader-halo, .loader-scanbar, .radar-sweep, .radar-blip { animation-duration: 2.4s !important; }
  .term-marquee, .term-marquee-track { display: none !important; }

  /* thumb-sized targets everywhere (Apple HIG / Material both say ~44px) */
  .nav-tab, .term-tab, .tokens-filter, .live-filter, .chip-btn,
  .tk-star, .tk-buy, .tk-scan, .td-copy, .td-track, .lw-icon,
  .tc-modes button, .tc-tfs button, .radar-buy {
    min-height: 40px; min-width: 40px;
  }
  .tk-star, .tk-buy, .tk-scan, .td-copy { padding: 0; }

  /* comfortable reading sizes; 16px inputs stop iOS auto-zoom on focus */
  input, select, textarea { font-size: 16px !important; }
  .term-row-sym { font-size: 14px; }
  .term-row-addr { font-size: 11px; }

  /* full-bleed panels — side gutters waste scarce width */
  #terminal.wrap { width: 100%; margin-inline: 0; border-radius: 0; border-inline: 0; }
  .term-grid { gap: 10px; }

  /* the tooltip singleton must never exceed the screen */
  #tt-pop { max-width: min(280px, calc(100vw - 24px)); font-size: 12px; }
}

@media (max-width: 640px) {
  /* Tokens table → a scannable two-line card list. A 11-column grid is
     unreadable at 375px; this keeps price + change + mcap visible at a glance. */
  .tk-table { overflow-x: visible; }
  .tk-tr {
    grid-template-columns: 32px minmax(0, 1fr) auto;
    grid-template-areas: "star tok price" "star tok mcap";
    gap: 2px 8px; padding: 10px 12px; align-items: center;
  }
  .tk-tr > .tk-star { grid-area: star; }
  .tk-tr > .tk-tok  { grid-area: tok; min-width: 0; }
  .tk-tr > .tk-price { grid-area: price; text-align: right; font-size: 13px; }
  .tk-tr > .tk-mcap { grid-area: mcap; text-align: right; font-size: 11px; color: var(--muted); }
  .tk-tr > .tk-rank, .tk-tr > .tk-chg, .tk-tr > .tk-vol,
  .tk-tr > .tk-liq, .tk-tr > .tk-whales, .tk-tr > .tk-src, .tk-tr > .tk-act { display: none; }
  .tk-head { display: none; }   /* no header without columns to label */

  /* stat strips wrap to two clean rows instead of squeezing */
  .term-detail-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .eco-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* modals become bottom sheets — the Telegram/native pattern */
  .tm-card, .turbo-card {
    position: fixed; left: 0; right: 0; bottom: 0; width: 100%;
    max-height: 88vh; overflow-y: auto;
    border-radius: 16px 16px 0 0;
    padding-bottom: calc(16px + var(--safe-bottom));
  }
}

/* Coarse pointers have no hover: make sure nothing important is hover-only. */
@media (hover: none) {
  .tt { cursor: default; }
  .tk-tr:hover, .term-row:hover { background: inherit; }
  .tk-tr:active, .term-row:active { background: var(--fill); }
}

/* ============================================================
   MOBILE UX PASS 2 — reclaim vertical space, put actions in thumb reach.
   On a 375x812 screen the terminal previously spent ~300px on a hero, a
   stacked add-row and section padding before the first live launch appeared.
   Everything below buys that space back and moves the primary action (buy)
   to the bottom of the screen where the thumb already is.
   ============================================================ */
@media (max-width: 900px) {
  /* --- hero: one compact line, no marketing block above live data --- */
  #terminal .term-hero { grid-template-columns: 1fr auto; gap: 8px; margin-bottom: 10px; }
  #terminal .term-hero h2 { font-size: 17px; line-height: 1.25; white-space: normal; }
  #terminal .term-hero-hint { display: none; }           /* lives in the tooltip */
  #terminal .term-hero-scan { min-height: 36px; padding: 0 12px; font-size: 13px; }
  #terminal.wrap { padding-top: 12px; }

  /* --- add-row: single line, icon submit (was stacked full-width = ~110px) --- */
  #terminal .term-add-row { flex-direction: row !important; gap: 8px; margin-bottom: 10px; }
  #terminal .term-add-row input { flex: 1 1 auto; min-width: 0; }
  #terminal .term-add-row .secondary {
    width: 44px !important; min-width: 44px; padding: 0 !important;
    font-size: 0;                                         /* hide the word, keep the button */
  }
  #terminal .term-add-row .secondary::after {
    content: "+"; font-size: 20px; font-weight: 600; line-height: 1;
  }

  /* --- list: taller viewport share, momentum scrolling --- */
  #terminal #term-list { max-height: none; -webkit-overflow-scrolling: touch; }
  #terminal .term-row { min-height: 56px; padding: 9px 11px; }

  /* --- the chart is the reason you tapped: give it real height --- */
  #term-chart-host { height: 300px; }

  /* --- quick-buy follows the thumb ---
     Sticks to the bottom of the viewport (above the tab bar) while the token's
     detail is on screen, so buying never requires scrolling back down. */
  #term-detail .term-detail-actions {
    position: sticky; z-index: 30;
    bottom: calc(64px + var(--safe-bottom));
    margin: 8px -12px 0; padding: 10px 12px;
    background: color-mix(in srgb, var(--card) 94%, transparent);
    backdrop-filter: blur(10px);
    border-top: 1px solid var(--line);
    display: flex; flex-wrap: wrap; gap: 8px;
  }
  #term-detail .term-buy-presets { display: flex; align-items: center; gap: 6px; flex: 1 1 100%; }
  #term-detail .term-buy-presets button { flex: 1 1 0; min-height: 42px; }
  #term-detail .term-buy-custom { display: flex; flex: 1 1 100%; gap: 6px; }
  #term-detail .term-buy-custom input { flex: 1 1 auto; min-width: 0; }
  #term-detail .term-detail-actbtns { display: flex; flex: 1 1 100%; gap: 8px; }
  #term-detail .term-detail-actbtns .secondary { flex: 1 1 0; margin: 0; }

  /* --- detail header stays legible when chips wrap --- */
  #terminal .term-detail-head h3 { font-size: 16px; row-gap: 4px; }
  #terminal .term-detail-head .muted-note { font-size: 10.5px; }
}

@media (max-width: 640px) {
  /* section headers eat a full screen on phones — halve them */
  .swap-page-head, .tokens-head, .wanted-head, .revoke-head { padding-top: 22px; }
  .swap-page-head h2, .tokens-head h2, .wanted-head h2, .revoke-head h2 { font-size: 24px; line-height: 1.2; }
  .swap-page-head p, .tokens-head p, .wanted-head p, .revoke-head p { font-size: 13px; line-height: 1.5; }
  .hero { padding: 28px 0 24px; }
  .hero h1 { font-size: clamp(30px, 9vw, 40px); margin: 10px auto 18px; }

  /* tokens toolbar: filters scroll horizontally instead of stacking 3 rows high */
  .tokens-filters { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .tokens-filters::-webkit-scrollbar { display: none; }
  .tokens-filter { flex: 0 0 auto; }
  .tokens-sortwrap { flex: 1 1 auto; }
  .tokens-sortwrap select { width: 100%; }

  /* stats strip: 2x2 instead of a 4-wide squeeze */
  .tokens-stats { display: grid; grid-template-columns: repeat(2, 1fr); }
}

/* Respect the user's motion preference AND save battery on phones: the live
   feed still animates rows (that motion is information), decorative loops stop. */
@media (max-width: 900px) and (prefers-reduced-motion: reduce) {
  .radar-sweep, .radar-blip, .loader-halo, .loader-scanbar { animation: none !important; }
}

/* sticky buy bar: ONE compact row (163px of an 812px screen was too greedy) */
@media(max-width:900px){
  #term-detail .term-detail-actions{flex-wrap:nowrap;align-items:center;gap:6px;padding:8px 12px}
  #term-detail .term-buy-presets{flex:1 1 auto;gap:5px;font-size:0;letter-spacing:0}
  #term-detail .term-buy-presets .ic{display:none}
  #term-detail .term-buy-presets button{flex:1 1 0;min-height:42px;font-size:13px}
  #term-detail .term-buy-custom{display:none}
  #term-detail .term-detail-actbtns{flex:0 0 auto;gap:6px}
  #term-detail .term-detail-actbtns .secondary{width:42px;min-width:42px;min-height:42px;padding:0;font-size:0}
  #term-detail .term-detail-actbtns .secondary .ic{width:17px;height:17px}
}

/* Touch targets: these lost to #terminal-scoped rules, so match that specificity. */
@media(max-width:900px){
  #terminal .td-copy{min-width:40px;min-height:40px;border-radius:8px}
  #terminal .td-track{min-height:40px;padding:0 14px}
  #terminal .term-tab{min-height:42px;min-width:44px}
  #terminal .radar-buy{min-height:40px;min-width:40px}
  #terminal .term-add-row .secondary{min-height:42px;height:42px}
  #terminal .term-hero-scan{min-height:40px}
  /* inline explorer links inside rows: enlarge the hit area without moving text */
  #terminal .term-row-addr a,#terminal .tk-addr{display:inline-block;padding:6px 0;min-height:32px}
}

/* ===== Bridge: balance chips + MAX ===== */
.uni-bal{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.uni-bal .hidden{display:none}
.uni-max{border:1px solid var(--line);border-radius:6px;background:var(--card);color:#1f3f60;font:700 10.5px Inter,sans-serif;letter-spacing:.04em;padding:3px 7px;min-height:24px;cursor:pointer;transition:background 200ms,border-color 200ms,color 200ms}
.uni-max:hover{border-color:#1f3f60;background:rgba(31,63,96,.08);color:var(--ink)}
:root[data-theme="dark"] .uni-max{color:#cbd5e0}
:root[data-theme="dark"] .uni-max:hover{border-color:#cbd5e0;background:rgba(255,255,255,.08)}
.bridge-topbar b{display:inline-flex;align-items:center;gap:7px}
.bridge-topbar .ic{width:16px;height:16px}
.bridge-arrow .ic{width:16px;height:16px;transform:rotate(90deg)}
@media(max-width:640px){.uni-max{min-height:32px;padding:5px 10px}}

/* ============================================================
   TELEMETRY TOKENS DASHBOARD — launchpads · ecosystem · whale moves.
   Manrope data type, tabular numerals, lime accent. Themed both ways:
   dark leans into Telemetry's near-black + lime; light stays clean.
   ============================================================ */
#tokens {
  --tkd-card: var(--card);
  --tkd-raise: var(--fill);
  --tkd-border: var(--line);
  --tkd-text: var(--ink);
  --tkd-muted: #5b6b7b;   /* clears WCAG AA 4.5:1 on white AND the tint tiles at label sizes */
  --tkd-accent: #587000;
  --tkd-pos: #087a38;
  --tkd-neg: #c53030;
}
:root[data-theme="dark"] #tokens {
  --tkd-card: #14181b;
  --tkd-raise: #1b2024;
  --tkd-border: #242b31;
  --tkd-text: #f4f6f7;
  --tkd-muted: #93a4b1;
  --tkd-accent: #ccff00;   /* brand lime — ONE accent across the whole dark app */
  --tkd-pos: #2fd575;
  --tkd-neg: #fc8181;      /* matches the app-wide --red in dark */
}
.tk-dash { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 4px 0 18px; font-family: Manrope, Inter, sans-serif; }
.tkd-card { display: flex; flex-direction: column; min-height: 208px; border: 1px solid var(--tkd-border); border-radius: 12px; background: var(--tkd-card); overflow: hidden; }
.tkd-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 13px 15px 9px; border-bottom: 1px solid var(--tkd-border); }
.tkd-head h3 { display: inline-flex; align-items: center; gap: 7px; margin: 0; color: var(--tkd-text); font: 700 14px Manrope, sans-serif; letter-spacing: -.01em; }
.tkd-head h3 .ic { width: 15px; height: 15px; color: var(--tkd-accent); }
.tkd-sub { color: var(--tkd-muted); font: 600 10.5px Manrope, sans-serif; letter-spacing: .02em; text-transform: lowercase; cursor: help; }
.tkd-body { flex: 1 1 auto; padding: 5px 7px; overflow: hidden; }

/* leaderboard / whale rows */
.tkd-row { display: grid; align-items: center; gap: 8px; padding: 7px 8px; border-radius: 7px; text-decoration: none; color: var(--tkd-text); transition: background 150ms; }
.tkd-row:hover { background: var(--tkd-raise); }
.tkd-padrow { grid-template-columns: 20px 1fr auto 30px; }
.tkd-whalerow { grid-template-columns: 24px 1fr auto auto; }
.tkd-rank { color: var(--tkd-muted); font: 700 12px Manrope, sans-serif; text-align: center; }
.tkd-name { display: inline-flex; align-items: center; gap: 6px; min-width: 0; font: 600 13px Manrope, sans-serif; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tkd-num { font: 600 12.5px Manrope, sans-serif; font-variant-numeric: tabular-nums; color: var(--tkd-text); text-align: right; }
.tkd-grade { font: 800 9px Manrope, sans-serif; padding: 1px 5px; border-radius: 4px; font-style: normal; }
.tkd-gA { background: rgba(8,122,56,.14); color: var(--tkd-pos); }
.tkd-gB { background: rgba(88,112,0,.14); color: var(--tkd-accent); }
:root[data-theme="dark"] .tkd-gB { background: rgba(204,255,0,.14); }
.tkd-gC, .tkd-gD { background: rgba(148,164,177,.16); color: var(--tkd-muted); }
.tkd-live { font: 700 11px Manrope, sans-serif; font-variant-numeric: tabular-nums; color: var(--tkd-muted); text-align: right; }
.tkd-live.on { color: var(--tkd-accent); }
.tkd-av { width: 22px; height: 22px; border-radius: 50%; display: inline-grid; place-items: center; overflow: hidden; background: hsl(var(--h,210) 55% 42%); color: #fff; font: 800 10px Manrope, sans-serif; }
.tkd-av img { width: 100%; height: 100%; object-fit: cover; }
.tkd-share { font: 700 12.5px Manrope, sans-serif; font-variant-numeric: tabular-nums; color: var(--tkd-text); }
.tkd-share.hot { color: var(--tkd-neg); }
.tkd-empty { padding: 24px 12px; text-align: center; color: var(--tkd-muted); font-size: 12px; }

/* ecosystem 2x2 */
.tkd-ecogrid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; padding: 12px; }
.tkd-stat { display: flex; flex-direction: column; gap: 3px; padding: 12px; border-radius: 9px; background: var(--tkd-raise); }
.tkd-stat b { font: 800 20px Manrope, sans-serif; font-variant-numeric: tabular-nums; color: var(--tkd-text); letter-spacing: -.02em; }
.tkd-stat span { font: 600 10.5px Manrope, sans-serif; color: var(--tkd-muted); }

/* the token table below adopts Manrope numerals for a unified data look */
#tokens .tk-price, #tokens .tk-mcap, #tokens .tk-vol, #tokens .tk-liq, #tokens .tk-chg, #tokens .tk-whales, #tokens .tk-rank { font-family: Manrope, Inter, sans-serif; }

@media (max-width: 900px) {
  .tk-dash { grid-template-columns: 1fr; gap: 10px; }
  .tkd-card { min-height: 0; }
  .tkd-whales { order: 3; }
}

/* ============================================================
   FEATURE-FORWARD SECTION HEADS — icon + one word, no text wall.
   The full copy moves to a tooltip on the sub-label. Applies to
   Tokens / Swap / Wanted / Revoke; the Scan hero keeps its H1.
   ============================================================ */
.compact-head { padding-top: 34px; margin-bottom: 14px; }
.compact-head h2 {
  display: inline-flex; align-items: center; gap: 9px; margin: 0;
  font: 700 clamp(22px, 3vw, 28px)/1.1 Poppins, Inter, sans-serif; letter-spacing: -.02em; color: var(--ink);
}
.compact-head h2 .ic { width: clamp(20px, 2.4vw, 26px); height: clamp(20px, 2.4vw, 26px); color: var(--green-dark); }
:root[data-theme="dark"] .compact-head h2 .ic { color: #ccff00; }
.compact-sub { margin: 4px 0 0; color: var(--muted); font: 500 12.5px Inter, sans-serif; cursor: help; display: inline-block; }
.compact-head .swap-mode-toggle { margin-top: 12px; }
@media (max-width: 640px) { .compact-head { padding-top: 18px; margin-bottom: 10px; } }

/* ============================================================
   MOBILE-APP RESPONSIVE PASS — icon-forward, fits every width.
   ============================================================ */
@media (max-width: 760px) {
  /* the ecosystem stat grid under the scan hero: 2-up, tighter */
  .eco-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 8px; }
  .eco-stat b { font-size: 18px; }
  .ot-inner { flex-direction: column; gap: 12px; }

  /* telemetry dash cards stack; whale card can collapse behind a tap */
  .tk-dash { gap: 8px; }
  .tkd-card { border-radius: 10px; }
  .tkd-ecogrid { grid-template-columns: 1fr 1fr; }

  /* section subs wrap to one tidy line */
  .compact-sub { font-size: 12px; }

  /* swap + bridge cards go full-bleed edge to edge */
  .swap-page-grid, #swap-slot, .bridge-shell { width: 100%; }
}

/* very small phones: single-column ecosystem, larger tap rows */
@media (max-width: 400px) {
  .eco-grid { grid-template-columns: 1fr 1fr !important; }
  .tkd-ecogrid { grid-template-columns: 1fr 1fr; }
  .compact-head h2 { font-size: 21px; }
}

/* ============================================================
   LIVE WIDGET — flattened to an icon pill (Terminal Radar owns
   live launches now). Collapsed = compact bolt + count; tap expands.
   ============================================================ */
.live-widget.collapsed {
  width: auto; right: 16px; bottom: 16px; border-radius: 999px;
  box-shadow: 0 8px 24px -10px rgba(0,0,0,.35);
}
.live-widget.collapsed .lw-header {
  gap: 7px; padding: 9px 13px 9px 11px; border-radius: 999px;
  font: 700 12.5px Inter, sans-serif;
}
.lw-ic { position: relative; display: inline-flex; align-items: center; justify-content: center; }
.lw-ic .ic { width: 16px; height: 16px; }
.lw-ic .live-dot { position: absolute; top: -2px; right: -2px; width: 6px; height: 6px; }
.live-widget.collapsed .lw-chev { transform: rotate(-90deg); font-size: 11px; opacity: .7; }
.live-widget.collapsed .lw-count {
  min-width: 18px; padding: 1px 6px; border-radius: 999px;
  background: rgba(255,255,255,.16); color: #fff; font-variant-numeric: tabular-nums; text-align: center;
}
.live-widget:not(.collapsed) .lw-chev { transform: rotate(0); }
.live-widget:not(.collapsed) .lw-ic .ic { display: none; }   /* full header shows the dot only */

/* ============================================================
   TOKENS PAGE — Telemetry compaction: shrink the dashboard row so
   the trending table rises into the first viewport (top-10 visible).
   ============================================================ */
#tokens .compact-head { padding-top: 20px; margin-bottom: 10px; }
.tk-dash { margin: 2px 0 12px; }
.tkd-card { min-height: 0; }
.tkd-head { padding: 10px 14px 7px; }
.tkd-head h3 { font-size: 13px; }
.tkd-body { padding: 4px 6px; }
.tkd-row { padding: 5px 8px; }
.tkd-padrow, .tkd-whalerow { gap: 7px; }
/* launchpads & whales cap their height and scroll internally, so all three
   cards stay the same compact height and the table isn't pushed down */
#tkd-pads { max-height: 232px; overflow-y: auto; scrollbar-width: thin; }
.tkd-ecogrid { padding: 8px; gap: 6px; }
.tkd-stat { padding: 10px; }
.tkd-stat b { font-size: 18px; }
.tokens-bar { margin-bottom: 10px; }

/* collapsed live pill: icon + count only — the words expand on tap */
.live-widget.collapsed .lw-title { display: none; }
.live-widget.collapsed .lw-header { padding: 9px 12px; }
.live-widget.collapsed { right: 16px; bottom: 16px; }
@media (max-width: 760px) { .live-widget.collapsed { right: 10px; bottom: calc(64px + env(safe-area-inset-bottom, 0px)); } }

/* ============================================================
   LAUNCHPAD RAIL — the aggregator's primary axis. Horizontally
   scrollable chips: "All pads" + every pad we can see tokens from.
   ============================================================ */
.tk-padrail {
  display: flex; gap: 6px; margin: 0 0 10px; padding-bottom: 2px;
  overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  font-family: Manrope, Inter, sans-serif;
}
.tk-padrail::-webkit-scrollbar { display: none; }
.tk-padchip {
  display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto;
  min-height: 34px; padding: 0 12px; border: 1px solid var(--line); border-radius: 999px;
  background: var(--card); color: var(--muted); cursor: pointer; white-space: nowrap;
  font: 600 12.5px Manrope, sans-serif; transition: background 150ms, border-color 150ms, color 150ms;
}
.tk-padchip:hover { border-color: var(--green-dark); color: var(--ink); }
.tk-padchip.active { border-color: var(--green-dark); background: rgba(88,112,0,.1); color: var(--ink); }
:root[data-theme="dark"] .tk-padchip.active { border-color: #ccff00; background: rgba(204,255,0,.14); color: #f4f6f7; }
:root[data-theme="dark"] .tk-padchip:hover { border-color: #ccff00; color: #f4f6f7; }
.tk-padn {
  min-width: 18px; padding: 1px 5px; border-radius: 999px; background: var(--fill);
  color: var(--muted); font: 700 10.5px Manrope, sans-serif; font-variant-numeric: tabular-nums; text-align: center;
}
.tk-padchip.active .tk-padn { background: rgba(88,112,0,.16); color: var(--green-dark); }
:root[data-theme="dark"] .tk-padchip.active .tk-padn { background: rgba(204,255,0,.2); color: #ccff00; }
.tk-padempty { align-self: center; color: var(--muted); font-size: 12px; }
@media (max-width: 640px) { .tk-padchip { min-height: 38px; } }
/* "Direct deploy" is not a launchpad — set it apart from real pads */
.tk-padchip-self { border-style: dashed; opacity: .85; }
.tk-padchip-self.active { border-style: solid; }

/* trade-ticket fallback when a token cannot be routed in-app */
.term-trade-none{margin:0 0 10px;line-height:1.5}
#term-trade .secondary{width:auto;margin:0;padding:0 14px}

/* ============================================================
   MERGED LANDING — audit bar on top of the token aggregator
   Scan stopped being its own page, so .hero is no longer a full-height
   splash: it is a compact header sitting directly above the token list.
   The list must stay high enough that the top ten are visible without
   scrolling (docs/design.md §12), which is what the min-height reset below
   is for — the old rule was min-height:calc(100vh - 82px).
   ============================================================ */
.hero{min-height:0;justify-content:flex-start;gap:12px;padding:22px 0 14px}
@media(max-width:720px){.hero{min-height:0;padding:14px 0 10px}}

/* the one bar: [icon] [paste CA to audit] [Scan] */
.scanbar{
  display:flex;align-items:center;gap:10px;width:min(760px,100%);margin:0 auto;
  padding:7px 7px 7px 14px;background:var(--card);border:1px solid var(--line);
  border-radius:14px;box-shadow:0 14px 44px -26px rgba(18,39,29,.4);
  transition:border-color .18s,box-shadow .18s;
}
.scanbar:focus-within{border-color:var(--green-dark);box-shadow:0 0 0 3px rgba(0,200,5,.16)}
:root[data-theme="dark"] .scanbar{box-shadow:0 14px 44px -26px rgba(0,0,0,.75)}
:root[data-theme="dark"] .scanbar:focus-within{border-color:#7b9900;box-shadow:0 0 0 3px rgba(204,255,0,.22)}
.scanbar-ic{width:20px;height:20px;flex:none;color:var(--green-dark)}
:root[data-theme="dark"] .scanbar-ic{color:#ccff00}
.scanbar input{
  flex:1 1 auto;min-width:0;border:0;outline:none;background:transparent;color:var(--ink);
  font:500 16px "DM Sans";padding:12px 0;   /* 16px: anything smaller zooms iOS on focus */
}
.scanbar input::placeholder{color:var(--muted);opacity:1}
.scanbar input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.scanbar-go{
  flex:none;display:inline-flex;align-items:center;gap:7px;border:0;cursor:pointer;
  background:var(--green);color:#071408;font:700 14px "DM Sans";
  border-radius:10px;padding:0 16px;min-height:42px;
}
.scanbar-go .ic{width:16px;height:16px}
.scanbar-go:hover{filter:brightness(1.06)}
.scanbar-go:active{transform:translateY(1px)}

/* footnote + proof row, both compact so the list stays near the fold */
.hero .form-foot{width:min(760px,100%);margin:0 auto;justify-content:space-between;font-size:11.5px}
.hero .trust-bar{margin-top:0;padding:8px 14px;font-size:12px}

/* the aggregator body starts right under the bar — no second big header */
#tokens.tokens{padding-top:0}
#tokens .tk-dash{margin-top:0}

/* the ecosystem strip moved below the list; it is context, not the headline */
.hero-eco-band{margin:26px auto 0}

@media(max-width:720px){
  .scanbar{width:100%;padding:6px 6px 6px 12px;border-radius:12px;gap:8px}
  .scanbar input{font-size:16px;padding:11px 0}
  .scanbar-go{padding:0 12px;min-height:40px}
  .scanbar-go span{display:none}        /* icon-only button on phones */
  .hero .form-foot{font-size:11px}
}
/* very narrow: the proof row is the first thing to go, never the bar */
@media(max-width:420px){
  .hero .trust-bar{display:none}
  .scanbar-ic{display:none}
}

/* ============================================================
   FOCUS MODE — one token, no radar (opened from a Tokens row)
   Hides the live-launches list and gives the chart the room the
   radar column used to take, matching a token-detail trading view:
   [ chart + stats + quick-buy ] | [ buy/sell ticket ].
   ============================================================ */
.term-grid.term-focus .term-list-col{display:none}
.term-focus-back{
  display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);
  background:var(--card);color:var(--muted);font:700 12px "DM Sans";cursor:pointer;
  border-radius:8px;padding:7px 12px;margin:0 0 12px;transition:color .15s,border-color .15s}
.term-focus-back:hover{color:var(--ink);border-color:var(--muted)}
.term-focus-back .ic{width:15px;height:15px}
/* the back button only belongs in focus mode */
.term-grid:not(.term-focus) .term-focus-back{display:none}
@media(min-width:901px){
  .term-grid.term-focus{grid-template-columns:minmax(0,1fr) 360px;grid-template-areas:"detail trade"}
}
@media(min-width:1120px){
  .term-grid.term-focus{grid-template-columns:minmax(0,1fr) 400px;grid-template-areas:"detail trade"}
}

/* ============================================================
   COPY-CA BUTTONS on the Tokens list (cards + table) + card affordance
   ============================================================ */
.tc-addrrow,.tk-addrrow{display:inline-flex;align-items:center;gap:5px;min-width:0}
.tc-copy,.tk-copy{
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  border:0;background:transparent;color:var(--muted);cursor:pointer;
  border-radius:6px;padding:2px;line-height:0;transition:background .15s,color .15s}
.tc-copy .ic{width:14px;height:14px}
.tk-copy .ic{width:13px;height:13px}
.tc-copy:hover,.tk-copy:hover{background:var(--chipbg);color:var(--green-dark)}
.tc-copy.ok,.tk-copy.ok{color:var(--green-dark)}
.tc-copy.err,.tk-copy.err{color:var(--red)}
:root[data-theme="dark"] .tc-copy:hover,:root[data-theme="dark"] .tk-copy:hover{color:#ccff00}
:root[data-theme="dark"] .tc-copy.ok,:root[data-theme="dark"] .tk-copy.ok{color:#ccff00}
/* a card is a button now — signal it, but keep inner links/buttons normal */
.token-card[role="button"]{cursor:pointer}
.token-card[role="button"]:focus-visible{outline:2px solid var(--green-dark);outline-offset:2px}
.token-card .tc-addr,.token-card .tc-copy,.token-card .tr-scan{cursor:pointer}

/* ============================================================
   GRADUATED badges — Tokens table + focus detail head
   (card badge uses the existing .tc-badge.grad rule)
   ============================================================ */
.tk-grad{display:inline-block;font:700 8.5px "DM Sans";letter-spacing:.06em;text-transform:uppercase;
  background:var(--green-dark);color:#fff;border-radius:4px;padding:2px 5px;margin-right:4px;vertical-align:middle}
:root[data-theme="dark"] .tk-grad{background:#ccff00;color:#0b0d0e}
.td-grad{display:inline-block;font:700 10px "DM Sans";letter-spacing:.04em;
  background:#0b0d0e;color:var(--green);border:1px solid var(--green-dark);border-radius:6px;padding:3px 9px;vertical-align:middle}
:root[data-theme="dark"] .td-grad{background:rgba(204,255,0,.12);color:#ccff00;border-color:rgba(204,255,0,.4)}
:root[data-theme="dark"] .tc-badge.grad{background:rgba(204,255,0,.14);color:#ccff00}

/* ============================================================
   LIVE TRADES feed — token focus/detail view (real Swap events)
   Collapsible: header always shows, the table opens on tap so the
   chart keeps the column's height by default.
   ============================================================ */
.term-trades{flex:0 0 auto;margin-top:12px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--card)}
/* header toggle */
.tt-toggle{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;cursor:pointer;
  padding:9px 12px;font:700 12px "DM Sans";color:var(--ink);text-align:left}
.tt-toggle:hover{background:var(--fill)}
.tt-title{display:inline-flex;align-items:center;gap:6px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:11px}
.tt-title .ic{width:14px;height:14px}
.tt-split{margin-left:auto;font-size:11px;color:var(--muted);font-weight:600}
.tt-split .tt-b{color:var(--green-dark)}.tt-split .tt-s{color:var(--red)}
:root[data-theme="dark"] .tt-split .tt-b{color:#3fd98a}:root[data-theme="dark"] .tt-split .tt-s{color:#ff6a7d}
.tt-chev{display:inline-flex;color:var(--muted);transition:transform .18s}
.tt-chev .ic{width:16px;height:16px}
.term-trades .tt-chev{transform:rotate(-90deg)}         /* collapsed → points down */
.term-trades.is-open .tt-chev{transform:rotate(90deg)}  /* open → points up */
/* body collapses unless open */
.tt-body{display:none;border-top:1px solid var(--line)}
.term-trades.is-open .tt-body{display:block}
.tt-head,.tt-row{display:grid;grid-template-columns:64px 1fr 1fr 52px;align-items:center;gap:8px;padding:7px 12px;font-size:12px}
.tt-head{font:700 10px "DM Sans";letter-spacing:.05em;text-transform:uppercase;color:var(--muted);background:var(--fill);border-bottom:1px solid var(--line)}
.tt-h-amt,.tt-h-price{text-align:right}.tt-h-age{text-align:right}
.tt-rows{max-height:280px;overflow-y:auto;scrollbar-width:thin}
.tt-row{border-top:1px solid var(--hair);font-variant-numeric:tabular-nums}
.tt-row:first-child{border-top:0}
.tt-side{font:700 10px "DM Sans";letter-spacing:.04em;border-radius:4px;padding:2px 6px;justify-self:start;text-align:center}
.tt-buy .tt-side{background:rgba(0,200,5,.14);color:var(--green-dark)}
.tt-sell .tt-side{background:rgba(229,72,77,.14);color:var(--red)}
.tt-amt,.tt-price{text-align:right;font-weight:600}
.tt-buy .tt-amt{color:var(--green-dark)}.tt-sell .tt-amt{color:var(--red)}
.tt-price{color:var(--ink)}
.tt-age{text-align:right;color:var(--muted);font-size:11px}
:root[data-theme="dark"] .tt-buy .tt-side{background:rgba(32,212,122,.18);color:#3fd98a}
:root[data-theme="dark"] .tt-buy .tt-amt{color:#3fd98a}
:root[data-theme="dark"] .tt-sell .tt-side{background:rgba(255,84,112,.18);color:#ff6a7d}
:root[data-theme="dark"] .tt-sell .tt-amt{color:#ff6a7d}
@media(max-width:480px){.tt-head,.tt-row{grid-template-columns:54px 1fr 1fr 42px;gap:6px;padding:6px 10px}}