/* ==========================================================================
   world.css — the fixed WebGL canvas (São Paulo at night, from the Edifício
   Itália).  The CSS night used when WebGL is unavailable (or JavaScript is off)
   lives in world-fallback.css.  Page content must sit at z-index >= 1.
   ========================================================================== */

.world {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  z-index: 0;
  pointer-events: none;
  display: block;
  background: var(--bg, #0a0b11);
}
@supports (height: 100lvh) {
  .world { height: 100lvh; }
}

/* fade the 3D night in once the first frame is on screen */
html.js .world {
  opacity: 0;
  transition: opacity 1.4s var(--ease-out, cubic-bezier(.16, 1, .3, 1));
}
html.js.world-ready .world { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  html.js .world { transition: opacity .3s linear; }
}

/* WebGL missing / context lost: world.js adds html.no-webgl and loads assets/css/world-fallback.css (the CSS night).
   Until that file arrives, the canvas simply shows the page background. */
html.no-webgl .world { opacity: 1; transition: none; }