/* =========================================================
   COSMOS skin — reveal the starfield behind the page.
   Loaded LAST. Makes section grounds translucent so the
   fixed CosmosField (z-index 0) shows through on scroll,
   while keeping a dark scrim for text legibility.
   ========================================================= */

.cosmos-layer {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
.cosmos-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

/* translucent ground tokens → space shows through every section */
.av-page {
  --bg:      rgba(11,11,13,0.72);
  --bg-deep: rgba(8,8,10,0.78);
}
.av-page #root { background: transparent; }

/* hero — let the cosmos breathe behind the resonance field */
.av-page .av-hero {
  background:
    radial-gradient(120% 80% at 50% 38%,
      rgba(14,14,16,0.34) 0%, rgba(8,8,10,0.55) 55%, rgba(6,6,7,0.72) 100%);
}

/* sections that hard-code opaque stops → translucent equivalents */
.av-page .tv-pains {
  background: linear-gradient(180deg, rgba(11,11,13,0.72) 0%, rgba(15,10,11,0.8) 100%);
}
.av-page .tv-bonuses {
  background: linear-gradient(180deg, rgba(11,11,13,0.72) 0%, rgba(15,11,12,0.8) 100%);
}
.av-page .tv-final {
  background:
    radial-gradient(85% 70% at 50% 0%, rgba(200,16,46,0.16), transparent 60%),
    linear-gradient(180deg, rgba(14,14,17,0.5) 0%, rgba(8,8,10,0.8) 100%);
}
.av-page .tv-footer {
  background: rgba(6,6,10,0.82);
}