/* remix-timeline.css — NEYN-12112 · production-lean layer for the GT + activity-timeline
 * LEAD page. Scoped to body.tl (loaded only on final-token-detail-remix-timeline.html), so
 * the exploration pages are untouched. This is the first slice of the "consolidated brand"
 * pass (2026-07-16): float everything (no card boxes), drop decorative borders, tighten the
 * column gap, and route every corner through one radius token so the brand's corner choice
 * is a single edit. Overrides remix.css by carrying an extra class (body.tl.remix …).
 */

/* ---- brand tokens (single source for the consolidation decisions) ---- */
body.tl{
  --r: 6px;            /* corner radius — the brand-stage choice lives here (see recs) */
  --colgap: 24px;      /* was 48px — halved per review (gap was double what it needs) */
}

/* ---- NO BOXES: chart / swap / stats float full-width in their column ---- */
body.tl.remix .charthero{ border:none; border-radius:0; padding:0; margin:0 0 18px; }
body.tl.remix .charthero .chartbg{ border-radius:var(--r); }              /* the chart still reads as one surface */
/* dark: match the GT embed's near-black canvas (bg_color=0a0714) so the chart reads as one
   uniform dark panel, no seam against the navy page (Antimo 2026-07-21 GT-chrome-contrast fix) */
body.tl.remix[data-theme="dark"] .charthero, body.tl.remix[data-theme="dark"] .charthero .chartbg{ background:#0a0714; }
body.tl.remix .swap-card{ border:none; border-radius:0; padding:0; }
body.tl.remix .railcard{ border:none; border-radius:0; padding:16px 0 0; margin-top:14px; }
body.tl.remix .mstats{ border:none; border-radius:0; padding:0; }

/* ---- NO decorative borders (the scrolled unified nav supplies its own contrast) ---- */
body.tl.remix .header{ border-bottom:none; padding-bottom:6px; }          /* token-info block: border gone */

/* ---- SOCIAL HANDLES: room between the pills, but tight to the name line above ---- */
body.tl.remix .idsub{ gap:10px 16px; margin-top:2px; }
body.tl.remix .idsub .hpill{ display:inline-flex; align-items:center; gap:6px;
  padding:3px 9px; border-radius:var(--r); }
body.tl.remix .idname{ gap:10px; }
body.tl.remix .idname .idok,
body.tl.remix .idname .agentstatus{ margin-left:2px; }

/* ---- corner-radius token flows to the remaining rounded chrome ---- */
body.tl.remix .idav{ border-radius:var(--r); }
body.tl.remix .newpill,
body.tl.remix .idlaunch .lsq{ border-radius:var(--r); }

/* ---- the single activity filter bar (chart → chips → timeline → rows) ---- */
body.tl.remix .activity .acthead{ padding:0 0 12px; border:none; }
body.tl.remix .activity .actbar{ gap:8px; }
body.tl.remix .activity .actbar .chip{ border-radius:var(--r); }
body.tl.remix .activity .actwrap{ margin-top:2px; }

/* ---- understyled-review pass: outlined chips/inputs → soft fills; route the radius ---- */
/* safety verdict: outlined mhbadges → soft filled chips (keep the semantic colours) */
body.tl.remix .railverdict .mhbadge{ border:none; background:var(--chipbg); color:var(--t666);
  border-radius:var(--r); padding:3px 9px; }
body.tl.remix .railverdict .mhbadge.ok{ color:var(--pos); background:var(--pos-bg); }
body.tl.remix .railverdict .mhbadge.warnb{ color:var(--warnc); background:var(--warn-bg); }
/* swap pay/receive: bordered boxes → filled rows (Uniswap-style, no hard outline) */
body.tl.remix .swap-card .pay{ border:none; background:var(--navfill); }
body.tl.remix .swap-card .pay.src{ border-radius:var(--r) var(--r) 0 0; }
body.tl.remix .swap-card .pay.dst{ border-radius:0 0 var(--r) var(--r); border-top:2px solid var(--bg); }
/* route the corner-radius token through the remaining rounded chrome */
body.tl.remix .swaptab,
body.tl.remix .qchip,
body.tl.remix .pay .cur,
body.tl.remix .mbtn,
body.tl.remix .btn-primary,
body.tl.remix .tb-btn,
body.tl.remix .dockpill{ border-radius:var(--r); }

/* ======================= review round 2 (2026-07-20) ======================= */
/* Velvet Ultraviolet's light bg is a warm off-white (#FAF9FD) that seams against
   GeckoTerminal's pure-white chart. Full white on the lead page (light theme only) —
   the extra .tl class outranks style-toggle's runtime #style-dir tag. ONLY --bg. */
body.tl.remix[data-theme="light"]{ --bg:#ffffff; }

/* center the search bar horizontally, width unchanged (desktop, split nav —
   unified/scrolled is uninav's territory, left untouched) */
@media (min-width:901px){
  body.tl:not(.uninav) .topnav .search{
    position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:384px; margin:0; }
}

/* the activity timeline FLOATS like everything else — no box, no border, no fill */
body.tl .stl-track{ background:transparent; border:none; border-radius:0; }

/* near production — drop the GeckoTerminal "· bare · live" scaffolding badge */
body.tl .cemb-note{ display:none !important; }

/* ======================= round 5 (top-to-bottom polish) ======================= */
/* nav: the CLANKER logo bars take the token accent (violet) — matches the identity */
body.tl .brand .bars i{ background:var(--acc); }

/* search: centered placeholder; grows ~25% on focus (stays centered) */
body.tl .search input.ph:placeholder-shown{ text-align:center; }
@media (min-width:901px){
  body.tl:not(.uninav) .topnav .search{ transition:width .16s ease; }
  body.tl:not(.uninav) .topnav .search:focus-within{ width:480px; }
}

/* the activity timeline: no baseline hairline, ~200% taller so the volume spikes
   read and compare to the GeckoTerminal chart's volume row */
body.tl .stl-base{ display:none; }
body.tl .stl-track{ height:180px; }

/* masthead: identity-line address chip + the ↑ launch anchor */
body.tl.remix .idname{ flex-wrap:wrap; }
body.tl.remix .idname .idaddr{ font-family:var(--mono); font-size:12px; color:var(--t666);
  display:inline-flex; align-items:center; gap:6px; margin-left:2px; }
body.tl.remix .idsub .idlaunch .toanchor{ display:inline-flex; align-items:center; justify-content:center;
  width:16px; height:16px; margin-left:3px; border-radius:var(--r); color:var(--acc); cursor:pointer;
  font-size:12px; line-height:1; }
body.tl.remix .idsub .idlaunch .toanchor:hover{ background:var(--acc-bg); }
/* masthead description (3rd line) — one line, expandable */
body.tl.remix .iddesc{ margin-top:7px; font-size:13px; line-height:1.5; color:var(--t666); max-width:var(--maxw); }
body.tl.remix .iddesc .dtext{ display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical;
  overflow:hidden; }
body.tl.remix .iddesc.open .dtext{ -webkit-line-clamp:unset; }
body.tl.remix .iddesc .dmore{ color:var(--acc); font-weight:500; cursor:pointer; white-space:nowrap; }

/* anchor row (moved off the bottom dock, under the masthead / above the chart).
   The pills are plain chips styled IDENTICALLY to the swap tabs — visual props come
   from the ONE-chip rule (round 6 below); here we set only structure + the swap-tab gap. */
body.tl.remix .anchorrow{ display:flex; flex-wrap:wrap; gap:12px; margin:2px 0 16px; }
body.tl.remix .anchorrow .apill{ display:inline-flex; align-items:center; cursor:pointer; }
/* the old bottom dock is retired on the lead page */
body.tl .secdock{ display:none !important; }

/* clankernomics + about sections */
/* Clankernomics rows read exactly like the Contract / Agent metrics — same flex
   layout, v-spacing and type, NO horizontal dividers (Antimo) */
body.tl.remix .knom .krow{ display:flex; justify-content:space-between; align-items:baseline;
  gap:10px; padding:6px 0; min-height:28px; border-bottom:none; }
body.tl.remix .knom .kk{ font-size:13px; color:var(--t666); font-weight:400; }
body.tl.remix .knom .krow .kv{ min-height:0; padding:0; font-size:12.5px; font-family:var(--mono);
  font-weight:400; color:var(--ink); text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
body.tl.remix .about{ margin-top:24px; }
body.tl.remix .about p{ font-size:13px; line-height:1.6; color:var(--t666); margin-bottom:10px; max-width:var(--maxw); }

/* nav: copy + Launch (CTA) + hamburger */
body.tl .navright{ display:inline-flex; align-items:center; gap:12px; }
/* clanker.md → one clickable button (label + copy icon) that copies the Agent Skill.
   The old .doc "two horizontal lines" glyph was removed from the markup. */
body.tl .navright .nrmd{ display:inline-flex; align-items:center; gap:6px; background:none; border:none;
  padding:0; font:inherit; font-size:12px; font-weight:500; color:var(--ink); cursor:pointer; }
body.tl .navright .nrmd:hover{ color:var(--acc); }
body.tl .navright .nrmd:hover .copy,
body.tl .navright .nrmd:hover .copy::after{ border-color:var(--acc); }

/* mobile docked Trade button → SOLID BLACK (Antimo), inverse text, no accent glow */
body.tl .tradebar .tb-btn{ background:var(--ink); color:var(--bg); border:1px solid transparent;
  box-shadow:0 4px 16px rgba(0,0,0,.20); }
body.tl .tradebar .tb-btn .tb-info{ color:var(--bg); opacity:.7; }

/* collapsed masthead (sliver): token PFP as the first item on the left */
body.tl .sliver{ gap:9px; }
body.tl .sliver .slav{ width:22px; height:22px; border-radius:var(--r); overflow:hidden; flex-shrink:0;
  background:linear-gradient(135deg,#8a63ff,#6b3ffb); }
body.tl .sliver .slav img{ width:100%; height:100%; object-fit:cover; display:block; }
body.tl .nrlaunch{ font-size:13px; font-weight:600; color:var(--cta-ink); background:var(--acc);
  border:none; border-radius:var(--r); padding:7px 15px; cursor:pointer; }
body.tl .nrham{ display:inline-flex; flex-direction:column; justify-content:center; gap:3.5px;
  width:32px; height:32px; padding:8px; border:1px solid var(--line); border-radius:var(--r);
  background:transparent; cursor:pointer; }
body.tl .nrham span{ display:block; height:1.5px; background:var(--ink); border-radius:1px; }

/* ===================== round 6 (2026-07-20) — ONE chip · swap partial-revert · Manage =====================
   Supersedes the round-4/round-5 chip + swap treatments above (last-in wins). */

/* ---------- ONE CHIP SYSTEM (Antimo) ----------
   Every chip is EITHER a solid fill OR a border — never both. All share the same
   padding (5/10), radius (--r), font (12/500) and gap (8). Solid chips carry a 1px
   TRANSPARENT border so a filled chip and a bordered chip keep an identical outer box. */
body.tl.remix .swaptab,
body.tl.remix .anchorrow .apill,
body.tl.remix .actbar .chip,
body.tl.remix .qchip,
body.tl.remix .railverdict .mhbadge{
  font-size:12px; font-weight:500; line-height:15px; border-radius:var(--r);
  padding:5px 10px; box-sizing:border-box; }
/* — BORDER variant (neutral / idle interactive): transparent fill + a thin line — */
body.tl.remix .swaptab,
body.tl.remix .anchorrow .apill,
body.tl.remix .actbar .chip,
body.tl.remix .qchip{ background:transparent; border:1px solid var(--line); color:var(--t666); }
body.tl.remix .swaptab:hover,
body.tl.remix .anchorrow .apill:hover,
body.tl.remix .actbar .chip:hover,
body.tl.remix .qchip:hover{ color:var(--ink); border-color:var(--t888); }
/* — SOLID variant (selected): accent fill, inverse text, NO visible border — */
body.tl.remix .swaptab.on,
body.tl.remix .actbar .chip.on{ background:var(--acc); border:1px solid transparent; color:var(--cta-ink); }
/* preset-amount chips are the pure border reference — selected = accent border + text, still no fill */
body.tl.remix .qchip.on{ background:transparent; border-color:var(--acc); color:var(--acc); }
/* — SAFETY badges = SOLID fills (Antimo: coloured solid background, and NOT also a border) — */
body.tl.remix .railverdict .mhbadge{ background:var(--chipbg); border:1px solid transparent; color:var(--t666); }
body.tl.remix .railverdict .mhbadge.ok{ background:var(--pos-bg); color:var(--pos); border-color:transparent; }
body.tl.remix .railverdict .mhbadge.warnb{ background:var(--warn-bg); color:var(--warnc); border-color:transparent; }
/* handle pills → border variant (match the family) */
body.tl.remix .idsub .hpill{ background:transparent; border:1px solid var(--line); }
/* ONE gap across every chip group ("same margins") */
body.tl.remix .swaptabs,
body.tl.remix .actbar,
body.tl.remix .anchorrow,
body.tl.remix .chips,
body.tl.remix .railverdict{ gap:8px; }

/* ---------- Manage button (Antimo) ----------
   Same spacing + style as every other chip (border variant, no icon). Scoped to .header
   so it styles + admin-gates in BOTH homes: .idactions (desktop, far-right) and, on
   mobile, relocated next to the "launched by @user" line (JS in the page footer). */
body.tl.remix .idname .idok{ border-radius:var(--r); }
body.tl.remix .header .manage{ display:none; align-items:center; background:transparent; color:var(--t666);
  border:1px solid var(--line); border-radius:var(--r); padding:5px 10px; font-size:12px; font-weight:500; line-height:15px; }
body.tl.remix[data-viewer="admin"] .header .manage{ display:inline-flex; }
body.tl.remix .header .manage:hover{ color:var(--ink); border-color:var(--t888); }

/* ---------- SWAP inputs — PARTIAL REVERT of round-5's border-only over-application ----------
   Neutral You-pay / You-receive keep the faint fill and read as ONE box with NO
   internal divider; only the FOCUSED You-pay field lifts to white + a thin accent
   border. (The chips above stay border-only — the part Antimo liked.) */
body.tl.remix .swap-card .pay{ background:var(--navfill); border:1px solid var(--line); }
body.tl.remix .swap-card .pay.src{ border-radius:var(--r) var(--r) 0 0; border-bottom:none; }
body.tl.remix .swap-card .pay.dst{ border-radius:0 0 var(--r) var(--r); border-top:none; }
/* Focus highlight removed (Antimo 2026-07-21): the violet box/ring around the narrow
   input read as unintended. Focused You-pay now matches its unfocused fill; the text
   caret indicates focus. Same for the search input. */
body.tl.remix .swap-card .pay.src:focus-within{ background:var(--navfill); border:1px solid var(--line);
  border-radius:var(--r) var(--r) 0 0; border-bottom:none; }
body.tl.remix .swap-card .pay input:focus, body.tl.remix .swap-card .pay input:focus-visible,
body.tl.remix .topnav .search input:focus, body.tl.remix .topnav .search input:focus-visible{ outline:none; box-shadow:none; }

/* ---------- VERTICAL SPACING SCALE (4-based; ~20px section rhythm, matching the swap) ---------- */
/* SPLIT nav (Antimo): tighter main-nav padding. The bottom border appears ONLY when
   scrolled — then the nav + the collapsed masthead (sliver) below it read as one
   combined sticky block with two stacked borders. At the top of the page: no border. */
body.tl .topnav{ padding-top:10px; padding-bottom:10px; }
body.tl.scrolled .topnav{ border-bottom:1px solid var(--line); }
/* symmetric masthead: gap(nav→masthead) == gap(masthead→age-wording). The agebanner's
   top margin (11) matches nav.padding-bottom(10)+border(1) so both gaps equal header.pad + 11 */
body.tl.remix .header{ padding-top:16px; padding-bottom:16px; }
body.tl.remix .agebanner{ margin:11px 0 20px; }                /* full-width: final.css already insets via padding:0 pgpad — the old margin:0 pgpad DOUBLED the inset → ~50% regression */
body.tl.remix .body{ padding-top:20px; }
body.tl.remix .anchorrow{ margin:0 0 20px; }
body.tl.remix .charthero{ margin:12px 12px 24px; }             /* breathing room around the chart (~12px, matches the anchor-chip rhythm) — both themes · Antimo 2026-07-21 */
body.tl.remix .stl{ margin:12px 0 24px; }                      /* around the timeline */
body.tl.remix .activity .acthead{ padding-bottom:16px; }
body.tl.remix .evid{ padding-top:32px; gap:32px 48px; }
body.tl.remix .esec{ margin-bottom:4px; }

/* the masthead description is redundant with the full About section below → drop it */
body.tl .iddesc{ display:none; }
/* activity rows: left/right breathing room so the avatar isn't flush to the edge */
body.tl.remix .actlist .row{ padding-left:12px; padding-right:12px; }
body.tl.remix .activity .acthead,
body.tl.remix .stl{ padding-left:12px; padding-right:12px; }   /* keep chips + timeline aligned with the rows */

/* project UPDATES stand out in the feed (Antimo: visibly different) — accent marker,
   a small tag, and a faint accent wash so they read as official, not a cast/trade */
body.tl.remix .actlist .row[data-kind="update"],
body.tl.remix .actlist .row[data-kind="launch"]{ background:var(--acc-bg); border-radius:var(--r); }
body.tl.remix .actlist .row .sq.upd{ background:var(--acc); }
body.tl.remix .actlist .row .uptag{ font:600 9px var(--mono, ui-monospace, monospace); text-transform:uppercase;
  letter-spacing:.06em; color:var(--acc); background:var(--pop); border:1px solid var(--acc-br);
  border-radius:4px; padding:1px 5px; margin-right:7px; vertical-align:1px; }

/* the "Updates" filter should isolate updates in the FEED too (final.css only has
   fc/x/trade rules) — add the update case for the lead page */
body.tl.remix .activity[data-filter="update"] .row:not([data-kind~="update"]){ display:none; }

/* ===================== round 7 (2026-07-20) — updates · admin post · footer · address · mobile nav ===================== */

/* project updates are PLAIN TEXT — not expandable, so no pointer / no caret (Antimo) */
body.tl.remix .actlist .row[data-kind="update"],
body.tl.remix .actlist .row[data-kind="launch"]{ cursor:default; }
body.tl.remix .actlist .row[data-kind="update"] .rowcaret,
body.tl.remix .actlist .row[data-kind="launch"] .rowcaret{ display:none; }

/* ADMIN — compose bar to post a project update (only visible in admin viewer) */
body.tl.remix .actcompose{ display:none; gap:8px; align-items:center; margin-bottom:14px; }
body.tl.remix[data-viewer="admin"] .actcompose{ display:flex; }
body.tl.remix .actcompose .acinput{ flex:1; min-width:0; border:1px solid var(--line); border-radius:var(--r);
  background:var(--bg); padding:8px 12px; font-size:13px; color:var(--ink); outline:none; }
body.tl.remix .actcompose .acinput::placeholder{ color:var(--t888); }
body.tl.remix .actcompose .acinput:focus{ border-color:var(--acc); }
body.tl.remix .actcompose .acpost{ background:var(--acc); color:var(--cta-ink); border:1px solid transparent;
  border-radius:var(--r); padding:8px 16px; font-size:13px; font-weight:600; cursor:pointer; white-space:nowrap; }
body.tl.remix .actcompose .acpost:hover{ opacity:.9; }

/* footer legal paragraph = same size / font as the footer links (.fcol a = 14px) */
body.tl .footer .fdisc{ font-size:14px; line-height:21px; }

/* contract address in the masthead: FULL on desktop, middle-truncated on mobile */
body.tl.remix .idaddr .afull{ display:inline; }
body.tl.remix .idaddr .ashort{ display:none; }

/* ---------- MOBILE NAV rework (Antimo: it was missing/overflowing) ----------
   Compact bar: brand + a search icon on the left, Launch + hamburger on the right.
   clanker.md folds into the hamburger menu. */
@media (max-width:640px){
  body.tl .topnav{ gap:10px; padding-left:16px; padding-right:16px; }
  body.tl .topnav .search{ flex:0 0 38px; width:38px; height:38px; padding:0; justify-content:center; border-radius:var(--r); }
  body.tl .topnav .search input.ph,
  body.tl .topnav .search .slash,
  body.tl .topnav .search .searchmenu{ display:none; }
  body.tl .navright{ gap:8px; }
  body.tl .navright .nrmd{ display:none; }
  body.tl .nrlaunch{ padding:7px 12px; font-size:13px; }
  /* Manage (relocated next to "launched by") reads inline on the launch line */
  body.tl.remix .idsub .manage{ margin-left:2px; }
  /* contract address → short form on mobile */
  body.tl.remix .idaddr .afull{ display:none; }
  body.tl.remix .idaddr .ashort{ display:inline; }
}

/* ---------- main-nav HAMBURGER dropdown (Figma 3:57 connected / 3:58 disconnected) ---------- */
body.tl .hbmenu{ position:absolute; top:100%; right:var(--pgpad); margin-top:6px; z-index:85;
  width:280px; max-width:calc(100vw - 32px); background:var(--pop); border:1px solid var(--line);
  border-radius:12px; box-shadow:0 12px 34px var(--shadow); overflow:hidden; padding:6px 0; }
body.tl .hbmenu[hidden]{ display:none; }
body.tl .hbsec{ padding:6px 0; }
body.tl .hbsec + .hbsec{ border-top:1px solid var(--line); }
body.tl .hblabel{ font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  color:var(--t888); padding:6px 16px 4px; }
body.tl .hbitem{ display:block; width:100%; text-align:left; background:none; border:none;
  font-family:inherit; font-size:14px; font-weight:500; color:var(--ink); padding:9px 16px; cursor:pointer; }
body.tl .hbitem:hover{ background:var(--navfill); }
body.tl .hbitem.hbdanger{ color:var(--neg); }
body.tl .hbaddr{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:7px 16px; }
body.tl .hbmono{ font-family:var(--mono); font-size:13px; color:var(--ink); }
body.tl .hbicons{ display:inline-flex; align-items:center; gap:12px; }
body.tl .hbico{ background:none; border:none; color:var(--t888); font-size:13px; line-height:1; cursor:pointer;
  display:inline-flex; align-items:center; }
body.tl .hbico:hover{ color:var(--ink); }
body.tl .hbfoot{ padding:8px 12px 10px; border-top:1px solid var(--line); }
body.tl .hbconnect{ display:block; width:100%; font-family:inherit; background:var(--acc-bg); color:var(--acc);
  border:1px solid var(--acc-br); border-radius:var(--r); padding:11px; font-size:14px; font-weight:600; cursor:pointer; }
body.tl .hbconnect:hover{ background:var(--acc); color:var(--cta-ink); border-color:var(--acc); }
@media (max-width:640px){
  body.tl .hbmenu{ right:16px; left:16px; width:auto; max-width:none; }
}

/* ---------- on-page light/dark toggle (sun/moon) in the nav ---------- */
body.tl .nrtheme{ display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px;
  border:1px solid var(--line); border-radius:var(--r); background:transparent; color:var(--ink); cursor:pointer; }
body.tl .nrtheme:hover{ border-color:var(--t888); }
body.tl .nrtheme svg{ width:16px; height:16px; display:block; }
body.tl .nrtheme .ic-sun{ display:none; }
body.tl .nrtheme .ic-moon{ display:block; }        /* light mode shows the moon (→ go dark) */
body.tl[data-theme="dark"] .nrtheme .ic-sun{ display:block; }   /* dark mode shows the sun (→ go light) */
body.tl[data-theme="dark"] .nrtheme .ic-moon{ display:none; }

/* ---------- footer social links (X + Farcaster) ---------- */
body.tl .footer .fsocial{ display:flex; gap:10px; margin-top:16px; }
body.tl .footer .fsoc{ display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px;
  border:1px solid var(--line); border-radius:var(--r); color:var(--t666); }
body.tl .footer .fsoc:hover{ color:var(--ink); border-color:var(--t888); }
body.tl .footer .fsoc svg{ width:15px; height:15px; display:block; }

/* ===================== round 8 (2026-07-21) — robustness-audit fixes ===================== */

/* B2 · #sec-knom + #sec-about were omitted from final.css:396's scroll-margin list → their anchor
   scroll landed the heading under the sticky nav. Give them the same offset. */
body.tl #sec-knom, body.tl #sec-about{ scroll-margin-top:calc(var(--navh) + var(--sliverh) + 14px); }

/* B3 · mobile stats: long small-cap prices ($0.00000068 / $0.001185) overflowed the 1/3 grid cell and
   collided with the neighbour. Let the value wrap + drop the delta to its own line (est. $15.98 hid this). */
@media (max-width:900px){
  body.remix .mstats .rs{ min-width:0; }
  body.remix .mstats .rs .v{ white-space:normal; overflow-wrap:anywhere; font-size:14px; line-height:1.25; }
  body.remix .mstats .rs .v .d{ display:block; margin-left:0; }
}

/* G20 · Safety verdict is trust-critical but lived only in the desktop rail. On mobile surface just the
   Safety card (below the feed) — swap → docked Trade bar, stats → .mstats already cover those. */
@media (max-width:900px){
  body.tl.remix .col-right{ display:block; }
  body.tl.remix .col-right .railwrap{ position:static; gap:0; }
  body.tl.remix .col-right .swap-card,
  body.tl.remix .col-right .railstats{ display:none; }
  body.tl.remix .col-right .railcard:last-child{ margin-top:20px; }
}

/* P9 · base "Connect Wallet" (required first action) read as near-invisible muted text in dark → give it a
   clear secondary treatment until it promotes to the accent .primary state. */
body.tl.remix .connect:not(.primary):not(.err){ color:var(--ink); background:var(--chipbg); border:1px solid var(--line); }

/* P22 · design-system focus ring on product controls (was falling back to the UA default outline) */
body.tl.remix button:focus-visible,
body.tl.remix a:focus-visible,
body.tl.remix input:focus-visible,
body.tl.remix [tabindex]:focus-visible{ outline:2px solid var(--acc); outline-offset:2px; border-radius:var(--r); }

/* P17 · mobile touch targets ≥ 40px */
@media (max-width:640px){
  body.tl .nrtheme, body.tl .nrham{ width:40px; height:40px; }
  body.tl .topnav .search{ flex-basis:40px; width:40px; height:40px; }
}

/* G26 / P2 · the collapsed sliver hard-clipped trust signals mid-value on mobile → fade the right edge so it
   reads as intentionally condensed (PFP + name + price stay). */
@media (max-width:640px){
  body.tl .sliver .sl{ -webkit-mask-image:linear-gradient(90deg,#000 84%,transparent);
    mask-image:linear-gradient(90deg,#000 84%,transparent); }
}

/* G12 · empty-state overlay for a zero-result activity filter (e.g. Trades on a cast-only token) */
body.tl.remix .actempty{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:13px; color:var(--t888); pointer-events:none; }
body.tl.remix .actempty[hidden]{ display:none; }