@font-face{font-family:Unbounded;font-weight:500;font-display:swap;src:url(fonts/unbounded-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Unbounded;font-weight:700;font-display:swap;src:url(fonts/unbounded-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:Unbounded;font-weight:900;font-display:swap;src:url(fonts/unbounded-latin-900-normal.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:400;font-display:swap;src:url(fonts/inter-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:500;font-display:swap;src:url(fonts/inter-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:700;font-display:swap;src:url(fonts/inter-latin-700-normal.woff2) format("woff2")}
:root{
  --bg:#000;--bg2:#0a0a12;--card:#0f0f1a;--line:#1d1d2e;
  --blue:#1F6BFF;--blue2:#4D8DFF;--fuchsia:#D21CF0;--yellow:#FFE600;
  --text:#EDEDF7;--muted:#9a9ab5;
  --grad:linear-gradient(100deg,var(--blue) 0%,var(--fuchsia) 100%);
  --r:18px;--bar:76px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font:400 16px/1.6 Inter,system-ui,sans-serif;padding-bottom:calc(var(--bar) + env(safe-area-inset-bottom));overflow-x:hidden}
a{color:inherit}
img,svg{display:block;max-width:100%}
.wrap{width:100%;max-width:1160px;margin:0 auto;padding:0 16px}
h1,h2,h3{font-family:Unbounded,Inter,sans-serif;line-height:1.1;letter-spacing:-.01em}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.y{color:var(--yellow)}

/* header */
header{position:sticky;top:0;z-index:40;background:rgba(0,0,0,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top)}
.hdr{display:flex;align-items:center;justify-content:space-between;height:64px;gap:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
.brand img{width:40px;height:40px;flex:none}
.brand b{font:900 15px/1 Unbounded,sans-serif;letter-spacing:.02em;white-space:nowrap}
.brand small{display:block;font:500 10px/1.2 Inter,sans-serif;letter-spacing:.3em;color:var(--yellow);text-transform:uppercase;margin-bottom:3px}
nav ul{display:flex;gap:4px;list-style:none}
nav a{display:block;padding:8px 12px;border-radius:999px;text-decoration:none;font-weight:500;font-size:14px;color:var(--muted)}
nav a:hover{color:var(--text);background:var(--card)}
.menu-btn{display:none;background:none;border:1px solid var(--line);color:var(--text);width:44px;height:44px;border-radius:12px;cursor:pointer}
.menu-btn span{display:block;width:18px;height:2px;background:currentColor;margin:4px auto;border-radius:2px}

/* hero */
.hero{position:relative;padding:72px 0 56px;overflow:hidden}
.hero::before,.hero::after{content:"";position:absolute;border-radius:50%;filter:blur(90px);opacity:.45;z-index:-1}
.hero::before{width:520px;height:520px;background:var(--blue);top:-180px;left:-160px}
.hero::after{width:480px;height:480px;background:var(--fuchsia);bottom:-220px;right:-140px}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.kicker{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--yellow);border:1px solid rgba(255,230,0,.35);padding:6px 12px;border-radius:999px}
.dot{width:8px;height:8px;border-radius:50%;background:#ff2d55;box-shadow:0 0 0 0 rgba(255,45,85,.7);animation:pulse 1.6s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(255,45,85,0)}100%{box-shadow:0 0 0 0 rgba(255,45,85,0)}}
.hero h1{font-size:clamp(34px,6.4vw,72px);font-weight:900;margin:20px 0 18px}
.hero p.lead{font-size:clamp(16px,2vw,19px);color:var(--muted);max-width:560px}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:999px;font:700 15px Inter,sans-serif;text-decoration:none;cursor:pointer;border:0}
.btn-main{background:var(--grad);color:#fff;box-shadow:0 10px 40px -10px rgba(210,28,240,.6)}
.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--line)}
.btn-ghost:hover{border-color:var(--blue2)}
.btn svg{width:20px;height:20px}

/* player card */
.player{background:linear-gradient(var(--card),var(--card)) padding-box,var(--grad) border-box;border:2px solid transparent;border-radius:28px;padding:28px;text-align:center}
.cover{width:100%;max-width:260px;aspect-ratio:1;margin:0 auto 22px;border-radius:22px;background:#05050a;overflow:hidden;position:relative}
.cover img{width:100%;height:100%;object-fit:cover}
.eq{position:absolute;left:0;right:0;bottom:14px;display:flex;justify-content:center;gap:5px;height:34px;align-items:flex-end}
.eq i{width:6px;border-radius:3px;background:var(--yellow);height:20%;opacity:.9}
.playing .eq i{animation:eq 1s ease-in-out infinite}
.eq i:nth-child(2){animation-delay:.2s}.eq i:nth-child(3){animation-delay:.4s}.eq i:nth-child(4){animation-delay:.1s}.eq i:nth-child(5){animation-delay:.3s}
@keyframes eq{0%,100%{height:20%}50%{height:100%}}
.np-label{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.np-title{font:700 20px/1.25 Unbounded,sans-serif;margin:8px 0 4px;word-break:break-word}
.np-artist{color:var(--blue2);font-weight:500;word-break:break-word}
.play-big{width:84px;height:84px;border-radius:50%;border:0;background:var(--grad);color:#fff;margin:22px auto 0;display:grid;place-items:center;cursor:pointer;box-shadow:0 12px 40px -8px rgba(31,107,255,.7)}
.play-big svg{width:34px;height:34px}

/* sections */
section{padding:72px 0}
.sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:28px}
.sec-head h2{font-size:clamp(26px,4vw,42px);font-weight:900}
.sec-head p{color:var(--muted);max-width:520px}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.25em;text-transform:uppercase;color:var(--yellow);margin-bottom:10px}

.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{padding:12px 18px;border-radius:999px;border:1px solid var(--line);background:var(--card);font-weight:700;font-size:15px}
.chip:nth-child(3n+1){border-color:rgba(31,107,255,.6);color:var(--blue2)}
.chip:nth-child(3n+2){border-color:rgba(210,28,240,.6);color:#e57bff}
.chip:nth-child(3n){border-color:rgba(255,230,0,.5);color:var(--yellow)}
.since{margin-top:22px;color:var(--muted)}
.since b{color:var(--text)}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:26px;position:relative;overflow:hidden}
.card::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--grad)}
.card.yl::before{background:var(--yellow)}
.card .ic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;margin-bottom:18px;background:rgba(31,107,255,.12);color:var(--blue2)}
.card.fx .ic{background:rgba(210,28,240,.12);color:#e57bff}
.card.yl .ic{background:rgba(255,230,0,.12);color:var(--yellow)}
.card .ic svg{width:26px;height:26px}
.card h3{font-size:19px;margin-bottom:10px}
.card p{color:var(--muted);font-size:15px}

/* history / classifica */
.split{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.list{list-style:none;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.list li{display:flex;align-items:center;gap:14px;padding:14px 18px;border-top:1px solid var(--line)}
.list li:first-child{border-top:0}
.list .n{font:900 18px Unbounded,sans-serif;width:30px;flex:none;text-align:center;color:var(--yellow)}
.list .t{min-width:0}
.list .t b{display:block;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.list .t span{color:var(--muted);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.list .art{width:44px;height:44px;border-radius:10px;flex:none;object-fit:cover;background:#05050a}
.empty{padding:22px 18px;color:var(--muted)}
.chart-box{background:linear-gradient(140deg,rgba(31,107,255,.18),rgba(210,28,240,.18));border:1px solid var(--line);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;justify-content:center}
.chart-box h3{font-size:24px;margin-bottom:12px}
.chart-box p{color:var(--muted)}

/* curiosità */
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.fact{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;gap:18px}
.fact .num{font:900 34px/1 Unbounded,sans-serif;flex:none}
.fact:nth-child(1) .num{color:var(--blue2)}.fact:nth-child(2) .num{color:#e57bff}.fact:nth-child(3) .num{color:var(--yellow)}.fact:nth-child(4) .num{color:var(--blue2)}
.fact h3{font-size:17px;margin-bottom:6px}
.fact p{color:var(--muted);font-size:15px}

/* app band */
.app-band{background:var(--grad);border-radius:28px;padding:36px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px}
.app-band h2{font-size:clamp(22px,3.4vw,34px);color:#fff}
.app-band p{color:rgba(255,255,255,.85);margin-top:6px}
.app-band .btn{background:#000;color:#fff}

footer{border-top:1px solid var(--line);padding:36px 0 24px;color:var(--muted);font-size:14px}
.foot{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center}

/* sticky bar */
.bar{position:fixed;left:0;right:0;bottom:0;z-index:50;background:rgba(10,10,18,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
.bar-in{height:var(--bar);display:flex;align-items:center;gap:14px}
.bar-play{width:52px;height:52px;flex:none;border-radius:50%;border:0;background:var(--grad);color:#fff;display:grid;place-items:center;cursor:pointer}
.bar-play svg{width:22px;height:22px}
.bar-art{width:48px;height:48px;border-radius:10px;flex:none;object-fit:cover;background:#05050a}
.bar-txt{min-width:0;flex:1}
.bar-txt b{display:block;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar-txt span{display:block;font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live{font-size:11px;font-weight:700;letter-spacing:.15em;color:#ff2d55;display:flex;align-items:center;gap:6px;flex:none}
.vol{display:flex;align-items:center;gap:8px;flex:none}
.vol input{width:110px;accent-color:var(--fuchsia)}

/* install toast */
.install{position:fixed;left:16px;right:16px;bottom:calc(var(--bar) + 16px + env(safe-area-inset-bottom));z-index:60;max-width:460px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;display:none;gap:14px;align-items:center;box-shadow:0 20px 60px -10px rgba(0,0,0,.8)}
.install.show{display:flex}
.install img{width:48px;height:48px;border-radius:12px;flex:none}
.install div{flex:1;min-width:0;font-size:14px}
.install div b{display:block;font-size:15px}
.install .ok{background:var(--grad);color:#fff;border:0;border-radius:999px;padding:10px 16px;font-weight:700;cursor:pointer;flex:none}
.install .x{background:none;border:0;color:var(--muted);font-size:22px;cursor:pointer;width:32px;height:32px;flex:none}

/* responsive */
@media (max-width:960px){
  .hero-grid{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:1fr}
}
@media (max-width:760px){
  .menu-btn{display:block}
  nav{position:fixed;top:calc(64px + env(safe-area-inset-top));left:0;right:0;background:#000;border-bottom:1px solid var(--line);display:none}
  nav.open{display:block}
  nav ul{flex-direction:column;padding:8px 16px 16px}
  nav a{padding:14px 12px;font-size:16px;border-radius:12px}
  .hero{padding:40px 0 40px}
  section{padding:52px 0}
  .cards,.facts{grid-template-columns:1fr}
  .player{padding:22px}
  .vol{display:none}
  .app-band{padding:26px}
  .btn{width:100%}
  .app-band .btn{width:auto}
}
@media (max-width:380px){.brand b{font-size:13px}.live{display:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}

/* ===== viste (pagine) ===== */
.view{display:none}
.view.on{display:block}
nav a.act{color:var(--text);background:var(--card)}
.page-hero{position:relative;padding:56px 0 8px;overflow:hidden}
.page-hero::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;filter:blur(100px);opacity:.35;background:var(--fuchsia);top:-220px;right:-120px;z-index:-1}
.page-hero h1{font-size:clamp(30px,5vw,54px);font-weight:900;margin-top:8px}
.page-hero p{color:var(--muted);max-width:640px;margin-top:12px}
.more{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--blue2);text-decoration:none}
.more:hover{color:var(--yellow)}
.note{background:var(--card);border:1px dashed var(--line);border-radius:var(--r);padding:22px;color:var(--muted)}

/* palinsesto */
.days{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:18px;scrollbar-width:none}
.days::-webkit-scrollbar{display:none}
.days button{flex:none;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--muted);font:700 14px Inter,sans-serif;cursor:pointer}
.days button.on{background:var(--grad);border-color:transparent;color:#fff}
.sched{list-style:none;display:grid;gap:10px}
.sched li{display:grid;grid-template-columns:110px 1fr auto;gap:16px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px 18px}
.sched li.now{border-color:var(--yellow);box-shadow:0 0 0 1px var(--yellow) inset}
.sched .h{font:700 15px Unbounded,sans-serif;color:var(--blue2);white-space:nowrap}
.sched .p b{display:block;font-size:16px}
.sched .p span{color:var(--muted);font-size:14px}
.sched .tag{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#000;background:var(--yellow);border-radius:999px;padding:4px 10px}
.djs{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}
.dj{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.dj .ph{aspect-ratio:1;background:linear-gradient(140deg,rgba(31,107,255,.35),rgba(210,28,240,.35));display:grid;place-items:center;font:900 54px Unbounded,sans-serif;color:#fff}
.dj .ph img{width:100%;height:100%;object-fit:cover}
.dj .b{padding:18px}
.dj h3{font-size:17px}
.dj .g{color:var(--yellow);font-size:13px;font-weight:700;margin:4px 0 8px}
.dj p{color:var(--muted);font-size:14px}
.dj .lnk{margin-top:10px;display:flex;gap:12px;flex-wrap:wrap}
.dj .lnk a{color:var(--blue2);font-size:14px;font-weight:700;text-decoration:none}

/* classifica */
.week{color:var(--muted);margin-bottom:16px}
.week b{color:var(--yellow)}
.chart{list-style:none;display:grid;gap:8px}
.chart li{display:grid;grid-template-columns:52px 56px 1fr 40px;gap:14px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 14px}
.chart li:nth-child(-n+3){border-color:rgba(255,230,0,.45)}
.chart .pos{font:900 24px Unbounded,sans-serif;text-align:center;color:var(--yellow)}
.chart li:nth-child(n+4) .pos{color:var(--text)}
.chart .ca{width:56px;height:56px;border-radius:10px;object-fit:cover;background:linear-gradient(140deg,var(--blue),var(--fuchsia))}
.chart .t{min-width:0}
.chart .t b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chart .t span{display:block;color:var(--muted);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr{font-weight:900;text-align:center;font-size:13px}
.tr.up{color:#2ee59d}.tr.down{color:#ff4d6d}.tr.same{color:var(--muted)}.tr.new{color:#000;background:var(--yellow);border-radius:6px;padding:2px 0;font-size:10px;letter-spacing:.05em}

/* video */
.vids{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.vid{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.vframe{position:relative;aspect-ratio:16/9;background:#05050a}
.vframe iframe,.vframe video,.vframe img{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}
.vplay{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(transparent,rgba(0,0,0,.45));border:0;cursor:pointer;color:#fff}
.vplay span{width:68px;height:68px;border-radius:50%;background:var(--grad);display:grid;place-items:center;box-shadow:0 10px 30px -6px rgba(210,28,240,.7)}
.vplay svg{width:28px;height:28px}
.vid .b{padding:14px 16px}
.vid h3{font-size:15px;font-family:Inter,sans-serif;font-weight:700}
.vid p{color:var(--muted);font-size:13px;margin-top:4px}
.vnote{font-size:12px;color:var(--muted);margin-top:14px}

/* contatti */
.contacts{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.ct{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;text-decoration:none}
.ct:hover{border-color:var(--blue2)}
.ct .ci{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;flex:none;background:var(--grad);color:#fff}
.ct .ci svg{width:22px;height:22px}
.ct b{display:block}
.ct span{color:var(--muted);font-size:14px;word-break:break-all}
.req{margin-top:22px;background:linear-gradient(140deg,rgba(31,107,255,.18),rgba(210,28,240,.18));border:1px solid var(--line);border-radius:var(--r);padding:24px}
.req h3{font-size:20px;margin-bottom:8px}
.req p{color:var(--muted);margin-bottom:16px}
.req form{display:grid;gap:10px;grid-template-columns:1fr 1fr}
.req input{min-height:48px;border-radius:12px;border:1px solid var(--line);background:#05050a;color:var(--text);padding:0 14px;font:16px Inter,sans-serif;width:100%}
.req .btn{grid-column:1/-1}

/* testi legali */
.legal{max-width:780px}
.legal h2{font-size:20px;margin:28px 0 10px}
.legal p,.legal li{color:#c9c9dc;margin-bottom:10px}
.legal ul{padding-left:20px}
.legal a{color:var(--blue2)}
.flinks{display:flex;flex-wrap:wrap;gap:16px}
.flinks a{color:var(--muted);font-size:14px;text-decoration:none}.flinks a:hover{color:var(--text)}
.foot .ed{flex-basis:100%;font-size:12px;color:#6f6f88}

@media (max-width:760px){
  .sched li{grid-template-columns:1fr auto;gap:6px 10px;padding:14px 16px}
  .sched .h{grid-column:1;font-size:14px}
  .sched .p{grid-column:1/-1;grid-row:2}
  .sched .tag{grid-column:2;grid-row:1;justify-self:end}
  .djs{grid-template-columns:repeat(2,1fr);gap:12px}
  .dj .b{padding:14px}
  .dj .ph{font-size:40px}
  .chart li{grid-template-columns:36px 48px 1fr 32px;gap:10px;padding:8px 10px}
  .chart .ca{width:48px;height:48px}
  .chart .pos{font-size:19px}
  .req form{grid-template-columns:1fr}
  .vids{grid-template-columns:1fr}
}