/* ============================================================
   Tema AMOLED, impostazione militare.
   Nero puro, tipografia condensata in maiuscolo, spigoli vivi,
   angoli tagliati. Il colore compare solo quando informa (recupero).
   ============================================================ */

/* DejaVu Sans Condensed, ridotto ai soli caratteri usati.
   Licenza in /fonts/LICENZA-DejaVu.txt — ridistribuzione consentita. */
@font-face{
  font-family:"Cond"; src:url("/fonts/cond-400.woff") format("woff");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Cond"; src:url("/fonts/cond-700.woff") format("woff");
  font-weight:700; font-style:normal; font-display:swap;
}

:root{
  /* Opt-out esplicito dal Force Dark del browser. La palette dell'app resta
     AMOLED perche viene definita qui, senza dipendere dal tema di sistema. */
  color-scheme:only light;
  --bg:#000; --fg:#fff;
  --g1:rgba(255,255,255,.74);
  --g2:rgba(255,255,255,.52);
  --g3:rgba(255,255,255,.18);
  --g4:rgba(255,255,255,.08);
  --rest:#e0a33c;
  --warm:#7fb2e0;
  --done:rgba(255,255,255,.92);
  --pad:22px;
  --nav-h:52px;
  --touch:44px;
  --line:1px solid var(--g3);
  --row-y:15px;
  --section-gap:28px;
  --tacca:9px;                 /* angolo tagliato dei pulsanti */
  --font:"Cond","Roboto Condensed","Arial Narrow",-apple-system,system-ui,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%; background:#000}
html,body,#app,#player,nav,dialog{background-color:#000; color:#fff}
img,video{filter:none}
body{
  background:var(--bg); color:var(--fg);
  font-family:var(--font);
  font-size:16px; line-height:1.38; -webkit-font-smoothing:antialiased;
  display:flex; justify-content:center; overscroll-behavior:none;
}
button{font:inherit; color:inherit; background:none; border:0; cursor:pointer}
button:focus-visible{outline:2px solid var(--fg); outline-offset:2px}
button:disabled{opacity:.55; cursor:not-allowed}
#app{width:100%; max-width:440px; position:relative; display:flex; flex-direction:column; min-height:100dvh}
@media(min-width:520px){ #app{border-left:1px solid var(--g3); border-right:1px solid var(--g3)} }

.num{font-variant-numeric:tabular-nums}
.eyebrow{font-size:10.5px; line-height:1.2; letter-spacing:.2em; text-transform:uppercase;
         color:var(--g2); font-weight:400}
h1{font-size:clamp(36px,9.5vw,42px); line-height:.98; font-weight:700; letter-spacing:.015em;
   text-transform:uppercase; margin:0}
h2{font-size:11px; line-height:1.2; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
   margin:var(--section-gap) 0 0; color:var(--g1); display:flex; align-items:center; gap:10px}
h2::before{content:""; width:12px; height:2px; background:var(--fg); flex:none}

.screen{flex:1; padding:0 var(--pad) calc(var(--nav-h) + 120px)}
/* Le schermate inattive devono prevalere anche sulle regole con ID
   (per esempio #s-cal { display:flex }). */
[hidden]{display:none!important}

/* La home resta entro lo schermo; la spaziatura si adatta all'altezza libera. */
#s-oggi{height:100dvh; min-height:0; overflow:hidden}
#s-oggi .row{padding-block:clamp(9px,1.55dvh,15px)}
#chiudi-sett{margin-top:clamp(8px,1.8dvh,18px)!important;
             padding:clamp(10px,1.6dvh,15px) 6px;
             white-space:nowrap; font-size:clamp(10px,3vw,13px);
             letter-spacing:.08em}
#s-oggi.home-compact .marchio{padding-top:calc(env(safe-area-inset-top) + 10px)}
#s-oggi.home-compact .top{padding:10px 0 7px}
#s-oggi.home-compact .weeks{margin:8px 0 6px}
#s-oggi.home-compact .list{margin-top:9px}
#s-oggi.home-compact .row{padding-block:7px; min-height:58px}
#s-oggi.home-compact .row .s{font-size:11px; margin-top:1px}
#s-oggi.home-compact #chiudi-sett{margin-top:8px!important; padding-block:10px}
#s-oggi.home-tight h1{font-size:30px}
#s-oggi.home-tight .row .s{display:none}
#s-oggi.home-tight .row{padding-block:5px; min-height:50px}
#s-oggi.home-tight .top{padding:7px 0 5px}
#s-oggi.home-tight .weeks{margin:5px 0 4px}

@media(max-height:760px){
  #s-oggi .marchio{padding-top:calc(env(safe-area-inset-top) + 10px)}
  #s-oggi .top{padding:12px 0 9px}
  #s-oggi h1{font-size:32px}
  #s-oggi .weeks{margin:9px 0 6px}
  #s-oggi .list{margin-top:10px}
  #s-oggi .row{padding-block:8px; min-height:58px}
  #s-oggi .row .s{font-size:11px; margin-top:1px}
  #s-oggi .cta.ghost{font-size:12px}
}

@media(max-height:650px){
  #s-oggi .row .s{display:none}
  #s-oggi .row{padding-block:7px; min-height:50px}
  #s-oggi .top{padding:8px 0 6px}
  #s-oggi .weeks{margin:6px 0 4px}
}
.top{padding:22px 0 18px}
.page-head{padding-top:calc(env(safe-area-inset-top) + 28px); padding-bottom:20px;
           border-bottom:var(--line)}
.page-head .eyebrow{margin-bottom:10px}

/* ---- marchio ---- */
.marchio{display:flex; align-items:center; gap:9px;
         padding:calc(env(safe-area-inset-top) + 20px) 0 0}
.marchio .brand-logo{width:88px; height:37px; object-fit:contain; object-position:left center; flex:none}
.marchio .ver{margin-left:auto; font-size:11px; letter-spacing:.14em; color:var(--g2);
              font-variant-numeric:tabular-nums}

/* ---- barra settimane ---- */
.weeks{display:flex; gap:4px; margin:16px 0 10px}
.weeks i{flex:1; height:3px; background:var(--g3)}
.weeks i.on{background:var(--fg)}
.weeks i.cur{height:3px; background:var(--fg)}

/* ---- lista ---- */
.list{margin-top:14px; border-top:var(--line)}
.row{display:flex; align-items:center; gap:14px; padding:var(--row-y) 2px;
     border-bottom:var(--line); width:100%; text-align:left; min-height:68px}
.row:active{background:var(--g4)}
.dot{width:12px; height:12px; border:1px solid var(--fg); background:transparent; flex:0 0 12px}
.dot.done{background:var(--fg)}
.dot.next,.dot.part{border-color:var(--fg); background:transparent}
.row .body{flex:1; min-width:0}
.row .t{display:flex; align-items:center; min-width:0; font-size:16px; font-weight:700;
        letter-spacing:.04em; text-transform:uppercase; white-space:nowrap}
.row .session-title{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.row.optional{gap:14px}
.row.optional .tag{font-size:7.5px; letter-spacing:.1em; padding:2px 4px; margin-left:6px}
@media(max-width:370px){
  .row.optional .tag{font-size:0}
  .row.optional .tag::after{content:"OPT"; font-size:6.5px; letter-spacing:.03em}
}
@media(max-width:340px){
  :root{--pad:14px}
  .row.optional .tag{display:none}
  .row.optional .s::before{content:"OPZ. · "}
}
.row .s{display:block; font-size:12px; line-height:1.3; letter-spacing:.025em; color:var(--g2); margin-top:4px}
.row .chev{color:var(--g2); font-size:18px}
.session-row{display:flex; align-items:stretch; border-bottom:1px solid var(--g3)}
.session-row .row{flex:1; min-width:0; width:auto; border:0; padding-right:0}
#s-oggi .session-row .s{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.session-open-list{display:flex; align-items:center; justify-content:center;
  flex:none; width:var(--touch); min-height:var(--touch); color:var(--g1);
  font-size:0; line-height:1; padding:0; position:relative}
.session-open-list::before{content:""; width:8px; height:8px; border-top:2px solid currentColor;
  border-right:2px solid currentColor; transform:rotate(45deg); margin-left:-4px}
.session-open-list:active{background:var(--g4); color:var(--fg)}
#s-anteprima{height:100dvh; overflow-y:auto; padding-bottom:40px}
#elenco-indietro{display:flex; align-items:center; gap:12px; min-height:var(--touch);
  padding:calc(env(safe-area-inset-top) + 14px) 0 12px;
  color:var(--g1); font-size:26px; line-height:1}
#elenco-indietro span{font-size:12px; text-transform:uppercase; letter-spacing:.16em; font-weight:700}
#elenco-settimana{margin:30px 0 10px}
#elenco-titolo{font-size:clamp(30px,8vw,40px); line-height:1.08}
#elenco-meta{color:var(--g2); font-size:12.5px; line-height:1.4; margin:12px 0 22px}
#elenco-esercizi{margin:16px 0 0; padding:0; list-style:none; counter-reset:exercise}
#elenco-esercizi li{display:grid; grid-template-columns:26px minmax(0,1fr); gap:10px;
  align-items:baseline; padding:var(--row-y) 2px; border-top:var(--line);
  font-size:16px; line-height:1.35; overflow-wrap:anywhere}
#elenco-esercizi li::before{counter-increment:exercise; content:counter(exercise, decimal-leading-zero);
  color:var(--g1); font-size:12px; font-variant-numeric:tabular-nums}
.tag{font-size:8.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--g2);
     border:1px solid var(--g3); padding:2px 6px; margin-left:8px; white-space:nowrap;
     font-weight:400; flex:none}

/* ---- pulsanti ---- */
.cta-wrap{position:fixed; bottom:calc(env(safe-area-inset-bottom) + var(--nav-h)); width:100%;
          max-width:440px; padding:26px var(--pad) 12px; z-index:5;
          background:linear-gradient(to top,#000 62%,rgba(0,0,0,0))}
.cta{width:100%; min-height:58px; padding:16px 18px; background:var(--fg); color:#000;
     font-size:15px; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
     clip-path:polygon(0 0, calc(100% - var(--tacca)) 0, 100% var(--tacca), 100% 100%, 0 100%)}
.cta:active{opacity:.72}
.cta.ghost{background:none; color:var(--fg); border:1px solid var(--g3); font-weight:700;
           margin-top:10px; letter-spacing:.16em}
.cta[disabled]{opacity:.3}

/* ---- nav ---- */
nav{position:fixed; bottom:0; width:100%; max-width:440px; display:flex; z-index:6;
    border-top:1px solid var(--g3); background:#000; padding-bottom:env(safe-area-inset-bottom)}
nav button{flex:1; min-height:var(--nav-h); color:var(--g2); font-size:9.5px; letter-spacing:.15em;
           text-transform:uppercase; font-weight:700; padding:14px 2px; position:relative}
nav button.on{color:var(--fg)}
nav button.on::before{content:""; position:absolute; top:-1px; left:22%; right:22%;
                      height:2px; background:var(--fg)}

/* ---- player ---- */
#player{position:fixed; inset:0; background:#000; z-index:20; display:flex; flex-direction:column;
        max-width:440px; margin:0 auto; padding:0 var(--pad)}
#player[hidden]{display:none}
.p-top{display:flex; align-items:center; justify-content:space-between; gap:10px;
       padding:calc(env(safe-area-inset-top) + 16px) 0 0}
.p-top .meta{flex:1; min-width:0; text-align:center; color:var(--fg); text-transform:uppercase;
             font-size:12px; letter-spacing:.08em; font-weight:700; line-height:1.25}
.p-top .meta span,.p-top .meta strong{display:block}
.p-top .meta strong{font-size:17px; letter-spacing:.035em; margin-top:3px; line-height:1.15}
.icon-btn{color:var(--fg); font-size:17px; padding:10px; line-height:1;
          border:1px solid var(--g3); flex:none}
.icon-btn.on{color:#000; background:var(--fg); border-color:var(--fg)}
#p-esci{width:48px; height:48px; padding:0; border:0; background:transparent;
        display:flex; align-items:center; justify-content:center}
#p-esci:active{opacity:.55}
.close-icon{position:relative; display:block; width:22px; height:22px}
.close-icon::before,.close-icon::after{content:""; position:absolute; left:10px; top:0;
  width:2px; height:22px; background:currentColor}
.close-icon::before{transform:rotate(45deg)}
.close-icon::after{transform:rotate(-45deg)}
.icon-btn.wake-btn,.icon-btn.wake-btn.on{width:48px; height:48px; padding:6px; border:0;
          background:transparent; display:flex; flex-direction:column;
          align-items:center; justify-content:center; gap:5px; color:var(--g2)}
.icon-btn.wake-btn.on{color:var(--fg)}
.wake-screen{display:block; width:19px; height:13px; border:1.5px solid currentColor; position:relative}
.wake-screen::before{content:""; position:absolute; width:7px; height:1.5px; background:currentColor;
                     left:4.5px; bottom:-5px}
.wake-screen::after{content:""; position:absolute; width:1.5px; height:4px; background:currentColor;
                    left:7.25px; bottom:-4px}
.wake-state{font-size:7px; line-height:1; letter-spacing:.12em; font-weight:700}
.p-progress{font-size:11px; color:var(--g1); text-transform:uppercase;
            font-weight:700; letter-spacing:.08em; text-align:center; margin-top:13px}
.bars{display:flex; align-items:center; gap:7px; min-height:6px; margin-top:13px}
.bars i{flex:1; height:3px; border:0; background:var(--g3)}
.bars i.on{height:3px; background:var(--fg)}
.bars i.cur{height:3px; background:var(--g2)}

.stage{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center}
.gif{width:min(60vw,224px); aspect-ratio:1; position:relative; overflow:hidden; flex:none;
     display:flex; align-items:center; justify-content:center; margin-bottom:16px;
     color:var(--g2); font-size:10px; letter-spacing:.2em; text-transform:uppercase}
.gif img,.gif video{width:100%; height:100%; object-fit:contain; display:none}
.gif.has-image img,.gif.has-video video{display:block}
.gif.has .ph{display:none}
.gif:not(.has){border:1px solid var(--g3)}
.ex-side{font-size:12px; letter-spacing:.24em; text-transform:uppercase; color:var(--g2);
         min-height:1.2em; font-weight:700}
.ex-name{font-size:23px; font-weight:700; letter-spacing:.04em; line-height:1.1;
         text-transform:uppercase; min-height:2.2em;
         display:flex; align-items:center; justify-content:center; padding:0 2px}
.timer{font-size:clamp(92px,30vw,138px); font-weight:700; letter-spacing:.01em; line-height:.95;
       margin:0; font-variant-numeric:tabular-nums}
.phase{font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--g2);
       min-height:1.3em; font-weight:700}
body.resting .timer, body.resting .phase{color:var(--rest)}
body.resting .ex-name{color:var(--g1)}
body.resting .gif img,body.resting .gif video{opacity:.5}
body.warming .timer, body.warming .phase{color:var(--warm)}
body.paused .timer{opacity:.42}

.upnext{border-top:1px solid var(--g3); padding:13px 0; display:flex; gap:10px; align-items:baseline}
.upnext .k{font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--g2);
           flex:none; font-weight:700}
.upnext .v{font-size:14px; letter-spacing:.06em; text-transform:uppercase; color:var(--g1);
           overflow:hidden; text-overflow:ellipsis; white-space:nowrap}

.p-ctrl{display:flex; align-items:center; justify-content:space-between; gap:8px;
        padding:4px 0 calc(env(safe-area-inset-bottom) + 20px)}
.p-ctrl .side{font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--g2);
              padding:14px 4px; font-weight:700}
.p-ctrl .play{width:74px; height:74px; border:0; padding:0; background:transparent;
              display:flex; align-items:center; justify-content:center; flex:none}
.p-ctrl .play:active{opacity:.55}
.play-icon{position:relative; display:block; width:24px; height:24px}
/* Stato in riproduzione: due barre da 7 x 24 px. */
.play.is-playing .play-icon::before,.play.is-playing .play-icon::after{
  content:""; position:absolute; top:0; width:7px; height:24px; background:currentColor
}
.play.is-playing .play-icon::before{left:2px}
.play.is-playing .play-icon::after{right:2px}
/* Stato in pausa: triangolo inscritto nello stesso riquadro 24 x 24 px. */
.play:not(.is-playing) .play-icon::before{
  content:""; position:absolute; left:4px; top:1px; width:0; height:0;
  border-top:11px solid transparent; border-bottom:11px solid transparent;
  border-left:18px solid currentColor
}
.p-toast{position:absolute; left:var(--pad); right:var(--pad); top:calc(env(safe-area-inset-top) + 76px);
         z-index:4; padding:9px 12px; background:var(--fg); color:#000; text-align:center;
         font-size:10px; font-weight:700; letter-spacing:.14em; text-transform:uppercase}

/* ---- calendario ---- */
.mese{display:flex; align-items:center; justify-content:space-between; min-height:58px;
      border-bottom:var(--line)}
.mese b{font-size:14px; font-weight:700; letter-spacing:.2em; text-transform:uppercase}
.mese button{color:var(--g1); width:var(--touch); height:var(--touch); padding:0; font-size:22px}
.cal{display:grid; grid-template-columns:repeat(7,1fr); gap:2px 0; margin-top:12px;
     flex:1; min-height:0; align-content:center}
.cal .dow{align-self:end; font-size:9.5px; letter-spacing:.14em; text-transform:uppercase;
          color:var(--g2); text-align:center; padding-bottom:8px; font-weight:700}
.cal .g{display:flex; min-height:0; flex-direction:column; align-items:center; justify-content:center;
           padding:0; font:inherit;
        gap:3px; font-size:13px; color:var(--g1); position:relative}
.cal .g .n{width:28px; height:28px; display:flex; align-items:center; justify-content:center;
           line-height:1; font-variant-numeric:tabular-nums}
.cal .g .punti{display:flex; gap:3px; height:6px}
.cal .g.vuoto{visibility:hidden}
.cal .g.oggi .n{border:1px solid var(--g2); color:var(--fg); font-weight:700}
.cal .g b{width:6px; height:6px; background:var(--done); display:block}
.cal .g b.opz{background:none; border:1px solid var(--g2)}
.cal .g b.parz{background:var(--rest)}
.cal .g.nulla{color:var(--g2)}
.legenda{display:flex; gap:16px; flex-wrap:wrap; margin-top:12px; font-size:10.5px;
         letter-spacing:.12em; text-transform:uppercase; color:var(--g2)}
.legenda span{display:flex; align-items:center; gap:7px}
.legenda i{width:6px; height:6px; background:var(--done); display:block}
.legenda i.opz{background:none; border:1px solid var(--g2)}
.legenda i.parz{background:var(--rest)}

#s-cal{display:flex; flex-direction:column; height:100dvh;
       padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 10px); overflow:hidden}
#s-cal .top{flex:none}
#s-cal .mese, #s-cal .legenda{flex:none}

/* ---- storico / impostazioni ---- */
#s-storico{height:100dvh; overflow-y:auto; padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 24px)}
#s-storico .top{padding-bottom:20px}
.stat{display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:18px;
      border-top:var(--line); border-bottom:var(--line)}
.stat > div{min-width:0; padding:15px 10px 14px; border-left:var(--line)}
.stat > div:first-child{border-left:0}
.stat .n{font-size:28px; line-height:1; font-weight:700; letter-spacing:.01em; font-variant-numeric:tabular-nums}
.stat .l{font-size:8.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--g2); margin-top:7px}

#hist-list{margin-top:28px}
.history-week{margin-top:20px}
.history-week:first-child{margin-top:0}
.history-week-head{display:flex; align-items:flex-end; justify-content:space-between; gap:12px;
  padding:0 2px 10px; border-bottom:1px solid var(--g1)}
.history-week-title{font-size:13px; font-weight:700; letter-spacing:.15em; text-transform:uppercase}
.history-week-summary{font-size:9px; color:var(--g2); letter-spacing:.12em; text-transform:uppercase;
  text-align:right; white-space:nowrap}
.history-entry{display:grid; grid-template-columns:44px minmax(0,1fr); gap:14px; align-items:center;
  padding:14px 2px; border-bottom:var(--line)}
.history-date{height:46px; border-left:2px solid var(--fg); display:grid; grid-template-columns:1fr 1fr;
  grid-template-rows:1fr auto; align-items:center; padding:5px 5px 4px; font-variant-numeric:tabular-nums}
.history-date b{font-size:20px; line-height:1; font-weight:700}
.history-date span{font-size:8px; letter-spacing:.08em; color:var(--g1); text-align:right}
.history-date small{grid-column:1/-1; font-size:7px; letter-spacing:.16em; color:var(--g2);
  text-transform:uppercase; font-weight:700}
.history-body{min-width:0}
.history-session{display:flex; align-items:center; justify-content:space-between; gap:8px}
.history-session > span{font-size:10px; color:var(--g1); letter-spacing:.14em; text-transform:uppercase;
  font-weight:700}
.history-status{font-style:normal; font-size:7.5px; color:var(--g2); letter-spacing:.12em;
  text-transform:uppercase; white-space:nowrap}
.history-status.interrotta{color:var(--rest)}
.history-name{display:block; margin-top:3px; font-size:15px; line-height:1.15; letter-spacing:.05em;
  text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.history-meta{margin-top:5px; font-size:10px; color:var(--g2); letter-spacing:.1em; text-transform:uppercase}
.item{padding:var(--row-y) 2px; border-bottom:var(--line); display:flex; min-height:64px;
      justify-content:space-between; align-items:center; gap:14px; width:100%; text-align:left}
.item > span:first-child{flex:1; min-width:0}
.item .l{display:block; font-size:14px; letter-spacing:.055em; text-transform:uppercase; font-weight:700}
.item .sub{display:block; font-size:12px; color:var(--g2); margin-top:3px; line-height:1.35;
           letter-spacing:.02em}
.item .r{font-size:12px; color:var(--g2); text-align:right; flex:none; letter-spacing:.06em;
         text-transform:uppercase}
.sw{width:42px; height:22px; border:1px solid var(--g2); background:transparent;
    position:relative; flex:none; transition:background .16s,border-color .16s}
.sw::after{content:""; position:absolute; top:3px; left:3px; width:14px; height:14px;
           background:var(--fg); transition:transform .16s}
.sw.on{background:rgba(255,255,255,.9)}
.sw.on::after{transform:translateX(20px); background:#000}
.backup-stato{padding:12px 2px; color:var(--g1); font-size:12px; line-height:1.4;
              border-bottom:1px solid var(--g3)}
@media(max-height:600px){
  #player{overflow-y:auto}
  #player .stage{flex:none; padding:10px 0}
  #player .gif{width:min(35vh,180px); margin-bottom:8px}
  #player .timer{font-size:clamp(64px,20vh,100px)}
}
@media(max-width:360px){.p-top .meta strong{font-size:15px}.p-progress{font-size:11px}}
@media(prefers-reduced-motion:reduce){.sw,.sw::after{transition:none}}
.nota{font-size:11.5px; color:var(--g2); line-height:1.6; margin-top:14px; letter-spacing:.03em}
.nota.warn{color:var(--rest)}

/* ---- dialoghi ---- */
dialog{border:1px solid var(--g1); background:#000; color:var(--fg); width:min(92vw,400px);
       padding:24px 22px; font:inherit; border-radius:0}
dialog::backdrop{background:rgba(0,0,0,.85)}
dialog h3{margin:0 0 10px; font-size:19px; font-weight:700; letter-spacing:.08em; text-transform:uppercase}
dialog p{margin:0 0 18px; font-size:14px; color:var(--g1); line-height:1.5}
dialog .azioni{display:flex; flex-direction:column; gap:8px}
dialog .azioni button{width:100%; padding:15px; font-size:13px; font-weight:700;
                      letter-spacing:.16em; text-transform:uppercase;
                      clip-path:polygon(0 0, calc(100% - var(--tacca)) 0, 100% var(--tacca), 100% 100%, 0 100%)}
dialog .azioni .primario{background:var(--fg); color:#000}
dialog .azioni .secondario{border:1px solid var(--g3); color:var(--fg)}
dialog .azioni .pericolo{border:1px solid var(--rest); color:var(--rest)}
dialog .giorno{border-top:1px solid var(--g3); margin-bottom:16px;
              max-height:50dvh; overflow-y:auto}
dialog .giorno-entry{border-bottom:1px solid var(--g3); padding-bottom:8px}
dialog .giorno .item{padding:13px 0 3px; border:0}
dialog .giorno .delete-session{width:auto; padding:8px 2px; clip-path:none;
  color:var(--rest); font-size:11px; letter-spacing:.08em; text-align:left;
  min-height:36px}

/* ---- avviso ---- */
.avviso{border:var(--line); border-left:2px solid var(--fg); padding:15px; margin-top:18px;
        clip-path:polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%)}
.avviso .t{font-size:13px; font-weight:700; letter-spacing:.14em; text-transform:uppercase}
.avviso .s{font-size:12.5px; color:var(--g2); margin-top:5px; letter-spacing:.03em}
.avviso .azioni{display:flex; gap:8px; margin-top:13px}
.avviso .azioni button{flex:1; padding:12px; font-size:12px; font-weight:700;
                       letter-spacing:.14em; text-transform:uppercase}
.avviso .azioni .primario{background:var(--fg); color:#000}
.avviso .azioni .secondario{border:1px solid var(--g3)}

.vuoto{color:var(--g2); font-size:12.5px; padding:26px 0; text-align:center;
       letter-spacing:.14em; text-transform:uppercase}

/* Coerenza delle schermate scorrevoli e degli stati interattivi. */
#s-anteprima,#s-storico,#s-set{scrollbar-width:none}
#s-anteprima::-webkit-scrollbar,#s-storico::-webkit-scrollbar,#s-set::-webkit-scrollbar{display:none}
#s-set{height:100dvh; overflow-y:auto;
       padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 28px)}
button:active{opacity:.64}
.row:active,.item:active,.session-open-list:active{background:var(--g4); opacity:1}