/* Estetica22 — journey canvas, preloader, static fallback. */
#journeyCanvas { position: fixed; inset: 0; z-index: var(--z-canvas); width: 100%; height: 100%; display: block; }

/* static fallback: default body state; main.js removes it when WebGL journey inits.
   Mirrors chapter palette arc: sand/pink -> aqua-sage -> blush/mauve -> ember -> twilight.
   The arc is viewport-fixed and static tiers never flip ink, so every stop must keep
   AA (>=4.5:1) against --ink — tail stops are raised above the scene palettes for that
   reason (verified by tests/structure-check.mjs). */
body.journey-static::before {
  content: ""; position: fixed; inset: 0; z-index: -1;
  background: linear-gradient(180deg,
    oklch(0.99 0.005 85) 0%, oklch(0.88 0.045 85) 14%, oklch(0.82 0.022 35) 22%,
    oklch(0.93 0.02 120) 30%, oklch(0.82 0.03 145) 40%,
    oklch(0.82 0.022 35) 50%, oklch(0.66 0.055 340) 60%,
    oklch(0.68 0.045 40) 72%, oklch(0.66 0.03 50) 82%,
    oklch(0.64 0.020 145) 92%, oklch(0.63 0.018 145) 100%);
}
/* 72%-alpha soft ink cannot reach 4.5:1 on the mid-light tail — full ink in static tiers */
body.journey-static { --ink-soft: var(--ink); }
body.journey-static #journeyCanvas { display: none; }

/* glass copy blocks at the Calore/Riposo entries (AA scrim over the scene blend) */
.chapter .section-head.glass, .chapter p.glass { padding: 1.1rem 1.4rem; border-radius: var(--radius-panel); }

/* preloader */
/* JS-gated: without JS (or on module-unsupported browsers) the preloader never shows,
   so the static page stays usable; html.js is set by an inline head script. */
html.js .preloader { display: grid; }
.preloader { position: fixed; inset: 0; z-index: var(--z-preloader); display: none; place-items: center; background: var(--liwe3-bg); transition: opacity .6s var(--ease-out); }
.preloader.done { opacity: 0; pointer-events: none; }
.preloader .breath { width: 74px; height: 74px; border-radius: 50%; border: 1px solid var(--hairline); display: grid; place-items: center; animation: breath 2.8s var(--ease-out) infinite; }
.preloader .breath img { width: 46px; height: 46px; }
@keyframes breath { 0%, 100% { transform: scale(.94); opacity: .7; } 50% { transform: scale(1.05); opacity: 1; } }

/* reduced motion: kill the canvas + all animation; static arc stays via .journey-static */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  #journeyCanvas { display: none; }
  html.js .reveal { opacity: 1; transform: none; transition: none; }
  .scroll-hint .line, .preloader .breath { animation: none; }
  * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
