:root{
  --bg:#140b0e;--bg2:#1d1115;--bg3:#27171d;--bg4:#321e25;--line:#3b252c;
  --tx:#f7eef0;--tx2:#d4bec4;--tx3:#a08891;
  --co:#ff5a6e;--co2:#ff8494;--gold:#ffc861;--gold2:#ffd98f;--red:#ff3b4e;
  --r:14px;--hd:"Didot","Bodoni 72","Playfair Display","Libre Bodoni",Georgia,"Times New Roman",serif;
  --ui:"Avenir Next","Segoe UI Variable","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.locked{overflow:hidden}
body{margin:0;background:var(--bg);color:var(--tx);font:16px/1.65 var(--ui)}
a{color:var(--co2);text-underline-offset:3px}
a:hover{color:var(--gold2)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{font-family:var(--hd);font-weight:700;line-height:1.15;letter-spacing:.2px;color:#fff}
h1{font-size:clamp(30px,4.2vw,48px);margin:.1em 0 .35em}
h2{font-size:clamp(24px,2.6vw,32px);margin:1.8em 0 .55em}
h2::after{content:"";display:block;width:46px;height:3px;margin-top:10px;border-radius:3px;background:linear-gradient(90deg,var(--co),var(--gold))}
h3{font-size:20px;margin:1.2em 0 .4em}
p{margin:0 0 1em}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:99;background:var(--gold);color:#000;padding:8px 12px;border-radius:8px}

/* header */
.top{position:sticky;top:0;z-index:30;background:rgba(20,11,14,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top__in{max-width:1360px;margin:0 auto;display:flex;align-items:center;gap:22px;padding:10px 20px}
.top__home{text-decoration:none;flex:0 0 auto}
.logo{display:flex;align-items:center;gap:10px;color:#fff;font:600 19px/1 var(--ui);letter-spacing:.2px}
.logo__t b{color:var(--co);font-weight:800}
.top__nav{display:flex;gap:4px;margin-left:auto}
.top__nav a{color:var(--tx2);text-decoration:none;font:600 14px/1 var(--ui);padding:9px 12px;border-radius:999px}
.top__nav a:hover,.top__nav a[aria-current]{background:var(--bg3);color:#fff}
.top__cta{flex:0 0 auto}

/* barra mobile di avatar */
.strip{display:none;gap:12px;overflow-x:auto;padding:12px 16px 10px;border-bottom:1px solid var(--line);background:var(--bg2);scrollbar-width:none}
.strip::-webkit-scrollbar{display:none}
.st{position:relative;flex:0 0 auto;width:64px;text-align:center;text-decoration:none;color:var(--tx2);font:600 11px/1.2 var(--ui)}
.st img{width:56px;height:56px;border-radius:50%;margin:0 auto 5px;border:2px solid var(--co);object-fit:cover}
.st i{position:absolute;top:2px;right:6px;width:12px;height:12px;border-radius:50%;background:var(--red);border:2px solid var(--bg2);animation:pulse 1.6s infinite}

/* griglia principale */
.wrap{max-width:1360px;margin:0 auto;display:grid;grid-template-columns:268px minmax(0,1fr);gap:34px;padding:0 20px}
.side{position:sticky;top:64px;align-self:start;max-height:calc(100vh - 64px);overflow-y:auto;padding:22px 4px 24px 0;scrollbar-width:thin}
.side__h{font:800 11px/1 var(--ui);letter-spacing:1.6px;text-transform:uppercase;color:var(--gold);margin:6px 0 10px 4px}
.side__stars,.side__nav{list-style:none;margin:0 0 20px;padding:0}
.pb{display:flex;align-items:center;gap:11px;padding:7px 10px 7px 7px;border-radius:12px;text-decoration:none;color:var(--tx);border:1px solid transparent;margin-bottom:3px;transition:background .15s,border-color .15s}
.pb:hover{background:var(--bg3);border-color:var(--line);color:#fff}
.pb[aria-current]{background:linear-gradient(90deg,rgba(255,90,110,.18),rgba(255,90,110,.04));border-color:rgba(255,90,110,.45)}
.pb img{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:0 0 auto;border:2px solid var(--bg4)}
.pb__t{display:flex;flex-direction:column;min-width:0;flex:1}
.pb__t b{font:700 14px/1.2 var(--ui);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pb__t small{font:500 12px/1.3 var(--ui);color:var(--tx3)}
.live{font:800 9px/1 var(--ui);letter-spacing:.8px;color:#fff;background:var(--red);padding:4px 6px;border-radius:5px;animation:pulse 1.6s infinite}
.new{font:800 9px/1 var(--ui);letter-spacing:.8px;color:#2a1a00;background:var(--gold);padding:4px 6px;border-radius:5px}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,59,78,.6)}50%{box-shadow:0 0 0 5px rgba(255,59,78,0)}}
@media (prefers-reduced-motion:reduce){.live,.st i{animation:none}}
.side__nav a{display:block;padding:8px 10px;border-radius:10px;color:var(--tx2);text-decoration:none;font:600 14px/1.2 var(--ui)}
.side__nav a:hover,.side__nav a[aria-current]{background:var(--bg3);color:#fff}
.main{min-width:0;padding:22px 0 70px}

/* bottoni */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:13px 20px;border-radius:999px;background:var(--co);color:#fff;text-decoration:none;font:800 15px/1.1 var(--ui);border:0;cursor:pointer;white-space:nowrap;transition:transform .15s,background .15s}
.btn:hover{background:var(--co2);color:#fff;transform:translateY(-1px)}
.btn--gold{background:linear-gradient(135deg,var(--gold),#ffae3d);color:#2a1700}
.btn--gold:hover{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#2a1700}
.btn--ghost{background:transparent;border:1.5px solid var(--line);color:#fff}
.btn--ghost:hover{background:var(--bg3);border-color:var(--co)}
.btn--sm{padding:9px 14px;font-size:13px}
.btn--block{display:flex;width:100%}
.arr{opacity:.8}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 6px}

/* briciole e timbro */
.crumbs{font:500 13px/1.4 var(--ui);color:var(--tx3);margin:0 0 14px}
.crumbs a{color:var(--tx2);text-decoration:none}.crumbs a:hover{color:#fff}
.stamp{font:600 12px/1.4 var(--ui);color:var(--tx3);margin:8px 0 0}
.kick{font:800 12px/1 var(--ui);letter-spacing:1.6px;text-transform:uppercase;color:var(--gold);margin:0 0 10px;display:flex;align-items:center;gap:8px}
.lede{font-size:18px;color:var(--tx2);max-width:62ch}

/* hero */
.hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:30px;align-items:center;padding:8px 0 10px}
.hero__art{position:relative}
.mosaic{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;transform:rotate(2deg)}
.mosaic img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px;box-shadow:0 14px 30px rgba(0,0,0,.5)}
.mosaic img:nth-child(3n+2){transform:translateY(22px)}
.portrait{position:relative;border-radius:22px;overflow:hidden;border:1px solid var(--line);box-shadow:0 20px 50px rgba(0,0,0,.55)}
.portrait img{width:100%;aspect-ratio:4/5;object-fit:cover}
.portrait__tag{position:absolute;left:14px;bottom:14px;right:14px;display:flex;flex-wrap:wrap;gap:6px}
.chip{font:700 12px/1 var(--ui);padding:7px 10px;border-radius:999px;background:rgba(20,11,14,.78);color:#fff;border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(6px)}
.chip--live{background:var(--red);border-color:var(--red)}
.chip--gold{background:var(--gold);color:#2a1700;border-color:var(--gold)}

/* numeri chiave */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:20px 0}
.stat{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:14px}
.stat b{display:block;font:700 26px/1 var(--hd);color:var(--gold)}
.stat span{font:600 12px/1.3 var(--ui);color:var(--tx3)}
.keys{background:linear-gradient(135deg,rgba(255,90,110,.10),rgba(255,200,97,.06));border:1px solid rgba(255,90,110,.32);border-radius:var(--r);padding:16px 20px;margin:22px 0}
.keys p.h{font:800 12px/1 var(--ui);letter-spacing:1.4px;text-transform:uppercase;color:var(--co2);margin:0 0 10px}
.keys ul{margin:0;padding-left:18px}.keys li{margin:5px 0}

/* card delle performer */
.stars{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:14px;margin:16px 0 8px}
.sc{position:relative;display:flex;flex-direction:column;background:var(--bg2);border:1px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none;color:var(--tx);transition:transform .15s,border-color .15s}
.sc:hover{transform:translateY(-3px);border-color:var(--co);color:#fff}
.sc img{width:100%;aspect-ratio:4/5;object-fit:cover}
.sc__b{padding:12px 14px 14px}
.sc__n{font:700 19px/1.15 var(--hd);color:#fff;margin:0 0 4px}
.sc__m{font:600 12.5px/1.4 var(--ui);color:var(--tx3);margin:0}
.sc .badges{position:absolute;top:10px;left:10px;display:flex;gap:6px}

/* copertine */
.shelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:14px;margin:16px 0 10px}
.tile{position:relative;display:block;border-radius:14px;overflow:hidden;background:var(--bg2);border:1px solid var(--line);text-decoration:none;color:var(--tx);transition:transform .15s,border-color .15s}
.tile:hover{transform:translateY(-3px);border-color:var(--gold);color:#fff}
.tile img{width:100%;aspect-ratio:4/5;object-fit:cover}
.tile__badge{position:absolute;top:9px;left:9px;font:800 11px/1 var(--ui);padding:6px 8px;border-radius:7px;background:var(--gold);color:#2a1700}
.tile__star{position:absolute;top:9px;right:9px;width:30px;height:30px;border-radius:50%;border:2px solid var(--co);object-fit:cover}
.tile__i{padding:10px 12px 12px}
.tile__t{font:700 14px/1.3 var(--ui);margin:0 0 3px;color:#fff}
.tile__m{font:500 12px/1.35 var(--ui);color:var(--tx3);margin:0}

/* liste ordinate */
.rank{list-style:none;margin:16px 0 24px;padding:0;display:grid;gap:12px}
.rank li{display:grid;grid-template-columns:110px minmax(0,1fr);gap:18px;background:var(--bg2);border:1px solid var(--line);border-radius:16px;padding:12px}
.rank img{width:110px;aspect-ratio:4/5;object-fit:cover;border-radius:10px}
.rank h3{margin:2px 0 6px;font-size:21px}
.rank .why{font:800 11px/1 var(--ui);letter-spacing:1px;text-transform:uppercase;color:var(--gold);margin:0 0 6px}
.rank p{margin:0 0 8px;color:var(--tx2);font-size:15px}
.meta{font:600 12.5px/1.45 var(--ui);color:var(--tx3)}

/* cam */
.cams{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:14px;margin:16px 0}
.cam{position:relative;display:block;border-radius:16px;overflow:hidden;border:1px solid var(--line);text-decoration:none;color:#fff;background:var(--bg2)}
.cam img{width:100%;aspect-ratio:3/4;object-fit:cover}
.cam__o{position:absolute;inset:auto 0 0 0;padding:40px 12px 12px;background:linear-gradient(180deg,transparent,rgba(20,11,14,.95) 55%)}
.cam__n{font:700 16px/1.2 var(--ui);margin:0}
.cam__p{font:600 12px/1.3 var(--ui);color:var(--gold2);margin:3px 0 0}
.cam .live{position:absolute;top:10px;left:10px}
.cam:hover{border-color:var(--red)}

/* tabelle e schede */
.tw{overflow-x:auto;margin:16px 0 22px;border:1px solid var(--line);border-radius:var(--r)}
table{width:100%;border-collapse:collapse;font:15px/1.45 var(--ui)}
th,td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{background:var(--bg3);color:var(--gold);font:800 12px/1.2 var(--ui);letter-spacing:.8px;text-transform:uppercase;white-space:nowrap}
tr:last-child td{border-bottom:0}
td.n,th.n{text-align:right;white-space:nowrap}
tr.hl td{background:rgba(255,90,110,.07)}
.win{color:var(--gold2);font-weight:700}
.facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin:18px 0}
.fact{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.fact span{display:block;font:700 11px/1.2 var(--ui);letter-spacing:1px;text-transform:uppercase;color:var(--tx3);margin-bottom:5px}
.fact b{font:700 16px/1.3 var(--ui);color:#fff}
.epstrip{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:12px 0 18px;padding:0}
.epstrip li{font:700 12px/1 var(--ui);padding:8px 10px;border-radius:9px;background:var(--bg3);color:var(--tx2);border:1px solid var(--line)}
.epstrip li.free{background:rgba(255,200,97,.16);color:var(--gold2);border-color:rgba(255,200,97,.4)}
.prose{max-width:72ch}
.prose p,.prose li{color:var(--tx2)}
.prose b{color:#fff}
.note{font:500 13px/1.5 var(--ui);color:var(--tx3);margin:-6px 0 20px}
.box{background:var(--bg2);border:1px solid var(--line);border-radius:16px;padding:18px 20px;margin:20px 0}
.box h3{margin-top:0}
.who{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;align-items:start}
.who img{width:96px;height:96px;border-radius:50%;object-fit:cover;border:3px solid var(--co)}
.verdict{background:linear-gradient(135deg,rgba(255,200,97,.12),rgba(255,90,110,.08));border:1px solid rgba(255,200,97,.35);border-radius:16px;padding:18px 22px;margin:26px 0}
.verdict h2{margin-top:0}.verdict h2::after{display:none}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:16px 0}
.duo>div{background:var(--bg2);border:1px solid var(--line);border-radius:14px;padding:14px 18px}
.duo h3{margin-top:0}
.cta-row{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}
.disclose{font:500 13px/1.5 var(--ui);color:var(--tx3);border-top:1px solid var(--line);padding-top:14px;margin-top:34px}
.faq details{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:0 16px;margin:0 0 8px}
.faq summary{cursor:pointer;padding:13px 0;font-weight:700;color:#fff;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"+";color:var(--co);font-weight:800;margin-right:10px}
.faq details[open] summary::before{content:"\2212"}
.faq p{color:var(--tx2)}

/* footer, sticky, gate */
.foot{border-top:1px solid var(--line);background:var(--bg2);margin-top:20px}
.foot__in{max-width:1360px;margin:0 auto;padding:34px 20px 10px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
.foot__in p{color:var(--tx3);font-size:14px;margin-top:12px}
.foot__h{font:800 11px/1 var(--ui)!important;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold)!important;margin:6px 0 12px!important}
.foot ul{list-style:none;margin:0;padding:0}.foot li{margin:0 0 7px}
.foot a{color:var(--tx2);text-decoration:none;font-size:14px}.foot a:hover{color:#fff}
.foot__small{max-width:1360px;margin:0 auto;padding:12px 20px 30px;color:var(--tx3);font-size:12.5px}
.stick{display:none}
.vg{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:20px;background:radial-gradient(circle at 30% 20%,rgba(255,90,110,.25),transparent 55%),radial-gradient(circle at 80% 90%,rgba(255,200,97,.18),transparent 50%),rgba(12,6,8,.97)}
.vg[hidden]{display:none}
.vg__card{max-width:430px;width:100%;background:var(--bg2);border:1px solid var(--line);border-radius:22px;padding:28px;text-align:center}
.vg__logo{display:flex;justify-content:center;margin-bottom:16px}
.vg__t{font:700 30px/1.1 var(--hd);color:#fff;margin:0 0 10px}
.vg__card p{color:var(--tx2)}
.vg__no{display:inline-block;margin-top:14px;color:var(--tx3);font-size:14px}

/* responsive */
@media (max-width:1180px){.top__nav{display:none}.top__cta{margin-left:auto}}
@media (max-width:1023px){
  .wrap{grid-template-columns:minmax(0,1fr);padding:0 16px}
  .side{display:none}
  .strip{display:flex}
  .hero{grid-template-columns:minmax(0,1fr);gap:20px}
  .mosaic{transform:none;grid-template-columns:repeat(4,1fr);gap:6px}.mosaic img:nth-child(3n+2){transform:none}
  .mosaic img:nth-child(n+9){display:none}
  .portrait{max-width:380px}
  .stick{display:block;position:fixed;left:0;right:0;bottom:0;z-index:25;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(20,11,14,.94);border-top:1px solid var(--line)}
  .foot{padding-bottom:70px}
  .foot__in{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .top__in{padding:10px 16px}
  .logo{font-size:16px}.logo svg{width:28px;height:28px}
  .top__cta{display:none}
  .stats{grid-template-columns:1fr 1fr}
  .facts{grid-template-columns:1fr 1fr;gap:8px}.fact{padding:10px 12px}.fact b{font-size:14.5px}
  .rank li{grid-template-columns:84px minmax(0,1fr);gap:12px}
  .rank img{width:84px}
  .duo{grid-template-columns:1fr}
  .stars{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .shelf{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .cams{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .who{grid-template-columns:64px minmax(0,1fr)}.who img{width:64px;height:64px}
  .foot__in{grid-template-columns:1fr}
  table{font-size:14px}th,td{padding:9px 10px}
}
