/* ===== Moduli: Puntata del giorno (visual novel) e Fascicolo ===== */
:root{ --navy:#24304A; --teal:#2F6B66; --ruby:#9A3B47; --oro:#B88A3E; }
html.grandi body{ font-size:19px; }
html.grandi .card p, html.grandi .tl p{ font-size:17px; }
html.grandi .vn-box .vn-testo{ font-size:24px; }
html.grandi .sh-body{ font-size:19px; }

.tasto{ display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:14px; padding:13px 20px; font:inherit; font-weight:700; font-size:16px; cursor:pointer; text-decoration:none; }
.tasto.pieno{ background:var(--plum); color:#fff; box-shadow:0 8px 20px rgba(74,44,63,.25); }
.tasto.oro{ background:var(--gold); color:#3B2433; }
.tasto.chiaro{ background:#fff; color:var(--plum); border:1px solid var(--line); }
.tasto:active{ transform:scale(.98); }

/* la puntata di oggi in testa */
.oggi{ margin:18px auto 0; max-width:760px; border-radius:20px; overflow:hidden; position:relative; background:#3B2433; color:#fff; box-shadow:0 14px 34px rgba(74,44,63,.25); cursor:pointer; display:block; text-align:left; border:0; padding:0; width:100%; font:inherit; }
.oggi .im{ position:absolute; inset:0; background:#4A2C3F center/cover no-repeat; }
.oggi .im::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(59,36,51,.05) 0%,rgba(59,36,51,.25) 45%,rgba(43,26,37,.95) 100%); }
.oggi .tx{ position:relative; z-index:1; padding:150px 20px 18px; }
@media (min-width:700px){ .oggi .tx{ padding-top:210px; } }
.oggi .et{ display:inline-flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:#F1D6DC; background:rgba(74,44,63,.6); border:1px solid rgba(241,214,220,.5); border-radius:20px; padding:4px 11px; }
.oggi .et i{ width:7px; height:7px; border-radius:50%; background:#E2A3B3; box-shadow:0 0 0 3px rgba(226,163,179,.3); font-style:normal; }
.oggi h3{ font-family:"Cormorant Garamond",serif; font-weight:600; font-size:clamp(28px,6vw,40px); line-height:1.05; margin:8px 0 4px; }
.oggi p{ margin:0 0 12px; font-size:14.5px; color:#EBD3DA; max-width:560px; }
.oggi .gioca{ display:inline-flex; align-items:center; gap:10px; background:#C9A46A; color:#3B2433; font-weight:800; border-radius:14px; padding:11px 18px; font-size:16px; }
.oggi .gioca b{ width:26px; height:26px; border-radius:50%; background:#3B2433; color:#F1D6DC; display:grid; place-items:center; font-size:11px; padding-left:2px; }

/* archivio puntate */
.archivio{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:14px; }
.pt{ background:var(--card); border:1px solid var(--line); border-radius:16px; overflow:hidden; text-align:left; padding:0; font:inherit; color:inherit; cursor:pointer; display:flex; flex-direction:column; }
.pt .im{ aspect-ratio:16/9; background:#E9D8DD center/cover no-repeat; position:relative; }
.pt .im span{ position:absolute; left:10px; top:10px; background:rgba(59,36,51,.78); color:#F1D6DC; border-radius:20px; font-size:11.5px; font-weight:700; padding:4px 10px; letter-spacing:.06em; }
.pt .im .vista{ left:auto; right:10px; background:rgba(126,156,138,.92); color:#fff; }
.pt .c{ padding:12px 14px 14px; }
.pt h4{ font-family:"Cormorant Garamond",serif; font-size:22px; margin:0 0 4px; color:var(--plum); font-weight:600; line-height:1.15; }
.pt small{ color:var(--ink3); font-size:13px; }
.pt p{ margin:6px 0 0; color:var(--ink2); font-size:14px; }

/* tessere del fascicolo */
.tessere{ display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:12px; }
.tessera{ background:var(--card); border:1px solid var(--line); border-radius:16px; padding:16px 14px; text-align:left; font:inherit; color:var(--plum); cursor:pointer; display:flex; flex-direction:column; gap:6px; min-height:118px; }
.tessera .ic{ width:40px; height:40px; border-radius:12px; display:grid; place-items:center; background:#F4E4E8; font-size:20px; }
.tessera b{ font-family:"Cormorant Garamond",serif; font-size:21px; font-weight:600; line-height:1.1; }
.tessera small{ color:var(--ink3); font-size:12.5px; line-height:1.35; }
.tessera > span:last-child{ line-height:1.25; }
.tessera.grande{ grid-column:1/-1; flex-direction:row; align-items:center; gap:16px; background:linear-gradient(135deg,#4A2C3F,#6B3F55); color:#fff; border:0; min-height:0; padding:18px; }
.tessera.grande .ic{ background:#C9A46A; color:#3B2433; width:52px; height:52px; border-radius:50%; font-size:18px; flex:0 0 auto; }
.tessera.grande b{ font-size:26px; } .tessera.grande small{ color:#EBD3DA; font-size:14px; }

/* fogli a schermo intero (Fascicolo) */
.foglio{ position:fixed; inset:0; z-index:80; background:var(--bg); overflow-y:auto; -webkit-overflow-scrolling:touch; transform:translateX(100%); transition:transform .28s ease; overscroll-behavior:contain; }
.foglio.on{ transform:none; }
.sh-top{ position:sticky; top:0; z-index:2; display:flex; align-items:center; gap:10px; padding:calc(10px + env(safe-area-inset-top,0px)) 14px 10px; background:rgba(250,246,241,.95); backdrop-filter:blur(8px); border-bottom:1px solid var(--line); }
.sh-top button{ border:0; background:#fff; border:1px solid var(--line); width:42px; height:42px; border-radius:50%; font-size:20px; color:var(--plum); cursor:pointer; flex:0 0 auto; }
.sh-top h3{ margin:0; font-family:"Cormorant Garamond",serif; font-size:25px; color:var(--plum); font-weight:600; line-height:1.1; }
.sh-body{ max-width:820px; margin:0 auto; padding:18px 18px calc(60px + env(safe-area-inset-bottom,0px)); }
.sh-body .intro{ color:var(--ink2); margin:0 0 16px; }
.fonte{ font-size:12.5px; color:var(--ink3); text-decoration:none; border-bottom:1px dotted var(--ink3); }
.fonte:hover{ color:var(--rose); }
.prova{ background:var(--card); border:1px solid var(--line); border-radius:16px; margin:0 0 14px; overflow:hidden; }
.prova h4{ margin:0; padding:14px 16px 4px; font-family:"Cormorant Garamond",serif; font-size:23px; color:var(--plum); font-weight:600; }
.prova .cosa{ padding:0 16px 12px; color:var(--ink2); margin:0; }
.due{ display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--line); }
.due > div{ padding:12px 16px 14px; font-size:14.5px; }
.due > div + div{ border-left:1px solid var(--line); }
.due b{ display:block; font-size:11px; letter-spacing:.18em; text-transform:uppercase; margin-bottom:4px; }
.due .acc b{ color:var(--navy); } .due .dif b{ color:var(--teal); }
@media (max-width:600px){ .due{ grid-template-columns:1fr; } .due > div + div{ border-left:0; border-top:1px solid var(--line); } }
.prova .ff{ padding:0 16px 12px; }
.tesi{ border-radius:16px; padding:16px 18px; margin:0 0 14px; background:#fff; border:1px solid var(--line); border-left:6px solid var(--plum); }
.tesi h4{ margin:0 0 6px; font-family:"Cormorant Garamond",serif; font-size:24px; font-weight:600; }
.tesi p{ margin:0 0 8px; }
.tesi.procura{ border-left-color:var(--navy); } .tesi.procura h4{ color:var(--navy); }
.tesi.difesa-sempio{ border-left-color:var(--teal); } .tesi.difesa-sempio h4{ color:var(--teal); }
.tesi.difesa-stasi{ border-left-color:var(--oro); } .tesi.difesa-stasi h4{ color:#8A6326; }
.tesi.famiglia{ border-left-color:var(--rose); } .tesi.famiglia h4{ color:var(--ruby); }
.persona{ display:flex; gap:12px; align-items:flex-start; background:#fff; border:1px solid var(--line); border-radius:14px; padding:12px 14px; margin:0 0 10px; }
.persona .sg{ width:46px; height:46px; flex:0 0 auto; border-radius:50%; overflow:hidden; }
.persona b{ font-family:"Cormorant Garamond",serif; font-size:20px; color:var(--plum); display:block; line-height:1.15; }
.persona .r{ font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--rose); font-weight:700; }
.persona p{ margin:4px 0 0; color:var(--ink2); font-size:14.5px; }
.gruppo-t{ font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink3); font-weight:700; margin:20px 0 10px; }
.parola{ border-bottom:1px solid var(--line); padding:12px 0; }
.parola b{ font-family:"Cormorant Garamond",serif; font-size:21px; color:var(--plum); }
.parola p{ margin:2px 0 0; color:var(--ink2); }
.cita{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:14px 16px; margin:0 0 12px; }
.cita q{ display:block; font-family:"Cormorant Garamond",serif; font-size:23px; line-height:1.25; color:var(--plum); quotes:"«" "»"; }
.cita .chi{ margin-top:8px; font-size:13.5px; color:var(--ink2); }
.cita .chi b{ color:var(--ink); }
.scad{ display:flex; gap:14px; align-items:flex-start; padding:14px 0; border-bottom:1px solid var(--line); }
.scad .d{ min-width:96px; font-family:"Cormorant Garamond",serif; font-size:20px; color:var(--plum); font-weight:600; line-height:1.1; }
.scad .s{ display:inline-block; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; border-radius:20px; padding:2px 8px; margin-bottom:4px; }
.scad .s.c{ background:#E4EDE7; color:#3F6B53; } .scad .s.i{ background:#F6E9DA; color:#8A5A2B; }
.filtri{ display:flex; gap:8px; overflow-x:auto; padding:2px 0 12px; scrollbar-width:none; }
.filtri button{ border:1px solid var(--line); background:#fff; border-radius:20px; padding:8px 14px; font:inherit; font-size:14px; color:var(--ink2); white-space:nowrap; cursor:pointer; }
.filtri button.on{ background:var(--plum); color:#fff; border-color:var(--plum); }

/* ===== Lettore della puntata (visual novel) ===== */
.vn{ position:fixed; inset:0; z-index:90; background:#1E1219; color:#fff; display:none; overflow:hidden; user-select:none; -webkit-user-select:none; }
.vn.on{ display:block; }
.vn-bg{ position:absolute; inset:0; background:#2B1A25 center/cover no-repeat; transition:opacity .9s ease; }
.vn-bg.kb{ animation:kb 22s ease-in-out infinite alternate; }
@keyframes kb{ from{ transform:scale(1.02) translate(0,0); } to{ transform:scale(1.12) translate(-1.5%,-1%); } }
.vn-velo{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(30,18,25,.55) 0%,rgba(30,18,25,0) 22%,rgba(30,18,25,0) 45%,rgba(30,18,25,.88) 100%); pointer-events:none; }
.vn-alto{ position:absolute; left:0; right:0; top:0; display:flex; align-items:flex-start; justify-content:space-between; gap:10px; padding:calc(12px + env(safe-area-inset-top,0px)) 14px 0; z-index:5; }
.vn-luogo{ max-width:70%; }
.vn-luogo small{ display:block; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:#E7C9CF; }
.vn-luogo b{ display:block; font-family:"Cormorant Garamond",serif; font-size:clamp(20px,4.6vw,30px); font-weight:600; line-height:1.1; text-shadow:0 2px 10px rgba(0,0,0,.6); }
.vn-com{ display:flex; gap:8px; }
.vn-com button{ width:44px; height:44px; border-radius:50%; border:0; background:rgba(255,253,250,.16); color:#fff; font-size:18px; cursor:pointer; backdrop-filter:blur(6px); display:grid; place-items:center; }
.vn-com button.on{ background:#C9A46A; color:#3B2433; }
.vn-prog{ position:absolute; left:0; right:0; top:0; height:3px; background:rgba(255,255,255,.12); z-index:6; }
.vn-prog i{ display:block; height:100%; width:0; background:#C9A46A; transition:width .3s; }
.vn-scena{ position:absolute; left:0; right:0; bottom:0; top:0; pointer-events:none; }
.sagoma{ position:absolute; bottom:calc(var(--box,190px) - 6px); width:min(46vw,300px); height:min(calc(100vh - var(--box,190px) - 90px),440px); transition:opacity .45s ease, transform .45s ease; opacity:0; transform:translateY(16px); }
.sagoma.on{ opacity:1; transform:none; }
.sagoma.sx{ left:4%; } .sagoma.dx{ right:4%; }
.sagoma svg{ width:100%; height:100%; display:block; filter:drop-shadow(0 10px 30px rgba(0,0,0,.45)); }
.vn-box{ position:absolute; left:10px; right:10px; bottom:calc(10px + env(safe-area-inset-bottom,0px)); z-index:5; max-width:880px; margin:0 auto; background:rgba(250,246,241,.96); color:var(--ink); border-radius:20px; padding:16px 18px 14px; box-shadow:0 14px 40px rgba(0,0,0,.4); min-height:150px; }
.vn-box .targa{ display:inline-flex; flex-direction:column; margin:-34px 0 8px; background:var(--plum); color:#fff; border-radius:12px; padding:7px 14px; box-shadow:0 6px 16px rgba(0,0,0,.25); }
.vn-box .targa b{ font-size:16.5px; } .vn-box .targa small{ font-size:11.5px; color:#E7C9CF; letter-spacing:.04em; }
.vn-box .targa.procura{ background:var(--navy); } .vn-box .targa.difesa-sempio{ background:var(--teal); } .vn-box .targa.difesa-stasi{ background:#8A6326; } .vn-box .targa.famiglia{ background:var(--ruby); } .vn-box .targa.istituzioni{ background:#4B5563; }
.vn-testo{ font-size:20px; line-height:1.45; min-height:60px; }
.vn-testo.narr{ font-family:"Cormorant Garamond",serif; font-style:italic; font-size:clamp(20px,5vw,24px); color:var(--ink); }
.vn-testo.cit{ font-family:"Cormorant Garamond",serif; font-size:clamp(22px,5.6vw,28px); line-height:1.25; color:var(--plum); font-weight:600; }
.vn-testo.cit::before{ content:"«"; } .vn-testo.cit::after{ content:"»"; }
.vn-piede{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:10px; }
.vn-piede .fonte{ font-size:12.5px; }
.vn-piede .nav{ display:flex; gap:8px; margin-left:auto; }
.vn-piede .nav button{ border:0; border-radius:12px; padding:10px 16px; font:inherit; font-weight:700; cursor:pointer; font-size:15px; }
.vn-piede .nav .ind{ background:#EFE4E7; color:var(--plum); }
.vn-piede .nav .av{ background:var(--plum); color:#fff; }
.vn-scelte{ display:flex; flex-direction:column; gap:8px; margin-top:10px; }
.vn-scelte button{ border:1px solid var(--line); background:#fff; color:var(--plum); border-radius:14px; padding:13px 16px; font:inherit; font-weight:700; font-size:16px; text-align:left; cursor:pointer; }
.vn-scelte button:hover{ border-color:var(--rose); }
.vn-scad{ display:flex; align-items:center; gap:12px; background:#4A2C3F; color:#fff; border-radius:14px; padding:12px 14px; }
.vn-scad .n{ font-family:"Cormorant Garamond",serif; font-size:40px; color:#F1D6DC; line-height:1; min-width:56px; text-align:center; }
.vn-scad .n small{ display:block; font-family:"Nunito Sans",sans-serif; font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:#D9B7C1; }
.vn-fine{ position:absolute; inset:0; z-index:7; display:none; overflow-y:auto; background:rgba(30,18,25,.92); backdrop-filter:blur(6px); padding:calc(70px + env(safe-area-inset-top,0px)) 20px 40px; }
.vn-fine.on{ display:block; }
.vn-fine .in{ max-width:680px; margin:0 auto; }
.vn-fine h3{ font-family:"Cormorant Garamond",serif; font-size:38px; margin:0 0 6px; font-weight:600; }
.vn-fine p{ color:#EBD3DA; }
.vn-fine ol{ padding-left:20px; color:#EBD3DA; font-size:14px; }
.vn-fine ol a{ color:#F1D6DC; }
.vn-fine .azioni{ display:flex; flex-wrap:wrap; gap:10px; margin:18px 0; }
.vn-tocca{ position:absolute; inset:0; z-index:4; }
.vn-inizio{ position:absolute; inset:0; z-index:8; display:flex; flex-direction:column; justify-content:flex-end; padding:0 22px calc(40px + env(safe-area-inset-bottom,0px)); background:linear-gradient(180deg,rgba(30,18,25,.2),rgba(30,18,25,.92)); }
.vn-inizio .in{ max-width:720px; margin:0 auto; width:100%; }
.vn-inizio small{ letter-spacing:.24em; text-transform:uppercase; color:#E7C9CF; font-size:11.5px; }
.vn-inizio h2{ color:#fff; font-size:clamp(38px,8vw,60px); line-height:1; margin:8px 0 8px; }
.vn-inizio p{ color:#EBD3DA; margin:0 0 18px; }
.vn-inizio .azioni{ display:flex; gap:10px; flex-wrap:wrap; }
.vn-nota{ font-size:12px; color:#D9B7C1; margin-top:14px; }
@media (min-width:900px){ .vn-box{ bottom:24px; padding:20px 24px 16px; } .sagoma{ width:300px; } }
@media (max-height:620px){ .sagoma{ height:42vh; } }

/* documentario */
.doc-t{ font-family:"Cormorant Garamond",serif; font-size:clamp(26px,6vw,40px); font-weight:600; line-height:1.08; }
