/* ═══════════════════════════════════════════════════════════════════════════════════════════════════════════
   motion · deck — the second design of the terminal (MOTION_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:'Instrument Serif',Georgia,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:italic;font-weight:400;font-size:28px;letter-spacing:-.01em}
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)}
html[data-design=m2] .nav .menu .m2-more{position:relative;display:inline-flex}
html[data-design=m2] .nav .menu .m2-more-b{width:38px;height:38px;border:0;border-radius:var(--r);background:transparent;color:var(--sub);display:grid;place-items:center;cursor:pointer}
html[data-design=m2] .nav .menu .m2-more-b svg{width:18px;height:18px} html[data-design=m2] .nav .menu .m2-more-b:hover{background:var(--hover);color:var(--text)}
html[data-design=m2] .nav .menu .m2-more-l{display:none;position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);min-width:180px;padding:6px;background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r);box-shadow:var(--shadow);z-index:60;flex-direction:column}
html[data-design=m2] .nav .menu .m2-more.open .m2-more-l{display:flex}
html[data-design=m2] .nav .menu .m2-more-l a{height:36px;padding:0 10px;border-radius:var(--r-sm);font-size:13px}
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:italic;font-weight:400;font-size:30px;letter-spacing:-.01em;text-transform:lowercase}
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)}
/* trade cards (buy, sell, position changes) in one place: top centre, under the nav — the owner was hunting for them bottom-left (2026-10-14) */
html[data-design=m2] .ntf-stack{top:64px!important;bottom:auto!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;align-items:center}
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 (motion'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{top:58px!important;bottom:auto!important;left:8px!important;right:8px!important;transform:none!important;width:auto!important;align-items:stretch}
}
@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: motion (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)}
/* the toast's entrance and exit are the kit's (.mk-toast / .mk-out, ui.js) — the deck no longer keeps its own copy */
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 .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 $MOTION 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): motion 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 */
/* market alerts sit with the trade cards, top centre (owner, 2026-10-14) — not in a corner of their own */
html[data-design=m2] .mal-stack{top:64px!important;bottom:auto!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;width:420px}
html[data-design=m2] .ntf-stack > .mal{width:100%;box-sizing:border-box}
@media (max-width:900px){html[data-design=m2] .mal-stack{top:58px!important;left:8px!important;right:8px!important;transform:none!important;width:auto}}
/* 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) */
/* the chart toolbar is ONE row (it used to reserve two: 79 px of empty band above the chart, owner 2026-10-14) — tools that do not fit scroll sideways */
@media (min-width:1101px){html[data-design=m2] .chartp > .cbar{min-height:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;align-content:normal} html[data-design=m2] .chartp > .cbar::-webkit-scrollbar{display:none} html[data-design=m2] .chartp > .cbar > *{flex:none}}
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}}

/* ═══ resize grips: a centred pill in its own gap, so it is obvious where to grab (token chart ↔ tape, trade panel,
   portfolio wallets ↔ tabs). Same drag code and saved sizes; the gap is the handle, the pill is the sign, the name
   shows on hover. Phones hide them (pass 10) ═══ */
html[data-design=m2] .gsplit{opacity:1!important;height:28px;background:transparent!important;cursor:row-resize;position:relative;flex:none;touch-action:none;z-index:6}
html[data-design=m2] .gsplit::after{content:"";position:absolute;left:50%;top:50%;width:36px;height:4px;transform:translate(-50%,-50%);border-radius:999px;background:var(--sub)!important;opacity:.55;transition:opacity .12s,background-color .12s,width .12s,height .12s}
html[data-design=m2] .gsplit:hover::after{opacity:1;background:var(--text)!important;width:44px}
html[data-design=m2] .gsplit.drag::after{opacity:1;background:var(--accent)!important;width:44px}
html[data-design=m2] .gsplit.v{height:auto;width:20px;cursor:col-resize}
html[data-design=m2] .gsplit.v::after{width:4px;height:36px}
html[data-design=m2] .gsplit.v:hover::after,html[data-design=m2] .gsplit.v.drag::after{width:4px;height:44px}
html[data-design=m2] .gsplit[data-grip]::before{content:attr(data-grip);position:absolute;left:50%;bottom:calc(50% + 9px);transform:translateX(-50%);padding:4px 9px;border-radius:7px;background:var(--raised);border:1px solid var(--line-2);box-shadow:var(--shadow);color:var(--text);font:500 11.5px/1.3 var(--font);letter-spacing:0;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .12s;z-index:40}
html[data-design=m2] .gsplit.v[data-grip]::before{left:auto;right:calc(50% + 9px);bottom:auto;top:50%;transform:translateY(-50%)}
html[data-design=m2] .gsplit[data-grip]:hover::before{opacity:1;transition-delay:.25s}
html[data-design=m2] .gsplit.drag::before,html[data-design=m2] body.resizing .gsplit::before,html[data-design=m2] body.resizing-x .gsplit::before{opacity:0!important}
/* the vertical grip's own column: 20px between 6px gaps (was 5px between 16px ones); the portfolio's row split the same */
@media (min-width:1101px){
  html[data-design=m2] .wrap:has(> #split-side){grid-template-columns:minmax(0,1fr) 20px var(--rightw,380px);column-gap:6px}
  html[data-design=m2] .wrap:has(> #split-top){grid-template-rows:var(--toph,minmax(0,1fr)) 28px minmax(0,1fr);row-gap:0}
}

/* ═══ post cards: fomo theses wear the X card in fomo purple; stacked and listed cards take their container's width ═══ */
html[data-design=m2] .xcard.xcard-fomo{border:1px solid rgba(139,92,246,.45)!important;border-top:3px solid #8b5cf6!important}
html[data-design=m2] .xcard.xcard-fomo .xc-v{color:#a78bfa}
html[data-design=m2] .xstack .xcard,html[data-design=m2] .xsl .xcard{width:auto!important}
html[data-design=m2] .xstack .xs-h{font-family:var(--mono);background:var(--raised)}
html[data-design=m2] .xcard .xc-tag{font-family:var(--mono)}
html[data-design=m2] .xcard .xc-h img.xc-fm{width:14px!important;height:14px!important;border-radius:4px!important;border:0!important;box-shadow:none!important;background:none}
/* one-row chart toolbar fits the 1440 layout: tighter buttons and separators between 1101 and 1600 px */
@media (min-width:1101px) and (max-width:1600px){html[data-design=m2] .chartp > .cbar button,html[data-design=m2] .chartp > .cbar .dd > button{padding:0 6px!important} html[data-design=m2] .chartp > .cbar .sep{margin:0!important}}

/* ═══ the token page's tables at GMGN's density: 40px rows, Space Grotesk with tabular figures (mono only for
   addresses), 12px plain-case headers, a quiet zebra and a hover row; a trade that just printed slides in at the top and
   flashes its side's colour once (reduced motion: the flash only). Same rows in Top Traders / Holders / Bundles ═══ */
html[data-design=m2] .tabsp .tbody table th{font:500 12px/1.2 var(--font)!important;letter-spacing:0!important;text-transform:none!important;color:var(--sub)!important;padding-top:9px;padding-bottom:9px}
html[data-design=m2] .tabsp .tbody table td{font-family:var(--font)!important;font-size:12.5px;font-variant-numeric:tabular-nums;height:40px;padding-top:0!important;padding-bottom:0!important;line-height:1.2}
html[data-design=m2] .tabsp .tbody table td.mono{font-family:var(--font)!important}
html[data-design=m2] .tabsp .tbody .tw .wa,html[data-design=m2] .tabsp .tbody .w a,html[data-design=m2] .tabsp .tbody td.mono .wa{font-family:var(--mono);font-size:12px;letter-spacing:-.01em}
html[data-design=m2] .tabsp .tbody .tw .wa.named{font-family:var(--font);font-size:12.5px}
html[data-design=m2] .tabsp .tbody tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--text) 1.6%,transparent)}
html[data-design=m2] .tabsp .tbody tbody tr:hover td{background:var(--hover)}
html[data-design=m2] .tabsp .tbody .side{background:transparent!important;padding:0!important;min-width:0!important;border-radius:0!important}
html[data-design=m2] .tape2 td.mc{color:var(--text)!important}
/* a trade that just printed: MK.arrive(row, 'up'|'down') — the slide (10 px, .9 s) and the side's colour
   (rgba(52,209,123,.22) / rgba(255,92,92,.22) over 1.4 s, the tapeBuy2 / tapeSell2 values) now live once, in
   motion-kit.css, with the kit's reduced-motion rule: the colour stays, the slide goes. The row keeps its
   own background through the flash — see the .tabsp tr.mk-arrive td rule in pass 18 below. */
/* phones: the tape kept its place under the callouts column (the column took the panel's whole height and left the
   tape 0 px tall) — the tape first at a readable height, the callouts under it */
@media (max-width:1100px){
  html[data-design=m2] .tabsp.side-on{flex:none!important;height:auto!important;max-height:none!important}
  html[data-design=m2] .tabsp.side-on > .tbody{flex:none;height:auto;min-height:320px;max-height:70vh;overflow:auto}
}

/* ═══ the token page's bottom block, header kept to two thin lines: tabs at 34px with the counts as small inline badges,
   the summary chips and the tape filters as ONE 28px line that never wraps (each value inline — "Dev 33.37%" — and a
   sideways scroll when it runs out), table header 30px. A wide block (≥1500px) takes the summary into the tabs row ═══ */
html[data-design=m2] .tabsp{container-type:inline-size}
html[data-design=m2] .tabsp > .tabs{height:34px!important;min-height:34px;flex-wrap:nowrap!important;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;gap:16px!important;padding:0 14px!important}
html[data-design=m2] .tabsp > .tabs::-webkit-scrollbar{display:none}
html[data-design=m2] .tabsp > .tabs button{height:34px!important;font-size:12.5px!important;flex:none}
html[data-design=m2] .tabsp > .tabs .n,html[data-design=m2] .tabsp > .tabs .cnt{height:16px;min-width:16px;padding:0 5px!important;font-size:10px!important;line-height:14px!important;display:inline-grid;place-items:center}
html[data-design=m2] .tabsp > .sub{height:28px;min-height:28px;padding:0 14px!important;gap:12px;flex-wrap:nowrap!important;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;white-space:nowrap;font-size:12px}
html[data-design=m2] .tabsp > .sub::-webkit-scrollbar{display:none}
html[data-design=m2] .tabsp > .sub > *{flex:none}
html[data-design=m2] .tabsp > .sub .m{display:inline-flex!important;flex-direction:row!important;align-items:baseline;gap:5px;white-space:nowrap}
html[data-design=m2] .tabsp > .sub .score svg{width:13px;height:13px}
html[data-design=m2] .tabsp > .sub .r{margin-left:auto;padding-left:14px;gap:2px}
html[data-design=m2] .tabsp > .sub .r button{height:22px;padding:0 7px!important;font-size:12px;border-radius:999px}
html[data-design=m2] .tabsp .tbody table thead th{height:30px;padding-top:0!important;padding-bottom:0!important}
@container (min-width:1500px){
  html[data-design=m2] .tabsp:not(.side-on){display:grid!important;grid-template-columns:auto minmax(0,1fr);grid-template-rows:34px minmax(0,1fr)}
  html[data-design=m2] .tabsp:not(.side-on) > .tabs{grid-column:1;border-bottom:1px solid var(--line)}
  html[data-design=m2] .tabsp:not(.side-on) > .sub{grid-column:2;height:34px;border-bottom:1px solid var(--line)}
  html[data-design=m2] .tabsp:not(.side-on) > :not(.tabs):not(.sub){grid-column:1 / -1}
}

/* ═══ the right column, flat like the Trenches board: its sections sit on the page background, spacing and one
   hairline between them, no boxes in boxes. Pills and inputs keep only their own soft fill (no outline), headings are
   small and quiet, the Security Audit is a clean label/value grid. Every control and figure stays where it was ═══ */
html[data-design=m2] .right{gap:0!important}
html[data-design=m2] .right > .panel{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important}
html[data-design=m2] .right > .panel + .panel{border-top:1px solid var(--line)!important}
html[data-design=m2] .right > .panel.chg{padding:4px 0!important}
html[data-design=m2] .right .chg > *,html[data-design=m2] .right .trade .flow > *{border-right:0!important;background:transparent!important}
html[data-design=m2] .right .chg > .g .v{color:var(--green)} html[data-design=m2] .right .chg > .r .v{color:var(--red)}
html[data-design=m2] .right .trade .flow{border-bottom:0!important;padding:4px 0}
html[data-design=m2] .right .trade .ctl{border-bottom:0!important;padding:8px 14px 10px!important}
html[data-design=m2] .right .trade .ctl .wsel,html[data-design=m2] .right .trade .ctl .ic,html[data-design=m2] .right .trade .ctl .qk{border-color:transparent!important;background:var(--card)!important}
html[data-design=m2] .right .trade .seg{border-color:transparent!important}
html[data-design=m2] .right .trade .inp{border-color:transparent!important;background:var(--card)!important}
html[data-design=m2] .right .trade .presets button{border-color:transparent!important;background:var(--card)!important}
html[data-design=m2] .right .trade .presets button.on{background:var(--accent-bg)!important;color:var(--accent)!important;box-shadow:inset 0 0 0 1px var(--accent-line)}
html[data-design=m2] .right .trade .acc{border-top:0!important;padding:6px 14px 12px!important}
html[data-design=m2] .right .trade .acc .h{font-size:12.5px;color:var(--sub)}
html[data-design=m2] .right .audit .h{padding:14px 14px 8px!important;font-size:12px!important;font-weight:600;color:var(--sub);letter-spacing:.02em}
html[data-design=m2] .right .audit .h svg{width:14px;height:14px}
html[data-design=m2] .right .audit .b{padding:0 14px 14px!important;gap:10px!important}
html[data-design=m2] .right .audit .agrid{gap:10px 16px!important}
html[data-design=m2] .right .audit .acell{border:0!important;border-radius:0!important;background:transparent!important;padding:0!important;gap:3px}
html[data-design=m2] .right .audit .acell.two{gap:16px} html[data-design=m2] .right .audit .acell.two > div{flex:1 1 0;min-width:0}
html[data-design=m2] .right .audit .acell .k{font-size:10.5px;letter-spacing:.06em}
html[data-design=m2] .right .audit .acell .v{font-family:var(--mono);font-size:13px}

/* ═══ pass 18: the motion kit on the deck (server/web/motion-kit.css + .js, loaded on every page by
   server/edition.mjs). The kit owns the timings, the easings and the reduced-motion policy; this block only
   tells the deck's own paint where to get out of its way. Rules: the design notes (MOTION-SPEC.md) ═══ */

/* a trade printing: MK.arrive() slides the row 10 px and holds its side's colour for 1.4 s on the ROW, so the
   cells must not paint over it — the same trick the old tr.fresh rule played (zebra, hover, both) */
html[data-design=m2] .tabsp tr.mk-arrive td{background:transparent}
/* a figure that moved takes its direction's colour and settles back over 1.1 s. The deck paints .th .mc with
   !important, which a @keyframes colour cannot beat, so the tint is a transition here instead — same curve,
   same tokens, same 0.2 % floor (MK.tickNumber adds and drops .mk-up / .mk-down) */
html[data-design=m2] .th .mc.mk-num,html[data-design=m2] .th .st .v .mk-num,html[data-design=m2] .th .st .v #st-price{transition:color var(--mk-t-settle) var(--mk-ease-settle)}
html[data-design=m2] .th .mc.mk-tick.mk-up,html[data-design=m2] .th .st .v .mk-tick.mk-up{color:var(--mk-tint-up)!important;transition:color var(--mk-t-quick) var(--mk-ease-plain)}
html[data-design=m2] .th .mc.mk-tick.mk-down,html[data-design=m2] .th .st .v .mk-tick.mk-down{color:var(--mk-tint-dn)!important;transition:color var(--mk-t-quick) var(--mk-ease-plain)}
/* the ticket: the loading shape sits where the ticket will, the stage rail under the buttons, and a size that
   cannot trade takes the red line while MK.shake() moves it (a transform: the box never changes) */
html[data-design=m2] .right .trade .tk-sk{margin:6px 14px 12px;border-color:var(--line)!important;background:transparent!important}
html[data-design=m2] .right .trade #stage{padding:12px 2px 4px}
html[data-design=m2] .right .trade #stage[hidden]{display:none}
html[data-design=m2] .right .trade .inp.bad{box-shadow:inset 0 0 0 1px var(--red)!important}
/* the primary action wears the kit's own classes instead of a hover rule of its own: .mk-press .mk-soft for
   the press, .mk-lift for the 1 px lift and the lime drop, .mk-glow for the drop at rest (token.js) */