/* ═══════════════════════════════════════════════════════════════════════════════════════════════════════════
   dart · deck — the second design of the terminal (DART_DESIGN=m2). Loaded last on every page.
   Black and lime. A top line with an icon menu and one cluster on the right, lanes as hairline tapes of tickets
   with a launchpad spine, a chart cinema with the ticket beside it, a spotlight search, numbers in a mono face,
   Space Grotesk for text, Instrument Serif italic for titles. Accent / background / corners / density / numbers
   are the user's (Appearance sheet in m2.js, written as CSS variables on <html>).
   ═══════════════════════════════════════════════════════════════════════════════════════════════════════════ */
@font-face{font-family:'Space Grotesk';src:url('/fonts/space-grotesk-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url('/fonts/space-grotesk-latin-500-normal.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url('/fonts/space-grotesk-latin-600-normal.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url('/fonts/space-grotesk-latin-700-normal.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('/fonts/jetbrains-mono-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('/fonts/jetbrains-mono-latin-500-normal.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('/fonts/jetbrains-mono-latin-600-normal.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('/fonts/jetbrains-mono-latin-700-normal.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Instrument Serif';src:url('/fonts/instrument-serif-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Instrument Serif';src:url('/fonts/instrument-serif-latin-400-italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}

/* ── tokens (the Appearance sheet overrides accent, surfaces and radii inline on <html>) ── */
html[data-design=m2]{
  --font:'Space Grotesk',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,Menlo,monospace; --serif:'Space Grotesk',-apple-system,BlinkMacSystemFont,sans-serif;
  --bg:#070708; --panel:#0e0e10; --panel-2:#0b0b0c; --card:#131315; --card-hover:#19191c; --card-hot:#15170f; --raised:#1b1b1f;
  --line:#1f1f23; --line-2:#2b2b31; --hairline:#17171a; --hover:#19191c; --chip:#1b1b1f;
  --text:#f4f4f2; --sub:#9c9c9a; --sub-2:#d2d2ce; --dim:#5f5f63;
  --accent:#c6f135; --accent-2:#d9ff5a; --on-accent:#0b0f03; --accent-bg:rgba(198,241,53,.14); --accent-line:rgba(198,241,53,.45); --glow:rgba(198,241,53,.3);
  --green:#34d17b; --green-2:#6ee7a8; --green-bg:rgba(52,209,123,.14); --green-tint:rgba(52,209,123,.08); --green-line:rgba(52,209,123,.4);
  --red:#ff5c5c; --red-2:#ff8080; --red-bg:rgba(255,92,92,.14);
  --yellow:#f2c14e; --orange:#f78c3a; --yellow-bg:rgba(242,193,78,.14); --yellow-line:rgba(242,193,78,.4);
  --blue:#8ab4ff; --blue2:#a9c6ff; --blue-bg:rgba(138,180,255,.14); --quote:#c9c9c4; --quote-bg:rgba(255,255,255,.06); --cyan:#6fd8e8; --purple:#b8a6ff; --bnb:#f0b90b;
  --near:var(--accent); --ink:var(--accent); --on-ink:var(--on-accent); --paper:var(--panel); --tile-bg:#1b1b1f; --tile-ini:#1e2214; --wm:rgba(244,244,242,.04); --scroll:#2b2b31; --dim-ring:rgba(244,244,242,.12);
  --r:10px; --r-sm:6px; --shadow:0 24px 60px rgba(0,0,0,.6); color-scheme:dark;
  --rowpad:14px 12px 12px 18px; --rowgap:8px;
}
html[data-design=m2][data-density=compact]{--rowpad:9px 10px 8px 16px;--rowgap:5px}
html[data-design=m2][data-numbers=sans]{--mono:var(--font)}

/* ── base ── */
html[data-design=m2] body{font-family:var(--font);background:var(--bg);color:var(--text);letter-spacing:-.01em}
html[data-design=m2] body::before{display:none}
html[data-design=m2] *{scrollbar-color:var(--scroll) transparent}
html[data-design=m2] .rgt,html[data-design=m2] .st .v,html[data-design=m2] .bal .big,html[data-design=m2] .bal .kv b,html[data-design=m2] td,html[data-design=m2] .th .mc,html[data-design=m2] .th .price,html[data-design=m2] .cal-d,html[data-design=m2] .cal-kpi b,html[data-design=m2] .gs-st,html[data-design=m2] .fd .n,html[data-design=m2] footer.foot .px,html[data-design=m2] .ntf-t b,html[data-design=m2] .lane .row .l3,html[data-design=m2] .row .l4{font-family:var(--mono);font-variant-numeric:tabular-nums}
html[data-design=m2] input,html[data-design=m2] select,html[data-design=m2] textarea,html[data-design=m2] button{font-family:inherit}
html[data-design=m2] ::selection{background:var(--accent-bg)}
html[data-design=m2] a{color:inherit}

/* ── the top line: wordmark · icon menu · one cluster ── */
html[data-design=m2] .nav{height:60px;display:grid!important;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:0 20px;background:var(--bg)!important;border-bottom:1px solid var(--line)!important;backdrop-filter:none}
html[data-design=m2] .nav .logo{gap:0}
html[data-design=m2] .nav .logo span{font-family:var(--serif);font-style:normal;font-weight:700;font-size:24px;letter-spacing:-.03em;text-transform:lowercase;color:var(--text)}
html[data-design=m2] .nav .logo .mark,html[data-design=m2] .nav .logo .ed{display:none}
html[data-design=m2] .nav .menu{display:flex!important;justify-content:center;gap:2px;font-size:13px;font-weight:500}
html[data-design=m2] .nav .menu a{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 14px;border-radius:var(--r);color:var(--sub);text-decoration:none;transition:background .12s,color .12s}
html[data-design=m2] .nav .menu a svg{width:17px;height:17px}
html[data-design=m2] .nav .menu a:hover{color:var(--text);background:var(--hover)}
html[data-design=m2] .nav .menu a.on{color:var(--on-accent);background:var(--accent)}
html[data-design=m2] .nav .menu a.on svg{color:var(--on-accent)}
.m2-more, .m2-more-b, .m2-more-l { display: none !important; }
html[data-design=m2] .nav .r{display:flex;align-items:center;gap:4px;padding:4px;background:var(--panel);border:1px solid var(--line);border-radius:calc(var(--r) + 4px)}
html[data-design=m2] .nav .r > *{height:36px!important;border-radius:var(--r)!important;border:0!important;background:transparent!important;color:var(--text);font-size:13px;font-weight:500}
html[data-design=m2] .nav .r .search,html[data-design=m2] .nav .r .pill.ext{display:none!important}
html[data-design=m2] .nav .r .ibtn{width:36px;display:grid;place-items:center;color:var(--sub)} html[data-design=m2] .nav .r .ibtn svg{width:17px;height:17px}
html[data-design=m2] .nav .r .ibtn:hover,html[data-design=m2] .nav .r .pill:hover,html[data-design=m2] .nav .r #mt-lang:hover{background:var(--hover)!important;color:var(--text)}
html[data-design=m2] .nav .r #mt-lang{display:inline-flex;align-items:center;gap:6px;min-width:0;padding:0 10px;margin:0;font-weight:600;font-size:12px}
html[data-design=m2] .nav .r #mt-lang .flag{font-size:15px;line-height:1}
html[data-design=m2] .nav .r .dd{height:36px!important} html[data-design=m2] .nav .r .dd .pill{height:36px;border:0;background:transparent;border-radius:var(--r);padding:0 10px}
html[data-design=m2] .nav .r .pill{padding:0 12px;gap:8px}
html[data-design=m2] .nav .r #open-wallets{background:var(--card)!important;border:1px solid var(--line-2)!important}
html[data-design=m2] .nav .r #open-wallets .eth{width:18px;height:18px}
html[data-design=m2] .nav .r .ab.login,html[data-design=m2] .nav .r .ab.login.wait{background:var(--accent)!important;color:var(--on-accent)!important;border-color:var(--accent)!important;font-weight:700;padding:0 16px}
html[data-design=m2] .nav .r .ab:not(.login){background:var(--card)!important;border:1px solid var(--line-2)!important}
html[data-design=m2] .nav .r .dd-menu{border-radius:var(--r);border-color:var(--line-2);background:var(--panel);padding:6px;top:calc(100% + 10px)}
html[data-design=m2] .nav .r .dd-menu button{border-radius:var(--r-sm)} html[data-design=m2] .nav .r .dd-menu button.on{color:var(--accent)}
html[data-design=m2] #mt-lang-menu{border-radius:var(--r);border-color:var(--line-2);background:var(--panel);padding:6px;min-width:220px}
html[data-design=m2] #mt-lang-menu button{height:40px;border-radius:var(--r-sm);font:500 13.5px/1 var(--font);gap:10px;color:var(--text)}
html[data-design=m2] #mt-lang-menu button .flag{font-size:18px;width:24px;text-align:center;color:inherit;background:transparent}
html[data-design=m2] #mt-lang-menu button small{margin-left:auto;color:var(--dim);font-family:var(--mono);font-size:11px}
html[data-design=m2] #mt-lang-menu button.on{background:var(--accent-bg);color:var(--text)} html[data-design=m2] #mt-lang-menu button.on small{color:var(--accent)}
html[data-design=m2] #mt-lang-menu button:hover{background:var(--hover)}
@media (max-width:1100px){html[data-design=m2] .nav{grid-template-columns:auto auto;gap:8px}html[data-design=m2] .nav .menu{display:none!important}html[data-design=m2] .nav .r{margin-left:auto}}

/* ── the watch strip and the board bar ── */
html[data-design=m2] .wl:has(> .wl-t){background:transparent;border:0;padding:6px 20px 0;color:var(--sub)}
html[data-design=m2] .wl .wl-t{color:var(--dim);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
html[data-design=m2] .tbar{background:transparent;border-bottom:1px solid var(--line);padding:10px 20px;gap:12px}
html[data-design=m2] .tbar .tb-t{font-family:var(--serif);font-style:normal;font-weight:700;font-size:18px;letter-spacing:-.02em;text-transform:lowercase;color:var(--text)}
html[data-design=m2] .tbar .tb-t svg{display:none}
html[data-design=m2] .tbar .amt,html[data-design=m2] .lane-h .lamt{height:32px;border-radius:var(--r-sm);background:var(--panel);border:1px solid var(--line-2);color:var(--sub);font-family:var(--mono)}
html[data-design=m2] .tbar .amt input,html[data-design=m2] .lane-h .lamt input{background:transparent!important;border:0!important;box-shadow:none!important;color:var(--text)!important;font-family:var(--mono);font-weight:600}
html[data-design=m2] .tbar .amt svg,html[data-design=m2] .lane-h .lamt svg{color:var(--accent)}
html[data-design=m2] .tbar .seg,html[data-design=m2] .lane-h .presets,html[data-design=m2] .tfs,html[data-design=m2] .tp#tpresets,html[data-design=m2] .segx{border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line-2);background:var(--panel)}
html[data-design=m2] .tbar .seg button.on,html[data-design=m2] .lane-h .presets button.on,html[data-design=m2] .tfs button.on,html[data-design=m2] .tp#tpresets button.on,html[data-design=m2] .segx button.on{background:var(--accent)!important;color:var(--on-accent)!important}
html[data-design=m2] .tbar #state{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase}
html[data-design=m2] .tbar #state .dot{background:var(--accent)!important;box-shadow:0 0 0 3px var(--accent-bg)!important}
html[data-design=m2] .tbar #state.off .dot{background:var(--red)!important}
html[data-design=m2] .tbar #wcount{height:32px!important;border-radius:var(--r-sm);font-family:var(--mono);border-color:var(--line-2)}
html[data-design=m2] .tbar .toggle.on .sw{background:var(--accent-bg)} html[data-design=m2] .tbar .toggle.on .sw::after{background:var(--accent)}
html[data-design=m2] .tbar .chains,html[data-design=m2] #speed{display:none!important}

/* ── the board: three tapes, hairlines, tickets with a launchpad spine ── */
html[data-design=m2] .lanes,html[data-design=m2] main.lanes{padding:0 20px 20px;gap:0}
html[data-design=m2] .lane{background:transparent!important;border:0!important;border-right:1px solid var(--line)!important;border-radius:0;padding:0 14px 0 0;margin-right:14px}
html[data-design=m2] .lane:last-child{border-right:0!important;margin-right:0;padding-right:0}
html[data-design=m2] .lane-h{background:transparent;border-bottom:1px solid var(--line);height:44px;padding:0 2px}
html[data-design=m2] .lane-h h2{font-family:var(--font);font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--sub-2)}
html[data-design=m2] .lane-h h2 svg{display:none}
html[data-design=m2] .lane-h .cnt,html[data-design=m2] .lane-h .n{font-family:var(--mono);font-size:11px;color:var(--accent);background:transparent;border:1px solid var(--accent-line);border-radius:4px;padding:0 6px}
html[data-design=m2] .lane-h .ib.on{color:var(--accent)}
html[data-design=m2] .lane-h .lsp,html[data-design=m2] [data-lspeed]{display:none!important}
html[data-design=m2] .lane .rows,html[data-design=m2] .lane .list{gap:0;padding:0}
html[data-design=m2] .lane .row,html[data-design=m2] .lane .tok{position:relative;background:transparent!important;border:0!important;border-bottom:1px solid var(--hairline)!important;border-radius:0!important;padding:var(--rowpad)!important;margin:0!important;box-shadow:none;row-gap:var(--rowgap)}
html[data-design=m2] .lane .row::before{content:"";position:absolute;left:0;top:14px;bottom:12px;width:3px;border-radius:2px;background:var(--lp,var(--line-2))}
html[data-design=m2] .lane .row:hover{background:var(--hover)!important}
html[data-design=m2] .lane .row.fresh,html[data-design=m2] .row.hot{background:var(--card-hot)!important}
html[data-design=m2] .lane .row .lft .av,html[data-design=m2] .row .av.tile{width:54px!important;height:54px!important;border-radius:10px!important}
html[data-design=m2] .tile .pic,html[data-design=m2] .tile .ini{border-radius:8px}
html[data-design=m2] .tile .lpb{border-radius:5px!important;background:var(--panel)!important;border:1px solid var(--line-2)!important}
html[data-design=m2] .lane .row .l1 .tk{font-size:15.5px;font-weight:600;letter-spacing:-.01em}
html[data-design=m2] .lane .row .l1 .nm{font-size:12.5px;color:var(--sub)}
html[data-design=m2] .lane .row .l2 .pill2,html[data-design=m2] .lane .row .pill2{border-radius:4px;height:20px;padding:0 6px;font-size:11px;background:transparent!important;border:1px solid var(--line-2)!important;color:var(--sub-2)!important}
html[data-design=m2] .lane .row .pill2.q{color:var(--sub-2)!important}
html[data-design=m2] .lane .row .l3,html[data-design=m2] .row .l4{color:var(--sub);font-size:11.5px}
html[data-design=m2] .lane .row .l3 .age,html[data-design=m2] .lane .row .age{color:var(--accent)!important}
html[data-design=m2] .lane .row .xh,html[data-design=m2] .lane .row .l3 a.xh,html[data-design=m2] .lane .row .l3 .xf{background:transparent!important;border:1px solid var(--line-2)!important;color:var(--sub-2)!important;border-radius:4px}
html[data-design=m2] .lane .row .xh.xa-new,html[data-design=m2] .lane .row .xh.xa-mid,html[data-design=m2] .lane .row .xh.xa-old{color:var(--sub-2)!important}
html[data-design=m2] .lane .row .rgt .kv .kvi b,html[data-design=m2] .lane .row .rgt .mc{font-family:var(--mono);font-size:14.5px;font-weight:600;letter-spacing:-.02em}
html[data-design=m2] .lane .row .rgt .f{color:var(--sub);font-family:var(--mono);font-size:11.5px}
html[data-design=m2] .lane .row .risk{font-family:var(--mono);font-size:11px;opacity:.85}
html[data-design=m2] .lane .row .risk .rp{border-radius:4px;background:transparent;border:1px solid var(--hairline)}
html[data-design=m2] .lane .row .buyw .buy{width:46px!important;min-width:46px!important;height:46px!important;padding:0!important;border-radius:var(--r)!important;background:var(--accent)!important;color:var(--on-accent)!important;border:0;display:grid;place-items:center;box-shadow:none}
html[data-design=m2] .lane .row .buyw .buy .txt{display:none} html[data-design=m2] .lane .row .buyw .buy svg{width:18px;height:18px;fill:currentColor}
html[data-design=m2] .lane .row .buyw .buy:hover{background:var(--accent-2)!important}
html[data-design=m2] .lane .row .buyw .buy.alt{background:var(--chip)!important;color:var(--text)!important}
html[data-design=m2] .lane .row .buyw .sellq{border-radius:var(--r-sm)}
html[data-design=m2] .lane .row .ca{border-radius:4px;background:transparent;border:1px solid var(--line-2);font-family:var(--mono)}
html[data-design=m2] .lane .row .lact button{border-radius:var(--r-sm)}
html[data-design=m2] .lane .row .tb i{border-radius:4px}

/* ── the token page ── */
html[data-design=m2] .wrap{padding:0 20px 20px;gap:16px}
html[data-design=m2] .left .panel,html[data-design=m2] .right .panel,html[data-design=m2] .chartp,html[data-design=m2] .tabsp{background:transparent;border:0;border-radius:0}
html[data-design=m2] .th{padding:18px 0 14px!important;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent!important}
html[data-design=m2] .th .tile,html[data-design=m2] .th .av{width:60px!important;height:60px!important;border-radius:12px!important}
html[data-design=m2] .th .sym,html[data-design=m2] .th h1,html[data-design=m2] .th .name b{font-size:24px!important;font-weight:600;letter-spacing:-.02em}
html[data-design=m2] .th .mc,html[data-design=m2] .th .price,html[data-design=m2] .th .big{font-family:var(--mono)!important;font-size:38px!important;font-weight:600!important;letter-spacing:-.04em;color:var(--text)!important}
html[data-design=m2] .th .mc.up,html[data-design=m2] .th .mc.g{color:var(--green)!important} html[data-design=m2] .th .mc.down,html[data-design=m2] .th .mc.r{color:var(--red)!important}
html[data-design=m2] .th .st .k{font-size:10.5px;letter-spacing:.14em;color:var(--dim)}
html[data-design=m2] .th .st .v{font-size:14px;font-weight:500}
html[data-design=m2] .th .pill,html[data-design=m2] .th .lp,html[data-design=m2] .th .chip,html[data-design=m2] .th .pill2{border-radius:4px;background:transparent;border:1px solid var(--line-2);color:var(--sub-2)}
html[data-design=m2] .th .spark{display:none!important}
html[data-design=m2] .cbar{background:transparent;border-bottom:1px solid var(--line);padding:6px 0;gap:6px}
html[data-design=m2] .cbar button,html[data-design=m2] .cbar .dd > button{border-radius:var(--r-sm);height:28px;padding:0 10px;font-size:12px;font-family:var(--mono)}
html[data-design=m2] .cbar button.on,html[data-design=m2] .cbar .tog.on{background:var(--accent-bg);color:var(--accent)}
html[data-design=m2] .charthost{background:var(--bg);border:0;border-radius:0}
html[data-design=m2] .charthost .ttl{left:0;top:8px;padding:8px 12px;border-radius:0;border:0;border-left:3px solid var(--accent);background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:blur(8px);font-family:var(--mono)}
html[data-design=m2] .charthost .wm{display:none}
html[data-design=m2] .cfoot{border-top:1px solid var(--line);background:transparent;font-family:var(--mono)}
html[data-design=m2] .cfoot button{border-radius:var(--r-sm)}
html[data-design=m2] .tabsp .tabs{gap:18px;padding:0;border-bottom:1px solid var(--line);background:transparent}
html[data-design=m2] .tabsp .tabs button{height:40px;padding:0;border-radius:0;border:0;border-bottom:2px solid transparent!important;color:var(--sub);font-weight:500;font-size:13px;background:transparent!important}
html[data-design=m2] .tabsp .tabs button.on{color:var(--text);border-bottom-color:var(--accent)!important}
html[data-design=m2] .tabsp .tabs .n,html[data-design=m2] .tabsp .tabs .cnt{font-family:var(--mono);color:var(--accent);background:transparent;border:1px solid var(--accent-line);border-radius:4px}
html[data-design=m2] .tabsp .tbody table th{font-weight:500;color:var(--dim);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase}
html[data-design=m2] .tabsp .tbody table td{padding-top:9px;padding-bottom:9px;border-color:var(--hairline);font-family:var(--mono);font-size:12.5px}
html[data-design=m2] .gsplit{opacity:0}
html[data-design=m2] .right{gap:16px}
html[data-design=m2] .right .chg{border-radius:var(--r);padding:10px 12px;background:var(--panel);border:1px solid var(--line);font-family:var(--mono)}
html[data-design=m2] .right .trade{border-radius:var(--r);padding:0;background:var(--panel);border:1px solid var(--line);overflow:hidden}
html[data-design=m2] .right .trade .ctl{gap:8px;margin:0;padding:12px 14px;border-bottom:1px solid var(--line)}
html[data-design=m2] .right .trade .ctl .tp{display:none}
html[data-design=m2] .right .trade .ctl .wsel,html[data-design=m2] .right .trade .ctl .ic{border-radius:var(--r-sm);height:32px}
html[data-design=m2] .right .trade .seg{border-radius:0;background:transparent;border:0;border-bottom:1px solid var(--line);padding:0;gap:0;margin:0}
html[data-design=m2] .right .trade .seg button{height:46px;border-radius:0;font-weight:600;border:0;border-bottom:2px solid transparent;font-size:14px;color:var(--sub);background:transparent!important}
html[data-design=m2] .right .trade .seg button.buy.on{color:var(--green);border-bottom-color:var(--green)}
html[data-design=m2] .right .trade .seg button.sell.on{color:var(--red);border-bottom-color:var(--red)}
html[data-design=m2] .right .trade .seg button.auto.on{color:var(--accent);border-bottom-color:var(--accent)}
html[data-design=m2] .right .trade .otype,html[data-design=m2] .right .trade .quote,html[data-design=m2] .right .trade .presets,html[data-design=m2] .right .trade .inp,html[data-design=m2] .right .trade .notice,html[data-design=m2] .right .trade .speed,html[data-design=m2] .right .trade .pos,html[data-design=m2] .right .trade .hint{margin-left:14px!important;margin-right:14px!important}
html[data-design=m2] .right .trade .go{margin:0 14px 14px!important;width:auto!important;display:flex;align-items:center;justify-content:center}
html[data-design=m2] .right .trade .otype{margin-top:12px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
html[data-design=m2] .right .trade .inp{height:72px;border-radius:var(--r-sm);background:var(--bg);border:1px solid var(--line-2);font-family:var(--mono);font-size:30px;font-weight:600;letter-spacing:-.03em;padding:0 14px}
html[data-design=m2] .right .trade .inp input{background:transparent!important;border:0!important;box-shadow:none!important;font-family:var(--mono);font-weight:600}
html[data-design=m2] .right .trade .inp .usd{font-family:var(--mono);font-size:12px;color:var(--sub)}
html[data-design=m2] .right .trade .presets{display:grid;grid-template-columns:repeat(4,1fr) auto auto;gap:6px;margin-top:8px!important}
html[data-design=m2] .right .trade .presets button{height:38px;border-radius:var(--r-sm);background:transparent;border:1px solid var(--line-2);font-family:var(--mono);font-weight:600;color:var(--sub-2)}
html[data-design=m2] .right .trade .presets button.on{border-color:var(--accent);color:var(--accent);background:var(--accent-bg)}
html[data-design=m2] .right .trade .quote{color:var(--sub);font-size:12px;font-family:var(--mono);margin-top:8px}
html[data-design=m2] .right .trade .go{height:54px!important;border-radius:var(--r-sm)!important;font-size:15px!important;font-weight:700!important;letter-spacing:.02em;text-transform:uppercase;background:var(--accent)!important;color:var(--on-accent)!important;border:0!important;box-shadow:none}
html[data-design=m2] .right .trade .go.sell{background:var(--red)!important;color:#fff!important}
html[data-design=m2] .right .trade .go:hover{filter:brightness(1.06)}
html[data-design=m2] .right .trade .dry,html[data-design=m2] .right .trade .cfg,html[data-design=m2] .right .trade .speed-hint{display:none}
html[data-design=m2] .right .trade .speed .seg2{border-radius:var(--r-sm);background:transparent;border:1px solid var(--line)}
html[data-design=m2] .right .trade .speed .seg2 button.on{background:var(--chip);color:var(--text)}
html[data-design=m2] .right .trade .acc{border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;margin:0!important;padding:10px 14px 12px}
html[data-design=m2] .right .trade .acc .h .chk{border-radius:4px}
html[data-design=m2] .right .audit{border-radius:var(--r);background:var(--panel);border:1px solid var(--line)}

/* ── portfolio: a ledger ── */
html[data-design=m2] div.sub{background:transparent;border-bottom:1px solid var(--line)}
html[data-design=m2] .pf .top,html[data-design=m2] .wrap > .top{border:0;gap:0}
html[data-design=m2] .wal,html[data-design=m2] .stats,html[data-design=m2] .bot{border:0;background:transparent}
html[data-design=m2] .wal{border-right:1px solid var(--line)}
html[data-design=m2] .wal-h,html[data-design=m2] .stats-h{border-bottom:1px solid var(--line);height:48px;padding:0 18px}
html[data-design=m2] .wal-h h2,html[data-design=m2] .stats-h h2{font-family:var(--serif);font-style:italic;font-weight:400;font-size:22px;text-transform:lowercase}
html[data-design=m2] .wal-h h2 svg{display:none}
html[data-design=m2] .wal-h .crumb{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
html[data-design=m2] .wal-h .r .act,html[data-design=m2] .stats-h .r .act{height:30px;padding:0 10px;border-radius:var(--r-sm);border:1px solid var(--line-2);color:var(--text);font-weight:500;font-size:12px;background:transparent}
html[data-design=m2] .wal-h .r .act.g{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
html[data-design=m2] .bal{padding:22px 18px;gap:6px 24px}
html[data-design=m2] .bal .k{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
html[data-design=m2] .bal .big{font-size:42px;font-weight:600;letter-spacing:-.04em}
html[data-design=m2] .bal .big small{font-family:var(--mono);font-size:14px;color:var(--sub)}
html[data-design=m2] .bal .kv{font-size:12px;color:var(--sub);padding:7px 0;border-bottom:1px solid var(--hairline);justify-content:space-between}
html[data-design=m2] .bal .kv b{font-size:13.5px;font-weight:600}
html[data-design=m2] .wal .actions{gap:0;padding:6px 10px 12px;border-top:1px solid var(--line);grid-template-columns:repeat(5,1fr)}
html[data-design=m2] .action{flex-direction:row;gap:8px;padding:10px 8px;border-radius:var(--r-sm);font-size:12.5px;font-weight:500;justify-content:flex-start}
html[data-design=m2] .action .ico{width:30px;height:30px;border-radius:8px;background:transparent;border:1px solid var(--line-2);color:var(--accent)}
html[data-design=m2] .action .ico svg{width:15px;height:15px}
html[data-design=m2] .action:hover .ico{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
html[data-design=m2] th{background:var(--bg);border-color:var(--line);color:var(--dim);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:500}
html[data-design=m2] td{height:46px;border-color:var(--hairline);font-size:12.5px}
html[data-design=m2] tr:hover td{background:var(--hover)}
html[data-design=m2] .wname b{font-family:var(--font);font-size:13.5px}
html[data-design=m2] .tabs{height:44px;border-bottom:1px solid var(--line);gap:18px;padding:0 18px}
html[data-design=m2] .tabs button[data-tab]{padding:0;border-bottom:2px solid transparent;font-weight:500}
html[data-design=m2] .tabs button[data-tab].on{color:var(--text);border-bottom-color:var(--accent)}
html[data-design=m2] .tabs .n{color:var(--accent);font-family:var(--mono)}
html[data-design=m2] .tabs label{height:26px;padding:0 8px;border-radius:4px;border:1px solid var(--line);font-size:11.5px;color:var(--sub)}
html[data-design=m2] .tabs label:has(input:checked){border-color:var(--accent-line);color:var(--text);background:var(--accent-bg)}
html[data-design=m2] .tabs label input{display:none}
html[data-design=m2] .tabs .search{border-radius:var(--r-sm);background:var(--panel)} html[data-design=m2] .tabs .search input{background:transparent!important;border:0!important}
html[data-design=m2] .sellp{border-radius:var(--r-sm);font-family:var(--mono)} html[data-design=m2] .sellp input{background:transparent!important;border:0!important}
html[data-design=m2] .empty2 .ic{border-radius:12px;background:transparent;border:1px solid var(--line-2);color:var(--accent)}
html[data-design=m2] .empty2 b{font-family:var(--font)}
html[data-design=m2] .btn2{border-radius:var(--r-sm);height:34px}
html[data-design=m2] .btn2.primary{background:var(--accent)!important;color:var(--on-accent)!important;border-color:var(--accent)!important}
html[data-design=m2] #a-refresh{color:var(--accent)}
html[data-design=m2] .cal-wrap{background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(10px);padding:3vh 16px}
html[data-design=m2] .cal-wrap .cal{width:min(1120px,100%);max-height:94vh;display:flex;flex-direction:column;border-radius:var(--r);border:1px solid var(--line-2);background:var(--panel)}
html[data-design=m2] .cal-wrap .cal-h{padding:20px 24px 8px;gap:12px} html[data-design=m2] .cal-wrap .cal-h h3{font-family:var(--serif);font-style:italic;font-weight:400;font-size:28px;text-transform:lowercase}
html[data-design=m2] .cal-wrap .cal-nav b{font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase;min-width:150px}
html[data-design=m2] .cal-wrap .cal-nav button,html[data-design=m2] .cal-wrap .cal-x{width:32px;height:32px;border-radius:var(--r-sm);border:1px solid var(--line)}
html[data-design=m2] .cal-wrap .cal-sum{padding:0 24px 10px;flex-direction:row;align-items:baseline;gap:18px;flex-wrap:wrap}
html[data-design=m2] .cal-wrap .cal-sum b{font-family:var(--mono);font-size:36px;letter-spacing:-.04em}
html[data-design=m2] .cal-wrap .cal-bar{display:none} html[data-design=m2] .cal-wrap .cal-split{gap:14px;font-family:var(--mono)}
html[data-design=m2] .cal-wrap .cal-grid{flex:1;min-height:0;overflow:auto;gap:1px;padding:0 24px 16px}
html[data-design=m2] .cal-wrap .cal-grid .wd{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);text-align:left;padding:0 0 6px 8px}
html[data-design=m2] .cal-wrap .cal-d{min-height:92px;border-radius:0;background:var(--card);border:1px solid var(--line);margin:-1px 0 0 -1px;padding:10px;align-items:flex-end;justify-content:flex-start;font-size:15px;font-weight:600;color:var(--sub-2)}
html[data-design=m2] .cal-wrap .cal-d span{top:8px;left:10px;font-size:11px;color:var(--dim);font-family:var(--mono)}
html[data-design=m2] .cal-wrap .cal-d.g{color:var(--green)} html[data-design=m2] .cal-wrap .cal-d.r{color:var(--red)}
html[data-design=m2] .cal-wrap .cal-d.best{box-shadow:inset 0 0 0 2px var(--accent)} html[data-design=m2] .cal-wrap .cal-d.today span{color:var(--accent)}
html[data-design=m2] .cal-wrap .cal-d.pad{background:transparent;border-color:transparent}
html[data-design=m2] .cal-wrap .cal-f{padding:12px 24px 18px;font-family:var(--mono);font-size:11.5px}

/* ── tracker: a header strip, wallet cards, the feed as a tape ── */
html[data-design=m2] body:has(.tp > .tp-l){overflow:auto!important;height:auto!important;display:block!important;min-height:100vh}
html[data-design=m2] .tp:has(> .tp-l){display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:16px;padding:18px 20px 24px;border:0}
html[data-design=m2] .tp-l{border:0;overflow:visible;max-height:none}
html[data-design=m2] .tp-h{padding:0 2px 14px;flex-wrap:wrap;gap:8px}
html[data-design=m2] .tp-h h1{font-family:var(--serif);font-style:italic;font-weight:400;font-size:30px;text-transform:lowercase}
html[data-design=m2] .tp-h .cnt{font-family:var(--mono);border:1px solid var(--accent-line);color:var(--accent);background:transparent;border-radius:4px;font-size:11px}
html[data-design=m2] .btn{border-radius:var(--r-sm);height:36px;padding:0 14px;font-weight:600;border-color:var(--line-2)}
html[data-design=m2] .btn.primary{background:var(--accent)!important;color:var(--on-accent)!important;border-color:var(--accent)!important}
html[data-design=m2] .tp-tools{padding:0 0 10px}
html[data-design=m2] .tp-tools .search{height:38px;border-radius:var(--r-sm);background:var(--panel);border-color:var(--line-2)}
html[data-design=m2] .tp-tools .search input{background:transparent!important;border:0!important;box-shadow:none!important}
html[data-design=m2] .tp-tools .ib{width:38px;height:38px;border-radius:var(--r-sm);border:1px solid var(--line-2);background:var(--panel)}
html[data-design=m2] .tp-groups{padding:0 0 14px}
html[data-design=m2] .tp-groups button{border-radius:4px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;height:28px}
html[data-design=m2] .tp-groups button.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
html[data-design=m2] .tp-list{border:0;overflow:visible;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px;align-content:start}
html[data-design=m2] .tp-list .wl{display:grid;grid-template-columns:44px minmax(0,1fr);grid-template-rows:auto auto;gap:4px 12px;padding:14px 16px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}
html[data-design=m2] .tp-list .wl:hover{background:var(--card);border-color:var(--line-2)}
html[data-design=m2] .tp-list .wl .em{width:44px;height:44px;border-radius:var(--r);background:transparent;border:1px solid var(--line-2);color:var(--accent);font-size:20px;grid-row:1}
html[data-design=m2] .tp-list .wl .nm{font-size:15px} html[data-design=m2] .tp-list .wl .nm b{font-size:15px}
html[data-design=m2] .tp-list .wl .gp{border-radius:4px;font-family:var(--mono)}
html[data-design=m2] .tp-list .wl .ad{font-family:var(--mono);font-size:12px}
html[data-design=m2] .tp-list .wl .acts{grid-column:1 / -1;justify-content:flex-start;gap:6px;padding-top:10px;margin-top:8px;border-top:1px solid var(--hairline)}
html[data-design=m2] .tp-list .wl .acts .ib{width:32px;height:32px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--bg);color:var(--sub)}
html[data-design=m2] .tp-list .wl .acts .ib.on{color:var(--accent);border-color:var(--accent-line);background:var(--accent-bg)}
html[data-design=m2] .tp-list .wl .acts .ib.danger{margin-left:auto}
html[data-design=m2] .tp-list > .empty,html[data-design=m2] .tp-list > .ax{grid-column:1 / -1}
html[data-design=m2] .ax{border-radius:var(--r);border-color:var(--line);margin:0;font-size:12px} html[data-design=m2] .ax .ok{color:var(--accent)}
html[data-design=m2] .tk-zero{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;gap:18px;padding:46px 24px 40px;border:1px dashed var(--line-2);border-radius:var(--r);background:var(--panel);text-align:center}
html[data-design=m2] .tk-zero .big{width:72px;height:72px;border-radius:var(--r);border:1px solid var(--line-2);color:var(--accent);display:grid;place-items:center}
html[data-design=m2] .tk-zero .big svg{width:30px;height:30px}
html[data-design=m2] .tk-zero h3{font-family:var(--serif);font-style:italic;font-weight:400;font-size:34px;text-transform:lowercase}
html[data-design=m2] .tk-zero p{color:var(--sub);font-size:14px;max-width:460px;line-height:1.55;margin:-8px 0 0}
html[data-design=m2] .tk-zero .ways{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
html[data-design=m2] .tk-zero .three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%;max-width:720px;margin-top:6px}
html[data-design=m2] .tk-zero .three > div{padding:16px 14px;border-radius:var(--r-sm);background:var(--bg);border:1px solid var(--line);text-align:left;display:flex;flex-direction:column;gap:8px}
html[data-design=m2] .tk-zero .three svg{width:20px;height:20px;color:var(--accent)}
html[data-design=m2] .tk-zero .three b{font-size:13.5px;font-weight:600}
html[data-design=m2] .tk-zero .three span{font-size:12px;color:var(--sub);line-height:1.5}
html[data-design=m2] .tk-zero small{color:var(--dim);font-size:12px} html[data-design=m2] .tk-zero small a{color:var(--sub);text-decoration:underline;cursor:pointer}
html[data-design=m2] .tp-r{border:1px solid var(--line);border-radius:var(--r);background:var(--panel);overflow:hidden;align-self:start;max-height:calc(100vh - 100px);position:sticky;top:78px}
html[data-design=m2] .tp-fh{padding:14px 16px 10px;gap:8px;border-bottom:1px solid var(--line)}
html[data-design=m2] .tp-fh h2{font-family:var(--serif);font-style:italic;font-weight:400;font-size:22px;text-transform:lowercase}
html[data-design=m2] .tp-fh .live,html[data-design=m2] footer.foot .live{border-radius:4px;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em} html[data-design=m2] .tp-fh .live.on,html[data-design=m2] footer.foot .live.on{color:var(--accent)} html[data-design=m2] .tp-fh .live.on i,html[data-design=m2] footer.foot .live.on i{background:var(--accent);box-shadow:0 0 0 3px var(--accent-bg)}
html[data-design=m2] .segx{padding:0} html[data-design=m2] .segx button{height:28px}
html[data-design=m2] .tp-feed{overflow:auto}
html[data-design=m2] .fd{grid-template-columns:44px minmax(0,1fr) auto;grid-template-areas:"tm who n" "tm tok n";row-gap:2px;padding:10px 16px;align-items:center;font-family:var(--mono);font-size:12.5px;border-color:var(--hairline)}
html[data-design=m2] .fd.head{display:none}
html[data-design=m2] .fd .tm{grid-area:tm;font-size:11px} html[data-design=m2] .fd .who{grid-area:who;font-family:var(--font)} html[data-design=m2] .fd .tok{grid-area:tok;font-size:12px;color:var(--sub)} html[data-design=m2] .fd .n{grid-area:n}
html[data-design=m2] .fd .side{display:inline-flex;height:20px;align-items:center;border-radius:4px;padding:0 7px;font-size:10.5px;justify-self:start}
html[data-design=m2] .fd .mc,html[data-design=m2] .fd .tx{display:none}
html[data-design=m2] .fd .who i{border-radius:7px;background:transparent;border:1px solid var(--line-2)} html[data-design=m2] .fd .who i svg,html[data-design=m2] .wl .em svg{color:var(--accent)}
html[data-design=m2] .fd.new{animation:none;box-shadow:inset 3px 0 0 var(--accent)}
html[data-design=m2] .tp-r .empty{padding:40px 20px}
@media (max-width:1100px){html[data-design=m2] .tp:has(> .tp-l){grid-template-columns:1fr;padding:12px}html[data-design=m2] .tp-r{position:static;max-height:none}html[data-design=m2] .tk-zero .three{grid-template-columns:1fr}}

/* ── sheets, dialogs, toasts, the X card ── */
html[data-design=m2] .modal{background:color-mix(in srgb,var(--bg) 70%,transparent)!important;backdrop-filter:blur(8px)}
html[data-design=m2] .modal .fm{border-radius:var(--r)!important;border:1px solid var(--line-2)!important;background:var(--panel)!important}
html[data-design=m2] .modal .fm::before{display:none}
html[data-design=m2] .modal .fm-h h3{font-family:var(--serif);font-style:italic;font-weight:400;font-size:26px;text-transform:lowercase}
html[data-design=m2] .modal .notice{color:var(--sub-2)!important;background:transparent;border:0!important;border-left:3px solid var(--accent)!important;border-radius:0!important;padding:4px 0 4px 14px!important;font-size:13px!important;line-height:1.55!important}
html[data-design=m2] .modal .notice b{color:var(--text)} html[data-design=m2] .modal .notice.ok{border-left-color:var(--green)!important} html[data-design=m2] .modal .notice.warn{border-left-color:var(--yellow)!important}
html[data-design=m2] .modal .notice a{color:var(--accent)!important}
html[data-design=m2] .modal .btn{border-radius:var(--r-sm)} html[data-design=m2] .modal .btn.primary{background:var(--accent)!important;color:var(--on-accent)!important;border-color:transparent!important}
html[data-design=m2] .modal table{border-collapse:collapse} html[data-design=m2] .modal td{height:48px;background:transparent;border-bottom:1px solid var(--hairline);border-radius:0!important}
html[data-design=m2] .modal input[type=checkbox],html[data-design=m2] .modal input[type=radio]{accent-color:var(--accent)}
html[data-design=m2] .modal .tag{border-radius:4px;font-family:var(--mono)} html[data-design=m2] .modal .tag.main{background:var(--accent)!important;color:var(--on-accent)!important}
html[data-design=m2] .modal .ib{border-radius:var(--r-sm)}
html[data-design=m2] .w-hero-ic{border-radius:14px;background:transparent;border:1px solid var(--line-2);color:var(--accent)}
html[data-design=m2] .w-hero h4{font-family:var(--serif);font-style:italic;font-weight:400!important;font-size:30px!important;text-transform:lowercase}
html[data-design=m2] .w-hero li svg{color:var(--accent)}
html[data-design=m2] .dlg{border-radius:var(--r)!important;border:1px solid var(--line-2)!important;background:var(--panel)!important}
html[data-design=m2] .dlg-h h3{font-family:var(--serif);font-style:italic;font-weight:400;font-size:24px;text-transform:lowercase}
html[data-design=m2] .dlg-btn,html[data-design=m2] .dlg .btn{border-radius:var(--r-sm)}
html[data-design=m2] .dlg-btn.primary,html[data-design=m2] .dlg .btn.primary{background:var(--accent)!important;color:var(--on-accent)!important;border-color:var(--accent)!important}
html[data-design=m2] .dlg-f-row input,html[data-design=m2] .dlg input{border-radius:var(--r-sm);height:40px;font-family:var(--mono)}
html[data-design=m2] input:focus-visible,html[data-design=m2] select:focus-visible,html[data-design=m2] textarea:focus-visible,html[data-design=m2] button:focus-visible{outline:2px solid var(--accent-line)!important}
html[data-design=m2] input[type=checkbox]:checked{background-color:var(--accent)!important;border-color:var(--accent)!important}
html[data-design=m2] input[type=radio]:checked{border-color:var(--accent)!important;background-image:radial-gradient(circle,var(--accent) 0 3.5px,transparent 4.2px)!important}
html[data-design=m2] input[type=range]::-webkit-slider-thumb{background:var(--accent)}
html[data-design=m2] .ntf-stack{top:auto!important;bottom:20px!important;right:auto!important;left:20px!important;transform:none;align-items:flex-start}
html[data-design=m2] .ntf{border-radius:var(--r-sm)!important;border:1px solid var(--line-2)!important;border-left:3px solid var(--accent)!important;background:var(--panel)!important;padding:10px 14px!important;box-shadow:var(--shadow);min-width:300px}
html[data-design=m2] .ntf.ok{border-left-color:var(--green)!important} html[data-design=m2] .ntf.err{border-left-color:var(--red)!important} html[data-design=m2] .ntf.warn{border-left-color:var(--yellow)!important}
html[data-design=m2] .ntf .ntf-dot{display:none} html[data-design=m2] .ntf img{border-radius:6px} html[data-design=m2] .ntf b{font-weight:600}
html[data-design=m2] .xcard{background:var(--panel)!important;border:1px solid var(--line-2)!important;border-top:3px solid var(--accent)!important;border-radius:var(--r)!important;box-shadow:var(--shadow)!important;width:360px;font-family:var(--font)}
html[data-design=m2] .xcard .xc-top{padding:14px 16px 8px;background:transparent}
html[data-design=m2] .xcard .xc-ban{display:none!important}
html[data-design=m2] .xcard .xc-top.has-ban{padding:14px 16px 8px} html[data-design=m2] .xcard .xc-top.has-ban .xc-h{margin:0;align-items:flex-start} html[data-design=m2] .xcard .xc-top.has-ban .xc-h img,html[data-design=m2] .xcard .xc-top.has-ban .xc-av{margin:0}
html[data-design=m2] .xcard .xc-h img,html[data-design=m2] .xcard .xc-av{width:64px!important;height:64px!important;border-radius:10px!important;box-shadow:none!important;border:1px solid var(--line)}
html[data-design=m2] .xcard .xc-n{font-size:17px;font-weight:600} html[data-design=m2] .xcard .xc-s{font-family:var(--mono);font-size:12px;color:var(--sub)!important}
html[data-design=m2] .xcard .xc-v{color:var(--accent)} html[data-design=m2] .xcard .xc-age{color:var(--sub)!important;font-family:var(--mono)}
html[data-design=m2] .xcard .xc-t{font-size:14px;color:var(--sub-2)} html[data-design=m2] .xcard .xc-t a,html[data-design=m2] .xcard .xc-w{color:var(--accent)!important}
html[data-design=m2] .xcard .xc-f,html[data-design=m2] .xcard .xc-meta{font-family:var(--mono);font-size:11.5px!important;color:var(--sub)!important;gap:6px 14px!important}
html[data-design=m2] .xcard .xc-f b,html[data-design=m2] .xcard .xc-meta b{color:var(--text)!important}
html[data-design=m2] .xcard .xc-q{border-radius:var(--r-sm);background:var(--card)!important;border-color:var(--line)!important} html[data-design=m2] .xcard .xc-m{border-radius:var(--r-sm)}
html[data-design=m2] .xcard .xc-btn{margin:8px 16px 16px!important;height:40px!important;border-radius:var(--r-sm)!important;background:transparent!important;color:var(--text)!important;border:1px solid var(--line-2)!important;font-size:12px!important;text-transform:uppercase;letter-spacing:.08em}
html[data-design=m2] .xcard .xc-btn:hover{border-color:var(--accent)!important;color:var(--accent)!important}

/* ── the spotlight: one wide bar high on the screen, frosted, results beneath ── */
html[data-design=m2] #gs{align-items:flex-start;padding:12vh 16px 16px}
html[data-design=m2] #gs .gs-bg{background:color-mix(in srgb,var(--bg) 55%,transparent);backdrop-filter:blur(14px) saturate(1.1)}
html[data-design=m2] #gs .gs-box{width:min(780px,100%);max-height:72vh;border-radius:calc(var(--r) + 10px);background:color-mix(in srgb,var(--panel) 90%,transparent);border:1px solid var(--line-2);box-shadow:0 50px 140px -30px rgba(0,0,0,.95),inset 0 1px 0 rgba(255,255,255,.05);backdrop-filter:blur(30px) saturate(1.3);animation:gs-in .18s cubic-bezier(.2,.8,.2,1)}
html[data-design=m2] #gs .gs-in{order:-1;margin:0;height:68px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;padding:0 22px;gap:14px}
html[data-design=m2] #gs .gs-in:focus-within{border-color:var(--line);box-shadow:none}
html[data-design=m2] #gs .gs-in svg{width:22px;height:22px;color:var(--sub)}
html[data-design=m2] #gs .gs-in input{font-size:22px;font-weight:500;letter-spacing:-.02em}
html[data-design=m2] #gs .gs-in input::placeholder{color:var(--dim)}
html[data-design=m2] #gs .gs-in kbd{border-radius:6px;border-color:var(--line-2);color:var(--dim);font-family:var(--mono);padding:3px 7px}
html[data-design=m2] #gs .gs-top{padding:10px 14px 0;min-height:0;gap:8px}
html[data-design=m2] #gs .gs-chains{border-right:1px solid var(--line);padding-right:8px;gap:2px}
html[data-design=m2] #gs .gs-ch{height:28px;padding:0 9px 0 5px;border-radius:var(--r-sm);font-size:12px;border:1px solid transparent}
html[data-design=m2] #gs .gs-ch img{width:16px;height:16px}
html[data-design=m2] #gs .gs-ch.on{background:var(--accent-bg);border-color:var(--accent-line);color:var(--text)}
html[data-design=m2] #gs .gs-go{color:var(--accent);font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-family:var(--mono)}
html[data-design=m2] #gs .gs-v{height:26px;padding:0 9px;border-radius:4px;border-color:var(--line);font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--sub)}
html[data-design=m2] #gs .gs-v.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
html[data-design=m2] #gs .gs-ic{width:28px;height:28px;border-radius:var(--r-sm)}
html[data-design=m2] #gs .gs-body{padding:4px 8px 6px}
html[data-design=m2] #gs .gs-h{padding:12px 12px 6px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-weight:600}
html[data-design=m2] #gs .gs-h svg{display:none} html[data-design=m2] #gs .gs-dim{text-transform:none;letter-spacing:0;font-weight:500;font-family:var(--mono);font-size:11px}
html[data-design=m2] #gs .gs-clear{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
html[data-design=m2] #gs .gs-row{grid-template-columns:44px minmax(0,1fr) 108px 108px 96px auto;gap:12px;min-height:60px;padding:8px 12px;border-radius:var(--r-sm)}
html[data-design=m2] #gs .gs-row:hover,html[data-design=m2] #gs .gs-row.cur{background:var(--hover)} html[data-design=m2] #gs .gs-row.cur{box-shadow:inset 0 0 0 1px var(--accent-line)}
html[data-design=m2] #gs .gs-av,html[data-design=m2] #gs .gs-av > img{width:44px;height:44px;border-radius:10px} html[data-design=m2] #gs .gs-av.ic{border-radius:10px}
html[data-design=m2] #gs .gs-cl{width:16px!important;height:16px!important;border-color:var(--panel)}
html[data-design=m2] #gs .gs-l1{font-size:14.5px} html[data-design=m2] #gs .gs-l1 .n{font-size:12.5px}
html[data-design=m2] #gs .gs-l1 em{border-radius:4px;font-family:var(--mono);background:transparent;border:1px solid var(--line-2);color:var(--sub-2);height:17px;font-size:10px}
html[data-design=m2] #gs .gs-l1 em.gr{color:var(--accent);border-color:var(--accent-line)}
html[data-design=m2] #gs .gs-l2{display:none}
html[data-design=m2] #gs .gs-l3{font-family:var(--mono);font-size:11.5px} html[data-design=m2] #gs .gs-l3 b{color:var(--accent)}
html[data-design=m2] #gs .gs-st{font-size:11px;gap:2px} html[data-design=m2] #gs .gs-st b{font-size:13px}
html[data-design=m2] #gs .gs-buy{height:30px;padding:0 12px;border-radius:var(--r-sm);background:var(--accent);color:var(--on-accent);border-color:var(--accent);font-size:12px}
html[data-design=m2] #gs .gs-row.act,html[data-design=m2] #gs .gs-row.lite{grid-template-columns:44px minmax(0,1fr) auto auto}
html[data-design=m2] #gs .gs-empty{font-family:var(--mono);font-size:12px}
html[data-design=m2] #gs .gs-keys{display:flex;align-items:center;gap:16px;padding:10px 20px;border-top:1px solid var(--line);font-family:var(--mono);font-size:11px;color:var(--dim)}
html[data-design=m2] #gs .gs-keys kbd{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;margin-right:4px;border:1px solid var(--line-2);border-radius:5px;color:var(--sub);font:inherit}
html[data-design=m2] #gs .gs-keys .gs-keys-r{margin-left:auto;font-family:var(--serif);font-style:italic;font-size:15px;color:var(--sub)}
@media (max-width:860px){html[data-design=m2] #gs{padding:0}html[data-design=m2] #gs .gs-box{border-radius:0;max-height:100vh}html[data-design=m2] #gs .gs-in{height:56px}html[data-design=m2] #gs .gs-in input{font-size:17px}html[data-design=m2] #gs .gs-keys{display:none}}

/* ── Appearance sheet ── */
html[data-design=m2] #m2-look{position:fixed;inset:0;z-index:1300;display:flex;align-items:center;justify-content:center;padding:16px}
html[data-design=m2] #m2-look .m2-look-bg{position:absolute;inset:0;background:color-mix(in srgb,var(--bg) 60%,transparent);backdrop-filter:blur(12px)}
html[data-design=m2] .m2-look-s{position:relative;width:min(520px,100%);background:var(--panel);border:1px solid var(--line-2);border-radius:calc(var(--r) + 6px);box-shadow:var(--shadow);padding:22px 24px 18px;display:flex;flex-direction:column;gap:14px;animation:gs-in .18s cubic-bezier(.2,.8,.2,1)}
html[data-design=m2] .m2-look-s header{position:relative;padding-right:40px}
html[data-design=m2] .m2-look-s h3{font-family:var(--serif);font-style:italic;font-weight:400;font-size:30px;line-height:1}
html[data-design=m2] .m2-look-s header p{color:var(--sub);font-size:13px;margin-top:6px}
html[data-design=m2] .m2-x{position:absolute;right:0;top:0;width:32px;height:32px;border:1px solid var(--line);border-radius:var(--r-sm);background:transparent;color:var(--sub);cursor:pointer}
html[data-design=m2] .m2-row{display:grid;grid-template-columns:110px 1fr;align-items:center;gap:12px}
html[data-design=m2] .m2-row label{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-weight:600}
html[data-design=m2] .m2-dots{display:flex;gap:10px}
html[data-design=m2] .m2-dot{width:30px;height:30px;border-radius:50%;background:var(--c);border:2px solid transparent;cursor:pointer;box-shadow:0 0 0 1px var(--line-2);transition:transform .12s}
html[data-design=m2] .m2-dot:hover{transform:scale(1.08)} html[data-design=m2] .m2-dot.on{border-color:var(--bg);box-shadow:0 0 0 2px var(--c)}
html[data-design=m2] .m2-seg{display:flex;gap:6px;flex-wrap:wrap}
html[data-design=m2] .m2-sw{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:var(--r-sm);border:1px solid var(--line-2);background:transparent;color:var(--sub-2);font:500 12.5px/1 var(--font);cursor:pointer}
html[data-design=m2] .m2-sw svg{width:12px;height:12px;display:none} html[data-design=m2] .m2-sw.on{border-color:var(--accent-line);background:var(--accent-bg);color:var(--text)} html[data-design=m2] .m2-sw.on svg{display:block;color:var(--accent)}
html[data-design=m2] .m2-prev{border:1px solid var(--line);border-radius:var(--r);background:var(--bg);padding:12px 14px}
html[data-design=m2] .m2-prev-row{display:flex;align-items:center;gap:12px;font-size:14px}
html[data-design=m2] .m2-prev-row i{width:40px;height:40px;border-radius:10px;background:var(--card);border:1px solid var(--line-2);border-left:3px solid var(--accent)}
html[data-design=m2] .m2-prev-row b{font-weight:600} html[data-design=m2] .m2-prev-row span{color:var(--sub);font-size:12.5px} html[data-design=m2] .m2-prev-row em{margin-left:auto;font-style:normal;font-family:var(--mono);color:var(--green);font-weight:600}
html[data-design=m2] .m2-prev-buy{height:34px;padding:0 14px;border-radius:var(--r-sm);border:0;background:var(--accent);color:var(--on-accent);font:700 12.5px/1 var(--font);cursor:default}
html[data-design=m2] .m2-look-s footer{display:flex;justify-content:flex-end;gap:8px;padding-top:4px}
html[data-design=m2] .m2-reset,html[data-design=m2] .m2-done{height:36px;padding:0 16px;border-radius:var(--r-sm);border:1px solid var(--line-2);background:transparent;color:var(--text);font:600 13px/1 var(--font);cursor:pointer}
html[data-design=m2] .m2-done{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}

/* ── footer ── */
html[data-design=m2] footer.foot{height:36px;background:transparent;border-top:1px solid var(--line);font-family:var(--mono);font-size:11.5px;padding:0 20px}
html[data-design=m2] footer.foot .giga{color:var(--text);font-family:var(--serif);font-style:italic;font-weight:400;font-size:16px;border-right:0}
html[data-design=m2] footer.foot .lk.active,html[data-design=m2] footer.foot .lk.on{color:var(--accent)!important}
html[data-design=m2] footer.foot .gas{color:var(--sub)}
@media (min-width:901px){html[data-design=m2] footer.foot .lk,html[data-design=m2] footer.foot > a,html[data-design=m2] footer.foot .fsep,html[data-design=m2] #ft-fps,html[data-design=m2] #ft-stab{display:none!important}}
@media (max-width:900px){html[data-design=m2] footer.foot .r,html[data-design=m2] footer.foot .giga,html[data-design=m2] #ft-filter,html[data-design=m2] footer.foot > a{display:none!important}html[data-design=m2] footer.foot{height:56px}html[data-design=m2] .ntf-stack{left:8px!important;right:8px!important}}

/* ── greens that are UI, not money ── */
html[data-design=m2] .menu a.on,html[data-design=m2] .dd-menu button.on,html[data-design=m2] .pill.ext.on,html[data-design=m2] .ico.ok,html[data-design=m2] .amt svg,html[data-design=m2] .lamt svg,html[data-design=m2] .wname .prim,html[data-design=m2] .act.g,html[data-design=m2] .toast.ok,html[data-design=m2] .notice.ok,html[data-design=m2] .sec-h svg{color:var(--accent)}
html[data-design=m2] .sizes button.on{border-color:var(--accent-line);background:var(--accent-bg);color:var(--accent)}
html[data-design=m2] .pv-btn{background:var(--accent);color:var(--on-accent)}
html[data-design=m2] .mtabs button.on{color:var(--text)!important;border-bottom-color:var(--accent)!important}
html[data-design=m2] .lane-tabs button.on,html[data-design=m2] .tabs-l button.on{color:var(--accent)}
html[data-design=m2] .pill2.hold{color:var(--accent);border-color:var(--accent-line)}
html[data-design=m2] .qb,html[data-design=m2] [data-qb]{background:var(--accent);color:var(--on-accent);border-radius:var(--r-sm)}
html[data-design=m2] .search input,html[data-design=m2] .inp input,html[data-design=m2] .gs-in input{background:transparent!important;border:0!important;box-shadow:none!important}
html[data-design=m2] .nav .r #mt-lang .flag svg,html[data-design=m2] #mt-lang-menu .flag svg{box-shadow:0 0 0 1px rgba(255,255,255,.12)}
html[data-design=m2] #mt-lang-menu button .flag{width:auto}
html[data-design=m2] .wl:has(> .wl-t){display:flex;align-items:center;gap:12px} html[data-design=m2] .wl .wl-t{flex:none;position:static}

/* ═══ clean pass (fomo-style controls): every control is a quiet card, lime only on primary actions ═══ */
html[data-design=m2]{--r:12px;--r-sm:10px;--ctl:40px}
html[data-design=m2][data-corners=square]{--r:6px;--r-sm:4px} html[data-design=m2][data-corners=round]{--r:18px;--r-sm:14px}
/* logo: the mark + the italic wordmark */
html[data-design=m2] .nav .logo{display:inline-flex;align-items:center;gap:10px}
html[data-design=m2] .nav .logo .mark{display:block;width:30px;height:30px;border-radius:8px;object-fit:cover;background:#000;border:1px solid var(--line-2)}
/* the menu: active = raised card, no fill */
html[data-design=m2] .nav .menu a{height:var(--ctl);padding:0 14px;border-radius:var(--r);border:1px solid transparent;font-weight:500}
html[data-design=m2] .nav .menu a.on{color:var(--text);background:var(--card);border-color:var(--line-2)}
html[data-design=m2] .nav .menu a.on svg{color:var(--accent)}
html[data-design=m2] .nav .menu .m2-more-b{height:var(--ctl);width:var(--ctl);border-radius:var(--r)}
/* the cluster: no capsule, 8px apart, each control a card */
html[data-design=m2] .nav .r{gap:8px;padding:0;background:transparent;border:0;border-radius:0}
html[data-design=m2] .nav .r > *{height:var(--ctl)!important;border-radius:var(--r)!important;border:1px solid var(--line)!important;background:var(--card)!important;color:var(--text);font-size:13px;font-weight:600;transition:background .12s,border-color .12s}
html[data-design=m2] .nav .r > *:hover,html[data-design=m2] .nav .r .ibtn:hover,html[data-design=m2] .nav .r .pill:hover,html[data-design=m2] .nav .r #mt-lang:hover{background:var(--card-hover)!important;border-color:var(--line-2)!important;color:var(--text)}
html[data-design=m2] .nav .r .ibtn{width:var(--ctl);color:var(--sub-2)}
html[data-design=m2] .nav .r .ibtn svg{width:18px;height:18px}
html[data-design=m2] .nav .r #mt-lang{padding:0 12px;font-size:12.5px}
html[data-design=m2] .nav .r .dd .pill{height:calc(var(--ctl) - 2px);border:0;background:transparent;padding:0 12px;font-weight:600}
html[data-design=m2] .nav .r .pill{padding:0 14px}
html[data-design=m2] .nav .r #open-wallets{background:var(--card)!important;border:1px solid var(--line)!important;padding:0 14px 0 10px}
html[data-design=m2] .nav .r #open-wallets .eth{width:20px;height:20px;border-radius:50%}
html[data-design=m2] .nav .r .ab:not(.login){background:var(--card)!important;border:1px solid var(--line)!important}
html[data-design=m2] .nav .r .ab.login,html[data-design=m2] .nav .r .ab.login.wait{background:var(--accent)!important;color:var(--on-accent)!important;border-color:var(--accent)!important;padding:0 18px;font-weight:700;letter-spacing:0}
html[data-design=m2] .nav .r .ab.login:hover{background:var(--accent-2)!important;border-color:var(--accent-2)!important}
html[data-design=m2] .nav .r > *:focus-visible{outline:2px solid var(--accent-line)!important;outline-offset:2px}
/* the board bar: soft chips, lime as a tint, never a slab */
html[data-design=m2] .tbar{padding:12px 20px}
html[data-design=m2] .tbar .amt,html[data-design=m2] .lane-h .lamt{height:36px;border-radius:999px;background:var(--card);border:1px solid var(--line);padding:0 12px 0 10px}
html[data-design=m2] .tbar .seg,html[data-design=m2] .lane-h .presets,html[data-design=m2] .tfs,html[data-design=m2] .tp#tpresets,html[data-design=m2] .segx{border-radius:999px;background:var(--card);border:1px solid var(--line);padding:3px;gap:2px}
html[data-design=m2] .tbar .seg button,html[data-design=m2] .lane-h .presets button,html[data-design=m2] .tfs button,html[data-design=m2] .tp#tpresets button,html[data-design=m2] .segx button{height:28px;padding:0 11px;border-radius:999px;border:0;color:var(--sub);font-weight:600;font-size:12px}
html[data-design=m2] .tbar .seg button.on,html[data-design=m2] .lane-h .presets button.on,html[data-design=m2] .tfs button.on,html[data-design=m2] .tp#tpresets button.on,html[data-design=m2] .segx button.on{background:var(--raised)!important;color:var(--text)!important;box-shadow:inset 0 0 0 1px var(--line-2)}
html[data-design=m2] .lane-h .presets button.on{color:var(--accent)!important}
html[data-design=m2] .tbar #state{height:32px;padding:0 12px 0 10px;border-radius:999px;background:var(--card);border:1px solid var(--line);color:var(--sub-2);font-size:11px}
html[data-design=m2] .tbar #state .dot{width:7px;height:7px;background:var(--accent)!important;box-shadow:0 0 0 3px var(--accent-bg)!important}
html[data-design=m2] .tbar #wcount{height:32px!important;border-radius:999px;background:var(--card);border:1px solid var(--line);padding:0 12px}
html[data-design=m2] .tbar .ibtn,html[data-design=m2] .lane-h .ib,html[data-design=m2] .tbar .act{border-radius:999px}
html[data-design=m2] .lane-h .ib{width:30px;height:30px;border:1px solid var(--line);background:var(--card);color:var(--sub-2)}
html[data-design=m2] .lane-h .ib.on{color:var(--accent);border-color:var(--accent-line);background:var(--accent-bg)}
html[data-design=m2] .lane-h .cnt,html[data-design=m2] .lane-h .n{color:var(--accent);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:0 8px;height:20px;line-height:18px}
html[data-design=m2] .lane-h .mcm,html[data-design=m2] .lane-h .mc-toggle{border-radius:999px}
/* tickets: the buy is a pill with the amount, not a lime square */
html[data-design=m2] .lane .row .buyw .buy{width:auto!important;min-width:0!important;height:38px!important;padding:0 16px 0 12px!important;border-radius:999px!important;display:inline-flex;align-items:center;gap:7px;font:700 12.5px/1 var(--font);letter-spacing:0;box-shadow:0 10px 24px -14px var(--glow)}
html[data-design=m2] .lane .row .buyw .buy .txt{display:inline;font-family:var(--mono)} html[data-design=m2] .lane .row .buyw .buy svg{width:14px;height:14px}
html[data-design=m2] .lane .row .buyw .buy.alt{box-shadow:none;border:1px solid var(--line-2)}
html[data-design=m2] .lane .row .buyw .sellq{border-radius:999px}
html[data-design=m2] .lane .row .l2 .pill2,html[data-design=m2] .lane .row .pill2,html[data-design=m2] .lane .row .ca,html[data-design=m2] .lane .row .xh,html[data-design=m2] .lane .row .l3 a.xh,html[data-design=m2] .lane .row .risk .rp,html[data-design=m2] .lane .row .tb i{border-radius:999px}
html[data-design=m2] .lane .row .pill2,html[data-design=m2] .lane .row .l2 .pill2{background:var(--card)!important;border-color:var(--line)!important;padding:0 8px}
html[data-design=m2] .lane .row .xh,html[data-design=m2] .lane .row .l3 a.xh,html[data-design=m2] .lane .row .l3 .xf{background:var(--card)!important;border-color:var(--line)!important;padding:0 8px}
html[data-design=m2] .lane .row .risk .rp{background:var(--card);border-color:var(--line)}
html[data-design=m2] .lane .row::before{display:none}
html[data-design=m2] .lane .row,html[data-design=m2] .lane .tok{--rowpad:14px 12px 12px 12px}
html[data-design=m2][data-density=compact] .lane .row,html[data-design=m2][data-density=compact] .lane .tok{--rowpad:9px 10px 8px 10px}
html[data-design=m2] .lane .row:hover{background:var(--card)!important}
html[data-design=m2] .lane .row .lft .av,html[data-design=m2] .row .av.tile{border-radius:14px!important}
html[data-design=m2] .tile .pic,html[data-design=m2] .tile .ini{border-radius:12px}
html[data-design=m2] .tile .lpb{border-radius:999px!important}
/* token page: pills on the ticket, round go */
html[data-design=m2] .th .pill,html[data-design=m2] .th .lp,html[data-design=m2] .th .chip,html[data-design=m2] .th .pill2{border-radius:999px;background:var(--card);border-color:var(--line)}
html[data-design=m2] .th .tile,html[data-design=m2] .th .av{border-radius:16px!important}
html[data-design=m2] .cbar button,html[data-design=m2] .cbar .dd > button{border-radius:999px;height:30px}
html[data-design=m2] .cbar button.on,html[data-design=m2] .cbar .tog.on{background:var(--raised);color:var(--text);box-shadow:inset 0 0 0 1px var(--line-2)}
html[data-design=m2] .cfoot button{border-radius:999px}
html[data-design=m2] .right .trade,html[data-design=m2] .right .chg,html[data-design=m2] .right .audit{border-radius:16px;background:var(--panel);border-color:var(--line)}
html[data-design=m2] .right .trade .ctl .wsel,html[data-design=m2] .right .trade .ctl .ic{border-radius:999px;height:34px;background:var(--card);border-color:var(--line)}
html[data-design=m2] .right .trade .seg{margin:12px 14px 0;padding:3px;border:1px solid var(--line);border-radius:999px;background:var(--card);gap:2px}
html[data-design=m2] .right .trade .seg button{height:36px;border-radius:999px;border:0;font-size:13.5px}
html[data-design=m2] .right .trade .seg button.buy.on{background:var(--green)!important;color:#06110b;border:0}
html[data-design=m2] .right .trade .seg button.sell.on{background:var(--red)!important;color:#fff;border:0}
html[data-design=m2] .right .trade .seg button.auto.on{background:var(--accent)!important;color:var(--on-accent);border:0}
html[data-design=m2] .right .trade .inp{border-radius:14px;background:var(--card);border-color:var(--line)}
html[data-design=m2] .right .trade .presets button{height:40px;border-radius:999px;background:var(--card);border:1px solid var(--line)}
html[data-design=m2] .right .trade .presets button.on{border-color:var(--accent-line);color:var(--accent);background:var(--accent-bg)}
html[data-design=m2] .right .trade .go{height:56px!important;border-radius:999px!important;font-size:15px!important;letter-spacing:0;text-transform:none;box-shadow:0 14px 30px -14px var(--glow)}
html[data-design=m2] .right .trade .speed .seg2{border-radius:999px;background:var(--card);border-color:var(--line)} html[data-design=m2] .right .trade .speed .seg2 button{border-radius:999px}
html[data-design=m2] .tabsp .tabs .n,html[data-design=m2] .tabsp .tabs .cnt{border-radius:999px;background:var(--card);border-color:var(--line);padding:0 7px}
/* portfolio / tracker / sheets: the same pills */
html[data-design=m2] .wal-h .r .act,html[data-design=m2] .stats-h .r .act,html[data-design=m2] .btn,html[data-design=m2] .btn2,html[data-design=m2] .dlg-btn,html[data-design=m2] .modal .btn,html[data-design=m2] .m2-reset,html[data-design=m2] .m2-done,html[data-design=m2] .m2-sw,html[data-design=m2] .xcard .xc-btn,html[data-design=m2] #gs .gs-buy,html[data-design=m2] .tk-zero .ways .btn,html[data-design=m2] .m2-prev-buy{border-radius:999px!important}
html[data-design=m2] .wal-h .r .act,html[data-design=m2] .btn,html[data-design=m2] .btn2{background:var(--card);border-color:var(--line)}
html[data-design=m2] .wal-h .r .act.g,html[data-design=m2] .btn.primary,html[data-design=m2] .btn2.primary{background:var(--accent)!important;border-color:var(--accent)!important;color:var(--on-accent)!important;box-shadow:0 10px 24px -14px var(--glow)}
html[data-design=m2] .tabs label,html[data-design=m2] .tp-groups button,html[data-design=m2] .sellp,html[data-design=m2] .tabs .search,html[data-design=m2] .tp-tools .search,html[data-design=m2] .tp-tools .ib,html[data-design=m2] .live,html[data-design=m2] .wl .acts .ib,html[data-design=m2] .action .ico,html[data-design=m2] .fd .side,html[data-design=m2] .wl .gp,html[data-design=m2] .tp-h .cnt,html[data-design=m2] #gs .gs-ch,html[data-design=m2] #gs .gs-v,html[data-design=m2] #gs .gs-ic,html[data-design=m2] .modal .tag,html[data-design=m2] #gs .gs-l1 em,html[data-design=m2] .m2-x,html[data-design=m2] .cal-wrap .cal-nav button,html[data-design=m2] .cal-wrap .cal-x{border-radius:999px}
html[data-design=m2] .tp-groups button.on{background:var(--raised);border-color:var(--line-2);color:var(--text)}
html[data-design=m2] #gs .gs-v.on{background:var(--raised);border-color:var(--line-2);color:var(--text)}
html[data-design=m2] #gs .gs-box{border-radius:22px}
html[data-design=m2] .wl,html[data-design=m2] .tk-zero,html[data-design=m2] .tk-zero .three > div,html[data-design=m2] .tp-r,html[data-design=m2] .m2-look-s,html[data-design=m2] .m2-prev,html[data-design=m2] .cal-wrap .cal,html[data-design=m2] .modal .fm,html[data-design=m2] .dlg,html[data-design=m2] .xcard{border-radius:18px!important}
html[data-design=m2] .tp-list .wl .em,html[data-design=m2] .tk-zero .big,html[data-design=m2] .empty2 .ic,html[data-design=m2] .w-hero-ic{border-radius:14px}
html[data-design=m2] .ntf{border-radius:14px!important;border-left-width:1px!important;padding-left:16px!important}
html[data-design=m2] .ntf.ok,html[data-design=m2] .ntf.err,html[data-design=m2] .ntf.warn,html[data-design=m2] .ntf{border-left-color:var(--line-2)!important}
html[data-design=m2] .ntf .ntf-dot{display:block;width:8px;height:8px;border-radius:50%;background:var(--accent)} html[data-design=m2] .ntf.ok .ntf-dot{background:var(--green)} html[data-design=m2] .ntf.err .ntf-dot{background:var(--red)} html[data-design=m2] .ntf.warn .ntf-dot{background:var(--yellow)}
html[data-design=m2] footer.foot .giga img{width:18px;height:18px;border-radius:5px;margin-right:6px;vertical-align:-4px}

html[data-design=m2] .tp-list > .ax{display:none}
html[data-design=m2] .tp#tpresets{padding:2px;gap:1px} html[data-design=m2] .tp#tpresets button{height:24px;padding:0 9px;font-size:11px}

/* ═══ pass 4: nothing green leaks (dart's dark tokens lose to these), the ticket is tidy, BGC and ideas pages ═══ */
html[data-design=m2][data-edition][data-theme]{
  --bg:#070708; --panel:#0e0e10; --panel-2:#0b0b0c; --card:#131315; --card-hover:#19191c; --card-hot:#131315; --raised:#1b1b1f;
  --line:#1f1f23; --line-2:#2b2b31; --hairline:#17171a; --hover:#19191c; --chip:#1b1b1f;
  --text:#f4f4f2; --sub:#9c9c9a; --sub-2:#d2d2ce; --dim:#5f5f63;
  --green:#34d17b; --green-2:#6ee7a8; --green-bg:rgba(52,209,123,.14); --green-tint:rgba(52,209,123,.08); --green-line:rgba(52,209,123,.4);
  --red:#ff5c5c; --red-2:#ff8080; --red-bg:rgba(255,92,92,.14);
  --yellow:#f2c14e; --orange:#f78c3a; --yellow-bg:rgba(242,193,78,.14); --yellow-line:rgba(242,193,78,.4);
  --blue:#8ab4ff; --blue2:#a9c6ff; --blue-bg:rgba(138,180,255,.14); --quote:#c9c9c4; --quote-bg:rgba(255,255,255,.06); --cyan:#6fd8e8; --purple:#b8a6ff;
  --near:var(--accent); --ink:var(--accent); --on-ink:var(--on-accent); --paper:var(--panel); --tile-bg:#1b1b1f; --tile-ini:#1b1b1f; --wm:rgba(244,244,242,.04); --scroll:#2b2b31; --dim-ring:rgba(244,244,242,.12);
  --shadow:0 24px 60px rgba(0,0,0,.6); --lime:var(--accent); --lime-2:var(--accent-2); --lime-ink:var(--on-accent); --glow:rgba(0,0,0,0);
}
html[data-design=m2] body,html[data-design=m2] .wrap,html[data-design=m2] main,html[data-design=m2] .lanes,html[data-design=m2] .right,html[data-design=m2] .left .panel,html[data-design=m2] .right .panel,html[data-design=m2] .chartp,html[data-design=m2] .tabsp,html[data-design=m2] .tbody{background-image:none!important}
/* the ticket on the token page */
html[data-design=m2] .right .trade .go{width:calc(100% - 28px)!important;margin:12px 14px 14px!important}
html[data-design=m2] .right .trade .seg button.buy.on{background:var(--accent)!important;color:var(--on-accent)!important}
html[data-design=m2] .right .chg{display:grid;grid-template-columns:repeat(4,1fr);padding:0;overflow:hidden;background:var(--panel)}
html[data-design=m2] .right .chg > *{padding:12px 10px;border-right:1px solid var(--hairline);background:transparent!important}
html[data-design=m2] .right .chg > *:last-child{border-right:0}
html[data-design=m2] .right .chg .k,html[data-design=m2] .right .trade .otype{color:var(--dim)}
html[data-design=m2] .right .vol,html[data-design=m2] .right .sb{background:var(--panel)!important;border-radius:16px;border:1px solid var(--line)}
html[data-design=m2] .right .trade .ctl{padding:12px 14px 0;border:0}
html[data-design=m2] .right .trade .otype{display:flex;align-items:center;gap:10px;margin-top:14px;font-size:11.5px}
html[data-design=m2] .right .trade .otype .soon{border-radius:999px;background:var(--card);border:1px solid var(--line);color:var(--dim)}
html[data-design=m2] .right .trade .hint,html[data-design=m2] .right .trade .pos{color:var(--sub);font-size:12px}
html[data-design=m2] .right .trade .inp{margin-top:10px!important}
html[data-design=m2] .right .trade .presets{grid-template-columns:repeat(4,1fr) 34px 34px}
html[data-design=m2] .right .trade .presets button{height:40px;font-size:13px}
html[data-design=m2] .right .trade .presets button.ic{padding:0}
html[data-design=m2] .right .trade .quote{display:flex;justify-content:space-between;font-size:11.5px}
html[data-design=m2] .right .trade .acc{padding:12px 14px}
/* BGC: the key visual stands alone, the numbers sit under it in a quiet strip */
html[data-design=m2] .bgc .hero{display:flex;flex-direction:column;border:1px solid var(--line)!important;border-radius:18px;box-shadow:none!important;background:var(--panel)!important}
html[data-design=m2] .bgc .hero img{aspect-ratio:1800/920;object-position:50% 38%;mask-image:linear-gradient(180deg,#000 82%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,#000 82%,transparent 100%)}
html[data-design=m2] .bgc .hero .bar{position:static!important;grid-template-columns:1fr 1.5fr 1.2fr;gap:0;background:var(--panel)!important;padding:4px 22px 22px!important;margin-top:-14px}
html[data-design=m2] .bgc .hero .cell{border-left:1px solid var(--hairline);padding:0 22px}
html[data-design=m2] .bgc .hero .cell:first-child{padding-left:0}
html[data-design=m2] .bgc .k{color:var(--dim);font-family:var(--mono);letter-spacing:.14em}
html[data-design=m2] .bgc .badge{background:var(--card);border:1px solid var(--line);color:var(--sub-2);font-family:var(--mono)} html[data-design=m2] .bgc .badge i{box-shadow:0 0 0 3px var(--accent-bg)}
html[data-design=m2] .bgc .cd div{background:var(--card);border-color:var(--line);border-radius:12px}
html[data-design=m2] .bgc .cd b,html[data-design=m2] .bgc .pool b,html[data-design=m2] .bgc .stats b,html[data-design=m2] .bgc .card .pct{font-family:var(--mono)!important;letter-spacing:-.03em}
html[data-design=m2] .bgc .pool b{color:var(--text);text-shadow:none;font-size:44px;font-weight:600}
html[data-design=m2] .bgc .pool .usd{font-family:var(--mono);color:var(--sub);font-weight:500}
html[data-design=m2] .bgc .pool a{color:var(--sub);font-size:12px}
html[data-design=m2] .bgc .go{border-radius:999px;font-family:var(--font);font-weight:700;box-shadow:none}
html[data-design=m2] .bgc .go.in{background:var(--card);border-color:var(--line-2);color:var(--text)}
html[data-design=m2] .bgc .sec h2{font-family:var(--serif);font-style:italic;font-weight:400;font-size:30px;letter-spacing:-.01em;text-transform:lowercase}
html[data-design=m2] .bgc .sec h2 em{font-style:italic;color:var(--text)}
html[data-design=m2] .bgc .card,html[data-design=m2] .bgc .board,html[data-design=m2] .bgc .st,html[data-design=m2] .bgc .step,html[data-design=m2] .bgc .holders,html[data-design=m2] .bgc .faq details{border-radius:16px;background:var(--panel);border-color:var(--line)}
html[data-design=m2] .bgc .card.pool-src{background:var(--panel);border-color:var(--line)}
html[data-design=m2] .bgc .card .pct span,html[data-design=m2] .bgc .st .state,html[data-design=m2] .bgc .step .n,html[data-design=m2] .bgc .st .n{color:var(--accent)}
html[data-design=m2] .bgc .seg2{border-radius:999px;padding:3px;background:var(--card)} html[data-design=m2] .bgc .seg2 button{border-radius:999px;height:30px} html[data-design=m2] .bgc .seg2 button.on{background:var(--raised);color:var(--text);box-shadow:inset 0 0 0 1px var(--line-2)}
html[data-design=m2] .bgc .lb th{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
html[data-design=m2] .bgc .lb td{font-family:var(--mono);font-size:12.5px}
@media (max-width:900px){html[data-design=m2] .bgc .hero .bar{grid-template-columns:1fr;padding:12px 18px 18px!important;margin-top:0}html[data-design=m2] .bgc .hero .cell{border:0;padding:0}}
/* ideas page */
html[data-design=m2] .rm .top{background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:26px 0 22px;flex-wrap:wrap}
html[data-design=m2] .rm .top .k{font-family:var(--mono);color:var(--dim)}
html[data-design=m2] .rm .top h1{font-family:var(--serif);font-style:italic;font-weight:400;font-size:46px;letter-spacing:-.01em;text-transform:lowercase}
html[data-design=m2] .rm .top h1 em{font-style:italic;color:var(--text)}
html[data-design=m2] .rm .counts div b{font-family:var(--mono);font-weight:600}
html[data-design=m2] .rm .go{border-radius:999px;background:var(--accent);color:var(--on-accent);font-family:var(--font);font-weight:700}
html[data-design=m2] .rm .cols{margin-top:4px}
html[data-design=m2] .rm .col{border:0;background:transparent;padding:0;min-height:0}
html[data-design=m2] .rm .col h2{display:none}
html[data-design=m2] .rm .card{background:var(--panel);border-radius:16px;padding:16px 18px;margin-top:10px}
html[data-design=m2] .rm .card h3{font-family:var(--font);font-size:15.5px}
html[data-design=m2] .rm .tag{border-radius:999px;font-family:var(--mono)} html[data-design=m2] .rm .tag.st{background:var(--accent-bg);color:var(--accent)} html[data-design=m2] .rm .tag.pinned{background:var(--card);color:var(--sub-2)}
html[data-design=m2] .rm .card.pin{border-color:var(--line-2);box-shadow:none}
html[data-design=m2] .rm .vote{border-radius:14px;background:var(--card);font-family:var(--mono)} html[data-design=m2] .rm .vote.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
html[data-design=m2] .rm .empty{padding:60px 10px;font-size:14px;border:1px dashed var(--line-2);border-radius:16px;margin-top:10px}
html[data-design=m2] .rm .admbar{border-color:var(--line-2);border-radius:14px}
/* the more-menu and the nav on the long pages */
html[data-design=m2] .nav .menu .m2-more-l a{height:38px}
html[data-design=m2] footer.foot .giga{background:transparent!important;border:0!important;padding:0}
html[data-design=m2] footer.foot .wal,html[data-design=m2] footer.foot #ft-wal{background:var(--card)!important;border-radius:999px;border:1px solid var(--line)}

/* ═══ pass 5: the menu sits left and never moves; the footer wallet chip is quiet; BGC hero full-bleed ═══ */
html[data-design=m2] .nav{display:flex!important;grid-template-columns:none;gap:0;padding:0 20px}
html[data-design=m2] .nav .logo{flex:none;margin-right:22px}
html[data-design=m2] .nav .menu{flex:none;justify-content:flex-start;margin:0}
html[data-design=m2] .nav .r{margin-left:auto}
@media (max-width:1100px){html[data-design=m2] .nav{display:flex!important}html[data-design=m2] .nav .menu{display:none!important}}
html[data-design=m2] footer.foot .bal,html[data-design=m2] footer.foot .gas{background:var(--card)!important;color:var(--sub-2)!important;border:1px solid var(--line);border-radius:999px;height:26px;padding:0 10px!important;display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11.5px}
html[data-design=m2] footer.foot .gas svg{color:var(--sub)}
html[data-design=m2] footer.foot .live.on,html[data-design=m2] footer.foot #state{font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em;font-size:11px}
/* BGC: the key visual runs edge to edge under the nav, the numbers are typography on top of it, no boxes */
html[data-design=m2] .bgc{padding-top:0!important;max-width:none!important}
html[data-design=m2] .bgc > .sec,html[data-design=m2] .bgc > :not(.hero){max-width:1240px;margin-left:auto;margin-right:auto;padding-left:20px;padding-right:20px}
html[data-design=m2] .bgc .hero{position:relative;display:block;width:100%;height:min(86vh,860px);min-height:560px;margin:0;border:0!important;border-radius:0!important;box-shadow:none!important;background:var(--bg)!important;overflow:hidden}
html[data-design=m2] .bgc .hero img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:50% 42%;mask-image:none;-webkit-mask-image:none}
html[data-design=m2] .bgc .hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,7,8,.55) 0%,rgba(7,7,8,0) 18%,rgba(7,7,8,0) 52%,rgba(7,7,8,.78) 78%,var(--bg) 100%);pointer-events:none}
html[data-design=m2] .bgc .hero .bar{position:absolute!important;left:50%;right:auto;bottom:0;transform:translateX(-50%);width:min(1240px,100%);padding:0 20px 34px!important;margin:0;display:grid;grid-template-columns:1fr 1.5fr 1.2fr;gap:0;background:transparent!important;align-items:end}
html[data-design=m2] .bgc .hero .cell{border-left:1px solid rgba(255,255,255,.1);padding:0 26px}
html[data-design=m2] .bgc .hero .cell:first-child{border-left:0;padding-left:0}
html[data-design=m2] .bgc .hero .k{color:rgba(244,244,242,.6)}
html[data-design=m2] .bgc .badge{background:rgba(7,7,8,.55);border:1px solid rgba(255,255,255,.14);color:#fff;backdrop-filter:blur(8px)}
html[data-design=m2] .bgc .cd{gap:26px;margin-top:10px}
html[data-design=m2] .bgc .cd div{background:transparent;border:0;padding:0;min-width:0;text-align:left;border-radius:0}
html[data-design=m2] .bgc .cd b{font-size:40px;color:#fff}
html[data-design=m2] .bgc .cd small{color:rgba(244,244,242,.55)}
html[data-design=m2] .bgc .pool b{font-size:64px;color:#fff;margin-top:8px;letter-spacing:-.04em}
html[data-design=m2] .bgc .pool .usd{color:rgba(244,244,242,.75);font-size:16px}
html[data-design=m2] .bgc .pool a{color:rgba(244,244,242,.6)}
html[data-design=m2] .bgc .stats{gap:28px;margin:0} html[data-design=m2] .bgc .stats b{font-size:34px;color:#fff}
html[data-design=m2] .bgc .stats .k{color:rgba(244,244,242,.55)}
html[data-design=m2] .bgc .cta{gap:14px}
html[data-design=m2] .bgc .cta .go{height:48px;padding:0 26px;font-size:15px}
html[data-design=m2] .bgc .cta > .k{color:rgba(244,244,242,.45);max-width:300px;line-height:1.5}
html[data-design=m2] .bgc .sec:first-of-type{margin-top:34px}
@media (max-width:900px){html[data-design=m2] .bgc .hero{height:auto;min-height:0}html[data-design=m2] .bgc .hero img{position:static;height:auto;aspect-ratio:1800/1013;mask-image:linear-gradient(180deg,#000 70%,transparent);-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent)}html[data-design=m2] .bgc .hero::before{display:none}html[data-design=m2] .bgc .hero .bar{position:static!important;transform:none;width:auto;grid-template-columns:1fr;gap:18px;padding:0 18px 20px!important;margin-top:-40px}html[data-design=m2] .bgc .hero .cell{border:0;padding:0}html[data-design=m2] .bgc .pool b{font-size:44px}}

/* ═══ pass 6: BGC hero — the photo runs edge to edge, the numbers sit under it as plain typography ═══ */
html[data-design=m2] .bgc{width:100%!important;max-width:none!important;margin:0!important;padding:0 0 60px!important}
html[data-design=m2] .bgc .hero{height:auto;min-height:0}
html[data-design=m2] .bgc .hero img{position:static;width:100%;height:min(76vh,760px);min-height:420px;object-fit:cover;object-position:50% 60%;mask-image:linear-gradient(180deg,#000 88%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,#000 88%,transparent 100%)}
html[data-design=m2] .bgc .hero::before{background:linear-gradient(180deg,rgba(7,7,8,.5) 0%,rgba(7,7,8,0) 16%);bottom:auto;height:30%}
html[data-design=m2] .bgc .hero .bar{position:static!important;transform:none;width:min(1240px,100%);margin:-26px auto 0;padding:0 20px 8px!important;align-items:start}
html[data-design=m2] .bgc .hero .cell{border-left:1px solid var(--line)}
html[data-design=m2] .bgc .hero .k{color:var(--dim)}
html[data-design=m2] .bgc .badge{background:var(--card);border:1px solid var(--line);color:var(--sub-2);backdrop-filter:none}
html[data-design=m2] .bgc .cd b,html[data-design=m2] .bgc .pool b,html[data-design=m2] .bgc .stats b{color:var(--text)}
html[data-design=m2] .bgc .cd small,html[data-design=m2] .bgc .stats .k,html[data-design=m2] .bgc .cta > .k{color:var(--dim)}
html[data-design=m2] .bgc .pool .usd{color:var(--sub)} html[data-design=m2] .bgc .pool a{color:var(--sub)}
html[data-design=m2] .bgc .sec:first-of-type{margin-top:44px}
@media (max-width:900px){html[data-design=m2] .bgc .hero img{height:auto;min-height:0;aspect-ratio:1800/1013}html[data-design=m2] .bgc .hero .bar{margin-top:0}}
/* BGC schedule: the live step is quiet too */
html[data-design=m2] .bgc .st.live{background:var(--panel);border-color:var(--line-2)}
html[data-design=m2] .bgc .st.live .n{background:var(--accent);color:var(--on-accent)}
html[data-design=m2] .bgc .st.live .state{background:var(--accent-bg);color:var(--accent);border-color:var(--accent-line)}
html[data-design=m2] .bgc .st.done .n{background:var(--card);color:var(--sub-2)}
html[data-design=m2] .bgc .st h3{font-family:var(--font)!important;text-transform:none!important;letter-spacing:0!important}
html[data-design=m2] .bgc .st p,html[data-design=m2] .bgc .st .when{font-family:var(--font)!important;text-transform:none!important;letter-spacing:0!important}
html[data-design=m2] .bgc .st .when{font-family:var(--mono)!important}

/* ═══ pass 7: the Log in button's states, the ideas page, the bubblemap sheet, the prize pool ═══ */
html[data-design=m2] .nav .r .ab{user-select:none;-webkit-tap-highlight-color:transparent;cursor:pointer;transition:background .12s,border-color .12s,transform .08s,opacity .12s}
html[data-design=m2] .nav .r .ab:active{transform:scale(.97)}
html[data-design=m2] .nav .r .ab.login.wait{opacity:.55;cursor:progress;background:var(--card)!important;color:var(--sub)!important;border-color:var(--line)!important}
html[data-design=m2] .nav .r .ab:not(.login){padding:0 10px 0 6px;gap:8px}
html[data-design=m2] .nav .r .ab .av{width:26px;height:26px;border-radius:50%;background:var(--accent);color:var(--on-accent);display:inline-grid;place-items:center;font-weight:700;font-size:12px}
html[data-design=m2] .nav .r .acct{position:relative}
html[data-design=m2] .nav .r .acct .am,html[data-design=m2] .am{top:calc(100% + 10px);border-radius:16px;border:1px solid var(--line-2);background:var(--panel);box-shadow:var(--shadow);padding:6px}
html[data-design=m2] .am .who{padding:12px 12px 10px;border-bottom:1px solid var(--line);font-size:12.5px;color:var(--sub)} html[data-design=m2] .am .who b{color:var(--text);font-size:14px}
html[data-design=m2] .am button,html[data-design=m2] .am a{height:38px;border-radius:10px;font-size:13px;font-weight:500}
html[data-design=m2] .am button:hover,html[data-design=m2] .am a:hover{background:var(--hover)}
html[data-design=m2] .am .out{color:var(--red)}
/* ideas */
html[data-design=m2] main.rm{padding-top:10px}
html[data-design=m2] .rm .top{padding:18px 0 18px;align-items:center}
html[data-design=m2] .rm .top h1{font-size:40px;margin:8px 0 6px}
html[data-design=m2] .rm .top p{font-size:14px;max-width:520px}
html[data-design=m2] .rm .counts{gap:22px;align-self:center}
html[data-design=m2] .rm .counts div b{font-size:28px}
html[data-design=m2] .rm .actions{margin-top:14px;gap:14px}
html[data-design=m2] .rm .actions .go{height:40px;padding:0 18px;font-size:13.5px}
html[data-design=m2] .rm #who{font-size:13px;color:var(--sub)}
html[data-design=m2] .rm .empty{padding:34px 20px;margin-top:14px;border:1px dashed var(--line-2);border-radius:16px;background:var(--panel);color:var(--sub);font-size:13.5px}
html[data-design=m2] .rm .foot{margin-top:16px;font-family:var(--mono);font-size:11.5px;color:var(--dim);border-top:0;padding:0 2px}
/* bubblemap sheet */
html[data-design=m2] .atlas{background:var(--bg)}
html[data-design=m2] .atlas-h{height:44px;font-family:var(--font)}
html[data-design=m2] .atlas-h button{border-radius:999px}
html[data-design=m2] .cbar #atlas-btn.on{background:var(--accent-bg);color:var(--accent)}
/* prize pool */
html[data-design=m2] .bgc .prize-l,html[data-design=m2] .bgc .prize-r{border-radius:16px;background:var(--panel);border-color:var(--line)}
html[data-design=m2] .bgc .pz-pot{font-family:var(--mono);font-weight:600;letter-spacing:-.04em}
html[data-design=m2] .bgc .pz-usd{font-family:var(--mono);font-weight:500}
html[data-design=m2] .bgc .pz-c{background:var(--card);border-color:var(--hairline);border-radius:12px}
html[data-design=m2] .bgc .pz-c .pl{border-radius:999px;font-family:var(--mono)}
html[data-design=m2] .bgc .pz-c.p1 .pl,html[data-design=m2] .bgc .pz-c.p2 .pl,html[data-design=m2] .bgc .pz-c.p3 .pl{background:var(--accent);color:var(--on-accent)}
html[data-design=m2] .bgc .pz-c b{font-family:var(--mono);font-weight:600} html[data-design=m2] .bgc .pz-c small{font-family:var(--mono)}
html[data-design=m2] .bgc .example .calc{font-family:var(--mono)}

/* ═══ pass 8: quick ticket, the security page, the two-factor dialogs ═══ */
html[data-design=m2] .right .trade .ctl .qk{height:32px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--sub-2);font-family:var(--font);padding:0 12px}
html[data-design=m2] .right .trade .ctl .qk.on{background:var(--accent-bg);border-color:var(--accent-line);color:var(--accent)}
html[data-design=m2] .right .trade .quick{margin:12px 14px 0;gap:10px}
html[data-design=m2] .right .trade .qrow{grid-template-columns:58px repeat(4,1fr) 34px;gap:6px}
html[data-design=m2] .right .trade .ql{font-family:var(--mono);letter-spacing:.1em} html[data-design=m2] .right .trade .ql.buy{color:var(--accent)} html[data-design=m2] .right .trade .ql.sell{color:var(--red)}
html[data-design=m2] .right .trade .qb,html[data-design=m2] .right .trade .qs,html[data-design=m2] .right .trade .qe{height:44px;border-radius:999px;font-family:var(--mono);font-size:13px}
html[data-design=m2] .right .trade .qb{background:var(--accent);border-color:var(--accent);color:var(--on-accent);box-shadow:0 10px 24px -14px var(--glow)}
html[data-design=m2] .right .trade .qb:hover{background:var(--accent-2)}
html[data-design=m2] .right .trade .qs{background:transparent;border:1px solid rgba(255,92,92,.45);color:var(--red)} html[data-design=m2] .right .trade .qs:hover{background:var(--red);border-color:var(--red);color:#fff}
html[data-design=m2] .right .trade .qs:disabled{background:transparent;border-color:var(--line);color:var(--dim)}
html[data-design=m2] .right .trade .qe{background:var(--card);border-color:var(--line)}
html[data-design=m2] .right .trade .qnote{font-family:var(--mono);font-size:11px;padding:0 2px}
html[data-design=m2] .right .trade .quick .pos1{margin-bottom:2px}
/* security */
html[data-design=m2] .page .k{font-family:var(--mono);color:var(--dim)}
html[data-design=m2] .page h1{font-family:var(--serif);font-style:italic;font-weight:400;font-size:44px;text-transform:lowercase;letter-spacing:-.01em}
html[data-design=m2] .page .lede{font-size:14.5px}
html[data-design=m2] .page .box,html[data-design=m2] .page .gate{border-radius:18px;background:var(--panel);border-color:var(--line)}
html[data-design=m2] .page .box h2{font-size:17px}
html[data-design=m2] .page #tfa-side .st{border-radius:999px;background:var(--card);border:1px solid var(--line);font-family:var(--mono);font-size:11px;letter-spacing:.08em} html[data-design=m2] .page #tfa-side .st.on i{background:var(--accent);box-shadow:0 0 0 3px var(--accent-bg)}
html[data-design=m2] .page button.big{background:var(--accent);color:var(--on-accent);border-radius:999px;font-family:var(--font);box-shadow:0 10px 24px -14px var(--glow)} html[data-design=m2] .page button.big.quiet{background:var(--card);color:var(--text);border-color:var(--line-2)}
html[data-design=m2] .page .lnk{color:var(--sub-2)} html[data-design=m2] .page .lnk.red{color:var(--red)}
html[data-design=m2] .page .sw.on{background:var(--accent)} html[data-design=m2] .page .sw::after{background:#fff}
html[data-design=m2] .page .gates li b{font-size:14px}
html[data-design=m2] .page .acct div b{font-family:var(--mono)} html[data-design=m2] .page .addr{font-family:var(--mono)}
/* 2FA dialogs */
html[data-design=m2] .tfa-codes{border-radius:14px;background:var(--card)} html[data-design=m2] .tfa-codes code{font-family:var(--mono)}
html[data-design=m2] .tfa-secret code{font-family:var(--mono);border-radius:10px;background:var(--card)}
html[data-design=m2] .tfa-qr{border-radius:14px}
html[data-design=m2] .tfa-ok input{accent-color:var(--accent)}
html[data-design=m2] .dlg-f-row input[name=code]{font-family:var(--mono);font-size:22px;letter-spacing:.3em;text-align:center;height:52px}

/* ═══ pass 9: the token header as one row (no empty corner), and every page on a phone ═══ */
html[data-design=m2] .th{display:flex!important;flex-wrap:wrap;align-items:center;gap:10px 18px;grid-template-columns:none}
html[data-design=m2] .th .id{flex:1 1 240px;min-width:0}
html[data-design=m2] .th .mcw{border-left:1px solid var(--line);padding-left:18px;min-width:120px}
html[data-design=m2] .th .stats{flex:1 1 100%;min-width:0;overflow-x:auto;scrollbar-width:none;gap:22px;order:5} html[data-design=m2] .th .stats::-webkit-scrollbar{display:none}
html[data-design=m2] .th .pools{margin-left:auto;order:4}
html[data-design=m2] .th .pools > button{border-radius:999px;height:36px;background:var(--card);border:1px solid var(--line)}
@media (min-width:1500px){html[data-design=m2] .th .stats{order:0;flex:1 1 auto}html[data-design=m2] .th .pools{order:0}}
/* compact header (default) under m2: the roomy two-row ticket collapses to one tight row — smaller mark + MC, less padding, and the stats held inline (scroll) instead of wrapping below. scoped off phones so the pass-9/11b phone tuning is untouched. */
@media (min-width:721px){
  /* nowrap pins it to one row: stats takes the slack and scrolls, pools never drops below */
  html[data-design=m2] .th.compact{padding:8px 0 8px!important;gap:8px 16px;flex-wrap:nowrap}
  html[data-design=m2] .th.compact .tile,html[data-design=m2] .th.compact .av{width:40px!important;height:40px!important;border-radius:10px!important}
  html[data-design=m2] .th.compact .sym,html[data-design=m2] .th.compact h1,html[data-design=m2] .th.compact .name b{font-size:18px!important}
  html[data-design=m2] .th.compact .mc,html[data-design=m2] .th.compact .price,html[data-design=m2] .th.compact .big{font-size:24px!important}
  html[data-design=m2] .th.compact .mcw{padding-left:14px;min-width:100px}
  html[data-design=m2] .th.compact .stats{flex:1 1 auto!important;order:0;gap:16px;min-width:0;overflow-x:auto}
  html[data-design=m2] .th.compact .pools{order:0;flex:none}
  /* the identity block keeps its own width and clips: with nowrap it used to shrink to the 240px basis and spill its chips under the market cap */
  html[data-design=m2] .th.compact .id{flex:0 1 auto;max-width:34%;min-width:200px;overflow:hidden} html[data-design=m2] .th.compact .id > *{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  html[data-design=m2] .th.compact .mcw{flex:none}
  html[data-design=m2] .th.compact .pools > button{height:30px!important}
}
@media (max-width:720px){
  html[data-design=m2] .nav{height:54px;padding:0 10px;gap:0}
  html[data-design=m2] .nav .logo{margin-right:8px} html[data-design=m2] .nav .logo span{font-size:22px} html[data-design=m2] .nav .logo .mark{width:26px;height:26px}
  html[data-design=m2] .nav .r{gap:6px;flex:1;justify-content:flex-end;min-width:0}
  html[data-design=m2] .nav .r > *{height:36px!important;border-radius:10px!important;font-size:12px}
  /* the chain switch stays on phones as its logo alone (it is the only way to another chain there) */
  html[data-design=m2] .nav .r .dd .pill{padding:0 8px} html[data-design=m2] .nav .r .dd .pill .globe,html[data-design=m2] .nav .r .dd .pill .cn,html[data-design=m2] .nav .r .dd .pill > svg{display:none}
  html[data-design=m2] .nav .r .dd-menu{position:fixed;top:60px;right:10px;left:auto;max-width:calc(100vw - 20px)}
  html[data-design=m2] .nav .r #nav-bell,html[data-design=m2] .nav .r .m2-look,html[data-design=m2] .nav .r #nav-alerts,html[data-design=m2] .nav .r .pill:not(#open-wallets):not(.ab):not(#chain-btn){display:none!important}
  html[data-design=m2] .nav .r #mt-lang .sh{display:none} html[data-design=m2] .nav .r #mt-lang{padding:0 9px}
  html[data-design=m2] .nav .r .ibtn{width:36px}
  html[data-design=m2] .nav .r #open-wallets{padding:0 10px 0 8px;white-space:nowrap} html[data-design=m2] .nav .r #open-wallets > span:last-child{display:none}
  html[data-design=m2] .nav .r .ab.login{padding:0 12px}
  html[data-design=m2] .nav .r .ab:not(.login){padding:0 6px} html[data-design=m2] .nav .r .ab:not(.login) .lb{display:none}
  /* the board */
  html[data-design=m2] .wl:has(> .wl-t){display:none!important}
  html[data-design=m2] .tbar{padding:8px 12px;gap:8px;flex-wrap:wrap} html[data-design=m2] .tbar .tb-t{font-size:24px}
  html[data-design=m2] .lanes,html[data-design=m2] main.lanes{padding:0 10px 90px}
  html[data-design=m2] .lane{padding:0!important;margin:0!important;border-right:0!important}
  html[data-design=m2] .lane-h{height:40px}
  html[data-design=m2] .lane .row,html[data-design=m2] .lane .tok{--rowpad:12px 8px 10px 8px}
  html[data-design=m2] .lane .row .lft .av,html[data-design=m2] .row .av.tile{width:48px!important;height:48px!important}
  html[data-design=m2] .lane .row .buyw .buy{height:34px!important;padding:0 12px 0 10px!important;font-size:12px;box-shadow:none}
  html[data-design=m2] .lane .row .l1 .tk{font-size:14px}
  html[data-design=m2] .row .l2,html[data-design=m2] .lane .row .l3{overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap} html[data-design=m2] .row .l2::-webkit-scrollbar,html[data-design=m2] .lane .row .l3::-webkit-scrollbar{display:none}
  /* the token page */
  html[data-design=m2] .wrap{padding:0 10px 90px}
  html[data-design=m2] .th{gap:8px 12px;padding:12px 0 10px!important}
  html[data-design=m2] .th .tile,html[data-design=m2] .th .av{width:48px!important;height:48px!important;border-radius:12px!important}
  html[data-design=m2] .th .sym,html[data-design=m2] .th h1{font-size:19px!important}
  html[data-design=m2] .th .mcw{border-left:0;padding-left:0;flex:1 1 100%;order:3}
  html[data-design=m2] .th .mc,html[data-design=m2] .th .price,html[data-design=m2] .th .big{font-size:30px!important}
  html[data-design=m2] .th .stats{gap:16px}
  html[data-design=m2] .th .pools{order:6;margin-left:0}
  html[data-design=m2] .cbar{overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap} html[data-design=m2] .cbar::-webkit-scrollbar{display:none}
  html[data-design=m2] .right{padding-bottom:16px}
  html[data-design=m2] .right .trade .go{height:50px!important}
  html[data-design=m2] .right .chg{grid-template-columns:repeat(4,1fr)}
  html[data-design=m2] .tabsp .tabs{overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap;gap:14px} html[data-design=m2] .tabsp .tabs::-webkit-scrollbar{display:none}
  html[data-design=m2] .tabsp .tbody{overflow-x:auto}
  /* portfolio */
  html[data-design=m2] .top{display:block}
  html[data-design=m2] .wal{border-right:0;border-bottom:1px solid var(--line)}
  html[data-design=m2] .wal-h,html[data-design=m2] .stats-h{height:auto;flex-wrap:wrap;padding:10px 12px;gap:8px}
  html[data-design=m2] .wal-h .r,html[data-design=m2] .stats-h .r{flex-wrap:wrap;gap:6px}
  html[data-design=m2] .wal-h h2,html[data-design=m2] .stats-h h2{font-size:20px}
  html[data-design=m2] .bal{padding:16px 12px;display:block}
  html[data-design=m2] .bal .big{font-size:34px}
  html[data-design=m2] .actions{grid-template-columns:repeat(3,1fr);padding:6px 8px 10px}
  html[data-design=m2] .action{padding:8px 4px;font-size:12px;gap:6px}
  html[data-design=m2] .tabs{height:auto;flex-wrap:wrap;gap:6px 12px;padding:10px 12px}
  html[data-design=m2] .tabs .search{width:100%;order:9}
  html[data-design=m2] .empty2{padding:30px 12px}
  html[data-design=m2] .wrap.pf,html[data-design=m2] body.pf{padding-bottom:80px}
  /* tracker */
  html[data-design=m2] .tp:has(> .tp-l){padding:12px 10px 80px}
  html[data-design=m2] .tk-zero{padding:28px 14px} html[data-design=m2] .tk-zero h3{font-size:26px}
  html[data-design=m2] .tk-zero .big{background:var(--card)!important;color:var(--accent)!important;border-radius:14px}
  /* bgc, ideas, security */
  html[data-design=m2] .bgc > .sec,html[data-design=m2] .bgc > :not(.hero){padding-left:12px;padding-right:12px}
  html[data-design=m2] .bgc .hero .bar{padding:0 12px 16px!important}
  html[data-design=m2] .bgc .pool b{font-size:38px}
  html[data-design=m2] .bgc .pz-grid{grid-template-columns:repeat(2,1fr)}
  html[data-design=m2] .bgc .sec h2{font-size:26px}
  html[data-design=m2] main.rm{padding:10px 14px 60px} html[data-design=m2] .rm .top h1{font-size:30px}
  html[data-design=m2] .page{padding:18px 14px 60px} html[data-design=m2] .page h1{font-size:32px}
  html[data-design=m2] .page .acct{grid-template-columns:1fr}
  html[data-design=m2] .page .tfa{flex-direction:column;align-items:flex-start}
  /* sheets, dialogs, search */
  html[data-design=m2] .dlg{width:calc(100vw - 20px)!important;max-width:calc(100vw - 20px)}
  html[data-design=m2] .tfa-setup{grid-template-columns:1fr}
  html[data-design=m2] #gs .gs-row{grid-template-columns:40px minmax(0,1fr) auto;gap:8px} html[data-design=m2] #gs .gs-st{display:none}
  html[data-design=m2] .ntf-stack{bottom:76px!important}
}
@media (max-width:720px){html[data-design=m2] .wal .empty,html[data-design=m2] .wal .empty2,html[data-design=m2] .wal .empty2 p{white-space:normal;max-width:100%;padding-left:12px;padding-right:12px;box-sizing:border-box}html[data-design=m2] .wal .tbl,html[data-design=m2] .wal .scroll,html[data-design=m2] #w-body{overflow-x:auto;max-width:100%}html[data-design=m2] .wal table{min-width:0}}
/* the account wrapper is not a control: the button inside it is */
html[data-design=m2] .nav .r .acct{border:0!important;background:transparent!important;height:auto!important;padding:0!important;display:inline-flex;align-items:center;border-radius:0!important}
html[data-design=m2] .nav .r .acct .ab{height:var(--ctl)!important;border-radius:var(--r)!important;border:1px solid var(--line)!important;background:var(--card)!important;display:inline-flex;align-items:center;font-family:inherit;line-height:1}
html[data-design=m2] .nav .r .acct .ab.login,html[data-design=m2] .nav .r .acct .ab.login.wait{background:var(--accent)!important;border-color:var(--accent)!important;color:var(--on-accent)!important}
html[data-design=m2] .nav .r .acct .ab.login.wait{opacity:.55;background:var(--card)!important;color:var(--sub)!important;border-color:var(--line)!important}
@media (max-width:720px){html[data-design=m2] .nav .r .acct .ab{height:36px!important;border-radius:10px!important}}
html[data-design=m2] .nav .r .acct{margin:0!important}

/* quick ticket v2 */
html[data-design=m2] .right .trade .quick{margin:10px 14px 0;gap:6px}
html[data-design=m2] .right .trade .qhead{margin-top:8px} html[data-design=m2] .right .trade .qhead .qsub{font-family:var(--mono);font-size:10.5px}
html[data-design=m2] .right .trade .qbtns{gap:6px}
html[data-design=m2] .right .trade .qb,html[data-design=m2] .right .trade .qs{height:48px;border-radius:14px;font-size:14px}
html[data-design=m2] .right .trade .qe{width:26px;height:26px;border-radius:999px}
html[data-design=m2] .right .trade .quick .pos1{margin-top:10px}

/* bridge sheet + portfolio divider in m2 */
html[data-design=m2] .xb .fm{border-radius:20px!important}
html[data-design=m2] .xb-ch,html[data-design=m2] .xb select,html[data-design=m2] .xb input[type=text]{background:var(--card);border-color:var(--line);border-radius:14px}
html[data-design=m2] .xb-list{border-radius:16px} html[data-design=m2] .xb-list button.on{background:var(--accent-bg)} html[data-design=m2] .xb-list button svg{color:var(--accent)}
html[data-design=m2] .xb-in input{font-family:var(--mono)} html[data-design=m2] .xb-big b{font-family:var(--mono);color:var(--text)}
html[data-design=m2] .xb-quote .xb-q,html[data-design=m2] .xb-hop{background:var(--card);border-radius:16px}
html[data-design=m2] .xb .fm-f #xb-go{background:var(--accent)!important;color:var(--on-accent)!important}
html[data-design=m2] .gsplit{background:var(--line)} html[data-design=m2] .gsplit:hover,html[data-design=m2] .gsplit.drag{background:var(--accent-line)} html[data-design=m2] .gsplit:hover::after,html[data-design=m2] .gsplit.drag::after{background:var(--accent)}

/* ═══ pass 10 ═══ */
/* the status line: BTC · ETH · SOL · BNB back, as chips */
html[data-design=m2] footer.foot .px{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-family:var(--mono);font-size:11.5px;color:var(--sub-2)}
html[data-design=m2] footer.foot .px .ci{width:14px;height:14px} html[data-design=m2] footer.foot .px .ci img{width:14px;height:14px}
html[data-design=m2] footer.foot .px small{color:var(--sub)} html[data-design=m2] footer.foot .px small.g{color:var(--green)} html[data-design=m2] footer.foot .px small.r{color:var(--red)}
html[data-design=m2] footer.foot .r{gap:8px}
/* the right column's stats: room to breathe, one line per number */
html[data-design=m2] .right .chg{grid-template-columns:repeat(4,minmax(0,1fr))}
html[data-design=m2] .right .chg > *{padding:12px 6px 11px;text-align:center}
html[data-design=m2] .right .chg .k{font-size:10px;letter-spacing:.1em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-design=m2] .right .chg .v{font-size:13px;white-space:nowrap;margin-top:4px}
html[data-design=m2] .right .trade .flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-bottom:1px solid var(--line)}
html[data-design=m2] .right .trade .flow > *{padding:12px 6px 11px;text-align:center;border-right:1px solid var(--hairline);min-width:0}
html[data-design=m2] .right .trade .flow > *:last-child{border-right:0}
html[data-design=m2] .right .trade .flow .k{font-size:10px;letter-spacing:.1em;color:var(--dim);text-transform:uppercase}
html[data-design=m2] .right .trade .flow .v{font-family:var(--mono);font-size:12.5px;white-space:nowrap;margin-top:4px;overflow:hidden;text-overflow:ellipsis}
html[data-design=m2] .right .trade .flow .v .s{color:var(--dim)}
/* bubblemap: a window over the chart, not a replacement */
html[data-design=m2] .atlas{inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);width:min(960px,94%);height:min(600px,88%);border-radius:18px;border:1px solid var(--line-2);box-shadow:0 40px 120px -30px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.03);overflow:hidden;background:var(--panel)}
html[data-design=m2] .atlas-h{cursor:grab;user-select:none;background:var(--panel)} html[data-design=m2] .atlas.drag .atlas-h{cursor:grabbing}
html[data-design=m2] .charthost{overflow:visible}
/* the account menu's 2FA line */
html[data-design=m2] .acct .am .who .mfa,.acct .am .who .mfa{display:inline-flex!important;align-items:center;gap:6px;white-space:nowrap;margin-top:8px;font-size:11.5px;color:var(--sub)}
html[data-design=m2] .acct .am .who .mfa i{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--accent-bg)}
html[data-design=m2] .acct .am .who .mfa.off i{background:var(--dim);box-shadow:none}
html[data-design=m2] .acct .am .who .mfa a{color:var(--accent);text-decoration:none;font-weight:600}
/* phone: chart, then the ticket right under it, then the stats and the tape */
@media (max-width:1100px){
  html[data-design=m2] .wrap{display:flex!important;flex-direction:column;height:auto}
  html[data-design=m2] .wrap > .left,html[data-design=m2] .wrap > .right{display:contents!important}
  html[data-design=m2] .wrap .gsplit{display:none!important}
  html[data-design=m2] .wrap .th{order:1} html[data-design=m2] .wrap .chartp{order:2} html[data-design=m2] .wrap .trade{order:3} html[data-design=m2] .wrap .chg{order:4} html[data-design=m2] .wrap .tabsp{order:5} html[data-design=m2] .wrap .audit{order:6}
  html[data-design=m2] .chartp{min-height:300px;max-height:44vh;flex:none;height:auto} html[data-design=m2] .charthost{height:280px!important}
  html[data-design=m2] .right .trade{margin-top:10px} html[data-design=m2] .right .chg{margin-top:10px}
  html[data-design=m2] .atlas{width:96%;height:70vh}
}
/* pass 10b: counts and sums on two lines; the phone ticket first, quick by default */
html[data-design=m2] .right .trade .flow .v{display:flex;flex-direction:column;align-items:center;gap:2px;white-space:nowrap;line-height:1.15}
html[data-design=m2] .right .trade .flow .v .s{display:none}
@media (max-width:1100px){html[data-design=m2] .right .trade{display:flex;flex-direction:column}html[data-design=m2] .right .trade .flow{order:9;border-top:1px solid var(--line);border-bottom:0}html[data-design=m2] .right .trade .acc{order:10}html[data-design=m2] .right .trade .quick{margin-top:6px}html[data-design=m2] .chartp{min-height:260px;max-height:40vh}html[data-design=m2] .charthost{height:240px!important}}

/* ═══ pass 11: dart (the Pons kind of smooth), the lane header's margin, a quieter wallets sheet ═══ */
html[data-design=m2] button,html[data-design=m2] .pill,html[data-design=m2] .dk,html[data-design=m2] .qb,html[data-design=m2] .qs,html[data-design=m2] .nav .menu a,html[data-design=m2] .tabs button,html[data-design=m2] .tabsp .tabs button,html[data-design=m2] .action,html[data-design=m2] .xb-ch,html[data-design=m2] .sw,html[data-design=m2] .gs-row,html[data-design=m2] .wl,html[data-design=m2] .pz-c,html[data-design=m2] .card{transition:background-color .16s ease,border-color .16s ease,color .16s ease,transform .14s cubic-bezier(.2,.8,.2,1),box-shadow .2s ease,opacity .16s ease}
html[data-design=m2] .lane .row{transition:background-color .18s ease,transform .18s cubic-bezier(.2,.8,.2,1)}
html[data-design=m2] .lane .row.enter{animation:m2row .42s cubic-bezier(.2,.8,.2,1) both}
@keyframes m2row{from{opacity:0;transform:translateY(-10px) scale(.985)}to{opacity:1;transform:none}}
html[data-design=m2] .lane .row .buyw .buy:active,html[data-design=m2] .qb:active,html[data-design=m2] .qs:active,html[data-design=m2] .go:active,html[data-design=m2] .nav .r > :not(.dd):active,html[data-design=m2] .nav .r .dd > .pill:active,html[data-design=m2] button.big:active,html[data-design=m2] .btn:active{transform:scale(.96)}
/* a dropdown wrapper never takes the press scale (a transform would make it a stacking context and drop its open menu under the board for the length of the press: the release then lands on a row and the pick is lost); an open one is its own raised layer, above the notification stack (70): a menu the user opened is never under a toast */
html[data-design=m2] .dd.open,html[data-design=m2] .nav:has(.dd.open){z-index:75}
html[data-design=m2] .lane .row .buyw .buy:hover{transform:translateY(-1px);box-shadow:0 12px 26px -12px var(--glow)}
html[data-design=m2] .lane .row .lft .av,html[data-design=m2] .row .av.tile{transition:transform .2s cubic-bezier(.2,.8,.2,1)} html[data-design=m2] .lane .row:hover .lft .av,html[data-design=m2] .lane .row:hover .av.tile{transform:scale(1.04)}
html[data-design=m2] .lane-h .cnt,html[data-design=m2] .lane-h .n{transition:transform .25s cubic-bezier(.2,.8,.2,1)}
html[data-design=m2] .ntf{animation:m2toast .34s cubic-bezier(.2,.8,.2,1) both} @keyframes m2toast{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
html[data-design=m2] .dlg-wrap{transition:opacity .2s ease} html[data-design=m2] .dlg-wrap .dlg{transition:transform .26s cubic-bezier(.2,.8,.2,1),opacity .2s ease;transform:translateY(14px) scale(.98)} html[data-design=m2] .dlg-wrap.show .dlg{transform:none}
html[data-design=m2] .modal .fm{animation:m2sheet .3s cubic-bezier(.2,.8,.2,1) both} @keyframes m2sheet{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}
html[data-design=m2] #gs .gs-box,html[data-design=m2] .m2-look-s{animation:m2sheet .26s cubic-bezier(.2,.8,.2,1) both}
html[data-design=m2] .th .mc{transition:color .3s ease}
html[data-design=m2] .right .trade .seg button,html[data-design=m2] .right .trade .presets button{transition:background-color .16s ease,color .16s ease,border-color .16s ease,transform .12s ease}
html[data-design=m2] .sw::after{transition:transform .18s cubic-bezier(.2,.8,.2,1)}
html[data-design=m2] .xb-list{animation:m2sheet .18s cubic-bezier(.2,.8,.2,1) both}
@media (prefers-reduced-motion:reduce){html[data-design=m2] *{animation:none!important;transition:none!important}}
/* the lane header: the title had no margin */
html[data-design=m2] .lane-h{padding:0 10px 0 12px}
html[data-design=m2] .lane .rows,html[data-design=m2] .lane .list{padding:0}
/* the wallets sheet: one line about the account, the backup warning when due — the vault lecture goes */
html[data-design=m2] .modal #w-vault{display:none!important}
html[data-design=m2] .modal[data-vault-mode=readonly] #w-vault{display:block!important}
.lane-more{display:block;width:calc(100% - 24px);margin:12px;white-space:normal}
html[data-design=m2] .modal .notice{font-size:12.5px!important;line-height:1.5!important;padding:4px 0 4px 12px!important;margin-bottom:10px}
html[data-design=m2] .modal #w-privy{color:var(--sub)!important} html[data-design=m2] .modal #w-privy b{color:var(--text)}
html[data-design=m2] .modal #w-notice .btn{height:30px;padding:0 12px;font-size:12px;border-radius:999px;margin-left:8px}
/* pass 11b: a shorter token header on phones so the ticket lands on the first screen */
@media (max-width:720px){
html[data-design=m2] .th{gap:6px 10px;padding:8px 0 8px!important}
html[data-design=m2] .th .tile,html[data-design=m2] .th .av{width:40px!important;height:40px!important}
html[data-design=m2] .th .sym,html[data-design=m2] .th h1{font-size:17px!important}
html[data-design=m2] .th .mcw{flex:0 0 auto;order:0;margin-left:auto}
html[data-design=m2] .th .mc,html[data-design=m2] .th .price,html[data-design=m2] .th .big{font-size:22px!important}
html[data-design=m2] .th .stats{gap:12px;order:5} html[data-design=m2] .th .st .k{font-size:9px} html[data-design=m2] .th .st .v{font-size:12px}
html[data-design=m2] .th .pools{display:none}
html[data-design=m2] .charthost .ttl{font-size:10.5px;padding:4px 8px;line-height:1.35;max-width:70%}
html[data-design=m2] .cbar{padding:4px 0} html[data-design=m2] .cfoot{height:34px;font-size:11px}
html[data-design=m2] .wl:has(> .wl-t){display:none!important}
}
/* bubblemap window: sizes that do not depend on the chart box having a definite height */
html[data-design=m2] .atlas{top:20px;left:50%;transform:translateX(-50%);width:min(960px,94%);height:min(600px,72vh);min-height:420px}
html[data-design=m2] .atlas iframe{min-height:320px}
@media (max-width:1100px){html[data-design=m2] .atlas{top:8px;width:96%;height:70vh;min-height:360px}}

/* ═══ pass 12: checkboxes keep their shape in dialogs; the wallet page as a trader card ═══ */
html[data-design=m2] .dlg input:not([type=checkbox]):not([type=radio]){border-radius:var(--r-sm);height:40px}
html[data-design=m2] .dlg input[type=checkbox],html[data-design=m2] .tfa-ok input{appearance:none;-webkit-appearance:none;width:20px;height:20px;border-radius:6px;border:1.5px solid var(--line-2);background:var(--card);display:inline-grid;place-items:center;cursor:pointer;flex:none;padding:0;font-family:inherit}
html[data-design=m2] .dlg input[type=checkbox]:checked,html[data-design=m2] .tfa-ok input:checked{background:var(--accent)!important;border-color:var(--accent)!important}
html[data-design=m2] .dlg input[type=checkbox]:checked::after,html[data-design=m2] .tfa-ok input:checked::after{content:"";width:10px;height:6px;border:2.5px solid var(--on-accent);border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
html[data-design=m2] .tfa-ok{gap:10px;font-size:13.5px;padding:4px 0}
/* wallet page */
html[data-design=m2] .page:has(> .hd){max-width:1400px;margin:0 auto;padding:18px 20px 60px}
html[data-design=m2] .page .hd{align-items:flex-start;gap:16px;padding:18px 20px;border:1px solid var(--line);border-radius:18px;background:var(--panel);margin-bottom:14px;flex-wrap:wrap}
html[data-design=m2] .page .hd .av{width:56px;height:56px;border-radius:16px}
html[data-design=m2] .page .hd h1{font-family:var(--mono);font-size:20px;font-weight:600;letter-spacing:-.01em;font-style:normal;text-transform:none}
html[data-design=m2] .page .hd .meta{margin-top:8px;gap:8px 14px;font-family:var(--mono);font-size:11.5px}
html[data-design=m2] .page .hd .meta .mono{text-transform:none;letter-spacing:0;font-size:11px}
html[data-design=m2] .page .hd .meta .scan{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 9px;border-radius:999px;background:var(--card);border:1px solid var(--line)} html[data-design=m2] .page .hd .meta .scan.done{color:var(--accent)}
html[data-design=m2] .page .hd .r{gap:8px;align-self:center}
html[data-design=m2] .page .seg{border-radius:999px;height:36px;padding:3px;gap:2px;background:var(--card);border-color:var(--line)} html[data-design=m2] .page .seg button{border-radius:999px;padding:0 12px;font-weight:600} html[data-design=m2] .page .seg button.on{background:var(--raised);color:var(--text);box-shadow:inset 0 0 0 1px var(--line-2)}
html[data-design=m2] .page .btn{height:36px;border-radius:999px;background:var(--card);border-color:var(--line)} html[data-design=m2] .page .btn.on{background:var(--accent)!important;color:var(--on-accent)!important;border-color:var(--accent)!important}
html[data-design=m2] .page .chains .pill{border-radius:999px;height:36px}
html[data-design=m2] .page .grid{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,.9fr);gap:12px}
html[data-design=m2] .page .card{border-radius:18px;padding:18px 20px;background:var(--panel)}
html[data-design=m2] .page .card h3{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);font-weight:600;margin-bottom:12px} html[data-design=m2] .page .card h3 .r{font-family:var(--mono);text-transform:none;letter-spacing:0}
html[data-design=m2] .page div.big{display:grid;grid-template-columns:1fr auto;gap:12px;padding:0 0 14px;border-bottom:1px solid var(--line)}
html[data-design=m2] .page .big .v{font-family:var(--mono);font-size:40px;font-weight:600;letter-spacing:-.04em;line-height:1} html[data-design=m2] .page .big .v small{font-family:var(--mono);font-size:14px;margin-left:8px}
html[data-design=m2] .page .big .k{font-family:var(--mono);font-size:11px;color:var(--sub);margin-top:8px;letter-spacing:.02em} html[data-design=m2] .page .big .k b{font-family:var(--mono)}
html[data-design=m2] .page .big .wr .v{font-size:30px}
html[data-design=m2] .page .cal{margin-top:12px}
html[data-design=m2] .page .cal-nav{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase} html[data-design=m2] .page .cal-nav button{width:26px;height:26px;border:1px solid var(--line);border-radius:999px;font-size:13px;background:var(--card)}
html[data-design=m2] .page .cal-grid{gap:4px;margin-top:10px}
html[data-design=m2] .page .cal-d{height:38px;border-radius:8px;background:var(--card);border:1px solid var(--hairline);font-family:var(--mono)} html[data-design=m2] .page .cal-d.e{background:transparent;border-color:transparent} html[data-design=m2] .page .cal-d.today{outline:0;border-color:var(--accent-line)}
html[data-design=m2] .page .cal-f{font-family:var(--mono);font-size:11px}
html[data-design=m2] .page .kv{font-family:var(--mono);font-size:12px;gap:0} html[data-design=m2] .page .kv span,html[data-design=m2] .page .kv b{padding:7px 0;border-bottom:1px solid var(--hairline)} html[data-design=m2] .page .kv span{font-family:var(--font);color:var(--sub)}
html[data-design=m2] .page .ph{font-family:var(--mono);font-size:11.5px;gap:8px 14px} html[data-design=m2] .page .ph b{font-family:var(--mono)}
html[data-design=m2] .page .dist{font-family:var(--mono);font-size:11.5px;gap:8px 10px} html[data-design=m2] .page .dist .dot{width:7px;height:7px}
html[data-design=m2] .page .card .bar{height:8px;border-radius:999px;background:var(--card)}
html[data-design=m2] .page .tabs{gap:18px;height:44px;margin:4px 0 0;padding:0 4px} html[data-design=m2] .page .tabs button{padding:0;height:44px;border-bottom:2px solid transparent;font-weight:500} html[data-design=m2] .page .tabs button.on{color:var(--text);border-bottom-color:var(--accent)} html[data-design=m2] .page .tabs .n{font-family:var(--mono);color:var(--accent);background:transparent;border:1px solid var(--accent-line);border-radius:999px;padding:0 6px}
html[data-design=m2] .page th{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);background:var(--bg)} html[data-design=m2] .page td{font-family:var(--mono);font-size:12.5px;height:46px;border-color:var(--hairline)}
html[data-design=m2] .page .tk{font-family:var(--font)} html[data-design=m2] .page .tk img,html[data-design=m2] .page .tk .ini{width:26px;height:26px;border-radius:8px}
html[data-design=m2] .page .side{border-radius:999px;padding:2px 8px}
html[data-design=m2] .page .empty{padding:40px;border:1px dashed var(--line-2);border-radius:16px;margin-top:10px;font-size:13px;color:var(--sub)}
@media (max-width:1100px){html[data-design=m2] .page .grid{grid-template-columns:1fr}html[data-design=m2] .page .hd .r{width:100%;flex-wrap:wrap}}
@media (max-width:720px){html[data-design=m2] .page:has(> .hd){padding:12px 12px 60px}html[data-design=m2] .page .hd{padding:14px}html[data-design=m2] .page .big .v{font-size:30px}html[data-design=m2] .page .big .wr .v{font-size:24px}html[data-design=m2] .page .tabs{overflow-x:auto;scrollbar-width:none}html[data-design=m2] .page #panel{overflow-x:auto}}

/* ═══ pass 13: breakpoints aligned with the pages (they stack at 1100, m2's phone block sat at 720) ═══ */
@media (max-width:1100px){
  html[data-design=m2] .lane{padding:0!important;margin:0!important;border-right:0!important}
  html[data-design=m2] .lane-h{height:40px}
  html[data-design=m2] .wal{border-right:0;border-bottom:1px solid var(--line)}
  html[data-design=m2] .wal-h,html[data-design=m2] .stats-h{height:auto;flex-wrap:wrap;padding:10px 12px;gap:8px}
  html[data-design=m2] .wal-h .r,html[data-design=m2] .stats-h .r{flex-wrap:wrap;gap:6px}
  html[data-design=m2] .tabs{height:auto;flex-wrap:wrap;gap:6px 12px;padding:10px 12px}
  html[data-design=m2] .tabs .search{width:100%;order:9}
  html[data-design=m2] .wrap:not(:has(> .left)){display:block!important;padding-left:12px;padding-right:12px}
}
/* the security page's set-up button, back to a pill (the wallet stat block uses div.big) */
html[data-design=m2] .page button.big{display:inline-flex;align-items:center;justify-content:center;padding:0 22px;border-bottom:0;gap:0}
/* the wallet page nav search is hidden in m2: the spotlight takes over; the page's own #kw handlers stay for the legacy design */

/* ═══ pass 14 (QA): phone tab bar everywhere, opaque footer, fixed nav on phones, bubblemap window on the body ═══ */
html[data-design=m2] #m2-tabs{display:none}
@media (max-width:900px){
  html[data-design=m2] footer.foot{background:var(--panel)!important;backdrop-filter:blur(12px);border-top:1px solid var(--line)}
  html[data-design=m2] #m2-tabs{position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));height:56px;background:var(--panel);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
  html[data-design=m2] #m2-tabs a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--sub);text-decoration:none;font:500 10.5px/1 var(--font)}
  html[data-design=m2] #m2-tabs a svg{width:20px;height:20px} html[data-design=m2] #m2-tabs a.on{color:var(--accent)}
  html[data-design=m2] body:has(#m2-tabs){padding-bottom:64px}
  html[data-design=m2] .page:has(> .hd),html[data-design=m2] main.rm,html[data-design=m2] .bgc,html[data-design=m2] .tp:has(> .tp-l){padding-bottom:84px!important}
}
@media (max-width:720px){
  html[data-design=m2] .nav{position:sticky!important;top:0;z-index:50;background:var(--bg)!important}
  html[data-design=m2] body{overflow-x:hidden}
}
html[data-design=m2] .atlas{position:fixed!important;inset:auto;left:0;right:0;top:80px;margin:0 auto;transform:none!important;width:min(960px,94vw);height:min(600px,72vh);min-height:360px;z-index:120;animation:m2fade .22s ease both}
@keyframes m2fade{from{opacity:0}to{opacity:1}}
@media (max-width:1100px){html[data-design=m2] .atlas{top:60px;width:96vw;height:70vh;min-height:360px}}
html[data-design=m2] .right .trade .flow .k{padding:0 2px}

/* ── pass 15: light background + spotlight rows ── */
html[data-design=m2][data-bg=light] .m2-look-bg{background:rgba(20,20,30,.35)}
html[data-design=m2][data-bg=light] img.gs-cl,html[data-design=m2][data-bg=light] .nav .logo img{filter:none}
html[data-design=m2][data-bg=light] .gs-box,html[data-design=m2][data-bg=light] .m2-look-s{border-color:var(--line-2);box-shadow:0 30px 80px rgba(20,20,30,.22)}
html[data-design=m2][data-bg=light] .gs-buy,html[data-design=m2][data-bg=light] .m2-prev-buy{color:var(--on-accent)}
html[data-design=m2][data-bg=light] .m2-dot.on{border-color:#fff}
html[data-design=m2][data-bg=light] ::selection{background:var(--accent-bg)}
/* the name line never runs into the numbers: it clips, and the "recent" mark lives on the third line */
html[data-design=m2] #gs .gs-l1{overflow:hidden;white-space:nowrap}
html[data-design=m2] #gs .gs-l3 .rc{display:inline-flex;align-items:center;gap:3px;color:var(--sub);font-style:normal;font-family:var(--mono);font-size:10.5px;height:16px;padding:0 6px;border:1px solid var(--line-2);border-radius:4px}
html[data-design=m2] #gs .gs-l3 .rc svg{width:11px;height:11px}

/* ── pass 16: who is watching ── */
html[data-design=m2] .th .l2 .eye{height:22px;padding:0 8px 0 6px;border-radius:999px;border:1px solid var(--line-2);font-family:var(--mono);font-size:11px;color:var(--sub-2)}
html[data-design=m2] .th .l2 .eye b{font-size:11.5px} html[data-design=m2] .th .l2 .eye.hot{border-color:var(--accent-line);background:var(--accent-bg)} html[data-design=m2] .th .l2 .eye.hot b{color:var(--accent)}

/* X posts on the chart: a round avatar with the X mark; the mark alone when the picture is missing */
html[data-design=m2] .thm.x{width:26px;height:26px;border-radius:50%;background:#000 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M17.5 3h3l-7.2 8.2L22 21h-6.6l-5.2-6.8L4.2 21h-3l7.7-8.8L1 3h6.8l4.7 6.2L17.5 3z'/%3E%3C/svg%3E") center/12px no-repeat;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.5)}
html[data-design=m2] .thm.x .a{border-radius:50%}

html[data-design=m2] .th .l2 .eye{width:auto;height:24px;padding:0 9px 0 7px;gap:5px}
html[data-design=m2] .vw-pop{border-radius:var(--r);font-family:var(--font)} html[data-design=m2] .vw-r b,html[data-design=m2] .vw-h b{font-family:var(--mono)}

/* laptops: the menu keeps its icons, only the current page keeps its name — eight items plus the $DART chip never fit 1280–1560px with labels */
@media (max-width:1720px) and (min-width:721px){html[data-design=m2] .nav .menu a span{display:none}html[data-design=m2] .nav .menu a{padding:0 11px;gap:0}html[data-design=m2] .nav .menu a.on span{display:inline;margin-left:8px}}

/* ═══ pass 17 (rework): dart tokens; secondary controls lose their frames (hover is the affordance, primary
   actions keep their fill); a thin status line; honest metric chips; the trade card's stages ═══ */
html[data-design=m2]{--m-fast:.14s;--m-mid:.22s;--m-slow:.36s;--m-ease:cubic-bezier(.2,.8,.2,1);--m-out:cubic-bezier(.16,1,.3,1)}
/* the top line: no capsules on language, coin, chain, bell, wallets, appearance, account — a soft fill on hover */
html[data-design=m2] .nav .r{gap:2px}
html[data-design=m2] .nav .r > *:not(.login):not(.acct),html[data-design=m2] .nav .r #open-wallets,html[data-design=m2] .nav .r .ab:not(.login),html[data-design=m2] .nav .r .dd .pill{border-color:transparent!important;background:transparent!important;box-shadow:none!important;transition:background-color var(--m-fast) ease,color var(--m-fast) ease}
html[data-design=m2] .nav .r > *:not(.login):not(.acct):hover,html[data-design=m2] .nav .r #open-wallets:hover,html[data-design=m2] .nav .r .ab:not(.login):hover,html[data-design=m2] .nav .r .dd.open,html[data-design=m2] .nav .r > *:focus-visible{background:var(--hover)!important}
html[data-design=m2] .nav .r .ibtn{color:var(--sub)} html[data-design=m2] .nav .r .ibtn:hover{color:var(--text)}
html[data-design=m2] .nav .r .ibtn.on{color:var(--accent)}
html[data-design=m2] .nav .menu a.on{border-color:transparent!important;background:var(--hover)!important}
html[data-design=m2] .nav .r #open-wallets{padding:0 10px 0 8px!important}
/* the board bar and the lane headers: amount, mode, search, bell, filter as quiet controls */
html[data-design=m2] .tbar{padding:8px 20px;gap:10px}
html[data-design=m2] .tbar .amt,html[data-design=m2] .lane-h .lamt{background:transparent!important;border-color:transparent!important;transition:border-color var(--m-fast) ease,background-color var(--m-fast) ease}
html[data-design=m2] .tbar .amt:hover,html[data-design=m2] .lane-h .lamt:hover{background:var(--hover)!important}
html[data-design=m2] .tbar .amt:focus-within,html[data-design=m2] .lane-h .lamt:focus-within{border-color:var(--accent-line)!important;background:var(--panel-2)!important}
html[data-design=m2] .tbar #state,html[data-design=m2] .tbar #wcount,html[data-design=m2] .tbar #open-filter{background:transparent!important;border-color:transparent!important}
html[data-design=m2] .tbar #wcount:hover,html[data-design=m2] .tbar #open-filter:hover{background:var(--hover)!important}
html[data-design=m2] .tbar #open-filter{height:32px;padding:0 10px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
html[data-design=m2] .lane-h{gap:8px}
html[data-design=m2] .lane-h .tools{gap:2px;padding-right:2px}
html[data-design=m2] .lane-h .ib{border-color:transparent!important;background:transparent!important;color:var(--sub);transition:background-color var(--m-fast) ease,color var(--m-fast) ease}
html[data-design=m2] .lane-h .ib:hover{background:var(--hover)!important;color:var(--text)}
html[data-design=m2] .lane-h .ib.on{color:var(--accent)!important;background:var(--accent-bg)!important}
html[data-design=m2] .lane-h .cnt,html[data-design=m2] .lane-h .n{border:0!important;background:var(--accent-bg)!important}
html[data-design=m2] .lane-h .kw{border-radius:999px}
/* rows: chips are text with an icon (no box), the pills a quiet fill without a frame */
html[data-design=m2] .lane .row .risk{min-height:22px;opacity:1}
html[data-design=m2] .lane .row .risk .rp{background:transparent!important;border:0!important;padding:0 6px 0 0;gap:4px}
html[data-design=m2] .lane .row .risk .rp.z{color:var(--dim)}
html[data-design=m2] .lane .row .risk .rp.z em{font-style:normal;color:var(--dim);margin-left:1px;font-size:10.5px}
html[data-design=m2] .lane .row .risk .rp svg{opacity:.75}
html[data-design=m2] .lane .row .pill2,html[data-design=m2] .lane .row .l2 .pill2,html[data-design=m2] .lane .row .xh,html[data-design=m2] .lane .row .l3 a.xh,html[data-design=m2] .lane .row .l3 .xf{border-color:transparent!important;background:var(--chip)!important}
html[data-design=m2] .lane .row .ca{border-color:transparent!important;color:var(--dim)}
html[data-design=m2] .lane .row .ca:hover{color:var(--sub-2)}
/* live values: a moved market cap tints and settles (no glow flash); new rows and rank moves glide (board.js FLIP) */
html[data-design=m2] .rgt .kv b.mc.up{animation:m2up 1.1s var(--m-out)} html[data-design=m2] .rgt .kv b.mc.down{animation:m2dn 1.1s var(--m-out)}
@keyframes m2up{0%{color:var(--green-2)}100%{}} @keyframes m2dn{0%{color:var(--red-2)}100%{}}
html[data-design=m2] .lane .row.flash{background:var(--accent-bg)!important;transition:none!important}
html[data-design=m2] .lane .row.glow{transition:background-color 1.1s var(--m-out)!important}
/* the status line: thin, secondary, no chips; a price the chain does not quote is left out instead of "—" */
html[data-design=m2] footer.foot{height:28px;font-size:11px;border-top-color:var(--hairline)!important;gap:10px;color:var(--sub)}
html[data-design=m2] footer.foot .px,html[data-design=m2] footer.foot .bal,html[data-design=m2] footer.foot .gas,html[data-design=m2] footer.foot .wal,html[data-design=m2] footer.foot #ft-wal{background:transparent!important;border:0!important;height:22px!important;padding:0 6px!important;border-radius:6px;font-size:11px}
html[data-design=m2] footer.foot .px:not(.on){display:none!important}
html[data-design=m2] footer.foot .r{gap:4px}
html[data-design=m2] footer.foot .giga{font-size:14px}
html[data-design=m2] footer.foot .px .ci,html[data-design=m2] footer.foot .px .ci img{width:12px;height:12px}
@media (max-width:900px){html[data-design=m2] footer.foot{height:52px}}
/* fomo's sharp-move pops stay under an open sheet or dialog instead of covering its tabs */
html[data-design=m2] body:has(.modal.show,.dlg-wrap.show,#m2-look,#gs.show) .mal-stack{z-index:40}
/* Appearance → Sounds */
html[data-design=m2] .m2-snd{grid-template-columns:110px auto minmax(80px,1fr) auto}
html[data-design=m2] .m2-vol{width:100%;accent-color:var(--accent)}
html[data-design=m2] .m2-test{height:30px;padding:0 12px;border-radius:999px;border:0;background:var(--chip);color:var(--sub-2);font-size:12px;cursor:pointer}
html[data-design=m2] .m2-test:hover{color:var(--text)}
/* the Customize panel's preset rows: the active one carries the accent */
html[data-design=m2] .pd-c .btn.on{color:var(--accent)!important;border-color:var(--accent-line)!important;background:var(--accent-bg)!important}
@media (prefers-reduced-motion:reduce){html[data-design=m2] .rgt .kv b.mc.up,html[data-design=m2] .rgt .kv b.mc.down{animation:none}}
/* fomo's sharp-move pops: the bottom-right corner above the status line, never over the page's own controls */
html[data-design=m2] .mal-stack{top:auto!important;bottom:40px;left:auto!important;right:16px;transform:none!important;width:380px;flex-direction:column-reverse}
@media (max-width:900px){html[data-design=m2] .mal-stack{bottom:70px;right:8px;width:calc(100vw - 16px)}}
/* a metric that does not fit the line leaves it whole (it wraps out of the clipped first line) instead of being cut in half */
html[data-design=m2] .lane .row .risk{flex-wrap:wrap;height:22px;overflow:hidden;align-content:flex-start}
html[data-design=m2] .m2-vol{appearance:none;-webkit-appearance:none;height:4px;border-radius:999px;background:var(--line-2)!important;border:0;padding:0;min-width:80px;cursor:pointer}
html[data-design=m2] .m2-vol::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent);border:0}
html[data-design=m2] .m2-vol::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--accent);border:0}
/* sheets leave the way they came */
html[data-design=m2] .modal.closing{animation:m2out .17s ease forwards} html[data-design=m2] .modal.closing .fm{animation:m2sheetout .17s ease forwards}
@keyframes m2out{to{opacity:0}} @keyframes m2sheetout{to{opacity:0;transform:translateY(10px) scale(.985)}}
/* self-test: verdicts as tinted words (no outlined boxes), groups on hairlines */
html[data-design=m2] .page:has(> .bar #run) .grp{border-color:var(--line);border-radius:var(--r)}
html[data-design=m2] .page:has(> .bar #run) .grp > h2{background:transparent;border-bottom-color:var(--hairline);padding:12px 14px}
html[data-design=m2] .page:has(> .bar #run) .grp > h2 .n{background:transparent!important;border:0!important;color:var(--dim)}
html[data-design=m2] .page:has(> .bar #run) .row{padding:11px 14px;border-bottom-color:var(--hairline)}
html[data-design=m2] .page:has(> .bar #run) .st{border:0;border-radius:999px;padding:3px 8px;background:var(--chip)}
html[data-design=m2] .page:has(> .bar #run) .st.pass{background:var(--green-bg)} html[data-design=m2] .page:has(> .bar #run) .st.fail{background:var(--red-bg)} html[data-design=m2] .page:has(> .bar #run) .st.warn{background:var(--yellow-bg)}
/* portfolio's tab toggles: words that light up, not outlined capsules */
html[data-design=m2] .tabs .r label:not(.search){border-color:transparent!important;background:transparent!important;transition:background-color var(--m-fast) ease,color var(--m-fast) ease}
html[data-design=m2] .tabs .r label:not(.search):hover{background:var(--hover)!important}
html[data-design=m2] .tabs .r label:not(.search):has(input:checked){color:var(--accent);background:var(--accent-bg)!important}
html[data-design=m2] .tabs .r .search{border-color:transparent!important;background:var(--chip)!important}
html[data-design=m2] .tabs .r .sellp{border-color:transparent!important;background:transparent!important}
/* the wallet page never runs wider than the screen: its flex column and grid tracks may shrink below their content */
html[data-design=m2] .page:has(> .hd){min-width:0;width:100%;box-sizing:border-box}
html[data-design=m2] .page:has(> .hd) .hd > *,html[data-design=m2] .page:has(> .hd) .card{min-width:0}
html[data-design=m2] .page:has(> .hd) .hd h1{overflow:hidden;text-overflow:ellipsis}
html[data-design=m2] .page:has(> .hd) .hd .meta .scan{white-space:normal;flex-wrap:wrap}
@media (max-width:1100px){html[data-design=m2] .page .grid{grid-template-columns:minmax(0,1fr)!important}html[data-design=m2] .page .cal-grid{grid-template-columns:repeat(7,minmax(0,1fr))}}
/* tablets: the top line keeps its controls inside the screen (the coin's 24h change goes first) */
@media (max-width:900px){html[data-design=m2] .nav{padding:0 12px}html[data-design=m2] .nav .logo{margin-right:10px}html[data-design=m2] .nav .r .mt-coin .ch{display:none}}
/* the token page's chain pill: logo + chain name at the nav's size, a nodes glyph saying it opens RPC settings */
html[data-design=m2] #chain-pill{gap:7px;padding:0 10px!important;font-size:13px;font-weight:600;color:var(--text)}
html[data-design=m2] #chain-pill .cnm{font-size:13px;font-weight:600;text-transform:none;letter-spacing:0}
html[data-design=m2] #chain-pill .c img{width:18px;height:18px;display:block}
html[data-design=m2] #chain-pill .cp-i{width:14px;height:14px;color:var(--dim);transition:color var(--m-fast) ease}
html[data-design=m2] #chain-pill:hover .cp-i,html[data-design=m2] #chain-pill:focus-visible .cp-i{color:var(--text)}
@media (max-width:720px){html[data-design=m2] #chain-pill .cnm,html[data-design=m2] #chain-pill .cp-i{display:none}html[data-design=m2] .nav .r .pill#chain-pill#chain-pill{display:inline-flex!important;padding:0 8px!important}}   /* phones keep the chain as its logo (the only way to RPC settings there) */
@media (max-width:900px){html[data-design=m2] #chain-pill .cp-i{display:none}}
html[data-design=m2] main.tr{width:100%;box-sizing:border-box}   /* a centred flex child shrink-wraps: it widened as the rows arrived and moved the whole page (load CLS 0.4) */
/* Alpha: the source chips and the chain switch keep their room from the first paint (they filled in and pushed the table down) */
html[data-design=m2] main.tr #srcs{min-height:26px}
@media (max-width:760px){html[data-design=m2] main.tr #srcs{min-height:58px}html[data-design=m2] main.tr .tr-head .r{flex-basis:100%;margin-left:0;min-height:58px;align-content:flex-start}}
/* Analytics: the same shrink-wrapped centred column */
html[data-design=m2] main.an{width:100%;box-sizing:border-box}
@media (max-width:1100px){html[data-design=m2] main.tr #board{min-height:110vh}}   /* one column: the side lists wait below the fold instead of being pushed down by the arriving table */
html[data-design=m2] main.tr #tiles{min-height:77px} @media (max-width:1100px){html[data-design=m2] main.tr #tiles{min-height:162px}} @media (max-width:760px){html[data-design=m2] main.tr #tiles{min-height:332px}}   /* seven weight tiles: 1, 2 or 4 rows of 77px */
html[data-design=m2] main.an #today{min-height:73px} html[data-design=m2] main.an #big{min-height:86px} @media (max-width:900px){html[data-design=m2] main.an #today{min-height:254px}html[data-design=m2] main.an #big{min-height:144px}}   /* the today strip and the four headline figures hold their final heights (border-box) before the tape answers */
@media (max-width:1100px){html[data-design=m2] .top > .wal .wal-t{height:317px;flex:none;overflow:auto}html[data-design=m2] .top > .stats #actions{min-height:174px}} @media (max-width:760px){html[data-design=m2] .top > .wal .wal-t{height:285px}html[data-design=m2] .top > .stats #actions{min-height:162px}}   /* portfolio stacked: the wallet list is a fixed window (it scrolls; its loading skeleton was taller than the empty state) and the action grid holds its height while the vault answers */
/* wallet page: the controls own the header's second line from the first paint (they used to sit right, then wrap
   under the address once the meta line filled in), the identity block and the calendar hold their heights */
html[data-design=m2] .page:has(> .hd) .hd > .r{flex-basis:100%;margin-left:0;justify-content:flex-start}
html[data-design=m2] .page:has(> .hd) .hd > div:not(.av):not(.r){flex:1;min-width:0}
html[data-design=m2] .page:has(> .hd) #cal-grid{min-height:248px}
html[data-design=m2] .page:has(> .hd) #chains{min-width:262px;min-height:36px}   /* the three chain buttons */
@media (max-width:1100px){html[data-design=m2] .page:has(> .hd) .hd > div:not(.av):not(.r){min-height:86px}}
@media (max-width:760px){html[data-design=m2] .page:has(> .hd) .hd > div:not(.av):not(.r){flex-basis:100%;min-height:131px}html[data-design=m2] .page:has(> .hd) #cal-grid{min-height:280px}html[data-design=m2] .page:has(> .hd) #chains{min-width:0;width:100%}}
html[data-design=m2] .page:has(> .hd) .grid > .card:first-child .big > div:first-child{min-height:62px} html[data-design=m2] .page:has(> .hd) .grid > .card:first-child .cal{min-height:306px}   /* PnL figure + calendar: their final heights from the first paint */
html[data-design=m2] .page:has(> .bar #run) .st.na,html[data-design=m2] .page:has(> .bar #run) .st.info{background:var(--chip);color:var(--sub)}
html[data-design=m2] .lane .row .pill2 .cr,.lane .row .pill2 .cr{font-size:inherit;font-weight:500;opacity:.7}
.lane .row .pill2 .cr .crs{display:none} @media (max-width:720px){.lane .row .pill2 .cr .crw{display:none}.lane .row .pill2 .cr .crs{display:inline}}   /* phones: "Tax 1.17% · cr 0.17%" keeps the quote pill on the line */
/* Customize → Extra → Volume: a visible track, and the slider shrinks with the sheet on phones */
html[data-design=m2] input[type=range][data-sndvol]{appearance:none;-webkit-appearance:none;height:4px;border-radius:999px;background:var(--line-2)!important;border:0;padding:0;min-width:80px;cursor:pointer}
html[data-design=m2] input[type=range][data-sndvol]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent);border:0}
html[data-design=m2] input[type=range][data-sndvol]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--accent);border:0}
@media (max-width:720px){html[data-design=m2] .pd-c{max-width:100%;width:100%}html[data-design=m2] .pd-c .pd-slide{width:100%}}
/* token page: the chart bar, the 5m/1h/24h strip and the header hold their final heights while the token loads
   (the bar wrapped to a second line as its controls arrived and dropped the chart 36px) */
@media (min-width:1101px){html[data-design=m2] .chartp > .cbar{min-height:79px;align-content:flex-start}}
html[data-design=m2] .right #chg:empty{min-height:59px}
@media (max-width:720px){html[data-design=m2] .wrap .th{min-height:133px}}
html[data-design=m2] .right .trade #flow:empty{min-height:84px}
@media (max-width:760px){html[data-design=m2] .stats-h .r{flex-basis:100%;order:5;margin-left:0}html[data-design=m2] .stats-h #upd{margin-left:auto}}   /* portfolio: the PnL header keeps one arrangement from the first paint (the period switch and the "updated" note traded lines) */
@media (max-width:1100px){html[data-design=m2] .top > .stats #bal{min-height:266px}} @media (max-width:760px){html[data-design=m2] .top > .stats #bal{min-height:226px}html[data-design=m2] .top > .stats .stats-h{min-height:118px}}   /* the balance block and its header at their filled heights */
@media (max-width:1400px) and (min-width:1101px){html[data-design=m2] .nav .menu a{padding:0 8px}html[data-design=m2] .nav .logo{margin-right:14px}html[data-design=m2] .nav .r .mt-coin .ch{display:none}}   /* ten menu icons + the cluster fit a 1280 laptop */
@media (max-width:1250px) and (min-width:1101px){html[data-design=m2] .nav .menu a.on span{display:none!important}html[data-design=m2] .nav .r .mt-coin .px{display:none}html[data-design=m2] .nav .menu a{padding:0 7px}}   /* 1101–1250: the current page keeps its icon only, the coin shows its mark */

/* the row buy: chain glyph + amount, centred with even padding (the unit word and the 16/12 padding pushed it off-centre) */
html[data-design=m2] .lane .row .buyw .buy{padding:0 15px!important;justify-content:center;gap:6px;min-width:84px!important}
html[data-design=m2] .lane .row .buyw .buy .cg{width:14px;height:14px;flex:none;opacity:.9}
html[data-design=m2] .lane .row .buyw .buy .txt{font-weight:700;letter-spacing:-.01em}
html[data-design=m2] .lane .row .buyw .buy.alt{min-width:0!important}
@media (max-width:720px){html[data-design=m2] .lane .row .buyw .buy{padding:0 12px!important;min-width:72px!important}}
/* the status line's platform figures (footstats.js): wallets · today's volume · gas, as quiet text; a strip bottom-right on pages without one */
html[data-design=m2] .fs{display:inline-flex;align-items:center;gap:10px;color:var(--sub);font:500 11px var(--mono);font-variant-numeric:tabular-nums}
html[data-design=m2] .fs .fs-i{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
html[data-design=m2] .fs svg{width:12px;height:12px;opacity:.7}
html[data-design=m2] .fs-float{position:fixed;right:14px;bottom:10px;z-index:30;padding:5px 10px;border-radius:999px;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(8px);border:1px solid var(--hairline)}
@media (max-width:900px){html[data-design=m2] .fs-float{display:none!important}html[data-design=m2] footer.foot .fs{display:none}}

/* footer: the live-presence dot beside the online count */
.fs-live{position:relative}.fs-live .fs-dot{width:6px;height:6px;border-radius:50%;background:var(--green,#3ddc84);box-shadow:0 0 0 0 rgba(61,220,132,.5);animation:fsPulse 2.4s ease-out infinite;margin-right:5px;display:inline-block}
@keyframes fsPulse{0%{box-shadow:0 0 0 0 rgba(61,220,132,.55)}70%{box-shadow:0 0 0 6px rgba(61,220,132,0)}100%{box-shadow:0 0 0 0 rgba(61,220,132,0)}}
@media (prefers-reduced-motion:reduce){.fs-live .fs-dot{animation:none}}