/* My Brochure — stile Windows 11 / Fluent (base Pubblica Facile): fondo tinto blu carta, superfici satinate, accento unico */
:root{
  --acc:#1F5C99;
  --acc-ink:color-mix(in oklab,var(--acc) 82%,#000);
  --acc-soft:color-mix(in oklab,var(--acc) 12%,transparent);
  --fondo:#F3F5F8; --fondo2:#E7ECF2;
  --sup:rgba(255,255,255,.76); --sup-pieno:#fdfefe; --sup2:rgba(255,255,255,.52);
  --bordo:rgba(20,32,48,.11); --bordo-forte:rgba(20,32,48,.22);
  --ink:#16202b; --ink2:#3d4a58; --ink3:#5b6876;
  --ok:#0f7b3f; --warn:#9a5b00; --ko:#b42318;
  --r:8px; --r-l:12px;
  --ombra1:0 1px 2px rgba(10,25,40,.06),0 2px 6px rgba(10,25,40,.05);
  --ombra2:0 2px 4px rgba(10,25,40,.06),0 12px 30px rgba(10,25,40,.12);
  --font:"Segoe UI Variable Text","Segoe UI Variable","Segoe UI",system-ui,-apple-system,"Helvetica Neue",sans-serif;
  --font-d:"Segoe UI Variable Display","Segoe UI Variable","Segoe UI",system-ui,-apple-system,sans-serif;
  color-scheme:light;
}
:root[data-tema="scuro"]{
  --fondo:#161a1f; --fondo2:#1c2128;
  --sup:rgba(36,41,48,.74); --sup-pieno:#232931; --sup2:rgba(42,48,56,.52);
  --bordo:rgba(225,235,245,.10); --bordo-forte:rgba(225,235,245,.2);
  --ink:#edf1f5; --ink2:#bfc8d2; --ink3:#97a3b0;
  --acc-ink:color-mix(in oklab,var(--acc) 50%,#fff);
  --ok:#5ccf8e; --warn:#f0b54a; --ko:#ff8a7a;
  --ombra1:0 1px 2px rgba(0,0,0,.3); --ombra2:0 2px 6px rgba(0,0,0,.3),0 12px 30px rgba(0,0,0,.35);
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){:root:not([data-tema="chiaro"]){
  --fondo:#161a1f; --fondo2:#1c2128;
  --sup:rgba(36,41,48,.74); --sup-pieno:#232931; --sup2:rgba(42,48,56,.52);
  --bordo:rgba(225,235,245,.10); --bordo-forte:rgba(225,235,245,.2);
  --ink:#edf1f5; --ink2:#bfc8d2; --ink3:#97a3b0;
  --acc-ink:color-mix(in oklab,var(--acc) 50%,#fff);
  --ok:#5ccf8e; --warn:#f0b54a; --ko:#ff8a7a;
  --ombra1:0 1px 2px rgba(0,0,0,.3); --ombra2:0 2px 6px rgba(0,0,0,.3),0 12px 30px rgba(0,0,0,.35);
  color-scheme:dark;
}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:17px/1.5 var(--font);color:var(--ink);background:var(--fondo);
  background-image:radial-gradient(120% 80% at 0% 0%,color-mix(in oklab,var(--acc) 14%,var(--fondo)) 0,transparent 60%),radial-gradient(90% 70% at 100% 100%,var(--fondo2) 0,transparent 70%);
  background-attachment:fixed;min-height:100vh}
::selection{background:color-mix(in oklab,var(--acc) 30%,transparent);color:inherit}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:4px}
a{color:var(--acc-ink);text-underline-offset:3px}
h1,h2,h3{font-family:var(--font-d);line-height:1.2;margin:0;text-wrap:balance}
h1{font-size:clamp(1.65rem,1.25rem + 1.6vw,2.4rem);font-weight:650;letter-spacing:-.02em}
h2{font-size:1.15rem;font-weight:620;display:flex;align-items:center;gap:8px}
h2 .ico{color:var(--acc-ink)}
p{margin:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ico{flex:none}
[hidden]{display:none!important}
*{scrollbar-width:thin;scrollbar-color:var(--bordo-forte) transparent}

/* guscio */
.demo-bar,.avviso-bar{background:var(--acc);color:#fff;text-align:center;font-size:.88rem;padding:6px 12px}
.avviso-bar{background:var(--ink);color:var(--fondo)}
.demo-bar a{color:#fff;font-weight:600}
.shell{display:grid;grid-template-columns:232px 1fr;min-height:100vh}
.nav{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:2px;padding:14px 10px;
  background:color-mix(in oklab,var(--sup) 60%,transparent);backdrop-filter:blur(30px) saturate(1.4);-webkit-backdrop-filter:blur(30px) saturate(1.4);border-right:1px solid var(--bordo)}
.marchio{display:flex;align-items:center;gap:10px;padding:6px 10px 16px;color:var(--ink);text-decoration:none;font:650 1.05rem var(--font-d)}
.nav-v{position:relative;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:6px;color:var(--ink);text-decoration:none;font:inherit;font-size:.95rem;background:none;border:0;cursor:pointer;text-align:left;transition:background .15s}
.nav-v:hover{background:var(--sup2)}
.nav-v[aria-current]{background:var(--sup);box-shadow:var(--ombra1)}
.nav-v[aria-current]::before{content:"";position:absolute;left:0;top:50%;width:3px;height:16px;margin-top:-8px;border-radius:3px;background:var(--acc)}
.nav-tema{margin-top:auto;color:var(--ink2)}
.main{padding:28px clamp(16px,3vw,40px) 24px;min-width:0;max-width:1240px}
.piede{margin-top:40px;padding-top:16px;border-top:1px solid var(--bordo);color:var(--ink3);font-size:.85rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px}
.piede a,.link{color:var(--ink2)}
.link{background:none;border:0;padding:0;font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.piede-admin{margin-top:8px;padding-top:0;border:0;justify-content:center}
.piede-admin a{color:var(--ink3)}

/* superfici e controlli */
.pannello{background:var(--sup);backdrop-filter:blur(24px) saturate(1.3);-webkit-backdrop-filter:blur(24px) saturate(1.3);border:1px solid var(--bordo);border-radius:var(--r-l);box-shadow:var(--ombra1);padding:20px}
.testa{margin-bottom:20px;max-width:62ch}
.testa p{margin-top:8px;color:var(--ink2)}
.aiuto{color:var(--ink3);font-size:.88rem}
.vuoto{color:var(--ink3)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:8px 18px;border-radius:6px;border:1px solid var(--bordo-forte);background:var(--sup-pieno);color:var(--ink);font:500 1rem var(--font);cursor:pointer;text-decoration:none;box-shadow:0 1px 0 rgba(0,0,0,.04);transition:background .12s,transform .12s}
.btn:hover{background:color-mix(in oklab,var(--sup-pieno) 90%,var(--ink))}
.btn:active{transform:translateY(1px)}
.btn-p{background:var(--acc);border-color:color-mix(in oklab,var(--acc) 70%,#000);color:#fff}
.btn-p:hover{background:color-mix(in oklab,var(--acc) 88%,#000)}
.btn[disabled]{opacity:.55;cursor:progress}
.btn-sm{min-height:40px;padding:6px 12px;font-size:.92rem}
.btn-grande{min-height:56px;font-size:1.1rem;font-weight:600;padding-inline:28px}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=password],textarea,select{
  width:100%;min-height:48px;font:inherit;color:var(--ink);background:var(--sup-pieno);border:1px solid var(--bordo-forte);border-bottom:2px solid color-mix(in oklab,var(--ink) 35%,transparent);border-radius:6px;padding:10px 12px;transition:border-color .12s}
input:focus,textarea:focus,select:focus{outline:none;border-bottom-color:var(--acc)}
textarea{resize:vertical;min-height:96px;line-height:1.45}
::placeholder{color:var(--ink3);opacity:1}
.campo{display:grid;gap:5px;font-size:.92rem;color:var(--ink2)}
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{font:600 1rem var(--font-d);padding:0;margin-bottom:10px;color:var(--ink)}
.consenso{display:flex;gap:10px;align-items:center;font-size:.95rem;color:var(--ink2);min-height:40px;cursor:pointer}
.consenso input{width:20px;height:20px;accent-color:var(--acc);flex:none}
.riga-azioni{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin-top:12px}
.riga-input{display:grid;grid-template-columns:1fr auto;gap:8px}

/* chips e schede */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chk{position:relative;cursor:pointer}
.chk input{position:absolute;opacity:0;pointer-events:none}
.chk span{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:8px 16px;border-radius:99px;border:1px solid var(--bordo-forte);background:var(--sup2);font-size:.95rem;color:var(--ink2);transition:all .15s;white-space:nowrap}
.chk:hover span{color:var(--ink);border-color:var(--ink3)}
.chk:has(:checked) span{background:var(--acc);border-color:var(--acc);color:#fff}
.chk:has(:focus-visible){outline:2px solid var(--acc);outline-offset:2px;border-radius:99px}
.schede{display:inline-flex;flex-wrap:wrap;gap:2px;padding:3px;margin-bottom:12px;border-radius:8px;background:var(--sup2);border:1px solid var(--bordo)}
.schede button,.schede a{display:flex;align-items:center;gap:8px;border:0;background:none;color:var(--ink2);font:500 .93rem var(--font);min-height:40px;padding:6px 14px;border-radius:6px;cursor:pointer;text-decoration:none}
.schede [aria-selected="true"],.schede a[aria-current]{background:var(--sup-pieno);color:var(--ink);box-shadow:var(--ombra1)}

/* crea */
.crea{max-width:760px}
.crea-form{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
.guida{margin-bottom:20px;display:grid;gap:12px;justify-items:start}
.guida ol{margin:0;padding-left:22px;display:grid;gap:6px;color:var(--ink2)}
.guida b{color:var(--ink)}
.campo-grande>span{font:600 1rem var(--font-d);color:var(--ink)}
.campo-grande textarea{font-size:1.1rem;min-height:110px}
.extra{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.extra:not(:has(.campo:not([hidden]))){display:none}
.foto-riga{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}
.foto-btn{position:relative;display:grid;place-items:center;width:100%;min-height:150px;border-radius:var(--r-l);border:2px dashed color-mix(in oklab,var(--acc) 45%,var(--bordo-forte));background:var(--acc-soft);cursor:pointer;overflow:hidden;transition:border-color .15s}
.foto-btn:hover{border-color:var(--acc)}
.foto-btn:has(:focus-visible){outline:2px solid var(--acc);outline-offset:2px}
.foto-btn input{position:absolute;opacity:0;width:1px;height:1px}
.foto-vuota{display:grid;justify-items:center;gap:4px;text-align:center;padding:16px;color:var(--acc-ink)}
.foto-vuota b{font-size:1.08rem;color:var(--ink)}
.foto-vuota small{color:var(--ink3);font-size:.88rem}
.foto-btn.piena{border-style:solid;min-height:0;width:auto;background:none}
.foto-btn.piena .foto-vuota{display:none}
.foto-btn img{display:block;max-height:240px;max-width:100%;object-fit:contain}
.attivita{padding:0}
.attivita summary{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:14px 16px;cursor:pointer;list-style:none;min-height:64px}
.attivita summary::-webkit-details-marker{display:none}
.att-ico{display:grid;place-items:center;width:40px;height:40px;border-radius:8px;background:var(--acc-soft);color:var(--acc-ink)}
.att-testo{display:grid;min-width:0}
.att-testo small{color:var(--ink3);font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att-apri{color:var(--acc-ink);font-size:.92rem;font-weight:600}
.attivita[open] .att-apri{visibility:hidden}
.att-campi{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:4px 16px 18px;border-top:1px solid var(--bordo);padding-top:16px}
.att-campi .consenso{grid-column:1/-1}
.colore-riga{grid-template-columns:1fr auto;align-items:center}
.colore-riga>span{grid-column:1/-1}
.colore-riga input[type=color]{width:56px;height:44px;border:1px solid var(--bordo-forte);border-radius:6px;padding:2px;background:var(--sup-pieno);cursor:pointer}
.logo-riga{display:flex;align-items:center;gap:10px}
.logo-riga img{height:44px;max-width:120px;object-fit:contain;border-radius:4px;background:#fff;border:1px solid var(--bordo)}
.crea-azione{display:grid;gap:6px;justify-items:start}

/* attesa */
.attesa{display:grid;justify-items:center;text-align:center;gap:14px;padding:60px 16px}
.attesa-foglio{position:relative;width:150px;height:188px;border-radius:10px;background:var(--sup-pieno);box-shadow:var(--ombra2);overflow:hidden;border:1px solid var(--bordo)}
.attesa-foglio i{position:absolute;left:16px;right:16px;height:14px;border-radius:4px;background:linear-gradient(90deg,var(--acc-soft) 0,color-mix(in oklab,var(--acc) 30%,transparent) 50%,var(--acc-soft) 100%);background-size:200% 100%;animation:luccica 1.4s linear infinite}
.attesa-foglio i:nth-child(1){top:20px;height:60px}
.attesa-foglio i:nth-child(2){top:96px;right:40px}
.attesa-foglio i:nth-child(3){top:122px;right:70px}
@keyframes luccica{to{background-position:-200% 0}}

/* risultato */
.ris-testa{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.ris-griglia{display:grid;grid-template-columns:minmax(0,460px) minmax(0,1fr);gap:24px;align-items:start}
.anteprima{position:sticky;top:16px;display:grid;gap:8px;justify-items:center}
.anteprima .schede{justify-self:stretch;display:flex}
.anteprima .schede button{flex:1;justify-content:center}
.pubblica{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;min-width:0}
.social{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.soc{display:grid;gap:6px;justify-items:center;align-content:start;padding:10px 6px 8px;border-radius:var(--r-l);border:1px solid var(--bordo);background:var(--sup);cursor:pointer;font:inherit;color:var(--ink);transition:border-color .15s,transform .15s,box-shadow .15s;min-height:48px}
.soc:hover{border-color:var(--acc);box-shadow:var(--ombra1)}
.soc:active{transform:scale(.97)}
.soc b{font-size:.86rem;font-weight:600;text-align:center;line-height:1.2}
.cornice{display:block;height:88px;aspect-ratio:4/5;border-radius:5px;overflow:hidden;background:var(--sup2);border:1px solid var(--bordo)}
.soc-quadrato .cornice{aspect-ratio:1}
.soc-storia .cornice{aspect-ratio:9/16}
.cornice img{width:100%;height:100%;object-fit:cover;display:block}
.testi{display:grid;gap:10px;margin-top:6px}
.testi-testa{display:flex;justify-content:space-between;align-items:center;gap:10px}
.fonte{font-size:.8rem;color:var(--acc-ink);background:var(--acc-soft);padding:3px 10px;border-radius:99px}
.fonte:empty{display:none}
.testi .schede{margin:0}
.testi textarea{min-height:190px;font-size:.98rem}
.ritocca,.altro{margin-top:24px;display:grid;gap:14px}
.rit-griglia{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tavolozze{display:flex;flex-wrap:wrap;gap:10px}
.tav{position:relative;display:grid;justify-items:center;gap:4px;cursor:pointer;width:72px}
.tav input{position:absolute;opacity:0}
.tav span{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--a) 0 55%,var(--b) 55% 100%);border:2px solid var(--bordo-forte);box-shadow:var(--ombra1)}
.tav small{font-size:.72rem;color:var(--ink3);text-align:center;line-height:1.2}
.tav:has(:checked) span{outline:3px solid var(--acc);outline-offset:2px}
.tav:has(:focus-visible) span{outline:3px solid var(--ink);outline-offset:2px}
.link-riga input{font-size:.9rem}

/* i miei volantini */
.miei{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.mio{display:grid;text-decoration:none;color:var(--ink);border-radius:var(--r-l);overflow:hidden;background:var(--sup);border:1px solid var(--bordo);box-shadow:var(--ombra1);transition:border-color .15s}
.mio:hover{border-color:var(--acc)}
.mio img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;display:block}
.mio span{display:grid;gap:2px;padding:10px 12px}
.mio b{font-size:.95rem;line-height:1.3}
.mio small{color:var(--ink3);font-size:.8rem}

/* pagine di lettura, funzioni, admin */
.leggi{max-width:72ch;display:grid;gap:14px}
.leggi h2{margin-top:14px}
.leggi p,.leggi li{color:var(--ink2)}
.leggi ul{margin:0;padding-left:20px;display:grid;gap:6px}
.funz{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px 28px}
.funz div{padding:12px 0;border-top:1px solid var(--bordo)}
.funz b{display:flex;gap:8px;align-items:center;margin-bottom:4px}
.funz b .ico{color:var(--acc-ink)}
.funz p{font-size:.95rem}
.dati-brevi{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.dato{padding:12px 14px;border-radius:var(--r);background:var(--sup);border:1px solid var(--bordo)}
.dato span{display:block;font-size:.8rem;color:var(--ink3)}
.dato b{font:650 1.4rem var(--font-d);font-variant-numeric:tabular-nums}
.tabella{width:100%;border-collapse:collapse;font-size:.9rem;font-variant-numeric:tabular-nums}
.tabella th{font-weight:600;color:var(--ink3);font-size:.78rem;text-align:left;padding:4px 10px 6px 0}
.tabella td{padding:8px 10px 8px 0;border-top:1px solid var(--bordo);text-align:left;vertical-align:middle}
.voci-testa{display:flex;justify-content:space-between;align-items:center;gap:10px}
.adm-vol{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.adm-vol .mio form{display:flex;gap:6px;padding:0 12px 12px}
.due{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.condividi-pag{max-width:560px;display:grid;gap:16px;margin-inline:auto;text-align:center;justify-items:center}
.condividi-pag img{width:100%;height:auto;border-radius:8px;box-shadow:var(--ombra2)}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--sup-pieno);color:var(--ink);border:1px solid var(--bordo-forte);border-radius:var(--r);padding:12px 18px;box-shadow:var(--ombra2);z-index:50;max-width:min(92vw,520px);font-size:.95rem}

/* telefono: barra in basso, pulsante Crea fisso */
@media (max-width:900px){
  .shell{grid-template-columns:1fr}
  .nav{position:fixed;top:auto;bottom:0;left:0;right:0;height:auto;z-index:20;flex-direction:row;justify-content:space-around;padding:6px 4px calc(6px + env(safe-area-inset-bottom));border-right:0;border-top:1px solid var(--bordo);background:color-mix(in oklab,var(--sup-pieno) 88%,transparent)}
  .marchio{display:none}
  .nav-v{flex-direction:column;gap:2px;padding:6px 4px;font-size:.72rem;flex:1;text-align:center;min-width:0;min-height:52px;justify-content:center}
  .nav-v span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .nav-v[aria-current]{box-shadow:none;background:var(--acc-soft)}
  .nav-v[aria-current]::before{left:50%;top:0;width:18px;height:3px;margin:0 0 0 -9px}
  .nav-tema{margin-top:0}
  .main{padding:18px 14px 96px}
  .toast{bottom:calc(84px + env(safe-area-inset-bottom))}
  .crea-azione{position:sticky;bottom:calc(68px + env(safe-area-inset-bottom));z-index:15;justify-items:stretch;padding:10px;margin:0 -10px;border-radius:var(--r-l);background:color-mix(in oklab,var(--fondo) 88%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
  .crea-azione .aiuto{text-align:center}
  .scorri{flex-wrap:nowrap;overflow-x:auto;margin:0 -14px;padding:2px 14px 6px;scroll-snap-type:x proximity}
  .scorri .chk{scroll-snap-align:start}
  .ris-griglia{grid-template-columns:1fr}
  .anteprima{position:static}
}
@media (max-width:560px){
  .att-campi,.rit-griglia,.due{grid-template-columns:1fr}
  .social{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .cornice{height:72px}
  .soc b{font-size:.76rem}
  .riga-input{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* versione Play, segnalazioni, elimina */
.app-play .solo-web{display:none!important}
.mio-riga{position:relative}
.mio-elimina{position:absolute;top:8px;right:8px;background:var(--sup,#fff);border:1px solid var(--bordo);border-radius:999px;padding:6px;line-height:0;color:var(--ink2);cursor:pointer}
.mio-elimina:hover{color:var(--ko,#b42318)}
.segnala-link{margin-top:6px;font-size:.85rem}
dialog.segnala{border:1px solid var(--bordo);border-radius:14px;padding:18px;max-width:420px;width:calc(100% - 32px);background:var(--sup,#fff);color:inherit}
dialog.segnala::backdrop{background:rgba(0,0,0,.45)}
dialog.segnala form{display:grid;gap:10px}

/* ===== My Brochure ===== */
.occhiello{font-size:.85rem;font-weight:650;text-transform:uppercase;letter-spacing:.12em;color:var(--acc-ink);margin-bottom:10px}
.eroe{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:32px;align-items:center;padding:8px 0 24px}
.eroe h1{font-size:clamp(2rem,1.3rem + 2.6vw,3.3rem);letter-spacing:-.03em}
.eroe-sotto{margin-top:14px;font-size:1.12rem;color:var(--ink2);max-width:56ch}
.eroe .riga-azioni{margin:22px 0 10px}
.eroe-libro{display:grid;place-items:center;min-height:260px}
.mini-libro{position:relative;width:min(340px,80%);aspect-ratio:2/1.41;perspective:1200px}
.mini-libro span{position:absolute;top:0;width:50%;height:100%;border-radius:4px;box-shadow:var(--ombra2)}
.ml-sx{left:0;background:linear-gradient(160deg,color-mix(in oklab,var(--acc) 80%,#fff),var(--acc))}
.ml-dx,.ml-gira{left:50%;background-color:var(--sup-pieno);background-image:linear-gradient(var(--acc-soft),var(--acc-soft)),repeating-linear-gradient(180deg,transparent 0 14px,color-mix(in oklab,var(--ink) 9%,transparent) 14px 18px);background-size:70% 34%,70% 40%;background-position:50% 14%,50% 82%;background-repeat:no-repeat}
.ml-gira{transform-origin:left center;animation:giraMini 4.5s ease-in-out infinite;backface-visibility:hidden}
@keyframes giraMini{0%,35%{transform:rotateY(0)}60%,100%{transform:rotateY(-180deg)}}
.due-vie{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.via{display:grid;gap:8px;align-content:start}
.via p{color:var(--ink2)}
.via-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:12px;background:var(--acc-soft);color:var(--acc-ink)}
.via-btn{font:inherit;color:var(--ink);text-align:left;cursor:pointer;min-height:180px;transition:border-color .15s,transform .15s,box-shadow .15s}
.via-btn:hover{border-color:var(--acc);box-shadow:var(--ombra2)}
.via-btn:active{transform:scale(.99)}
.via-btn b{font:650 1.2rem var(--font-d)}
.via-btn>span:last-child{color:var(--ink2);font-size:.95rem}
.modulo{display:grid;gap:14px}
.trappola{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.errore,.ko{color:var(--ko)}
.pannello.errore{border-color:color-mix(in oklab,var(--ko) 40%,var(--bordo))}
.pannello.ok{border-color:color-mix(in oklab,var(--ok) 40%,var(--bordo));color:var(--ink)}
.piano-bar{background:color-mix(in oklab,var(--warn) 18%,var(--fondo));color:var(--ink);text-align:center;font-size:.9rem;padding:7px 12px}
.piano-bar.scaduto{background:color-mix(in oklab,var(--ko) 16%,var(--fondo))}
.piano-bar a{font-weight:650}
.piano-azioni{margin-top:14px}
.btn-ko{background:var(--ko);border-color:var(--ko);color:#fff}
.vuoto-grande{display:grid;justify-items:center;text-align:center;gap:12px;padding:48px 20px;color:var(--ink2)}
.vuoto-grande>.ico{color:var(--acc-ink)}
.elenco-br{display:grid;gap:14px}
.br{display:grid;grid-template-columns:150px minmax(0,1fr);gap:20px;align-items:start}
.br-cop{display:grid;place-items:center;aspect-ratio:1/1.41;border-radius:6px;overflow:hidden;background:var(--c);box-shadow:var(--ombra2);text-decoration:none;color:#fff;font:700 3rem var(--font-d)}
.br-cop img{width:100%;height:100%;object-fit:cover}
.br-info{display:grid;gap:8px;min-width:0}
.br-numeri{display:flex;flex-wrap:wrap;gap:6px 18px;color:var(--ink2);font-size:.95rem}
.br-numeri b{font:650 1.25rem var(--font-d);color:var(--ink);font-variant-numeric:tabular-nums}
.br-grafico{width:100%;max-width:420px;height:40px;fill:var(--acc)}
.br .riga-azioni{margin-top:4px}
.br form{display:inline}
dialog.finestra{border:1px solid var(--bordo);border-radius:14px;padding:20px;max-width:760px;width:calc(100% - 24px);background:var(--sup-pieno);color:var(--ink);box-shadow:var(--ombra2)}
dialog.finestra::backdrop{background:rgba(0,0,0,.5)}
.cond-griglia{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;margin-top:14px}
.cond-qr{display:grid;gap:10px;justify-items:center}
.cond-qr svg{border-radius:8px;border:1px solid var(--bordo)}
.cond-vie{display:grid;gap:14px;align-content:start}
.cond-vie input{font-size:.88rem}
.zona{min-height:190px}
.zona.sopra{border-color:var(--acc);background:color-mix(in oklab,var(--acc) 20%,transparent)}
.zona.piena{min-height:90px;width:100%;border-style:dashed;background:var(--acc-soft)}
.zona.piena .foto-vuota{display:grid}
.avanz{display:grid;gap:6px}
.avanz-barra{height:8px;border-radius:99px;background:var(--sup2);overflow:hidden;border:1px solid var(--bordo)}
.avanz-barra i{display:block;height:100%;width:0;background:var(--acc);transition:width .25s}
.pagine-mini{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:14px}
.pagine-mini:empty{display:none}
.pm{position:relative;margin:0;display:grid;gap:4px;cursor:grab}
.pm img{width:100%;aspect-ratio:1/1.41;object-fit:contain;background:#fff;border-radius:4px;box-shadow:var(--ombra1);border:1px solid var(--bordo)}
.pm figcaption{font-size:.78rem;color:var(--ink3);text-align:center}
.pm-az{position:absolute;top:4px;left:4px;right:4px;display:flex;justify-content:space-between;opacity:0;transition:opacity .15s}
.pm:hover .pm-az,.pm:focus-within .pm-az{opacity:1}
.pm-az button{width:30px;height:30px;border-radius:99px;border:1px solid var(--bordo-forte);background:var(--sup-pieno);color:var(--ink);cursor:pointer;font-size:1rem;line-height:1}
.pm-az button[disabled]{visibility:hidden}
@media (hover:none){.pm-az{opacity:1}}
fieldset.pannello{display:grid;gap:14px}
fieldset.pannello legend{float:left;width:100%;margin-bottom:4px;font-size:1.1rem}
.foto-riga{display:grid;grid-template-columns:2fr 1fr;gap:14px;align-items:start}
.foto-campo{display:grid;gap:6px;align-content:start}
.foto-et{font-size:.92rem;color:var(--ink2)}
.foto-campo .foto-btn{min-height:140px}
.foto-campo .foto-btn.piena{width:100%;background:var(--sup2)}
.foto-campo .foto-btn img{max-height:200px}
.foto-campo .link{justify-self:start;font-size:.88rem}
.sezioni{display:grid;gap:14px}
.sez{display:grid;gap:10px;padding:14px;border-radius:var(--r-l);border:1px solid var(--bordo);background:var(--sup2)}
.sez-testa{display:flex;justify-content:space-between;align-items:center;gap:8px}
.sez-testa span{display:flex;gap:4px}
.sez-testa .btn-sm{min-height:36px;padding:4px 10px}
.sez-piede{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.foto-btn.mini{width:auto;min-height:56px;min-width:110px;padding:0}
.foto-btn.mini .foto-vuota{padding:8px 12px}
.foto-btn.mini img{max-height:80px}
.galleria-ed{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}
.galleria-ed:empty{display:none}
.galleria-ed figure{position:relative;margin:0}
.galleria-ed img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px;display:block}
.galleria-ed button{position:absolute;top:4px;right:4px;width:28px;height:28px;border-radius:99px;border:0;background:rgba(0,0,0,.6);color:#fff;cursor:pointer}
label.btn{position:relative;justify-self:start}
.modelli{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.modello{position:relative;display:grid;gap:4px;padding:10px;border-radius:var(--r-l);border:1px solid var(--bordo);background:var(--sup2);cursor:pointer}
.modello input{position:absolute;opacity:0}
.modello:has(:checked){border-color:var(--acc);box-shadow:0 0 0 2px var(--acc)}
.modello:has(:focus-visible){outline:2px solid var(--ink);outline-offset:2px}
.modello small{color:var(--ink3);font-size:.8rem}
.mod-anteprima{display:grid;grid-template-rows:1.2fr .25fr .25fr;gap:5px;aspect-ratio:1/1.1;padding:8px;border-radius:5px;background:#fff;border:1px solid var(--bordo)}
.mod-anteprima i{border-radius:3px;background:#dfe5ec}
.mod-anteprima i:first-child{background:var(--acc)}
.mod-anteprima.mod-elegante{background:#fbf8f3}
.mod-anteprima.mod-elegante i:first-child{margin:4px;background:color-mix(in oklab,var(--acc) 60%,#ccc)}
.mod-anteprima.mod-elegante i:nth-child(2){width:60%;justify-self:center}
.mod-anteprima.mod-vivace{background:color-mix(in oklab,var(--acc) 10%,#fff)}
.mod-anteprima.mod-vivace i{border-radius:8px}
.mod-anteprima.mod-vivace i:nth-child(2){width:55%;background:var(--acc)}
@media (max-width:900px){.eroe{grid-template-columns:1fr}.eroe-libro{min-height:180px;order:-1}}
@media (max-width:640px){.due-vie,.br,.cond-griglia,.foto-riga{grid-template-columns:1fr}.br-cop{max-width:150px}.modelli{gap:8px}.modello small{display:none}}