/* ═══════════════════════════════════════════════════════════
   SATOSHIMEDIA TERMINAL — v5 REDESIGN
   Hero chart. Clear hierarchy. Vertical flow. No clutter.
   ═══════════════════════════════════════════════════════════ */

@keyframes sh{0%{background-position:200% 0}100%{background-position:-200% 0}}
@keyframes sc{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes bl{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(232,160,32,.6)}50%{opacity:.5;box-shadow:0 0 0 6px rgba(232,160,32,0)}}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

:root{
  --void:#08090d;--base:#0c0e14;--raised:#11141c;--surf:#171b26;--over:#1e2333;
  --edge:rgba(255,255,255,.06);--ehi:rgba(255,255,255,.1);
  --t1:#eae8f0;--t2:#9896ab;--t3:#5e5b72;--t4:#3a3850;
  --up:#00d4aa;--upd:rgba(0,212,170,.1);--dn:#ff4466;--dnd:rgba(255,68,102,.1);
  --am:#e8a020;--amd:rgba(232,160,32,.07);
  --cy:#5090ff;--bl:#7060ff;
  --mono:'IBM Plex Mono',monospace;--sans:'Darker Grotesque',system-ui,sans-serif;
  --gutter:16px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--void);color:var(--t1);font:12px/1.55 var(--mono);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%}table{border-collapse:collapse;width:100%}button{font:inherit;cursor:pointer;border:0;background:0;color:inherit}
::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--edge);border-radius:3px}
/* Skeleton — improved with spinner */
.sk{height:120px;background:linear-gradient(90deg,var(--surf) 25%,var(--over) 50%,var(--surf) 75%);background-size:200% 100%;animation:sh 1.8s ease-in-out infinite;border-radius:6px;position:relative;display:flex;align-items:center;justify-content:center}
.sk::after{content:'';width:20px;height:20px;border:2px solid var(--edge);border-top-color:var(--am);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.sk--sq{height:100px}
.up{color:var(--up)}.dn{color:var(--dn)}

/* ═══════════════ HEADER ═══════════════ */
.sys{
  display:flex;align-items:center;justify-content:space-between;
  height:50px;padding:0 24px;
  background:var(--base);
  border-bottom:1px solid var(--edge);
  position:sticky;top:0;z-index:900;
}
.sys__l,.sys__r{display:flex;align-items:center;gap:14px}
.logo{display:flex;align-items:center;gap:7px;font:900 20px var(--sans);letter-spacing:-.3px}
.logo em{font-style:normal;color:var(--am)}
.ld{color:var(--am);font-size:18px;filter:drop-shadow(0 0 8px rgba(232,160,32,.4))}
.lt{font:700 7px/1 var(--mono);letter-spacing:2.5px;color:var(--t3);padding:3px 8px;border:1px solid var(--edge);border-radius:4px;background:var(--surf)}
.dv{width:1px;height:20px;background:var(--edge)}
.sys__live{display:flex;align-items:center;gap:5px;font-size:9px;letter-spacing:2px;color:var(--am);font-weight:700}
.pulse{width:7px;height:7px;background:var(--am);border-radius:50%;animation:bl 2s ease infinite}
.sys__clock{font-size:11px;color:var(--t2)}
.sys__btn{
  font-size:9px;letter-spacing:.8px;font-weight:600;color:var(--t3);
  display:inline-flex;align-items:center;gap:4px;
  padding:6px 14px;border:1px solid var(--edge);border-radius:6px;background:var(--surf);
  transition:all .25s ease;
}
.sys__btn:hover{color:var(--t1);border-color:var(--ehi);background:var(--over);transform:translateY(-1px);box-shadow:0 6px 20px rgba(0,0,0,.4)}
.sys__btn--tv:hover{color:var(--cy);border-color:rgba(80,144,255,.25)}
.sys__btn i{font-size:13px}

/* ═══════════════ TICKER ═══════════════ */
.ticker{height:38px;overflow:hidden;background:var(--base);border-bottom:1px solid var(--edge);position:relative}
.ticker::before,.ticker::after{content:'';position:absolute;top:0;width:60px;height:100%;z-index:2;pointer-events:none}
.ticker::before{left:0;background:linear-gradient(90deg,var(--base),transparent)}
.ticker::after{right:0;background:linear-gradient(-90deg,var(--base),transparent)}
.ticker__track{display:flex;align-items:center;height:100%;white-space:nowrap;animation:sc 50s linear infinite}
.tick{display:inline-flex;align-items:center;gap:8px;padding:0 22px;height:100%;border-right:1px solid var(--edge);font-size:11px}
.tick__s{color:var(--t2);font-weight:700;font-size:10px;letter-spacing:.5px}
.tick__p{color:var(--t1);font-weight:600}
.tick__c{font-weight:700;font-size:10px}

/* ═══════════════ METRICS BAR ═══════════════ */
.mbar{display:flex;align-items:stretch;background:var(--raised);border-bottom:1px solid var(--edge);overflow-x:auto;scrollbar-width:none}
.mbar::-webkit-scrollbar{display:none}
.m{display:flex;align-items:center;gap:7px;padding:10px 18px;border-right:1px solid var(--edge);white-space:nowrap;flex-shrink:0}
.mk{font-size:8px;letter-spacing:1.2px;color:var(--t4);font-weight:700}
.mv{font-size:12px;color:var(--t1);font-weight:700}
.md{font-size:10px;font-weight:700}

/* ═══════════════ TERMINAL — HERO CHART LAYOUT ═══════════════ */
.term{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:0;
  overflow:hidden;
  grid-template-areas:
    "chart   chart   rsi"
    "ad1     ad1     ad1"
    "tokens  tokens  tokens"
    "pulse   fng     deriv"
    "trend   news    news"
    "side    side    side"
    "ad3     ad3     ad3"
    "heat    heat    heat"
    "defi    btc     stbl"
    "macro   macro   macro"
    "detail  detail  detail";
}
.mod--tokens{grid-area:tokens}.mod--chart{grid-area:chart}.mod--detail{grid-area:detail}
.mod--rsi{grid-area:rsi}
.mod--pulse{grid-area:pulse}.mod--fng{grid-area:fng}.mod--deriv{grid-area:deriv}
.mod--trend{grid-area:trend}.mod--side{grid-area:side}.mod--macro{grid-area:macro}
.mod--news{grid-area:news}.mod--heat{grid-area:heat}
.mod--defi{grid-area:defi}.mod--btc{grid-area:btc}.mod--stbl{grid-area:stbl}
.ad-row--1{grid-area:ad1}.ad-row--2{grid-area:ad2}.ad-row--3{grid-area:ad3}

/* ═══════════════ MODULE ═══════════════ */
.mod{background:var(--base);display:flex;flex-direction:column;min-height:0;min-width:0;border:1px solid var(--edge);overflow:hidden}
.mh{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 18px;border-bottom:1px solid var(--edge);background:var(--raised);flex-shrink:0;
}
.mt{font-size:11px;letter-spacing:1.5px;font-weight:800;color:var(--t2);display:flex;align-items:center;gap:7px;text-transform:uppercase;font-family:var(--sans)}
.mt i{font-size:14px;color:var(--am)}
.ms{font-size:9px;letter-spacing:.5px;color:var(--t4);font-weight:500}
.ms--a{color:var(--t3);transition:color .2s}.ms--a:hover{color:var(--cy)}
.ms--a i{font-size:8px;margin-left:2px}
.mb{padding:14px 18px;flex:1;min-height:0;min-width:0}
.mb--scroll{overflow-y:auto;overflow-x:auto;max-height:500px;-webkit-overflow-scrolling:touch}

/* ═══════════════ CHART — HERO ═══════════════ */
.mod--chart{border:none;border-bottom:1px solid var(--edge);overflow:hidden;min-width:0}
.ctabs{display:flex;border-bottom:1px solid var(--edge);overflow-x:auto;scrollbar-width:none;background:var(--raised);padding:0 8px}
.ctabs::-webkit-scrollbar{display:none}
.ct{padding:10px 16px;font-size:12px;font-weight:700;color:var(--t3);border-bottom:3px solid transparent;transition:all .15s;white-space:nowrap;letter-spacing:.5px}
.ct:hover{color:var(--t2)}
.ct.on{color:var(--am);border-bottom-color:var(--am);background:var(--amd)}
.chart-frame{height:520px;overflow:hidden;width:100%;max-width:100%}

/* ═══════════════ SEARCH ═══════════════ */
.search{position:relative;display:flex;align-items:center}
.search i{position:absolute;left:10px;font-size:12px;color:var(--t3)}
.search input{background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:6px 10px 6px 30px;font:11px var(--mono);color:var(--t1);width:min(180px,40vw);outline:none;transition:all .2s}
.search input:focus{border-color:var(--am);box-shadow:0 0 0 3px rgba(232,160,32,.08)}
.search input::placeholder{color:var(--t4)}

/* ═══════════════ TOKEN TABLE ═══════════════ */
.tbl{font-size:11px}
.tbl thead{position:sticky;top:0;z-index:1;background:var(--base)}
.tbl th{padding:10px 8px;font-size:9px;letter-spacing:1px;color:var(--t3);font-weight:700;text-align:right;border-bottom:1px solid var(--edge);cursor:pointer;user-select:none}
.tbl th:hover{color:var(--am)}.thr{text-align:center!important;width:30px}.thn{text-align:left!important;min-width:90px}.ths{width:50px}
.tbl td{padding:8px;text-align:right;border-bottom:1px solid var(--edge);transition:all .12s}
.tbl tr{cursor:pointer}
.tbl tr:hover td{background:var(--surf)}
.tbl tr.act td{background:var(--amd);box-shadow:inset 3px 0 0 var(--am)}
.tbl td:first-child{text-align:center;color:var(--t4);font-size:11px;font-weight:600}
.tbl td:nth-child(2){text-align:left}
.coin{display:flex;align-items:center;gap:8px}
.coin__i{width:24px;height:24px;border-radius:50%;flex-shrink:0}
.coin__s{font:800 12px var(--sans);color:var(--t1)}
.coin__n{font-size:9px;color:var(--t3);max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tbl__p{font-weight:700;color:var(--t1);font-size:12px}
.spark{width:64px;height:26px}
.token-actions{display:flex;align-items:center;justify-content:space-between;padding:10px 18px;border-top:1px solid var(--edge);background:var(--raised)}
.load-btn{font-size:10px;color:var(--cy);font-weight:700;padding:7px 16px;border:1px solid var(--edge);border-radius:6px;transition:all .2s}
.load-btn:hover{border-color:var(--cy);background:rgba(80,144,255,.06)}
.token-count{font-size:10px;color:var(--t4)}

/* ═══════════════ DETAIL PANEL ═══════════════ */
.mod--detail .mb{font-size:11px}
.det-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.det-item{background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:10px;transition:border-color .2s}
.det-item:hover{border-color:var(--ehi)}
.det-item__k{font-size:8px;letter-spacing:1px;color:var(--t3);text-transform:uppercase;margin-bottom:3px}
.det-item__v{font:800 15px var(--sans)}

/* ═══════════════ MARKET PULSE ═══════════════ */
.pulse-gauge{text-align:center;padding:16px}
.pulse-val{font:900 52px var(--sans);line-height:1;letter-spacing:-2px}
.pulse-lbl{font:800 12px var(--mono);text-transform:uppercase;letter-spacing:2.5px;margin-top:6px}
.pulse-sub{font-size:9px;color:var(--t3);margin-top:8px;line-height:1.5}
.pulse-bars{display:flex;gap:2px;margin-top:12px;height:10px}
.pulse-bar{flex:1;border-radius:3px}

/* ═══════════════ F&G ═══════════════ */
.fng{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px}
.fng__val{font:900 48px var(--sans);text-align:center;line-height:1;letter-spacing:-2px}
.fng__lbl{font:800 12px var(--mono);text-transform:uppercase;letter-spacing:2.5px;text-align:center}
.fng__sub{font-size:9px;color:var(--t3)}
.fng__hist{display:flex;gap:5px;width:100%;margin-top:8px}
.fng__h{flex:1;text-align:center;background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:8px 4px;transition:border-color .2s}
.fng__h:hover{border-color:var(--ehi)}
.fng__hp{font-size:8px;color:var(--t4);letter-spacing:.8px;text-transform:uppercase}
.fng__hv{font:800 18px var(--sans);margin:3px 0}
.fng__hc{font-size:8px;font-weight:700}

/* ═══════════════ DERIVATIVES ═══════════════ */
.dr{display:flex;align-items:center;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--edge);font-size:11px}
.dr:last-child{border-bottom:none}
.dr__sym{font-weight:700;width:55px;color:var(--t2)}
.dr__fr{width:80px;text-align:right;font-weight:700}
.dr__oi{width:70px;text-align:right;color:var(--t3)}
.ls-bar{height:14px;display:flex;border-radius:4px;overflow:hidden;margin-top:10px;background:var(--edge)}
.ls-bar__l{background:linear-gradient(90deg,var(--up),rgba(0,212,170,.5))}
.ls-bar__s{background:linear-gradient(90deg,rgba(255,68,102,.5),var(--dn))}
.ls-info{display:flex;justify-content:space-between;font-size:10px;margin-top:5px;font-weight:700}

/* ═══════════════ TRENDING ═══════════════ */
.tr{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--edge)}
.tr:last-child{border-bottom:none}
.tr__r{width:22px;font-size:11px;color:var(--t4);font-weight:700;text-align:center}
.tr__ico{width:22px;height:22px;border-radius:50%}
.tr__info{flex:1;min-width:0}
.tr__name{font:800 12px var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr__sym{font-size:9px;color:var(--t4);font-weight:600}
.tr__data{text-align:right}
.tr__price{font-size:11px;font-weight:600}
.tr__chg{font-size:10px;font-weight:700}

/* ═══════════════ NEWS ═══════════════ */
.news-cols{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--edge);min-height:200px;overflow:hidden}
.news-col{background:var(--base);padding:14px 18px;min-width:0;overflow:hidden}
.nc__h{font:800 10px var(--sans);letter-spacing:2px;color:var(--am);text-transform:uppercase;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--edge)}
.ni{padding:10px 0;border-bottom:1px solid var(--edge)}
.ni:last-child{border-bottom:none}
.ni__src{font-size:9px;color:var(--t4);letter-spacing:.8px;text-transform:uppercase;margin-bottom:3px;display:flex;align-items:center;gap:5px}
.ni__title{font:600 13px/1.4 var(--sans);color:var(--t1)}
.ni__title a{color:inherit;transition:color .2s}.ni__title a:hover{color:var(--cy)}
.ni__time{font-size:9px;color:var(--t4);margin-top:3px}
.badge{font-size:8px;padding:2px 7px;border-radius:4px;font-weight:700;letter-spacing:.3px}
.badge--up{background:var(--upd);color:var(--up)}.badge--dn{background:var(--dnd);color:var(--dn)}.badge--n{background:rgba(144,141,168,.06);color:var(--t2)}

/* ═══════════════ HEATMAP ═══════════════ */
.hg{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(68px,30%),1fr));gap:3px}
.hc{padding:12px 4px;text-align:center;border-radius:5px;cursor:pointer;transition:all .15s;border:1px solid transparent}
.hc:hover{transform:scale(1.08);z-index:2;border-color:rgba(255,255,255,.12);box-shadow:0 6px 20px rgba(0,0,0,.5)}
.hc__s{font-size:11px;font-weight:800;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.hc__p{font-size:9px;color:rgba(255,255,255,.85);margin-top:2px;font-weight:700}

/* ═══════════════ MACRO ═══════════════ */
.macro-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--edge);overflow:hidden}
.macro-grid>div{background:var(--base);height:220px;overflow:hidden;min-width:0}

/* ═══════════════ DeFi ═══════════════ */
.defi-total{font:900 28px var(--sans);margin-bottom:10px;letter-spacing:-.5px}
.defi-chains{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.dc{display:flex;align-items:center;gap:8px;font-size:11px}
.dc__n{width:70px;color:var(--t2);font-weight:700;font-family:var(--sans)}
.dc__bar{flex:1;height:8px;background:var(--edge);border-radius:4px;overflow:hidden}
.dc__fill{height:100%;border-radius:4px;background:linear-gradient(90deg,var(--am),rgba(232,160,32,.3))}
.dc__v{width:70px;text-align:right;color:var(--t3)}
.dg{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}
.di{background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:12px;transition:all .2s}
.di:hover{border-color:var(--ehi);transform:translateY(-1px);box-shadow:0 4px 16px rgba(0,0,0,.25)}
.di__n{font-size:11px;font-weight:700;display:flex;align-items:center;gap:5px;margin-bottom:3px}.di__n img{width:16px;height:16px;border-radius:50%}
.di__ch{font-size:9px;color:var(--t4)}
.di__tv{font:900 17px var(--sans);margin-top:5px}
.di__d{font-size:10px;font-weight:700;margin-top:2px}

/* ═══════════════ BTC NETWORK ═══════════════ */
.bg{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}
.bs{background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:12px}
.bs:hover{border-color:var(--ehi)}
.bs__k{font-size:8px;letter-spacing:1px;color:var(--t4);text-transform:uppercase;margin-bottom:3px;font-weight:700}
.bs__v{font:900 16px var(--sans)}

/* ═══════════════ STABLECOINS ═══════════════ */
.stbl-total{font:900 22px var(--sans);margin-bottom:8px}
.sr{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:var(--surf);border:1px solid var(--edge);border-radius:6px;font-size:11px;margin-bottom:4px;overflow:hidden}
.sr:hover{border-color:var(--ehi)}
.sr__n{font:700 12px var(--sans);width:60px}
.sr__m{color:var(--t2);flex:1;text-align:right;margin-right:10px}
.sr__bar{width:50px;height:5px;background:var(--edge);border-radius:3px;overflow:hidden}
.sr__f{height:100%;background:linear-gradient(90deg,var(--am),rgba(232,160,32,.3));border-radius:3px}

/* ═══════════════ SIDEBAR (now full-width row) ═══════════════ */
.mod--side{border:none}
.mod--side .mb{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;padding:18px 24px}
.ad-f{border:1px solid var(--edge);border-radius:6px;overflow:hidden;position:relative;background:var(--surf)}
.ad-f::after{content:'Ad';position:absolute;top:5px;right:8px;font-size:8px;color:var(--t4);pointer-events:none;font-family:var(--mono)}
.eco{display:flex;flex-direction:column;gap:6px}
.ec{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--surf);border:1px solid var(--edge);border-radius:6px;transition:all .25s}
.ec:hover{border-color:var(--ehi);background:var(--over);transform:translateY(-1px);box-shadow:0 6px 20px rgba(0,0,0,.3)}
.ec strong{font:700 12px var(--sans);display:block}.ec span{font-size:10px;color:var(--t3)}
.ec>i:last-child{margin-left:auto;color:var(--t4);font-size:10px;transition:transform .2s}
.ec:hover>i:last-child{transform:translateX(3px);color:var(--t2)}
.ec__i{font-size:20px;flex-shrink:0}.ec__i--tv{color:var(--cy)}.ec__i--cl{color:var(--up)}
.donate-cta{width:100%;padding:12px;background:linear-gradient(135deg,rgba(255,68,102,.05),rgba(232,160,32,.05));border:1px solid rgba(232,160,32,.12);border-radius:6px;color:var(--t1);font:700 12px var(--sans);display:flex;align-items:center;justify-content:center;gap:6px;transition:all .25s}
.donate-cta:hover{border-color:rgba(232,160,32,.25);transform:translateY(-1px);box-shadow:0 4px 16px rgba(232,160,32,.06)}
.donate-cta i{color:var(--dn)}

/* ═══════════════ AD ROWS ═══════════════ */
.ad-row{background:var(--raised);padding:14px 24px;border-top:1px solid var(--edge);border-bottom:1px solid var(--edge);display:flex;justify-content:center;overflow:hidden}
.ad-row iframe{max-width:100%!important;width:100%!important;height:90px}

/* ═══════════════ FOOTER ═══════════════ */
/* ═══════════════ FOOTER ═══════════════ */
.voices-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr));gap:8px}
.voice-card{display:block;background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:14px;transition:all .25s}
.voice-card:hover{border-color:var(--ehi);transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.3)}
.vc__role{font-size:9px;color:var(--t4);letter-spacing:.8px;text-transform:uppercase;margin-bottom:4px}
.vc__name{font:800 15px var(--sans);color:var(--t1);margin-bottom:2px}
.vc__handle{font-size:10px;color:var(--cy);font-weight:600;margin-bottom:6px}
.vc__impact{font-size:10px;color:var(--t3);line-height:1.4}
.influencer-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--edge)}
.inf-col{background:var(--base);padding:8px;min-height:200px}
.fees-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(170px,100%),1fr));gap:6px}
.fee-item{background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:12px;transition:border-color .2s}
.fee-item:hover{border-color:var(--ehi)}
.fee-item__name{font:700 12px var(--sans);display:flex;align-items:center;gap:5px;margin-bottom:4px}
.fee-item__name img{width:16px;height:16px;border-radius:50%}
.fee-item__fees{font:900 16px var(--sans);color:var(--am)}
.fee-item__rev{font-size:10px;color:var(--t3);margin-top:2px}
.bridge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr));gap:6px}
.br-item{background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:12px;transition:border-color .2s}
.br-item:hover{border-color:var(--ehi)}
.br-item__name{font:700 11px var(--sans);margin-bottom:3px}
.br-item__vol{font:900 15px var(--sans);color:var(--cy)}
.br-item__chg{font-size:10px;font-weight:700;margin-top:2px}
.gas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(130px,100%),1fr));gap:6px}
.gas-item{background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:12px;text-align:center;transition:border-color .2s}
.gas-item:hover{border-color:var(--ehi)}
.gas-item__chain{font:700 12px var(--sans);margin-bottom:4px;color:var(--t2)}
.gas-item__fee{font:900 18px var(--sans);color:var(--up)}
.gas-item__usd{font-size:10px;color:var(--t3);margin-top:2px}
.ta-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--edge);overflow:hidden}
.ta-grid>div{background:var(--base);height:420px;overflow:hidden;min-width:0}

/* Dominance visual */
.dom-stack{display:flex;height:14px;border-radius:4px;overflow:hidden;margin-bottom:10px;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.dom-total{font-size:11px;color:var(--t3);margin-bottom:10px;font-weight:600}
.dom-total strong{color:var(--t1);font:900 14px var(--sans)}
.dom-list{display:flex;flex-direction:column;gap:6px}
.dom-row{display:flex;align-items:center;gap:8px;font-size:11px}
.dom-color{width:10px;height:10px;border-radius:3px;flex-shrink:0}
.dom-sym{width:40px;font:700 11px var(--sans);color:var(--t1)}
.dom-bar-wrap{flex:1;height:8px;background:var(--edge);border-radius:3px;overflow:hidden}
.dom-bar-fill{height:100%;border-radius:3px;transition:width .5s ease}
.dom-pct{width:45px;text-align:right;font-weight:700;color:var(--t1);font-family:var(--sans)}
.dom-mcap{width:65px;text-align:right;color:var(--t3);font-size:10px}

/* SECTORS */
.sector-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:6px}
.sec-item{background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:12px;display:flex;align-items:center;justify-content:space-between;transition:border-color .2s}
.sec-item:hover{border-color:var(--ehi)}
.sec-item__name{font:700 12px var(--sans);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sec-item__chg{font:800 14px var(--sans);margin-left:8px}
.sec-item__mcap{font-size:9px;color:var(--t4);margin-top:2px}

/* EXCHANGES */
.exch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px}
.exch-item{background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:12px;transition:border-color .2s}
.exch-item:hover{border-color:var(--ehi)}
.exch-item__rank{font-size:10px;color:var(--t4);font-weight:700;margin-bottom:2px}
.exch-item__name{font:700 13px var(--sans);display:flex;align-items:center;gap:5px;margin-bottom:4px}
.exch-item__name img{width:18px;height:18px;border-radius:4px}
.exch-item__vol{font:900 16px var(--sans);color:var(--cy)}
.exch-item__trust{font-size:9px;color:var(--t3);margin-top:2px}

/* DOMINANCE */
.dom-bars{display:flex;flex-direction:column;gap:6px}
.dom-row{display:flex;align-items:center;gap:10px}
.dom-row__label{width:50px;font:700 12px var(--sans);color:var(--t2);text-align:right}
.dom-row__bar{flex:1;height:28px;background:var(--edge);border-radius:6px;overflow:hidden;position:relative}
.dom-row__fill{height:100%;border-radius:6px;display:flex;align-items:center;padding-left:10px;font:700 11px var(--mono);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);transition:width .5s ease}
.dom-row__pct{width:55px;font:800 13px var(--sans);text-align:left}

/* CONVERTER */
.converter{max-width:400px;margin:0 auto}
.conv-row{display:flex;gap:8px}
.conv-input{flex:1;background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:12px;font:700 18px var(--sans);color:var(--t1);outline:none;text-align:center}
.conv-input:focus{border-color:var(--am)}
.conv-select{background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:12px 16px;font:700 14px var(--sans);color:var(--t1);outline:none;cursor:pointer}
.conv-select:focus{border-color:var(--am)}
.conv-result{text-align:center;font:900 28px var(--sans);color:var(--am);padding:8px}
.conv-sub{text-align:center;font-size:11px;color:var(--t3);margin-top:4px}

/* ═══════════════ MOMENTUM SCANNER ═══════════════ */
.momentum-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr));gap:6px}
.mom-card{background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:12px;transition:border-color .2s}
.mom-card:hover{border-color:var(--ehi)}
.mom-head{display:flex;align-items:center;gap:6px;margin-bottom:8px}
.mom-logo{font-size:16px;flex-shrink:0}
.mom-chain{font:700 13px var(--sans);flex:1}
.mom-price{font:600 12px var(--mono);color:var(--t1)}
.mom-indicators{display:flex;gap:12px}
.mom-rsi{flex:1}.mom-macd{flex:1}
.mom-label{font-size:8px;letter-spacing:1px;color:var(--t4);text-transform:uppercase;margin-bottom:2px;font-weight:700}
.mom-val{font:800 16px var(--sans);margin-bottom:4px}
.mom-bar{height:6px;background:var(--edge);border-radius:3px;position:relative;overflow:visible;margin-bottom:4px}
.mom-bar-fill{height:100%;border-radius:3px;transition:width .5s}
.mom-bar-marker{position:absolute;top:-2px;width:2px;height:10px;background:var(--t1);border-radius:1px;transform:translateX(-1px)}
.mom-signal{font-size:9px;font-weight:700;letter-spacing:.5px}

/* ═══════════════ PAIRED GRID (after-grid 2-col layout) ═══════════════ */
.paired-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--edge);border:1px solid var(--edge);overflow:hidden}
.mod--pair{background:var(--base);border:none;overflow:hidden;min-width:0}

.foot{background:var(--raised);border-top:1px solid var(--edge);padding:24px;font-size:10px;color:var(--t3)}
.foot__r{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:10px}
.foot__r a,.foot__d a{color:var(--am);transition:color .2s}.foot__r a:hover,.foot__d a:hover{color:var(--t1)}
.foot__d{font-size:9px;color:var(--t4);line-height:1.7}

/* ═══════════════ DONATE MODAL ═══════════════ */
.don-ov{position:fixed;inset:0;background:rgba(0,0,0,.8);backdrop-filter:blur(10px);z-index:9999;display:none;align-items:center;justify-content:center;padding:20px}.don-ov.on{display:flex}
.don-m{background:var(--base);border:1px solid var(--edge);border-radius:10px;max-width:420px;width:100%;max-height:90vh;overflow-y:auto;padding:24px;box-shadow:0 24px 80px rgba(0,0,0,.6);animation:fadeIn .3s ease}
.dm-hdr{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}
.dm-hdr h3{font:900 20px var(--sans);display:flex;align-items:center;gap:8px}.dm-sub{font-size:11px;color:var(--t3);margin-top:4px}
.dm-x{font-size:18px;color:var(--t3);padding:4px;transition:color .2s}.dm-x:hover{color:var(--t1)}
.dm-tabs{display:flex;gap:5px;margin-bottom:14px}
.dm-tab{padding:8px 16px;font-size:11px;font-weight:700;border:1px solid var(--edge);border-radius:6px;display:flex;align-items:center;gap:5px;transition:all .2s}
.dm-tab.active{border-color:var(--am);color:var(--am);background:var(--amd)}
.dm-tok{font-size:11px;color:var(--t2);margin-bottom:10px}
.dm-token{display:inline-block;padding:3px 8px;border-radius:4px;font-size:10px;font-weight:700;margin:0 2px}
.dm-token.sol{background:rgba(153,69,255,.1);color:#9945FF}.dm-token.eth{background:rgba(98,126,234,.1);color:#627EEA}.dm-token.usdc{background:rgba(38,161,123,.1);color:#26a17b}
.dm-inst{font-size:11px;color:var(--t3);margin-bottom:14px;line-height:1.5;padding:12px;background:var(--surf);border-radius:6px;border:1px solid var(--edge)}
.dm-qr{display:flex;justify-content:center;margin-bottom:14px}
.dm-addr{display:flex;align-items:center;gap:6px;background:var(--surf);border:1px solid var(--edge);border-radius:6px;padding:10px;margin-bottom:12px;word-break:break-all}
.dm-addr code{font-size:10px;color:var(--t2);flex:1}.dm-addr button{padding:4px 8px;color:var(--t2)}.dm-addr button:hover{color:var(--cy)}
.dm-wbtn{display:block;text-align:center;padding:12px;background:linear-gradient(135deg,var(--am),#f0c060);color:var(--void);font-weight:800;font-size:13px;border-radius:6px;margin-bottom:12px;transition:opacity .2s}.dm-wbtn:hover{opacity:.85}
.dm-sec{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--t3);padding:10px;background:var(--surf);border-radius:6px;border:1px solid var(--edge)}
.dm-sec i{color:var(--up);font-size:15px;flex-shrink:0}

/* ═══════════════ RESPONSIVE ═══════════════ */

/* Global overflow protection */
*{max-width:100%;box-sizing:border-box}
iframe{max-width:100%}
.ad-row iframe{max-width:100%;width:100%;height:auto;min-height:90px}
/* TradingView widget containment */
.tradingview-widget-container,.tradingview-widget-container__widget{width:100%!important;max-width:100%!important;overflow:hidden!important}
.tradingview-widget-copyright{font-size:0!important;height:0!important;overflow:hidden!important}

@media(max-width:1100px){
  .influencer-grid{grid-template-columns:repeat(3,1fr)}
  .ta-grid{grid-template-columns:repeat(3,1fr)}
  .paired-grid{grid-template-columns:1fr 1fr}
  .term{grid-template-columns:1fr 1fr;grid-template-areas:
    "chart chart""rsi rsi""ad1 ad1""tokens tokens"
    "pulse fng""deriv trend""news news""side side""ad3 ad3""heat heat"
    "defi btc""stbl stbl""macro macro""detail detail"}
  .mod--detail{display:none!important}
  .macro-grid{grid-template-columns:1fr 1fr}
  .det-grid{grid-template-columns:1fr 1fr}
}

@media(max-width:768px){
  /* Header compact */
  .sys{height:44px;padding:0 10px}
  .sys__r{gap:4px}
  .sys__btn{padding:4px 6px;font-size:0;border:none;background:none}.sys__btn i{font-size:16px}
  .sys__btn:first-child{font-size:8px;padding:4px 8px;border:1px solid var(--edge)}
  .logo{font-size:16px}.ld{font-size:14px}
  .dv{display:none}
  .sys__live{font-size:7px;letter-spacing:1px}
  
  /* Ticker */
  .ticker{height:32px}
  .tick{padding:0 12px;font-size:10px}
  
  /* Metrics bar — horizontal scroll */
  .mbar{-webkit-overflow-scrolling:touch}
  .m{padding:6px 10px}
  .mk{font-size:7px}.mv{font-size:10px}
  
  /* Main grid — single column */
  .term{grid-template-columns:1fr;grid-template-areas:
    "chart""rsi""ad1""tokens""pulse""fng""deriv""trend""news""side""ad3""heat""defi""btc""stbl""macro"}
  
  /* Chart */
  .chart-frame{height:300px}
  .ctabs{padding:0 4px}
  .ct{padding:6px 10px;font-size:10px}
  
  /* Token table — horizontal scroll wrapper */
  .mb--scroll{max-height:400px;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .tbl{min-width:600px}
  .search input{width:120px}
  
  /* Module padding */
  .mb{padding:10px 12px}
  .mh{padding:8px 12px}
  
  /* Content grids */
  .news-cols{grid-template-columns:1fr}
  .macro-grid{grid-template-columns:1fr 1fr}.macro-grid>div{height:160px}
  .bg{grid-template-columns:1fr 1fr}
  .det-grid{grid-template-columns:1fr 1fr}
  .dg{grid-template-columns:1fr}
  
  /* After-grid sections */
  .paired-grid{grid-template-columns:1fr}
  .ta-grid{grid-template-columns:1fr 1fr}.ta-grid>div{height:340px}
  .fees-grid{grid-template-columns:1fr 1fr}
  .bridge-grid{grid-template-columns:1fr 1fr}
  .gas-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}
  .voices-grid{grid-template-columns:1fr 1fr}
  .influencer-grid{grid-template-columns:1fr 1fr}
  
  /* Sidebar */
  .mod--side .mb{grid-template-columns:1fr;padding:12px}
  
  /* Heatmap */
  .hg{grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:2px}
  
  /* Dominance */
  .dom-row{gap:6px;font-size:10px}
  .dom-sym{width:35px;font-size:10px}
  .dom-pct{width:38px;font-size:11px}
  .dom-mcap{width:55px;font-size:9px}
  
  /* Ads scale */
  .ad-row{padding:8px 12px}
  
  /* Footer */
  .foot{padding:16px 12px}
  .foot__r{flex-direction:column;gap:6px}
}

@media(max-width:480px){
  /* Extra compact header */
  .lt{display:none}.sys__clock{display:none}
  .sys__live span:not(.pulse){display:none}
  .logo em{font-size:15px}
  
  /* Single column everything */
  .macro-grid{grid-template-columns:1fr}.macro-grid>div{height:130px}
  .bg{grid-template-columns:1fr}
  .fees-grid{grid-template-columns:1fr}
  .bridge-grid{grid-template-columns:1fr}
  .gas-grid{grid-template-columns:1fr 1fr}
  .voices-grid{grid-template-columns:1fr}
  .ta-grid{grid-template-columns:1fr}.ta-grid>div{height:380px}
  .hg{grid-template-columns:repeat(auto-fill,minmax(52px,1fr))}
  
  /* Token table tighter */
  .tbl{min-width:500px}
  .coin__n{display:none}
  .search input{width:90px}
  
  /* Chart smaller */
  .chart-frame{height:260px}
  
  /* Dom compact */
  .dom-mcap{display:none}
  .dom-stack{height:10px}
  
  /* Pulse compact */
  .pulse-val{font-size:40px}
  .fng__val{font-size:38px}
  .fng__hist{flex-wrap:wrap}
  .fng__h{min-width:60px}
  
  /* Donate modal */
  .don-m{padding:16px}
}

@media(max-width:360px){
  .sys{padding:0 6px}
  .logo{font-size:14px;gap:4px}.ld{font-size:12px}
  .m{padding:5px 8px}.mk{font-size:6px}.mv{font-size:9px}
  .ct{padding:5px 8px;font-size:9px}
  .gas-grid{grid-template-columns:1fr}
  .tbl{min-width:440px}
}