/* generato da guida-sorgenti/costruisci_luce.py: non modificare a mano */
.ld{--bianco:#ffffff; --carta:#f7f5f2; --inchiostro:#27241e; --linea:#e4dfd8; --prugna:#4c2832;
    --sabbia-chiara:#ebe6de; --sabbia:#c5bcaf; --tenue:#6b6259; --viola:#834b5d;
    --testo:"Pontano Sans",Arial,sans-serif; --titoli:Raleway,Helvetica,sans-serif;
    --oro:#c9a961; --rosso:#b4553f;}
.ld,.ld *{box-sizing:border-box;}
.ld h2{font:400 1.35rem/1.3 var(--titoli); letter-spacing:.06em; text-transform:uppercase; margin:2.8rem 0 .8rem; color:var(--prugna);}
.ld h3{font:600 1rem var(--titoli); letter-spacing:.04em; margin:1.4rem 0 .3rem;}
.ld p{margin:.5rem 0 .9rem;}
.ld /* simulatore */
  .ld-sim{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); grid-template-areas:"vetrina comandi" "raggi comandi"; gap:1.5rem; align-items:start;}
.ld .ld-sim-vetrina{grid-area:vetrina;}
.ld .ld-comandi{grid-area:comandi;}
.ld .ld-raggi{grid-area:raggi;}
.ld .ld-raggi h3{font:600 .82rem var(--titoli); letter-spacing:.12em; text-transform:uppercase; color:var(--prugna); margin:0 0 .6rem;}
.ld .ld-raggi p{font-size:.9rem; line-height:1.55; margin:.6rem 0 0;}
@media (max-width:880px){.ld .ld-sim{grid-template-columns:1fr; grid-template-areas:"vetrina" "comandi" "raggi";}
}
.ld .ld-vetrina{position:relative; border-radius:10px; overflow:hidden; background:#f7f5f2; border:1px solid var(--linea); box-shadow:0 12px 40px rgba(39,36,30,.16);}
.ld .ld-vetrina canvas{display:block; width:100%; aspect-ratio:1;}
.ld .ld-senza-3d{color:#eee; padding:3rem 1.5rem; text-align:center; margin:0;}
.ld .ld-vetrina-barra{display:flex; gap:.5rem; flex-wrap:wrap; justify-content:center; padding:.8rem; background:#efeae3; border-top:1px solid var(--linea);}
.ld .ld-scena{position:relative; cursor:grab; touch-action:none;}
.ld .ld-scena:active{cursor:grabbing;}
.ld .ld-vetrina-nota{position:absolute; top:.7rem; left:0; right:0; margin:0; text-align:center; color:rgba(107,98,89,.75); font-size:.78rem; pointer-events:none;}
.ld /* il brillante reale: riquadro piccolo (poche risorse), .ld si ingrandisce a tutta vetrina con un tocco */
  .ld-lente{position:absolute; left:14px; bottom:14px; width:clamp(150px, 36%, 270px); aspect-ratio:1; border-radius:14px; overflow:hidden; cursor:zoom-in; background:#e9e4dc; z-index:3;
    box-shadow:0 14px 34px rgba(39,36,30,.28), 0 0 0 1px rgba(76,40,50,.16); transition:width .55s cubic-bezier(.2,.7,.2,1), left .55s cubic-bezier(.2,.7,.2,1), bottom .55s cubic-bezier(.2,.7,.2,1), border-radius .55s;}
.ld .ld-lente:focus-visible{outline:2px solid var(--viola); outline-offset:3px;}
.ld .ld-lente canvas{width:100%; height:100%; aspect-ratio:auto;}
.ld .ld-lente-nome{position:absolute; left:8px; bottom:8px; font:600 .6rem var(--titoli); letter-spacing:.1em; text-transform:uppercase; color:var(--prugna); background:rgba(247,245,242,.88); padding:.28rem .55rem; border-radius:999px; pointer-events:none;}
.ld .ld-lente-nome::before{content:'✦ '; color:#b8954a;}
.ld .ld-lente-segno{position:absolute; right:8px; top:8px; width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:rgba(247,245,242,.88); color:var(--prugna); font-size:.85rem; pointer-events:none; transition:opacity .3s;}
.ld .ld-grande .ld-lente{width:100%; left:0; bottom:0; border-radius:0; cursor:grab;}
.ld .ld-grande .ld-lente-segno{opacity:0;}
.ld .ld-lente-chiudi{display:none; position:absolute; right:12px; top:12px; z-index:4; width:38px; height:38px; border-radius:50%; border:0; background:rgba(247,245,242,.92); color:var(--prugna); font-size:1.35rem; line-height:1; cursor:pointer; box-shadow:0 2px 10px rgba(0,0,0,.22);}
.ld .ld-grande .ld-lente-chiudi{display:block;}
.ld .ld-tasto{font:600 .74rem var(--titoli); letter-spacing:.1em; text-transform:uppercase; border:1px solid currentColor; background:transparent; color:var(--inchiostro); padding:.5rem .8rem; border-radius:4px; cursor:pointer;}
.ld .ld-tasto[aria-pressed="true"]{background:var(--oro); border-color:var(--oro); color:#1d1a16;}
.ld .ld-tasto:hover{border-color:var(--viola);}
.ld .ld-comandi{background:var(--bianco); border:1px solid var(--linea); border-radius:10px; padding:1.2rem 1.3rem;}
.ld .ld-perfetto{display:block; width:100%; padding:.8rem 1rem; margin-bottom:.6rem; font-size:.8rem; background:linear-gradient(135deg,#d8bd7a,#b8954a); border-color:#b8954a; color:#1d1a16;}
.ld .ld-perfetto.ld-attivo{box-shadow:0 0 0 3px rgba(201,169,97,.35);}
.ld .ld-perfetto span{margin-right:.35rem;}
.ld .ld-preimpostati{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem; margin-bottom:1.1rem;}
@media (max-width:480px){.ld .ld-preimpostati{grid-template-columns:1fr;}
}
.ld .ld-scheda-perfetta{display:none; margin:-.3rem 0 1.1rem; padding:.9rem 1rem; border-radius:8px; background:#fbf6ea; border:1px solid #e6d6ae; font-size:.88rem; line-height:1.5;}
.ld .ld-scheda-perfetta.ld-visibile{display:block; animation:compare .5s ease;}
@keyframes compare{ from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:none; } }
.ld .ld-scheda-perfetta h3{margin:0 0 .5rem; font-size:.86rem; color:var(--prugna);}
.ld .ld-scheda-perfetta dl{display:grid; grid-template-columns:auto 1fr; gap:.15rem .9rem; margin:0 0 .5rem;}
.ld .ld-scheda-perfetta dt{color:var(--tenue);}
.ld .ld-scheda-perfetta dd{margin:0; font-weight:600;}
.ld .ld-scheda-perfetta p{margin:0; color:var(--tenue);}
.ld .ld-preimpostati .ld-tasto{width:100%; text-align:left; font-size:.66rem; line-height:1.3;}
.ld .ld-preimpostati .ld-tasto.ld-attivo{background:var(--prugna); color:#fff; border-color:var(--prugna);}
.ld .ld-cursore{margin:.9rem 0;}
.ld .ld-cursore label{display:flex; justify-content:space-between; font:600 .82rem var(--titoli); letter-spacing:.03em;}
.ld .ld-cursore output{font-variant-numeric:tabular-nums; color:var(--viola);}
.ld .ld-cursore small{display:block; color:var(--tenue); font-size:.8rem; line-height:1.4; margin-top:.15rem;}
.ld input[type=range]{width:100%; accent-color:var(--viola); margin:.35rem 0 0;}
.ld .ld-ideale{position:relative; height:6px; border-radius:3px; background:var(--sabbia-chiara); margin-top:.15rem;}
.ld .ld-ideale span{position:absolute; top:0; bottom:0; background:#c8d9b8; border-radius:3px;}
.ld .ld-misure{display:grid; grid-template-columns:repeat(3,1fr); gap:.4rem; margin:1rem 0 .4rem; font-size:.8rem; color:var(--tenue); text-align:center;}
.ld .ld-misure b{display:block; font:600 1rem var(--titoli); color:var(--inchiostro);}
.ld .ld-esiti{margin-top:1.1rem; border-top:1px solid var(--linea); padding-top:1rem;}
.ld .ld-barra{margin:.55rem 0;}
.ld .ld-barra div:first-child{display:flex; justify-content:space-between; font:600 .78rem var(--titoli); letter-spacing:.04em;}
.ld .ld-barra .ld-fondo{height:9px; border-radius:5px; background:var(--sabbia-chiara); overflow:hidden; margin-top:.25rem;}
.ld .ld-barra .ld-pieno{height:100%; border-radius:5px; transition:width .35s ease;}
.ld .ld-giudizio{margin-top:1rem; padding:.85rem 1rem; border-radius:8px; background:var(--carta); border-left:4px solid var(--oro); font-size:.93rem; line-height:1.55;}
.ld .ld-giudizio b{font-family:var(--titoli);}
.ld .ld-taglio2d{background:#171412; border-radius:10px;}
.ld .ld-taglio2d canvas{display:block; width:100%; aspect-ratio:16/11;}
.ld .ld-legenda{display:flex; gap:1rem; flex-wrap:wrap; font-size:.85rem; color:var(--tenue); margin-top:.6rem;}
.ld .ld-legenda i{display:inline-block; width:22px; height:3px; vertical-align:middle; margin-right:.35rem; border-radius:2px;}
.ld .ld-schede{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1rem;}
.ld .ld-scheda{background:var(--bianco); border:1px solid var(--linea); border-radius:10px; padding:1rem 1.15rem;}
.ld .ld-scheda h3{margin-top:.2rem; color:var(--prugna);}
.ld table{border-collapse:collapse; width:100%; background:var(--bianco); font-size:.92rem;}
.ld th, .ld td{text-align:left; padding:.55rem .7rem; border-bottom:1px solid var(--linea);}
.ld th{font:600 .78rem var(--titoli); letter-spacing:.06em; text-transform:uppercase; color:var(--tenue);}
.ld .ld-tabella-scorre{overflow-x:auto; border:1px solid var(--linea); border-radius:10px;}
.ld .ld-nota{font-size:.84rem; color:var(--tenue); border-top:1px solid var(--linea); margin-top:2.5rem; padding-top:1rem;}
.ld .ld-invito{margin-top:2.5rem; background:var(--prugna); color:#fff; border-radius:10px; padding:1.5rem 1.6rem;}
.ld .ld-invito h2{color:#fff; margin-top:0;}
.ld .ld-invito .ld-tasto{color:#fff; border-color:rgba(255,255,255,.6); text-decoration:none; display:inline-block; margin-top:.4rem;}