/* ==========================================================================
   Il cielo in Three.js dietro la pagina (versione «cielo-sfera»): la tela e il
   cielo di riserva. Il disegno lo fanno js/veduta.js e js/veduta/paesaggio.js.
   In questa versione la pagina non ha un fondo bianco suo: sotto il testo c'è
   il cielo. Finché la tela non c'è, o se non può esserci (niente WebGL 2,
   niente JavaScript, ?sfondo=nessuno), si vede un cielo chiaro fatto con un
   gradiente, chiaro abbastanza perché anche il grigio-lilla resti leggibile
   (luminanza sopra 0,86 ovunque).
   La tela è fissa, dietro a tutto, e non riceve clic; compare piano dopo il
   primo disegno (classe veduta-attiva su <html>, la mette lo script).
   ========================================================================== */

html {
  background: #F5F2EE linear-gradient(180deg, #F0EFF4 0%, #F6F1EC 45%, #F7F2EB 75%, #F4F1EB 100%) fixed;
}
body { background: transparent; }

.veduta-tela {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  display: block;
  pointer-events: none;
  opacity: 0;
  transition: opacity 1400ms cubic-bezier(.2, .7, .2, 1);
}
html.veduta-attiva .veduta-tela { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .veduta-tela { transition: none; }
}
@media print {
  .veduta-tela { display: none !important; }
  html, body { background: #fff; }
}