:root {
  --ink: #1A2140;
  --muted: #5D6580;
  --line: #D5D9E2;
  --amber: #F2A900;
  --white: #FFFFFF;
  --soft: #B9BFD3;
  --band-line: #343C5E;
  --piastra: transparent;
  --riquadro: #F5F6F9;
  --errore: #B3261E;
  --crema: #FFF6DC;
  --crema-line: #F2D27A;
  --blu: #1A2140;
  --bianco: #FFFFFF;
  --band-bg: #1A2140;
  --font-legami: "Legami Titolo", "Comic Sans MS", cursive;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root[data-tema="auto"] {
    --ink: #EEF0F7; --muted: #A7AECB; --line: #333C66; --white: #141A33;
    --piastra: #F4F5F8; --piastra-pad: 8px 4px; --riquadro: #1E2647; --errore: #FF8A80; --band-bg: #0C1126; --crema: #232A4D; --crema-line: #6E5A22;
    --spento: grayscale(1) drop-shadow(0 0 1px rgba(160,170,200,.95)); --spento-op: .55; --sagoma: invert(1) hue-rotate(180deg); --pin: #F2A900;
    color-scheme: dark;
  }
}
:root[data-tema="scuro"] {
  --ink: #EEF0F7; --muted: #A7AECB; --line: #333C66; --white: #141A33;
  --piastra: #F4F5F8; --piastra-pad: 8px 4px; --riquadro: #1E2647; --errore: #FF8A80; --band-bg: #0C1126; --crema: #232A4D; --crema-line: #6E5A22;
  --spento: grayscale(1) drop-shadow(0 0 1px rgba(160,170,200,.95)); --spento-op: .55; --sagoma: invert(1) hue-rotate(180deg); --pin: #F2A900;
  color-scheme: dark;
}

@font-face {
  font-family: "Legami Titolo";
  src: url("comune/caratteri/legami-titolo.woff2") format("woff2");
  font-weight: 700;
  font-display: block;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-height: 100vh; display: flex; flex-direction: column; background: var(--white); color: var(--ink);
       font: 16px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }

#header-placeholder, #footer-placeholder { display: contents; }

.st-wrap { width: 100%; max-width: 1100px; margin: 0 auto; padding: 12px 20px 72px; }
.st-back { display: inline-block; margin: 0 0 22px; padding: 6px 0; color: var(--muted); text-decoration: none; font-size: 1.125rem; }
.st-back:hover { color: var(--ink); }
.st-percorso { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; margin: 0 0 22px; padding: 6px 0; color: var(--muted); font-size: 1rem; }
.st-percorso a { color: var(--muted); text-decoration: none; }
.st-percorso a:hover { color: var(--ink); text-decoration: underline; text-decoration-color: var(--amber); text-underline-offset: 3px; }
.st-percorso [aria-current] { color: var(--ink); font-weight: 600; }
.st-percorso .sep { color: var(--line); }
.st-titolo { margin: 0; text-align: center; font: 600 clamp(2rem, 4vw, 3rem)/1.1 "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; }
.st-titolo::after { content: ""; display: block; width: 36px; height: 3px; margin: 16px auto 0; background: var(--amber); border-radius: 2px; }
.st-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; }
.st-card { display: flex; flex-direction: column; gap: 10px; height: 100%; padding: 20px; border: 1px solid var(--line); border-radius: 16px; color: inherit; text-decoration: none; background: var(--white); transition: border-color .15s, box-shadow .15s; }
.st-card:hover, .st-card:focus-visible { border-color: var(--amber); box-shadow: 0 6px 20px rgba(242, 169, 0, .16); outline: none; }
.st-card:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.st-card h2 { margin: 0; font-size: 1.125rem; }
.st-card p { margin: 0; color: var(--muted); font-size: .9375rem; flex: 1; }
.st-apri { font-weight: 600; font-size: .9375rem; text-decoration: underline; text-decoration-color: var(--amber); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.st-btn { display: inline-block; background: var(--ink); color: var(--white); font-weight: 600; font-size: .9375rem; text-decoration: none; padding: 10px 22px; border-radius: 8px; transition: background .15s, color .15s; }
.st-btn:hover { background: var(--amber); color: var(--blu); }

.st-numeri { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 28px; margin: -18px 0 40px; text-align: center; }
.st-numeri b { display: block; font: 700 1.6rem/1.1 system-ui, -apple-system, sans-serif; }
.st-numeri span { color: var(--muted); font-size: .85rem; }
.st-sez-titolo { margin: 0 0 16px; font: 600 1.5rem/1.2 "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; }
.st-sezione { margin-bottom: 44px; }
.st-sezione-fondo { margin: 56px 0 0; }
.st-car { position: relative; }
.st-novita { list-style: none; margin: 0; padding: 4px 0 8px; display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3 * 16px) / 4); gap: 16px;
             overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.st-novita::-webkit-scrollbar { display: none; }
.st-novita li { min-width: 0; }
.st-novita li:nth-child(4n+1) { scroll-snap-align: start; }
.st-car-freccia { position: absolute; top: calc(50% - 19px); z-index: 2; width: 38px; height: 38px; padding: 0 0 3px; border: 1px solid var(--line); border-radius: 50%;
                  background: var(--white); color: var(--ink); font: 400 1.7rem/1 system-ui, sans-serif; cursor: pointer; box-shadow: 0 2px 10px rgba(0, 0, 0, .15);
                  opacity: 0; pointer-events: none; transition: opacity .2s, border-color .15s; }
.st-car-freccia.prima { left: -12px; } .st-car-freccia.dopo { right: -12px; }
@media (hover: hover) and (pointer: fine) {
  .st-car:hover .st-car-freccia, .st-car:focus-within .st-car-freccia { opacity: 1; pointer-events: auto; }
  .st-car-freccia:hover { border-color: var(--amber); }
}
.st-car-pallini { display: flex; justify-content: center; gap: 8px; margin-top: 6px; }
.st-car-pallini button { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; background: var(--line); cursor: pointer; transition: background .2s, transform .2s; }
.st-car-pallini button.attivo { background: var(--amber); transform: scale(1.3); }
.st-novita a { position: relative; display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 12px; border: 1px solid var(--line); border-radius: 14px; color: inherit; text-decoration: none; background: var(--white); transition: border-color .15s, box-shadow .15s; }
.st-novita a:hover, .st-novita a:focus-visible { border-color: var(--amber); box-shadow: 0 6px 20px rgba(242, 169, 0, .16); }
.st-novita img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; }
.st-novita strong { font-size: .95rem; }
.st-novita small { color: var(--muted); font-size: .8rem; }
.st-nuova { position: absolute; top: 10px; left: 10px; padding: 4px 7px; border-radius: 6px; background: var(--amber); color: var(--blu); font: 700 .7rem/1 system-ui, sans-serif; letter-spacing: .04em; text-transform: uppercase; }
.st-nuova.arrivo { background: var(--blu); color: #fff; }
.st-nv-data { position: absolute; top: 10px; right: 10px; max-width: calc(100% - 100px); padding: 4px 7px; border-radius: 6px; background: var(--blu); color: #fff; font: 700 .7rem/1 system-ui, sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.st-nv-data.ultimi, .st-nv-barra.ultimi i { background: #E50A15; }
.st-nv-barra { display: block; height: 5px; border-radius: 3px; background: var(--line); overflow: hidden; margin-top: 2px; }
.st-nv-barra i { display: block; height: 100%; background: var(--amber); }
.st-nv-resta { color: var(--muted); font: 500 .72rem/1.2 system-ui, sans-serif; }
@media (max-width: 600px) {
  .st-novita strong { line-height: 1.2; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.4em; }
  .st-novita small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .st-nv-data { position: static; align-self: flex-start; max-width: 100%; order: 3; }
  .st-nv-barra { order: 4; margin-top: auto; }
  .st-nv-resta { display: none; }
}
.st-passi { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; counter-reset: passo; }
.st-passi li { counter-increment: passo; position: relative; padding-left: 46px; }
.st-passi li::before { content: counter(passo); position: absolute; left: 0; top: 0; width: 34px; height: 34px; border-radius: 50%; background: var(--amber); color: var(--blu); font: 700 1rem/34px system-ui, sans-serif; text-align: center; }
.st-passi strong { display: block; margin-bottom: 2px; }
.st-passi span { color: var(--muted); font-size: .9rem; }
@media (max-width: 600px) {
  .st-novita { grid-template-rows: repeat(2, auto); grid-auto-columns: calc((100% - 10px) / 2); gap: 10px; }
  .st-numeri { gap: 8px 18px; }
  .st-numeri b { font-size: 1.3rem; }
}

:root { --pin: #141A33; }
.st-pin-hint { margin: -8px 0 14px; color: var(--muted); font-size: .85rem; }
.st-cards > li { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
.st-cards > li.st-fissata > .st-card { border-color: var(--amber); position: relative; }
.st-pin-ico, .st-cards > li.st-fissata > .st-card::after {
  background-color: var(--pin);
  -webkit-mask: var(--pin-svg) center / contain no-repeat; mask: var(--pin-svg) center / contain no-repeat;
}
:root { --pin-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16 3a1 1 0 0 1 .7 1.7L16 5.4V10l2.6 3.3a1 1 0 0 1-.8 1.7H13v5.3a1 1 0 0 1-2 0V15H6.2a1 1 0 0 1-.8-1.7L8 10V5.4l-.7-.7A1 1 0 0 1 8 3z'/%3E%3C/svg%3E"); }
.st-cards > li.st-fissata > .st-card::after { content: ""; position: absolute; top: 4px; right: 5px; width: 15px; height: 15px; transform: rotate(35deg); }
@keyframes st-schiaccia { from { transform: scale(1); } to { transform: scale(.965); } }
.st-cards > li.st-premendo > .st-card { animation: st-schiaccia .55s ease-out forwards; }
.st-cards > li.st-menu-aperto > .st-card { transform: scale(.965); border-color: var(--amber); }
.st-cards > li { position: relative; }
.st-pin-dots { display: none; }
@media (hover: hover) and (pointer: fine) {
  .st-pin-dots:not([hidden]) {
    display: grid; place-items: center; position: absolute; bottom: 14px; right: 14px; z-index: 2;
    width: 32px; height: 32px; padding: 0; cursor: pointer; color: var(--ink);
    background: var(--white); border: 1px solid var(--line); border-radius: 50%;
    opacity: .6; transition: opacity .12s, border-color .12s;
  }
  .st-cards > li:hover > .st-pin-dots, .st-cards > li:focus-within > .st-pin-dots, .st-cards > li.st-menu-aperto > .st-pin-dots { opacity: 1; }
  .st-pin-dots:hover, .st-pin-dots:focus-visible { border-color: var(--amber); outline: none; }
  .st-pin-dots:focus-visible { box-shadow: 0 0 0 2px var(--ink); }
  .st-cards > li:has(> .st-pin-dots:not([hidden])) .st-riga-apri { padding-right: 42px; }
}
.st-pin-menu {
  position: fixed; z-index: 40; min-width: 200px; max-width: min(280px, 92vw); padding: 6px;
  background: var(--white); color: var(--ink); border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 10px 30px rgba(10, 14, 30, .28); animation: st-menu-entra .12s ease-out;
}
@keyframes st-menu-entra { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }
.st-pin-menu button {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 44px; padding: 8px 12px;
  font: inherit; font-size: 1rem; color: var(--ink); text-align: left; cursor: pointer;
  background: none; border: 0; border-radius: 9px;
}
.st-pin-menu button:hover:not(:disabled), .st-pin-menu button:focus-visible { background: var(--riquadro, rgba(0, 0, 0, .06)); outline: none; }
.st-pin-menu button:disabled { opacity: .45; cursor: default; }
.st-pin-ico { flex: none; width: 20px; height: 20px; }
.st-pin-menu .toglie .st-pin-ico { opacity: .75; }
.st-pin-nota { margin: 2px 12px 8px; color: var(--muted); font-size: .8rem; line-height: 1.35; }
@media (prefers-reduced-motion: reduce) {
  .st-cards > li.st-premendo > .st-card, .st-pin-menu { animation: none; }
}

.st-riga-apri { display: flex; align-items: center; gap: 12px; }
.st-progresso { flex: 1; height: 6px; border-radius: 3px; background: var(--line); overflow: hidden; }
.st-progresso i { display: block; height: 100%; border-radius: 3px; background: var(--amber); }
.st-quanti { color: var(--muted); font-size: .8rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.st-riga-apri.finita .st-quanti { color: var(--ink); font-weight: 700; }
.st-estere-nota { height: 0; overflow: visible; margin-top: -10px; transform: translateY(1px); line-height: 1.1; text-align: right; color: var(--muted); font-size: .75rem; font-variant-numeric: tabular-nums; }

.st-top {
  position: sticky; top: 0; z-index: 15;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px;
  margin: 0; padding: 12px 20px;
  border-bottom: 1px solid var(--line); background: var(--white);
}
.st-brand { display: inline-flex; align-items: center; gap: .45em; font-size: clamp(19px, 5.4vw, 25px);    line-height: 1; color: var(--ink); text-decoration: none; }
.st-brand .mk { width: 1.55em; height: 1.55em; flex: none; }
.st-wm { font-family: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; white-space: nowrap; }
.st-clk { display: inline-block; width: .74em; height: .74em; vertical-align: -.03em; margin: 0 .03em; }

.st-ticker { overflow: hidden; background: var(--tk-sfondo, var(--amber)); color: var(--tk-testo, var(--blu)); font-size: var(--tk-dim, .9rem); font-weight: 600; }
.st-ticker-fisso .st-ticker-riga { padding: 7px 16px; text-align: center; line-height: 1.35; }
.st-ticker-riga { display: block; padding: 7px 0; color: inherit; text-decoration: none; }
.st-ticker-pista { display: inline-flex; white-space: nowrap; animation: st-scorri var(--durata, 30s) linear infinite; }
.st-ticker-pista > span { min-width: 100vw; padding-right: 3rem; box-sizing: border-box; }
a.st-ticker-riga:hover { text-decoration: underline; }
.st-ticker-riga:hover .st-ticker-pista { animation-play-state: paused; }
@keyframes st-scorri { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .st-ticker-pista { animation: none; display: block; text-align: center; overflow: hidden; text-overflow: ellipsis; padding: 0 16px; }
  .st-ticker-pista > span { min-width: 0; padding: 0; } .st-ticker-pista > span + span { display: none; }
}

.st-top nav { display: flex; gap: 20px; }
.st-top nav button {
  font: inherit; font-size: .875rem; color: var(--ink); cursor: pointer;
  background: none; border: 0; border-bottom: 2px solid transparent; padding: 6px 0;
}
.st-top nav button:hover { border-bottom-color: var(--amber); }
@media (min-width: 768px) and (pointer: fine) {
  .st-top nav { gap: 28px; }
  .st-top nav button { font-size: 1.125rem; padding: 10px 2px; }
}
.st-top :focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }

.st-band { margin-top: auto; background: var(--band-bg); color: var(--bianco); border-top: 3px solid var(--amber); padding: 22px 20px; font: .8125rem/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
.st-band-in { max-width: 1100px; margin: 0 auto; }
.st-band a { color: var(--bianco); text-underline-offset: 3px; }
.st-band a:hover { color: var(--amber); }
.st-band :focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; }
.st-band-top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px 24px; }
.st-band-nome { font: 1.125rem/1.2 "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; }
.st-band-frase { margin-top: 2px; color: var(--soft); }
.st-band-pul { display: flex; flex-wrap: wrap; gap: 10px; }
.st-band .st-pul { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border-radius: 8px; border: 1px solid #6B7396;
                   background: none; color: var(--bianco); font: inherit; font-weight: 600; font-size: .875rem; line-height: 1.2; text-decoration: none; cursor: pointer; }
.st-band .st-pul svg { width: 16px; height: 16px; flex: none; }
.st-band .st-pul:hover { border-color: var(--amber); color: var(--bianco); }
.st-band .st-pul-dona { background: var(--amber); border-color: var(--amber); color: var(--blu); }
.st-band .st-pul-dona:hover { background: var(--bianco); border-color: var(--bianco); color: var(--blu); }
.st-band-link { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 16px 0 14px; }
.st-band-legale { border-top: 1px solid var(--band-line); padding-top: 12px; color: var(--soft); font-size: .75rem; line-height: 1.55; }
.st-band-legale p { margin: 0 0 8px; }
.st-band-legale p:last-child { margin: 0; }
.st-band-legale a { color: var(--soft); }
.st-solo-tel { display: none; }
@media (max-width: 600px) {
  .st-band { text-align: center; }
  .st-band-top { flex-direction: column; }
  .st-band-pul, .st-band-link { justify-content: center; }
  .st-solo-pc { display: none; }
  .st-solo-tel { display: inline; }
  p.st-solo-tel { display: block; }
}

.st-guida { max-width: min(360px, 90vw); padding: 20px; border: 0; border-radius: 14px; color: var(--ink); background: var(--white);
            font: 1rem/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
.st-guida::backdrop { background: rgba(26, 33, 64, .55); }
.st-guida h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font-size: 1.0625rem; }
.st-guida h2 svg { width: 34px; height: 34px; flex: none; }
.st-guida ol { margin: 0; padding-left: 22px; line-height: 1.8; }
.st-guida ol svg { width: 18px; height: 18px; vertical-align: -3px; }
.st-guida form { margin: 16px 0 0; text-align: right; }
.st-guida button { padding: 8px 18px; border: 0; border-radius: 8px; background: var(--ink); color: var(--white); font: inherit; font-weight: 600; font-size: .9375rem; cursor: pointer; }
.st-guida button:hover { background: var(--amber); color: var(--blu); }

.st-account { max-width: min(400px, 92vw); }
.st-account p { margin: 0 0 10px; line-height: 1.5; }
.st-account small { color: var(--muted); }
.st-account.st-obbligo::backdrop { background: rgba(14, 18, 38, .88); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.st-account.st-obbligo .st-account-azioni { display: none; }
.st-account-azioni { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.st-account .st-secondario { background: none; color: var(--ink); border: 1px solid var(--line); }
.st-account .st-secondario:hover { background: none; border-color: var(--amber); color: var(--ink); }
.st-account .st-google { width: 100%; margin: 4px 0 0; }
.st-oppure { display: flex; align-items: center; gap: 10px; margin: 14px 0 10px !important; color: var(--muted); font-size: .8125rem; }
.st-oppure::before, .st-oppure::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.st-email { display: grid; gap: 8px; margin: 0 0 12px; text-align: left; }
.st-email select { width: 100%; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; font: inherit; background: var(--white); color: var(--ink); }
.st-campo-paese { display: grid; gap: 3px; text-align: left; justify-items: start; } .st-campo-paese small { color: var(--muted); }
.st-email input { width: 100%; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; font: inherit; font-size: 1rem; color: var(--ink); background: var(--white); }
.st-email input:focus { outline: none; border-color: var(--amber); }
.st-email-azioni { display: flex; gap: 8px; }
.st-email-azioni button { flex: 1; }
.st-account .st-link { justify-self: start; padding: 2px 0; background: none; color: var(--muted); font-weight: 400; font-size: .8125rem; text-decoration: underline; }
.st-account .st-link:hover { background: none; color: var(--ink); }
.st-account-errore { margin: 0 !important; color: var(--errore); font-size: .875rem; }
.st-account-errore.ok { color: var(--ink); }

body.st-semplice { line-height: 1.6; }
.st-testo { width: 100%; max-width: 720px; margin: 0 auto; padding: 56px 20px 72px; }
.st-testo h1 { margin: 0; font: 600 clamp(2rem, 4vw, 2.6rem)/1.1 "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; }
.st-testo h1::after { content: ""; display: block; width: 36px; height: 3px; margin: 16px 0 0; background: var(--amber); border-radius: 2px; }
.st-testo .lead { margin: 18px 0 28px; color: var(--muted); }
.st-testo h2 { margin: 32px 0 8px; font-size: 1.125rem; }
.st-testo a { color: var(--ink); text-decoration-color: var(--amber); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.st-testo .agg { margin-top: 40px; color: var(--muted); font-size: .875rem; }
.st-testo details { border-bottom: 1px solid var(--line); scroll-margin-top: 90px; }
.st-testo summary { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; font-weight: 600; cursor: pointer; list-style: none; }
.st-testo summary::-webkit-details-marker { display: none; }
.st-testo summary::after { content: "+"; color: var(--amber); font-size: 1.25rem; line-height: 1; }
.st-testo details[open] summary::after { content: "–"; }
.st-testo details > :not(summary) { margin: 0 0 14px; }

.st-avviso {
  position: fixed; left: 50%; bottom: 20px; z-index: 30; transform: translateX(-50%);
  max-width: 90vw; padding: 10px 16px; border-radius: 10px;
  background: var(--blu); color: var(--bianco); border: 1px solid var(--line); font: .9375rem/1.4 system-ui, -apple-system, "Segoe UI", sans-serif;
  opacity: 0; pointer-events: none; transition: opacity .2s;
}
.st-avviso.show { opacity: 1; }
.st-avviso.con-azione.show { pointer-events: auto; display: flex; align-items: center; gap: 14px; width: max-content; }
.st-avviso button { padding: 4px 0; border: 0; background: none; color: var(--amber); font: inherit; font-weight: 700; cursor: pointer; }

.st-sub { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 2px 4px; margin: 14px 0 40px; }
.st-sub .sub { margin: 0; color: var(--muted); cursor: pointer; }
@media (hover: hover) { .st-sub .sub:hover { color: var(--amber); } }
.st-cerca { display: flex; align-items: center; border: 1px solid transparent; border-radius: 8px; }
.st-cerca.open { border-color: var(--line); }
.st-cerca button { display: grid; place-items: center; padding: 8px 10px; border: 0; border-radius: 8px; background: none; color: var(--ink); cursor: pointer; }
.st-cerca button:hover { color: var(--amber); }
.st-cerca svg { width: 20px; height: 20px; display: block; }
.st-cerca input {
  -webkit-appearance: none; appearance: none;
  width: 0; padding: 8px 0; border: 0; opacity: 0; background: none; color: var(--ink);
  font: inherit; font-size: 16px;
  outline: none; transition: width .25s ease, opacity .2s ease, padding .25s ease;
}
.st-cerca.open input { width: min(220px, 50vw); padding: 8px 10px 8px 0; opacity: 1; }
.st-nessuna { margin: 0 0 20px; text-align: center; color: var(--muted); }
.st-cards.st-ricerca { grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)); gap: 10px; }
.st-cards.st-ricerca .st-card { flex-direction: row; align-items: center; gap: 12px; padding: 8px 12px; border-radius: 12px; }
.st-cards.st-ricerca .st-card > :not(.logo-coll):not(.st-logo) { display: none; }
.st-cards.st-ricerca .st-card .logo-coll { flex: none; zoom: .4; width: 300px; }
.st-cards.st-ricerca .st-card > img { display: block; flex: none; height: 48px; width: auto; max-width: 140px; object-fit: contain; }
.st-cards.st-ricerca .st-card::after { content: attr(aria-label); font-weight: 700; font-size: .95rem; }
.st-serie-trovate { margin: 32px 0 56px; min-width: 0; max-width: 100%; }
.st-serie-trovate ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 10px; }
.st-serie-trovate li { display: flex; }
.st-serie-trovate a { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 12px; color: inherit; text-decoration: none; background: var(--white); transition: border-color .15s; }
.st-serie-trovate a:hover, .st-serie-trovate a:focus-visible { border-color: var(--amber); }
.st-serie-trovate img, .st-serie-trovate .st-sf { flex: none; width: 64px; height: 48px; object-fit: contain; }
.st-serie-trovate .st-st { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.st-serie-trovate strong { font-size: .95rem; }
.st-serie-trovate small { color: var(--muted); font-size: .8rem; }
.st-serie-trovate em { font-style: normal; font-size: .8rem; font-weight: 700; color: var(--amber); }
.st-serie-trovate em:empty { display: none; }
.st-serie-trovate .st-altre { margin: 16px 0 0; text-align: center; }
@media (prefers-reduced-motion: reduce) { .st-cerca input { transition: none; } }

body.con-barra { padding-bottom: calc(60px + env(safe-area-inset-bottom)); }
body.con-barra .st-avviso { bottom: calc(76px + env(safe-area-inset-bottom)); }
.st-barra { position: fixed; left: 0; right: 0; bottom: 0; z-index: 25; display: flex; justify-content: center;
            background: var(--white); border-top: 1px solid var(--line); padding-bottom: env(safe-area-inset-bottom); }
.st-barra a { position: relative; flex: 0 1 130px; display: grid; justify-items: center; gap: 1px; padding: 8px 4px 7px;
              color: var(--muted); text-decoration: none; font: .75rem/1.3 system-ui, -apple-system, "Segoe UI", sans-serif; white-space: nowrap; }
.st-barra svg { width: 22px; height: 22px; }
.st-barra a[hidden] { display: none; }
.st-barra a:hover { color: var(--ink); }
.st-barra a[aria-current="page"] { color: var(--ink); font-weight: 600; }
.st-barra a[aria-current="page"]::before { content: ""; position: absolute; top: -1px; left: 50%; width: 36px; height: 3px; margin-left: -18px; background: var(--amber); border-radius: 0 0 2px 2px; }
@media print { .st-barra { display: none; } }

.st-estero { margin-top: 32px; }
.st-estero-titolo { margin: 0 0 14px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 1.05rem; color: var(--ink); }

.st-anni { display: grid; gap: 0; border-top: 1px solid var(--line); }
.st-cards + .st-anni { margin-top: 32px; }
.st-anni-tutte { display: block; margin: 0 0 12px auto; padding: 8px 16px; font: 600 .875rem/1 inherit; color: var(--ink); background: transparent; border: 1px solid var(--line); border-radius: 999px; cursor: pointer; transition: background .15s, color .15s; }
.st-anni-tutte:hover { border-color: var(--amber); }
.st-anni-tutte[aria-pressed="true"] { background: var(--amber); border-color: var(--amber); color: var(--blu); }
.st-cards + .st-anni-tutte { margin-top: 32px; }
.st-anno { border-bottom: 1px solid var(--line); }
.st-anno summary { display: flex; align-items: baseline; gap: 14px; padding: 16px 4px; cursor: pointer; list-style: none; }
.st-anno summary::-webkit-details-marker { display: none; }
.st-anno summary::after { content: ""; margin-left: auto; align-self: center; width: 10px; height: 10px; border-right: 2.5px solid var(--amber); border-bottom: 2.5px solid var(--amber); transform: rotate(45deg); transition: transform .2s; }
.st-anno[open] summary::after { transform: rotate(-135deg); }
.st-anno summary:hover .st-anno-num { color: var(--amber); }
.st-anno-num { font: 900 1.9rem/1 "Arial Black", "Helvetica Neue", Arial, system-ui, sans-serif; color: var(--titolo, var(--ink)); transition: color .15s; }
.st-anno-quante { color: var(--muted); font-size: .9375rem; }
.st-anno > .st-cards { padding: 4px 0 24px; }
@media (prefers-reduced-motion: reduce) { .st-anno summary::after { transition: none; } }

.st-promemoria { position: fixed; left: 50%; bottom: 16px; z-index: 28; transform: translateX(-50%);
  width: min(460px, calc(100vw - 24px)); padding: 12px 14px; border: 1px solid var(--line); border-left: 4px solid var(--amber); border-radius: 12px;
  background: var(--white); color: var(--ink); box-shadow: 0 8px 28px rgba(26, 33, 64, .18);
  font: .875rem/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; }
body.con-barra .st-promemoria { bottom: calc(72px + env(safe-area-inset-bottom)); }
.st-promemoria p { margin: 0 0 10px; }
.st-promemoria div { display: flex; justify-content: flex-end; gap: 8px; }
.st-promemoria button { padding: 7px 14px; border-radius: 8px; border: 1px solid var(--line); background: none; color: var(--ink); font: inherit; font-weight: 600; cursor: pointer; }
.st-promemoria button[data-p="accedi"] { background: var(--ink); border-color: var(--ink); color: var(--white); }
.st-promemoria button:hover { border-color: var(--amber); }
.st-promemoria button[data-p="accedi"]:hover { background: var(--amber); border-color: var(--amber); color: var(--blu); }

#stAccedi:has(.st-avatar) { padding: 0; border: 0; }
.st-avatar { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
  background: var(--ink); color: var(--white); font: 700 1rem/1 system-ui, -apple-system, "Segoe UI", sans-serif; }
#stAccedi.st-da-confermare { position: relative; }
#stAccedi.st-da-confermare::after { content: ""; position: absolute; top: 0; right: 0; width: 11px; height: 11px; border-radius: 50%; background: var(--amber); border: 2px solid var(--white); }
#stAccedi:hover .st-avatar { background: var(--amber); color: var(--blu); }
.st-avatar.grande { width: 46px; height: 46px; font-size: 1.25rem; flex: none; }
.st-profilo { position: fixed; right: 12px; z-index: 40; width: min(300px, calc(100vw - 24px)); padding: 16px;
  border: 1px solid var(--line); border-radius: 14px; background: var(--white); color: var(--ink);
  box-shadow: 0 12px 36px rgba(26, 33, 64, .22); font: .9375rem/1.4 system-ui, -apple-system, "Segoe UI", sans-serif;
  display: grid; gap: 2px; max-height: calc(100vh - 90px); overflow: auto; }
.st-ma-testa { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.st-ma-testa b { display: block; font-size: 1.0625rem; }
.st-ma-testa small { color: var(--muted); font-size: .8125rem; word-break: break-all; }
.st-ma-numeri { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-bottom: 6px; }
.st-ma-numeri > span { padding: 8px 4px; border-radius: 10px; background: var(--riquadro); text-align: center; }
.st-ma-numeri b { display: block; font-size: 1.25rem; }
.st-ma-numeri small { color: var(--muted); font-size: .75rem; }
.st-ma-stat { display: block; color: inherit; text-decoration: none; text-align: center; }
.st-ma-stat > small { color: var(--muted); font-size: .8125rem; font-weight: 600; }
.st-ma-stat:hover > small { color: var(--amber); }
.st-ma-stat:hover .st-ma-numeri > span { outline: 1px solid var(--amber); }
.st-ma-nota { margin: 2px 0 8px; color: var(--muted); font-size: .75rem; text-align: center; }
.st-ma-sezione { margin: 10px 0 0; padding-top: 10px; border-top: 1px solid var(--line); color: var(--muted); font-size: .6875rem; letter-spacing: .08em; text-transform: uppercase; }
.st-profilo .st-link, .st-account-copia .st-link { justify-self: start; padding: 6px 0; border: 0; background: none; color: var(--ink); font: inherit; font-size: .9375rem; text-align: left; cursor: pointer; }
.st-profilo .st-link:hover, .st-account-copia .st-link:hover { color: var(--amber); }
.st-ma-fondo { display: flex; justify-content: space-between; gap: 10px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); }
.st-account-copia { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--line); }
.st-account-copia .st-ma-sezione { display: none; }
.st-account-copia .st-link { font-size: .8125rem; text-decoration: underline; }
body:has(.st-promemoria) .st-avviso { bottom: auto; top: 76px; }
.st-elimina-azioni { justify-content: space-between; }
.st-account .st-rosso { color: var(--errore); border-color: #E8B4B0; }
.st-account .st-rosso:hover { color: var(--errore); border-color: var(--errore); }
.st-profilo .st-link { justify-self: end; text-align: right; }
.st-profilo .st-ma-imp { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; text-decoration: none; }
.st-ma-imp svg { width: 18px; height: 18px; flex: none; }
.st-profilo .st-ma-sezione { text-align: right; }
.st-profilo .st-ma-fondo { display: block; }
.st-esci { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; padding: 10px; border: 0; border-radius: 10px;
  background: #C62828; color: var(--bianco); font: inherit; font-weight: 700; cursor: pointer; }
.st-esci svg { width: 18px; height: 18px; }
.st-esci:hover { background: #A51F1F; }

.st-imp-nota { color: var(--muted); font-size: .9375rem; }
.st-imp-numeri { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 4px 0 10px; }
.st-imp-numeri div { padding: 12px 6px; border-radius: 12px; background: var(--riquadro); text-align: center; line-height: 1.2; }
.st-imp-numeri b { display: block; font-size: 1.5rem; }
.st-imp-numeri small { color: var(--muted); font-size: .8125rem; }
@media (max-width: 480px) { .st-imp-numeri { grid-template-columns: repeat(2, 1fr); } }
.st-imp-sotto { margin: 22px 0 10px; font-size: 1rem; }
.st-imp-comandi { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 6px; }
.st-imp-comandi select, .st-imp-comandi input { padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--white); color: var(--ink); font: inherit; font-size: .9375rem; }
.st-imp-comandi select { flex: 0 1 auto; min-width: 0; }
.st-imp-comandi input { flex: 1 1 180px; min-width: 0; }
@media (max-width: 600px) { .st-imp-comandi select { flex: 1 1 0; } .st-imp-comandi input { flex-basis: 100%; } }
.st-imp-comandi :focus { outline: none; border-color: var(--amber); }
.st-imp-serie { list-style: none; margin: 0; padding: 0; }
.st-imp-serie li { display: grid; grid-template-columns: minmax(0, 1fr) 110px 170px; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); font-size: .9375rem; }
.st-imp-tit { display: grid; line-height: 1.3; }
.st-imp-tit small { color: var(--muted); font-size: .8125rem; }
.st-impostazioni .st-imp-serie a { text-decoration: none; font-weight: 600; }
.st-impostazioni .st-imp-serie a:hover { text-decoration: underline; text-decoration-color: var(--amber); }
.st-imp-serie .st-quanti { color: var(--muted); font-size: .875rem; text-align: right; }
.st-imp-serie .finita .st-quanti { color: var(--ink); font-weight: 700; }
@media (max-width: 600px) { .st-imp-serie li { grid-template-columns: 1fr 150px; gap: 6px 12px; } .st-imp-tit { grid-column: 1 / -1; } }
.st-imp-altre { margin: 12px 0 0; text-align: center; }
.st-aspetto { display: inline-flex; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.st-aspetto button { padding: 8px 18px; border: 0; background: none; color: var(--ink); font: inherit; cursor: pointer; }
.st-aspetto button + button { border-left: 1px solid var(--line); }
.st-aspetto button[aria-pressed="true"] { background: var(--amber); color: var(--blu); font-weight: 600; }
.st-aspetto button:hover:not([aria-pressed="true"]) { color: var(--amber); }
.st-impostazioni .st-ma-testa { display: flex; align-items: center; gap: 12px; }
.st-impostazioni .st-ma-testa b { display: block; }
.st-impostazioni .st-ma-testa small { color: var(--muted); font-size: .875rem; word-break: break-all; }
.st-imp-voce { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 16px; margin: 0; padding: 10px 0; border-bottom: 1px solid var(--line); }
.st-imp-voce span { display: flex; flex-wrap: wrap; gap: 4px 16px; color: var(--muted); }
.st-impostazioni .st-link { padding: 0; border: 0; background: none; color: var(--ink); font: inherit; text-decoration: underline; text-decoration-color: var(--amber); text-decoration-thickness: 2px; text-underline-offset: 3px; cursor: pointer; }
.st-impostazioni .st-link:hover { color: var(--amber); }
button.st-btn { border: 0; font-family: inherit; cursor: pointer; }
.st-imp-nome { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.st-imp-nome input { flex: 1 1 200px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; font: inherit; color: var(--ink); background: var(--white); }
.st-imp-nome input:focus { outline: none; border-color: var(--amber); }
.st-impostazioni .st-esci { width: auto; min-width: 200px; margin-top: 22px; }
.st-imp-elimina { margin-top: 28px; }
.st-impostazioni .st-imp-elimina .st-link { color: var(--muted); font-size: .8125rem; text-decoration-color: currentColor; text-decoration-thickness: 1px; }
.st-impostazioni .st-imp-elimina .st-link:hover { color: var(--errore); }

.st-collabora { margin-top: 48px; padding: 20px 22px; background: var(--crema); border: 1px solid var(--crema-line); border-radius: 14px; }
.st-collabora h2 { margin: 0 0 4px; font-size: 1.125rem; }
.st-collabora p { margin: 0; color: var(--muted); font-size: .9375rem; }
.st-social { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; margin: 14px 0 0; padding: 0; list-style: none; }
.st-social a, .st-proponi a { display: flex; align-items: center; gap: 14px; height: 100%; padding: 14px 18px; background: var(--white); border: 1px solid var(--crema-line); border-radius: 14px; color: var(--ink); text-decoration: none; transition: border-color .15s, transform .15s; }
.st-social a:hover, .st-proponi a:hover { border-color: var(--amber); transform: translateY(-1px); }
.st-soc-ic { flex: none; width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: var(--amber); }
.st-soc-ic svg { width: 30px; height: 30px; fill: var(--blu); }
.st-soc-t { min-width: 0; }
.st-soc-t b { display: block; overflow-wrap: anywhere; }
.st-soc-t small { color: var(--muted); font-size: .8125rem; }
.st-soc-ar { margin-left: auto; font-size: 1.25rem; font-weight: 700; color: var(--amber); }
@media (prefers-reduced-motion: reduce) { .st-social a, .st-proponi a { transition: none; } .st-social a:hover, .st-proponi a:hover { transform: none; } }
.st-collabora.st-proponi { margin-top: 32px; padding: 0; background: none; border: 0; border-radius: 0; }
.st-collabora:not([hidden]) + .st-collabora.st-proponi { margin-top: 14px; }
.st-collabora.st-proponi a { display: inline-flex; align-items: center; gap: 10px; height: auto; max-width: none; padding: 0; background: none; border: 0; border-radius: 0; font-size: .9375rem; transform: none; }
.st-proponi .st-soc-ic { width: 26px; height: 26px; }
.st-proponi .st-soc-ic svg { width: 14px; height: 14px; }
.st-proponi .st-soc-t b { display: inline; font-weight: 600; }
.st-proponi .st-soc-t small { margin-left: 6px; font-size: inherit; }
.st-proponi .st-soc-ar { margin-left: 2px; font-size: 1.125rem; }
.st-proponi a:hover .st-soc-t b { text-decoration: underline; text-decoration-color: var(--amber); text-decoration-thickness: 2px; text-underline-offset: 3px; }

.st-seguici { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: 40px; padding: 22px 26px; background: var(--band-bg); border-radius: 14px; color: var(--bianco); }
.st-seguici-t { flex: 1 1 240px; }
.st-seguici h2 { margin: 0 0 2px; font-size: 1.125rem; color: var(--bianco); }
.st-seguici p { margin: 0; color: var(--soft); font-size: .9375rem; }
.st-seguici ul { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.st-seguici a { display: inline-flex; align-items: center; gap: 10px; padding: 7px 18px 7px 7px; background: var(--amber); border-radius: 999px; color: var(--blu); font-weight: 700; text-decoration: none; transition: background .15s; }
.st-seguici a:hover { background: var(--bianco); }
.st-seguici .ic { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--blu); }
.st-seguici .ic svg { width: 18px; height: 18px; fill: var(--amber); }


img { -webkit-user-drag: none; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.thumb img { pointer-events: none; }
.st-privacy-riga { margin: 2px 0 6px; text-align: left; color: var(--muted); }
.st-privacy-riga a { color: inherit; text-decoration: underline; }
.st-account .st-google-grande { padding: 14px 16px; font-size: 1.0625rem; font-weight: 700; }
.st-google-nota { margin: 6px 0 0; color: var(--muted); text-align: center; }
.st-account-testo > .st-privacy-riga { margin: 8px 0 0; text-align: center; }
.st-account-testo > .st-apri-email { display: block; margin: 22px auto 0; font-size: 1rem; }
.st-account-testo > .st-link { display: block; margin: 16px auto 14px; text-align: center; }
.st-account-testo > .st-apri-email + .st-link { margin: 18px auto 16px; font-size: .9375rem; }


.trofeo-pop { position: fixed; left: 50%; top: calc(16px + env(safe-area-inset-top)); z-index: 70; width: min(92vw, 440px);
  display: flex; gap: 14px; align-items: center; padding: 12px 18px 12px 12px; border-radius: 20px; background: #1A2140 !important; color: #fff !important;
  border: 2px solid var(--col); box-shadow: var(--glow), var(--glow), 0 10px 30px rgba(26, 33, 64, .35);
  transform: translate(-50%, calc(-100% - 40px)); transition: transform .35s ease-in; }
.trofeo-pop.su { transform: translate(-50%, 0); transition: transform .45s cubic-bezier(.2, 1.3, .4, 1); }
.trofeo-med { flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #2A3358; color: #8A93AD; font-weight: 700; border: 2px solid #3A4570; }
.trofeo-pop .trofeo-med, .trofeo.su .trofeo-med { border-color: var(--col); box-shadow: var(--glow); background: #1A2140; }
.trofeo-pop .tt small { display: block; font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--col); }
.trofeo-pop .tt b { display: block; font-size: 1.05rem; color: #fff; }
.trofeo-pop .tt span { font-size: .82rem; color: #C9CEDD; }
.trofei-testa { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; }
.trofei-testa b { white-space: nowrap; }
.trofei-griglia { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
.trofeo { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); border-radius: 14px; opacity: .75; }
.trofeo.su { opacity: 1; border-color: var(--col); box-shadow: var(--glow), 0 0 0 1px var(--col) inset; }
.trofeo.mistero { opacity: .55; }
.trofeo .tt { display: flex; flex-direction: column; min-width: 0; }
.trofeo .tt b { font-size: .95rem; }
.trofeo .tt small { font-size: .78rem; color: var(--muted); }
.trofeo .tt small.ra { font-weight: 700; }
.badge-lista { display: flex; flex-wrap: wrap; gap: 10px; }
.badge { display: inline-flex; align-items: center; gap: 10px; padding: 6px 16px 6px 6px; border-radius: 999px; border: 2px solid var(--line); background: var(--white); color: var(--ink); font: inherit; cursor: pointer; text-align: left; opacity: .7; }
.badge .cuore { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--col); }
.badge .tt { display: flex; flex-direction: column; line-height: 1.15; }
.badge .tt small { font-size: .62rem; font-weight: 700; letter-spacing: .08em; color: var(--muted); }
.badge .tt b { font-size: .9rem; }
#badgeCerca { width: 100%; max-width: 360px; margin: 4px 0 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--white); color: var(--ink); font: inherit; }
.badge.bloccato { opacity: .45; cursor: not-allowed; filter: grayscale(1); }
.badge.on { opacity: 1; border-color: var(--col); box-shadow: 0 0 0 2px var(--col) inset; }
@media (prefers-reduced-motion: reduce) { .trofeo-pop, .trofeo-pop.su { transition: none; } }

.st-ma-trofei { display: block; margin: 8px 0; padding: 10px 12px; border-radius: 10px; background: var(--riquadro); color: inherit; text-decoration: none; }
.st-ma-trofei:hover { box-shadow: 0 0 0 2px var(--amber) inset; }
.st-ma-trofei-t { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; font-size: .875rem; }
.st-ma-trofei-t span { color: var(--muted); font-size: .8125rem; font-weight: 600; }
.st-ma-trofei .st-progresso { display: block; }
.st-ma-badge-riga { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.st-ma-badge { padding: 2px 9px; border-radius: 999px; background: var(--col); color: #fff; font-size: .72rem; font-weight: 700; }

:root[data-tema="scuro"] .badge .cuore, :root[data-tema="scuro"] .st-ma-badge { box-shadow: 0 0 0 2px rgba(238, 240, 247, .8); }
:root[data-tema="scuro"] .badge.on { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink) inset; }
@media (prefers-color-scheme: dark) {
  :root[data-tema="auto"] .badge .cuore, :root[data-tema="auto"] .st-ma-badge { box-shadow: 0 0 0 2px rgba(238, 240, 247, .8); }
  :root[data-tema="auto"] .badge.on { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink) inset; }
}

.st-grazie { max-width: 640px; margin: 48px auto 8px; padding: 26px 22px 24px; text-align: center; background: var(--crema); border: 1px solid var(--crema-line); border-radius: 16px; }
.st-grazie .st-grazie-ic { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; margin-bottom: 10px; border-radius: 50%; background: var(--amber); color: #1A2140; font-size: 1.5rem; line-height: 1; box-shadow: 0 0 0 5px rgba(242, 169, 0, .2); }
.st-grazie .st-grazie-t { margin: 0 auto 10px; font-size: 1.25rem; font-weight: 800; color: var(--ink); }
.st-grazie p { margin: 0 auto; max-width: 34rem; color: var(--ink); font-size: 1rem; line-height: 1.55; }
.st-grazie p + p { margin-top: 8px; }
.st-grazie p + p + p { color: var(--muted); font-size: .9375rem; }
.st-grazie b { font-weight: 800; }

.st-invito-app { position: fixed; left: 12px; right: 12px; bottom: calc(14px + env(safe-area-inset-bottom)); z-index: 60; max-width: 460px; margin: 0 auto;
                 display: flex; align-items: center; gap: 10px; padding: 12px 8px 12px 16px; border-radius: 12px; background: var(--ink); color: var(--white);
                 font-size: .9375rem; line-height: 1.35; box-shadow: 0 6px 20px rgba(0,0,0,.28); opacity: 0; transform: translateY(12px); transition: opacity .25s, transform .25s; }
.st-invito-app.show { opacity: 1; transform: none; }
.st-invito-app span { flex: 1; }
.st-invito-app button { padding: 6px 4px; border: 0; background: none; color: var(--amber); font: inherit; font-weight: 700; cursor: pointer; }
.st-invito-app .chiudi { padding: 4px 10px; color: inherit; font-size: 1.4rem; line-height: 1; opacity: .7; }
body.con-barra .st-invito-app { bottom: calc(76px + env(safe-area-inset-bottom)); }

.liste-pill { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 4px; }
.lp {
  display: inline-flex; align-items: center; gap: 4px; min-height: 34px; padding: 5px 13px;
  border: 1.5px solid var(--amber); border-radius: 999px; background: var(--white); color: var(--amber);
  font: inherit; font-size: .9rem; line-height: 1.2; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.lp[aria-pressed="true"] { background: color-mix(in srgb, var(--amber) 14%, var(--white)); font-weight: 600; }
.lp[aria-pressed="true"]::before { content: "\2713"; }
.lp:focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; }
.lp.lp-nuova { border-style: dashed; border-color: var(--line); color: var(--muted); }
.lp.lp-nuova:hover { color: var(--amber); border-color: var(--amber); }
.lp-campo {
  min-height: 34px; width: 13em; max-width: 100%; padding: 5px 13px; border: 1.5px solid var(--amber); border-radius: 999px;
  background: var(--white); color: var(--ink); font: inherit; font-size: 1rem; outline: none;
}
.liste-nuova-riga { display: flex; gap: 8px; align-items: center; justify-content: center; flex-wrap: wrap; }
.liste-nuova-riga .lp-campo { min-height: 42px; width: 16em; outline: none !important; box-shadow: none !important; }
.lnr-salva { min-height: 42px; padding: 0 22px; border: 0; border-radius: 999px; background: var(--amber); color: #151a2c;
  font: inherit; font-size: 1rem; font-weight: 600; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.lnr-salva:hover { filter: brightness(1.08); }
.lnr-salva:focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; }
.liste-err { margin: 6px 0 0; color: var(--errore); font-size: .85rem; }
.liste-nota { margin: 4px 0 12px; color: var(--muted); font-size: .95rem; }
.liste-nota b { color: var(--ink); }
.liste-nota a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.lp-sfondo { position: fixed; inset: 0; z-index: 60; background: rgba(10, 14, 30, .35); animation: lp-entra .15s ease-out; }
.lp-pannello {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 61; max-width: 560px; margin: 0 auto;
  padding: 14px 18px calc(22px + env(safe-area-inset-bottom)); background: var(--white); color: var(--ink);
  border-radius: 18px 18px 0 0; box-shadow: 0 -8px 30px rgba(10, 14, 30, .25); animation: lp-sale .18s ease-out;
}
.lp-pannello .lp-maniglia { width: 40px; height: 5px; margin: 0 auto 12px; border-radius: 3px; background: var(--line); }
.lp-pannello h3 { margin: 0 0 4px; font-size: 1.1rem; }
.lp-pannello .lp-sotto { margin: 0 0 14px; color: var(--muted); font-size: .9rem; }
.lp-pannello .lp-fatto { display: block; margin: 18px 0 0 auto; padding: 10px 22px; border: 0; border-radius: 10px; background: var(--ink); color: var(--white); font: inherit; font-weight: 600; cursor: pointer; }
@keyframes lp-entra { from { opacity: 0; } to { opacity: 1; } }
@keyframes lp-sale { from { transform: translateY(100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) { .lp-sfondo, .lp-pannello { animation: none; } }
@media (max-width: 400px) { .st-barra a { padding-inline: 1px; font-size: .7rem; } }

.vg-tag { display: inline-block; background: var(--amber); color: #1A2140; font-weight: 800; font-size: .68rem; letter-spacing: .06em; padding: 2px 9px; border-radius: 99px; }
.vg-finestra { width: min(420px, calc(100vw - 32px)); max-height: calc(100dvh - 48px); overflow: auto; border: 0; border-radius: 22px; padding: 22px 20px 18px;
  background: var(--white); color: var(--ink); box-shadow: 0 20px 50px rgba(0,0,0,.3); }
.vg-finestra::backdrop { background: rgba(16,21,45,.62); }
.vg-finestra h2 { font: 700 1.6rem/1.15 "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; margin: 8px 0 4px; }
.vg-sotto { color: var(--muted); margin: 0 0 6px; }
.vg-voci { list-style: none; margin: 8px 0 0; padding: 0; }
.vg-voci li { display: flex; gap: 12px; align-items: flex-start; padding: 10px 0; border-top: 1px solid var(--line); }
.vg-voci li div { min-width: 0; }
.vg-voci b { display: block; }
.vg-voci span:not(.vg-ic) { color: var(--muted); font-size: .9rem; }
.vg-voci span b { display: inline; color: var(--ink); }
.vg-ic { flex: none; width: 40px; height: 40px; border-radius: 12px; background: var(--crema); display: grid; place-items: center; }
.vg-ic svg { width: 22px; height: 22px; }
.vg-tasti { display: flex; gap: 10px; margin-top: 14px; }
.vg-tasti button { flex: 1; border-radius: 99px; padding: 11px 8px; font: inherit; font-weight: 700; cursor: pointer; }
.vg-no { background: transparent; color: var(--ink); border: 1.5px solid var(--line); }
.vg-si { background: var(--amber); color: #1A2140; border: 0; }
.vg-giro { position: fixed; inset: 0; z-index: 1000; opacity: 0; transition: opacity .2s; }
.vg-giro.show { opacity: 1; }
.vg-buco { position: fixed; border-radius: 16px; box-shadow: 0 0 0 200vmax rgba(16,21,45,.62); outline: 3px solid var(--amber); outline-offset: 2px; pointer-events: none; transition: all .25s; }
.vg-fum { position: fixed; width: min(300px, calc(100vw - 24px)); box-sizing: border-box; background: var(--white); color: var(--ink); border-radius: 16px; padding: 14px 16px 12px; box-shadow: 0 10px 30px rgba(0,0,0,.3); }
.vg-fum::after { content: ""; position: absolute; width: 16px; height: 16px; background: inherit; transform: rotate(45deg); bottom: -7px; left: var(--freccia, 50%); margin-left: -8px; }
.vg-fum.sotto::after { bottom: auto; top: -7px; }
.vg-fum-t { display: block; font-size: 1.05rem; margin-top: 8px; }
.vg-fum p { margin: 4px 0 0; line-height: 1.4; }
.vg-piede { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.vg-pal { flex: 1; }
.vg-pal i { display: inline-block; width: 7px; height: 7px; border-radius: 4px; background: var(--line); margin-right: 5px; vertical-align: middle; }
.vg-pal i.on { background: var(--amber); width: 18px; }
.vg-salta { background: none; border: 0; color: var(--muted); font: inherit; font-size: .9rem; padding: 8px 6px; cursor: pointer; }
.vg-avanti { background: var(--ink); color: var(--white); border: 0; border-radius: 99px; padding: 8px 18px; font: inherit; font-weight: 700; font-size: .9rem; cursor: pointer; }
.vg-finestra:focus, .vg-fum:focus { outline: none; }
.vg-tasti { position: sticky; bottom: -18px; background: var(--white); padding-bottom: 4px; }
@media (max-width: 360px) { .vg-finestra { padding: 18px 16px 14px; } .vg-tasti button { font-size: .9rem; } }
@media (prefers-reduced-motion: reduce) { .vg-giro, .vg-buco { transition: none; } }

.st-accesso-prova { position: fixed; left: 10px; bottom: calc(72px + env(safe-area-inset-bottom)); z-index: 70; opacity: .9; padding: 4px 10px; border-radius: 99px; background: var(--amber); color: #1A2140;
  font-size: .75rem; font-weight: 700; box-shadow: 0 2px 6px rgba(0,0,0,.25); pointer-events: none; }