/* Pubblica Facile — stile Windows 11 / Fluent (base PriceScope): fondo Mica tinto berry, superfici satinate, accento unico */
:root{
  --acc:#A3195B;
  --acc-ink:color-mix(in oklab,var(--acc) 82%,#000);
  --acc-soft:color-mix(in oklab,var(--acc) 12%,transparent);
  --fondo:#F7F2F5; --fondo2:#EFE6EB;
  --sup:rgba(255,255,255,.76); --sup-pieno:#fffdfe; --sup2:rgba(255,255,255,.52);
  --bordo:rgba(48,20,34,.11); --bordo-forte:rgba(48,20,34,.22);
  --ink:#22161c; --ink2:#4d3d45; --ink3:#6a5862;
  --ok:#0f7b3f; --warn:#9a5b00; --ko:#b42318;
  --r:8px; --r-l:12px;
  --ombra1:0 1px 2px rgba(40,10,25,.06),0 2px 6px rgba(40,10,25,.05);
  --ombra2:0 2px 4px rgba(40,10,25,.06),0 12px 30px rgba(40,10,25,.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:#1C1719; --fondo2:#231c1f;
  --sup:rgba(44,36,40,.74); --sup-pieno:#2a2226; --sup2:rgba(52,42,47,.52);
  --bordo:rgba(245,225,235,.10); --bordo-forte:rgba(245,225,235,.2);
  --ink:#f3eaee; --ink2:#cdbcc4; --ink3:#a8949e;
  --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:#1C1719; --fondo2:#231c1f;
  --sup:rgba(44,36,40,.74); --sup-pieno:#2a2226; --sup2:rgba(52,42,47,.52);
  --bordo:rgba(245,225,235,.10); --bordo-forte:rgba(245,225,235,.2);
  --ink:#f3eaee; --ink2:#cdbcc4; --ink3:#a8949e;
  --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}
.foglio{margin:0;width:100%;display:grid;place-items:center}
.foglio img{display:block;width:100%;height:auto;border-radius:6px;box-shadow:var(--ombra2);background:var(--sup2)}
.foglio[data-formato="storia"] img{width:auto;max-width:100%;max-height:76vh}
.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}
  .foglio img{max-width:440px}
  .foglio[data-formato="storia"] img{max-height:70vh}
}
@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}
