/* ═══════════════════════════════════════════════════════════════

4a ── PREDICTIONS & VOTING

═══════════════════════════════════════════════════════════════ */

.pred-s { margin-bottom: 1.5rem; }

/* ── Section header generico ── */

.sh {

margin-bottom: 1rem;

display: flex;

align-items: center;

justify-content: space-between;

flex-wrap: wrap;

gap: 0.5rem;

}

.st {

font-family: var(--fd);

font-size: 1.6rem;

font-weight: 800;

letter-spacing: -1px;

display: flex;

align-items: center;

gap: 0.5rem;

}

.ss { font-size: 0.92rem; color: var(--ts); }

.expand-btn {

padding: 0.4rem 0.85rem;

border-radius: 6px;

background: var(--bg3);

border: 1px solid var(--br);

color: var(--ts);

font-size: 0.84rem;

font-weight: 600;

cursor: pointer;

transition: all 0.3s;

font-family: var(--fb);

}

.expand-btn:hover { border-color: var(--g); color: var(--g); }

/* ── Grid prediction cards ── */

.pred-g {

display: grid;

grid-template-columns: repeat(3, 1fr);

gap: 0.75rem;

}

.pred-c {

background: var(--card);

border: 1px solid var(--br);

border-radius: 12px;

padding: 1.1rem;

transition: all 0.3s;

}

.pred-c:hover { border-color: var(--brb); transform: translateY(-2px); }

.pred-h { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.6rem; }

.pred-ic {

width: 34px; height: 34px;

border-radius: 8px;

display: flex; align-items: center; justify-content: center;

font-size: 1.10rem;

}

.pred-cat { font-size: 0.76rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 0.1rem; }

.pred-q { font-weight: 600; font-size: 0.98rem; line-height: 1.3; }

/* ── Target/opzioni di voto ── */

.pred-tg { display: grid; gap: 0.4rem; margin-bottom: 0.6rem; }

.tg-i {

display: flex;

align-items: center;

gap: 0.4rem;

padding: 0.35rem 0.55rem;

background: var(--bg3);

border-radius: 5px;

cursor: pointer;

transition: all 0.2s;

border: 1px solid transparent;

}

.tg-i:hover { border-color: var(--brb); transform: scale(1.01); }
.tg-i:active { transform: scale(0.98); }

.tg-i.voted { border-color: var(--g); background: var(--gd); }

/* Vote toast */
#vote-toast { position:fixed; bottom:1.5rem; left:50%; transform:translateX(-50%) translateY(100px); background:rgba(0,255,136,0.15); border:1px solid rgba(0,255,136,0.4); color:var(--g); font-size:0.9rem; font-weight:700; padding:0.6rem 1.4rem; border-radius:30px; z-index:9999; transition:transform 0.35s cubic-bezier(.175,.885,.32,1.275); pointer-events:none; white-space:nowrap; backdrop-filter:blur(10px); box-shadow:0 4px 20px rgba(0,255,136,0.2); }
#vote-toast.show { transform:translateX(-50%) translateY(0); }

/* Voted option glow */
@keyframes voteGlow { 0%{box-shadow:0 0 0 0 rgba(0,255,136,0.6)} 50%{box-shadow:0 0 0 8px rgba(0,255,136,0)} 100%{box-shadow:0 0 0 0 rgba(0,255,136,0)} }
.voted { border-color: var(--g) !important; background: rgba(0,255,136,0.12) !important; animation: voteGlow 0.8s ease; }

.tg-p { font-family: var(--fm); font-weight: 700; font-size: 0.89rem; min-width: 65px; }

.tg-bar { flex: 1; height: 4px; background: rgba(255,255,255,0.05); border-radius: 2px; overflow: hidden; }

.tg-fill { height: 100%; border-radius: 2px; transition: width 0.6s cubic-bezier(0.4,0,0.2,1); }

.tg-pct { font-family: var(--fm); font-size: 0.84rem; font-weight: 700; color: var(--ts); min-width: 38px; text-align: right; }

.vote-s { display: flex; gap: 0.4rem; padding-top: 0.5rem; border-top: 1px solid var(--br); align-items: center; }

.vote-t { font-family: var(--fm); font-size: 0.80rem; color: var(--tm); flex: 1; }

.vote-ind { font-size: 0.80rem; font-weight: 700; padding: 0.15rem 0.4rem; border-radius: 3px; }

.vote-ind.bw { background: var(--gd); color: var(--g); }

.vote-ind.brw { background: var(--rd); color: var(--r); }

/* ═══════════════════════════════════════════════════════════════

4b ── TWO-COL: NEWS + COMMUNITY

═══════════════════════════════════════════════════════════════ */

.two-c {

display: grid;

grid-template-columns: 1fr 1fr;

gap: 1rem;

margin-bottom: 1.5rem;

}

.cmp-s { display: flex; flex-direction: column; }

.cmp-g { display: grid; gap: 0.55rem; max-height: 350px; overflow-y: auto; padding-right: 0.25rem; }

/* ── News card ── */

.cn {

display: flex;

gap: 0.65rem;

background: var(--card);

border: 1px solid var(--br);

border-radius: 8px;

padding: 0.65rem;

transition: all 0.3s;

cursor: pointer;

position: relative;

}

.cn:hover { border-color: var(--brb); transform: translateX(2px); }


/* ── News Full Section (Market Intelligence expanded) ── */
.news-full-section { margin-bottom: 1.5rem; }
.news-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 0.55rem; max-height: 420px; overflow-y: auto; padding-right: 0.25rem; }
@media(max-width:700px){ .news-two-col { grid-template-columns: 1fr; } }

/* ── News Importance Label ── */
.cn-imp { font-size: 0.68rem; font-weight: 700; padding: 1px 6px; border-radius: 4px; text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap; }
.cn-imp.imp-alta { background: rgba(255,71,87,0.18); color: #ff4757; border: 1px solid rgba(255,71,87,0.3); }
.cn-imp.imp-media { background: rgba(255,180,0,0.18); color: #ffb400; border: 1px solid rgba(255,180,0,0.3); }
.cn-imp.imp-bassa { background: rgba(251,191,36,0.18); color: #fbbf24; border: 1px solid rgba(251,191,36,0.3); }

/* ── News Reactions ── */
.cn-reactions { display: flex; gap: 0.35rem; margin-top: 0.35rem; }
.cn-rx-btn { display: flex; align-items: center; gap: 3px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: 12px; padding: 2px 8px; font-size: 0.72rem; color: var(--tm); cursor: pointer; transition: all 0.2s; user-select: none; }
.cn-rx-btn:hover { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.2); transform: scale(1.05); }
.cn-rx-btn.rx-active-fire { background: rgba(255,120,0,0.18); border-color: rgba(255,120,0,0.4); color: #ff7800; }
.cn-rx-btn.rx-active-like { background: rgba(0,180,255,0.18); border-color: rgba(0,180,255,0.4); color: #00b4ff; }
.cn-rx-btn.rx-active-dislike { background: rgba(255,71,87,0.18); border-color: rgba(255,71,87,0.4); color: #ff4757; }
.cn-rx-count { font-family: 'JetBrains Mono', monospace; font-size: 0.68rem; }



.cn-img { width: 72px; height: 58px; border-radius: 6px; object-fit: cover; flex-shrink: 0; }

.cn-b { flex: 1; min-width: 0; }

.cn-m { display: flex; gap: 0.4rem; align-items: center; margin-bottom: 0.15rem; }

.cn-src { font-size: 0.90rem; font-weight: 700; color: var(--cy); }

.cn-tm { font-size: 0.85rem; color: var(--tm); }

.cn-tt {

font-family: var(--fb); font-weight: 600; font-size: 1.1rem; line-height: 1.3;

display: -webkit-box; -webkit-line-clamp: 2;

-webkit-box-orient: vertical; overflow: hidden;

}

/* ── Community post card ── */

.cp {

display: flex;

gap: 0.65rem;

background: var(--card);

border: 1px solid var(--br);

border-radius: 8px;

padding: 0.65rem;

transition: all 0.3s;

cursor: pointer;

position: relative;

}

.cp:hover { border-color: var(--brb); }

.cp::after {

content: '\1F4C8 Analisi completa \25B8';

position: absolute;

right: 0.5rem; bottom: 0.4rem;

font-size: 0.72rem; color: var(--cy); opacity: 0;

transition: opacity 0.3s;

}

.cp:hover::after { opacity: 1; }

.cp-av {

width: 34px; height: 34px;

border-radius: 50%;

background: linear-gradient(135deg, var(--g), var(--b));

display: flex; align-items: center; justify-content: center;

font-weight: 700; font-size: 0.92rem; flex-shrink: 0;

}

.cp-b { flex: 1; min-width: 0; }

.cp-u { font-weight: 600; font-size: 0.89rem; display: flex; align-items: center; gap: 0.25rem; }

.cp-u .vb { color: var(--b); font-size: 0.84rem; }

.cp-tm { font-size: 0.72rem; color: var(--tm); }

.cp-tx {

font-size: 0.84rem; color: var(--ts); line-height: 1.3;

display: -webkit-box; -webkit-line-clamp: 2;

-webkit-box-orient: vertical; overflow: hidden;

margin-top: 0.15rem;

}

.cp-rx { display: flex; gap: 0.4rem; margin-top: 0.3rem; }

.cp-r { font-size: 0.76rem; color: var(--tm); display: flex; align-items: center; gap: 0.15rem; }

/* ═══════════════════════════════════════════════════════════════

4c ── ARTICLE POPUP

═══════════════════════════════════════════════════════════════ */

.art-pop {

position: fixed; inset: 0;

background: rgba(0,0,0,0.8);

z-index: 400;

display: none; align-items: center; justify-content: center;

padding: 1rem;

}

.art-pop.show { display: flex; }

.art-box {

background: var(--bg2);

border: 1px solid var(--br);

border-radius: 16px;

max-width: 700px; width: 100%;

max-height: 92vh; overflow-y: auto;

position: relative;

animation: popIn 0.3s ease;

-webkit-overflow-scrolling: touch;

}

.art-hero { width: 100%; height: 220px; object-fit: cover; border-radius: 16px 16px 0 0; }

.art-hdr { padding: 1.3rem 1.3rem 0; display: flex; align-items: center; gap: 0.55rem; flex-wrap: wrap; }

.art-src { font-size: 0.84rem; font-weight: 700; color: var(--cy); background: rgba(0,255,255,0.08); padding: 0.25rem 0.65rem; border-radius: 4px; }

.art-cat { font-size: 0.76rem; font-weight: 600; padding: 0.25rem 0.55rem; border-radius: 4px; }

.art-tm { font-size: 0.76rem; color: var(--tm); margin-left: auto; }

.art-title { font-family: var(--fb); font-size: 1.4rem; font-weight: 800; line-height: 1.3; padding: 0.8rem 1.3rem 0.55rem; }

.art-body { padding: 0 1.3rem 1.3rem; font-size: 0.94rem; color: var(--ts); line-height: 1.7; }

.art-body p { margin-bottom: 0.85rem; }

.art-body strong { color: var(--t); font-weight: 600; }

.art-tags { display: flex; gap: 0.45rem; flex-wrap: wrap; padding: 0 1.3rem 1.1rem; }

.art-tag { font-size: 0.76rem; color: var(--cy); background: rgba(0,255,255,0.06); border: 1px solid rgba(0,255,255,0.12); padding: 0.15rem 0.55rem; border-radius: 4px; }

.art-close {

position: absolute; top: 0.8rem; right: 0.8rem;

width: 38px; height: 38px; border-radius: 50%;

background: rgba(0,0,0,0.6); backdrop-filter: blur(8px);

border: 1px solid rgba(255,255,255,0.1); color: #fff;

display: flex; align-items: center; justify-content: center;

cursor: pointer; font-size: 1.20rem; transition: all 0.3s; z-index: 2;

}

.art-close:hover { background: var(--rd); color: var(--r); }

/* ═══════════════════════════════════════════════════════════════

4d ── POST POPUP (Community)

═══════════════════════════════════════════════════════════════ */

.post-pop {

position: fixed; inset: 0;

background: rgba(0,0,0,0.8);

z-index: 400;

display: none; align-items: center; justify-content: center;

padding: 1rem;

}

.post-pop.show { display: flex; }

.post-box {

background: var(--bg2);

border: 1px solid var(--br);

border-radius: 16px;

max-width: 700px; width: 100%;

max-height: 88vh; overflow-y: auto;

position: relative;

animation: popIn 0.3s ease;

}

.post-head {

padding: 1.3rem;

display: flex; gap: 0.8rem; align-items: flex-start;

border-bottom: 1px solid var(--br);

}

.post-av2 {

width: 46px; height: 46px; border-radius: 50%;

background: linear-gradient(135deg, var(--g), var(--b));

display: flex; align-items: center; justify-content: center;

font-weight: 800; font-size: 1.20rem; flex-shrink: 0;

}

.post-uinfo { flex: 1; }

.post-uname { font-weight: 700; font-size: 1.10rem; display: flex; align-items: center; gap: 0.35rem; }

.post-uname .vb { color: var(--b); font-size: 0.92rem; }

.post-umeta { font-size: 0.80rem; color: var(--tm); margin-top: 0.15rem; }

.post-ubadge { font-size: 0.72rem; font-weight: 600; padding: 0.15rem 0.45rem; border-radius: 3px; background: rgba(0,255,136,0.1); color: var(--g); border: 1px solid rgba(0,255,136,0.15); }

.post-close {

width: 38px; height: 38px; border-radius: 50%;

background: var(--bg3); border: 1px solid var(--br); color: var(--t);

display: flex; align-items: center; justify-content: center;

cursor: pointer; font-size: 1.20rem; transition: all 0.3s; flex-shrink: 0;

}

.post-close:hover { background: var(--rd); color: var(--r); }

.post-fulltext { padding: 1.3rem; font-size: 1.00rem; line-height: 1.7; color: var(--ts); }

.post-fulltext strong { color: var(--t); }

.post-indicators { display: flex; gap: 0.45rem; flex-wrap: wrap; padding: 0 1.3rem 0.8rem; }

.post-ind { font-size: 0.76rem; padding: 0.25rem 0.55rem; border-radius: 4px; background: var(--bg3); border: 1px solid var(--br); color: var(--ts); }

.post-ind.bull { color: var(--g); border-color: rgba(0,255,136,0.2); background: rgba(0,255,136,0.06); }

.post-ind.bear { color: var(--r); border-color: rgba(255,71,87,0.2); background: rgba(255,71,87,0.06); }

.post-levels { margin: 0 1.3rem 1.1rem; background: var(--bg3); border: 1px solid var(--br); border-radius: 8px; padding: 0.8rem; }

.post-levels-t { font-size: 0.84rem; font-weight: 700; margin-bottom: 0.45rem; }

.post-lvl { display: flex; justify-content: space-between; padding: 0.3rem 0; font-size: 0.86rem; font-family: var(--fm); }

.post-lvl .lb { color: var(--ts); }

.post-lvl .vl { font-weight: 600; }

.post-lvl .vl.green { color: var(--g); }

.post-lvl .vl.red { color: var(--r); }

.post-react { display: flex; gap: 0.55rem; padding: 0.8rem 1.3rem; border-top: 1px solid var(--br); }

.post-rb {

display: flex; align-items: center; gap: 0.35rem;

font-size: 0.89rem; padding: 0.45rem 0.8rem;

border-radius: 8px; background: var(--bg3); border: 1px solid var(--br);

color: var(--ts); cursor: pointer; transition: all 0.2s;

}

.post-rb:hover { border-color: var(--brb); color: var(--t); background: var(--hover); }

.post-rb.active { border-color: rgba(0,255,136,0.3); color: var(--g); background: rgba(0,255,136,0.06); }

/* ═══════════════════════════════════════════════════════════════

5a ── MODAL OVERLAY (Espandi)

═══════════════════════════════════════════════════════════════ */

.modal-overlay {

position: fixed; inset: 0;

background: rgba(0,0,0,0.7);

z-index: 300;

display: none; align-items: center; justify-content: center;

padding: 1rem;

}

.modal-overlay.show { display: flex; }

.modal {

background: var(--bg2);

border: 1px solid var(--br);

border-radius: 16px;

max-width: 900px; width: 100%;

max-height: 90vh; overflow-y: auto;

position: relative;

-webkit-overflow-scrolling: touch;

}

.modal-hdr {

padding: 1.3rem;

border-bottom: 1px solid var(--br);

display: flex; align-items: center; justify-content: space-between;

position: sticky; top: 0; background: var(--bg2); z-index: 1;

border-radius: 16px 16px 0 0;

}

.modal-title { font-family: var(--fb); font-size: 1.6rem; font-weight: 800; }

.modal-close {

width: 34px; height: 34px; border-radius: 8px;

background: var(--bg3); border: 1px solid var(--br); color: var(--t);

display: flex; align-items: center; justify-content: center;

cursor: pointer; font-size: 1.20rem; transition: all 0.3s;

}

.modal-close:hover { background: var(--rd); border-color: rgba(255,71,87,0.3); color: var(--r); }

.modal-body { padding: 1.3rem; }

/* ═══════════════════════════════════════════════════════════════

5b ── DETAIL PAGE (pagina asset)

═══════════════════════════════════════════════════════════════ */

.dp { display: none; }

.dp.act { display: block; }

/* ── Torna indietro ── */

.bb {

display: inline-flex; align-items: center; gap: 0.4rem;

padding: 0.55rem 1.1rem;

background: var(--card); border: 1px solid var(--br); border-radius: 8px;

color: var(--t); font-weight: 600; cursor: pointer;

transition: all 0.3s; font-family: var(--fb); font-size: 0.92rem;

margin-bottom: 1rem;

}

.bb:hover { border-color: var(--g); color: var(--g); transform: translateX(-3px); }

/* ── Layout dettaglio ── */

.dl {

display: grid;

grid-template-columns: 1fr 340px;

gap: 1.25rem;

align-items: start;

}

.dm { min-width: 0; }

.ds {

display: flex; flex-direction: column; gap: 0.75rem;

position: sticky; top: 70px;

}

/* ── Asset Header Card ── */

.ahc {

background: var(--card); border: 1px solid var(--br);

border-radius: 14px; padding: 1.3rem; margin-bottom: 1rem;

position: relative; overflow: hidden;

}

.ahc::before {

content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;

background: linear-gradient(90deg, var(--g), var(--cy), var(--b));

}

.aht { display: flex; align-items: center; gap: 0.8rem; margin-bottom: 0.8rem; flex-wrap: wrap; }

.adl { width: 50px; height: 50px; border-radius: 12px; object-fit: cover; }

.ati h1 { font-family: var(--fd); font-size: 2.1rem; font-weight: 800; letter-spacing: -1px; line-height: 1; }

.ati .as { font-size: 0.98rem; color: var(--ts); font-family: var(--fm); }

.type-tags { display: flex; gap: 0.35rem; flex-wrap: wrap; margin-top: 0.3rem; }

.type-tag { padding: 0.15rem 0.45rem; border-radius: 3px; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; }

.afd {

margin-left: auto;

display: flex; align-items: center; gap: 0.4rem;

padding: 0.45rem 0.9rem; border-radius: 7px;

background: rgba(245,158,11,0.1); border: 1px solid rgba(245,158,11,0.25);

color: var(--o); font-size: 0.89rem; font-weight: 600;

cursor: pointer; transition: all 0.3s; font-family: var(--fb);

}

.afd:hover { background: rgba(245,158,11,0.2); }

.afd.act { background: rgba(245,158,11,0.25); border-color: var(--o); }

.apr { display: flex; align-items: baseline; gap: 0.8rem; flex-wrap: wrap; }

.apb { font-family: var(--fm); font-size: 2.4rem; font-weight: 700; }

.acb { font-family: var(--fm); font-size: 1.10rem; font-weight: 700; padding: 0.25rem 0.65rem; border-radius: 5px; }

.acb.up { color: var(--g); background: var(--gd); }

.acb.dn { color: var(--r); background: var(--rd); }

/* ── Stats row (4 card) ── */

.sr { display: grid; grid-template-columns: repeat(4,1fr); gap: 0.65rem; margin-bottom: 1rem; }

/* ═══ Metriche Principali nella pagina dettaglio ═══ */

.main-metrics-grid { 
  display: grid; 
  grid-template-columns: repeat(3, 1fr); 
  gap: 0.75rem; 
  margin-bottom: 1rem; 
}

.main-metric-card { 
  background: var(--card); 
  border: 1px solid var(--br); 
  border-radius: 10px; 
  padding: 0.85rem; 
  transition: all 0.3s;
  position: relative;
}

.main-metric-card:hover { 
  border-color: var(--brb); 
  transform: translateY(-2px); 
  box-shadow: 0 4px 12px rgba(0,0,0,0.3); 
}

.main-metric-label { 
  font-size: 0.72rem; 
  font-weight: 700; 
  color: var(--tm); 
  text-transform: uppercase; 
  letter-spacing: 0.5px; 
  margin-bottom: 0.35rem; 
}

.main-metric-value { 
  font-family: var(--fm); 
  font-size: 1.1rem; 
  font-weight: 700; 
  color: var(--t);
}

/* Stats avanzate con info button */

.sc { 
  background: var(--card); 
  border: 1px solid var(--br); 
  border-radius: 10px; 
  padding: 0.85rem; 
  position: relative; 
  transition: all 0.3s;
}

.sc:hover { 
  border-color: var(--brb); 
  transform: translateY(-2px); 
  box-shadow: 0 4px 12px rgba(0,0,0,0.3); 
}

.sc-top { 
  display: flex; 
  align-items: center; 
  justify-content: space-between; 
  margin-bottom: 0.4rem; 
}

.sl { 
  font-size: 0.72rem; 
  font-weight: 700; 
  color: var(--tm); 
  text-transform: uppercase; 
  letter-spacing: 0.5px; 
}

.sc-info-btn { 
  width: 18px; 
  height: 18px; 
  display: flex; 
  align-items: center; 
  justify-content: center; 
  background: rgba(255,255,255,0.06); 
  border: 1px solid rgba(255,255,255,0.12); 
  border-radius: 50%; 
  font-size: 0.72rem; 
  font-weight: 800; 
  color: var(--b); 
  cursor: pointer; 
  transition: all 0.25s cubic-bezier(0.4,0,0.2,1); 
  flex-shrink: 0;
}

.sc-info-btn:hover { 
  background: var(--b); 
  border-color: var(--b); 
  color: white; 
  transform: scale(1.2); 
  box-shadow: 0 0 12px rgba(59,130,246,0.4); 
}

.sv { 
  font-family: var(--fm); 
  font-size: 1.02rem; 
  font-weight: 700; 
}

.sv-badge { 
  display: inline-flex; 
  align-items: center; 
  padding: 0.15rem 0.5rem; 
  font-size: 0.72rem; 
  font-weight: 700; 
  border-radius: 4px; 
  letter-spacing: 0.02em; 
}

.sv-badge.badge-success { 
  background: rgba(0,255,136,0.1); 
  color: var(--g); 
  border: 1px solid rgba(0,255,136,0.2); 
}

.sv-badge.badge-warning { 
  background: rgba(245,158,11,0.1); 
  color: var(--o); 
  border: 1px solid rgba(245,158,11,0.2); 
}

.sv-badge.badge-danger { 
  background: rgba(255,71,87,0.1); 
  color: var(--r); 
  border: 1px solid rgba(255,71,87,0.2); 
}

/* Tooltip per le stats avanzate */

.stats-tooltip-overlay { 
  position:fixed; 
  top:0; 
  left:0; 
  right:0; 
  bottom:0; 
  background:rgba(0,0,0,0.7); 
  backdrop-filter:blur(6px); 
  z-index:99999; 
  display:flex; 
  align-items:center; 
  justify-content:center; 
  opacity:0; 
  visibility:hidden; 
  transition:all 0.4s cubic-bezier(0.4,0,0.2,1); 
  padding:1rem; 
}

.stats-tooltip-overlay.active { 
  opacity:1; 
  visibility:visible; 
}

.stats-tooltip-modal { 
  position:relative; 
  background:linear-gradient(155deg,rgba(17,24,39,0.98) 0%,rgba(11,15,25,0.99) 60%,rgba(15,20,35,0.98) 100%); 
  border:1px solid rgba(255,255,255,0.1); 
  border-radius:20px; 
  padding:2.25rem; 
  width:100%; 
  max-width:500px; 
  max-height:80vh; 
  overflow-y:auto; 
  box-shadow:0 32px 64px rgba(0,0,0,0.65),0 0 0 1px rgba(255,255,255,0.04),0 0 80px rgba(59,130,246,0.06); 
  transform:scale(0.92) translateY(24px); 
  transition:transform 0.5s cubic-bezier(0.34,1.56,0.64,1),box-shadow 0.5s ease; 
}

.stats-tooltip-overlay.active .stats-tooltip-modal { 
  transform:scale(1) translateY(0); 
  box-shadow:0 32px 64px rgba(0,0,0,0.65),0 0 0 1px rgba(255,255,255,0.06),0 0 100px rgba(59,130,246,0.08); 
}

.stats-tooltip-modal::-webkit-scrollbar { width:4px; }
.stats-tooltip-modal::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.15); border-radius:4px; }

.stats-tooltip-close { 
  position:absolute; 
  top:1rem; 
  right:1rem; 
  width:32px; 
  height:32px; 
  border-radius:8px; 
  border:1px solid rgba(255,255,255,0.08); 
  background:rgba(255,255,255,0.04); 
  color:var(--ts); 
  display:flex; 
  align-items:center; 
  justify-content:center; 
  cursor:pointer; 
  font-size:1.1rem; 
  transition:all 0.2s; 
  z-index:2; 
}

.stats-tooltip-close:hover { 
  background:rgba(239,68,68,0.15); 
  border-color:rgba(239,68,68,0.3); 
  color:#ef4444; 
  transform:scale(1.1); 
}

.stats-tooltip-modal-title { 
  font-size:1.2rem; 
  letter-spacing:-0.01em; 
  font-weight:700; 
  color:var(--t); 
  margin-bottom:1rem; 
  padding-right:2.5rem; 
  line-height:1.4; 
}

.stats-tooltip-modal-body { 
  font-size:0.9rem; 
  color:var(--ts); 
  line-height:1.85; 
}

.stats-tooltip-modal-body strong { 
  color:#22c55e; 
  font-weight:600; 
}

@media(max-width:480px) { 
  .stats-tooltip-modal { padding:1.5rem; max-width:95vw; } 
  .stats-tooltip-modal-title { font-size:1rem; } 
  .stats-tooltip-modal-body { font-size:0.82rem; line-height:1.7; } 
  .main-metrics-grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════ Filtro Categorie Crypto - Ultra Responsive ═══════════════════════════ */





.crypto-filter-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  background: linear-gradient(135deg, rgba(17,24,39,0.95) 0%, rgba(11,15,25,0.98) 100%);
  border: 1px solid var(--br);
  border-radius: 12px;
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.25);
  flex-wrap: wrap;
}

.crypto-filter-label {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-weight: 700;
  color: var(--ts);
  font-size: 0.85rem;
  white-space: nowrap;
  flex-shrink: 0;
}

.filter-icon {
  font-size: 1rem;
}

.filter-text {
  font-family: var(--fd);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-size: 0.75rem;
}

.filter-info {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.filter-info-btn {
  padding: 0.5rem 0.85rem;
  background: rgba(59,130,246,0.1);
  border: 1px solid rgba(59,130,246,0.25);
  border-radius: 6px;
  color: var(--b);
  font-size: 0.85rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.3s;
  white-space: nowrap;
}

.filter-info-btn:hover {
  background: rgba(59,130,246,0.2);
  border-color: rgba(59,130,246,0.4);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(59,130,246,0.25);
}

/* Badge categoria nella tabella */

.category-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.22rem;
  padding: 0.16rem 0.5rem;
  border-radius: 4px;
  white-space: nowrap;
  font-family: 'Outfit', sans-serif;
  font-size: 0.62rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

.cat-layer1 { background: rgba(59,130,246,0.15); color: #3b82f6; border: 1px solid rgba(59,130,246,0.3); }
.cat-layer2 { background: rgba(168,85,247,0.15); color: #a855f7; border: 1px solid rgba(168,85,247,0.3); }
.cat-defi { background: rgba(16,185,129,0.15); color: #10b981; border: 1px solid rgba(16,185,129,0.3); }
.cat-stablecoin { background: rgba(245,158,11,0.15); color: #f59e0b; border: 1px solid rgba(245,158,11,0.3); }
.cat-exchange { background: rgba(239,68,68,0.15); color: #ef4444; border: 1px solid rgba(239,68,68,0.3); }
.cat-gaming { background: rgba(236,72,153,0.15); color: #ec4899; border: 1px solid rgba(236,72,153,0.3); }
.cat-ai { background: rgba(6,182,212,0.15); color: #06b6d4; border: 1px solid rgba(6,182,212,0.3); }
.cat-privacy { background: rgba(107,114,128,0.15); color: #6b7280; border: 1px solid rgba(107,114,128,0.3); }
.cat-rwa { background: rgba(139,92,246,0.15); color: #8b5cf6; border: 1px solid rgba(139,92,246,0.3); }
.cat-infrastructure { background: rgba(20,184,166,0.15); color: #14b8a6; border: 1px solid rgba(20,184,166,0.3); }

/* Chain badge nella tabella */
.chain-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.22rem;
  padding: 0.16rem 0.5rem;
  border-radius: 4px;
  white-space: nowrap;
  font-family: 'Outfit', sans-serif;
  font-size: 0.62rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  background: rgba(0,0,0,0.25);
  border: 1px solid;
}
.chain-icon {
  font-size: 0.75rem;
  line-height: 1;
}
/* Chain filter pill */
.chain-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.28rem 0.7rem;
  border-radius: 6px;
  border: 1px solid;
  font-size: 0.72rem;
  font-weight: 700;
  cursor: pointer;
  font-family: var(--fm);
  background: rgba(0,0,0,0.2);
  opacity: 0.6;
  transition: all 0.2s;
  white-space: nowrap;
  flex-shrink: 0;
}
.chain-pill:hover { opacity: 0.85; transform: translateY(-1px); }
.chain-pill.act {
  opacity: 1;
  background: rgba(255,255,255,0.08);
  box-shadow: 0 0 8px rgba(255,255,255,0.06);
  transform: translateY(-1px);
}
.chain-filter-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 0.9rem;
  border-top: 1px solid var(--br);
  background: rgba(0,0,0,0.12);
  overflow: hidden;
}
.chain-filter-pills-wrap {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  overflow-x: auto;
  flex: 1;
  scrollbar-width: none;
  -ms-overflow-style: none;
  scroll-behavior: smooth;
}
.chain-filter-pills-wrap::-webkit-scrollbar { display: none; }
.chain-filter-actions {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex-shrink: 0;
  border-left: 1px solid var(--br);
  padding-left: 0.55rem;
  margin-left: 0.1rem;
}
.chain-filter-label {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--tm);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  white-space: nowrap;
  flex-shrink: 0;
}
.chain-guide-btn {
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--ts);
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--br);
  border-radius: 6px;
  padding: 0.22rem 0.6rem;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.18s ease;
  font-family: var(--fb);
  flex-shrink: 0;
}
.chain-guide-btn:hover { color: var(--cy); border-color: var(--cy); background: rgba(6,182,212,0.08); }
@media (max-width: 600px) {
  .chain-filter-row { gap: 0.3rem; padding: 0.4rem 0.5rem; }
  .chain-pill { font-size: 0.62rem; padding: 0.2rem 0.5rem; white-space: nowrap; }
  .chain-filter-label { font-size: 0.62rem; }
}

/* ── Chain Popup Selector ── */
.chain-popup-wrap {
  position: relative;
  flex-shrink: 0;
}
.chain-popup-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.3rem 0.75rem;
  background: rgba(0,220,160,0.06);
  border: 1px solid rgba(0,220,160,0.3);
  border-radius: 8px;
  color: #00DCA0;
  font-size: 0.72rem;
  font-weight: 700;
  cursor: pointer;
  font-family: var(--fm);
  transition: all 0.18s;
  white-space: nowrap;
  min-height: 30px;
  box-shadow: 0 0 8px rgba(0,220,160,0.07);
}
.chain-popup-btn:hover,
.chain-popup-btn.open {
  border-color: var(--cy);
  color: var(--cy);
  background: rgba(0,220,160,0.12);
  box-shadow: 0 0 14px rgba(0,220,160,0.16);
}
.chain-popup-caret {
  font-size: 0.62rem;
  opacity: 0.65;
  transition: transform 0.18s;
}
.chain-popup-btn.open .chain-popup-caret { transform: rotate(180deg); }
.chain-popup-panel {
  position: absolute;
  top: calc(100% + 5px);
  left: 0;
  z-index: 9999;
  background: var(--card, #0e1724);
  border: 1px solid var(--br);
  border-radius: 10px;
  padding: 0.35rem;
  min-width: 175px;
  max-height: 300px;
  overflow-y: auto;
  box-shadow: 0 8px 30px rgba(0,0,0,0.45);
  backdrop-filter: blur(14px);
  scrollbar-width: thin;
  scrollbar-color: var(--br) transparent;
}
.chain-popup-panel::-webkit-scrollbar { width: 4px; }
.chain-popup-panel::-webkit-scrollbar-thumb { background: var(--br); border-radius: 2px; }
.chain-popup-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.38rem 0.55rem;
  background: transparent;
  border: none;
  border-radius: 6px;
  color: var(--t);
  font-size: 0.73rem;
  font-family: var(--fb);
  cursor: pointer;
  text-align: left;
  transition: background 0.14s;
}
.chain-popup-item:hover { background: rgba(255,255,255,0.07); }
.chain-popup-item.act { background: rgba(0,220,160,0.10); color: #00DCA0; }
.chain-popup-item.act .chain-popup-item-count { color: #00DCA0; opacity: 0.65; }
.chain-popup-item-dot {
  width: 14px;
  height: 14px;
  border-radius: 4px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.55rem;
  font-weight: 900;
  color: #000;
}
.chain-popup-item-icon {
  font-size: 0.82rem;
  min-width: 1rem;
  text-align: center;
  flex-shrink: 0;
}
.chain-popup-item-name {
  flex: 1;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.chain-popup-item-count {
  font-size: 0.66rem;
  opacity: 0.45;
  font-weight: 500;
  flex-shrink: 0;
}

/* ══════════════════════════════════════════
   COMBINED FILTER ROW (Categoria + Chain)
══════════════════════════════════════════ */
.combined-filter-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  padding: 0.5rem 0.85rem;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  background: rgba(8,12,22,0.3);
}

.comb-filter-label {
  font-family: var(--fd);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tm);
  white-space: nowrap;
  user-select: none;
}

/* ── Category popup (mirrors chain popup) ── */
.cat-popup-wrap {
  position: relative;
}

.cat-popup-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.3rem 0.75rem;
  background: rgba(0,220,160,0.06);
  border: 1px solid rgba(0,220,160,0.3);
  border-radius: 8px;
  color: #00DCA0;
  font-family: var(--fb);
  font-size: 0.72rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  min-height: 30px;
  transition: all 0.18s;
  box-shadow: 0 0 8px rgba(0,220,160,0.07);
}
.cat-popup-btn:hover, .cat-popup-btn.open {
  border-color: var(--cy);
  color: var(--cy);
  background: rgba(0,220,160,0.12);
  box-shadow: 0 0 14px rgba(0,220,160,0.16);
}
.cat-popup-caret {
  font-size: 0.62rem;
  opacity: 0.75;
  transition: transform 0.18s;
}
.cat-popup-btn.open .cat-popup-caret {
  transform: rotate(180deg);
}

.cat-popup-panel {
  position: absolute;
  top: calc(100% + 5px);
  left: 0;
  z-index: 9999;
  min-width: 190px;
  max-height: 300px;
  overflow-y: auto;
  background: rgba(10,16,30,0.97);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  box-shadow: 0 8px 28px rgba(0,0,0,0.55);
  padding: 0.3rem 0;
  backdrop-filter: blur(16px);
  scrollbar-width: thin;
  scrollbar-color: rgba(0,220,160,0.3) transparent;
}

.cat-popup-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.42rem 0.9rem;
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--t);
  font-family: var(--fb);
  font-size: 0.8rem;
  font-weight: 500;
  text-align: left;
  transition: background 0.15s;
}
.cat-popup-item:hover {
  background: rgba(255,255,255,0.05);
}
.cat-popup-item.act {
  color: #00DCA0;
  font-weight: 700;
}
.cat-popup-item-dot {
  width: 16px;
  height: 16px;
  border-radius: 4px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.6rem;
  font-weight: 900;
  color: #000;
  background: rgba(255,255,255,0.12);
  transition: background 0.15s;
}
.cat-popup-item.act .cat-popup-item-dot {
  background: currentColor !important;
}

/* ── Checkbox testuale senza icone colore ── */
.cat-popup-item-chk,
.chain-popup-item-chk {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 900;
  color: var(--cy);
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 4px;
  transition: background 0.15s, border-color 0.15s;
}
.cat-popup-item.act .cat-popup-item-chk,
.chain-popup-item.act .chain-popup-item-chk {
  background: rgba(0,220,160,0.15);
  border-color: rgba(0,220,160,0.5);
  color: var(--cy);
}
.cat-popup-item-name {
  flex: 1;
}
.cat-popup-item-count {
  font-size: 0.7rem;
  color: var(--tm);
  font-family: var(--fm);
  font-weight: 600;
}

/* ── Unified Guide Button ── */
.filter-guide-unified-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.28rem 0.7rem;
  background: rgba(139,92,246,0.07);
  border: 1px solid rgba(139,92,246,0.28);
  border-radius: 8px;
  color: #a78bfa;
  font-family: var(--fb);
  font-size: 0.72rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  min-height: 30px;
  transition: background 0.2s, border-color 0.2s, box-shadow 0.2s;
  margin-left: auto;
}
.filter-guide-unified-btn:hover {
  background: rgba(139,92,246,0.14);
  border-color: rgba(139,92,246,0.5);
  box-shadow: 0 0 12px rgba(139,92,246,0.15);
}

/* ── Column header info button ── */
.col-info-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  color: rgba(0,220,160,0.45);
  font-size: 0.62rem;
  line-height: 1;
  cursor: pointer;
  padding: 0 0 0 3px;
  vertical-align: middle;
  transition: color 0.15s;
  flex-shrink: 0;
  pointer-events: auto;
}
.col-info-btn:hover,
.col-info-btn:focus {
  color: rgba(0,220,160,0.9);
  outline: none;
}

/* ── Column tooltip bubble ── */
.col-info-tooltip {
  background: rgba(8,14,26,0.97);
  border: 1px solid rgba(0,220,160,0.25);
  border-radius: 10px;
  padding: 0.55rem 0.8rem;
  font-family: var(--fb, 'Outfit', sans-serif);
  font-size: 0.76rem;
  font-weight: 500;
  color: var(--t, #e9f2f2);
  line-height: 1.55;
  box-shadow: 0 6px 24px rgba(0,0,0,0.55), 0 0 0 1px rgba(0,220,160,0.08);
  backdrop-filter: blur(12px);
  pointer-events: none;
  animation: colTipIn 0.15s ease;
}
@keyframes colTipIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Guide Modal Tabs ── */
.guide-tabs-bar {
  display: flex;
  gap: 0.5rem;
  margin: 0.75rem 0 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  padding-bottom: 0.5rem;
}
.guide-tab-btn {
  padding: 0.35rem 0.85rem;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 7px;
  color: var(--tm);
  font-family: var(--fb);
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.18s;
}
.guide-tab-btn:hover {
  background: rgba(255,255,255,0.05);
  color: var(--t);
}
.guide-tab-btn.act {
  background: rgba(0,220,160,0.1);
  border-color: rgba(0,220,160,0.4);
  color: #00DCA0;
}

/* ── Mobile ── */
@media (max-width: 768px) {
  .combined-filter-row { padding: 0.4rem 0.6rem; gap: 0.4rem; }
  .comb-filter-label { display: none; }
  .cat-popup-panel, .chain-popup-panel { max-height: 220px; }
  .filter-guide-unified-btn { margin-left: 0; }
}
@media (max-width: 480px) {
  .chain-popup-panel { left: auto; right: 0; min-width: 160px; }
}

@media (max-width: 768px) {
  .crypto-filter-bar {
    flex-direction: column;
    align-items: stretch;
    padding: 0.65rem;
    gap: 0.6rem;
  }
  .crypto-filter-label { justify-content: flex-start; }
  .filter-info { justify-content: flex-end; }
}

@media (max-width: 480px) {
  .filter-info-btn { font-size: 0.8rem; padding: 0.4rem 0.65rem; }
  .category-badge { font-size: 0.68rem; padding: 0.2rem 0.45rem; }
}

/* ── Massimi / Minimi ── */

.mm-box { background: var(--card); border: 1px solid var(--br); border-radius: 12px; padding: 1.1rem; margin-bottom: 1rem; }

.mm-t { font-family: var(--fd); font-weight: 700; font-size: 1.10rem; margin-bottom: 0.65rem; display: flex; align-items: center; gap: 0.4rem; }

.mm-g { display: grid; grid-template-columns: 1fr 1fr; gap: 0.45rem; }

.mm-i { background: var(--bg3); border-radius: 6px; padding: 0.55rem 0.65rem; }

.mm-l { font-size: 0.72rem; font-weight: 700; color: var(--tm); text-transform: uppercase; letter-spacing: 0.5px; }

.mm-v { display: flex; justify-content: space-between; align-items: center; gap: 0.4rem; margin-top: 0.15rem; }

.mm-h { font-family: var(--fm); font-size: 0.89rem; font-weight: 700; color: var(--g); }

.mm-lo { font-family: var(--fm); font-size: 0.89rem; font-weight: 700; color: var(--r); }

.mm-sep { color: var(--tm); font-size: 0.76rem; }

/* ── Chart wrapper ── */

.chtw { background: var(--card); border: 1px solid var(--br); border-radius: 12px; overflow: hidden; margin-bottom: 1rem; }


/* ── Descrizione progetto ── */

.desc { background: var(--card); border: 1px solid var(--br); border-radius: 12px; padding: 1.1rem; margin-bottom: 1rem; }

.desc-h { font-family: var(--fd); font-weight: 700; font-size: 1.25rem; margin-bottom: 0.65rem; }

.desc-t { line-height: 1.7; color: var(--ts); font-size: 1.08rem; }

.desc-t.col { max-height: 100px; overflow: hidden; position: relative; }

.desc-t.col::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 35px; background: linear-gradient(transparent, rgba(14,20,30,0.88)); }

.rm-b { display: inline-block; margin-top: 0.4rem; color: var(--cy); font-weight: 600; font-size: 0.89rem; cursor: pointer; }

/* ── Educational Box for Correlations ── */

.edu-box {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.08), rgba(168, 85, 247, 0.08));
  border: 1px solid rgba(59, 130, 246, 0.2);
  border-radius: 12px;
  padding: 1.2rem;
  margin-top: 1.2rem;
}

.edu-box h4 {
  color: var(--cy);
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 0.8rem;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.edu-box p {
  color: var(--ts);
  line-height: 1.8;
  font-size: 0.92rem;
}

.edu-box strong {
  color: var(--t);
  font-weight: 600;
}

.edu-box a, .desc a {
  color: #3b82f6;
  text-decoration: none;
  border-bottom: 1px solid rgba(59, 130, 246, 0.3);
  transition: all 0.2s;
}

.edu-box a:hover, .desc a:hover {
  color: #60a5fa;
  border-bottom-color: #60a5fa;
}

/* ═══════════════════════════════════════════════════════════════

5c ── SIDEBAR CARDS

═══════════════════════════════════════════════════════════════ */

.sdc { background: var(--card); border: 1px solid var(--br); border-radius: 12px; padding: 1.1rem; }

.sdc-t { font-weight: 700; font-size: 1.25rem; margin-bottom: 0.65rem; display: flex; align-items: center; gap: 0.4rem; }

/* ── Sentiment ── */

.sent-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 0.45rem; margin-bottom: 0.65rem; }

.sent-b {

padding: 0.55rem; border-radius: 7px; font-weight: 700;

cursor: pointer; transition: all 0.3s; border: 1px solid var(--br);

text-align: center; font-family: var(--fb); font-size: 0.92rem;

}

.sent-b.bu { background: var(--gd); color: var(--g); }

.sent-b.be { background: var(--rd); color: var(--r); }

.sent-b:hover { transform: scale(1.04); }

.sent-bar { height: 7px; border-radius: 3px; background: var(--r); overflow: hidden; margin-bottom: 0.45rem; }

.sent-fill { height: 100%; background: var(--g); border-radius: 3px; transition: width 0.5s; }

.sent-st { font-family: var(--fm); font-size: 0.84rem; color: var(--ts); text-align: center; }

/* ── News sidebar ── */

.ns { max-height: 400px; overflow-y: auto; padding-right: 0.3rem; }

.ns-i {

display: flex; gap: 0.55rem; padding: 0.55rem; border-radius: 6px;

background: var(--bg3); margin-bottom: 0.45rem;

transition: all 0.3s; cursor: pointer; position: relative;

}

.ns-i:hover { background: var(--hover); transform: translateX(2px); }

.ns-i::after { content: '\25B8'; position: absolute; right: 0.4rem; top: 50%; transform: translateY(-50%); font-size: 0.84rem; color: var(--cy); opacity: 0; transition: opacity 0.3s; }

.ns-i:hover::after { opacity: 1; }

.ns-img { width: 58px; height: 46px; border-radius: 5px; object-fit: cover; flex-shrink: 0; }

.ns-b { flex: 1; min-width: 0; }

.ns-m { display: flex; gap: 0.35rem; align-items: center; margin-bottom: 0.1rem; }

.ns-src { font-size: 0.72rem; font-weight: 700; color: var(--cy); }

.ns-tm { font-size: 0.68rem; color: var(--tm); }

.ns-tt { font-size: 1.05rem; font-weight: 600; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ── Rating / Stars ── */

.rt-desc { font-size: 1.05rem; color: var(--ts); margin-bottom: 0.65rem; }

.vote-btns { display: flex; gap: 0.55rem; justify-content: center; margin-bottom: 0.65rem; }

.vb2 {

display: flex; align-items: center; gap: 0.35rem;

padding: 0.55rem 1.1rem; border-radius: 8px;

font-weight: 700; cursor: pointer; transition: all 0.3s;

border: 1px solid var(--br); font-family: var(--fb); font-size: 0.92rem;

}

.vb2.up { background: var(--gd); color: var(--g); border-color: rgba(0,255,136,0.2); }

.vb2.dn { background: var(--rd); color: var(--r); border-color: rgba(255,71,87,0.2); }

.vb2:hover { transform: scale(1.06); }

.vb2 svg { width: 19px; height: 19px; }

.stars-d { display: flex; justify-content: center; gap: 0.15rem; margin-bottom: 0.4rem; }

.star { font-size: 1.3rem; color: var(--tm); transition: all 0.3s; display: inline-block; }

.star.full .star-inner { color: var(--y); }

.star.partial .star-inner {

background: linear-gradient(90deg, var(--y) var(--fill), var(--tm) var(--fill));

-webkit-background-clip: text; -webkit-text-fill-color: transparent;

}

.rt-sc { text-align: center; font-family: var(--fm); }

.rt-sn { font-size: 1.85rem; font-weight: 700; color: var(--y); }

.rt-st { font-size: 0.80rem; color: var(--tm); }

.rt-vc { text-align: center; font-size: 0.80rem; color: var(--tm); margin-top: 0.15rem; }

.rt-percentages { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.75rem; padding: 0.75rem; background: rgba(255,255,255,0.03); border-radius: 8px; border: 1px solid var(--br); }

.rt-perc-item { display: flex; justify-content: space-between; align-items: center; }

.rt-perc-label { font-size: 1.05rem; font-weight: 600; color: var(--ts); }

.rt-perc-val { font-family: var(--fm); font-size: 1.15rem; font-weight: 700; color: var(--g); }

/* ── Exchanges list ── */

.ex-l { display: flex; flex-direction: column; gap: 0.35rem; }

.ex-i {

display: flex; align-items: center; gap: 0.55rem;

padding: 0.45rem 0.55rem; border-radius: 6px;

background: var(--bg3); transition: all 0.3s;

cursor: pointer; text-decoration: none; color: var(--t);

}

.ex-i:hover { background: var(--hover); transform: translateX(2px); }

.ex-lg { width: 22px; height: 22px; border-radius: 5px; object-fit: contain; }

.ex-n { font-weight: 600; font-size: 1.05rem; flex: 1; }

.ex-ar { color: var(--tm); font-size: 0.76rem; }

/* ── Info tab ── */

.inf-i { display: flex; justify-content: space-between; padding: 0.45rem 0; border-bottom: 1px solid var(--br); }

.inf-i:last-child { border-bottom: none; }

.inf-l { font-size: 1.05rem; color: var(--ts); }

.inf-v { font-size: 1.05rem; font-weight: 600; text-align: right; }

.inf-v a { color: var(--cy); }

/* ═══════════════════════════════════════════════════════════════

5d ── FAVORITES PANEL (slide-in)

═══════════════════════════════════════════════════════════════ */

.fp {

position: fixed; top: 0; right: -105vw;

width: min(380px, 100vw); height: 100vh;

background: var(--bg2); border-left: 1px solid var(--br);

z-index: 200; transition: right 0.35s;

display: flex; flex-direction: column;

}

.fp.open { right: 0; box-shadow: -15px 0 50px rgba(0,0,0,0.5); }

.fp-h { padding: 1.1rem; border-bottom: 1px solid var(--br); display: flex; align-items: center; justify-content: space-between; }

.fp-t { font-family: var(--fd); font-size: 1.4rem; font-weight: 800; }

.fp-cl {

width: 34px; height: 34px; border-radius: 7px;

background: var(--bg3); border: 1px solid var(--br); color: var(--t);

display: flex; align-items: center; justify-content: center;

cursor: pointer; font-size: 1.10rem; transition: all 0.3s;

}

.fp-cl:hover { background: var(--rd); color: var(--r); }

.fp-b { flex: 1; overflow-y: auto; padding: 0.8rem; }

/* ── Favorito item ── */

.fi {

display: flex; align-items: center; gap: 0.65rem;

padding: 0.65rem; border-radius: 8px;

background: var(--card); border: 1px solid var(--br);

margin-bottom: 0.45rem; transition: all 0.3s; cursor: pointer;

}

.fi:hover { border-color: var(--brb); }

.fi-l { width: 30px; height: 30px; border-radius: 7px; object-fit: cover; }

.fi-i { flex: 1; }

.fi-n { font-weight: 600; font-size: 0.92rem; }

.fi-s { font-size: 0.80rem; color: var(--tm); font-family: var(--fm); }

.fi-p { font-family: var(--fm); font-weight: 700; font-size: 0.92rem; text-align: right; }

.fi-rm {

width: 26px; height: 26px; border-radius: 5px;

background: transparent; border: none; color: var(--tm);

cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 1.02rem;

}

.fi-rm:hover { background: var(--rd); color: var(--r); }

/* ── Overlay scuro ── */

.ov { position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 190; opacity: 0; pointer-events: none; transition: opacity 0.3s; }

.ov.act { opacity: 1; pointer-events: auto; }

/* ═══════════════════════════════════════════════════════════════

5e ── RESPONSIVE BREAKPOINTS

═══════════════════════════════════════════════════════════════ */

@media (max-width: 1200px) {

.dl { grid-template-columns: 1fr; }

.ds { position: static; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 0.75rem; }

}

/* ═══════════════════════════════════════════════════════════════
   DETAIL PAGE (pagina singola) — MOBILE STILE COINMARKETCAP
   Desktop invariato. Mobile: colonna singola, tutte le sezioni.
═══════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {

  /* Layout a colonna singola */
  .dl { display: flex; flex-direction: column; gap: 0.65rem; }

  .dm, .ds { width: 100%; min-width: 0; }

  /* Sidebar: flex column */
  .ds { display: flex; flex-direction: column; gap: 0.65rem; position: static; }

  /* Back button compatto */
  .bb { font-size: 0.82rem; padding: 0.4rem 0.75rem; margin-bottom: 0.5rem; }

  /* Asset header */
  .ahc { padding: 1rem; border-radius: 10px; }
  .aht { gap: 0.6rem; margin-bottom: 0.6rem; flex-wrap: nowrap; align-items: flex-start; }
  .adl { width: 36px; height: 36px; border-radius: 8px; }
  .ati h1 { font-size: 1.2rem; }
  .as { font-size: 0.8rem; }

  /* Fav button */
  .afd { margin-left: auto; padding: 0.4rem 0.6rem; font-size: 0.75rem; white-space: nowrap; }

  /* Prezzo prominente stile CMC */
  .apr { flex-wrap: nowrap; gap: 0.5rem; align-items: baseline; }
  .apb { font-size: 1.8rem; }
  .acb { font-size: 0.88rem; padding: 0.15rem 0.45rem; }

  /* Stats: 2 colonne compatte */
  #dStats.sr { grid-template-columns: 1fr 1fr; gap: 0.4rem; margin-bottom: 0.65rem; }
  .sc { padding: 0.6rem; border-radius: 8px; }
  .sl { font-size: 0.62rem; }
  .sv { font-size: 0.86rem; }

  /* Min/Max */
  .mm-box { padding: 0.85rem; border-radius: 10px; margin-bottom: 0.65rem; }
  .mm-t { font-size: 0.95rem; }
  .mm-g { grid-template-columns: 1fr; gap: 0.35rem; }
  .mm-i { padding: 0.45rem 0.6rem; }
  .mm-l { font-size: 0.62rem; }
  .mm-h, .mm-lo { font-size: 0.8rem; }

  /* Chart ridotto */
  .chtw { border-radius: 10px; margin-bottom: 0.65rem; }
  #tv_chart { height: 260px !important; }

  /* Descrizione */
  .desc { padding: 0.85rem; border-radius: 10px; margin-bottom: 0.65rem; }
  .desc-h { font-size: 1rem; margin-bottom: 0.5rem; }
  .desc-t { font-size: 0.88rem; line-height: 1.6; }

  /* Exchanges + Rating: 1 colonna */
  .exc-rank-grid { grid-template-columns: 1fr !important; gap: 0.65rem; }

  /* Sidebar cards */
  .sdc { padding: 0.85rem; border-radius: 10px; }
  .sdc-t { font-size: 1rem; margin-bottom: 0.5rem; }

  /* Sentiment */
  .sent-btns { gap: 0.35rem; margin-bottom: 0.5rem; }
  .sent-b { padding: 0.45rem; font-size: 0.84rem; border-radius: 7px; }

  /* News sidebar */
  .ns { max-height: 300px; }

  /* Vote buttons */
  .vote-btns { gap: 0.4rem; }
  .vb2 { padding: 0.45rem 0.75rem; font-size: 0.8rem; flex: 1; justify-content: center; }
  .vb2 svg { width: 16px; height: 16px; }

  /* Type tags */
  .type-tag { font-size: 0.64rem; padding: 0.1rem 0.35rem; }

}

@media (max-width: 480px) {
  .apb { font-size: 1.45rem; }
  .acb { font-size: 0.8rem; }
  .ati h1 { font-size: 1rem; }
  #tv_chart { height: 220px !important; }
  .desc-t { font-size: 0.82rem; }
  .sl { font-size: 0.58rem; }
  .sv { font-size: 0.8rem; }
}



@media (max-width: 1024px) {

.pred-g { grid-template-columns: repeat(2, 1fr); }

.two-c { grid-template-columns: 1fr; }

.sr { grid-template-columns: repeat(2, 1fr); }

.hero h1 { font-size: 2.4rem; }

}

@media (max-width: 768px) {

.hdr-c { padding: 0.55rem 0.75rem; gap: 0.5rem; }

.ctn { padding: 0.75rem; }

.pred-g { grid-template-columns: 1fr; }

.hero h1 { font-size: 1.8rem; }

.hero { padding: 1.2rem 0 0.75rem; margin-bottom: 0.75rem; }

.fp { width: 100%; }

.met-g { grid-template-columns: 1fr 1fr; }

.logo { font-size: 1.4rem; }

.logo-sub { display: none; }

.hdr-r { gap: 0.5rem; }

.fav-b { padding: 0.4rem 0.6rem; font-size: 0.8rem; }

.live { font-size: 0.75rem; }

.tab-b { padding: 0.55rem 0.75rem; font-size: 0.8rem; letter-spacing: 0.2px; }

.news-two-col { grid-template-columns: 1fr; max-height: none; }

.tbl-s { -webkit-overflow-scrolling: touch; }

.sr { grid-template-columns: 1fr 1fr; }

.dl { grid-template-columns: 1fr; }

.cn { flex-direction: column; }

.cn-img { width: 100%; height: 120px; border-radius: 8px 8px 0 0; }

.art-hero { height: 160px; }

table { min-width: 460px; }

th { padding: 0.55rem 0.5rem; font-size: 0.72rem; }

td { padding: 0.55rem 0.5rem; font-size: 0.82rem; }

.sh { flex-wrap: wrap; gap: 0.4rem; }

/* Nascondi colonne meno importanti su tablet */
th:nth-child(4), td:nth-child(4),
th:nth-child(6), td:nth-child(6) { display: none; }

}

@media (max-width: 480px) {

.met-g { grid-template-columns: 1fr 1fr; }

.hero h1 { font-size: 1.3rem; }

.hero p { font-size: 0.84rem; }

.hero { padding: 0.8rem 0 0.5rem; margin-bottom: 0.5rem; }

.sr { grid-template-columns: 1fr 1fr; }

.ctn { padding: 0.5rem; }

.hdr-c { padding: 0.5rem 0.55rem; }

.logo { font-size: 1.2rem; }

.tab-b { padding: 0.4rem 0.55rem; font-size: 0.72rem; }

.tkr { height: 36px; }

.tkr-s, .tkr-p { font-size: 0.78rem; }

.tkr-ch { font-size: 0.72rem; }

table { min-width: 300px; }

th { padding: 0.4rem 0.35rem; font-size: 0.66rem; }

td { padding: 0.4rem 0.35rem; font-size: 0.76rem; }

.fav-b { display: none; }

.upd { display: none; }

.sh .st { font-size: 1rem !important; }

.pred-c { padding: 0.75rem; }

.cn-img { height: 100px; }

/* Su smartphone mostra solo: #, Asset, Prezzo, 24H, Trend */
th:nth-child(4), td:nth-child(4),
th:nth-child(6), td:nth-child(6),
th:nth-child(7), td:nth-child(7),
th:nth-child(8), td:nth-child(8) { display: none; }

/* Crypto ticker items più compatti */
.tkr-i { padding: 0 0.6rem; gap: 0.3rem; }

/* Indicatori: 2 colonne su mobile */
.ind-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 0.4rem; }

.ind-card { padding: 0.6rem; }

.ind-card-value { font-size: 1.1rem; }

.ind-card-label { font-size: 0.68rem; }

/* Summary row */
.sr .met-c { padding: 0.6rem; }

.sr .met-v { font-size: 1rem; }

.sr .met-l { font-size: 0.68rem; }

}

@media (max-width: 375px) {

.hdr-c { padding: 0.35rem 0.4rem; }

.logo { font-size: 1.05rem; }

.logo-i { width: 28px; height: 28px; }

table { min-width: 260px; }

th { padding: 0.3rem 0.25rem; font-size: 0.62rem; }

td { padding: 0.3rem 0.25rem; font-size: 0.72rem; }

.tab-b { padding: 0.35rem 0.45rem; font-size: 0.68rem; }

.ctn { padding: 0.4rem 0.35rem; }

.tkr-s, .tkr-p { font-size: 0.74rem; }

/* Nascondi anche Trend su telefoni molto piccoli */
th:nth-child(9), td:nth-child(9) { display: none; }

}



/* ═══════════════════════════════════════════════════════════════════
   INDICATORI AVANZATI PANEL
   Posizionato tra Hero e Tabs — responsive WIX optimized
═══════════════════════════════════════════════════════════════════ */

.ind-panel { margin: 1.5rem 0 1rem 0; animation: fi 0.4s ease; }

.ind-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.5rem; }

.ind-title { display: flex; align-items: center; gap: 0.5rem; }

.ind-title h3 { font-family: var(--fd); font-size: 1.20rem; font-weight: 700; color: var(--t); margin: 0; }

.ind-badge { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.2rem 0.6rem; background: rgba(0,255,136,0.08); border: 1px solid rgba(0,255,136,0.2); border-radius: 20px; font-size: 0.76rem; font-weight: 600; color: var(--g); letter-spacing: 0.03em; }

.ind-badge .ind-pulse { width: 6px; height: 6px; background: var(--g); border-radius: 50%; animation: pulse 2s ease-in-out infinite; }

@keyframes pulse { 0%, 100% { opacity:1; transform:scale(1); } 50% { opacity:0.5; transform:scale(0.8); } }

.ind-upd { font-size: 0.68rem; color: var(--tm); font-weight: 500; display: flex; align-items: center; gap: 0.3rem; }
.ind-upd strong { color: var(--ts); }

.ind-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.65rem; overflow: visible; }

.ind-card { background: var(--card); border: 1px solid var(--br); border-radius: 10px; padding: 1rem; position: relative; overflow: visible; transition: border-color 0.3s ease; cursor: default; }
.ind-card:hover { border-color: rgba(255,255,255,0.15); }
/* card stagger removed - static display */

.ind-card::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; opacity:0; transition:opacity 0.25s; }
.ind-card.ind-success::before { background: linear-gradient(90deg, transparent, var(--g), transparent); }
.ind-card.ind-warning::before { background: linear-gradient(90deg, transparent, var(--o), transparent); }
.ind-card.ind-danger::before { background: linear-gradient(90deg, transparent, var(--r), transparent); }

.ind-card:hover { border-color: var(--brb); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.35); }
.ind-card:hover::before { opacity: 1; }

.ind-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.6rem; }

.ind-card-label { font-size: 0.95rem; font-weight: 700; color: var(--tm); text-transform: uppercase; letter-spacing: 0.06em; display: flex; align-items: center; gap: 0.3rem; }
.ind-card-label.label-success { color: var(--g); }
.ind-card-label.label-danger { color: var(--r); }
.ind-card-label.label-warning { color: var(--o); }
.ind-card-label .ind-icon { font-size: 1.15rem; }

.ind-info-btn { width: 18px; height: 18px; display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: 50%; font-size: 0.72rem; font-weight: 800; color: var(--b); cursor: pointer; transition: all 0.25s cubic-bezier(0.4,0,0.2,1); position: relative; z-index: 5; flex-shrink: 0; }
.ind-info-btn:hover { background: var(--b); border-color: var(--b); color: white; transform: scale(1.2); box-shadow: 0 0 12px rgba(59,130,246,0.4); }

.ind-card-value { font-family: var(--fm); font-size: 1.35rem; font-weight: 700; line-height: 1; color: var(--t); letter-spacing: -0.02em; margin-bottom: 0.3rem; }
.ind-card-row { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }

.ind-change { display: inline-flex; align-items: center; gap: 0.15rem; font-size: 0.68rem; font-weight: 600; padding: 0.1rem 0.3rem; border-radius: 3px; }
.ind-change.up { color: var(--g); background: var(--gd); }
.ind-change.dn { color: var(--r); background: var(--rd); }

.ind-status { display: inline-flex; align-items: center; padding: 0.15rem 0.5rem; font-size: 0.72rem; font-weight: 700; border-radius: 4px; letter-spacing: 0.02em; }
.ind-status.s-success { background: rgba(0,255,136,0.1); color: var(--g); border: 1px solid rgba(0,255,136,0.2); }
.ind-status.s-warning { background: rgba(245,158,11,0.1); color: var(--o); border: 1px solid rgba(245,158,11,0.2); }
.ind-status.s-danger { background: rgba(255,71,87,0.1); color: var(--r); border: 1px solid rgba(255,71,87,0.2); }

.ind-progress { height: 4px; background: rgba(255,255,255,0.06); border-radius: 2px; overflow: hidden; margin-top: 0.4rem; }
.ind-progress-fill { height: 100%; border-radius: 2px; transition: width 0.8s cubic-bezier(0.25,0.1,0.25,1); }
.ind-progress-fill.pf-success { background: linear-gradient(90deg, rgba(0,255,136,0.4), var(--g)); }
.ind-progress-fill.pf-warning { background: linear-gradient(90deg, rgba(245,158,11,0.4), var(--o)); }
.ind-progress-fill.pf-danger { background: linear-gradient(90deg, rgba(255,71,87,0.4), var(--r)); }

.ind-bars { display: flex; align-items: flex-end; gap: 2px; height: 32px; margin-top: 0.4rem; }
.ind-bar { flex: 1; border-radius: 1.5px 1.5px 0 0; min-height: 3px; transition: all 0.3s; opacity: 0.35; }
.ind-bar.ab { opacity: 0.75; }

.ind-tooltip-overlay { position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.7); backdrop-filter:blur(6px); z-index:99999; display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:all 0.4s cubic-bezier(0.4,0,0.2,1); padding:1rem; }
.ind-tooltip-overlay.active { opacity:1; visibility:visible; }
.ind-tooltip-modal { position:relative; background:linear-gradient(155deg,rgba(17,24,39,0.98) 0%,rgba(11,15,25,0.99) 60%,rgba(15,20,35,0.98) 100%); border:1px solid rgba(255,255,255,0.1); border-radius:20px; padding:2.25rem; width:100%; max-width:500px; max-height:80vh; overflow-y:auto; box-shadow:0 32px 64px rgba(0,0,0,0.65),0 0 0 1px rgba(255,255,255,0.04),0 0 80px rgba(59,130,246,0.06); transform:scale(0.92) translateY(24px); transition:transform 0.5s cubic-bezier(0.34,1.56,0.64,1),box-shadow 0.5s ease; }
.ind-tooltip-overlay.active .ind-tooltip-modal { transform:scale(1) translateY(0); box-shadow:0 32px 64px rgba(0,0,0,0.65),0 0 0 1px rgba(255,255,255,0.06),0 0 100px rgba(59,130,246,0.08); }
.ind-tooltip-modal::-webkit-scrollbar { width:4px; } .ind-tooltip-modal::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.15); border-radius:4px; }
.ind-tooltip-close { position:absolute; top:1rem; right:1rem; width:32px; height:32px; border-radius:8px; border:1px solid rgba(255,255,255,0.08); background:rgba(255,255,255,0.04); color:var(--ts); display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:1.1rem; transition:all 0.2s; z-index:2; }
.ind-tooltip-close:hover { background:rgba(239,68,68,0.15); border-color:rgba(239,68,68,0.3); color:#ef4444; transform:scale(1.1); }
.ind-tooltip-modal-title { font-size:1.2rem; letter-spacing:-0.01em; font-weight:700; color:var(--t); margin-bottom:1rem; padding-right:2.5rem; line-height:1.4; }
.ind-tooltip-modal-body { font-size:0.9rem; color:var(--ts); line-height:1.85; }
.ind-tooltip-modal-body strong { color:#22c55e; font-weight:600; }
@media(max-width:480px) { .ind-tooltip-modal { padding:1.5rem; max-width:95vw; } .ind-tooltip-modal-title { font-size:1rem; } .ind-tooltip-modal-body { font-size:0.82rem; line-height:1.7; } }

.ind-analysis { 
  margin-top: 1rem; 
  background: linear-gradient(135deg, rgba(17,24,39,0.95) 0%, rgba(11,15,25,0.98) 100%);
  border: 1px solid rgba(255,255,255,0.08); 
  border-radius: 16px; 
  overflow: hidden; 
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 8px 32px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.05);
}

.ind-analysis-hdr { 
  display: flex; 
  align-items: center; 
  justify-content: space-between; 
  padding: 1.25rem 1.5rem; 
  cursor: pointer; 
  transition: all 0.3s;
  flex-wrap: wrap; 
  gap: 0.75rem;
  background: linear-gradient(90deg, rgba(59,130,246,0.05) 0%, rgba(139,92,246,0.05) 100%);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.ind-analysis-hdr:hover { 
  background: linear-gradient(90deg, rgba(59,130,246,0.08) 0%, rgba(139,92,246,0.08) 100%);
  border-bottom-color: rgba(255,255,255,0.1);
}

.ind-analysis-hdr-left { 
  display: flex; 
  align-items: center; 
  gap: 0.75rem; 
}

.ind-analysis-icon { 
  font-size: 2rem;
  filter: drop-shadow(0 0 12px rgba(59,130,246,0.6));
  animation: aiPulse 2s ease-in-out infinite;
}

@keyframes aiPulse {
  0%, 100% { transform: scale(1); filter: drop-shadow(0 0 12px rgba(59,130,246,0.6)); }
  50% { transform: scale(1.05); filter: drop-shadow(0 0 20px rgba(139,92,246,0.8)); }
}

.ind-analysis-title { 
  font-family: var(--fd); 
  font-size: 1.4rem; 
  font-weight: 800; 
  color: var(--t);
  letter-spacing: -0.02em;
  background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.ind-analysis-sub { 
  font-size: 1rem; 
  color: var(--ts);
  font-weight: 500;
  margin-top: 0.15rem;
}

.ind-sentiment { 
  padding: 0.65rem 1.25rem;
  border-radius: 10px; 
  font-weight: 800; 
  font-size: 0.9rem; 
  text-transform: uppercase; 
  letter-spacing: 0.05em;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  position: relative;
  border: 2px solid;
  min-width: 140px;
  text-align: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  line-height: 1;
}

.ind-sentiment::before {
  content: '';
  font-size: 1rem;
  font-weight: 900;
  line-height: 1;
}

/* BULLISH - Verde con freccia su */
.ind-sentiment.bullish { 
  background: linear-gradient(135deg, rgba(0,255,136,0.2) 0%, rgba(16,185,129,0.15) 100%);
  color: #00ff88; 
  border-color: rgba(0,255,136,0.4);
  text-shadow: 0 0 10px rgba(0,255,136,0.3);
}

.ind-sentiment.bullish::before {
  content: '\25B2';
  color: #00ff88;
  filter: drop-shadow(0 0 6px rgba(0,255,136,0.6));
}

/* NEUTRALE - Giallo con linea */
.ind-sentiment.neutral { 
  background: linear-gradient(135deg, rgba(255,191,36,0.2) 0%, rgba(245,158,11,0.15) 100%);
  color: #fbbf24; 
  border-color: rgba(255,191,36,0.4);
  text-shadow: 0 0 10px rgba(255,191,36,0.3);
}

.ind-sentiment.neutral::before {
  content: '\25AC';
  color: #fbbf24;
  filter: drop-shadow(0 0 6px rgba(255,191,36,0.6));
}

/* BEARISH - Rosso con freccia giù */
.ind-sentiment.bearish { 
  background: linear-gradient(135deg, rgba(255,71,87,0.2) 0%, rgba(239,68,68,0.15) 100%);
  color: #ff4757; 
  border-color: rgba(255,71,87,0.4);
  text-shadow: 0 0 10px rgba(255,71,87,0.3);
}

.ind-sentiment.bearish::before {
  content: '\25BC';
  color: #ff4757;
  filter: drop-shadow(0 0 6px rgba(255,71,87,0.6));
}

.ind-toggle-btn { 
  padding: 0.65rem 1.25rem; 
  background: linear-gradient(135deg, rgba(0,255,136,0.15) 0%, rgba(16,185,129,0.2) 100%);
  border: 2px solid rgba(0,255,136,0.3); 
  border-radius: 10px; 
  color: var(--g); 
  font-size: 0.9rem; 
  font-weight: 800; 
  cursor: pointer; 
  transition: all 0.3s;
  box-shadow: 0 4px 12px rgba(0,255,136,0.15);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  min-width: 140px;
  text-align: center;
}

.ind-toggle-btn:hover { 
  background: linear-gradient(135deg, rgba(0,255,136,0.25) 0%, rgba(16,185,129,0.3) 100%);
  border-color: rgba(0,255,136,0.5);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,255,136,0.25);
}

.ind-analysis-body { 
  max-height: 0; 
  overflow: hidden; 
  transition: max-height 0.5s cubic-bezier(0.4,0,0.2,1), opacity 0.3s;
  opacity: 0;
}

.ind-analysis.expanded .ind-analysis-body { 
  max-height: 3000px;
  opacity: 1;
}

.ind-analysis.expanded .ind-toggle-btn { 
  background: linear-gradient(135deg, rgba(255,71,87,0.15) 0%, rgba(239,68,68,0.2) 100%);
  border-color: rgba(255,71,87,0.3); 
  color: var(--r);
}

.ind-analysis.expanded .ind-toggle-btn:hover {
  background: linear-gradient(135deg, rgba(255,71,87,0.25) 0%, rgba(239,68,68,0.3) 100%);
  border-color: rgba(255,71,87,0.5);
}

.ind-analysis-content { 
  padding: 1.5rem; 
}

.ind-analysis-block { 
  padding: 1.25rem;
  margin-bottom: 1rem;
  background: rgba(255,255,255,0.02);
  border-radius: 12px;
  border-left: 4px solid transparent;
  transition: all 0.3s;
  position: relative;
  overflow: hidden;
}

.ind-analysis-block:hover {
  background: rgba(255,255,255,0.04);
  transform: translateX(4px);
}

.ind-analysis-block:nth-child(1) { 
  border-left-color: #3b82f6;
  background: linear-gradient(90deg, rgba(59,130,246,0.08) 0%, rgba(255,255,255,0.02) 100%);
}

.ind-analysis-block:nth-child(2) { 
  border-left-color: #f59e0b;
  background: linear-gradient(90deg, rgba(245,158,11,0.08) 0%, rgba(255,255,255,0.02) 100%);
}

.ind-analysis-block:nth-child(3) { 
  border-left-color: #8b5cf6;
  background: linear-gradient(90deg, rgba(139,92,246,0.08) 0%, rgba(255,255,255,0.02) 100%);
}

.ind-analysis-block:nth-child(4) { 
  border-left-color: #ef4444;
  background: linear-gradient(90deg, rgba(239,68,68,0.08) 0%, rgba(255,255,255,0.02) 100%);
}

.ind-analysis-label { 
  font-size: 1rem; 
  font-weight: 800; 
  color: var(--t); 
  text-transform: uppercase; 
  letter-spacing: 0.08em; 
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.ind-analysis-text { 
  font-size: 1.1rem; 
  line-height: 1.75; 
  color: var(--ts);
  font-weight: 500;
}

.ind-analysis-text strong { 
  color: var(--t); 
  font-weight: 700; 
}

.ind-analysis-text .hl { 
  color: var(--g); 
  font-weight: 700;
  text-shadow: 0 0 8px rgba(0,255,136,0.3);
}

.ind-analysis-text .wl { 
  color: var(--o); 
  font-weight: 700;
  text-shadow: 0 0 8px rgba(245,158,11,0.3);
}

.ind-analysis-text .dl { 
  color: var(--r); 
  font-weight: 700;
  text-shadow: 0 0 8px rgba(255,71,87,0.3);
}

.ind-recs-grid { 
  display: grid; 
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); 
  gap: 1rem; 
  margin-top: 0.75rem; 
}

.ind-rec-card { 
  background: linear-gradient(135deg, rgba(59,130,246,0.05) 0%, rgba(139,92,246,0.05) 100%);
  border: 1px solid rgba(255,255,255,0.1); 
  border-radius: 12px; 
  padding: 1.25rem; 
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.ind-rec-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #3b82f6 0%, #8b5cf6 100%);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s;
}

.ind-rec-card:hover::before {
  transform: scaleX(1);
}

.ind-rec-card:hover { 
  background: linear-gradient(135deg, rgba(59,130,246,0.1) 0%, rgba(139,92,246,0.1) 100%);
  border-color: rgba(139,92,246,0.3);
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(59,130,246,0.2);
}

.ind-rec-title { 
  font-size: 1rem; 
  font-weight: 700; 
  color: var(--t); 
  margin-bottom: 0.5rem; 
  display: flex; 
  align-items: center; 
  gap: 0.5rem;
}

.ind-rec-body { 
  font-size: 0.95rem; 
  line-height: 1.6; 
  color: var(--ts);
  font-weight: 500;
}

.ind-rec-body strong {
  color: var(--t);
  font-weight: 700;
}

.ind-loading { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:2rem; gap:0.75rem; grid-column:1/-1; color:var(--tm); font-size:0.8rem; }
.ind-loading-dots { display:flex; gap:0.4rem; }
.ind-loading-dot { width:6px; height:6px; background:var(--b); border-radius:50%; animation:indBounce 1.4s ease-in-out infinite; }
.ind-loading-dot:nth-child(1){animation-delay:-0.32s} .ind-loading-dot:nth-child(2){animation-delay:-0.16s}
@keyframes indBounce { 0%,80%,100%{transform:scale(0);opacity:0.5} 40%{transform:scale(1);opacity:1} }

/* grid transitions removed - static display, update every 3h */

@media (max-width:1200px) { .ind-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width:768px) { .ind-grid { grid-template-columns: repeat(2, 1fr); gap: 0.5rem; } .ind-card { padding: 0.75rem; } .ind-card-value { font-size: 1.20rem; } .ind-header { flex-direction: column; align-items: flex-start; } .ind-recs-grid { grid-template-columns: 1fr; } .main-metrics-grid { grid-template-columns: 1fr; gap: 0.6rem; } }
@media (max-width:480px) { .ind-grid { grid-template-columns: 1fr 1fr; gap: 0.4rem; } .ind-card { padding: 0.6rem; } .ind-card-value { font-size: 1.10rem; } .ind-card-label { font-size: 0.68rem; } .ind-status { font-size: 0.68rem; padding: 0.1rem 0.35rem; } .ind-title h3 { font-size: 1.02rem; } .main-metrics-grid { grid-template-columns: 1fr; gap: 0.5rem; } .main-metric-card { padding: 0.7rem; } }

/* ═══════════════════════════════════════════════════════════════
   WIX IFRAME + RESPONSIVE POLISH GLOBALE
═══════════════════════════════════════════════════════════════ */

html { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

.content, .ctn, .hdr-c { max-width: 100%; }

/* Center content on all screens */
.ctn { margin-left: auto; margin-right: auto; }
.hdr-c { margin-left: auto; margin-right: auto; }

img { max-width: 100%; height: auto; }

.tbl-s { -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }

.tab-b, .fav-b, button, [role="button"] { min-height: 36px; }

@media (max-width: 900px) {
  .tabs::after { content: ''; min-width: 0.5rem; display: block; }
  .tab-b { scroll-snap-align: start; }
}

@media (max-width: 600px) {
  .fp { width: 100% !important; right: -105vw !important; border-radius: 0; }
  .fp.open { right: 0 !important; }
  .news-two-col { grid-template-columns: 1fr !important; }
  .cn { gap: 0.5rem; }
  .cn-tt { font-size: 0.95rem; }
}

@media (max-width: 500px) {
  .hero-c h1 { font-size: 1.2rem !important; }
  .hero-c p { font-size: 0.8rem !important; margin-top: 0.3rem; }
  .hero { padding: 0.6rem 0 0.4rem !important; margin-bottom: 0.4rem !important; }
  .pred-g { grid-template-columns: 1fr !important; }
}

@media (max-width: 360px) {
  .sr { grid-template-columns: 1fr 1fr; gap: 0.3rem; }
  .ind-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ── TV Timeframe Buttons ─────────────────────────────────── */
.tv-tf-bar {
  display: none; /* nascosto su desktop */
  gap: 0.3rem; padding: 0.5rem 0.75rem;
  background: var(--bg3); border-bottom: 1px solid var(--br);
  overflow-x: auto; scrollbar-width: none;
}
.tv-tf-bar::-webkit-scrollbar { display: none; }
.tv-tf-btn {
  padding: 0.25rem 0.65rem; border-radius: 5px; font-size: 0.78rem;
  font-weight: 700; border: 1px solid var(--br); background: transparent;
  color: var(--ts); cursor: pointer; transition: all 0.2s; white-space: nowrap;
  font-family: var(--fb);
}
.tv-tf-btn:hover { background: rgba(255,255,255,0.06); color: var(--t); }
.tv-tf-btn.act { background: rgba(0,255,136,0.15); border-color: rgba(0,255,136,0.5); color: var(--g); }

/* ═══════════════════════════ OMC PROPRIETARY CHART ═══════════════════════════ */
.omc-wrap { background: var(--card); border: 1px solid var(--br); border-radius: 12px; overflow: hidden; margin-bottom: 1rem; }
.omc-bar {
  display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap;
  padding: 0.55rem 0.8rem; background: var(--bg3); border-bottom: 1px solid var(--br);
}
.omc-toggle { display: flex; gap: 0; border: 1px solid var(--br); border-radius: 6px; overflow: hidden; }
.omc-tog-btn {
  padding: 0.22rem 0.7rem; font-size: 0.72rem; font-weight: 700;
  background: transparent; color: var(--ts); border: none; cursor: pointer;
  font-family: var(--fb); transition: all 0.2s;
}
.omc-tog-btn.act { background: rgba(0,255,136,0.18); color: var(--g); }
.omc-sep { width: 1px; background: var(--br); margin: 0.1rem 0.3rem; }
.omc-tf-grp { display: flex; gap: 0.25rem; }
.omc-tf-btn {
  padding: 0.22rem 0.55rem; font-size: 0.72rem; font-weight: 700;
  background: transparent; color: var(--ts); border: 1px solid transparent;
  border-radius: 5px; cursor: pointer; font-family: var(--fb); transition: all 0.2s;
}
.omc-tf-btn:hover { color: var(--t); background: rgba(255,255,255,0.05); }
.omc-tf-btn.act { background: rgba(0,255,136,0.15); border-color: rgba(0,255,136,0.45); color: var(--g); }
.omc-tv-btn {
  margin-left: auto; padding: 0.22rem 0.65rem; font-size: 0.7rem; font-weight: 700;
  background: rgba(59,130,246,0.12); border: 1px solid rgba(59,130,246,0.35);
  border-radius: 6px; color: var(--b); cursor: pointer; font-family: var(--fb);
  text-decoration: none; white-space: nowrap; transition: all 0.2s; display: inline-flex; align-items: center; gap: 0.3rem;
}
.omc-tv-btn:hover { background: rgba(59,130,246,0.22); color: #93c5fd; }
.omc-canvas-wrap { position: relative; height: 700px; }
.omc-canvas-wrap canvas { display: block; }
.omc-tooltip {
  position: absolute; top: 8px; left: 10px; pointer-events: none;
  background: rgba(11,16,24,0.92); border: 1px solid var(--br);
  border-radius: 8px; padding: 0.35rem 0.65rem; font-family: var(--fm);
  font-size: 0.72rem; color: var(--t); z-index: 10; display: none;
  backdrop-filter: blur(6px); line-height: 1.6;
}
.omc-stat-bar {
  display: flex; gap: 1.2rem; padding: 0.5rem 0.9rem;
  border-top: 1px solid var(--br); background: rgba(0,0,0,0.15);
  font-size: 0.72rem; flex-wrap: wrap;
}
.omc-stat-item { display: flex; gap: 0.3rem; align-items: center; color: var(--ts); }
.omc-stat-val { font-weight: 700; font-family: var(--fm); color: var(--t); }
.omc-loading {
  height: 700px; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 0.6rem; color: var(--ts); font-size: 0.82rem;
}
.omc-spinner {
  width: 28px; height: 28px; border: 3px solid var(--br);
  border-top-color: var(--g); border-radius: 50%; animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.omc-nodata {
  height: 680px; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 0.8rem; color: var(--ts); text-align: center; padding: 1.5rem;
}
.omc-nodata-ico { font-size: 2rem; }
.omc-nodata-txt { font-size: 0.82rem; line-height: 1.5; }
.omc-nodata-tv {
  padding: 0.5rem 1.2rem; background: rgba(59,130,246,0.12);
  border: 1px solid rgba(59,130,246,0.4); border-radius: 8px;
  color: var(--b); font-weight: 700; font-size: 0.82rem; cursor: pointer;
  text-decoration: none; font-family: var(--fb); transition: all 0.2s;
}
.omc-nodata-tv:hover { background: rgba(59,130,246,0.22); }
@media (max-width: 900px) {
  .omc-canvas-wrap { height: 480px; }
  .omc-loading { height: 480px; }
  #omcTvFallback { height: 480px; }
  .omc-nodata { height: 460px; }
}
@media (max-width: 600px) {
  .omc-canvas-wrap { height: 340px; }
  .omc-loading { height: 340px; }
  #omcTvFallback { height: 340px; }
  .omc-nodata { height: 320px; }
  .omc-bar { gap: 0.3rem; padding: 0.45rem 0.6rem; }
  .omc-tf-btn { padding: 0.18rem 0.4rem; font-size: 0.68rem; }
  .omc-tog-btn { padding: 0.18rem 0.5rem; font-size: 0.68rem; }
  .omc-stat-bar { gap: 0.8rem; padding: 0.4rem 0.6rem; }
}
/* Mini navigator */
.omc-nav-wrap {
  position: relative; height: 72px; border-top: 1px solid var(--br);
  background: rgba(0,0,0,0.2);
}
.omc-nav-label {
  position: absolute; bottom: 4px; left: 50%; transform: translateX(-50%);
  font-size: 0.6rem; color: rgba(139,149,165,0.5); pointer-events: none; white-space: nowrap;
}
/* Watermark */
.omc-watermark {
  position: absolute; bottom: 10px; right: 12px;
  display: flex; align-items: center; gap: 6px;
  opacity: 0.18; pointer-events: none; z-index: 5;
}
.omc-watermark img { width: 26px; height: 26px; border-radius: 50%; }
.omc-watermark span {
  font-family: var(--fb); font-weight: 800; font-size: 0.75rem;
  color: #00ff88; letter-spacing: 0.04em; text-transform: uppercase;
}
/* TV fallback wrapper */
#omcTvFallback { width: 100%; height: 700px; }
/* No-data minimal */
.omc-nodata-min {
  height: 120px; display: flex; align-items: center; justify-content: center; padding: 1rem;
}

/* ── Art-share buttons restyle ────────────────────────────── */
.art-share {
  display: flex; align-items: center; gap: 0.55rem; flex-wrap: wrap;
  padding: 0.75rem 1.3rem; border-top: 1px solid var(--br);
}
.art-sb-back {
  display: inline-flex; align-items: center; gap: 0.35rem;
  padding: 0.45rem 1rem; border-radius: 8px; font-size: 0.85rem;
  font-weight: 700; border: 1px solid var(--br);
  background: var(--bg3); color: var(--ts); cursor: pointer;
  transition: all 0.2s; font-family: var(--fb); text-decoration: none;
}
.art-sb-back:hover { background: rgba(255,255,255,0.07); color: var(--t); }
.art-sb-share {
  display: inline-flex; align-items: center; gap: 0.35rem;
  padding: 0.45rem 1rem; border-radius: 8px; font-size: 0.85rem;
  font-weight: 700; border: 1px solid rgba(0,255,136,0.35);
  background: rgba(0,255,136,0.1); color: var(--g); cursor: pointer;
  transition: all 0.2s; font-family: var(--fb);
}
.art-sb-share:hover { background: rgba(0,255,136,0.2); }

/* ── Share panel ────────────────────────────────────────────── */
.share-panel { animation: fadeIn 0.15s ease; }
.share-icons {
  display: flex; flex-wrap: wrap; gap: 0.45rem; align-items: center;
}
.sh-ico {
  display: flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 10px; cursor: pointer;
  border: 1px solid rgba(255,255,255,0.1); transition: all 0.2s;
  text-decoration: none; flex-shrink: 0;
}
.sh-ico svg { width: 18px; height: 18px; }
.sh-ico:hover { transform: scale(1.1); }
.sh-wa { background: #25D366; color: #fff; }
.sh-tg { background: #229ED9; color: #fff; }
.sh-fb { background: #1877F2; color: #fff; }
.sh-ig { background: linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); color: #fff; font-weight:700; font-size:0.75rem; }
.sh-tt { background: #010101; color: #fff; border-color: rgba(255,255,255,0.2); font-weight:700; font-size:0.72rem; }
.sh-x  { background: #000; color: #fff; border-color: rgba(255,255,255,0.2); }
.sh-dc { background: #5865F2; color: #fff; }
.sh-ln { background: var(--bg3); color: var(--g); border-color: rgba(0,255,136,0.3); font-size: 1.3rem; line-height: 1; }

/* ── Gainers/Losers grid ──────────────────────────────────── */
.gain-loss-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

/* ── Stocks tab mobile header ─────────────────────────────── */
.stk-header-title { font-size: 1.1rem; font-weight: 700; color: var(--cy); }
.stk-cat-scroll { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }

/* ── Mobile overrides @768px ─────────────────────────────── */
@media (max-width: 768px) {

  /* Top Gainers/Losers: 1 colonna */
  .gain-loss-grid { grid-template-columns: 1fr !important; gap: 0.65rem !important; }

  /* Stocks tab header */
  .stk-header { flex-direction: column !important; align-items: flex-start !important; gap: 6px !important; }
  .stk-header-title { display: none !important; }
  .stk-search { font-size: 0.78rem !important; max-width: 160px !important; padding: 5px 10px !important; }
  .stk-cat-scroll { flex-wrap: nowrap !important; overflow-x: auto !important; scrollbar-width: none !important; padding-bottom: 2px; }
  .stk-cat-scroll::-webkit-scrollbar { display: none; }
  .cat-filter { white-space: nowrap !important; flex-shrink: 0 !important; font-size: 0.68rem !important; padding: 3px 8px !important; }
  /* Live button align */
  .stk-header > div:last-child { width: 100%; }

  /* Sentiment (Bullish/Bearish) */
  .sent-b { padding: 0.38rem 0.5rem !important; font-size: 0.78rem !important; }

  /* Vote buttons */
  .vb2 { padding: 0.38rem 0.6rem !important; font-size: 0.78rem !important; flex: 1; }
  .vb2 svg { width: 14px !important; height: 14px !important; }
  .vote-btns { flex-wrap: wrap !important; gap: 0.3rem !important; }

  /* Art-share buttons */
  .art-share { padding: 0.55rem 0.85rem !important; gap: 0.35rem !important; }
  .art-sb-back, .art-sb-share { padding: 0.38rem 0.7rem !important; font-size: 0.78rem !important; }
  .sh-ico { width: 33px !important; height: 33px !important; border-radius: 8px !important; }
  .sh-ico svg { width: 15px !important; height: 15px !important; }
  .sh-ig, .sh-tt { font-size: 0.65rem !important; }

  /* TV timeframe bar: mostra su mobile */
  .tv-tf-bar { display: flex !important; }
  .tv-tf-btn { padding: 0.2rem 0.5rem; font-size: 0.72rem; }
}

/* ── CoinMarketCap Mobile Table Style ─────────────────────── */
@media (max-width: 480px) {
  .tbl-s { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  table { min-width: 0; width: 100%; border-collapse: collapse; }
  
  /* Thead sticky compatto */
  thead { position: sticky; top: 0; z-index: 10; background: var(--bg3); }
  th { font-size: 0.6rem; padding: 0.35rem 0.2rem; letter-spacing: 0.2px; }

  /* Nascondi: 1H(col4), 7D(col6), Vol(col7), MCap(col8), Exchange/Sector(col9) */
  .tab-c th:nth-child(4), .tab-c td:nth-child(4),
  .tab-c th:nth-child(6), .tab-c td:nth-child(6),
  .tab-c th:nth-child(7), .tab-c td:nth-child(7),
  .tab-c th:nth-child(8), .tab-c td:nth-child(8),
  .tab-c th:nth-child(9), .tab-c td:nth-child(9) { display: none !important; }

  /* Celle visibili: #, Asset, Prezzo, 24H, Trend */
  td:nth-child(1) { font-size: 0.62rem; color: var(--tm); padding: 0.4rem 0.2rem; width: 18px; }
  td:nth-child(2) { padding: 0.4rem 0.25rem; }
  td:nth-child(3) { font-size: 0.75rem; font-weight: 700; padding: 0.4rem 0.2rem; }
  td:nth-child(5) { font-size: 0.75rem; font-weight: 700; padding: 0.4rem 0.2rem; }

  /* Asset name */
  .coin-symbol { font-size: 0.75rem; font-weight: 700; }
  .coin-name, .an { font-size: 0.6rem; color: var(--tm); }
  .al { width: 20px !important; height: 20px !important; }
  .alp { width: 20px !important; height: 20px !important; font-size: 0.6rem !important; }

  /* Gainers/Losers: 5 colonne piccole già ok */
  #topTB td, #flopTB td { font-size: 0.7rem; padding: 0.35rem 0.2rem; }

  /* Row tap */
  tr:active td { background: rgba(255,255,255,0.04); }
}


/* ---- ECO CALENDAR ---- */
/* ============================================================
   ECONOMIC CALENDAR TIMELINE
   ============================================================ */
.eco-cal-wrap {
  background: var(--card); border: 1px solid var(--br);
  border-radius: 14px; margin-bottom: 0.5rem; overflow: hidden;
}
.eco-cal-hdr {
  display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap;
  padding: 0.45rem 1.1rem 0.35rem;
  border-bottom: 1px solid var(--br);
  background: var(--bg3);
}
.eco-cal-title {
  font-family: var(--fd); font-size: 0.88rem; font-weight: 800;
  color: var(--cy); letter-spacing: 0.02em;
}
.eco-cal-sub {
  font-size: 0.72rem; color: var(--ts); flex: 1;
}
.eco-cal-next {
  font-size: 0.68rem; color: var(--tm);
}
/* Timeline scroll container */
.eco-cal-timeline {
  display: grid;
  grid-template-columns: repeat(14, minmax(78px, 1fr));
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--br) transparent;
  min-height: 56px;
  padding-top: 0.15rem;
}
.eco-cal-timeline::-webkit-scrollbar { height: 5px; }
.eco-cal-timeline::-webkit-scrollbar-track { background: var(--bg3); }
.eco-cal-timeline::-webkit-scrollbar-thumb { background: var(--br); border-radius: 4px; }

/* Day column */
.eco-day {
  display: flex; flex-direction: column; align-items: center;
  padding: 0.3rem 0.3rem 0.35rem;
  border-right: 1px solid var(--br);
  min-width: 80px; position: relative;
  transition: background 0.2s;
}
.eco-day:last-child { border-right: none; }
.eco-day.today {
  background: rgba(0,255,136,0.05);
}
.eco-day.today .eco-day-label {
  color: var(--g); background: rgba(0,255,136,0.12);
  border-radius: 5px; padding: 0.1rem 0.35rem;
}
.eco-day.today::after {
  content: '';
  position: absolute; bottom: 0; left: 0; right: 0; height: 2px;
  background: var(--g);
}

/* Day header */
.eco-day-label {
  font-size: 0.58rem; font-weight: 700; color: var(--ts);
  text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 0;
}
.eco-day-num {
  font-size: 0.92rem; font-weight: 800; color: var(--t); line-height: 1;
  margin-bottom: 0.2rem;
}
.eco-day.today .eco-day-num { color: var(--g); }

/* Events stack */
.eco-events-stack {
  display: flex; flex-direction: column; align-items: center;
  gap: 3px; width: 100%;
}
.eco-no-events {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--br); margin-top: 2px; opacity: 0.35;
}

/* Event flag button */
.eco-flag-btn {
  position: relative; cursor: pointer; border: none; background: none;
  padding: 0; display: flex; flex-direction: column; align-items: center;
  gap: 1px; transition: transform 0.15s;
}
.eco-flag-btn:hover { transform: scale(1.12); }
.eco-flag-btn:hover .eco-flag-tooltip { opacity: 1; pointer-events: none; }

.eco-flag-img {
  width: 24px; height: 16px; border-radius: 2px;
  object-fit: cover; border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}
.eco-flag-dot {
  width: 6px; height: 6px; border-radius: 50%;
  position: absolute; top: -2px; right: -2px; border: 1px solid var(--bg3);
}
.eco-flag-dot.high { background: var(--r); }
.eco-flag-dot.medium { background: var(--o); }
.eco-flag-dot.low { background: var(--ts); }

/* Hover tooltip */
.eco-flag-tooltip {
  position: absolute; bottom: 115%; left: 50%; transform: translateX(-50%);
  background: var(--bg3); border: 1px solid var(--br); border-radius: 6px;
  padding: 0.3rem 0.55rem; white-space: nowrap; font-size: 0.62rem;
  color: var(--t); pointer-events: none; opacity: 0; transition: opacity 0.15s;
  z-index: 50; box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}
.eco-flag-tooltip::after {
  content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
  border: 4px solid transparent; border-top-color: var(--br);
}

/* ── Economic Event POPUP ──────────────────────────────────── */
.eco-pop-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(0,0,0,0.6); z-index: 9000;
  backdrop-filter: blur(4px);
}
.eco-pop-overlay.show { display: block; }
.eco-pop {
  display: none; position: fixed; left: 50%; top: 50%;
  transform: translate(-50%,-50%);
  background: var(--card); border: 1px solid var(--br);
  border-radius: 16px; width: min(500px, 95vw); max-height: 88vh;
  overflow-y: auto; z-index: 9001; padding: 1.5rem;
  box-shadow: 0 20px 60px rgba(0,0,0,0.6);
  animation: popIn 0.2s ease;
}
.eco-pop.show { display: block; }
.eco-pop-close {
  position: absolute; top: 0.85rem; right: 0.85rem;
  background: var(--bg3); border: 1px solid var(--br);
  color: var(--ts); width: 28px; height: 28px;
  border-radius: 50%; cursor: pointer; font-size: 0.75rem;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s;
}
.eco-pop-close:hover { background: rgba(255,255,255,0.08); color: var(--t); }

/* Popup content parts */
.eco-pop-flag-row {
  display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1rem;
}
.eco-pop-flag-row img {
  width: 40px; height: 27px; border-radius: 4px;
  object-fit: cover; border: 1px solid rgba(255,255,255,0.15);
  box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}
.eco-pop-title { font-size: 1.15rem; font-weight: 800; color: var(--t); line-height: 1.25; }
.eco-pop-subtitle { font-size: 0.78rem; color: var(--ts); margin-top: 0.2rem; }

.eco-pop-meta {
  display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem;
}
.eco-pop-tag {
  font-size: 0.7rem; font-weight: 700; padding: 0.25rem 0.65rem;
  border-radius: 5px; letter-spacing: 0.03em;
}
.eco-pop-tag.high { background: rgba(255,71,87,0.15); color: var(--r); border: 1px solid rgba(255,71,87,0.3); }
.eco-pop-tag.medium { background: rgba(245,158,11,0.15); color: var(--o); border: 1px solid rgba(245,158,11,0.3); }
.eco-pop-tag.low { background: rgba(139,149,165,0.12); color: var(--ts); border: 1px solid var(--br); }
.eco-pop-tag.time { background: rgba(6,182,212,0.12); color: var(--cy); border: 1px solid rgba(6,182,212,0.25); }
.eco-pop-tag.prev { background: var(--bg3); color: var(--ts); border: 1px solid var(--br); }

.eco-pop-desc {
  font-size: 0.86rem; color: var(--ts); line-height: 1.65;
  margin-bottom: 1rem; padding: 0.75rem; background: var(--bg3);
  border-radius: 8px; border: 1px solid var(--br);
}

.eco-pop-assets-title {
  font-size: 0.78rem; font-weight: 700; color: var(--ts);
  text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 0.5rem;
}
.eco-pop-assets {
  display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 1rem;
}
.eco-pop-asset {
  font-size: 0.72rem; font-weight: 700; padding: 0.25rem 0.65rem;
  border-radius: 6px; background: rgba(0,255,136,0.08);
  border: 1px solid rgba(0,255,136,0.2); color: var(--g);
}
.eco-pop-asset.negative {
  background: rgba(255,71,87,0.08); border-color: rgba(255,71,87,0.2); color: var(--r);
}
.eco-pop-asset.neutral {
  background: rgba(245,158,11,0.08); border-color: rgba(245,158,11,0.2); color: var(--o);
}

.eco-pop-outlook {
  padding: 0.75rem; border-radius: 8px; font-size: 0.82rem;
  line-height: 1.55; border-left: 3px solid;
}
.eco-pop-outlook.bull { background: rgba(0,255,136,0.06); border-color: var(--g); color: var(--ts); }
.eco-pop-outlook.bear { background: rgba(255,71,87,0.06); border-color: var(--r); color: var(--ts); }
.eco-pop-outlook.neutral { background: rgba(245,158,11,0.06); border-color: var(--o); color: var(--ts); }

/* ── Week separator ── */
.eco-day.week2-start {
  border-left: 2px solid rgba(6,182,212,0.35) !important;
  position: relative;
}
.eco-day.week2-start::before {
  content: '+7d';
  position: absolute; top: 3px; left: 3px;
  font-size: 0.48rem; font-weight: 800; color: var(--cy);
  opacity: 0.7; letter-spacing: 0.04em;
}
/* Scroll hint */
.eco-cal-scroll-hint {
  display: none; text-align: center; padding: 0.28rem 0.5rem;
  font-size: 0.65rem; color: var(--tm);
  border-top: 1px solid var(--br); background: var(--bg3);
}
@media (max-width: 1200px) { .eco-cal-scroll-hint { display: block; } }

/* Mobile responsive */
@media (max-width: 768px) {
  .eco-cal-timeline { grid-template-columns: repeat(14, minmax(60px, 1fr)); }
  .eco-day { min-width: 60px; padding: 0.25rem 0.15rem 0.3rem; }
  .eco-flag-img { width: 22px; height: 15px; }
  .eco-day-num { font-size: 0.85rem; }
  .eco-day-label { font-size: 0.52rem; }
  .eco-pop { padding: 1.1rem; }
  .eco-pop-title { font-size: 1rem; }
}
@media (max-width: 480px) {
  .eco-cal-timeline { grid-template-columns: repeat(14, minmax(50px, 1fr)); }
  .eco-day { min-width: 50px; padding: 0.2rem 0.1rem; }
  .eco-day-num { font-size: 0.78rem; }
  .eco-flag-img { width: 19px; height: 13px; }
  .eco-cal-title { font-size: 0.8rem; }
}


/* ---- BREAKING + WIX FIXES ---- */
/* ============================================================
   BREAKING / UNEXPECTED EVENT STYLES
   ============================================================ */

/* Breaking flag wrapper — pulsante lampeggiante */
/* ── Breaking flag: layout inline [bandiera][⚡] ── */
.eco-flag-btn.breaking-flag {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 3px !important;
  padding: 2px 5px 2px 2px !important;
  border-radius: 6px !important;
  background: rgba(255,71,87,0.07) !important;
  border: 1px solid rgba(255,71,87,0.35) !important;
  box-shadow: none !important;
  transform: none !important;
}
/* Nessun bordo/glow sull'immagine — il contenitore già segnala */
.eco-flag-btn.breaking-flag .eco-flag-img {
  border: none !important;
  box-shadow: none !important;
  animation: none !important;
}
/* Fulmine inline dopo la bandiera */
.eco-flag-btn.breaking-flag::after {
  content: '⚡';
  font-size: 11px;
  line-height: 1;
  flex-shrink: 0;
  animation: breakingFulmine 1.4s ease-in-out infinite;
}
/* Nascondi vecchio badge angolo */
.eco-breaking-badge {
  display: none !important;
}

@keyframes breakingFulmine {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.45; }
}
@keyframes breakingPulse {
  0%, 100% { box-shadow: 0 0 4px rgba(255,71,87,0.4); border-color: var(--r); }
  50%       { box-shadow: 0 0 10px rgba(255,71,87,0.75), 0 0 18px rgba(255,71,87,0.3); border-color: rgba(255,71,87,0.6); }
}

/* ── Badge +N totale eventi — angolo top-right assoluto ── */
.eco-day-total {
  position: absolute;
  top: 4px;
  right: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 17px;
  height: 14px;
  padding: 0 3px;
  border-radius: 6px;
  background: rgba(6,182,212,0.13);
  border: 1px solid rgba(6,182,212,0.32);
  color: var(--cy);
  font-family: var(--fm);
  font-size: 8px;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  z-index: 2;
  transition: background 0.15s, border-color 0.15s, transform 0.12s;
}
.eco-day-total:hover {
  background: rgba(6,182,212,0.24);
  border-color: rgba(6,182,212,0.6);
  transform: scale(1.08);
}
/* Today: badge tinted green */
.eco-day.today .eco-day-total {
  background: rgba(0,255,136,0.12);
  border-color: rgba(0,255,136,0.35);
  color: var(--g);
}

/* ── Group event list popup ── */
.eco-grp-list {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-top: 0.65rem;
  max-height: 60vh;
  overflow-y: auto;
}
.eco-grp-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.55rem 0.75rem;
  border-radius: 10px;
  background: var(--bg3);
  border: 1px solid var(--br);
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.eco-grp-row:hover {
  background: rgba(255,255,255,0.04);
  border-color: rgba(6,182,212,0.3);
}
.eco-grp-left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 1;
  min-width: 0;
}
.eco-grp-flag {
  width: 24px;
  height: 16px;
  border-radius: 3px;
  object-fit: cover;
  flex-shrink: 0;
}
.eco-grp-body {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}
.eco-grp-name {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--t);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.eco-grp-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}
.eco-grp-icon {
  font-size: 13px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 2px;
  color: var(--ts);
}
.eco-grp-chevron {
  font-size: 14px;
  color: var(--tm);
  line-height: 1;
}
.eco-grp-calendar-icon {
  font-size: 28px;
  line-height: 1;
}



/* Breaking tag nel popup */
.eco-pop-tag.breaking {
  background: rgba(255,71,87,0.18); color: var(--r);
  border: 1px solid rgba(255,71,87,0.4);
  animation: breakingPulse 2s ease-in-out infinite;
}

/* ============================================================
   WIX IFRAME RESPONSIVE FIXES
   ============================================================ */

/* Base: assicura che tutto sia contenuto */
html, body {
  overflow-x: hidden !important;
  max-width: 100% !important;
}

/* Popup: usa position fixed ma con fallback per iframe WIX */
.eco-pop {
  position: fixed !important;
  /* Fallback per iframe WIX dove fixed non funziona */
}

/* In iframe WIX fixed non funziona — usa absolute sul parent */
@media screen and (max-width: 100vw) {
  .eco-pop-overlay {
    position: fixed;
    top: 0; left: 0;
    width: 100vw; height: 100vh;
  }
}

/* Forza width 100% su tutti i contenitori principali */
.eco-cal-wrap,
.eco-cal-timeline,
.eco-cal-hdr {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Touch scroll fluido su iOS WIX */
.eco-cal-timeline {
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior-x: contain !important;
  scroll-snap-type: x proximity;
}

.eco-day {
  scroll-snap-align: start;
}

/* WIX: impedisce zoom accidentale su tap */
.eco-flag-btn {
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

/* Popup responsive su tutti gli schermi WIX */
@media (max-width: 500px) {
  .eco-pop {
    width: 96vw !important;
    max-height: 85vh !important;
    left: 2vw !important;
    transform: translateX(0) translateY(-50%) !important;
    padding: 1rem !important;
  }
  .eco-pop-title { font-size: 0.95rem !important; }
  .eco-pop-desc { font-size: 0.8rem !important; }
  .eco-pop-assets { gap: 0.3rem !important; }
  .eco-pop-asset { font-size: 0.68rem !important; padding: 0.2rem 0.5rem !important; }
}

/* Tiny screens (iPhone SE, 320px) */
@media (max-width: 360px) {
  .eco-cal-timeline { grid-template-columns: repeat(14, minmax(50px, 1fr)) !important; }
  .eco-day { min-width: 50px !important; padding: 0.35rem 0.1rem !important; }
  .eco-flag-img { width: 18px !important; height: 12px !important; }
  .eco-day-num { font-size: 0.75rem !important; }
  .eco-cal-hdr { padding: 0.55rem 0.75rem !important; flex-wrap: wrap !important; }
  .eco-cal-title { font-size: 0.78rem !important; }
}

/* ================================================================
   MEME PRO PANEL - Sector Overview
   ================================================================ */
.meme-pro-panel {
  display:grid; grid-template-columns:repeat(4,1fr); gap:0.7rem;
  margin-bottom:1rem; padding:0.85rem 0 0.2rem;
}
@media(max-width:900px){.meme-pro-panel{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.meme-pro-panel{grid-template-columns:1fr 1fr;gap:0.5rem;}}

.meme-pro-card {
  background:var(--card); border:1px solid var(--br); border-radius:12px;
  padding:0.85rem 0.9rem 0.8rem; position:relative; overflow:hidden;
  transition:border-color 0.2s;
}
.meme-pro-card:hover{border-color:var(--brb);}
.meme-pro-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:var(--accent-clr, var(--p));
}
.mpc-label {
  font-size:0.62rem; font-weight:800; color:var(--ts); text-transform:uppercase;
  letter-spacing:0.07em; margin-bottom:0.45rem; display:flex; align-items:center; gap:0.4rem;
}
.mpc-value {
  font-family:var(--fd); font-size:1.45rem; font-weight:800; color:var(--t);
  line-height:1; margin-bottom:0.35rem;
}
.mpc-sub { font-size:0.7rem; color:var(--ts); }
.mpc-badge {
  display:inline-block; font-size:0.62rem; font-weight:700; padding:0.18rem 0.55rem;
  border-radius:5px; margin-top:0.3rem;
}
.mpc-badge.bull { background:rgba(0,255,136,0.12); color:var(--g); border:1px solid rgba(0,255,136,0.2); }
.mpc-badge.bear { background:rgba(255,71,87,0.12); color:var(--r); border:1px solid rgba(255,71,87,0.2); }
.mpc-badge.neut { background:rgba(245,158,11,0.12); color:var(--o); border:1px solid rgba(245,158,11,0.2); }

/* Breadth bar */
.breadth-bar { height:8px; border-radius:4px; overflow:hidden; display:flex; margin:0.4rem 0; background:var(--bg3); }
.breadth-bar-up { background:var(--g); transition:width 0.6s ease; }
.breadth-bar-dn { background:var(--r); transition:width 0.6s ease; }

/* Chain dominance bars */
.chain-dom-list { display:flex; flex-direction:column; gap:0.28rem; margin-top:0.4rem; }
.chain-dom-row { display:flex; align-items:center; gap:0.45rem; }
.chain-dom-name { font-size:0.62rem; font-weight:700; color:var(--ts); width:36px; flex-shrink:0; }
.chain-dom-bar-wrap { flex:1; height:6px; background:var(--bg3); border-radius:3px; overflow:hidden; }
.chain-dom-bar-fill { height:100%; border-radius:3px; transition:width 0.7s ease; }
.chain-dom-pct { font-size:0.62rem; font-weight:700; color:var(--t); width:30px; text-align:right; }

/* VIX Gauge */
.vix-gauge-wrap { display:flex; align-items:center; gap:0.7rem; margin-top:0.3rem; }
.vix-gauge-svg { width:70px; height:40px; }
.vix-info { flex:1; }
.vix-level { font-size:0.68rem; font-weight:700; }

/* ================================================================
   BUBBLE CHART MODAL
   ================================================================ */
.bubble-modal-overlay {
  display:none; position:fixed; inset:0; background:rgba(0,0,0,0.82);
  z-index:99999; align-items:center; justify-content:center;
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.bubble-modal-overlay.show { display:flex !important; }
.bubble-modal {
  background:linear-gradient(160deg,#0d1117,#111827,#0d1117);
  border:1px solid rgba(168,85,247,0.3);
  border-radius:20px;
  width:min(720px,96vw); max-height:92vh; overflow:hidden; display:flex; flex-direction:column;
  box-shadow:0 40px 100px rgba(0,0,0,0.8), 0 0 0 1px rgba(168,85,247,0.15), inset 0 1px 0 rgba(255,255,255,0.05);
  animation:bubblePopIn 0.3s cubic-bezier(0.34,1.56,0.64,1);
}
@keyframes bubblePopIn {
  0%  { opacity:0; transform:scale(0.88) translateY(20px); }
  100%{ opacity:1; transform:scale(1) translateY(0); }
}
.bubble-modal-hdr {
  display:flex; align-items:center; justify-content:space-between;
  padding:1.1rem 1.4rem; border-bottom:1px solid rgba(168,85,247,0.2);
  background:linear-gradient(135deg,rgba(168,85,247,0.08),rgba(99,102,241,0.05));
  gap:0.7rem; flex-shrink:0;
}
.bubble-modal-title { font-family:var(--fd); font-size:1.1rem; font-weight:800; color:var(--t); }
.bubble-modal-close {
  width:32px; height:32px; border-radius:50%; border:1px solid var(--br);
  background:var(--bg3); color:var(--ts); font-size:0.8rem; cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:all 0.2s;
}
.bubble-modal-close:hover{background:rgba(255,255,255,0.08);color:var(--t);}
.bubble-modal-body { flex:1; overflow:auto; padding:0.6rem 0.8rem; min-height:280px; }
.bubble-chart-svg { width:100%; height:100%; min-height:300px; border-radius:10px; display:block; }
.bubble-legend { display:flex; gap:1rem; flex-wrap:wrap; padding:0.5rem 1rem 0.8rem; }
.bubble-legend-item { display:flex; align-items:center; gap:0.4rem; font-size:0.72rem; color:var(--ts); }
.bubble-legend-dot { width:10px; height:10px; border-radius:50%; }
.bubble-concentration-bar {
  height:10px; border-radius:5px; overflow:hidden; display:flex; margin:0 1rem 0.8rem;
  background:var(--bg3);
}
.bubble-conc-seg { height:100%; transition:width 0.7s ease; }
.bubble-stats-row { display:flex; gap:0.6rem; padding:0 1rem 0.6rem; flex-wrap:wrap; }
.bubble-stat-pill {
  padding:0.25rem 0.7rem; border-radius:6px; font-size:0.7rem; font-weight:700;
  background:var(--bg3); border:1px solid var(--br); color:var(--ts);
}
.bubble-stat-pill span { color:var(--t); }

/* ================================================================
   MEME DETAIL - nuovi stat cards
   ================================================================ */
.meme-bubble-btn {
  display:flex; align-items:center; justify-content:center; gap:0.6rem;
  background:linear-gradient(135deg,rgba(168,85,247,0.18),rgba(99,102,241,0.12));
  border:1px solid rgba(168,85,247,0.4);
  color:var(--p); border-radius:10px; padding:0.6rem 1.2rem;
  font-size:0.82rem; font-weight:700; cursor:pointer; transition:all 0.25s;
  margin-bottom:0.75rem; width:100%;
  box-shadow:0 2px 12px rgba(168,85,247,0.1);
  letter-spacing:0.01em;
}
.meme-bubble-btn:hover {
  background:linear-gradient(135deg,rgba(168,85,247,0.32),rgba(99,102,241,0.22));
  border-color:rgba(168,85,247,0.7);
  box-shadow:0 4px 20px rgba(168,85,247,0.25);
  transform:translateY(-1px);
}
.meme-detail-wrap {
  display:grid;
  grid-template-columns:240px 1fr;
  grid-template-rows:400px;
  gap:0.75rem;
  width:100%;
  align-items:stretch;
  grid-column:1/-1;  /* span all columns of parent .sr grid */
}
@media(max-width:700px){
  .meme-detail-wrap { grid-template-columns:1fr; grid-template-rows:auto 320px; }
}
.meme-ind-col {
  display:flex; flex-direction:column; gap:0.5rem; height:100%;
}
.meme-sc2 {
  padding:0.6rem 0.75rem 0.55rem;
  border-radius:10px;
  background:linear-gradient(135deg,var(--bg3),rgba(255,255,255,0.01));
  flex:1;
  position:relative;
  overflow:hidden;
}
.meme-sc2::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,var(--p),transparent); opacity:0.5;
}
.meme-sv2 {
  font-family:var(--fd); font-size:1.4rem; font-weight:900;
  line-height:1; margin:0.15rem 0 0.25rem;
}
.meme-ind-row { display:flex; align-items:center; gap:0.5rem; margin-top:0.3rem; flex-wrap:wrap; }
.meme-sc-sub { font-size:0.58rem; color:var(--tm); }
.meme-bubble-col {
  display:flex; flex-direction:column;
  background:linear-gradient(160deg,#050810,#090d1a,#050810);
  border:1px solid rgba(168,85,247,0.25);
  border-radius:12px; overflow:hidden;
  box-shadow:0 0 30px rgba(168,85,247,0.06);
  height:100%;
  min-height:0;
}
.meme-bubble-col-hdr {
  display:flex; align-items:center; gap:0.6rem;
  padding:0.5rem 0.8rem;
  border-bottom:1px solid rgba(168,85,247,0.15);
  background:rgba(168,85,247,0.07);
  flex-shrink:0;
}
.meme-bubble-col-title {
  font-size:0.75rem; font-weight:700; color:rgba(168,85,247,0.9);
  letter-spacing:0.04em; text-transform:uppercase;
}
.meme-bubble-col-legend {
  display:flex; gap:0.7rem; flex-wrap:wrap; margin-left:auto; margin-right:0.4rem; align-items:center;
}
.meme-bubble-col-legend span {
  display:flex; align-items:center; gap:0.3rem; font-size:0.72rem; font-weight:600; color:#ffffff;
  letter-spacing:0.01em;
}
.meme-bubble-col-legend i {
  width:9px; height:9px; border-radius:50%; display:inline-block; flex-shrink:0;
}
.meme-bubble-expand-btn {
  background:rgba(168,85,247,0.12); border:1px solid rgba(168,85,247,0.35);
  color:#a855f7; border-radius:6px; padding:2px 7px; font-size:0.85rem;
  cursor:pointer; transition:all 0.2s; flex-shrink:0; line-height:1.4;
  margin-right:0.2rem;
}
.meme-bubble-expand-btn:hover { background:rgba(168,85,247,0.28); transform:scale(1.05); }
.meme-stats-grid {
  display:grid; grid-template-columns:repeat(2,1fr); gap:0.6rem;
}
@media(max-width:600px){ .meme-stats-grid { grid-template-columns:1fr 1fr; gap:0.45rem; } }
.meme-sc {
  background:linear-gradient(135deg,var(--bg3),rgba(255,255,255,0.01));
  border-radius:12px; padding:0.75rem 0.85rem 0.7rem; position:relative; overflow:hidden;
}
.meme-sc::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,var(--p),transparent);
  opacity:0.6;
}
.meme-sv { font-family:var(--fd); font-size:1.55rem; font-weight:900; line-height:1; margin:0.25rem 0 0.3rem; }
.meme-sc-sub { font-size:0.6rem; color:var(--tm); margin-top:0.25rem; letter-spacing:0.03em; }

.hype-vel-bar { height:6px; border-radius:3px; background:var(--bg3); overflow:hidden; margin:0.4rem 0; }
.hype-vel-fill { height:100%; border-radius:3px; transition:width 0.7s ease; }

.bagholder-bar { height:8px; border-radius:4px; background:var(--bg3); overflow:hidden; margin:0.4rem 0; position:relative; }
.bagholder-fill { height:100%; border-radius:4px; transition:width 0.7s ease; background:linear-gradient(90deg,var(--r),var(--o)); }
.bagholder-marker { position:absolute; top:-2px; height:12px; width:2px; background:var(--t); border-radius:1px; }

/* ═══ Old Footer CSS removed — now in shared/omnia-header-v2.css ═══ */

/* ═══════════════════════════════════════════════════════════════
   STOCK EXCHANGE TIMELINE 24H — Gantt Glassmorphism
   Borse mondiali con orari apertura in tempo reale
═══════════════════════════════════════════════════════════════ */

.exchange-timeline-wrap {
  background: rgba(10, 15, 28, 0.55);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;
  margin-bottom: 1.2rem;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.05);
}
.exchange-tl-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.55rem 1.1rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.02);
  flex-wrap: wrap;
  gap: 0.4rem;
}
.exchange-tl-title {
  font-family: var(--fd); font-size: 0.92rem; font-weight: 800;
  color: var(--cy); letter-spacing: 0.02em;
}
.exchange-tl-clock {
  font-family: var(--fm); font-size: 0.88rem; font-weight: 700;
  color: var(--g);
  text-shadow: 0 0 8px rgba(0,255,136,0.3);
  letter-spacing: 0.06em;
  margin-left: auto;
}

.exchange-tl-body {
  padding: 0.6rem 0.8rem 0.5rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ── Each exchange row ── */
.exchange-row {
  display: flex; align-items: center; gap: 0;
  margin-bottom: 3px;
  min-width: 760px;
}
.exchange-row:last-child { margin-bottom: 0; }

.exchange-label {
  flex-shrink: 0; width: 110px;
  display: flex; align-items: center; gap: 6px;
  font-size: 0.68rem; font-weight: 700; color: var(--ts);
  letter-spacing: 0.03em; white-space: nowrap;
  padding-right: 8px;
}
.exchange-label .exch-flag {
  width: 20px; height: 15px; border-radius: 2px; object-fit: cover;
  border: 1px solid rgba(255,255,255,0.15);
  flex-shrink: 0;
  display: inline-block;
}
.exchange-label .exch-dot {
  width: 6px; height: 6px; border-radius: 50%;
  flex-shrink: 0;
}
.exchange-label .exch-dot.open { background: var(--g); box-shadow: 0 0 6px rgba(0,255,136,0.5); animation: pu 2s infinite; }
.exchange-label .exch-dot.closed { background: var(--r); opacity: 0.5; }
.exchange-label .exch-dot.pre { background: var(--o); box-shadow: 0 0 4px rgba(245,158,11,0.4); }

/* ── Vicino a te badge — hidden per scelta UX ── */
.exch-home-badge { display: none !important; }

/* ── Gantt bar container (24h) — Bloomberg-style slim ── */
.exchange-gantt {
  flex: 1; height: 11px; position: relative;
  background: rgba(255,255,255,0.02);
  border-radius: 3px; overflow: visible;
  border: 1px solid rgba(255,255,255,0.04);
}

/* ── Active trading session bar ── */
.exchange-bar {
  position: absolute; top: 1px; bottom: 1px;
  border-radius: 2px;
  transition: opacity 0.3s;
}
.exchange-bar:hover { opacity: 1 !important; filter: brightness(1.3); }

/* ── Bar tooltip ── */
.exchange-bar-tip {
  position: absolute; bottom: calc(100% + 6px); left: 50%;
  transform: translateX(-50%); white-space: nowrap;
  background: var(--bg3); border: 1px solid var(--br);
  border-radius: 6px; padding: 3px 8px; font-size: 0.62rem;
  color: var(--t); pointer-events: none; opacity: 0;
  transition: opacity 0.15s; z-index: 50;
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}
.exchange-bar:hover .exchange-bar-tip { opacity: 1; }

/* ── Current time indicator (vertical line) ── */
.exchange-now-line {
  position: absolute; top: 0; bottom: 0; width: 2px;
  background: var(--g);
  box-shadow: 0 0 8px rgba(0,255,136,0.5);
  z-index: 10;
  pointer-events: none;
}
.exchange-now-line::before {
  content: ''; position: absolute; top: -3px; left: -3px;
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--g);
  box-shadow: 0 0 6px rgba(0,255,136,0.6);
}

/* ── Hour markers ── */
.exchange-hours-row {
  margin-bottom: 0;
  min-width: 760px;
}
.exchange-hours-gantt {
  position: relative;
}
.exchange-hour-mark {
  font-size: 0.55rem; font-weight: 600; color: var(--tm);
  font-family: var(--fm);
  opacity: 0.6;
  white-space: nowrap;
}

/* ── Legend ── */
.exchange-tl-legend {
  display: flex; flex-wrap: wrap; gap: 0.6rem;
  padding: 0;
  align-items: center;
}
.exchange-legend-item {
  display: flex; align-items: center; gap: 5px;
  font-size: 0.72rem; color: var(--tm); font-weight: 600;
}
.exchange-legend-dot {
  width: 9px; height: 9px; border-radius: 3px;
}

/* ── Colors per exchange ── */
.exbar-milan  { background: linear-gradient(90deg, #00b894, #00cec9); opacity: 0.75; }
.exbar-nyse   { background: linear-gradient(90deg, #3b82f6, #60a5fa); opacity: 0.75; }
.exbar-nasdaq { background: linear-gradient(90deg, #8b5cf6, #a78bfa); opacity: 0.75; }
.exbar-lse    { background: linear-gradient(90deg, #ef4444, #f87171); opacity: 0.75; }
.exbar-tokyo  { background: linear-gradient(90deg, #f59e0b, #fbbf24); opacity: 0.75; }
.exbar-frank  { background: linear-gradient(90deg, #06b6d4, #22d3ee); opacity: 0.75; }
.exbar-hkex   { background: linear-gradient(90deg, #ec4899, #f472b6); opacity: 0.75; }
.exbar-asx    { background: linear-gradient(90deg, #84cc16, #a3e635); opacity: 0.75; }
.exbar-shangh { background: linear-gradient(90deg, #dc2626, #f87171); opacity: 0.65; }
.exbar-bse    { background: linear-gradient(90deg, #f97316, #fb923c); opacity: 0.75; }
.exbar-tsx    { background: linear-gradient(90deg, #14b8a6, #5eead4); opacity: 0.75; }
.exbar-swiss  { background: linear-gradient(90deg, #e11d48, #fb7185); opacity: 0.75; }

/* Pre-market / after-hours lighter */
.exchange-bar.pre-market { opacity: 0.3 !important; }
.exchange-bar.after-hours { opacity: 0.3 !important; }

/* ── Responsive ── */
@media (max-width: 768px) {
  .exchange-label { width: 85px; font-size: 0.60rem; }
  .exchange-row { min-width: 620px; }
  .exchange-hours-row { min-width: 620px; }
  .exchange-gantt { height: 11px; }
  .exchange-bar { top: 1px; bottom: 1px; }
}
@media (max-width: 480px) {
  .exchange-label { width: 70px; font-size: 0.55rem; }
  .exchange-row { min-width: 520px; }
  .exchange-hours-row { min-width: 520px; }
}


/* ═══════════════════════════════════════════════════════════════
   MARKET INTELLIGENCE — INT | IT Split Columns
═══════════════════════════════════════════════════════════════ */

.news-int-it-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.news-col-wrap {
  background: rgba(10, 15, 28, 0.35);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 0.6rem;
  overflow: hidden;
}
.news-col-label {
  font-family: var(--fd);
  font-size: 0.82rem; font-weight: 800;
  color: var(--ts); letter-spacing: 0.03em;
  padding: 0.3rem 0.5rem 0.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  margin-bottom: 0.5rem;
}
.news-col-int .news-col-label {
  color: var(--cy);
  border-bottom-color: rgba(6,182,212,0.15);
}
.news-col-it .news-col-label {
  color: #00b894;
  border-bottom-color: rgba(0,184,148,0.15);
}
.news-col-list {
  max-height: 450px;
  overflow-y: auto;
  padding-right: 0.2rem;
  scrollbar-width: thin;
  scrollbar-color: var(--br) transparent;
}
.news-col-list::-webkit-scrollbar { width: 4px; }
.news-col-list::-webkit-scrollbar-track { background: transparent; }
.news-col-list::-webkit-scrollbar-thumb { background: var(--br); border-radius: 3px; }

@media (max-width: 768px) {
  .news-int-it-grid { grid-template-columns: 1fr; }
  .news-col-list { max-height: 350px; }
}

/* ── News Region Tabs (INT | IT filter) ── */
.news-region-tabs {
  display: flex; gap: 0.35rem; margin-bottom: 0.75rem;
}
.news-region-tab {
  padding: 0.35rem 0.75rem;
  border-radius: 6px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  color: var(--ts);
  font-size: 0.78rem; font-weight: 700;
  cursor: pointer;
  transition: all 0.25s;
  font-family: var(--fb);
}
.news-region-tab:hover {
  border-color: rgba(255,255,255,0.15);
  color: var(--t1);
}
.news-region-tab.act {
  background: rgba(0,255,136,0.08);
  border-color: rgba(0,255,136,0.25);
  color: var(--g);
}

/* ═══════════════════════════════════════════════════════════════
   INDICATORI + BORSE 2-COLUMN GRID
   SX: Indicators compact · DX: Exchange Timeline
═══════════════════════════════════════════════════════════════ */

.ind-borse-grid {
  display: grid;
  grid-template-columns: 38fr 62fr;
  gap: 0.75rem;
  margin-bottom: 1.2rem;
}
.ind-borse-half {
  grid-template-columns: 1fr 1fr !important;
}

.ind-borse-col-left, .ind-borse-col-right {
  min-width: 0;
}

.ind-compact-wrap {
  background: rgba(10, 15, 28, 0.55);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.05);
  height: 100%;
  display: flex;
  flex-direction: column;
}

.ind-compact-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.55rem 0.85rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.02);
}
.ind-compact-title {
  font-family: var(--fd); font-size: 0.88rem; font-weight: 800;
  color: var(--cy);
}
.ind-compact-upd {
  font-size: 0.68rem; color: var(--tm);
}

/* ── Asset Category Pills (compact) ── */
.ind-cat-pills {
  display: flex; gap: 0.25rem; flex-wrap: wrap;
  padding: 0.45rem 0.7rem;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.ind-cat-pill {
  padding: 0.22rem 0.5rem;
  border-radius: 5px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  color: var(--ts);
  font-size: 0.65rem; font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
  font-family: var(--fb);
  white-space: nowrap;
}
.ind-cat-pill:hover { border-color: rgba(255,255,255,0.15); color: var(--t1); }
.ind-cat-pill.act {
  background: rgba(0,255,136,0.08);
  border-color: rgba(0,255,136,0.25);
  color: var(--g);
}

/* ── Compact 2x2 Indicator Grid ── */
.ind-grid-compact {
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 0.4rem !important;
  padding: 0.5rem 0.7rem;
  flex: 1;
}
.ind-grid-compact .ind-card {
  padding: 0.5rem 0.6rem;
}
.ind-grid-compact .ind-card-value {
  font-size: 1.05rem;
}
.ind-grid-compact .ind-card-label {
  font-size: 0.62rem;
}
.ind-grid-compact .ind-status {
  font-size: 0.6rem;
  padding: 0.08rem 0.3rem;
}
.ind-grid-compact .ind-progress {
  height: 3px;
  margin-top: 0.25rem;
}
.ind-grid-compact .ind-bars {
  height: 16px;
}

/* ── AI Analysis Button ── */
.ind-ai-btn {
  display: flex; align-items: center; justify-content: center; gap: 0.5rem;
  width: calc(100% - 1.4rem);
  margin: 0.4rem 0.7rem 0.6rem;
  padding: 0.55rem 0.8rem;
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(138,132,255,0.12), rgba(59,130,246,0.12));
  border: 1px solid rgba(138,132,255,0.25);
  color: #a78bfa;
  font-size: 0.78rem; font-weight: 800;
  cursor: pointer;
  transition: all 0.25s;
  font-family: var(--fb);
}
.ind-ai-btn:hover {
  background: linear-gradient(135deg, rgba(138,132,255,0.2), rgba(59,130,246,0.2));
  border-color: rgba(138,132,255,0.4);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(138,132,255,0.2);
}
.ind-ai-btn-icon { font-size: 1.1rem; }
.ind-ai-btn-arrow { font-size: 1rem; opacity: 0.7; transition: transform 0.2s; }
.ind-ai-btn:hover .ind-ai-btn-arrow { transform: translateX(3px); opacity: 1; }

/* ═══ AI ANALYSIS POPUP ═══ */
.ind-ai-popup-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(0,0,0,0.65);
  backdrop-filter: blur(6px);
  z-index: 9100;
  animation: fi 0.2s ease;
}
.ind-ai-popup-overlay.show { display: flex; align-items: center; justify-content: center; }

.ind-ai-popup {
  background: var(--card);
  border: 1px solid var(--br);
  border-radius: 18px;
  width: min(680px, 95vw);
  max-height: 85vh;
  overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.05);
  animation: popIn 0.25s ease;
}
.ind-ai-popup-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 1.3rem 0.6rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.ind-ai-popup-title {
  font-family: var(--fd); font-size: 1.15rem; font-weight: 800;
  background: linear-gradient(135deg, #a78bfa, #3b82f6);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.ind-ai-popup-close {
  background: var(--bg3); border: 1px solid var(--br);
  color: var(--ts); width: 30px; height: 30px;
  border-radius: 50%; cursor: pointer; font-size: 0.8rem;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s;
}
.ind-ai-popup-close:hover { background: rgba(255,255,255,0.08); color: var(--t); }

.ind-ai-popup-sub {
  padding: 0.5rem 1.3rem;
  font-size: 0.82rem; color: var(--ts); line-height: 1.4;
}

.ind-ai-popup-cats {
  display: flex; gap: 0.35rem; flex-wrap: wrap;
  padding: 0.5rem 1.3rem 0.75rem;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.ind-ai-cat-btn {
  padding: 0.4rem 0.85rem;
  border-radius: 8px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  color: var(--ts);
  font-size: 0.78rem; font-weight: 700;
  cursor: pointer;
  transition: all 0.25s;
  font-family: var(--fb);
}
.ind-ai-cat-btn:hover { border-color: rgba(138,132,255,0.3); color: var(--t1); }
.ind-ai-cat-btn.act {
  background: linear-gradient(135deg, rgba(138,132,255,0.12), rgba(59,130,246,0.1));
  border-color: rgba(138,132,255,0.35);
  color: #a78bfa;
}

.ind-ai-popup-body {
  padding: 0.75rem 1.3rem 1rem;
}
.ind-ai-popup-body .ind-analysis {
  margin: 0; border: none; background: none;
}
.ind-ai-popup-body .ind-analysis-body {
  display: block;
}
.ind-sentiment-row {
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.6rem 0 0;
  font-size: 0.82rem; font-weight: 700; color: var(--ts);
  border-top: 1px solid rgba(255,255,255,0.05);
  margin-top: 0.75rem;
}

/* ═══ EXCHANGE TIMELINE — Compact for right column ═══ */
.ind-borse-col-right .exchange-timeline-wrap {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.ind-borse-col-right .exchange-tl-body {
  flex: 1;
  padding: 0.5rem 0.6rem 0.35rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}
.ind-borse-col-right .exchange-row {
  margin-bottom: 0;
}
.ind-borse-col-right .exchange-gantt {
  height: 11px;
}
.ind-borse-col-right .exchange-bar {
  top: 1px; bottom: 1px;
}
.ind-borse-col-right .exchange-label {
  width: 115px;
  font-size: 0.68rem;
}
.ind-borse-col-right .exchange-label .exch-flag {
  width: 20px; height: 15px;
}
.ind-borse-col-right .exchange-hour-mark {
  font-size: 0.56rem;
}

/* ── Continuous now line (no pins) ── */
.exchange-now-line {
  position: absolute; top: 0; bottom: 0; width: 1.5px;
  background: var(--g);
  box-shadow: 0 0 6px rgba(0,255,136,0.4);
  z-index: 10;
  pointer-events: none;
}
.exchange-now-line::before {
  display: none; /* Remove pin/dot */
}

/* ── Responsive 2-col grid ── */
@media (max-width: 900px) {
  .ind-borse-grid { grid-template-columns: 1fr; }
  .ind-compact-wrap { height: auto; }
}
@media (max-width: 768px) {
  .ind-grid-compact { grid-template-columns: repeat(2, 1fr) !important; }
  .ind-borse-col-right .exchange-label { width: 65px; font-size: 0.55rem; }
}


/* ═══════════════════════════════════════════════════════════════
   MARKET INTELLIGENCE — Magazine Layout
   Hero card + 3 compact news per column
═══════════════════════════════════════════════════════════════ */

.news-mag-hero {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
  margin-bottom: 0.5rem;
  background: var(--card);
  border: 1px solid rgba(255,255,255,0.08);
  transition: all 0.25s;
}
.news-mag-hero:hover {
  border-color: rgba(255,255,255,0.15);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}

.news-mag-hero-img {
  width: 100%; height: 140px;
  object-fit: cover; display: block;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.news-mag-hero-img-placeholder {
  width: 100%; height: 100px;
  display: flex; align-items: center; justify-content: center;
  font-size: 2rem;
  background: linear-gradient(135deg, rgba(0,255,136,0.05), rgba(59,130,246,0.08));
}

.news-mag-hero-body {
  padding: 0.6rem 0.75rem 0.65rem;
}
.news-mag-hero-meta {
  display: flex; align-items: center; gap: 6px;
  margin-bottom: 0.35rem; flex-wrap: wrap;
}
.news-mag-hero-title {
  font-size: 0.92rem; font-weight: 800; line-height: 1.3;
  color: var(--t1); margin-bottom: 0.25rem;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.news-mag-hero-excerpt {
  font-size: 0.72rem; color: var(--ts); line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* ── Compact news list item ── */
.news-mag-item {
  display: flex; align-items: flex-start; gap: 0.5rem;
  padding: 0.45rem 0.5rem;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s;
  border-bottom: 1px solid rgba(255,255,255,0.03);
}
.news-mag-item:hover {
  background: rgba(255,255,255,0.03);
}
.news-mag-item:last-child { border-bottom: none; }

.news-mag-item-num {
  flex-shrink: 0;
  width: 20px; height: 20px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 4px;
  background: rgba(255,255,255,0.04);
  font-size: 0.6rem; font-weight: 800; color: var(--tm);
  font-family: var(--fm);
}
.news-mag-item-body { flex: 1; min-width: 0; }
.news-mag-item-title {
  font-size: 0.76rem; font-weight: 700; line-height: 1.3;
  color: var(--t2);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.news-mag-item-meta {
  display: flex; align-items: center; gap: 5px;
  margin-top: 0.15rem;
}
.news-mag-item-src {
  font-size: 0.6rem; font-weight: 700; color: var(--tm);
}
.news-mag-item-time {
  font-size: 0.58rem; color: var(--tm); opacity: 0.7;
}

/* ── News flag emoji ── */
.news-flag {
  font-size: 1.1rem;
  margin-right: 3px;
  vertical-align: middle;
  line-height: 1;
}

/* ── Magazine column label update ── */
.news-col-label {
  display: flex; align-items: center; gap: 6px;
}

/* Category pill (shared) */
.news-cat-pill {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 0.58rem; font-weight: 700;
  letter-spacing: 0.03em;
}


/* ═══════════════════════════════════════════════════════════════
   MAGAZINE LAYOUT — Premium Financial News
   Trending ticker + Hero grid + Body + Sidebar + Italia
═══════════════════════════════════════════════════════════════ */

/* ── Trending Ticker Bar ── */
.mag-ticker-bar {
  display: flex; align-items: center;
  background: rgba(10,15,28,0.7);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 0.75rem;
  height: 36px;
}
.mag-ticker-label {
  flex-shrink: 0;
  padding: 0 0.75rem;
  background: var(--g);
  color: #0a0f1c;
  font-size: 0.68rem; font-weight: 900;
  letter-spacing: 0.06em;
  height: 100%;
  display: flex; align-items: center;
  font-family: var(--fd);
}
.mag-ticker-track {
  flex: 1; overflow: hidden; position: relative;
  mask-image: linear-gradient(90deg, transparent 0%, black 3%, black 97%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, black 3%, black 97%, transparent 100%);
}
.mag-ticker-scroll {
  display: flex; gap: 2.5rem; white-space: nowrap;
  animation: magTickerSlide 45s linear infinite;
  padding: 0 1rem;
}
.mag-ticker-scroll:hover { animation-play-state: paused; }
@keyframes magTickerSlide { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.mag-ticker-item {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-size: 0.72rem; color: var(--ts);
  cursor: pointer; transition: color 0.2s;
  flex-shrink: 0;
}
.mag-ticker-item:hover { color: var(--t1); }
.mag-ticker-item .mag-ticker-cat {
  color: var(--g); font-weight: 800; font-size: 0.62rem;
  letter-spacing: 0.04em;
}
.mag-ticker-sep { color: rgba(255,255,255,0.1); flex-shrink: 0; }

/* ── Magazine Section Container ── */
.mag-section {
  background: rgba(10,15,28,0.45);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0,0,0,0.2);
}

/* ── Magazine Header + Tabs ── */
.mag-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.7rem 1rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  flex-wrap: wrap; gap: 0.5rem;
}
.mag-title-row { display: flex; align-items: center; gap: 0.6rem; }
.mag-signal-link {
  margin-left: auto;
  display: inline-flex; align-items: center; gap: 0.3rem;
  padding: 0.28rem 0.85rem;
  border-radius: 999px;
  background: rgba(0,220,160,0.08);
  border: 1px solid rgba(0,220,160,0.22);
  color: var(--cy);
  font-family: var(--fd); font-size: 0.76rem; font-weight: 600;
  text-decoration: none; white-space: nowrap;
  transition: background 0.2s, border-color 0.2s;
  letter-spacing: 0.02em;
}
.mag-signal-link:hover {
  background: rgba(0,220,160,0.15);
  border-color: rgba(0,220,160,0.45);
}
.mag-title {
  font-family: var(--fd); font-size: 1.1rem; font-weight: 900;
  color: var(--t1);
}
.mag-tabs { display: flex; gap: 0.2rem; flex-wrap: wrap; }
.mag-tab {
  padding: 0.28rem 0.65rem;
  border-radius: 5px;
  background: transparent;
  border: 1px solid transparent;
  color: var(--ts);
  font-size: 0.7rem; font-weight: 700;
  cursor: pointer; transition: all 0.2s;
  font-family: var(--fb);
}
.mag-tab:hover { color: var(--t1); background: rgba(255,255,255,0.03); }
.mag-tab.act {
  background: rgba(0,255,136,0.06);
  border-color: rgba(0,255,136,0.2);
  color: var(--g);
}

/* ── Hero Grid: 1 big + 2 stacked ── */
.mag-hero-grid {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  grid-template-rows: auto auto;
  gap: 2px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.mag-hero-card {
  position: relative; overflow: hidden;
  cursor: pointer; transition: all 0.3s;
}
.mag-hero-card:hover { z-index: 2; }
.mag-hero-card:hover .mag-hero-img { transform: scale(1.03); }

.mag-hero-card.big {
  grid-row: 1 / 3;
}
.mag-hero-card.big .mag-hero-img-wrap { height: 320px; }
.mag-hero-card.sm .mag-hero-img-wrap { height: 158px; }

.mag-hero-img-wrap {
  position: relative; overflow: hidden;
  background: rgba(0,0,0,0.3);
}
.mag-hero-img {
  width: 100%; height: 100%; object-fit: cover;
  display: block; transition: transform 0.4s;
}
.mag-hero-img-ph {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  font-size: 2.2rem;
  background: linear-gradient(135deg, rgba(0,255,136,0.04), rgba(59,130,246,0.06));
}
.mag-hero-card.sm .mag-hero-img-ph { font-size: 1.5rem; }

.mag-hero-overlay {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 0.75rem 0.85rem;
  background: linear-gradient(transparent, rgba(0,0,0,0.85) 40%);
}
.mag-hero-card.sm .mag-hero-overlay { padding: 0.5rem 0.7rem; }

.mag-hero-cat {
  display: inline-block;
  padding: 2px 7px;
  border-radius: 3px;
  font-size: 0.68rem; font-weight: 800;
  letter-spacing: 0.05em;
  margin-bottom: 0.25rem;
}
.mag-hero-title {
  font-family: var(--fd);
  font-size: 1.15rem; font-weight: 900; line-height: 1.3;
  color: #fff;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  text-shadow: 0 1px 4px rgba(0,0,0,0.5);
}
.mag-hero-card.sm .mag-hero-title {
  font-size: 0.92rem; -webkit-line-clamp: 2;
}
.mag-hero-meta {
  display: flex; align-items: center; gap: 6px;
  margin-top: 0.25rem;
  font-size: 0.75rem; color: rgba(255,255,255,0.7);
}
.mag-hero-card.sm .mag-hero-meta { font-size: 0.7rem; }

/* ── 2 Column Grid: INT 50% | Local 50% ── */
.mag-3col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 0;
}

.mag-col {
  display: flex;
  flex-direction: column;
  border-right: 1px solid rgba(255,255,255,0.06);
  min-width: 0;
}
.mag-col:last-child { border-right: none; }

.mag-col-hdr {
  padding: 0.45rem 0.7rem;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  background: rgba(255,255,255,0.015);
}
.mag-col-label {
  font-family: var(--fd);
  font-size: 0.75rem; font-weight: 900;
  letter-spacing: 0.02em;
}
.mag-col-label-int { color: var(--cy); }
.mag-col-label-it { color: var(--g); }
.mag-col-label-pred {
  background: linear-gradient(135deg, #a78bfa, #3b82f6);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}

.mag-col-body {
  flex: 1;
  overflow-y: auto;
  max-height: 420px;
}
.mag-col-pred-body {
  padding: 0.4rem;
  max-height: 420px;
  overflow-y: auto;
}

/* ── News item inside columns ── */
.mag-news-item {
  display: flex; gap: 0.55rem; align-items: flex-start;
  padding: 0.5rem 0.7rem;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  cursor: pointer;
  transition: background 0.2s;
}
.mag-news-item:hover { background: rgba(255,255,255,0.025); }
.mag-news-item:last-child { border-bottom: none; }

.mag-news-thumb {
  flex-shrink: 0; width: 80px; height: 56px;
  border-radius: 5px; overflow: hidden;
  background: rgba(0,0,0,0.2);
}
.mag-news-thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.mag-news-thumb-ph {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem;
}

.mag-news-body { flex: 1; min-width: 0; }
.mag-news-title {
  font-size: 0.88rem; font-weight: 700; line-height: 1.35;
  color: var(--t1);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  margin-bottom: 0.15rem;
}
.mag-news-meta {
  display: flex; align-items: center; gap: 5px;
  flex-wrap: wrap;
}
.mag-news-src {
  font-size: 0.72rem; font-weight: 700;
}
.mag-news-time {
  font-size: 0.68rem; color: var(--tm);
}

/* ── Compact predictions for sidebar ── */
.pred-g-sidebar {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.3rem !important;
}
.pred-g-sidebar .pred-c {
  padding: 0.35rem 0.5rem !important;
  border-radius: 6px !important;
}
.pred-g-sidebar .pred-asset {
  font-size: 0.68rem !important;
}
.pred-g-sidebar .pred-bars {
  height: 4px !important;
}
.pred-g-sidebar .pred-btn {
  padding: 0.18rem 0.4rem !important;
  font-size: 0.58rem !important;
}
.pred-g-sidebar .pred-pct {
  font-size: 0.58rem !important;
}
.pred-g-sidebar .pred-q {
  font-size: 0.66rem !important;
  line-height: 1.3 !important;
}

/* ── Responsive 2-col ── */
@media (max-width: 900px) {
  .mag-3col {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 640px) {
  .mag-3col { grid-template-columns: 1fr; }
  .mag-col { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.06); }
  .mag-col:last-child { border-bottom: none; }
  .mag-col-body { max-height: 300px; }
  .mag-hero-grid { grid-template-columns: 1fr; }
  .mag-hero-card.big { grid-row: auto; }
  .mag-hero-card.big .mag-hero-img-wrap { height: 160px; }
  .mag-ticker-bar { display: none; }
}

/* ── Shared news pills ── */
.mag-cat-pill {
  display: inline-block;
  padding: 2px 7px;
  border-radius: 3px;
  font-size: 0.58rem; font-weight: 800;
  letter-spacing: 0.04em;
}
.news-flag { font-size: 1.1rem; }


/* ═══════════════════════════════════════════════════════════════════════
   MOBILE ELITE — OmniaCoin Smartphone Experience
   Principi: CoinMarketCap-level UX, zero wobble, text leggibile,
   proporzioni perfette, menu accordion, scroll contenuto
═══════════════════════════════════════════════════════════════════════ */

/* ── 0. INLINE FIXES ── */

/* "Cosa sono?" inline with filter label on mobile, desktop version separate */
/* filter-info-pill: "Cosa sono?" after Infrastruttura pill — same row */
.filter-info-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.28rem 0.7rem;
  font-size: 0.72rem;
  font-weight: 600;
  height: auto;
  line-height: 1.2;
  border-radius: 6px;
  vertical-align: middle;
  flex-shrink: 0;
}
.filter-info-inline { display: none; }
.filter-info-desktop { display: none; }

/* Prediction column subtitle */
.mag-col-sub {
  font-size: 0.65rem;
  color: var(--tm);
  margin-left: 0.5rem;
  font-weight: 500;
}
@media (max-width: 900px) {
  .mag-col-sub { display: inline; font-size: 0.68rem; }
}

/* Country flags bigger on mobile */
@media (max-width: 768px) {
  .news-flag {
    font-size: 1rem !important;
    line-height: 1;
  }
  .mag-news-meta .news-flag {
    font-size: 1.05rem !important;
  }
  .mag-hero-meta .news-flag {
    font-size: 1.1rem !important;
  }
}

/* ── 0b. CALENDAR ECONOMIC: Compact but readable on mobile ── */
@media (max-width: 768px) {
  .eco-flag-img {
    width: 28px !important;
    height: 19px !important;
    border-radius: 3px !important;
  }
  .eco-flag-dot {
    width: 7px !important;
    height: 7px !important;
  }
  .eco-flag-tooltip {
    font-size: 0.68rem !important;
    padding: 0.3rem 0.55rem !important;
  }
  .eco-cal-title {
    font-size: 0.82rem !important;
  }
  .eco-cal-sub {
    font-size: 0.68rem !important;
  }
  .eco-cal-next {
    font-size: 0.65rem !important;
  }
  .eco-cal-scroll-hint {
    font-size: 0.65rem !important;
  }
}
@media (max-width: 480px) {
  .eco-flag-img {
    width: 24px !important;
    height: 16px !important;
  }
}

/* ── 0c. BORSE LIVE: Bigger text on mobile ── */
@media (max-width: 768px) {
  .exchange-label {
    font-size: 0.78rem !important;
    width: 120px !important;
  }
  .exchange-label .exch-flag {
    width: 20px !important;
    height: 14px !important;
  }
  .exchange-label .exch-dot {
    width: 8px !important;
    height: 8px !important;
  }
  .exchange-tl-title {
    font-size: 0.9rem !important;
  }
  .exchange-tl-clock {
    font-size: 0.82rem !important;
  }
  .exchange-hour-mark {
    font-size: 0.62rem !important;
  }
  .exchange-bar-tip {
    font-size: 0.68rem !important;
  }
}
@media (max-width: 480px) {
  .exchange-label {
    font-size: 0.74rem !important;
    width: 105px !important;
  }
}

/* ── 0d. FILTER POPOVER — Elegant popup for Category + Chain pills ── */
/* Trigger button - hidden on desktop */
.filter-pop-trigger {
  display: none;
  padding: 0.4rem 0.85rem;
  background: rgba(0,220,160,0.06);
  border: 1px solid rgba(0,220,160,0.2);
  border-radius: 10px;
  color: var(--g);
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
  align-items: center;
  gap: 5px;
  min-height: 34px;
}
.filter-pop-trigger:hover {
  background: rgba(0,220,160,0.12);
  border-color: rgba(0,220,160,0.35);
}
.filter-pop-trigger .fpt-icon { font-size: 0.9rem; }
.filter-pop-trigger .fpt-label { opacity: 0.85; }

/* Desktop: show all pills normally */
.stk-pills-more, .chain-pills-more {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
/* Legacy toggle - hidden on desktop, shown on mobile */
.stk-pills-toggle, .chain-pills-toggle { display: none; }

@media (max-width: 768px) {
  .stk-pills-accordion {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.35rem !important;
    align-items: center !important;
  }
  .stk-pills-toggle, .chain-pills-toggle {
    display: inline-flex !important;
    padding: 0.4rem 0.8rem;
    background: rgba(0,220,160,0.06);
    border: 1px dashed rgba(0,220,160,0.25);
    border-radius: 8px;
    color: var(--g);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    transition: all 0.2s;
  }
  .stk-pills-toggle.pills-toggle-open, .chain-pills-toggle.pills-toggle-open {
    background: rgba(0,220,160,0.1);
    border-style: solid;
  }
  .stk-pills-more, .chain-pills-more {
    display: none !important;
    width: 100% !important;
  }
  .stk-pills-more.pills-open, .chain-pills-more.pills-open {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.35rem !important;
    padding-top: 0.35rem !important;
    animation: pillsFadeIn 0.25s ease;
  }
  @keyframes pillsFadeIn {
    from { opacity: 0; transform: translateY(-6px); }
    to { opacity: 1; transform: translateY(0); }
  }
  .stk-pill {
    font-size: 0.78rem !important;
    padding: 0.4rem 0.7rem !important;
    min-height: 34px !important;
  }
}

/* ── Popover backdrop ── */
.filter-popover-bg {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 9980;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}
.filter-popover-bg.active {
  opacity: 1;
  pointer-events: auto;
}

/* ── Popover panel (bottom sheet) ── */
.filter-popover {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 9985;
  background: linear-gradient(180deg, rgba(12,18,30,0.98) 0%, rgba(6,10,16,0.99) 100%);
  border-top: 1px solid rgba(0,220,160,0.2);
  border-radius: 20px 20px 0 0;
  padding: 0;
  max-height: 70vh;
  overflow-y: auto;
  transform: translateY(100%);
  transition: transform 0.3s cubic-bezier(0.22,1,0.36,1);
  box-shadow: 0 -10px 40px rgba(0,0,0,0.5), 0 -2px 20px rgba(0,220,160,0.04);
}
.filter-popover.active {
  transform: translateY(0);
}
.filter-popover-glow {
  height: 2px;
  background: linear-gradient(90deg, transparent, #00DCA0, #5484FF, transparent);
  opacity: 0.5;
  border-radius: 20px 20px 0 0;
}
.filter-popover-handle {
  display: flex;
  justify-content: center;
  padding: 10px 0 6px;
}
.filter-popover-handle span {
  width: 36px; height: 4px;
  background: rgba(255,255,255,0.15);
  border-radius: 4px;
}
.filter-popover-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 20px 12px;
}
.filter-popover-title {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--g);
  letter-spacing: 0.03em;
}
.filter-popover-close {
  width: 30px; height: 30px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.04);
  color: var(--ts);
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.2s;
}
.filter-popover-close:hover {
  background: rgba(255,80,80,0.1);
  border-color: rgba(255,80,80,0.3);
  color: #ff5050;
}
.filter-popover-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  padding: 0 16px 24px;
}
.filter-popover-grid .stk-pill,
.filter-popover-grid .chain-pill {
  width: 100%;
  justify-content: center;
  font-size: 0.82rem !important;
  padding: 0.55rem 0.6rem !important;
  min-height: 40px !important;
  border-radius: 10px !important;
  text-align: center;
}
.filter-popover-grid .stk-pill.act,
.filter-popover-grid .chain-pill.act {
  box-shadow: 0 0 12px rgba(0,220,160,0.15);
}

/* ── Mobile: show trigger, hide inline pills ── */
@media (max-width: 768px) {
  /* filter-pop-trigger removed - using accordion toggle instead */
  .filter-pop-trigger {
    display: none !important;
  }
  .chain-filter-row {
    flex-wrap: wrap !important;
  }
  .chain-filter-pills-wrap {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.3rem !important;
    align-items: center !important;
    width: 100% !important;
  }
}

/* ── 1. ANTI-WOBBLE: Kill horizontal scroll globally ── */
html {
  overflow-x: clip !important;
}
body {
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
}
.ctn, .bg-w, #mainP, .mag-section, .mag-ticker-bar, .ind-borse-grid,
.eco-cal-wrap, .mag-3col, .pred-s, .news-full-section {
  max-width: 100vw;
  overflow-x: hidden;
}

/* ── 2. MOBILE HEADER: Accordion submenus ── */
@media (max-width: 1100px) {
  /* Dropdown arrow rotates when open */
  .omni-nav-dropdown .omni-dd-arrow {
    transition: transform 0.3s;
  }
  .omni-nav-dropdown.mob-expanded .omni-dd-arrow {
    transform: rotate(180deg) !important;
    opacity: 1;
  }
  
  /* Nav padding more generous for touch */
  .omni-nav-link {
    padding: 13px 16px !important;
    font-size: 1rem !important;
    border-radius: 10px !important;
  }
  
  /* Mega card items bigger for touch */
  .omni-mega-card {
    padding: 12px 14px !important;
  }
  .omni-mega-title {
    font-size: 15px !important;
  }
  .omni-mega-desc {
    font-size: 12px !important;
  }
  .omni-mega-icon {
    width: 36px !important; height: 36px !important;
    font-size: 18px !important;
  }
  
  /* Mobile: Borse BEFORE Indicators */
  .ind-borse-grid {
    display: flex !important;
    flex-direction: column !important;
  }
  .ind-borse-col-left { order: 2 !important; }
  .ind-borse-col-right { order: 1 !important; }
}

/* ── 3. TABLET: 768px ── */
@media (max-width: 768px) {
  /* Container padding */
  .ctn { padding: 0.75rem 0.75rem !important; }
  
  /* Section headers */
  .sh { margin-bottom: 0.8rem; }
  .st { font-size: 1.1rem !important; }
  .ss { font-size: 0.82rem !important; }
  
  /* Ticker price bar - readable */
  .tkr { height: 38px; }
  .tkr-s { font-size: 0.82rem !important; }
  .tkr-p { font-size: 0.82rem !important; }
  .tkr-ch { font-size: 0.78rem !important; }
  .tkr-l { width: 18px; height: 18px; }
  
  /* Indicator grid stacked */
  .ind-borse-grid { grid-template-columns: 1fr !important; gap: 0.5rem !important; display: flex !important; flex-direction: column !important; }
  .ind-borse-col-left { order: 2 !important; }
  .ind-borse-col-right { order: 1 !important; }
  .ind-grid-compact { grid-template-columns: 1fr 1fr !important; gap: 0.4rem !important; }
  .ind-compact-hdr { padding: 0.5rem 0.65rem !important; }
  .ind-compact-title { font-size: 0.88rem !important; }
  .ind-cat-pills { gap: 0.2rem !important; }
  .ind-cat-pill { font-size: 0.72rem !important; padding: 0.25rem 0.5rem !important; }
  
  /* Indicator cards: readable values */
  .ind-card { padding: 0.65rem !important; }
  .ind-card-value { font-size: 1.15rem !important; }
  .ind-card-label { font-size: 0.74rem !important; }
  .ind-status { font-size: 0.72rem !important; }
  
  /* Exchange timeline: contained scroll */
  .ind-borse-col-right {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .ind-borse-col-right .exchange-timeline-wrap {
    min-width: 500px;
  }
  
  /* Economic Calendar compact */
  .eco-cal-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .eco-cal-wrap .eco-cal-inner {
    min-width: 600px;
  }
  
  /* Tabs: scrollable horizontal */
  .tabs {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    flex-wrap: nowrap !important;
    gap: 0.2rem !important;
    padding-bottom: 2px;
  }
  .tabs::-webkit-scrollbar { display: none; }
  .tab-b {
    font-size: 0.82rem !important;
    padding: 0.5rem 0.75rem !important;
    white-space: nowrap;
    flex-shrink: 0;
  }
  
  /* Tables: proper scroll containment */
  .tbl-w { 
    overflow-x: auto !important; 
    -webkit-overflow-scrolling: touch;
    margin: 0 -0.75rem;
    padding: 0 0.75rem;
  }
  .tbl-s { overflow-x: auto; min-width: 0; }
  .tbl-s table { min-width: 620px; }
  .tbl-s th, .tbl-s td { 
    font-size: 0.82rem !important; 
    padding: 0.55rem 0.5rem !important; 
  }
  
  /* Stock category pills scrollable */
  .stk-cat-scroll {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch;
    gap: 0.25rem !important;
  }
  .stk-cat-scroll::-webkit-scrollbar { display: none; }
  .stk-cat-btn {
    flex-shrink: 0 !important;
    font-size: 0.76rem !important;
    padding: 0.3rem 0.6rem !important;
  }
  
  /* Chain pills scrollable */
  .chain-pills {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    scrollbar-width: none !important;
    gap: 0.2rem !important;
  }
  .chain-pills::-webkit-scrollbar { display: none; }
  .chain-pill {
    flex-shrink: 0 !important;
    font-size: 0.72rem !important;
    padding: 0.25rem 0.5rem !important;
  }
  
  /* Magazine: 3-col → stacked */
  .mag-3col {
    grid-template-columns: 1fr !important;
  }
  .mag-col { border-right: none !important; }
  .mag-col-body { max-height: 350px !important; }
  
  /* Magazine hero compact */
  .mag-hero-grid {
    grid-template-columns: 1fr 1fr !important;
  }
  .mag-hero-card.big { grid-row: auto !important; }
  .mag-hero-card.big .mag-hero-img-wrap { height: 160px !important; }
  .mag-hero-card.sm .mag-hero-img-wrap { height: 100px !important; }
  .mag-hero-title { font-size: 0.88rem !important; }
  .mag-hero-card.sm .mag-hero-title { font-size: 0.76rem !important; }
  .mag-hero-meta { font-size: 0.68rem !important; }
  .mag-hero-cat { font-size: 0.6rem !important; }
  
  /* Magazine tabs */
  .mag-header { padding: 0.55rem 0.7rem !important; }
  .mag-title { font-size: 0.95rem !important; }
  .mag-tab { font-size: 0.72rem !important; padding: 0.25rem 0.5rem !important; }
  
  /* Magazine news items readable */
  .mag-news-item { padding: 0.5rem 0.6rem !important; }
  .mag-news-title { font-size: 0.82rem !important; }
  .mag-news-src { font-size: 0.68rem !important; }
  .mag-news-time { font-size: 0.64rem !important; }
  .mag-news-thumb { width: 70px !important; height: 50px !important; }
  .mag-col-label { font-size: 0.78rem !important; }
  
  /* Magazine ticker */
  .mag-ticker-bar { height: 32px !important; }
  .mag-ticker-label { font-size: 0.62rem !important; padding: 0 0.5rem !important; }
  .mag-ticker-item { font-size: 0.68rem !important; }
  
  /* Predictions sidebar → horizontal scroll on tablet */
  .pred-g-sidebar {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 0.4rem !important;
    padding-bottom: 4px;
  }
  .pred-g-sidebar::-webkit-scrollbar { display: none; }
  .pred-g-sidebar .pred-c {
    flex-shrink: 0 !important;
    min-width: 200px !important;
  }
  
  /* Predictions standalone */
  .pred-g {
    grid-template-columns: 1fr 1fr !important;
    gap: 0.5rem !important;
  }
  .pred-c { padding: 0.6rem !important; }
  .pred-asset { font-size: 0.82rem !important; }
  .pred-q { font-size: 0.78rem !important; }
  .pred-btn { font-size: 0.72rem !important; padding: 0.3rem 0.7rem !important; }
  .pred-pct { font-size: 0.68rem !important; }
  
  /* Detail page */
  .det-hero { padding: 0.75rem !important; }
  .det-name { font-size: 1.3rem !important; }
  .det-price { font-size: 1.6rem !important; }
  .det-stats { grid-template-columns: 1fr 1fr !important; gap: 0.5rem !important; }
  .det-stat-v { font-size: 1rem !important; }
  .det-stat-l { font-size: 0.72rem !important; }
  
  /* Footer compact */
  .omni-footer-inner { padding: 28px 16px !important; gap: 24px !important; }
  .omni-footer-tagline { font-size: 0.85rem !important; }
  .omni-footer-col h4 { font-size: 0.78rem !important; }
  .omni-footer-col a { font-size: 0.85rem !important; }
}

/* ── 4. SMARTPHONE: 480px ── */
@media (max-width: 480px) {
  /* Container tighter */
  .ctn { padding: 0.5rem 0.5rem !important; }
  
  /* Section headers */
  .st { font-size: 1rem !important; }
  .ss { font-size: 0.78rem !important; }
  
  /* Ticker minimal */
  .tkr { height: 34px; }
  .tkr-i { gap: 0.35rem !important; padding: 0.5rem 0 !important; }
  .tkr-s { font-size: 0.78rem !important; }
  .tkr-p { font-size: 0.78rem !important; }
  .tkr-ch { font-size: 0.72rem !important; padding: 0.1rem 0.3rem !important; }
  .tkr-l { width: 16px !important; height: 16px !important; }
  
  /* Indicator pills: one row scrollable */
  .ind-cat-pills {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch;
    gap: 0.15rem !important;
    padding-bottom: 2px;
  }
  .ind-cat-pills::-webkit-scrollbar { display: none; }
  .ind-cat-pill {
    flex-shrink: 0 !important;
    font-size: 0.68rem !important;
    padding: 0.22rem 0.45rem !important;
  }
  .ind-compact-title { font-size: 0.82rem !important; }
  
  /* Indicator cards: mobile readable */
  .ind-grid-compact { gap: 0.35rem !important; }
  .ind-card { padding: 0.5rem !important; border-radius: 8px !important; }
  .ind-card-icon { font-size: 0.95rem !important; }
  .ind-card-label { font-size: 0.72rem !important; }
  .ind-card-value { font-size: 1.05rem !important; }
  .ind-status { font-size: 0.68rem !important; padding: 0.08rem 0.3rem !important; }
  .ind-progress { height: 3px !important; }
  
  /* Exchange timeline: full-width scroll */
  .exchange-tl-hdr { padding: 0.4rem 0.55rem !important; }
  .exchange-tl-title { font-size: 0.78rem !important; }
  .exchange-tl-clock { font-size: 0.88rem !important; }
  .exchange-label { width: 60px !important; font-size: 0.52rem !important; }
  .exchange-gantt { height: 9px !important; }
  .exchange-hour-mark { font-size: 0.48rem !important; }
  
  /* Tabs: compact */
  .tab-b { 
    font-size: 0.76rem !important; 
    padding: 0.42rem 0.6rem !important; 
  }
  
  /* Tables: bigger text for readability */
  .tbl-s table { min-width: 550px; }
  .tbl-s th { font-size: 0.76rem !important; padding: 0.5rem 0.4rem !important; }
  .tbl-s td { font-size: 0.78rem !important; padding: 0.45rem 0.4rem !important; }
  .rank-num { font-size: 0.72rem !important; }
  .asset-logo { width: 24px !important; height: 24px !important; }
  .asset-name { font-size: 0.82rem !important; }
  .asset-sym { font-size: 0.68rem !important; }
  
  /* Magazine hero: single column */
  .mag-hero-grid {
    grid-template-columns: 1fr !important;
  }
  .mag-hero-card.big .mag-hero-img-wrap { height: 150px !important; }
  .mag-hero-card.sm .mag-hero-img-wrap { height: 90px !important; }
  .mag-hero-title { font-size: 0.88rem !important; -webkit-line-clamp: 2 !important; }
  .mag-hero-card.sm .mag-hero-title { font-size: 0.82rem !important; }
  .mag-hero-overlay { padding: 0.5rem 0.65rem !important; }
  
  /* Magazine header */
  .mag-header { 
    flex-direction: column !important; 
    align-items: flex-start !important; 
    padding: 0.5rem 0.6rem !important;
    gap: 0.35rem !important;
  }
  .mag-title { font-size: 0.9rem !important; }
  .mag-tabs {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    scrollbar-width: none !important;
    width: 100%;
    gap: 0.15rem !important;
  }
  .mag-tabs::-webkit-scrollbar { display: none; }
  .mag-tab { flex-shrink: 0 !important; font-size: 0.68rem !important; }
  
  /* Magazine news: full width items */
  .mag-news-item { padding: 0.45rem 0.55rem !important; gap: 0.45rem !important; }
  .mag-news-thumb { width: 64px !important; height: 46px !important; border-radius: 4px !important; }
  .mag-news-title { font-size: 0.8rem !important; line-height: 1.3 !important; }
  .mag-news-src { font-size: 0.66rem !important; }
  .mag-news-time { font-size: 0.62rem !important; }
  .mag-cat-pill { font-size: 0.54rem !important; padding: 1px 5px !important; }
  .mag-col-hdr { padding: 0.4rem 0.55rem !important; }
  .mag-col-label { font-size: 0.76rem !important; }
  .mag-col-body { max-height: 300px !important; }
  
  /* Magazine ticker */
  .mag-ticker-bar { display: none !important; }
  
  /* Predictions */
  .pred-g { grid-template-columns: 1fr !important; gap: 0.4rem !important; }
  .pred-c { padding: 0.5rem !important; border-radius: 8px !important; }
  .pred-asset { font-size: 0.78rem !important; }
  .pred-q { font-size: 0.76rem !important; line-height: 1.3 !important; }
  .pred-btn { font-size: 0.7rem !important; padding: 0.25rem 0.6rem !important; }
  .pred-bars { height: 5px !important; }
  .pred-pct { font-size: 0.66rem !important; }
  
  /* Predictions sidebar: vertical compact */
  .pred-g-sidebar {
    flex-direction: column !important;
    overflow-x: visible !important;
    gap: 0.3rem !important;
  }
  .pred-g-sidebar .pred-c {
    min-width: 0 !important;
    padding: 0.4rem 0.5rem !important;
  }
  .pred-g-sidebar .pred-asset { font-size: 0.72rem !important; }
  .pred-g-sidebar .pred-q { font-size: 0.7rem !important; }
  .pred-g-sidebar .pred-btn { font-size: 0.62rem !important; padding: 0.2rem 0.4rem !important; }
  .pred-g-sidebar .pred-bars { height: 4px !important; }
  .pred-g-sidebar .pred-pct { font-size: 0.6rem !important; }
  
  /* Detail page */
  .det-hero { padding: 0.6rem !important; border-radius: 10px !important; }
  .det-name { font-size: 1.15rem !important; }
  .det-price { font-size: 1.4rem !important; }
  .det-ch { font-size: 0.82rem !important; }
  .det-stats { grid-template-columns: 1fr 1fr !important; gap: 0.35rem !important; }
  .det-stat { padding: 0.45rem !important; border-radius: 6px !important; }
  .det-stat-v { font-size: 0.92rem !important; }
  .det-stat-l { font-size: 0.68rem !important; }
  
  /* Chart container */
  .chtw { border-radius: 10px !important; }
  
  /* News popup */
  .news-popup-inner { 
    width: 96vw !important; 
    max-height: 90vh !important;
    border-radius: 12px !important;
    margin: 2vh auto !important;
  }
  .ns-tt { font-size: 0.95rem !important; }
  .news-popup-body { font-size: 0.85rem !important; line-height: 1.65 !important; }
  
  /* Tooltip modal */
  .ind-tooltip-modal { 
    padding: 1.2rem !important; 
    max-width: 94vw !important;
    border-radius: 12px !important;
  }
  .ind-tooltip-modal-title { font-size: 0.95rem !important; }
  .ind-tooltip-modal-body { font-size: 0.82rem !important; line-height: 1.7 !important; }
  
  /* Metric cards */
  .met-g { grid-template-columns: 1fr 1fr !important; gap: 0.4rem !important; }
  .met-c { padding: 0.7rem !important; border-radius: 10px !important; }
  .met-l { font-size: 0.68rem !important; letter-spacing: 0.5px !important; }
  .met-v { font-size: 1.3rem !important; }
  .met-ch { font-size: 0.78rem !important; }
  
  /* Sentiment */
  .sent-bar { height: 6px !important; }
  .sent-label { font-size: 0.72rem !important; }
  
  /* Footer final */
  .omni-footer { margin-top: 30px !important; padding: 0 6px !important; }
  .omni-footer-inner { padding: 20px 14px !important; border-radius: 0 0 12px 12px !important; }
  .omni-footer-logo .omni-logo-text { font-size: 16px !important; }
  .omni-footer-tagline { font-size: 0.8rem !important; line-height: 1.5 !important; }
  .omni-newsletter-form { flex-direction: column !important; }
  .omni-newsletter-input { width: 100% !important; }
  .omni-footer-col h4 { font-size: 0.72rem !important; margin-bottom: 6px !important; }
  .omni-footer-col a { font-size: 0.82rem !important; padding: 4px 0 !important; }
  .omni-footer-bottom { padding: 10px 14px !important; }
  .omni-footer-bottom span { font-size: 0.7rem !important; }
}

/* ── 5. SMALL PHONES: 360px ── */
@media (max-width: 360px) {
  .ctn { padding: 0.35rem 0.35rem !important; }
  .omni-header { padding: 0 4px !important; }
  .omni-header-inner { padding: 6px 10px !important; margin-top: 4px !important; border-radius: 10px !important; }
  .omni-logo { font-size: 14px !important; gap: 6px !important; }
  
  .ind-card-value { font-size: 0.95rem !important; }
  .ind-card-label { font-size: 0.68rem !important; }
  
  .mag-hero-card.big .mag-hero-img-wrap { height: 130px !important; }
  .mag-hero-title { font-size: 0.82rem !important; }
  
  .tbl-s th, .tbl-s td { font-size: 0.72rem !important; padding: 0.4rem 0.3rem !important; }
  
  .det-price { font-size: 1.2rem !important; }
  .det-name { font-size: 1rem !important; }
}

/* ── 6. SMOOTH SCROLLING & TOUCH ── */
@media (hover: none) and (pointer: coarse) {
  /* Touch device optimizations */
  .mag-news-item, .mag-hero-card, .pred-c, .met-c, .ind-card {
    -webkit-tap-highlight-color: rgba(0,220,160,0.08);
  }
  
  /* Bigger touch targets */
  .tab-b { min-height: 40px; }
  .stk-cat-btn { min-height: 34px; }
  .ind-cat-pill { min-height: 30px; }
  .mag-tab { min-height: 30px; }
  .pred-btn { min-height: 32px; }
  
  /* Disable hover effects on touch */
  .met-c:hover { transform: none; }
  .mag-hero-card:hover .mag-hero-img { transform: none; }
}

/* ── 7. LANDSCAPE PHONE ── */
@media (max-height: 500px) and (orientation: landscape) {
  .mag-hero-card.big .mag-hero-img-wrap { height: 120px !important; }
  .mag-hero-card.sm .mag-hero-img-wrap { height: 70px !important; }
  .mag-col-body { max-height: 250px !important; }
}


/* ═══════════════════════════════════════════════════════════════
   MACRO GLOBAL — Left column (replaces ind-compact-wrap)
   Glassmorphism card identical to existing indicator cards
═══════════════════════════════════════════════════════════════ */

.macro-global-wrap {
  background: rgba(10, 15, 28, 0.55);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.05);
  height: 100%;
  display: flex;
  flex-direction: column;
}

.macro-global-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.55rem 0.85rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.02);
  flex-shrink: 0;
}

.macro-global-title {
  font-family: var(--fd); font-size: 0.88rem; font-weight: 800;
  color: var(--cy);
  letter-spacing: 0.05em;
}

.macro-global-upd {
  font-size: 0.68rem; color: var(--tm);
}

/* The macroGrid uses existing .ind-grid-compact inside macro-global-wrap */
.macro-global-wrap .ind-grid-compact {
  flex: 1;
  align-content: start;
}

/* ── Risk Mode card special treatment ── */
.macro-global-wrap .ind-card[data-ind-id="macro_risk"] .ind-card-value {
  font-size: 0.9rem !important;
  font-family: var(--fb) !important;
  letter-spacing: 0.02em;
}

/* ═══════════════════════════════════════════════════════════════
   TAB ACCORDION — Indicatori per tab
   Collapsible panel between tab header and table
═══════════════════════════════════════════════════════════════ */

.tab-acc-wrap {
  margin-bottom: 0.85rem;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.07);
  overflow: hidden;
  background: rgba(8,12,22,0.45);
}

.tab-acc-toggle {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.55rem 1rem;
  background: rgba(255,255,255,0.02);
  border: none;
  cursor: pointer;
  text-align: left;
  color: var(--ts);
  font-family: var(--fd);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  transition: background 0.22s, color 0.22s;
  border-bottom: 1px solid transparent;
  position: relative;
  min-height: 40px;
}

.tab-acc-toggle:hover {
  background: rgba(0,220,160,0.05);
  color: var(--t);
}

.tab-acc-chevron {
  font-size: 0;        /* hide raw unicode char */
  flex-shrink: 0;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,0.18);
  color: var(--ts);
  transition: transform 0.28s cubic-bezier(.34,1.56,.64,1), border-color 0.22s, box-shadow 0.22s;
  background: rgba(255,255,255,0.04);
}
/* render arrow as CSS pseudo */
.tab-acc-chevron::after {
  content: '';
  display: block;
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-1px);
  color: var(--ts);
  transition: color 0.22s;
}

.tab-acc-icon {
  font-size: 1rem;
  flex-shrink: 0;
}

.tab-acc-label {
  color: var(--ts);
  /* NO flex:1 here — let hint center itself absolutely */
}

/* ── Centered expand button ── */
.tab-acc-hint {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.22rem 1rem;
  background: rgba(0,220,160,0.07);
  border: 1px solid rgba(0,220,160,0.28);
  border-radius: 20px;
  color: #00DCA0;
  font-family: var(--fb);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  white-space: nowrap;
  pointer-events: none;
  box-shadow: 0 0 10px rgba(0,220,160,0.12), 0 0 22px rgba(0,220,160,0.05);
  animation: acc-hint-pulse 3.5s ease-in-out infinite;
}
.tab-acc-hint::before {
  content: '▼';
  font-size: 0.5rem;
  opacity: 0.75;
}
@keyframes acc-hint-pulse {
  0%,100% { box-shadow: 0 0 8px rgba(0,220,160,0.12), 0 0 18px rgba(0,220,160,0.05); opacity: 0.85; }
  50%      { box-shadow: 0 0 14px rgba(0,220,160,0.22), 0 0 30px rgba(0,220,160,0.10); opacity: 1; }
}

/* ── Open state ── */
.tab-acc-wrap:has(.tab-acc-body[style*="block"]) .tab-acc-toggle {
  color: var(--cy);
  background: rgba(0,230,182,0.04);
  border-bottom-color: rgba(255,255,255,0.05);
}
.tab-acc-wrap:has(.tab-acc-body[style*="block"]) .tab-acc-chevron {
  transform: rotate(180deg);
  border-color: rgba(0,220,160,0.5);
  box-shadow: 0 0 8px rgba(0,220,160,0.2);
}
.tab-acc-wrap:has(.tab-acc-body[style*="block"]) .tab-acc-chevron::after {
  color: var(--cy);
}
.tab-acc-wrap:has(.tab-acc-body[style*="block"]) .tab-acc-label {
  color: var(--cy);
}
.tab-acc-wrap:has(.tab-acc-body[style*="block"]) .tab-acc-hint {
  animation: none;
  opacity: 0.35;
  border-color: rgba(0,220,160,0.12);
  box-shadow: none;
}

.tab-acc-body {
  display: none;
  padding: 0.75rem 0.75rem 0.85rem;
  animation: fi 0.3s ease;
}

/* Accordion inner grid — full width, 4 columns */
.acc-ind-grid {
  grid-template-columns: repeat(4, 1fr) !important;
}

/* Loading state for empty accordion */
.acc-ind-grid:empty::after {
  content: '';
  display: block;
  grid-column: 1 / -1;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--a), transparent);
  animation: shimmer 1.5s infinite;
  border-radius: 2px;
}
@keyframes shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}

/* Responsive accordion grid */
@media (max-width: 1200px) {
  .acc-ind-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 768px) {
  .tab-acc-toggle { padding: 0.5rem 0.75rem; font-size: 0.76rem; }
  .tab-acc-hint { font-size: 0.58rem; padding: 0.18rem 0.7rem; letter-spacing: 0.06em; }
  .acc-ind-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .tab-acc-body { padding: 0.5rem 0.5rem 0.65rem; }
}


/* Risk Mode — full width (5th card, no orphan) */
#macroGrid .ind-card[data-ind-id="macro_risk"] {
  grid-column: 1 / -1;
}

/* ═══════════════════════════════════════════════════════════════
   EXTRA COLUMNS + QN INLINE BADGE v1.0
═══════════════════════════════════════════════════════════════ */

/* ── Extra column header ── */
.ec-th {
  font-size: 0.7rem;
  color: var(--tm);
  white-space: nowrap;
}
.qn-th {
  color: #00d4ff;
  font-size: 0.72rem;
  letter-spacing: 0.02em;
  position: relative;
  cursor: default;
  user-select: none;
}

/* ── QN header lock pill (desktop) ── */
.qn-th::after {
  content: '🔒';
  font-size: 0.58rem;
  margin-left: 4px;
  opacity: 0.55;
  vertical-align: middle;
  filter: none;
}

/* ── QN column cells: blur overlay su desktop ── */
.qn-col {
  min-width: 72px;
  position: relative;
}
@media (min-width: 901px) {
  /* Header col QN: frosted look */
  .qn-th {
    background: rgba(0,212,255,0.03) !important;
    border-left: 1px solid rgba(0,212,255,0.08) !important;
  }
  /* Cell col QN: sfondo leggermente tinted */
  td.qn-col {
    background: rgba(0,212,255,0.02);
    border-left: 1px solid rgba(0,212,255,0.06);
  }
}

/* ── Extra column cell ── */
.ec-cell { font-size: 0.78rem; white-space: nowrap; }
.ec-loading { color: var(--tm); font-size: 0.7rem; opacity: 0.5; }
.ec-na { color: var(--tm); opacity: 0.4; }
.ec-pos { color: #00c896; font-weight: 600; }
.ec-neg { color: #ff4d6a; font-weight: 600; }
.ec-neu { color: var(--tm); }

/* ── Spread ── */
.ec-spread-val { color: #a0cfff; font-size: 0.78rem; }

/* ── P/E ── */
.ec-pe { color: #c8b8ff; font-size: 0.78rem; }

/* ── Open Interest ── */
.ec-oi { color: #ffd580; font-size: 0.78rem; }

/* ── Futures Structure ── */
.structure-badge {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 0.68rem; padding: 2px 6px; border-radius: 4px;
  font-weight: 600; white-space: nowrap;
}
.str-contango  { background: rgba(0,200,150,0.12); color: #00c896; border: 1px solid rgba(0,200,150,0.3); }
.str-back      { background: rgba(255,77,106,0.12); color: #ff4d6a; border: 1px solid rgba(255,77,106,0.3); }
.str-flat      { background: rgba(160,160,160,0.10); color: var(--tm); border: 1px solid rgba(160,160,160,0.2); }

/* ── Analyst Badge ── */
.analyst-badge {
  display: inline-block; font-size: 0.67rem; padding: 2px 7px;
  border-radius: 4px; font-weight: 700; white-space: nowrap;
}
.analyst-sbuy  { background: rgba(0,200,150,0.18); color: #00e5a8; border: 1px solid rgba(0,200,150,0.4); }
.analyst-buy   { background: rgba(0,200,150,0.10); color: #00c896; border: 1px solid rgba(0,200,150,0.25); }
.analyst-hold  { background: rgba(255,200,60,0.10); color: #ffc83c; border: 1px solid rgba(255,200,60,0.25); }
.analyst-sell  { background: rgba(255,100,80,0.10); color: #ff6450; border: 1px solid rgba(255,100,80,0.25); }
.analyst-ssell { background: rgba(255,50,80,0.18); color: #ff3250; border: 1px solid rgba(255,50,80,0.4); }

/* ═══════════════════════════════════════════════════════════════
   QN INLINE SIGNAL BADGE
═══════════════════════════════════════════════════════════════ */

.qn-col { min-width: 72px; }

.qn-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 8px; border-radius: 5px;
  font-size: 0.7rem; font-weight: 700; white-space: nowrap;
  cursor: default; position: relative;
  transition: transform 0.15s ease;
}
.qn-buy  { background: rgba(0,200,150,0.15); color: #00e5a8; border: 1px solid rgba(0,200,150,0.35); }
.qn-sell { background: rgba(255,77,106,0.15); color: #ff4d6a; border: 1px solid rgba(255,77,106,0.35); }
.qn-hold { background: rgba(255,200,60,0.12); color: #ffc83c; border: 1px solid rgba(255,200,60,0.3);  }

.qn-signal-label { font-size: 0.68rem; letter-spacing: 0.04em; }
.qn-conf { font-size: 0.62rem; opacity: 0.8; }

/* ── Locked / blurred badge ── */
.qn-locked {
  cursor: pointer;
  background: rgba(0,212,255,0.06);
  border: 1px solid rgba(0,212,255,0.2);
  color: transparent;
  position: relative; overflow: hidden;
}
.qn-locked:hover { transform: scale(1.04); border-color: rgba(0,212,255,0.45); }

.qn-blur-wrap {
  filter: blur(4px);
  user-select: none;
  display: flex; align-items: center; gap: 4px;
}
.qn-blur-wrap .qn-signal-label { color: #00d4ff; }
.qn-blur-wrap .qn-conf { color: #00d4ff; }

.qn-lock-overlay {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.75rem;
  background: rgba(0,0,0,0.1);
}

/* ═══════════════════════════════════════════════════════════════
   QN UPSELL MODAL
═══════════════════════════════════════════════════════════════ */

.qn-upsell-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,0.65);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  backdrop-filter: blur(6px);
  animation: fadeIn 0.2s ease;
}

.qn-upsell-modal {
  background: linear-gradient(145deg, #0d1a2a 0%, #0a1520 100%);
  border: 1px solid rgba(0,212,255,0.25);
  border-radius: 14px;
  padding: 28px 24px 22px;
  max-width: 420px; width: 100%;
  position: relative;
  box-shadow: 0 24px 64px rgba(0,0,0,0.6), 0 0 0 1px rgba(0,212,255,0.08);
}

.qn-upsell-close {
  position: absolute; top: 12px; right: 14px;
  background: none; border: none; color: var(--tm);
  font-size: 1rem; cursor: pointer; padding: 4px 8px;
  border-radius: 4px; transition: color 0.15s;
}
.qn-upsell-close:hover { color: #fff; }

.qn-upsell-badge-preview {
  display: flex; gap: 8px; justify-content: center;
  margin-bottom: 16px;
}
.qn-upsell-badge-preview .qn-badge { pointer-events: none; }

.qn-upsell-title {
  font-family: 'Rajdhani', sans-serif;
  font-size: 1.2rem; font-weight: 700;
  color: #00d4ff; text-align: center;
  margin: 0 0 10px;
}

.qn-upsell-body {
  font-size: 0.85rem; color: var(--ts);
  text-align: center; margin: 0 0 14px;
  line-height: 1.5;
}

.qn-upsell-features {
  list-style: none; padding: 0; margin: 0 0 18px;
  display: flex; flex-direction: column; gap: 7px;
}
.qn-upsell-features li {
  font-size: 0.82rem; color: var(--t);
  padding: 6px 10px;
  background: rgba(0,212,255,0.05);
  border-radius: 6px;
  border-left: 2px solid rgba(0,212,255,0.3);
}

.qn-upsell-cta {
  display: block; width: 100%;
  background: linear-gradient(90deg, #00a8cc 0%, #00d4ff 100%);
  color: #000; font-weight: 700; font-size: 0.88rem;
  text-align: center; text-decoration: none;
  padding: 11px 16px; border-radius: 8px;
  margin-bottom: 10px;
  transition: opacity 0.15s, transform 0.15s;
}
.qn-upsell-cta:hover { opacity: 0.9; transform: translateY(-1px); }

.qn-upsell-sub {
  font-size: 0.72rem; color: var(--tm);
  text-align: center; margin: 0;
}

/* ── Mobile responsiveness for extra cols ── */
@media (max-width: 900px) {
  .ec-th, .qn-th, .ec-cell, .qn-col { display: none; }
}
@media (max-width: 768px) {
  .qn-upsell-modal { padding: 22px 16px 18px; }
  .qn-upsell-badge-preview { display: none; }
}