/* ==== styles.css */
/* Memeswap.fun v1.1, dark glass product UI. Palette shared with the basket views (src/basketview.ts). */
:root{--bg:#0b0d12;--panel:#12151c;--panel2:#161a23;--line:#1f2530;--line2:#2b3444;--dim:#6b7280;--dim2:#9ca3af;--fg:#e5e7eb;--green:#34d399;--red:#f87171;--cyan:#67e8f9;--yellow:#fde68a;--amber:#fbbf24;--violet:#a78bfa;
  --glass:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015));--gline:rgba(255,255,255,.08);--gline2:rgba(255,255,255,.14);
  --sans:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;--mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --r:12px;--r2:8px;--shadow:0 12px 40px rgba(0,0,0,.45)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html,body{margin:0;background:var(--bg);color:var(--fg);font:14px/1.45 var(--sans);overflow-x:hidden}
body{min-height:100vh}
a{color:var(--cyan);text-decoration:none}a:hover{text-decoration:underline}
button,input,select{font:inherit;color:var(--fg)}
button{cursor:pointer}
button:disabled{opacity:.5;cursor:not-allowed}
input,select{background:rgba(0,0,0,.35);border:1px solid var(--gline2);border-radius:var(--r2);padding:7px 10px;outline:none;min-width:0;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(103,232,249,.12)}
input[type=number]{-moz-appearance:textfield}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.dim{color:var(--dim)}.pos{color:var(--green)}.neg{color:var(--red)}.warn{color:var(--yellow)}.cyan{color:var(--cyan)}
.num,.mono{font-variant-numeric:tabular-nums}.mono{font-family:var(--mono)}
.hidden{display:none!important}
kbd{font-family:var(--mono);font-size:10px;padding:1px 5px;border:1px solid var(--gline2);border-bottom-width:2px;border-radius:4px;color:var(--dim2)}
::selection{background:rgba(52,211,153,.35)}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}

/* ambient glow */
.glow{position:fixed;inset:0;z-index:-1;pointer-events:none;background:
  radial-gradient(60% 40% at 15% -10%,rgba(52,211,153,.16),transparent 60%),
  radial-gradient(50% 35% at 90% 0%,rgba(103,232,249,.12),transparent 60%),
  radial-gradient(40% 30% at 60% 110%,rgba(167,139,250,.10),transparent 60%)}

/* header */
.top{display:flex;align-items:center;gap:16px;padding:10px 18px;background:rgba(11,13,18,.72);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--gline);position:sticky;top:0;z-index:20;flex-wrap:wrap}
.logo{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:17px;color:var(--fg);letter-spacing:-.01em}.logo:hover{text-decoration:none}
.logo .ltld{color:var(--green)}
.lmark{width:22px;height:22px;border-radius:50%;background:conic-gradient(from -90deg,var(--green) 0 78%,rgba(255,255,255,.08) 78% 100%);position:relative;flex:none}
.lmark::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--bg)}
.nav{display:flex;gap:4px}.nav a{color:var(--dim2);padding:5px 10px;border-radius:999px;font-weight:600}.nav a.on{color:var(--fg);background:rgba(255,255,255,.07)}.nav a:hover{text-decoration:none;color:var(--fg)}
.spacer{flex:1}
.wallets{display:flex;gap:8px;flex-wrap:wrap}
.mobile-actions,.mobile-menu-panel,.mobile-grid{display:none}
.wbtn{background:var(--glass);border:1px solid var(--gline2);border-radius:999px;padding:6px 12px;font-size:12px;font-weight:600;white-space:nowrap;transition:border-color .15s,background .15s,transform .1s}
.wbtn:hover{border-color:var(--cyan)}.wbtn:active{transform:scale(.98)}
.wbtn.on{border-color:rgba(52,211,153,.5);background:rgba(52,211,153,.08)}
.wbtn .bal{color:var(--dim);margin-left:6px;font-weight:400}
.wbtn .wico{margin-right:6px}
.wico{width:16px;height:16px;border-radius:4px;vertical-align:-3px;object-fit:cover;background:#1f2530;display:inline-block}
.wico.ph{display:inline-flex;align-items:center;justify-content:center;font-size:9px;color:var(--dim);border:1px solid var(--line2)}
/* wallets drawer (header) */
.drawer{position:absolute;right:16px;top:100%;margin-top:6px;width:min(520px,94vw);background:#141822;border:1px solid var(--gline2);border-radius:var(--r);box-shadow:var(--shadow);padding:8px;z-index:30;font-size:12px;animation:pop .16s ease-out}
@keyframes pop{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
.dhead{display:flex;align-items:center;gap:10px;padding:2px 4px 8px;border-bottom:1px solid var(--line)}
.dhead .dim{flex:1;font-size:11px}
.wrow{display:grid;grid-template-columns:20px minmax(0,1fr) auto auto;gap:6px 10px;align-items:center;padding:8px 4px;border-bottom:1px solid var(--line)}
.wrow.on{background:rgba(52,211,153,.06)}
.wrow .wico{width:20px;height:20px}
.wmeta{min-width:0;line-height:1.4}
.wmeta .addr{color:var(--fg);font-family:var(--mono)}
.wmeta select.acct{padding:1px 4px;font-size:11px}
.sig{display:flex;align-items:center;gap:4px;color:var(--dim2);white-space:nowrap;cursor:pointer}
.sig input{accent-color:var(--green);margin:0}
.wrow.on .sig{color:var(--green)}
.dadd{display:flex;flex-direction:column;gap:6px;padding:8px 4px 2px}
.dadd .wallet-native{width:100%;min-height:44px;margin:2px 0 0}.native-note{font-size:11px;line-height:1.4;padding:0 3px 4px}
/* modals */
.modal[hidden]{display:none}
.modal{position:fixed;inset:0;background:rgba(3,5,9,.66);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:40;display:flex;align-items:center;justify-content:center;padding:16px;animation:fade .18s ease-out}
@keyframes fade{from{opacity:0}to{opacity:1}}
.mbox{width:min(440px,100%);background:#141822;border:1px solid var(--gline2);border-radius:16px;padding:14px;box-shadow:var(--shadow);animation:pop .2s ease-out}
.mhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.prow{display:grid;grid-template-columns:22px 1fr auto;gap:10px;align-items:center;width:100%;text-align:left;background:rgba(0,0,0,.3);border:1px solid var(--gline2);border-radius:10px;padding:10px 12px;margin-top:6px;transition:border-color .15s}
.prow:hover{border-color:var(--cyan)}.prow.on{border-color:var(--green)}.prow.off{opacity:.55;cursor:not-allowed}
.prow .wico{width:22px;height:22px}
.prow .pname{font-weight:700}
.prow .dim{font-size:11px;text-align:right}
/* onboarding */
.onb .mbox{width:min(480px,100%);padding:0;overflow:hidden}
.obody{padding:26px 26px 10px;min-height:290px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px}
.oart{width:96px;height:96px;border-radius:28px;display:grid;place-items:center;font-size:44px;background:var(--glass);border:1px solid var(--gline2);box-shadow:inset 0 0 40px rgba(52,211,153,.08)}
.oart svg{width:60px;height:60px}
.obody h2{font-size:20px;margin:6px 0 0;color:var(--fg);text-transform:none;letter-spacing:0}
.obody p{margin:0;color:var(--dim2);font-size:14px;line-height:1.55;max-width:380px}
.odots{display:flex;gap:6px;margin-top:6px}.odots i{width:6px;height:6px;border-radius:50%;background:var(--line2)}.odots i.on{background:var(--green);width:18px;border-radius:3px}
.ofoot{display:flex;align-items:center;gap:8px;padding:12px 16px 16px;border-top:1px solid var(--line)}
.odont{display:flex;align-items:center;gap:6px;color:var(--dim);font-size:12px;cursor:pointer}.odont input{accent-color:var(--green);margin:0}
.olegend{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-top:4px}
.olegend span{font-size:11px;padding:2px 8px;border-radius:999px;border:1px solid var(--gline2)}
.olegend .ok{color:var(--green);border-color:rgba(52,211,153,.4)}.olegend .warn{color:var(--amber);border-color:rgba(251,191,36,.4)}.olegend .bad{color:var(--red);border-color:rgba(248,113,113,.4)}

.banner{padding:6px 16px;background:#2a2410;color:var(--yellow);border-bottom:1px solid #4a3f12;font-size:12px}
.foot[hidden]{display:none}
.foot{display:flex;flex-direction:column;gap:24px;padding:36px clamp(20px,4vw,64px) 28px;color:#879288;font-size:12px;border-top:1px solid var(--gline);margin-top:36px}
.foot-groups{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px;width:100%;max-width:1200px;margin-inline:auto}
.foot-groups nav{display:flex;flex-direction:column;align-items:flex-start;gap:2px}.foot-groups b{color:#b4c0b6;font-size:12px;letter-spacing:.055em;margin-bottom:10px}
.foot-groups a{display:inline-flex;min-height:32px;align-items:center;text-decoration:none}.foot-groups a:hover{text-decoration:underline}.foot-groups a:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:2px}
.foot-disclosures{display:grid;gap:5px;max-width:960px}.foot-company{padding-top:12px;border-top:1px solid var(--gline)}
main{padding:14px clamp(10px,1.4vw,26px);max-width:min(2560px,100%);margin:0 auto}
.loading{color:var(--dim);padding:40px;text-align:center}
/* Reserved space for the token list (CLS 0.5 desktop, 1.0 phone before this, PageSpeed 2026-09-17). The
   catalogue arrives seconds after first paint and used to push the SEO section and footer a whole screen
   down. The shell keeps the home view at least one viewport tall and paints a skeleton where the toolbar,
   discovery controls and first rows land (index.html), so nothing already on screen moves when it fills.
   Measured on the rendered page: toolbar 33px search + 26px pills, controls 81px (128px phone), header
   row 46px, rows 58px desktop and 68px phone. */
#app:not([data-page]),#app[data-page="home"]{min-height:100vh}
.app-loading{padding:0 0 10px;text-align:left;font-size:12px}
.app-skeleton{pointer-events:none}
.sk-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 10px}
.sk-q{flex:0 1 280px;min-width:180px;height:33px;border-radius:10px;background:rgba(255,255,255,.05)}
.sk-pills{display:flex;gap:4px;flex-wrap:wrap}.sk-pills i{display:block;width:58px;height:26px;border-radius:999px;border:1px solid var(--gline2)}
.sk-controls{height:81px;margin:0 0 12px;border-radius:14px;background:rgba(255,255,255,.03)}
.sk-list{border:1px solid var(--gline);border-radius:16px;background:var(--glass);overflow:hidden}
.sk-head{height:46px;border-bottom:1px solid var(--line)}
.sk-row{height:57px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;padding:0 10px}
.sk-row:last-child{border-bottom:0}
.sk-row::before{content:"";width:26px;height:26px;border-radius:50%;background:#1f2530;flex:none}
.sk-row::after{content:"";width:140px;height:12px;border-radius:6px;background:rgba(255,255,255,.06)}
@media (max-width:700px){.sk-q{flex-basis:100%;height:44px}.sk-pills{width:100%;flex-wrap:nowrap;overflow:hidden}.sk-pills i{height:40px;flex:none}.sk-controls{height:128px}.sk-list{border-radius:0;margin:0 -10px;border-width:1px 0 0;background:transparent}.sk-head{display:none}.sk-row{height:68px;padding:0 12px}.sk-row::before{width:34px;height:34px}}
h1{font-size:20px;margin:0;letter-spacing:-.01em}h2{font-size:11px;margin:14px 0 8px;color:var(--dim);text-transform:uppercase;letter-spacing:.1em;font-weight:600}

/* ---------- hero ---------- */
.hero{position:relative;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:18px;align-items:center;padding:28px 28px 22px;margin:4px 0 16px;border-radius:20px;border:1px solid var(--gline);background:var(--glass);overflow:hidden}
.hero::before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 180deg at 70% 40%,rgba(52,211,153,.10),rgba(103,232,249,.08),rgba(167,139,250,.10),rgba(52,211,153,.10));filter:blur(60px);opacity:.8;pointer-events:none;animation:drift 18s linear infinite}
@keyframes drift{to{transform:rotate(360deg)}}
.hero>*{position:relative}
.hero h1{font-size:clamp(26px,3.6vw,40px);line-height:1.08;font-weight:800;letter-spacing:-.02em;margin:0}
.hero h1 .grad{background:linear-gradient(90deg,var(--green),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .sub{margin:10px 0 0;color:var(--dim2);font-size:15px;max-width:520px}
.hero .cta{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.hero .cta .go{width:auto;margin:0;padding:9px 16px;font-size:13px}
.hero .cta .ghost{background:transparent;border:1px solid var(--gline2);color:var(--fg)}
.counters{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.cnt{padding:14px 12px;border-radius:14px;background:rgba(0,0,0,.28);border:1px solid var(--gline);text-align:center;min-width:0}
.cnt .v{font-size:clamp(24px,3vw,34px);font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1}
.cnt .l{font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.1em;margin-top:6px}
.cnt.ok .v{color:var(--green)}.cnt.cy .v{color:var(--cyan)}.cnt.vi .v{color:var(--violet)}
.live{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--dim2)}
.live i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(52,211,153,.6);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,.6)}70%{box-shadow:0 0 0 8px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}

/* strips (trending / made it) */
.strips{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
.strip{border:1px solid var(--gline);border-radius:16px;background:var(--glass);padding:12px 12px 10px;min-width:0}
.strip h2{margin:0 0 8px;display:flex;align-items:center;gap:8px}
.strip h2 .fire{font-size:14px}
.srow{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:4px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.scard{flex:0 0 auto;width:150px;scroll-snap-align:start;display:flex;flex-direction:column;gap:6px;padding:10px;border-radius:12px;background:rgba(0,0,0,.28);border:1px solid var(--gline);cursor:pointer;transition:transform .15s,border-color .15s,background .15s}
.scard:hover{transform:translateY(-2px);border-color:var(--gline2);background:rgba(255,255,255,.05)}
.scard .h{display:flex;align-items:center;gap:8px;min-width:0}
.scard .h b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.scard img,.scard .ph{width:24px;height:24px;border-radius:50%;background:#1f2530;object-fit:cover;flex:none}
.scard .ph{display:inline-flex;align-items:center;justify-content:center;font-size:9px;color:var(--dim)}
.scard .spark{width:100%;height:28px}
.scard .f{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--dim)}
.scard .rank{font-size:10px;color:var(--dim);font-weight:700}
.strip .empty{padding:14px}

/* toolbar */
.bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 10px;color:var(--dim);font-size:12px}
.bar .search{position:relative;flex:0 1 280px;min-width:180px}
.bar .search input{width:100%;padding-left:30px}
.bar .search .si{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--dim);pointer-events:none;font-size:13px}
.bar .search kbd{position:absolute;right:8px;top:50%;transform:translateY(-50%)}
.pills{display:flex;gap:4px;flex-wrap:wrap}
.pill{background:transparent;border:1px solid var(--gline2);border-radius:999px;padding:3px 11px;font-size:11px;color:var(--dim2);transition:border-color .15s,color .15s,background .15s}
.pill:hover{border-color:var(--cyan);color:var(--fg)}.pill.on{border-color:rgba(52,211,153,.6);color:var(--green);background:rgba(52,211,153,.08)}
.pill small{color:var(--dim);margin-left:4px}
.seg.view{border-radius:999px;border-color:var(--gline2)}.seg.view button{padding:4px 12px;font-size:11px;font-weight:600}.seg.view button.on{background:rgba(255,255,255,.08);color:var(--fg)}
.bar select{padding:4px 8px;font-size:11px}

/* chain badges (per-chain colour) */
.cb{display:inline-block;font-size:9px;padding:0 6px;border-radius:999px;border:1px solid var(--line2);color:var(--dim2);text-transform:uppercase;letter-spacing:.06em;vertical-align:middle;line-height:15px;font-weight:700;background:rgba(255,255,255,.03)}
.cb.robinhood{color:#34d399;border-color:rgba(52,211,153,.45);background:rgba(52,211,153,.08)}
.cb.solana{color:#c4b5fd;border-color:rgba(153,69,255,.5);background:rgba(153,69,255,.10)}
.cb.ethereum{color:#93c5fd;border-color:rgba(98,126,234,.5);background:rgba(98,126,234,.10)}
.cb.base{color:#60a5fa;border-color:rgba(0,82,255,.55);background:rgba(0,82,255,.12)}
.cb.bsc{color:#fbbf24;border-color:rgba(243,186,47,.5);background:rgba(243,186,47,.10)}
.cb.hyperevm{color:#5eead4;border-color:rgba(80,227,194,.5);background:rgba(80,227,194,.10)}
.cb.ton{color:#7dd3fc;border-color:rgba(0,152,234,.55);background:rgba(0,152,234,.12)}
.cb.pulsechain{color:#f9a8d4;border-color:rgba(232,62,140,.5);background:rgba(232,62,140,.10)}
.cb.ink{color:#c4b5fd;border-color:rgba(113,50,245,.55);background:rgba(113,50,245,.12)}
.cb.arbitrum{color:#7dd3fc;border-color:rgba(40,160,240,.5);background:rgba(40,160,240,.10)}
.cb.avalanche{color:#fca5a5;border-color:rgba(232,65,66,.5);background:rgba(232,65,66,.10)}
.cb.polygon{color:#d8b4fe;border-color:rgba(130,71,229,.5);background:rgba(130,71,229,.10)}
.cb.optimism{color:#fda4af;border-color:rgba(255,4,32,.45);background:rgba(255,4,32,.10)}
.cb.sonic{color:#fdba74;border-color:rgba(251,146,60,.5);background:rgba(251,146,60,.10)}
.cb.linea{color:#e5e7eb;border-color:rgba(255,255,255,.3)}
.cb.berachain{color:#fcd34d;border-color:rgba(245,158,11,.5);background:rgba(245,158,11,.10)}
.cb.monad{color:#c4b5fd;border-color:rgba(131,110,249,.5);background:rgba(131,110,249,.10)}
.cb.unichain{color:#f9a8d4;border-color:rgba(255,0,122,.5);background:rgba(255,0,122,.10)}
.cb.blast{color:#fde047;border-color:rgba(252,252,3,.4);background:rgba(252,252,3,.08)}
.cb.mantle{color:#99f6e4;border-color:rgba(20,184,166,.5)}.cb.cronos{color:#93c5fd;border-color:rgba(0,45,116,.8)}.cb.zksync{color:#c7d2fe;border-color:rgba(99,102,241,.5)}.cb.scroll{color:#fde68a;border-color:rgba(255,238,218,.4)}.cb.abstract{color:#86efac;border-color:rgba(34,197,94,.5)}

/* anti-rug ring */
.rug{display:inline-flex;align-items:center;gap:6px;cursor:help;outline:none;border-radius:999px}
.rug:focus-visible{box-shadow:0 0 0 2px var(--cyan)}
.ring{display:block;flex:none}
.ring .bg{fill:none;stroke:rgba(255,255,255,.08)}
.ring .fg{fill:none;stroke-linecap:round;transition:stroke-dashoffset .8s cubic-bezier(.2,.8,.2,1)}
.ring text{fill:var(--fg);font-weight:800;font-family:var(--sans);font-variant-numeric:tabular-nums}
.ring.ok .fg{stroke:var(--green)}.ring.warn .fg{stroke:var(--amber)}.ring.bad .fg{stroke:var(--red)}
.ring.ok text{fill:var(--green)}.ring.warn text{fill:var(--amber)}.ring.bad text{fill:var(--red)}
.rband{font-size:10px;font-weight:700;padding:1px 7px;border-radius:999px;border:1px solid;white-space:nowrap}
.rband.ok{color:var(--green);border-color:rgba(52,211,153,.45);background:rgba(52,211,153,.08)}
.rband.warn{color:var(--amber);border-color:rgba(251,191,36,.45);background:rgba(251,191,36,.08)}
.rband.bad{color:var(--red);border-color:rgba(248,113,113,.45);background:rgba(248,113,113,.08)}
.rugbig{display:flex;align-items:center;gap:16px;padding:12px 14px;border-radius:14px;background:rgba(0,0,0,.28);border:1px solid var(--gline);cursor:help}
.rugbig .ring.ok{filter:drop-shadow(0 0 10px rgba(52,211,153,.35))}.rugbig .ring.warn{filter:drop-shadow(0 0 10px rgba(251,191,36,.3))}.rugbig .ring.bad{filter:drop-shadow(0 0 10px rgba(248,113,113,.3))}
.rugbig .rl{display:flex;flex-direction:column;gap:4px;min-width:0}
.rugbig .rl .t{font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.1em}
.rugbig .rl .hint{font-size:11px;color:var(--dim)}
.rugbd{display:grid;grid-template-columns:1fr;gap:6px;margin-top:10px}
.rugbd .p{display:grid;grid-template-columns:130px 1fr 44px;gap:8px;align-items:center;font-size:11px}
.rugbd .p .n{color:var(--dim2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rugbd .p .b{height:6px;border-radius:3px;background:rgba(255,255,255,.07);overflow:hidden}
.rugbd .p .b i{display:block;height:100%;border-radius:3px;background:var(--green)}
.rugbd .p.warn .b i{background:var(--amber)}.rugbd .p.bad .b i{background:var(--red)}.rugbd .p.bonus .b i{background:var(--cyan)}
.rugbd .p .s{text-align:right;color:var(--dim2);font-variant-numeric:tabular-nums}
.rugbd .why{grid-column:1/-1;color:var(--dim);font-size:10px;margin:-3px 0 2px;padding-left:2px;white-space:normal}
/* tooltip */
.tip{position:fixed;z-index:60;width:min(340px,92vw);background:#161a24;border:1px solid var(--gline2);border-radius:12px;padding:10px 12px;box-shadow:var(--shadow);font-size:12px;pointer-events:none;animation:pop .12s ease-out}
.tip[hidden]{display:none}
.tip .th{display:flex;align-items:center;gap:8px;margin-bottom:2px}.tip .th b{font-size:13px}
.tip .rugbd{margin-top:6px}.tip .rugbd .p{grid-template-columns:120px 1fr 40px}

/* table */
.wrap{overflow-x:auto;background:var(--glass);border:1px solid var(--gline);border-radius:16px;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;min-width:1240px;white-space:nowrap}
th,td{padding:8px 10px;text-align:right;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
th{color:var(--dim);font-weight:600;font-size:11px;cursor:pointer;user-select:none;position:sticky;top:0;background:#12151c;z-index:1;letter-spacing:.04em;text-transform:uppercase}
th.on{color:var(--cyan)}th:hover{color:var(--fg)}th.l,td.l{text-align:left}
tbody tr{cursor:pointer;transition:background .12s}
tbody tr:hover{background:rgba(255,255,255,.045)}
tbody tr:hover .tk .nm b{color:var(--cyan)}
tbody tr:last-child td{border-bottom:0}
.tk{display:flex;align-items:center;gap:10px;min-width:210px}
.tk img,.tk .ph{width:26px;height:26px;border-radius:50%;background:#1f2530;flex:none;object-fit:cover;box-shadow:0 0 0 1px var(--gline)}
.tk .ph{display:inline-flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:var(--dim2);background:linear-gradient(135deg,#1f2530,#2b3444)}
.tk .nm{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.tk .nm b{color:var(--fg);transition:color .12s}.tk .nm small{color:var(--dim);font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:150px}
.chip{display:inline-block;min-width:58px;padding:2px 6px;border-radius:6px;font-size:12px;text-align:right;font-variant-numeric:tabular-nums}
.chip.pos{background:rgba(52,211,153,.12);color:var(--green)}.chip.neg{background:rgba(248,113,113,.12);color:var(--red)}.chip.zero{color:var(--dim)}
.badge{display:inline-block;padding:0 6px;border-radius:999px;font-size:11px;border:1px solid transparent;line-height:17px}
.badge.pos{border-color:rgba(52,211,153,.4);color:var(--green)}.badge.neg{border-color:rgba(248,113,113,.4);color:var(--red)}.badge.warn{border-color:rgba(253,230,138,.35);color:var(--yellow)}.badge.dim{border-color:var(--line2);color:var(--dim)}
.spark{width:110px;height:26px;display:block}
.flash-up{animation:fu 1.2s ease-out}.flash-down{animation:fd 1.2s ease-out}
@keyframes fu{0%{background:rgba(52,211,153,.35);color:#fff}100%{background:transparent}}
@keyframes fd{0%{background:rgba(248,113,113,.35);color:#fff}100%{background:transparent}}
.foot-row td{color:var(--dim);font-size:11px;background:rgba(0,0,0,.15)}
.empty{padding:36px 20px;text-align:center;color:var(--dim);display:flex;flex-direction:column;align-items:center;gap:8px}
.empty .ei{font-size:30px;opacity:.6}
.empty .pill{margin-top:4px}

/* skeletons */
.sk{position:relative;overflow:hidden;background:rgba(255,255,255,.06);border-radius:6px;display:inline-block;height:12px;width:100%}
.sk::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);animation:shimmer 1.4s infinite}
@keyframes shimmer{to{transform:translateX(100%)}}
.sk.c{border-radius:50%;width:26px;height:26px}
.skrows{padding:4px 0}
.skrow{display:grid;grid-template-columns:30px 26px 1fr 90px 70px 70px 70px 90px 90px 110px;gap:12px;align-items:center;padding:9px 12px;border-bottom:1px solid var(--line)}
.skcard{height:190px;border-radius:16px}

/* cards view */
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(225px,1fr));gap:12px}
.tcard{position:relative;display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:16px;background:var(--glass);border:1px solid var(--gline);cursor:pointer;transition:transform .15s,border-color .15s,box-shadow .15s;min-width:0;overflow:hidden}
.tcard:hover{transform:translateY(-3px);border-color:var(--gline2);box-shadow:0 14px 30px rgba(0,0,0,.35)}
.tcard .ch{display:flex;align-items:center;gap:10px;min-width:0}
.tcard .ch img,.tcard .ch .ph{width:44px;height:44px;border-radius:50%;object-fit:cover;background:#1f2530;flex:none;box-shadow:0 0 0 1px var(--gline)}
.tcard .ch .ph{display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--dim2);background:linear-gradient(135deg,#1f2530,#2b3444)}
.tcard .ch .nm{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.2}
.tcard .ch .nm b{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tcard .ch .nm small{color:var(--dim);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tcard .ch .rug{flex:none}
.tcard .spark{width:100%;height:44px}
.tcard .pr{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.tcard .pr .p{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.tcard .st{display:flex;justify-content:space-between;font-size:11px;color:var(--dim)}
.tcard .st b{color:var(--fg);font-weight:600;font-variant-numeric:tabular-nums}
.tcard .buy{margin-top:2px;width:100%;padding:8px;border-radius:10px;border:1px solid rgba(52,211,153,.45);background:rgba(52,211,153,.10);color:var(--green);font-weight:700;font-size:13px;transition:background .15s}
.tcard .buy:hover{background:rgba(52,211,153,.22)}
.tcard .rk{position:absolute;top:10px;right:12px;font-size:10px;color:var(--dim);font-weight:700}
.tcard .p.flash-up,.tcard .p.flash-down{border-radius:6px;padding:0 4px;margin:0 -4px}

/* token page */
.thead{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:4px 0 14px}
.thead img,.thead .ph{width:56px;height:56px;border-radius:50%;background:#1f2530;object-fit:cover;box-shadow:0 0 0 1px var(--gline),0 8px 24px rgba(0,0,0,.4)}
.thead .ph{display:inline-flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:var(--dim2);background:linear-gradient(135deg,#1f2530,#2b3444)}
.thead .tinfo{flex:1;min-width:220px}
.thead .links{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;margin-top:4px}
.thead .addr{color:var(--dim);font-size:11px;word-break:break-all;font-family:var(--mono);margin-top:2px}
/* Token stat row. auto-fit, not auto-fill: auto-fill keeps empty tracks alive and strands a dead
   column at wide widths. Every card is the same height because no card is allowed to wrap. */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:10px;margin-bottom:14px}
.card{position:relative;background:var(--glass);border:1px solid var(--gline);border-radius:14px;padding:11px 13px 12px;min-width:0;overflow:hidden;transition:border-color .15s,transform .12s}
.card::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,var(--gline2),transparent);opacity:.7}
.card:hover{border-color:var(--gline2);transform:translateY(-1px)}
.card .l{font-size:10px;color:var(--dim);text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.card .v{font-size:19px;font-weight:800;margin-top:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:-.015em;font-variant-numeric:tabular-nums}
.card .s{font-size:11px;color:var(--dim);margin-top:4px;min-height:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* The price is what the eye goes to first, so it is the only card that says so. */
.card.lead{background:linear-gradient(180deg,rgba(52,211,153,.10),rgba(255,255,255,.015));border-color:rgba(52,211,153,.22)}
.card.lead .v{font-size:22px}
/* Four windows, each labelled. Unlabelled chips are just percentages in a row: you cannot tell 5m
   from 24h, and four of them wrapping is what doubled this card's height and the whole row with it. */
.card.card-change .v{display:grid;grid-template-columns:repeat(4,auto);justify-content:space-between;gap:2px 8px;font-size:12px;font-weight:700;margin-top:4px;white-space:normal}
.card.card-change .w{min-width:0;text-align:center}
.card.card-change .wl{display:block;font-size:9px;font-weight:600;color:var(--dim);letter-spacing:.08em;text-transform:uppercase}
.card.card-change .chip{display:block;min-width:0;padding:0;background:none;text-align:center;font-size:12px}
.tgrid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:14px;align-items:start}
.panel{max-width:100%;min-width:0;background:var(--glass);border:1px solid var(--gline);border-radius:16px;padding:14px}
#app[data-page="token"]{min-width:0;max-width:100%;overflow-x:clip;overscroll-behavior-x:none;touch-action:pan-y}
#app[data-page="token"] .tgrid,#app[data-page="token"] .tgrid>div{min-width:0;max-width:100%}
.panel h2{margin-top:0}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:4px 12px;font-size:12px}
.kv .k{color:var(--dim)}
.kv .v{text-align:right;overflow:hidden;text-overflow:ellipsis}
.flags{display:flex;gap:4px;flex-wrap:wrap}

/* Intelligence. The .kv two-column grid was written for the 380px swap column; in the main column it
   is ~1900px wide, so a three-letter label sat at one end and its value at the other with nothing
   joining them. Tiles keep each label touching its own value at any width. */
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(196px,1fr));gap:8px}
.fact{background:rgba(0,0,0,.22);border:1px solid var(--gline);border-radius:12px;padding:9px 11px;min-width:0}
.fact .k{display:block;font-size:10px;color:var(--dim);text-transform:uppercase;letter-spacing:.09em;font-weight:600}
.fact .v{display:block;margin-top:4px;font-size:13px;line-height:1.35;overflow-wrap:anywhere}
.fact .v .dim{font-size:11px}
/* Not checked is not the same claim as checked and clean, so it never borrows a verdict's styling. */
.fact.unknown{background:none;border-style:dashed;border-color:var(--line)}
.fact.unknown .v{color:var(--dim);font-style:italic}
.panel-split{margin:14px 0 10px;padding-top:12px;border-top:1px solid var(--gline);display:flex;align-items:baseline;gap:8px}
.panel-split h2{margin:0}
.panel-split .hint{font-size:11px;color:var(--dim)}
/* A missing safety scan is an absence worth seeing, not a footnote in body text. */
.scan-missing{display:flex;align-items:center;gap:8px;padding:9px 11px;border:1px dashed rgba(253,230,138,.28);border-radius:12px;background:rgba(253,230,138,.05);color:var(--yellow);font-size:12px}
.candles{width:100%;height:260px;display:block}
.candles .g{stroke:var(--line);stroke-width:1}
.candles text{fill:var(--dim);font-size:10px;font-family:var(--mono)}
.socials a{margin-right:10px}

/* swap panel, one vertical flow: pay box, divider, receive box, quote, confirm */
.swap{--swap-bg:#101711;position:sticky;top:64px;overflow:hidden;padding:18px;border-radius:24px;background:linear-gradient(172deg,#141c16 0%,#0d120f 100%);border-color:rgba(225,255,210,.14);box-shadow:0 30px 80px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.04)}
.swap:before{content:"";position:absolute;left:50%;top:-190px;width:460px;height:300px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(163,255,18,.09),transparent);pointer-events:none}
.shead{display:none}
.trade-screen{position:relative;display:flex;flex-direction:column;gap:12px}
.trade-title{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:34px;padding-inline:2px}
.trade-token-identity{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:800;letter-spacing:-.025em}.trade-token-identity>span{min-width:0}.trade-token-identity small{display:block;margin-top:2px;color:var(--dim);font-size:10px;font-weight:650;letter-spacing:.035em;text-transform:uppercase}.trade-token-logo,.trade-token-identity .ph{width:40px;height:40px;border-radius:13px;object-fit:cover;display:grid;place-items:center;background:#151d15;border:1px solid rgba(255,255,255,.12);box-shadow:0 8px 20px rgba(0,0,0,.28);font-size:11px}
.seg{display:flex;padding:3px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(0,0,0,.23)}
.seg button{flex:1;border:0;border-radius:10px;background:transparent;padding:9px;color:var(--dim2);font-weight:800;transition:background .15s,color .15s,box-shadow .15s}
.seg button.on.buy{background:#b6ff43;color:#0c1308;box-shadow:0 5px 16px rgba(182,255,67,.18)}.seg button.on.sell{background:#ff786f;color:#240705;box-shadow:0 5px 16px rgba(255,120,111,.18)}
.trade-flow{display:flex;flex-direction:column;gap:6px}
.trade-box{position:relative;display:grid;gap:8px;padding:14px 16px 12px;border-radius:18px;background:rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.07);transition:border-color .15s,box-shadow .15s}
.trade-box:focus-within{border-color:rgba(163,255,18,.45);box-shadow:0 0 0 3px rgba(163,255,18,.1)}
.trade-box-head{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--dim2);font-size:12px;font-weight:600}
.trade-box .trade-chain-filters{margin:0}
.trade-box-row{display:flex;align-items:center;gap:10px;min-height:48px}
.trade-box-row .amt{flex:1;min-width:0;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.trade-box-row .amt:focus-within{border:0;box-shadow:none}
.trade-box-row .amt input{width:100%;min-width:0;border:0;background:transparent;border-radius:0;padding:2px 0;font-size:32px;font-weight:700;line-height:1.2;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--fg);outline:0}
.trade-box-row .amt input::placeholder{color:#5c675e;opacity:1}
.trade-box-row .amt input:disabled{opacity:.55}
.trade-box-row [data-web-unit]{display:none}
.trade-out{flex:1;min-width:0;font-size:32px;font-weight:700;line-height:1.2;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:2px 0}
.trade-out:empty:before{content:"0.00";color:#5c675e}
.is-checking .trade-out:empty:before{color:#7f8c80;animation:blink 1.1s ease-in-out infinite}
/* Dollar-first trade entry. The toggle flips the pay field between USD and token
   units; the sub line always restates the amount in the other unit. */
.trade-box{overflow:hidden;min-width:0}
.trade-screen{container-type:inline-size;min-width:0;max-width:100%}
.trade-screen [hidden],.hbal[hidden]{display:none!important}
.trade-box-row>*{min-width:0}
.trade-box-head{min-width:0}.trade-box-row .amt{min-width:0;flex:1}.trade-box-row .amt input{width:100%;min-width:0}
@container (max-width:440px){
  .trade-box{padding:14px;border-radius:20px}
  .trade-box-row{flex-wrap:wrap;gap:10px}
  .trade-box-row .amt,.trade-box-row .trade-out{flex:1 1 100%;width:100%}
  .trade-box-row .trade-pill{max-width:100%;width:100%;box-sizing:border-box;min-width:0;justify-content:flex-start}
  .trade-pill select{width:100%;min-width:0}
  .trade-box-foot{flex-direction:column;align-items:flex-start;gap:12px}
  .trade-presets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;width:100%;margin:0}
  .trade-presets button{min-width:0;min-height:38px;padding:0 6px}
  .trade-unit-toggle{max-width:65%;font-size:10px}
}
.trade-unit-toggle{flex:none;padding:3px 9px;border:1px solid rgba(255,255,255,.12);border-radius:99px;background:rgba(255,255,255,.04);color:var(--dim2);font:inherit;font-size:10px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;cursor:pointer;white-space:nowrap;max-width:60%;overflow:hidden;text-overflow:ellipsis}
.trade-unit-toggle:hover:not(:disabled){border-color:rgba(163,255,18,.45);color:var(--fg)}
.trade-unit-toggle[aria-pressed="true"]{border-color:rgba(163,255,18,.35);color:var(--lime,#a3ff12)}
.trade-unit-toggle:disabled{opacity:.45;cursor:not-allowed}
.trade-amt-prefix{flex:none;font-size:32px;font-weight:700;line-height:1.2;letter-spacing:-.03em;color:var(--fg)}
.trade-amt-prefix:empty{display:none}
.trade-box-row .amt{display:flex;align-items:center;gap:2px}
.trade-box-sub{min-height:16px;color:var(--dim2);font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trade-box-sub:empty{min-height:0}
.trade-out{overflow:hidden;text-overflow:ellipsis}

.trade-pill{position:relative;display:inline-flex;align-items:center;gap:6px;flex:none;max-width:min(60%,250px);min-height:44px;padding:4px 4px 4px 6px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.11);transition:border-color .15s,background .15s,box-shadow .15s}
.trade-pill:hover{border-color:rgba(163,255,18,.42);background:rgba(163,255,18,.07)}
.trade-pill:focus-within{border-color:rgba(163,255,18,.62);box-shadow:0 0 0 3px rgba(163,255,18,.14)}
.trade-pill:has(select:disabled){background:rgba(255,255,255,.03);border-style:dashed;color:var(--dim2)}
.trade-pill:has(select:disabled):hover{border-color:rgba(255,255,255,.14);background:rgba(255,255,255,.03)}
.trade-pill:not(:has(select:not([hidden]))):not(:has(.trade-fixed:not([hidden]))):not(:has(.trade-pill-name:not(:empty))){display:none}
.trade-pill-logo{width:28px;height:28px;flex:none;border-radius:50%;overflow:hidden;background:#1a221c;display:grid;place-items:center}
.trade-pill-logo:empty{display:none}
.trade-pill-logo img,.trade-pill-logo .ph{width:28px;height:28px;border-radius:50%;object-fit:cover;display:inline-flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:var(--dim2);background:linear-gradient(135deg,#1f2a20,#2b3a2c)}
.trade-pill select{appearance:none;-webkit-appearance:none;flex:1;min-width:0;max-width:100%;padding:8px 28px 8px 4px;border:0;border-radius:999px;background:transparent url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%23a3ff12' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat right 10px center/12px;font-size:15px;font-weight:700;color:inherit;box-shadow:none;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;outline:0}
.trade-pill select:focus{border:0;box-shadow:none}
.trade-pill select:disabled{cursor:not-allowed;opacity:.7;background-image:none;padding-right:12px}
.trade-fixed,.trade-pill-name{padding:8px 12px 8px 4px;font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trade-pill-name:empty{display:none}
.trade-box-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:32px}
.trade-box-balance{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--dim2);font-size:12px;font-variant-numeric:tabular-nums}
.trade-box-balance:empty{display:none}
.trade-presets{display:flex;gap:6px;margin-left:auto}.trade-presets button{min-width:50px;min-height:32px;padding:0 12px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(255,255,255,.04);color:var(--dim2);font-size:12px;font-weight:700;transition:border-color .15s,background .15s,color .15s}.trade-presets button:hover:not(:disabled){border-color:rgba(163,255,18,.45);background:rgba(163,255,18,.09);color:#c8ff77}
.trade-divider{display:flex;justify-content:center;height:0;position:relative;z-index:2}
.trade-divider span{width:40px;height:40px;margin-top:-20px;border-radius:50%;display:grid;place-items:center;background:#161f18;border:1px solid rgba(255,255,255,.12);box-shadow:0 0 0 4px var(--swap-bg,#101711);color:var(--ms-volt,#b6ff43);font-size:18px;font-weight:700;line-height:1}
.trade-search{position:relative}
.trade-search:before{content:"";position:absolute;left:12px;top:50%;width:14px;height:14px;transform:translateY(-50%);background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2.2' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='m20 20-3.5-3.5'/></svg>") no-repeat center/contain;pointer-events:none}
.trade-search input{width:100%;min-height:40px;padding:8px 12px 8px 34px;border-radius:12px;background:rgba(0,0,0,.32);border:1px solid rgba(255,255,255,.08);font-size:14px}
.trade-search input::-webkit-search-cancel-button{-webkit-appearance:none}
.trade-search:has(input[hidden]){display:none}
.trade-pager{display:flex;gap:6px}.trade-pager:not(:has(button:not([hidden]))){display:none}.trade-pager .pill{min-height:32px}
.trade-connect{display:grid;gap:4px;padding:16px;border-radius:16px;border:1px dashed rgba(163,255,18,.38);background:rgba(163,255,18,.05);text-align:center}
.trade-connect b{font-size:14px}.trade-connect span{color:var(--dim2);font-size:12px;line-height:1.45}
.trade-connect-button{margin:10px auto 0;min-height:40px;padding:0 22px;border:0;border-radius:999px;background:var(--ms-volt,#b6ff43);color:#0b1204;font-weight:800;font-size:13px;transition:filter .15s,transform .1s}.trade-connect-button:hover{filter:brightness(1.05)}.trade-connect-button:active{transform:scale(.98)}
.trade-warning{display:grid;gap:6px;padding:12px 14px;border-radius:14px;border:1px solid rgba(251,191,36,.45);background:rgba(251,191,36,.08);color:var(--fg);font-size:12px;line-height:1.45}
.trade-warning b{color:var(--amber);font-size:13px}.trade-warning p{margin:0;color:var(--dim2)}
.trade-ack{display:flex;align-items:center;gap:8px;margin-top:2px;min-height:32px;font-weight:700;cursor:pointer;user-select:none}
.trade-ack input{width:18px;height:18px;margin:0;accent-color:var(--amber);cursor:pointer}
.trade-pill-badge{position:absolute;top:-9px;right:14px;z-index:1;padding:2px 7px;line-height:1.3;box-shadow:0 2px 8px rgba(0,0,0,.4);border-radius:999px;background:rgba(251,191,36,.16);border:1px solid rgba(251,191,36,.4);color:var(--amber);font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.trade-pill-badge:empty{display:none}
.trade-status{margin:0;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06);color:var(--dim2);font-size:12px;line-height:1.45;overflow-wrap:anywhere}
.is-checking .trade-status,.is-busy .trade-status{border-color:rgba(163,255,18,.25);color:var(--fg)}
.is-busy .trade-status{animation:blink 1.4s ease-in-out infinite}
.qbox{position:relative;display:grid;gap:6px;margin:0;padding:12px 14px;border-radius:16px;background:rgba(163,255,18,.045);border:1px solid rgba(163,255,18,.18);font-size:12px}
.qbox[hidden]{display:none}
.qbox:has(.dim:only-child){display:grid;place-items:center;text-align:center;border-style:dashed}
.qbox .kv{grid-template-columns:max-content 1fr}
.qbox .big{padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.07);font-size:18px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.qrow{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.qrow span{flex:none;color:var(--dim)}.qrow b{min-width:0;text-align:right;font-weight:600;color:var(--fg);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.qrow-wide{flex-direction:column;gap:2px;align-items:flex-start}.qrow-wide b{text-align:left}
.go{width:100%;margin-top:0;min-height:54px;padding:11px;border-radius:16px;border:0;font-weight:900;font-size:16px;letter-spacing:-.01em;background:linear-gradient(105deg,#b6ff43,#71f56d);color:#092007;box-shadow:0 10px 28px rgba(182,255,67,.17);transition:transform .1s,filter .15s}
.go:hover{filter:brightness(1.05)}.go:active{transform:scale(.99)}
.go.sell{background:linear-gradient(90deg,var(--red),#fb923c);color:#3b0a0a;box-shadow:0 6px 20px rgba(248,113,113,.25)}
.go:disabled{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.06);color:var(--dim);box-shadow:none;transform:none;filter:none;opacity:1}
.go.small{width:auto;margin:0;padding:7px 16px;font-size:13px}
.trade-secondary{display:flex;align-items:center;justify-content:center;width:100%;min-height:40px;border-radius:12px;font-size:12px;font-weight:600;color:var(--dim2);border-color:rgba(255,255,255,.1)}
.trade-secondary:hover:not(:disabled){border-color:rgba(163,255,18,.4);color:var(--fg)}
.trade-screen :is(button,select,input,summary):focus-visible{outline:2px solid var(--ms-volt,#b6ff43);outline-offset:2px}
.trade-box-row .amt input:focus-visible,.trade-pill select:focus-visible{outline:0}
.txlog{margin-top:10px;font-size:11px;display:flex;flex-direction:column;gap:3px}
.txlog .st{display:flex;gap:8px;align-items:baseline}
.txlog .st .dot{width:7px;height:7px;border-radius:50%;background:var(--dim);flex:none;display:inline-block}
.txlog .st.ok .dot{background:var(--green)}.txlog .st.err .dot{background:var(--red)}.txlog .st.run .dot{background:var(--yellow);animation:blink 1s infinite}
@keyframes blink{50%{opacity:.35}}
.note{font-size:11px;color:var(--dim);margin-top:8px}
.trade-details{margin-top:0;border-top:1px solid rgba(255,255,255,.07);padding-top:9px}.trade-details summary{cursor:pointer;color:var(--dim);font-size:11px;text-align:center;list-style:none;min-height:24px;line-height:24px}.trade-details summary::-webkit-details-marker{display:none}.trade-details summary:after{content:"  +";color:#b6ff43}.trade-details[open] summary:after{content:"  −"}.trade-details .note{line-height:1.55;padding:8px 2px 2px}
.field{margin-top:10px}
.field label{display:flex;justify-content:space-between;color:var(--dim);font-size:11px;margin-bottom:4px}
.field label button{background:none;border:0;color:var(--cyan);padding:0;font-size:11px}
.amt{display:flex;align-items:center;gap:8px;background:rgba(0,0,0,.35);border:1px solid var(--gline2);border-radius:10px;padding:4px 10px;transition:border-color .15s,box-shadow .15s}
.amt:focus-within{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(103,232,249,.12)}
.amt input{flex:1;border:0;background:transparent;padding:6px 0;font-size:20px;font-weight:800;width:100%;box-shadow:none}
.amt .unit{color:var(--dim);font-weight:700}
.slip{display:flex;gap:4px;align-items:center;margin-top:10px;font-size:11px;color:var(--dim)}
.slip[hidden]{display:none}
.slip .pill{padding:1px 8px}

/* bridge page */
.bridge{max-width:560px;margin:0 auto}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.row2 select,.row2 input{width:100%}

/* toasts */
.toasts{position:fixed;right:12px;bottom:12px;display:flex;flex-direction:column;gap:6px;z-index:70;max-width:min(420px,92vw)}
.toast{background:#1a1f2b;border:1px solid var(--gline2);border-left:3px solid var(--cyan);border-radius:10px;padding:9px 12px;font-size:12px;box-shadow:var(--shadow);word-break:break-word;animation:toastin .2s ease-out}
@keyframes toastin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.toast.err{border-left-color:var(--red)}.toast.ok{border-left-color:var(--green)}

/* responsive */
@media (max-width:1100px){.hero{grid-template-columns:1fr}.strips{grid-template-columns:1fr}}
@media (max-width:900px){
  .tgrid{grid-template-columns:minmax(0,1fr)}
  .swap{position:static}
  main{padding:10px}
  .top{gap:8px;padding:8px 12px}
  .bar .search{flex:1 1 100%}
  .hide-m{display:none}
  table{min-width:820px}
}
@media (max-width:700px){
  input,select,textarea{font-size:16px}
  .foot-groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 20px}.foot-groups nav:last-child{grid-column:auto}.foot-groups a{min-height:44px}
  .top .nav{display:none}
  .top .wallets{display:none}
  .ms-site .top{padding:9px 10px;gap:7px;flex-wrap:nowrap}
  .top .spacer{min-width:0;flex:1 1 0}
  .ms-site .top .logo{font-size:15px;gap:7px;min-width:0;flex:none}.ms-site .top .logo .ltld{margin-left:-5px}.top .ms-mark{width:24px;height:24px}
  .mobile-actions{display:flex;align-items:center;gap:6px;min-width:0;flex:0 1 166px;justify-content:flex-end}
  .mobile-connect,.mobile-menu-button{min-height:42px;border:1px solid var(--gline2);background:rgba(255,255,255,.055);border-radius:12px;color:var(--fg);font-weight:750}
  .mobile-connect{min-width:0;max-width:118px;flex:1 1 auto;padding:0 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-connect.on{border-color:rgba(163,255,18,.48);color:#b7ff3c;background:rgba(163,255,18,.08)}
  .mobile-menu-button{width:42px;flex:0 0 42px;padding:0;font-size:19px;display:grid;place-items:center}
  .mobile-menu-panel{position:fixed;display:grid;grid-template-columns:1fr 1fr;gap:8px;top:62px;left:10px;right:10px;z-index:35;padding:10px;background:rgba(12,17,14,.98);border:1px solid rgba(163,255,18,.22);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.65)}
  .mobile-menu-panel[hidden]{display:none}
  .mobile-menu-panel a{min-height:54px;display:flex;align-items:center;gap:10px;padding:0 13px;border:1px solid var(--gline);border-radius:12px;color:var(--fg);background:rgba(255,255,255,.035);font-weight:750;text-decoration:none}
  .mobile-menu-panel a span{color:#a3ff12;font-size:19px}.mobile-menu-panel a.on{border-color:rgba(163,255,18,.45);background:rgba(163,255,18,.08)}
  .drawer{position:fixed;top:62px;left:10px;right:10px;width:auto;max-height:calc(100dvh - 74px);overflow:auto;margin:0}
  .foot{padding-bottom:24px}.foot .keys{display:none}
  .hero{padding:20px 16px 16px;border-radius:16px}
  .hero .sub{font-size:13px}
  .counters{gap:6px}.cnt{padding:10px 6px}.cnt .l{font-size:9px;letter-spacing:.06em}
  .cards{grid-template-columns:repeat(2,1fr)}
  /* Four labelled windows do not fit half a phone: at two columns they collide and 24h clips. */
  .card.card-change{grid-column:1/-1}
  .card.card-change .v{font-size:13px;gap:2px 10px}
  /* Two up on a phone. Most of these tiles say "not checked", and one per screenful of scroll is
     a lot of thumb travel to learn nothing. */
  .facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .fact{padding:8px 9px}
  .row2{grid-template-columns:1fr}
  .foot{font-size:12px}
  .cgrid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}
  .tcard{padding:11px}
  .tcard .ch img,.tcard .ch .ph{width:36px;height:36px}
  .tcard .ch .nm b{font-size:13px}
  .bar{position:sticky;top:60px;z-index:10;margin:-10px -10px 8px;padding:10px;background:rgba(11,13,18,.94);backdrop-filter:blur(12px)}
  .bar #q{min-height:44px;width:100%;font-size:16px}.bar .pills{flex-wrap:nowrap;overflow-x:auto;width:100%;padding-bottom:2px}.bar #meta{display:none}
  .wrap{display:none}
  body.ms-site .ms-masthead{display:none}
  .mobile-grid{display:grid;gap:0;margin:0 -10px;background:rgba(9,14,11,.72);border-top:1px solid rgba(255,255,255,.07)}
  .mobile-token{width:100%;max-width:100%;min-width:0;overflow:hidden;display:grid;grid-template-columns:22px 34px minmax(0,1fr) minmax(70px,auto);grid-template-rows:auto auto;gap:2px 8px;align-items:center;text-align:left;padding:7px 12px;border:0;border-bottom:1px solid rgba(255,255,255,.07);border-radius:0;background:transparent;color:var(--fg);min-height:68px}
  .mobile-token:active{background:rgba(163,255,18,.08)}
  .mobile-token>img,.mobile-token>.ph{width:34px;height:34px;border-radius:50%;grid-row:1/3}.mt-rank{color:var(--dim);font:11px var(--mono);text-align:center;grid-row:1/3}
  .mt-name{display:flex;align-items:center;gap:6px;min-width:0;align-self:end;line-height:1.15}.mt-name>span:first-child{flex:1 1 auto;min-width:0}.mt-name>span{display:flex;align-items:center;gap:5px;min-width:0}.mt-name b{font-size:14px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mt-name .cb{flex:none;font-size:7px}
  .mt-price{min-width:0;max-width:105px;overflow:hidden;text-overflow:ellipsis;align-self:end;text-align:right;line-height:1.15}.mt-price b{font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}
  .mt-tape{grid-column:3/5;display:flex;align-items:center;gap:9px;min-width:0;overflow:hidden;color:var(--dim2);font:10px/1.2 var(--mono);white-space:nowrap}.mt-tape span{min-width:0;overflow:hidden;text-overflow:ellipsis}.mt-tape span:first-child{margin-right:auto;flex:none}.mt-tape small{font:7px var(--sans);letter-spacing:.06em;color:var(--dim)}
  .thead img,.thead .ph{width:44px;height:44px}
  .rugbig{width:100%}
  .swap{position:static;margin:20px 0 0;border:0;border-top:1px solid rgba(182,255,67,.2);border-radius:0;background:linear-gradient(180deg,rgba(25,38,25,.42) 0%,rgba(7,16,8,.38) 42%,rgba(5,8,6,0) 100%);box-shadow:none;max-height:none;overflow:hidden;transform:none;padding:22px 0 calc(22px + env(safe-area-inset-bottom));min-height:0}
  .trade-token-identity{font-size:21px}.trade-token-logo,.trade-token-identity .ph{width:46px;height:46px}
  .trade-presets button{min-height:44px;min-width:56px;font-size:13px}.trade-box{padding:14px 14px 12px}.trade-box-row .amt input,.trade-out{font-size:30px}.trade-pill{min-height:46px}.trade-search input{min-height:44px;font-size:16px}.trade-secondary{min-height:44px}.trade-connect-button{min-height:44px}.swap .qbox{padding:14px;border-radius:18px}.swap .go{min-height:56px;border-radius:18px;font-size:17px}
  .trade-box-row .amt input{font-size:max(16px,30px)}
  .shead{display:none}
  .toasts{bottom:12px}
}
@media (max-width:420px){.counters{grid-template-columns:repeat(3,1fr)}.cnt .v{font-size:20px}}

/* watch-only house wallets in the Wallets drawer */
.dwatch{border-top:1px solid var(--line,#222);margin-top:8px;padding-top:8px}
.dwhead{font-weight:600;margin-bottom:6px;display:flex;align-items:center;gap:6px}
.tagro{font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:1px 6px;border-radius:999px;border:1px solid var(--line,#333);opacity:.7}
.wline{display:flex;justify-content:space-between;gap:10px;padding:3px 0;font-size:12px}
.wnote{margin-top:6px;font-size:11px;line-height:1.4}

/* Buy Top 10, one-chain basket */
/* The list scrolls inside the box instead of running off the bottom of it. Every ancestor between
   .bkbox and .bklist needs min-height:0, or a flex child refuses to shrink below its content height
   and the overflow:auto on .bklist never engages. */
.bkbox{width:min(720px,96vw);max-height:88vh;display:flex;flex-direction:column;overflow:hidden}
.bkbox #bkBody{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.bkbox .mhead,.bkbox .bkbar,.bkbox .note{flex:0 0 auto}
.bkbox .bkstat,.bkbox .bknote{flex:0 0 auto}
.bkbar{display:flex;flex-wrap:wrap;gap:10px;align-items:end;padding:12px 0;border-bottom:1px solid var(--gline)}
.bkbar label{min-width:0}
.bkbar>label:first-child{flex:1 1 190px}
.bkbar input{width:100%}
.bkbar label{display:flex;flex-direction:column;gap:4px;font-size:11px;color:var(--dim2);text-transform:uppercase;letter-spacing:.06em}
.bkfixed{min-height:32px;display:flex;align-items:center;padding:0 10px;border:1px solid var(--gline2);border-radius:8px;color:var(--fg);background:rgba(0,0,0,.3);text-transform:none;letter-spacing:0}
.bkbar input,.bkbar select{background:rgba(0,0,0,.3);border:1px solid var(--gline2);border-radius:8px;color:var(--fg);padding:6px 8px;font:13px var(--sans);min-width:96px}
.bkstat{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}
.bkstat>div{background:rgba(0,0,0,.25);border:1px solid var(--gline);border-radius:10px;padding:8px 10px;text-align:center}
.bkstat b{display:block;font-size:17px;font-variant-numeric:tabular-nums}
.bkstat span{font-size:10px;color:var(--dim2);text-transform:uppercase;letter-spacing:.06em}
.bknote{font-size:12px;color:var(--dim2);padding:6px 0}.bknote.warn{color:var(--warn,#f7b955)}
.bkhint,.bkerr{padding:18px 4px;color:var(--dim2);font-size:13px}.bkerr{color:#ff6b6b}
.bklist{overflow-y:auto;overscroll-behavior:contain;flex:1 1 auto;min-height:0;margin-top:4px;padding-right:4px}
.bkrow{display:flex;align-items:center;gap:10px;padding:6px 4px;border-top:1px solid var(--gline);font-size:13px}
.bkrow .bki{color:var(--dim2);font-size:11px;min-width:22px;font-variant-numeric:tabular-nums}
.bkrow b{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bkst{font-size:11px;min-width:90px;text-align:right;color:var(--dim2)}
.bkst.pos{color:var(--green,#3ddc97)}.bkst.neg{color:#ff6b6b}.bkst.warn{color:#f7b955}

/* per-chain native balances under an EVM wallet row */
.chainbal{display:flex;flex-wrap:wrap;gap:6px;padding:6px 0 10px 34px}
.chainbal.dim{color:var(--dim2);font-size:11px;padding-left:34px}
.cbal{display:inline-flex;align-items:center;gap:5px;font-size:11px;background:rgba(0,0,0,.28);
 border:1px solid var(--gline);border-radius:999px;padding:2px 8px;font-variant-numeric:tabular-nums}
.cbal em{color:var(--dim2);font-style:normal}
.cbal i.cb{width:6px;height:6px;border-radius:50%;background:var(--green,#3ddc97);flex:none}

/* combined portfolio total + install links in the empty picker */
.dtotal{display:flex;align-items:baseline;gap:10px;padding:10px 2px 12px;border-bottom:1px solid var(--gline);margin-bottom:8px}
.dtotal b{font-size:22px;font-variant-numeric:tabular-nums}
.dtotal span{font-size:11px;color:var(--dim2)}
.instl{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.instl a{font-size:12px;padding:4px 10px;border-radius:999px;border:1px solid var(--gline2);
 color:var(--fg);text-decoration:none;background:rgba(0,0,0,.25)}
.instl a:hover{border-color:var(--green,#3ddc97)}

/* header portfolio total */
.hbal{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;padding:2px 12px 2px 0;
 margin-right:2px;border-right:1px solid var(--gline2)}
.hbal b{font-size:15px;font-variant-numeric:tabular-nums}
.hbal span{font-size:10px;color:var(--dim2);letter-spacing:.03em}
@media (max-width:640px){.hbal span{display:none}}
@media (max-width:700px){
  .top>.hbal{padding:0;margin:0;border:0;flex:none;white-space:nowrap}
  .top>.hbal b{font-size:12px}.top>.hbal span{display:none}
  .ms-site .top:has(>.hbal:not([hidden])) .logo .ms-lockup{width:clamp(90px,30vw,160px);height:auto}
  .top:has(>.hbal:not([hidden])) .mobile-actions{flex:0 0 auto}
}

/* token icons in the Top 10 list */
.bkrow .bkimg,.bkrow .ph.bkimg{width:22px;height:22px;border-radius:50%;background:#1f2530;object-fit:cover;
 flex:none;box-shadow:0 0 0 1px var(--gline)}
.bkrow .ph.bkimg{display:grid;place-items:center;font-size:9px;font-weight:700;color:var(--dim2)}
/* modal fits small screens */
@media (max-width:560px){
  .bkbox{width:100%;max-height:92vh}
  .bkstat{grid-template-columns:repeat(2,1fr)}
  .bkbar{gap:8px}.bkbar>label{flex:1 1 130px}
}

/* Swap page (Justin 2026-09-06): no masthead, card centered and sized to the viewport */
body[data-page="bridge"] .ms-masthead{display:none}
#app[data-page="bridge"]{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 72px);padding:16px 12px 32px;box-sizing:border-box}
#app[data-page="bridge"] .bridge{width:min(480px,100%);margin:0 auto;position:static;top:auto}
@media(max-height:820px){#app[data-page="bridge"]{align-items:flex-start;padding-top:12px}}
@media(max-width:700px){#app[data-page="bridge"]{padding:8px 10px 24px;min-height:0;align-items:flex-start}body[data-page="bridge"] .swap,body.ms-site[data-page="bridge"] .swap.panel{margin:0;padding:14px 12px calc(18px + env(safe-area-inset-bottom));border:1px solid rgba(225,255,210,.14);border-radius:22px;background:linear-gradient(172deg,#141c16 0%,#0d120f 100%)}}

.tk-link{color:inherit;text-decoration:none}.tk-link:hover{text-decoration:underline}

.tk-page{font-size:12px;font-weight:700;vertical-align:middle;margin-left:6px;text-decoration:none}

/* Leaderboard: the list is ranked by heat, so the podium should look like one. Metallic fills for the
   top three, a lime ring for the rest of the top ten, muted after that. Mobile gets the same
   treatment at a size that still fits a phone row. (Justin, 2026-09-07) */
td.rank span, .mt-rank {
  display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%;
  font-size: 12px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--dim);
  background: rgba(255,255,255,.05);
}
td.rank { padding-left: 10px }
td.rank.rank-top span, .rank-top span, .mt-rank.rank-top { color: #a3ff12; background: rgba(163,255,18,.14); box-shadow: inset 0 0 0 1px rgba(163,255,18,.4) }
td.rank.rank-gold span, .rank-gold span, .mt-rank.rank-gold { color: #241c00; background: linear-gradient(135deg,#ffe082,#ffc22e 55%,#b8860b); box-shadow: 0 0 10px rgba(255,194,46,.45) }
td.rank.rank-silver span, .rank-silver span, .mt-rank.rank-silver { color: #1c1f22; background: linear-gradient(135deg,#f2f5f7,#c8cdd3 55%,#8a9199); box-shadow: 0 0 9px rgba(200,205,211,.35) }
td.rank.rank-bronze span, .rank-bronze span, .mt-rank.rank-bronze { color: #2a1600; background: linear-gradient(135deg,#f0b98a,#cd7f32 55%,#8a5522); box-shadow: 0 0 9px rgba(205,127,50,.35) }
.heat {
  display: inline-flex; align-items: center; gap: 2px; margin-left: 6px; padding: 1px 6px;
  border-radius: 999px; font-size: 11px; font-weight: 700; color: var(--dim);
  background: rgba(255,255,255,.05); white-space: nowrap;
}
.heat.hot { color: #a3ff12; background: rgba(163,255,18,.14) }
/* Info affordance beside the Heat column header, linking to the methodology article. */
.heat-info{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:5px;
  border:1px solid rgba(163,255,18,.4);border-radius:50%;background:rgba(163,255,18,.08);
  color:#a3ff12;font-size:10px;font-weight:800;font-style:italic;line-height:1;text-decoration:none;
  vertical-align:middle;flex:none;transition:background .15s,border-color .15s}
.heat-info:hover{background:rgba(163,255,18,.2);border-color:#a3ff12;text-decoration:none}
.heat-info:focus-visible{outline:2px solid #a3ff12;outline-offset:2px}
.heat-head{display:inline-flex;align-items:center;gap:2px;min-width:0}
/* Heat is the column the board is sorted by, so it gets its own cell rather than
   hiding inside the token name. The pill loses its inline margin there. */
td.heat-cell,th[data-k="hot"]{text-align:center;white-space:nowrap}
td.heat-cell .heat{margin-left:0}
td.heat-cell .dim{opacity:.45}
.mt-heat{flex:none;display:inline-flex;margin-top:0}
@media (max-width: 640px) {
  .mt-rank { width: 22px; height: 22px; font-size: 11px }
  .heat{font-size:10px;padding:1px 6px;line-height:1.4}
  .mt-heat .heat{margin-left:0}
}

/* Fit the table to the window instead of running off the edge (Justin, 2026-09-07). Between a phone
   and a wide desktop there is a whole range where the badge columns pushed price, market cap and
   liquidity out of view. Those drop first, then the padding tightens, so the numbers a trader reads
   at a glance always fit. */
@media (max-width:1500px){
  .hide-l{display:none}
  table{min-width:0}
  th,td{padding:7px 8px}
}
@media (max-width:1200px){
  th,td{padding:6px 6px;font-size:12px}
  .tk .nm small{display:none}
}
/* 700-1000px still renders the full table; tighten the cells and shrink the token
   art so price, market cap and liquidity stay on screen instead of scrolling. */
@media (max-width:1000px){
  th,td{padding:5px 4px;font-size:11.5px}
  .tk{gap:6px}
  .tk img,.tk .ph{width:22px;height:22px}
  .heat{font-size:10px;padding:1px 5px;gap:1px}
  .cb{font-size:7px}
}
@media (max-width:820px){
  th,td{padding:5px 3px;font-size:11px}
  .tk .nm b{font-size:12px}
}

/* Shared wallet token picker: the same interaction on web and desktop. */
.trade-pill-picker:has(.trade-token-button:not([hidden])){display:flex!important;padding:0}
.trade-pill-picker:has(.trade-token-button:not([hidden]))>.trade-pill-logo,
.trade-pill-picker:has(.trade-token-button:not([hidden]))>.trade-pill-name{display:none}
.trade-screen .trade-chain-filters{display:none}
.trade-token-button{display:flex;align-items:center;gap:9px;width:100%;min-width:0;min-height:46px;padding:7px 11px;border:0;border-radius:999px;background:transparent;color:var(--fg);font:700 14px var(--sans);text-align:left;cursor:pointer}
.trade-token-button[hidden]{display:none}.trade-token-button:disabled{cursor:default;opacity:.7}
.trade-token-button:disabled .token-picker-chevron{display:none}
.trade-token-button>span:not(.token-picker-icon){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trade-token-button:focus-visible{outline:2px solid var(--lime,#b6ff43);outline-offset:2px}
.token-picker-chevron{margin-left:auto;color:var(--lime,#b6ff43)}
.token-picker-icon{position:relative;display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border-radius:50%;overflow:hidden;background:#293722;color:var(--lime,#b6ff43);font:700 11px var(--sans)}
.token-picker-icon img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#111912}
.trade-token-picker{box-sizing:border-box;width:min(520px,calc(100vw - 24px));max-height:min(720px,88dvh);padding:20px;border:1px solid #354332;border-radius:24px;background:linear-gradient(145deg,#172318,#0c130e 45%);color:var(--fg);box-shadow:0 24px 100px #0009}
.trade-token-picker::backdrop{background:#0009;backdrop-filter:blur(5px)}
.token-picker-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}.token-picker-head h2{margin:0;font:750 21px var(--sans)}
.token-picker-head button{border:1px solid #30412b;background:#1c281d;border-radius:12px;width:40px;height:40px;color:var(--fg);font-size:24px;cursor:pointer}
.trade-token-picker>input{width:100%;box-sizing:border-box;background:#101a12;border:1px solid #34472f;border-radius:13px;padding:13px;color:var(--fg);font:16px var(--sans)}
.token-picker-networks{display:flex;gap:8px;overflow-x:auto;padding:12px 0;scrollbar-width:thin}.token-picker-networks:empty{padding:3px}
.token-picker-networks button{flex-shrink:0;min-height:36px;border:1px solid #30412b;border-radius:999px;padding:7px 12px;background:transparent;color:var(--dim);font:12px var(--sans);cursor:pointer}
.token-picker-networks button[aria-pressed=true]{background:var(--lime,#b6ff43);color:#0b1408;border-color:var(--lime,#b6ff43)}
.token-picker-list{overflow:auto;max-height:52dvh;overscroll-behavior:contain;scrollbar-width:thin}.token-picker-list h3{margin:18px 4px 7px;color:var(--dim);font:700 11px var(--sans);text-transform:uppercase;letter-spacing:.08em}
.token-picker-row{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;padding:11px 8px;border:0;border-bottom:1px solid #1e2c20;background:transparent;color:var(--fg);text-align:left;cursor:pointer}
.token-picker-row:hover,.token-picker-row[aria-pressed=true]{background:#1c2a19;border-radius:12px}.token-picker-row:focus-visible{outline:2px solid var(--lime,#b6ff43);outline-offset:-2px;border-radius:12px}
.token-picker-description{flex:1;min-width:0}.token-picker-description b,.token-picker-values b{display:block;font:700 14px var(--sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.token-picker-description small,.token-picker-values small{display:block;margin-top:5px;color:var(--dim);font:12px var(--sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.token-picker-values{max-width:35%;text-align:right}.token-picker-empty{color:var(--dim);padding:18px 4px;font:14px var(--sans)}
@media(max-width:480px){.trade-token-picker{padding:16px;border-radius:22px}.token-picker-list{max-height:55dvh}.token-picker-row{gap:9px}}

/* ==== brand.css */
/* Shared identity only. No signing, balances, routes, or game state live here. */
:root{--ms-lime:#b6ff43;--ms-lime-hover:#cbff80;--ms-ink:#0b100c;--ms-paper:#f3f7ec;--ms-mist:#a9b6ac;--ms-lilac:#c7b6ff;--ms-pink:#ff8dc7;--ms-amber:#ffbd59;--ms-coral:#ff7474;--ms-sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;--ms-display:-apple-system,BlinkMacSystemFont,"SF Pro Display","Arial Black","Segoe UI",sans-serif;--ms-mono:"SFMono-Regular",ui-monospace,Menlo,Consolas,monospace;--green:var(--ms-lime);--cyan:#a3eec2;--acc:var(--ms-lime);--up:#a8ef76;--down:var(--ms-coral);--warn:var(--ms-amber);--yellow:var(--ms-amber);--amber:var(--ms-amber);--violet:var(--ms-lilac);--bg:var(--ms-ink);--panel:#111a14;--panel2:#18241b;--line:#29362c;--line2:#526155;--fg:var(--ms-paper);--dim:#9eaea1;--dim2:var(--ms-mist);--lime:var(--ms-lime)}
html{color-scheme:dark}.ms-site,.ms-wallet,.ms-watch,.ms-arcade{font-family:var(--ms-sans);font-kerning:normal;text-rendering:optimizeLegibility}.ms-site h1,.ms-site h2,.ms-site h3,.ms-wallet h1,.ms-wallet h2,.ms-arcade h1,.ms-arcade h2,.ms-arcade h3,.ms-word,.logo{font-family:var(--ms-display);font-synthesis:none}.ms-site code,.ms-wallet code,.ms-wallet pre,.ms-arcade code{font-family:var(--ms-mono)}
button,input,select{font-family:inherit}button{min-height:32px}button:active{transform:translateY(1px)}
::selection{background:#b6ff4350;color:#fff}
:focus-visible{outline:2px solid var(--ms-lime);outline-offset:4px}
.ms-mark{width:34px;height:34px;flex:none;vertical-align:middle;border-radius:10px}
.ms-word{font-weight:900;letter-spacing:-1px;font-size:23px;color:var(--ms-paper);line-height:1.1}
.ms-word small{display:block;font:10px/1.5 ui-monospace,monospace;letter-spacing:2.5px;text-transform:uppercase;color:var(--ms-lime)}
.top{background:#0b100cf2;border-bottom-color:#34442e;padding-block:10px}
.logo{gap:10px;letter-spacing:-.7px;font-size:22px}.logo .ltld{margin-left:-7px}
.ms-site .glow{background:radial-gradient(ellipse at 70% 0,#91dd3820,transparent 65%)}
.ms-site .wbtn,.ms-site .pill{border-radius:9px}.ms-site #btnWallets{background:var(--ms-lime);color:#10170e;border-color:var(--ms-lime)}
.ms-site .nav a.on{background:#b6ff4315;color:var(--ms-lime)}
.ms-masthead{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 24px 24px;border-bottom:1px solid var(--line);background:linear-gradient(110deg,#16251a,#0b100c 75%)}
.ms-masthead h1{font-size:clamp(27px,3.2vw,46px);font-weight:900;letter-spacing:-1.8px;line-height:1.06;margin:7px 0 9px}.ms-masthead h1 em{font-style:normal;color:var(--ms-lime)}
.ms-kicker{font:700 10px/1.5 var(--ms-mono);letter-spacing:2px;color:var(--ms-lime)}
.ms-masthead p{color:var(--dim);font-size:13px;margin:0;max-width:680px}.ms-stamp{transform:rotate(-6deg);border:1px solid var(--ms-lime);color:var(--ms-lime);border-radius:50%;padding:22px 14px;font:900 13px/1.3 var(--ms-mono);text-align:center;flex:none}
.ms-wallet .bar{background:#101a12;border-bottom:1px solid #3c512d;min-height:76px;gap:16px;flex-wrap:wrap}
.ms-wallet .brand{display:flex;align-items:center;gap:11px;margin-right:12px}.ms-wallet .brand .ms-word{font-size:23px}
.ms-wallet .tot{margin-left:8px}.ms-wallet .tot b{font-size:28px;color:var(--ms-paper)}
.ms-wallet #bSwap{background:var(--ms-lime);color:#10200c;border-color:var(--ms-lime);font-weight:750}
.ms-wallet .btn:hover{border-color:var(--ms-lime);background:#25341f}.ms-wallet #bSwap:hover{background:#cbff80}
.ms-wallet .panel{border-radius:16px;box-shadow:0 5px 25px #0002}.ms-wallet .phead{background:#17231a}
.ms-wallet tbody tr:hover{background:#1b291e}.ms-wallet tbody td{border-bottom-color:#1b291e}
.ms-wallet .chainbar{padding-top:12px;padding-bottom:0}.ms-wallet .cpill.on{background:#b6ff4315}
.ms-wallet .sbody input,.ms-wallet .sbody select,.ms-wallet .ro{background:#0b130e}
.ms-wallet .bar a{-webkit-app-region:no-drag}.ms-wallet .ms-home{color:inherit;text-decoration:none;display:flex;gap:11px;align-items:center}
.ms-watch .wrap{max-width:700px}.ms-watch h1{display:flex;align-items:center;gap:12px;font-size:23px;font-weight:850}.ms-watch .card{background:var(--panel);border-color:var(--line)}
.ms-arcade header .brand{display:flex;gap:9px;align-items:center;font-size:23px;letter-spacing:-.7px}.ms-arcade header .brand span{margin-left:-7px}.ms-arcade .brand .ms-mark{width:30px;height:30px}
.ms-arcade .coin{background-image:url('/assets/brand/mark.svg?v=20260905');background-size:cover;color:transparent;border-radius:32%;border:0;box-shadow:0 16px 60px #b6ff4320}
.ms-arcade{--bg:var(--ms-ink);--panel:#151d17;--line:#3a493d;--muted:#aab7ad;--lime:var(--ms-lime);--purple:var(--ms-lilac);--pink:var(--ms-pink);color:var(--ms-paper);background:var(--ms-ink)}.ms-arcade .game{box-shadow:0 12px 35px #0002}.ms-arcade .game-art{border-radius:10px;margin:13px 0 18px}.ms-arcade .game.rug .game-art{background:radial-gradient(ellipse,#ff8dc71e,transparent 68%)}.ms-arcade .game.diamond .game-art{background:radial-gradient(ellipse,#c7b6ff1e,transparent 68%)}.ms-arcade .game.duel .game-art{background:radial-gradient(ellipse,#b6ff4315,transparent 68%)}
.ms-arcade .game-actions{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:8px}.ms-arcade .game-actions button{min-width:0;padding:13px 11px;border-radius:8px;font-size:10px;font-weight:850;letter-spacing:.4px}.ms-arcade .game-actions button:first-child{display:flex;justify-content:space-between;background:var(--accent);color:#171a10}.ms-arcade .game-actions .friend{background:#253028;color:var(--ms-paper);border:1px solid #516055}.ms-arcade .game-actions .friend:hover{border-color:var(--accent)}.ms-arcade .game-actions .practice{grid-column:1/-1;background:#171b18;color:var(--lime);border:1px dashed #6d7b70}.ms-arcade .game-actions .practice:hover{background:#202821;border-color:var(--lime)}
@media(max-width:680px){.ms-masthead{padding:20px 16px}.ms-stamp{display:none}.ms-masthead h1{letter-spacing:-1px}.ms-wallet .bar{gap:9px;padding:12px}.ms-wallet .bar .brand{width:100%;margin:0}.ms-wallet .bar .spacer{display:none}.ms-wallet .bar .tot{margin:0 auto 0 0}.ms-wallet .bar .tot b{font-size:23px}.ms-wallet .bar .btn{padding:7px 9px}.ms-wallet #bSwap{width:100%;padding:10px}.ms-wallet main{padding:9px}.ms-wallet .balance-filter{font-size:10px}.ms-arcade header .brand{font-size:17px;gap:6px}.ms-arcade .brand .ms-mark{width:25px;height:25px}.ms-arcade header{gap:13px}.ms-arcade .game-actions{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Action surfaces: shared visual language for wallet, swap, bridge and onboarding. */
.ms-site .modal,.ms-wallet .sheet{background:rgba(2,7,3,.82);backdrop-filter:blur(14px) saturate(125%);-webkit-backdrop-filter:blur(14px) saturate(125%)}
.ms-site .mbox,.ms-wallet .sbox{position:relative;background:linear-gradient(155deg,#19261c,#0d150f 72%);border:1px solid #4a604b;border-radius:24px;box-shadow:0 30px 90px #000b,0 0 0 1px #b6ff4310;overflow:hidden}
.ms-site .mbox::before,.ms-wallet .sbox::before{content:"";display:block;height:5px;margin:-14px -14px 16px;background:var(--ms-lime)}
.ms-wallet .sbox::before{margin:0}
.ms-site .mhead,.ms-wallet .shead{min-height:62px;margin:0;padding:15px 18px;border-bottom:1px solid #344437;background:#121d15}
.ms-site .mhead b,.ms-wallet .shead b{font-size:16px;font-weight:900;letter-spacing:-.3px;display:flex;align-items:center;gap:9px}
.ms-site .mhead b::before,.ms-wallet .shead b::before{content:"↔";display:grid;place-items:center;width:27px;height:27px;border-radius:8px;background:var(--ms-lime);color:#10170e;font-size:16px;font-weight:1000}
.ms-site .mhead .pill,.ms-wallet .shead .btn{width:32px;height:32px;padding:0;border-radius:10px;background:#202e23;border-color:#435446;color:var(--fg);font-size:18px}
.ms-wallet .sbody{padding:18px;gap:14px}.ms-wallet .sbody label,.ms-site .field label{font:700 10px/1.5 ui-monospace,monospace;letter-spacing:1.2px;text-transform:uppercase;color:#a9baa9}
.ms-wallet .sbody input,.ms-wallet .sbody select,.ms-wallet .ro,.ms-site .mbox input,.ms-site .mbox select,.ms-site .bridge:not(.swap) input,.ms-site .bridge:not(.swap) select{min-height:43px;background:#09100b;border:1px solid #3e5142;border-radius:11px;color:var(--fg);padding:9px 11px}
.ms-wallet .sbody input:focus,.ms-wallet .sbody select:focus,.ms-site .mbox input:focus,.ms-site .mbox select:focus,.ms-site .bridge:not(.swap) input:focus,.ms-site .bridge:not(.swap) select:focus{outline:0;border-color:var(--ms-lime);box-shadow:0 0 0 3px #b6ff4319}
.ms-wallet .snote,.ms-site .note{border:1px solid #334436;border-radius:10px;background:#111c14;padding:10px 12px;color:#a0afa3}
.ms-wallet .warnbar{border-radius:11px;background:#302614;border-color:#795f29}
.ms-wallet .srow{gap:10px}.ms-wallet .srow .btn,.ms-wallet .sbody>[data-quote],.ms-wallet .sbody>[data-execute]{min-height:43px;border-radius:11px;font-weight:800}
.ms-wallet .sbody>[data-quote]{background:#253326;border-color:#607063}.ms-wallet .sbody>[data-execute]:not(:disabled),.ms-wallet .srow .btn.on{background:var(--ms-lime);border-color:var(--ms-lime);color:#10170e}
.ms-wallet [data-review]{margin:0;padding:0;border-radius:12px;color:#dce8dd}.ms-wallet [data-review]:not(:empty){padding:12px;border:1px dashed #607063;background:#09100b}
.ms-wallet [data-status]:not(:empty),.ms-wallet .sout:not(:empty){border-radius:10px;background:#0a120c;padding:10px;border-left:3px solid var(--ms-lime)}
.ms-site .drawer{background:linear-gradient(155deg,#18251b,#0d140f);border-color:#4a604b;border-radius:18px;box-shadow:0 24px 70px #000b}
.ms-site .drawer::before{content:"YOUR WALLETS";display:block;padding:6px 5px 10px;font:800 10px/1.4 ui-monospace,monospace;letter-spacing:1.8px;color:var(--ms-lime)}
.ms-site .prow{background:#0b120d;border-color:#3c4e3f;border-radius:12px}.ms-site .prow:hover{border-color:var(--ms-lime);transform:translateY(-1px)}
.ms-site .onb .mbox::before{margin:0}.ms-site .oart{background:var(--ms-lime);color:#10170e;border:0;transform:rotate(-3deg);box-shadow:none}.ms-site .ofoot{background:#101a12;border-top-color:#344437}
.ms-site .bkbox::before{margin:0}.ms-site .bkbar{background:#111c14;border-color:#344437}.ms-site .bkbox .note{margin:10px 14px 14px}
.ms-site .go,.ms-site .mbox .go{background:var(--ms-lime);color:#10170e;border:1px solid var(--ms-lime);border-radius:11px;box-shadow:0 8px 25px #b6ff4318}.ms-site .go:hover{filter:none;background:#cbff80;transform:translateY(-1px)}.ms-site .go:disabled{background:#202b22;border-color:#344437;color:#718075;box-shadow:none}
.ms-site .pill{border-radius:9px}.ms-site .pill:hover{border-color:var(--ms-lime)}
.ms-site .bridge.panel:not(.swap){position:relative;max-width:760px;margin:28px auto;background:linear-gradient(155deg,#18251b,#0c140e 76%);border:1px solid #4a604b;border-radius:24px;padding:24px;box-shadow:0 25px 70px #0005;overflow:hidden}
.ms-site .bridge.panel:not(.swap)::before{content:"CROSS-CHAIN / REVIEW BEFORE SIGNING";display:block;margin:-24px -24px 23px;padding:13px 24px;background:var(--ms-lime);color:#10170e;font:900 10px/1 ui-monospace,monospace;letter-spacing:1.5px}
.ms-site .bridge h1{font-size:32px;letter-spacing:-1px}.ms-site .bridge .row2{gap:12px}.ms-site .bridge:not(.swap) .amt,.ms-site .bridge:not(.swap) .qbox{background:#09100b;border-color:#3e5142;border-radius:12px}.ms-site .bridge:not(.swap) .qbox{min-height:90px;padding:14px}.ms-site .bridge:not(.swap) .go{min-height:48px;font-size:15px}
.ms-site .swap.panel{background:linear-gradient(155deg,#18251b,#0c140e 76%);border-color:#4a604b;box-shadow:0 18px 55px #0004}.ms-site .swap .seg{border-color:#435547;background:#09100b;padding:3px;gap:3px}.ms-site .swap .seg button{border-radius:8px}.ms-site .swap .seg button.on.buy{background:var(--ms-lime);color:#10170e}
.ms-site .toast{background:#142018;border-color:#485b4b;border-left:4px solid var(--ms-lime);border-radius:12px;box-shadow:0 12px 40px #0009}
.ms-site table,.ms-wallet table{font-variant-numeric:tabular-nums}.ms-site thead th,.ms-wallet thead th{font-family:var(--ms-mono);font-weight:700}.ms-site tbody tr,.ms-wallet tbody tr{transition:background-color .15s ease}.ms-site .panel,.ms-wallet .panel{border-color:#344438}.ms-site a:not(.logo):not(.go):not(.brand),.ms-watch a{text-underline-offset:3px}.ms-site a:not(.logo):not(.go):not(.brand):hover,.ms-watch a:hover{text-decoration-thickness:2px}
@media(pointer:coarse){button,.wbtn,.pill,.btn,.cpill,select{min-height:44px}.ms-site .nav a{min-height:44px;display:inline-flex;align-items:center}.ms-wallet tbody td{padding-block:11px}}
@media(max-width:640px){.ms-site .modal,.ms-wallet .sheet{align-items:flex-end;padding:8px}.ms-site .mbox,.ms-wallet .sbox{width:100%;max-height:92dvh;border-radius:22px 22px 12px 12px;overflow:auto;overscroll-behavior:contain}.ms-site .mhead,.ms-wallet .shead{position:sticky;top:0;z-index:2}.ms-site .bridge.panel:not(.swap){margin:9px auto;padding:17px}.ms-site .bridge.panel:not(.swap)::before{margin:-17px -17px 18px;padding-left:17px}.ms-site .bridge .row2{grid-template-columns:1fr}.ms-site .bridge h1{font-size:27px}}

/* Brand lockup, mascot + "MemeSwap.fun" as one piece of art (owner-supplied, 2026-09-07, second
   revision: "use this instead everywhere, it should work much better"). The source ships a real alpha
   channel, so nothing is keyed or blended here and it sits clean on any surface. It is the whole
   header brand: no separate mark, no tagline beside it. Because the mascot carries the height, this
   cut reads at a taller size than the wordmark-only one it replaced. Marketing keeps the earlier
   tagline art in lockup-full.png. */
.ms-lockup{display:block;height:78px;width:auto;flex:none}
a.lockup,a.brand.lockup,a.logo.lockup{gap:0;display:inline-flex;align-items:center;min-width:0}
.ms-word-sub{font-size:0;line-height:0}
.ms-word-sub small{margin-left:10px}
.ms-wallet .brand .ms-lockup{height:52px}
@media (max-width:900px){.ms-word-sub{display:none}}
@media (max-width:760px){.ms-lockup{height:63px}.ms-wallet .brand .ms-lockup{height:40px}}
@media (max-width:420px){.ms-lockup{height:54px}}

/* Homepage SEO section. Real content, outside #app so the app bundle never replaces it and
   every crawler sees it, including the ones that do not execute JavaScript. Visible to users
   too: hidden text would be cloaking, which risks a manual penalty and helps nobody. */
.ms-seo{padding:26px 24px 30px;border-bottom:1px solid var(--line);background:#0d130e}
.ms-seo h2{font-size:clamp(17px,2vw,23px);font-weight:800;letter-spacing:-.4px;margin:20px 0 8px;color:var(--ms-paper)}
.ms-seo h2:first-of-type{margin-top:0}
.ms-seo p{color:var(--dim);font-size:13.5px;line-height:1.62;margin:0;max-width:760px}
.ms-seo nav{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 4px}
.ms-seo nav a{font:600 12px/1 var(--ms-mono);color:var(--ms-lime);border:1px solid var(--line);
  border-radius:999px;padding:8px 13px;text-decoration:none;transition:border-color .15s,background .15s}
.ms-seo nav a:hover{border-color:var(--ms-lime);background:#1a2417}
@media (max-width:640px){.ms-seo{padding:20px 16px 24px}.ms-seo nav a{font-size:11px;padding:7px 11px}}

/* ==== wallet/sheet.css */
:root{--wallet-accent:#a3ff12;--wallet-sheet:#101510;--wallet-card:#171d17;--wallet-edge:rgba(216,255,190,.14);--wallet-muted:#9aa497}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
#walletSheetRoot[hidden]{display:none}
#walletSheetRoot{position:fixed;inset:0;z-index:1000;display:grid;place-items:end center;min-height:100dvh}
.wallet-sheet-backdrop{position:absolute;inset:0;background:rgba(1,4,2,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);animation:wallet-fade .16s ease-out}
.wallet-sheet-panel{position:relative;width:100%;max-width:620px;max-height:min(86dvh,820px);display:flex;flex-direction:column;background:linear-gradient(180deg,#151b15 0%,var(--wallet-sheet) 100%);border:1px solid var(--wallet-edge);border-bottom:0;border-radius:28px 28px 0 0;box-shadow:0 -24px 90px rgba(0,0,0,.55);overflow:hidden;animation:wallet-rise .22s cubic-bezier(.22,.85,.32,1);padding-bottom:calc(12px + env(safe-area-inset-bottom))}
.wallet-sheet-grabber{width:42px;height:5px;border-radius:999px;background:rgba(255,255,255,.2);margin:9px auto 0;flex:none}
.wallet-sheet-head{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:8px;padding:10px 16px 12px;text-align:center;border-bottom:1px solid rgba(255,255,255,.07)}
.wallet-sheet-head h2{margin:0;color:#f4f7f2;font-size:19px;line-height:1.25;text-transform:none;letter-spacing:-.02em}.wallet-sheet-head p{margin:2px 0 0;color:var(--wallet-muted);font-size:12px}
.wallet-sheet-icon{width:44px;min-height:44px;border:0;border-radius:14px;background:rgba(255,255,255,.055);color:#f2f6f0;font-size:25px;display:grid;place-items:center}.wallet-sheet-icon:hover{background:rgba(255,255,255,.1)}
.wallet-sheet-head-spacer{width:44px}
.wallet-sheet-body{padding:14px 16px 4px;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.wallet-sheet-trust{display:flex;align-items:flex-start;gap:8px;margin:12px 20px 0;padding-top:12px;border-top:1px solid rgba(255,255,255,.07);font-size:11px;line-height:1.45;color:var(--wallet-muted)}.wallet-sheet-trust span{color:var(--wallet-accent)}
.wallet-choice-list,.wallet-session-list{display:grid;gap:8px}
.wallet-choice,.wallet-session-row,.wallet-all,.wallet-primary,.wallet-detail-actions button,.wallet-connecting button{min-height:44px}
.wallet-choice,.wallet-session-row{width:100%;display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:11px;text-align:left;padding:10px 12px;border:1px solid rgba(255,255,255,.075);border-radius:16px;background:rgba(255,255,255,.035);color:#f4f7f2}.wallet-choice:hover,.wallet-session-row:hover{border-color:rgba(163,255,18,.38);background:rgba(163,255,18,.055)}
.wallet-choice>span:nth-child(2),.wallet-session-main{display:grid;min-width:0}.wallet-choice b,.wallet-session-main b{font-size:14px}.wallet-choice small,.wallet-session-main small{color:var(--wallet-muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wallet-choice>i{font-style:normal;font-size:22px;color:#778071}.wallet-choice>em{font-style:normal;color:var(--wallet-accent);font-size:11px;text-align:right}
.wallet-choice-recommended{border-color:rgba(163,255,18,.46);background:linear-gradient(135deg,rgba(163,255,18,.12),rgba(163,255,18,.035))}
.wallet-recommended-label{display:inline-flex;margin-left:8px;padding:2px 6px;border-radius:999px;background:rgba(163,255,18,.14);color:var(--wallet-accent);font-size:9px;font-style:normal;font-weight:800;letter-spacing:.04em;text-transform:uppercase;vertical-align:2px}
.wallet-coming-soon{display:flex;align-items:center;justify-content:space-between;min-height:44px;padding:10px 12px;border:1px dashed rgba(255,255,255,.16);border-radius:14px;color:inherit;text-decoration:none}.wallet-coming-soon span{display:grid;gap:2px}.wallet-coming-soon b{font-size:13px}.wallet-coming-soon small{color:var(--wallet-muted);font-size:11px}.wallet-coming-soon i{color:#778071;font-size:22px;font-style:normal}
.wallet-logo-stack{display:inline-flex;align-items:center;padding-left:5px}.wallet-logo{width:30px;height:30px;position:relative;display:inline-grid;place-items:center;border-radius:10px;background:linear-gradient(145deg,#293228,#161c16);border:1px solid rgba(255,255,255,.13);color:var(--wallet-accent);font-size:13px;font-weight:900;overflow:visible;box-shadow:0 2px 10px rgba(0,0,0,.3);flex:none}.wallet-logo img{width:100%;height:100%;object-fit:cover;border-radius:9px}.wallet-logo-stack .wallet-logo+ .wallet-logo{margin-left:-8px}.wallet-logo-stack .wallet-logo{outline:2px solid #0c110d}.wallet-active-dot{position:absolute;right:-2px;bottom:-2px;width:9px;height:9px;border-radius:50%;background:#57ef81;border:2px solid #0c110d;box-shadow:0 0 8px rgba(87,239,129,.65)}
.wallet-chip{position:relative;min-width:44px;min-height:44px!important;padding:5px 8px!important;display:inline-flex;align-items:center;justify-content:center;gap:5px}.wallet-chip.on{border-color:transparent!important;background:transparent!important}.wallet-chip.on:hover{border-color:transparent!important;background:rgba(255,255,255,.035)!important}.wallet-plus{font-size:10px;color:#cbd5c7}.wallet-attention-badge{position:absolute;right:-2px;top:-2px;width:15px;height:15px;display:grid;place-items:center;border-radius:50%;background:#ffb020;color:#171006;font:900 10px/1 var(--sans);border:2px solid #0b100c}
.wallet-all,.wallet-primary{width:100%;border:1px solid rgba(163,255,18,.3);border-radius:15px;background:rgba(163,255,18,.08);color:var(--wallet-accent);font-weight:800;padding:10px 14px}.wallet-all{display:flex;justify-content:space-between;margin-top:4px}.wallet-primary{margin-top:12px;background:var(--wallet-accent);color:#0a1008}
.wallet-search{display:block}.wallet-search input{width:100%;min-height:46px;border-color:rgba(255,255,255,.12);background:#090d0a}
.wallet-session-row.is-active{border-color:rgba(87,239,129,.28)}.wallet-session-row.needs-attention{border-color:rgba(255,176,32,.32)}
.wallet-session-state{display:grid;grid-template-columns:auto auto;align-items:center;justify-items:end;gap:2px 7px;max-width:145px}.wallet-session-balance{grid-column:1/3;color:#f4f7f2;font-size:13px}.wallet-session-state em{font-style:normal;color:#57ef81;font-size:10px;font-weight:800}.wallet-session-state small{color:var(--wallet-muted);font-size:10px;text-align:right}.wallet-session-state i{grid-row:2/4;grid-column:2;font-style:normal;color:#7e897a;font-size:18px}
.wallet-summary{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:0 2px 12px}.wallet-summary>span{display:grid}.wallet-summary b{font-size:24px;color:#f4f7f2}.wallet-summary small{color:var(--wallet-muted);font-size:10px}.wallet-summary>small{text-align:right}
.wallet-empty{text-align:center;padding:22px 10px}.wallet-empty>span{font-size:38px;color:var(--wallet-accent)}.wallet-empty h3{margin:8px 0 2px}.wallet-empty p{color:var(--wallet-muted);margin:0 auto 16px;max-width:340px}
.wallet-detail-card{display:grid;gap:14px}.wallet-detail-hero{display:flex;align-items:center;gap:12px;padding:4px}.wallet-detail-hero .wallet-logo{width:48px;height:48px;border-radius:15px}.wallet-detail-hero h3,.wallet-detail-hero p{margin:0}.wallet-detail-hero p{color:var(--wallet-muted);font-size:12px}
.wallet-detail-card dl{margin:0;border:1px solid rgba(255,255,255,.075);border-radius:16px;overflow:hidden}.wallet-detail-card dl div{display:flex;justify-content:space-between;gap:14px;padding:11px 13px;background:rgba(255,255,255,.025)}.wallet-detail-card dl div+div{border-top:1px solid rgba(255,255,255,.065)}.wallet-detail-card dt{color:var(--wallet-muted)}.wallet-detail-card dd{margin:0;text-align:right;max-width:65%;overflow:hidden;text-overflow:ellipsis}
.wallet-detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.wallet-detail-actions button{border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(255,255,255,.045);color:#edf3e9;padding:9px}.wallet-detail-actions button.danger{color:#ff8a8a;border-color:rgba(255,99,99,.24)}.wallet-warning{margin:0;padding:10px;border-radius:12px;background:rgba(255,176,32,.08);color:#d9b66e;font-size:11px}
.wallet-signer-note{display:grid;gap:3px;padding:4px 4px 12px}.wallet-signer-note b{color:var(--wallet-accent)}.wallet-signer-note span{color:var(--wallet-muted);font-size:12px}
.wallet-connecting{text-align:center;padding:25px 8px 16px}.wallet-orbit{position:relative;width:82px;height:82px;margin:0 auto 17px;display:grid;place-items:center}.wallet-orbit>span{width:58px;height:58px;display:grid;place-items:center;border-radius:18px;background:#232c22;color:var(--wallet-accent);font-size:24px;font-weight:900}.wallet-orbit i{position:absolute;inset:0;border:2px solid rgba(163,255,18,.16);border-top-color:var(--wallet-accent);border-radius:50%;animation:wallet-spin 1.1s linear infinite}.wallet-connecting h3{margin:0 0 6px}.wallet-connecting p{margin:0 auto;color:var(--wallet-muted);max-width:330px}.wallet-progress{height:4px;margin:22px auto;width:min(280px,80%);background:rgba(255,255,255,.08);border-radius:99px;overflow:hidden}.wallet-progress i{display:block;width:40%;height:100%;background:var(--wallet-accent);animation:wallet-progress 1.4s ease-in-out infinite}.wallet-connecting button{padding:8px 18px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:transparent;color:#d9e2d5}
.wallet-pairing{text-align:center;padding:14px 2px;display:grid;gap:10px}.wallet-pairing-mark{width:72px;height:72px;margin:0 auto;display:grid;place-items:center;border-radius:22px;background:rgba(163,255,18,.09);border:1px solid rgba(163,255,18,.24);color:var(--wallet-accent);font-size:35px}.wallet-pairing h3,.wallet-pairing p{margin:0}.wallet-pairing p,.wallet-pairing small{color:var(--wallet-muted)}.wallet-pairing code{display:block;max-height:80px;overflow:hidden;word-break:break-all;padding:10px;border-radius:12px;background:#080b08;color:#aeb8ab;font-size:9px;text-align:left}.wallet-pairing button{min-height:44px;border:0;border-radius:14px;background:var(--wallet-accent);color:#091007;font-weight:900}
.wallet-pairing-qr{width:min(248px,70vw);height:auto;aspect-ratio:1;margin:0 auto;padding:8px;border-radius:22px;background:#f2f8ed;box-shadow:0 14px 40px rgba(0,0,0,.34)}
.wallet-native-fallback{text-align:center;padding:14px 2px;display:grid;gap:10px}.wallet-native-fallback h3,.wallet-native-fallback p{margin:0}.wallet-native-fallback p,.wallet-native-fallback small{color:var(--wallet-muted)}.wallet-native-fallback .wallet-primary{display:grid;place-items:center;min-height:44px;text-decoration:none}
#walletSheetRoot :focus-visible{outline:2px solid var(--wallet-accent);outline-offset:2px}
@keyframes wallet-fade{from{opacity:0}to{opacity:1}}@keyframes wallet-rise{from{transform:translateY(28px);opacity:.35}to{transform:none;opacity:1}}@keyframes wallet-spin{to{transform:rotate(360deg)}}@keyframes wallet-progress{0%{transform:translateX(-120%)}100%{transform:translateX(350%)}}
@media (min-width:701px){#walletSheetRoot{place-items:center}.wallet-sheet-panel{border-bottom:1px solid var(--wallet-edge);border-radius:28px;max-height:min(82dvh,820px)}}
@media (max-width:700px){.mobile-connect.wallet-chip{flex:0 0 auto;width:auto;max-width:none;padding-inline:7px!important}.mobile-connect.wallet-chip .wallet-logo{width:28px;height:28px}.wallet-sheet-body{padding-inline:12px}.wallet-detail-actions{grid-template-columns:1fr}.wallet-sheet-panel{max-height:91dvh}}
@media (prefers-reduced-motion: reduce){.wallet-sheet-backdrop,.wallet-sheet-panel,.wallet-orbit i,.wallet-progress i{animation:none!important;transition:none!important}}
.wallet-app-chooser .wallet-logo>span{font-size:20px}.wallet-app-chooser a.wallet-all{display:block;text-align:center;text-decoration:none}
.wallet-countdown{display:block;color:var(--wallet-muted);font-size:12px;font-variant-numeric:tabular-nums}.wallet-native-fallback button.wallet-all{margin:0}.wallet-native-fallback>button:not(.wallet-all){background:none;border:0;color:var(--wallet-muted);font-size:13px;padding:6px}

/* Dollar value beside each leg of a trade (owner, 2026-09-07). Estimated from the catalog price while
   you type, replaced by the route's own usdIn/usdOut once the quote lands. */
.trade-usd{min-height:15px;margin-top:5px;font-size:12px;font-weight:600;color:var(--ms-mist,#a9b6ac);letter-spacing:.01em}
.trade-usd:empty{min-height:0;margin-top:0}

/* ==== modern-2026.css */
/* MemeSwap 2026 polish layer. Visual only: no control, route, or state changes. */
:root{
  --ms-volt:#a3ff12;
  --ms-volt-ink:#0b1204;
  --ms-surface-0:#080b09;
  --ms-surface-1:#0f1411;
  --ms-surface-2:#151c17;
  --ms-hairline:rgba(225,255,210,.09);
  --ms-hairline-strong:rgba(225,255,210,.17);
  --ms-text:#f0f5ee;
  --ms-muted:#a2ada3;
  --ms-ease:cubic-bezier(.2,.8,.2,1);
}

body.ms-site,body.ms-wallet{background:var(--ms-surface-0);color:var(--ms-text)}
body.ms-site{--cyan:var(--ms-volt)}
body.ms-wallet{--acc:var(--ms-volt)}
::selection{background:rgba(163,255,18,.28);color:#fff}

/* Compact, confident navigation. */
.ms-site .top,.ms-wallet .bar{
  background:rgba(8,12,9,.96);
  border-bottom-color:var(--ms-hairline-strong);
  box-shadow:0 10px 32px rgba(0,0,0,.2);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.ms-site .logo{letter-spacing:-.035em}
.ms-site .logo .ltld{color:var(--ms-volt)}
.ms-site .nav{padding:3px;border:1px solid var(--ms-hairline);border-radius:12px;background:rgba(255,255,255,.025)}
.ms-site .nav a{min-height:32px;display:inline-flex;align-items:center;border-radius:9px;padding-inline:12px}
.ms-site .nav a.on{color:var(--ms-volt);background:rgba(163,255,18,.09);box-shadow:inset 0 0 0 1px rgba(163,255,18,.12)}
.ms-site .wbtn{min-height:38px;border-radius:11px;border-color:var(--ms-hairline-strong);background:rgba(255,255,255,.035)}
.ms-site #btnWallets{background:var(--ms-volt);border-color:var(--ms-volt);color:var(--ms-volt-ink);box-shadow:0 8px 28px rgba(163,255,18,.1)}

/* A visible editorial hierarchy without pushing market data down. */
.ms-site .ms-masthead{
  position:relative;
  isolation:isolate;
  padding:30px clamp(20px,3vw,42px) 27px;
  background:
    radial-gradient(650px 240px at 78% 0,rgba(163,255,18,.11),transparent 68%),
    linear-gradient(112deg,#142019 0%,#0a0f0b 72%);
  border-bottom-color:var(--ms-hairline-strong);
  overflow:hidden;
}
.ms-site .ms-masthead::after{content:"";position:absolute;z-index:-1;right:9%;top:-75px;width:230px;height:230px;border:1px solid rgba(163,255,18,.1);border-radius:50%;box-shadow:0 0 0 34px rgba(163,255,18,.025),0 0 0 70px rgba(163,255,18,.015)}
.ms-site .ms-masthead h1{max-width:760px;margin-block:8px 10px;font-size:clamp(30px,4vw,52px);letter-spacing:-.055em}
.ms-site .ms-masthead h1 em{color:var(--ms-volt);font-style:normal}
.ms-site .ms-kicker{color:var(--ms-volt);letter-spacing:.18em}
.ms-site .ms-masthead p{color:var(--ms-muted);font-size:14px}
.ms-site .ms-stamp{transform:rotate(-3deg);border-radius:15px;padding:15px 17px;border-color:rgba(163,255,18,.55);background:rgba(163,255,18,.055);color:var(--ms-volt);box-shadow:0 14px 40px rgba(0,0,0,.25)}

/* Market controls and rows. */
.ms-site .bar{gap:9px}
.ms-site .bar .search input{border-color:var(--ms-hairline-strong);background:#080b09;border-radius:11px}
.ms-site .bar .search input:focus{border-color:var(--ms-volt);box-shadow:0 0 0 3px rgba(163,255,18,.13)}
.ms-site .pills{gap:6px}
.ms-site .pill{border-radius:10px;border-color:var(--ms-hairline-strong);background:rgba(255,255,255,.02);transition:background .14s var(--ms-ease),border-color .14s var(--ms-ease),color .14s var(--ms-ease)}
.ms-site .pill:hover{border-color:rgba(163,255,18,.4);color:var(--ms-text)}
.ms-site .pill.on{border-color:rgba(163,255,18,.52);background:rgba(163,255,18,.1);color:var(--ms-volt)}
.ms-site .wrap,.ms-site .panel,.ms-site .card,.ms-site .strip{background:var(--ms-surface-1);border-color:var(--ms-hairline);box-shadow:none}
.ms-site .swap.panel{background:linear-gradient(172deg,#141c16 0%,#0d120f 100%);border-color:rgba(225,255,210,.14);box-shadow:0 30px 80px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.04)}
.ms-site .swap .go{border-radius:16px;border:0}.ms-site .swap .go:hover{transform:none;filter:brightness(1.05)}.ms-site .swap .go:disabled{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.06);color:var(--ms-muted)}
.ms-site .swap .trade-secondary{border-radius:12px}.ms-site .swap .trade-box-row .amt input,.ms-site .swap .trade-pill select{border:0;background-color:transparent;min-height:0}
.ms-site thead th{background:#101511;color:#98a49a;border-bottom-color:var(--ms-hairline-strong)}
.ms-site tbody tr{transition:background-color .12s var(--ms-ease)}
.ms-site tbody tr:hover{background:rgba(255,255,255,.035)}
.ms-site .chip{font-weight:720}
.ms-site .foot{border-top-color:var(--ms-hairline);background:#080b09;color:#59635b}
.ms-site .foot b{color:#b4c0b6}.ms-site .foot a{color:#9aa79d;text-underline-offset:3px}.ms-site .foot a:hover{color:var(--ms-volt)}

/* Native-feeling wallet surfaces with predictable decoded logo geometry. */
.wallet-sheet-panel{background:linear-gradient(180deg,#141b16 0%,#0c110e 100%);border-color:var(--ms-hairline-strong);box-shadow:0 -30px 100px rgba(0,0,0,.62)}
.wallet-choice,.wallet-session-row{background:rgba(255,255,255,.03);border-color:var(--ms-hairline)}
.wallet-choice:hover,.wallet-session-row:hover{background:rgba(163,255,18,.05)}
.wallet-logo{contain:layout paint;background:#1a221c}
.wallet-logo img{display:block;width:100%;height:100%}

/* Desktop wallet stays dense and operational. */
.ms-wallet .bar{min-height:70px;padding-inline:18px}
.ms-wallet .bar .brand .ms-word{letter-spacing:-.04em}
.ms-wallet .tot b{letter-spacing:-.04em}
.ms-wallet .btn{border-radius:10px;border-color:var(--ms-hairline-strong);background:rgba(255,255,255,.035)}
.ms-wallet #bSwap{background:var(--ms-volt);border-color:var(--ms-volt);color:var(--ms-volt-ink);box-shadow:0 8px 24px rgba(163,255,18,.1)}
.ms-wallet .panel,.ms-wallet .sbox{background:var(--ms-surface-1);border-color:var(--ms-hairline);box-shadow:none}
.ms-wallet .phead,.ms-wallet thead th{background:#111813;border-color:var(--ms-hairline)}
.ms-wallet tbody tr:hover{background:rgba(163,255,18,.035)}
.ms-wallet .cpill.on{border-color:rgba(163,255,18,.48);background:rgba(163,255,18,.08)}

@media (max-width:700px){
  .ms-site .top{min-height:61px;padding:8px 10px;background:#090d0a;box-shadow:0 8px 24px rgba(0,0,0,.28)}
  .ms-site .mobile-connect,.ms-site .mobile-menu-button{border-color:var(--ms-hairline-strong);background:#111612;border-radius:12px}
  .ms-site .mobile-connect.on{border-color:rgba(163,255,18,.45);background:rgba(163,255,18,.08)}
  .ms-site .mobile-menu-panel{border-color:rgba(163,255,18,.2);background:#0d120f;box-shadow:0 24px 70px rgba(0,0,0,.72)}
  .ms-site .bar{top:61px;margin:-10px -10px 7px;padding:9px 10px 10px;background:linear-gradient(180deg,rgba(9,13,10,.99),rgba(9,13,10,.95));border-bottom:1px solid var(--ms-hairline);backdrop-filter:none;-webkit-backdrop-filter:none}
  .ms-site .bar .search{flex-basis:100%}
  .ms-site .bar .search input{min-height:45px;background:#070a08;font-size:16px}
  .ms-site .pills{width:100%;flex-wrap:nowrap;overflow-x:auto;padding:1px 0 3px;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .ms-site .pills::-webkit-scrollbar{height:0}
  .ms-site .pill{min-height:34px;display:inline-flex;align-items:center;flex:none;scroll-snap-align:start;padding-inline:12px}
  .ms-site .pill.on{background:var(--ms-volt);border-color:var(--ms-volt);color:var(--ms-volt-ink)}
  .ms-site .pill.on small{color:rgba(11,18,4,.62)}
  .mobile-grid{background:#090d0a;border-top-color:var(--ms-hairline)}
  /* contain-intrinsic-size is the content box: a skipped row was 68 + 14px padding + 1px border = 83px
     next to a rendered row of 68px (border-box min-height), so rows moved as they were revealed and on
     every 10 s redraw (CLS 0.026 per redraw, 8.0 over a scroll to the end, measured 2026-09-17). 53px
     makes the placeholder 68px too; auto keeps the rendered size once a row has been on screen. */
  .mobile-token{content-visibility:auto;contain-intrinsic-size:auto 53px;background:#090d0a;border-bottom-color:var(--ms-hairline);transition:background-color .1s var(--ms-ease)}
  .mobile-token:nth-child(2n){background:#0a0f0c}
  .mobile-token:active{background:rgba(163,255,18,.075)}
  .mobile-token>img,.mobile-token>.ph{box-shadow:0 0 0 1px rgba(255,255,255,.08)}
  .mt-name b{font-weight:800;letter-spacing:-.015em}
  .mt-price b{font-size:14px;letter-spacing:-.015em}
  .mt-tape{color:#a5b0a6}
  .ms-site .swap.panel{margin:20px 0 0;padding:22px 0 calc(22px + env(safe-area-inset-bottom));border:0;border-top:1px solid rgba(163,255,18,.18);border-radius:0;background:linear-gradient(180deg,rgba(25,38,25,.42),rgba(7,16,8,.34) 44%,transparent);box-shadow:none}
  .wallet-sheet-panel{border-radius:26px 26px 0 0}
  .wallet-choice{min-height:62px;border-radius:15px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ms-site .hero::before,.wallet-sheet-backdrop,.wallet-sheet-panel,.wallet-orbit i,.wallet-progress i{animation:none;transition:none}
}

/* ==== heat-ticker.css */
.heat-ticker{margin:18px 20px 22px;border:1px solid #b6ff4329;border-radius:18px;background:radial-gradient(ellipse at 8% 0,#b6ff4312,transparent 52%),#101810;overflow:hidden;color:#f3f7ec;box-shadow:0 12px 40px #0002}
.heat-ticker[hidden]{display:none}
/* The ticker is unhidden once the catalogue arrives. On the home page (no data-page yet, or home) its box
   is reserved from first paint so the list below does not move (CLS). Measured: 120px desktop, 130px on a
   phone, where the foot button is a 44px touch target. */
body:not([data-page]) .heat-ticker[hidden],body[data-page="home"] .heat-ticker[hidden]{display:block;visibility:hidden;box-sizing:border-box;min-height:120px}
@media(max-width:700px){body:not([data-page]) .heat-ticker[hidden],body[data-page="home"] .heat-ticker[hidden]{min-height:130px}}
.heat-ticker-foot button{border:0;border-radius:6px;background:transparent;color:#c5d7b8;font:inherit;padding:4px 6px;cursor:pointer;white-space:nowrap}
.heat-ticker-window{margin-top:10px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 18px),transparent)}
.heat-ticker-track{display:flex;width:max-content;animation:heat-marquee 145s linear infinite;will-change:transform}
.heat-ticker-group{display:flex;flex-shrink:0;gap:10px;padding-right:10px}
.heat-ticker-card{box-sizing:border-box;flex:0 0 244px;width:244px;display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:10px;padding:13px 12px;border:1px solid #d7efc814;border-radius:12px;background:linear-gradient(135deg,#20321b99,#131d16);color:#f3f7ec;text-decoration:none;position:relative}
.heat-ticker-card:hover{border-color:#b6ff4380;background:#23321b}
.heat-ticker-art{position:relative;width:34px;height:34px;border-radius:50%;background:#2d3e24;display:grid;place-items:center;font-size:10px;font-weight:800;overflow:hidden}
.heat-ticker-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.heat-ticker-name,.heat-ticker-market{min-width:0;display:flex;flex-direction:column;gap:5px}
.heat-ticker-name strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.02em}
.heat-ticker-name small{font-size:10px;color:#a9b6ac;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.heat-ticker-market{text-align:right;font-variant-numeric:tabular-nums}
.heat-ticker-market strong{font-size:13px;white-space:nowrap}
.heat-ticker-market small{font-size:11px;color:#a9b6ac}.heat-ticker-market .up{color:#b6ff43}.heat-ticker-market .down{color:#ff929f}
.heat-ticker-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 12px;font-size:10px;color:#899b88}
.heat-ticker-note{margin-left:auto}
.heat-ticker-window:hover .heat-ticker-track,.heat-ticker-window:focus-within .heat-ticker-track{animation-play-state:paused}
.heat-ticker.is-paused .heat-ticker-track{animation:none;transform:none;will-change:auto}
.heat-ticker.is-paused .heat-ticker-window{overflow-x:auto}
.heat-ticker.is-paused .heat-ticker-group[aria-hidden]{display:none}
.heat-ticker button:focus-visible,.heat-ticker a:focus-visible,.heat-ticker-window:focus-visible{outline:2px solid #b6ff43;outline-offset:-2px}
@keyframes heat-marquee{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.heat-ticker-track{animation:none;will-change:auto}.heat-ticker-window{overflow-x:auto}.heat-ticker-group[aria-hidden]{display:none}}
@media(max-width:700px){
  body.ms-site{background:radial-gradient(ellipse 120% 900px at 100% 100px,#79b93838,transparent 80%),#0b100c;background-attachment:fixed;isolation:isolate}
  body.ms-site::before{content:"";position:fixed;width:560px;height:560px;right:-340px;top:20px;border:48px solid #b6ff430a;border-radius:50%;box-shadow:0 0 0 62px #b6ff4307,0 0 0 124px #b6ff4304;z-index:-1;pointer-events:none}
  .ms-site .mobile-grid{background:transparent}
  .ms-site .mobile-token{background:transparent}
  .ms-site .mobile-token:nth-child(2n){background:#09110a1a}
  .ms-site .mobile-token:active{background:#b6ff4314}
  .ms-site .top{background:#090d0ae6}
  .ms-site .bar{background:linear-gradient(180deg,#09110ae6,#09110acc)}
  .heat-ticker{margin:12px 12px 16px;border-radius:16px;background:radial-gradient(ellipse at 90% 0,#b6ff431c,transparent 70%),#101810ed}
  .heat-ticker-foot{padding:4px 10px;font-size:9px;gap:8px}.heat-ticker-card{flex-basis:220px;width:220px;padding:12px 10px;gap:8px}.heat-ticker-track{animation-duration:132s}
}
@media(max-width:420px){.heat-ticker-note{display:none}}

/* ==== swap-polish.css */
/* Swap screen polish layer, 2026-09-09.
   Visual only: no control, route, or state changes, in the same spirit as modern-2026.css.
   Loaded last so it can raise the swap surface without any other stylesheet having to move.
   Everything here is either a background, a border, a shadow, a radius, a size or a transition. */

/* ---- 1. Depth behind the app -------------------------------------------------------------- */
/* The old background was one faint radial in the top right corner, which read as flat near black.
   Three fixed layers give the page somewhere to recede to: a volt glow behind the card, a cool
   counterweight low left so the volt does not look like a colour cast, and a fine grain that stops
   the large soft gradients banding on wide displays. */
body.ms-site{
  background-color:#080b09;
  background-image:
    radial-gradient(120% 760px at 84% -60px, rgba(163,255,18,.20), rgba(0,0,0,0) 62%),
    radial-gradient(90% 620px at 6% 108%, rgba(34,168,190,.16), rgba(0,0,0,0) 66%),
    radial-gradient(140% 100% at 50% 0%, rgba(255,255,255,.035), rgba(0,0,0,0) 46%),
    linear-gradient(180deg, #0a0f0b 0%, #070a08 58%, #050706 100%);
  background-attachment:fixed;
  background-repeat:no-repeat;
}
body.ms-site::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:.5;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E");
}
body.ms-site>*{position:relative;z-index:1}

/* ---- 2. Sit the card in the middle of the screen ------------------------------------------ */
/* It used to hang from the top with a large empty band above it on any tall display. */
@media (min-width:861px){
  main:has(>.bridge.panel.swap){
    min-height:calc(100dvh - 150px);
    align-items:center;
    justify-content:center;
  }
}

/* ---- 3. The card ------------------------------------------------------------------------- */
.ms-site .bridge.panel.swap{
  position:relative;
  border-radius:26px;
  border:1px solid rgba(225,255,210,.10);
  padding:20px 18px 22px;
  background:
    linear-gradient(178deg, rgba(30,42,32,.92) 0%, rgba(15,21,17,.94) 46%, rgba(11,15,12,.96) 100%);
  backdrop-filter:blur(18px) saturate(125%);
  -webkit-backdrop-filter:blur(18px) saturate(125%);
  box-shadow:
    0 1px 0 rgba(163,255,18,.22) inset,
    0 0 0 1px rgba(0,0,0,.4),
    0 28px 70px -20px rgba(0,0,0,.75),
    0 8px 24px -12px rgba(163,255,18,.14);
}
/* The volt hairline along the top edge is the inset shadow above, not a masked pseudo element.
   A ::before with mask-composite: exclude is the usual way to draw a gradient border, and on this
   card it rendered as three disconnected segments instead of a ring: a top edge stopping short, a
   stray vertical line down the middle with a rounded corner, and a horizontal run lower down.
   Chrome composites a masked pseudo element unreliably inside an element that also carries
   backdrop-filter. An inset shadow needs no mask, no extra box, and cannot come apart. */

/* ---- 4. Title ---------------------------------------------------------------------------- */
.ms-site .trade-title{
  font-size:19px;
  font-weight:800;
  letter-spacing:-.03em;
  color:#f3f8f0;
  padding-inline:4px;
}
.ms-site .trade-token-identity{letter-spacing:-.01em}

/* ---- 5. The pay and receive surfaces ----------------------------------------------------- */
/* The box is a grid. A grid's implicit column is `auto`, which sizes to max-content and refuses to
   shrink below it, so a long asset name or a full precision balance pushed every row past the right
   padding: measured 497px of content inside a 452px content box. minmax(0,1fr) is the fix, and the
   min-width:0 on the rows lets their own flex children shrink instead of forcing the column wide. */
.ms-site .trade-box{
  grid-template-columns:minmax(0,1fr);
  border-radius:20px;
  border:1px solid rgba(255,255,255,.055);
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.014));
  padding:15px 15px 13px;
  transition:border-color .18s cubic-bezier(.2,.8,.2,1), background .18s cubic-bezier(.2,.8,.2,1), box-shadow .18s cubic-bezier(.2,.8,.2,1);
}
.ms-site .trade-box:hover{border-color:rgba(255,255,255,.10)}
.ms-site .trade-box:focus-within{
  border-color:rgba(163,255,18,.42);
  background:linear-gradient(180deg, rgba(163,255,18,.055), rgba(255,255,255,.015));
  box-shadow:0 0 0 3px rgba(163,255,18,.09);
}
.ms-site .trade-box>*{min-width:0}
.ms-site .trade-box-head,
.ms-site .trade-box-row,
.ms-site .trade-box-foot{min-width:0}

/* The currency prefix is a separate element from the input, so while the field is empty the bright
   prefix sat next to a dim placeholder and "$0.00" read as two different colours. Match them. */
.ms-site .amt:has(input:placeholder-shown) .trade-amt-prefix{color:#5c675e}
.ms-site .trade-amt-prefix{transition:color .18s}

/* A full precision balance is long enough to crowd the percent buttons off the row. */
.ms-site .trade-box-foot{gap:12px;align-items:center}
.ms-site .trade-box-balance{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#8b968c;
  font-size:12px;
  font-variant-numeric:tabular-nums;
}
.ms-site .trade-presets{flex:none}

/* The asset pill must never reach the box edge. */
.ms-site .trade-box-row .trade-pill{max-width:min(56%,240px);min-width:0}
.ms-site .trade-pill select,
.ms-site .trade-pill .trade-pill-name,
.ms-site .trade-pill .trade-fixed{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* The unit toggle sits in the head row; keep it clear of the corner radius. */
.ms-site .trade-unit-toggle{flex:none;margin-right:2px}

.ms-site .trade-box-head{
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#8b968c;
}
/* The amount is the one number that matters on this screen, so give it the size to match. */
.ms-site .trade-box-row input,
.ms-site .trade-box-row .amount,
.ms-site .trade-box-row output{
  font-size:33px;
  font-weight:700;
  letter-spacing:-.035em;
}

/* ---- 6. The direction control ------------------------------------------------------------ */
/* It was a bare glyph on a zero height row, which is fine at 20px and covers the percent chips at
   40px. The row now claims its own height so the control sits in the seam instead of on top of the
   pay box. The negative margin keeps the two surfaces as close as they were. */
.ms-site .trade-divider{
  display:flex;
  align-items:center;
  justify-content:center;
  height:auto;
  min-height:44px;
  margin-block:-4px;
  overflow:visible;
}
.ms-site .trade-divider>span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:14px;
  border:1px solid rgba(225,255,210,.14);
  background:linear-gradient(180deg, #18211a, #10160f);
  box-shadow:0 8px 20px -8px rgba(0,0,0,.85), 0 0 0 4px rgba(8,11,9,.9);
  color:#a3ff12;
  transition:transform .22s cubic-bezier(.2,.8,.2,1), border-color .18s, box-shadow .18s;
}
.ms-site .trade-divider>span:hover{
  transform:rotate(180deg);
  border-color:rgba(163,255,18,.5);
  box-shadow:0 10px 24px -8px rgba(0,0,0,.9), 0 0 0 4px rgba(8,11,9,.9), 0 0 22px -4px rgba(163,255,18,.4);
}

/* ---- 7. Actions -------------------------------------------------------------------------- */
.ms-site .trade-screen button.go{
  width:100%;
  min-height:54px;
  border-radius:16px;
  padding:14px 18px;
  font-size:15px;
  font-weight:800;
  letter-spacing:-.01em;
  border:1px solid rgba(163,255,18,.9);
  background:linear-gradient(180deg, #c4ff4b, #9ae60f);
  color:#0b1204;
  box-shadow:0 14px 34px -14px rgba(163,255,18,.62), 0 1px 0 rgba(255,255,255,.35) inset;
  transition:transform .12s cubic-bezier(.2,.8,.2,1), box-shadow .18s, filter .18s;
}
.ms-site .trade-screen button.go:hover:not(:disabled){
  filter:brightness(1.05);
  box-shadow:0 18px 42px -14px rgba(163,255,18,.7), 0 1px 0 rgba(255,255,255,.4) inset;
}
.ms-site .trade-screen button.go:active:not(:disabled){transform:translateY(1px) scale(.995)}
.ms-site .trade-screen button.go:disabled{
  background:linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035));
  border-color:rgba(255,255,255,.09);
  color:#7f8a80;
  box-shadow:none;
}
.ms-site .trade-connect-button{
  min-height:46px;
  padding-inline:22px;
  background:linear-gradient(180deg, #c4ff4b, #9ae60f);
  box-shadow:0 12px 30px -14px rgba(163,255,18,.6), 0 1px 0 rgba(255,255,255,.35) inset;
  transition:filter .18s, box-shadow .18s, transform .12s;
}
.ms-site .trade-connect-button:hover{filter:brightness(1.05)}
.ms-site .trade-connect-button:active{transform:translateY(1px)}

/* ---- 8. Supporting blocks ---------------------------------------------------------------- */
.ms-site .trade-connect{
  border-radius:20px;
  border:1px dashed rgba(163,255,18,.26);
  background:radial-gradient(120% 130% at 50% -20%, rgba(163,255,18,.09), rgba(0,0,0,0) 70%);
  padding:18px 16px;
}
.ms-site .note.trade-status,
.ms-site .qbox{
  border-radius:14px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.022);
}
.ms-site .trade-warning{
  border-radius:16px;
  border:1px solid rgba(255,196,84,.28);
  background:rgba(255,176,32,.055);
}
.ms-site .trade-details summary{
  border-radius:11px;
  transition:color .18s, background .18s;
  cursor:pointer;
}
.ms-site .trade-details summary:hover{color:#a3ff12;background:rgba(163,255,18,.06)}

/* ---- 9. Token picker, same material as the card ------------------------------------------ */
.ms-site .trade-token-picker{
  border-radius:24px;
  border:1px solid rgba(225,255,210,.12);
  background:linear-gradient(178deg, rgba(26,36,28,.98), rgba(12,17,14,.99));
  box-shadow:0 40px 90px -24px rgba(0,0,0,.85);
}
.ms-site .trade-token-picker::backdrop{
  background:rgba(4,7,5,.62);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}

/* ---- 10. Small screens ------------------------------------------------------------------- */
@media (max-width:700px){
  .ms-site .bridge.panel.swap{border-radius:22px;padding:15px 13px 17px}
  .ms-site .trade-box-row input,
  .ms-site .trade-box-row .amount,
  .ms-site .trade-box-row output{font-size:28px}
  .ms-site .trade-screen button.go{min-height:50px;font-size:14px}
}

/* Respect a reduced motion preference: keep the look, drop the movement. */
@media (prefers-reduced-motion:reduce){
  .ms-site .trade-divider>span,
  .ms-site .trade-screen button.go,
  .ms-site .trade-connect-button{transition:none}
  .ms-site .trade-divider>span:hover{transform:none}
}