/* orbs.css: the drifting orbs of light that /v/b5ba1e57ce/js/orbs.js moves (15 Oct 2026, DESIGN_SPEC §0b).
   No colour is defined here: every orb is a radial gradient of the cosmic.css tokens (gold, orchid, rose) at low
   strength, blended with screen so it reads as light on the violet and all but disappears on the lavender day bands.
   The layer is fixed, under the nav and above the page ground; it never takes pointer events or layout. */
.orbs{position:fixed;inset:0;z-index:var(--z-orbs);pointer-events:none;overflow:hidden;contain:strict;mix-blend-mode:screen}
/* The motion (22 Oct 2026): /v/b5ba1e57ce/js/orbs.js gives each orb --s (size), --x, --y (start), --dy (how far it rises in one life),
   --life, --delay, --amp and --sway (the sideways drift), --peak (its brightest). The rise and the fade share one
   life; the sway runs on its own clock. translate and transform are separate properties, so the two moves add up. */
.orbs .orb{position:absolute;left:0;top:0;width:var(--s,240px);height:var(--s,240px);border-radius:var(--r-full);opacity:0;
  translate:var(--x,0) var(--y,100vh);will-change:translate,transform,opacity;
  animation:orb-rise var(--life,20s) linear var(--delay,0s) infinite,orb-fade var(--life,20s) linear var(--delay,0s) infinite,
    orb-sway var(--sway,4s) ease-in-out var(--delay,0s) infinite alternate;
  background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--gold-2) 78%,transparent) 0,color-mix(in srgb,var(--gold-2) 32%,transparent) 28%,color-mix(in srgb,var(--gold) 8%,transparent) 52%,transparent 70%)}
.orbs .orb-orchid{background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--orchid) 72%,transparent) 0,color-mix(in srgb,var(--orchid) 28%,transparent) 28%,color-mix(in srgb,var(--magenta) 8%,transparent) 52%,transparent 70%)}
.orbs .orb-rose{background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--rose) 70%,transparent) 0,color-mix(in srgb,var(--rose) 26%,transparent) 28%,color-mix(in srgb,var(--gold) 8%,transparent) 52%,transparent 70%)}
/* the Oracle's orchid room and the ember-warm Sanctuary lean on their own light */
.orbs[data-mood="oracle"]{mix-blend-mode:screen}
.orbs[data-mood="learn"] .orb{filter:none}
@keyframes orb-rise{from{translate:var(--x,0) var(--y,100vh)}to{translate:var(--x,0) calc(var(--y,100vh) - var(--dy,300px))}}
@keyframes orb-fade{0%{opacity:0}25%{opacity:var(--peak,.4)}80%{opacity:var(--peak,.4)}100%{opacity:0}}
@keyframes orb-sway{from{transform:translateX(calc(-1 * var(--amp,20px)))}to{transform:translateX(var(--amp,20px))}}
/* nothing moves for people who asked for less motion; the script also never starts */
@media (prefers-reduced-motion:reduce){ .orbs{display:none} }
/* the orbs sit under the nav (z 20), the sheets and dialogs, and above the page ground */
:root{--z-orbs:2}
