/* Laboratorio grafico: solo superfici, colori e separazioni leggere. */
.nome, .testata .marchio { color:var(--titolo-color,var(--font-color,var(--acc))); }
.nv2 .nome::after { background:currentColor; }
body.nv, body.interna { position:relative; isolation:isolate; background-color:var(--fondo-pagina,var(--beige)); background-image:none; }
body.interna::after { content:""; position:absolute; inset:0; z-index:-2; pointer-events:none; background:#242834; opacity:.035; -webkit-mask:url('../asset/beige/topografia-naturale.svg') center top / cover no-repeat; mask:url('../asset/beige/topografia-naturale.svg') center top / cover no-repeat; }
html[data-trama="nessuna"] body::after { display:none; }
html[data-trama]:not([data-trama="topografia"]):not([data-trama="nessuna"]) body::after { display:block; -webkit-mask:none; mask:none; background-color:transparent; background-position:0 0; opacity:var(--opacita-texture,1); }
html[data-trama="carta"] body::after { --opacita-texture:.055; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); background-size:180px 180px; }
html[data-trama="puntini"] body::after { background-image:radial-gradient(circle,rgb(38 65 83 / .12) .65px,transparent .9px); background-size:19px 19px; }
html[data-trama="righe"] body::after { background-image:repeating-linear-gradient(0deg,transparent 0 31px,rgb(38 65 83 / .055) 31px 32px); }

/* Il nome, il logo e i due sottotitoli conservano l'ordine originale. */
html:not([data-testata="nessuno"]) .testa { max-width:none; padding-bottom:26px; margin-bottom:6px; }
html[data-testata="linea"] .testa { border-bottom:1px solid var(--linea); }
html[data-testata="fascia"] .testa { background:linear-gradient(120deg,rgb(255 255 255 / .95),var(--tinta-luce)); border-bottom:1px solid color-mix(in srgb,var(--acc) 16%,transparent); }
html[data-testata="sfumatura"] .testa { padding-bottom:36px; background:linear-gradient(180deg,rgb(255 255 255 / .95),color-mix(in srgb,var(--tinta-luce) 65%,transparent) 55%,transparent); }
html[data-testata="pannello"] .testa { width:calc(100% - 2 * clamp(16px,4vw,64px)); margin:24px auto 6px; padding:28px 20px; background:rgb(255 255 255 / .85); border:1px solid color-mix(in srgb,var(--acc) 14%,transparent); border-radius:12px; box-shadow:0 8px 32px rgb(35 65 85 / .035); }

/* Con la colonna laterale, la frase della versione 2 resta centrata sulla pagina. */
@media (min-width:1101px) {
  .nv2 .apertura:is([data-posizione="sinistra"],[data-posizione="destra"]) > .frase { grid-column:1 / -1; grid-row:1; max-width:min(62ch,calc(100% - 2 * (182px + clamp(24px,4vw,64px)))); margin-inline:auto; }
}

/* Presentazione facoltativa: misura di lettura breve, senza aggiungere riquadri. */
.presentazione { width:100%; max-width:82ch; margin:34px auto 0; color:var(--ink); font-size:.97rem; line-height:1.85; text-wrap:pretty; }
.presentazione p + p { margin-top:14px; }
.presentazione a { text-underline-offset:3px; }
html[data-presentazione="nascosta"] .presentazione { display:none; }
@media (min-width:1101px) {
  .nv .apertura:is([data-posizione="sinistra"],[data-posizione="destra"]) > .contenitori { align-self:start; }
}
@media (max-width:600px) { .presentazione { margin-top:26px; font-size:.93rem; line-height:1.75; } }

/* Selettore: lo stesso linguaggio visivo della barra Colori. */
.scegli-aspetto summary { display:flex; align-items:center; gap:5px; min-height:32px; padding-inline:6px; cursor:pointer; list-style:none; }
.scegli-aspetto summary::-webkit-details-marker { display:none; }
.scegli-aspetto summary::after { content:"⌄"; }
.aspetto-attuale { font-weight:400; }
.scegli-aspetto__pannello { position:fixed; z-index:1; top:60px; left:50%; transform:translateX(-50%); width:min(460px,calc(100vw - 32px)); max-height:calc(100svh - 80px); overflow-y:auto; overscroll-behavior:contain; padding:20px; background:#fffefa; color:#242834; border:1px solid #cbd8e5; border-radius:12px; box-shadow:0 8px 30px rgb(48 72 98 / .16); text-align:left; }
.aspetto-sezione { margin:0; padding:0; border:0; min-width:0; }
.aspetto-sezione + .aspetto-sezione { margin-top:22px; padding-top:18px; border-top:1px solid #d7e0e8; }
.scegli-colori .aspetto-sezione { margin-top:20px; padding-top:16px; border-top:1px solid #d7e0e8; }
.aspetto-sezione legend { padding:0; margin-bottom:10px; font:700 13px/1.4 system-ui,sans-serif; }
.aspetto-opzioni { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.aspetto-opzioni button { display:flex; align-items:center; gap:8px; min-width:0; min-height:44px; padding:8px; border:1px solid #d3dce4; border-radius:6px; font:500 12px/1.3 system-ui,sans-serif; text-align:left; background:none; color:#242834; }
.aspetto-opzioni button > span { min-width:0; overflow-wrap:anywhere; }
.aspetto-opzioni button i { display:block; flex:none; width:30px; height:26px; border:1px solid #a7b2bd; border-radius:4px; background:var(--campione,#f5f8fa); }
.aspetto-opzioni button[aria-pressed="true"] { border-color:#304862; background:#edf5fd; box-shadow:inset 0 0 0 1px #304862; }
.aspetto-opzioni button[aria-pressed="true"] > span::after { content:" ✓"; }
.aspetto-prove { grid-template-columns:repeat(2,minmax(0,1fr)); }
.aspetto-prove button { flex-direction:column; align-items:flex-start; gap:5px; padding:12px 8px; }
.aspetto-prove strong { font-size:14px; }
.aspetto-prove small { font:400 11px/1.45 system-ui,sans-serif; }
.aspetto-opzioni .anteprima-trama { background-color:#fbfcfd; }
.anteprima-trama--topografia { background-image:repeating-radial-gradient(ellipse at 20% 80%,transparent 0 4px,#b6c6ce 4px 5px,transparent 5px 9px); }
.anteprima-trama--carta { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' opacity='.22' filter='url(%23n)' d='M0 0h50v50H0z'/%3E%3C/svg%3E"); }
.anteprima-trama--puntini { background-image:radial-gradient(circle,#93a7b4 1px,transparent 1px); background-size:7px 7px; }
.anteprima-trama--righe { background-image:repeating-linear-gradient(0deg,transparent 0 5px,#bbcbd6 5px 6px); }
.presentazione-attuale,.titolo-attuale { display:block; margin-top:8px; font:400 12px/1.4 system-ui,sans-serif; }
.ripristina-aspetto { width:100%; min-height:40px; margin-top:20px; padding-top:12px; border-top:1px solid #d7e0e8; font:500 12px/1.4 system-ui,sans-serif; text-decoration:underline; text-underline-offset:3px; }
.prova :is(.scegli-aspetto,.aspetto-opzioni) :focus-visible { outline:2px solid #304862; outline-offset:3px; }
@media (max-width:800px) { .aspetto-attuale { display:none; } }
@media (max-width:600px) {
  .prova { flex-wrap:wrap; min-height:52px; }
  .prova > span { font-size:10px; }
  .prova :is(.scegli-posizione,.scegli-colori,.scegli-aspetto) summary { padding-inline:3px; gap:3px; }
}