/* Mobile optimization layer for ShieldX.
   Loaded after page-specific styles so it only adjusts layout on smaller screens. */
html,body{max-width:100%;overflow-x:clip;}
img,svg,canvas,video,iframe{max-width:100%;height:auto;}
button,input,select,textarea,a.btn,.btn{touch-action:manipulation;}
input,select,textarea,button,.btn{min-height:44px;}
pre,code,.mono,.addr,.hash,.ca,.contract,.wallet-address,[data-address]{overflow-wrap:anywhere;word-break:break-word;}
table{width:100%;display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;}
th,td{white-space:nowrap;}
.row,.actions,.topbar,.dashboard-standalone-top,.dash-header,.dash-panel-title,.simple-input-row,.simple-action-row,.aux-head,.ai-headline,.hero-exchange-top,.hero-exchange-band,.hero-exchange-tags,.hero-exchange-top,.hero-exchange-foot,.scan-mini-top,.scan-mini-bottom,.an-top,.an-foot,.last-scan-head,.build-live-head,.scan-activity-head{flex-wrap:wrap;}
.card,.dash-panel,.verdict,.wallet-modal-card,.hero-exchange-card,.chk,.nc,.trend-card,.ai-card,.cluster-card,.wl-card,.metric,.dash-kpi{min-width:0;}
.container,.page,.hero-inner,.results{width:min(100%,calc(100vw - 24px));}

@media (max-width: 900px){
  nav{padding:12px 16px !important;height:auto !important;min-height:64px;gap:10px;align-items:flex-start;}
  .nav-logo{font-size:18px;}
  .nav-cta{width:100%;justify-content:flex-start;gap:8px;}
  .nav-cta .btn,.nav-cta a{flex:1 1 140px;justify-content:center;}
  .hero,.dashboard-standalone,.dash-main,section,.page{padding-left:16px !important;padding-right:16px !important;}
  .hero{padding-top:104px !important;}
  .hero-layout,.presale-grid,.presale-premium-grid,.dash-layout,.dash-row,.dash-kpi-row,.dash-metrics,.checks,.results-grid,.simple-grid,.srcgrid,.netgrid,.trend-metrics,.ai-metrics,.cluster-stats,.roadmap-grid,.path-grid,.wallet-state-grid,.widget-trust,.price-path,.proj-grid,.countdown-grid,.support-grid,.footer-grid,.scanner-roadmap-grid,.token-card-grid,.hiw-steps,.audit-inner,.stats,.grid-2{grid-template-columns:1fr !important;}
  .hero-aside,.hero-copy{width:100%;}
  .hero-exchange-card{width:100% !important;max-width:none !important;padding:18px !important;border-radius:22px !important;}
  .hero-exchange-title{font-size:28px !important;line-height:1.08 !important;}
  .hero-exchange-grid{grid-template-columns:1fr 1fr !important;}
  .verdict{padding:18px !important;gap:14px !important;}
  .vscore{width:100%;}
  .dash-panel,.card,.chk,.nc,.wallet-modal-card{padding:16px !important;border-radius:16px !important;}
  .dash-sidebar{padding-left:10px !important;padding-right:10px !important;}
  .dashboard-standalone-top .right,.dash-header > div:last-child{width:100%;}
}

@media (max-width: 760px){
  body{font-size:15px;}
  h1,.hero h1{font-size:clamp(28px,8vw,40px) !important;line-height:1.08 !important;}
  h2{font-size:clamp(22px,6vw,30px) !important;}
  .hero-copy p,.sub,.helper,.v-desc,.disc{font-size:14px !important;line-height:1.6 !important;}
  .hero-exchange-grid{grid-template-columns:1fr !important;}
  .hero-exchange-pill,.hero-exchange-band,.quote,.stat,.chk,.nc,.dash-kpi,.metric{padding:14px !important;}
  .btn,.btn-lg,.btn-sm{width:100%;justify-content:center;}
  .actions .btn,.row .btn,.simple-input-row .btn,.simple-action-row .btn{width:100%;}
  .row,.actions,.simple-input-row,.simple-action-row{flex-direction:column;align-items:stretch !important;}
  .buy-row,.presale-buy-panel .buy-row,.currency-tabs,.wallet-stat-grid,.fraud-feed-meta,.scan-activity-line1,.scan-activity-line2{grid-template-columns:1fr !important;}
  .verdict,.aux-head,.ai-headline,.trend-ts,.dashboard-standalone-top,.dash-header,.build-live-head,.last-scan-head,.scan-mini-top,.scan-mini-bottom,.an-top,.an-foot{flex-direction:column !important;align-items:flex-start !important;}
  .v-emo{font-size:36px !important;}
  .vnum{font-size:28px !important;}
  .srcgrid,.checks,.netgrid{gap:10px !important;}
  .term{padding:14px !important;}
  .term-line,.tline{white-space:normal !important;}
}

@media (max-width: 640px){
  nav{position:sticky !important;top:0;}
  .container,.page,.hero-inner,.results{width:min(100%,calc(100vw - 20px));}
  .hero,.dash-main,section,.page{padding-left:12px !important;padding-right:12px !important;}
  .hero{padding-bottom:40px !important;}
  .hero-exchange-card,.dash-panel,.card,.wallet-modal-card,.verdict,.chk,.nc,.term{border-radius:14px !important;}
  .hero-exchange-title{font-size:24px !important;}
  .hero-exchange-copy,.v-desc,.disc,.helper{font-size:13px !important;}
  .hero-exchange-logo{width:46px !important;height:46px !important;border-radius:14px !important;}
  .hero-exchange-logo svg{width:22px !important;height:22px !important;}
  .dash-main{padding-top:14px !important;}
  .dash-sidebar{overflow-x:auto;white-space:nowrap;padding-bottom:8px !important;}
  .dash-nav{display:flex;gap:8px;flex-wrap:nowrap;}
  .dash-nav-item{display:inline-flex;min-width:max-content;}
  .fraud-feed-meta,.wallet-state-grid,.stats{grid-template-columns:1fr !important;}
  .scan-activity-name,.scan-activity-flag,.an-flag,.hero-exchange-tag,.dtag,.tag{white-space:normal !important;}
}

@media (max-width: 520px){
  body{font-size:14px;}
  nav{padding:10px 12px !important;}
  .hero{padding-top:96px !important;}
  .hero-exchange-card,.dash-panel,.card,.wallet-modal-card,.verdict,.chk,.nc,.quote,.stat{padding:12px !important;}
  .hero-exchange-track{gap:8px !important;animation-duration:17s !important;}
  .hero-exchange-pill strong,.dash-panel-title,.dash-kpi .kpi-value,.presale-kpi .v,.presale-kpi .kpi-value{overflow-wrap:anywhere;word-break:break-word;}
  .sbadge,.hero-exchange-tag,.tag,.dtag,.ncst,.v-tag{font-size:10px !important;}
  .v-ttl{font-size:17px !important;}
  .vnum{font-size:24px !important;}
  .wallet-modal{padding:12px !important;}
}

@media (max-width: 400px){
  .container,.page,.hero-inner,.results{width:min(100%,calc(100vw - 16px));}
  .hero,.dash-main,section,.page{padding-left:8px !important;padding-right:8px !important;}
  .hero-exchange-title{font-size:22px !important;}
  .hero-exchange-logo{width:42px !important;height:42px !important;}
}


/* === final phone polish for latest homepage + presale === */
@media (max-width: 768px){
  .hero{padding-top:104px !important;padding-bottom:38px !important;}
  .hero-layout{gap:16px !important;align-items:start !important;}
  .hero-copy{text-align:left !important;}
  .hero-copy .hero-sub,.hero-sub{max-width:100% !important;margin-left:0 !important;margin-right:0 !important;}
  .hero-actions{gap:10px !important;justify-content:flex-start !important;}
  .hero-actions .btn{width:100% !important;}
  .hero-aside{justify-content:stretch !important;margin-top:4px !important;transform:none !important;}
  .hero-exchange-card{width:100% !important;max-width:100% !important;padding:18px !important;border-radius:22px !important;}
  .hero-doc-actions{gap:10px !important;}
  .hero-doc-actions .btn{width:100% !important;}
  .hero-exchange-title-compact{font-size:21px !important;line-height:1.08 !important;}
  .hero-exchange-copy{font-size:13px !important;line-height:1.65 !important;}
  .hero-exchange-grid{grid-template-columns:1fr 1fr !important;gap:10px !important;}
  .hero-exchange-pill{padding:12px 11px !important;min-height:86px !important;display:flex !important;flex-direction:column !important;justify-content:center !important;}
  .hero-exchange-pill strong{font-size:13px !important;}
  .hero-exchange-pill span{font-size:11px !important;line-height:1.4 !important;}
  .hero-exchange-band{margin-top:10px !important;padding:12px !important;border-radius:18px !important;}
  .hero-exchange-tags{gap:8px !important;}
  .hero-bscscan-link--compact{margin-top:10px !important;transform:none !important;padding:12px 13px !important;border-radius:18px !important;}
  .top-token-shell{margin-top:18px !important;}
  .page{padding-top:18px !important;}
}

@media (max-width: 640px){
  nav{padding:10px 12px !important;min-height:64px !important;gap:10px !important;align-items:center !important;flex-direction:row !important;}
  .nav-logo{align-self:center !important;}
  .nav-cta{display:none !important;}
  .hero{padding-top:104px !important;padding-left:12px !important;padding-right:12px !important;}
  .hero-inner{padding:0 !important;}
  .hero-copy{text-align:left !important;}
  .hero h1,.hero-copy h1{font-size:clamp(2rem,10.8vw,3rem) !important;line-height:1.02 !important;}
  .hero-sub{font-size:14px !important;line-height:1.65 !important;margin-top:14px !important;}
  .hero-exchange-title{font-size:24px !important;}
  .hero-exchange-title-compact{font-size:20px !important;}
  .hero-exchange-copy{font-size:13px !important;line-height:1.62 !important;}
  .hero-exchange-grid{grid-template-columns:1fr 1fr !important;gap:9px !important;}
  .hero-exchange-tag img{width:14px !important;height:14px !important;}
  .hero-exchange-tag span{font-size:11px !important;}
  .hero-bscscan-link--compact .hero-bscscan-icon{width:40px !important;height:40px !important;border-radius:13px !important;}
  .hero-bscscan-link--compact .hero-bscscan-title{font-size:12.5px !important;}
  .hero-bscscan-link--compact .hero-bscscan-sub{font-size:10.5px !important;}
  .hero-bscscan-link--compact .hero-bscscan-arrow{width:28px !important;height:28px !important;}

  .page{padding:16px 12px !important;}
  .topbar{margin-bottom:18px !important;gap:10px !important;}
  .topbar-left{width:100% !important;justify-content:space-between !important;align-items:center !important;flex-direction:row !important;gap:10px !important;}
  .topbar-left .brand{min-width:0 !important;}
  .brand-text{font-size:20px !important;line-height:1.1 !important;}
  .back-home-btn{width:100% !important;}
  .topbar-actions{display:grid !important;grid-template-columns:1fr !important;gap:10px !important;}
  .topbar-actions .btn,.topbar-actions button{width:100% !important;justify-content:center !important;}
  .hero{gap:16px !important;}
  .badge-row{gap:8px !important;}
  .mini-badge{width:100% !important;justify-content:center !important;text-align:center !important;}
}

@media (max-width: 420px){
  .hero{padding-top:100px !important;padding-left:10px !important;padding-right:10px !important;}
  .hero h1,.hero-copy h1{font-size:clamp(1.82rem,10.6vw,2.45rem) !important;}
  .hero-sub{font-size:13px !important;}
  .hero-exchange-card{padding:16px !important;border-radius:20px !important;}
  .hero-exchange-grid{grid-template-columns:1fr !important;gap:8px !important;}
  .hero-exchange-pill{min-height:0 !important;}
  .hero-exchange-band{gap:8px !important;}
  .hero-bscscan-link--compact{padding:11px 12px !important;}
  .hero-bscscan-link--compact .hero-bscscan-icon{width:38px !important;height:38px !important;}
  .hero-bscscan-link--compact .hero-bscscan-kicker{font-size:9px !important;}
  .brand-text{font-size:18px !important;}
  .wallet-btn{min-height:48px !important;}
}

/* ═══ FOMO Comparison Section — Responsive ═══ */
@media (max-width: 900px){
  #early-advantage{padding:64px 16px 56px !important;}
  #fomoCards{grid-template-columns:1fr !important;gap:18px !important;}
  #fomoCalcGrid{grid-template-columns:1fr !important;gap:18px !important;}
  #fomoCalcGrid > div[style*="width:1px"]{display:none !important;}
  #fomoTimeline > div:last-child{grid-template-columns:repeat(3,1fr) !important;gap:8px !important;}
}

@media (max-width: 640px){
  #early-advantage{padding:48px 12px 40px !important;}
  #fomoTimeline > div:last-child{grid-template-columns:repeat(2,1fr) !important;gap:6px !important;}
  #fomoTimeline > div:last-child > div:last-child{grid-column:1 / -1;}
  #fomoCountdown{gap:8px !important;}
  #fomoCountdown > div{min-width:60px !important;padding:12px 8px !important;}
  #fomoCountdown > div > div:first-child{font-size:24px !important;}
}

@media (max-width: 420px){
  #fomoTimeline > div:last-child{grid-template-columns:1fr 1fr !important;}
  #fomoCountdown > div{min-width:54px !important;}
  #fomoCountdown > div > div:first-child{font-size:22px !important;}
}

/* ═══════════════════════════════════════════════════════════════════════════
   Phone polish v2 — targets the gaps left by the original layer:
   - In-page presale widget (index.html#buy)
   - scanner-pro.html: radar, stats grid, source grid, results, chips
   - dashboard.html: metrics 2x2, sidebar nav scroll polish, tab panels, panels
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── In-page presale widget — tighten further on tight phones ───────────── */
@media (max-width: 480px){
  #shx-presale-widget{padding:13px 14px !important;border-radius:18px !important;}
  #shx-presale-widget .shx-pw-title{font-size:16px !important;}
  #shx-presale-widget .shx-pw-bar{height:7px !important;}
  #shx-presale-widget .shx-pw-field input{font-size:16px !important;} /* prevents iOS zoom-on-focus */
  #shx-presale-widget .shx-pw-cta{padding:11px !important;font-size:12px !important;}
  #shx-presale-widget .shx-pw-accepting-row .shx-pw-logo{width:15px !important;height:15px !important;}
  #shx-presale-widget .shx-pw-field{padding:7px 10px !important;}
  #shx-presale-widget .shx-pw-token-selector{padding:7px 10px !important;}
  /* Stable mobile button heights — override the global 44px from line 6 of this file
     which would otherwise make the widget's CTA and Apply chunky. The widget controls
     its own touch targets so the entire layout stays compact and pro on phones. */
  #shx-presale-widget input,
  #shx-presale-widget button{min-height:0 !important;}
  #shx-presale-widget .shx-pw-cta{min-height:42px !important;}
  #shx-presale-widget .shx-pw-ref input{min-height:36px !important;}
  #shx-presale-widget .shx-pw-ref button{min-height:36px !important;}
}
@media (max-width: 380px){
  #shx-presale-widget{padding:12px !important;}
  #shx-presale-widget .shx-pw-accepting-row{gap:4px !important;}
  #shx-presale-widget .shx-pw-accepting-row .shx-pw-logo{width:14px !important;height:14px !important;}
  #shx-presale-widget .shx-pw-ref-badge{display:none !important;} /* free up space */
  #shx-presale-widget .shx-pw-ref input{padding-right:10px !important;}
}

/* ── Dashboard: 4-up KPI grid → 2x2 on phones (NOT 1-up which wastes space) ─ */
@media (max-width: 640px){
  .dash-metrics{grid-template-columns:1fr 1fr !important;gap:10px !important;}
  .dash-metrics .metric{padding:12px 12px !important;}
  .dash-metrics .metric-val{font-size:18px !important;line-height:1.15 !important;}
  .dash-metrics .metric-label,
  .dash-metrics .metric-src{font-size:10px !important;}
  .dash-header{flex-direction:column !important;align-items:stretch !important;gap:12px !important;}
  .dash-title{font-size:22px !important;}
  .dash-subtitle{font-size:12px !important;}
  /* Sidebar nav becomes a horizontal scrolling tab strip. */
  .dash-sidebar{display:flex !important;flex-direction:row !important;overflow-x:auto !important;
    gap:8px !important;padding:8px 12px !important;border-bottom:1px solid rgba(255,255,255,.06) !important;
    border-right:none !important;width:100% !important;max-width:100% !important;}
  .dash-sidebar::-webkit-scrollbar{height:4px;}
  .dash-sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:2px;}
  .dash-sidebar-sec{display:none !important;}
  .dash-nav-item{flex:0 0 auto !important;white-space:nowrap !important;padding:8px 14px !important;
    font-size:12px !important;border-radius:100px !important;}
  .dash-layout{display:flex !important;flex-direction:column !important;}
  .dash-main{padding:14px 12px !important;}
  /* Inner panels */
  .dash-panel-title{font-size:13px !important;flex-wrap:wrap;gap:6px !important;}
  .simple-grid{grid-template-columns:1fr 1fr !important;gap:8px !important;}
  .dash-kpi{padding:11px 12px !important;}
  .dash-kpi small{font-size:10px !important;}
  .dash-kpi strong{font-size:14px !important;}
  /* Staking tier select label stack */
  .stake-form-grid{gap:10px !important;}
}
@media (max-width: 420px){
  .dash-metrics{grid-template-columns:1fr 1fr !important;gap:8px !important;}
  .dash-metrics .metric{padding:10px !important;}
  .dash-metrics .metric-val{font-size:16px !important;}
  .simple-grid{grid-template-columns:1fr !important;}
}

/* ── Scanner: radar + stat grid + watchlist + chips ─────────────────────── */
@media (max-width: 760px){
  .sstats{grid-template-columns:1fr 1fr 1fr !important;max-width:100% !important;margin:24px 0 0 !important;}
  .ss-c{padding:11px 8px !important;}
  .ss-v{font-size:18px !important;}
  .ss-l{font-size:10px !important;letter-spacing:.06em !important;}
  .radar-wrap{margin-top:18px !important;gap:12px !important;}
  .radar-ring,.radar-wrap > div{max-width:100% !important;}
  /* Source grid + cards */
  .srcgrid{gap:10px !important;}
  .scard,.src-card,.src-row{padding:12px !important;border-radius:14px !important;}
  /* Results / verdict block */
  .results,.results-grid{gap:12px !important;}
  .chk,.nc{padding:14px !important;border-radius:14px !important;}
  /* Header chip rail scrolls horizontally instead of wrapping. */
  .hchip-rail,.hchips,.h-chips{overflow-x:auto !important;flex-wrap:nowrap !important;
    padding-bottom:6px !important;}
  .hchip{flex:0 0 auto !important;white-space:nowrap !important;}
  /* Watchlist rows: tighter rhythm, smaller icons. */
  #watchlistPanel{padding:12px !important;}
  .wl-item{padding:10px 0 !important;font-size:13px !important;}
  .wl-sym{min-width:36px !important;}
  /* Scan input row */
  .scan-input-row,.scan-form,.scan-input{padding:12px !important;}
  .scan-deck{padding:0 !important;}
}
@media (max-width: 480px){
  .sstats{grid-template-columns:1fr 1fr !important;}
  .sstats .ss-c:nth-child(3){grid-column:1 / -1;}
  .ss-v{font-size:17px !important;}
  .radar-wrap{margin-top:14px !important;}
  /* Verdict score & emoji compact. */
  .v-score-circle,.vscore-circle,.v-emo,.v-mood{transform:scale(.92);transform-origin:left top;}
}

/* ── Index hero polish for the slimmer widget (no card, just the widget) ── */
@media (max-width: 768px){
  .hero-aside{padding-top:6px !important;}
  .hero-aside > *{width:100% !important;}
  /* Token ribbon at hero bottom — allow horizontal scroll on phones. */
  .top-token-ribbon{overflow-x:auto !important;}
}

/* ═══ Top nav on phones: hide ALL bulky CTAs, show hamburger in the nav. ═══
   Below 900px we want the nav to be just: logo (left) + hamburger (right).
   The hamburger opens the existing mobile-quick-sheet (no FAB needed). */
@media (max-width: 900px){
  /* Cancel the previous "show nav-cta full width" rule (lines 17-18 above) — at this
     size we want it hidden entirely; the menu sheet holds Overview + Connect Wallet. */
  .nav-cta{display:none !important;}
  .nav-links{display:none !important;}
  /* Show the in-nav hamburger button at this breakpoint up. */
  .nav-menu-btn{display:inline-flex !important;}
  /* The old bottom-right FAB is gone from markup, but if any leftover stylesheet still
     reserves space, force it hidden as a safety net. */
  .mobile-menu-fab{display:none !important;}
  /* Force-show normal nav layout (row) — the earlier `align-items:flex-start` could
     squish things on tablet widths. */
  nav{
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    height:60px !important;min-height:60px !important;
    padding:0 16px !important;
  }
  /* Hero clearance: 60px nav + 12px breathing room. */
  .hero{padding-top:84px !important;}
}
@media (max-width: 480px){
  nav{padding:0 12px !important;height:56px !important;min-height:56px !important;}
  .nav-logo{font-size:17px !important;}
  .nav-menu-btn{width:38px !important;height:38px !important;border-radius:10px !important;}
  .nav-menu-btn svg{width:20px !important;height:20px !important;}
  .hero{padding-top:78px !important;}
}

/* ═══ Scanner-pro.html mobile fixes ═══════════════════════════════════════
   The .sbox is a single horizontal row on desktop: icon | input | chain | scan-btn.
   On phones we stack: input row, then a row with chain selector + Scan button.
   Radar is a fixed 180x180 — that's fine; we just need to make sure it stays
   centered, doesn't overflow, and the parent container has room to show it. */
@media (max-width: 760px){
  /* Search box: stack the chain selector and Scan button below the input on a 2nd row. */
  .sbox{
    flex-wrap:wrap !important;
    border-radius:14px !important;
    padding:6px 6px 6px 4px !important;
  }
  .sbox .sico{padding:0 8px 0 10px !important;}
  .sbox .sinput{
    flex:1 1 200px !important;
    min-width:0 !important;
    font-size:14px !important;
    padding:14px 4px !important;
  }
  /* Chain selector + Scan button take the full second row. */
  .sbox .csel{order:3 !important;flex:1 1 50% !important;}
  .sbox .cbtn{width:100% !important;justify-content:center !important;padding:10px 12px !important;}
  .sbox .scanbtn{
    order:4 !important;flex:1 1 45% !important;
    min-width:0 !important;padding:12px 14px !important;
    margin-left:6px !important;
  }
  /* Chain dropdown — anchor to viewport on phones so it can't overflow the screen. */
  .cdrop{
    left:8px !important;right:8px !important;
    width:auto !important;max-width:none !important;
    transform:none !important;
  }
  /* Make the scan deck breathe and show the radar below cleanly. */
  .scan-deck{margin:0 auto !important;}
  /* Radar: ensure container has clearance + auto-center. */
  .radar-wrap{padding:14px 0 !important;}
  .radar{margin:0 auto !important;}
}
@media (max-width: 480px){
  .sbox{padding:4px 4px 4px 2px !important;}
  .sbox .sinput{font-size:13px !important;padding:12px 4px !important;}
  .sbox .sico{padding:0 6px 0 8px !important;}
  .sbox .sico svg{width:14px !important;height:14px !important;}
  /* Slightly smaller radar on very tight screens. */
  .radar{width:160px !important;height:160px !important;}
}

/* ═══ Tokenomics section — phone polish ═══════════════════════════════════
   Desktop: 2-column grid (donut | cards) with hardcoded #allocChart 360x360.
   On phones the donut overflowed and the 2-column card grid squished labels.
   We fluid-scale the donut SVG, drop the giant min-height, and let cards
   stack into 1 column at narrow widths. */
@media (max-width: 760px){
  .tokenomics-v2{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }
  .donut-wrap{
    min-height:0 !important;
    padding:18px !important;
    border-radius:22px !important;
  }
  /* The chart container is hardcoded to 360x360 inline; cap it to viewport. */
  #allocChart{
    width:min(280px, 70vw) !important;
    height:min(280px, 70vw) !important;
  }
  #allocChart svg{width:100% !important;height:100% !important;}
  .token-panel{
    min-height:0 !important;
    padding:18px !important;
    border-radius:22px !important;
  }
  .token-panel h3{
    font-size:28px !important;
    margin-bottom:16px !important;
  }
  .token-card-grid{gap:10px !important;}
  .tsc{
    min-height:0 !important;
    padding:12px 12px 12px 14px !important;
  }
  .tsc .label{font-size:11px !important;margin-bottom:5px !important;}
  .tsc .value{font-size:14px !important;line-height:1.25 !important;}
  .token-brand{font-size:18px !important;margin-top:14px !important;letter-spacing:.12em !important;}
}
@media (max-width: 480px){
  /* On very narrow phones, drop to a single column so values don't truncate. */
  .token-card-grid{grid-template-columns:1fr !important;gap:8px !important;}
  #allocChart{width:min(240px, 78vw) !important;height:min(240px, 78vw) !important;}
  .token-panel h3{font-size:24px !important;}
}