/* Light surfaces need less pigment to preserve muted-copy contrast. */
:root[data-theme="light"] { --expressive-glow-strength: 12%; --expressive-reflection-strength: 8%; }
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) { --expressive-glow-strength: 12%; --expressive-reflection-strength: 8%; }
}
/* Register-specific light stays local; quiet palette tokens remain unchanged. */
.visual-expressive {
  --atmosphere-glow: color-mix(in srgb, var(--accent) var(--expressive-glow-strength, 18%), transparent);
  --atmosphere-reflection: color-mix(in srgb, var(--starlight) var(--expressive-reflection-strength, 12%), transparent);
}
.visual-ambient { --atmosphere-glow: color-mix(in srgb, var(--accent) 14%, transparent); }

/* Opt-in primitives. Host content stays above clipped, non-interactive decoration. */
.atmosphere-host { position: relative; isolation: isolate; }
.atmosphere-layer { position: absolute; inset: 0; z-index: -1; overflow: clip; pointer-events: none; }
.atmosphere-layer *, .atmosphere-orbit-drift, .atmosphere-star-breathe { pointer-events: none; }
.visual-quiet .atmosphere-layer { display: none; }

.atmosphere-ocean-drift::before, .atmosphere-ocean-drift::after {
  content: ""; position: absolute; width: 85%; height: 85%; border-radius: 50%;
  background: radial-gradient(ellipse, var(--atmosphere-glow, var(--glow)), transparent 70%);
  filter: blur(24px); pointer-events: none;
}
.atmosphere-ocean-drift::before { top: -12%; right: -12%; }
.atmosphere-ocean-drift::after {
  bottom: -16%; left: -16%; opacity: .7;
  background: radial-gradient(ellipse, var(--atmosphere-reflection, var(--glow)), transparent 70%);
}
.visual-ambient .atmosphere-ocean-drift::after { display: none; }

/* Haze is static depth; blur is never animated. */
.atmosphere-haze {
  position: absolute; inset: 16% 8%; opacity: .45; filter: blur(24px);
  background: radial-gradient(ellipse at 68% 30%, var(--glow), transparent 68%);
}
.atmosphere-orbit-drift { transform-box: fill-box; transform-origin: center; }
.atmosphere-star-breathe {
  position: absolute; top: 22%; left: 18%; width: 3px; height: 3px;
  border-radius: 50%; background: var(--starlight); opacity: .45;
}
.atmosphere-star-breathe--late { top: 58%; left: 72%; width: 2px; height: 2px; }
.atmosphere-star-breathe--later { top: 84%; left: 46%; width: 2px; height: 2px; }
.atmosphere-glare { position: absolute; inset: 0; overflow: clip; pointer-events: none; }
.atmosphere-glare::before {
  content: ""; position: absolute; inset: -10% auto -10% 0; width: 55%;
  background: linear-gradient(110deg, transparent 30%, var(--accent-soft) 50%, transparent 70%);
  filter: blur(16px); transform: translateX(-180%); opacity: 0; pointer-events: none;
}

/* Positive motion gate: unsupported preferences and quiet hosts remain static. */
@media (prefers-reduced-motion: no-preference) {
  :is(.visual-ambient, .visual-expressive) .atmosphere-ocean-drift::before {
    animation: atmosphere-ocean-drift 76s ease-in-out infinite;
  }
  .visual-expressive .atmosphere-ocean-drift::after {
    animation: atmosphere-ocean-drift 112s ease-in-out -37s infinite reverse;
  }
  .visual-ambient .atmosphere-ocean-drift::before { animation-duration: 112s; }
  .visual-expressive .atmosphere-orbit-drift { animation: atmosphere-orbit-drift 120s linear infinite; }
  :is(.visual-ambient, .visual-expressive) .atmosphere-star-breathe {
    animation: atmosphere-starlight-breathe 12s ease-in-out -3s infinite;
  }
  :is(.visual-ambient, .visual-expressive) .atmosphere-star-breathe--late {
    animation-duration: 17s; animation-delay: -11s;
  }
  :is(.visual-ambient, .visual-expressive) .atmosphere-star-breathe--later {
    animation-duration: 19s; animation-delay: -7s;
  }
  .visual-expressive .atmosphere-glare::before { animation: atmosphere-soft-glare 90s linear infinite; }
}
@keyframes atmosphere-ocean-drift {
  0%, 100% { transform: translate(-5%, -3%); }
  50% { transform: translate(5%, 3%); }
}
@keyframes atmosphere-orbit-drift {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
@keyframes atmosphere-starlight-breathe {
  0%, 100% { opacity: .45; }
  50% { opacity: .65; }
}
@keyframes atmosphere-soft-glare {
  0%, 85% { transform: translateX(-180%); opacity: 0; }
  87% { transform: translateX(-180%); opacity: .35; }
  97% { transform: translateX(220%); opacity: .35; }
  100% { transform: translateX(220%); opacity: 0; }
}
@media (max-width: 600px) {
  .atmosphere-ocean-drift::after { display: none; }
  .atmosphere-haze { display: none; }
}
/* Remove ambient motion outright, including pseudo-elements. */
@media (prefers-reduced-motion: reduce) {
  .atmosphere-layer *, .atmosphere-layer::before, .atmosphere-layer::after,
  .atmosphere-ocean-drift::before, .atmosphere-ocean-drift::after,
  .atmosphere-orbit-drift, .atmosphere-star-breathe, .atmosphere-glare::before {
    animation: none !important;
  }
}
@media (forced-colors: active) {
  .atmosphere-layer, .atmosphere-orbit-drift, .atmosphere-star-breathe,
  .atmosphere-glare, .atmosphere-haze { display: none !important; }
}

/* Page compositions reuse local identity fields, never cover offers or checkout. */
/* Open hero space carries the sky/water; the mark retains clear geometry. */
.home-atmosphere { inset: 0 0 -72px; background: none; --atmosphere-base: var(--bg); }
.home-atmosphere::before { top: 30%; right: 38%; width: 65%; height: 60%; }
.home-atmosphere::after { bottom: 4%; left: 8%; width: 78%; height: 32%; }
.home-atmosphere > .atmosphere-star-breathe { top: 7%; left: 24%; }
.home-atmosphere > .atmosphere-star-breathe--late { top: 12%; left: 62%; background: var(--accent); }
.home-atmosphere > .atmosphere-star-breathe--later { top: 88%; left: 18%; }
.home-atmosphere > .home-star-edge { top: 77%; left: 94%; width: 2px; height: 2px; background: var(--accent); }
.home-atmosphere > .home-star-near { top: 92%; left: 55%; width: 2px; height: 2px; }
@media (prefers-reduced-motion: no-preference) {
  .visual-expressive .home-star-edge { animation-duration: 14s; animation-delay: -5s; }
  .visual-expressive .home-star-near { animation-duration: 16s; animation-delay: -13s; }
}
.workbench-atmosphere { inset: 0 0 0 auto; width: min(100%, 440px); opacity: .85; }
.workbench-atmosphere .atmosphere-orbit-drift { animation-duration: 160s; }
@media (max-width: 700px) {
  .home-atmosphere { inset: 0 0 -32px; opacity: .65; }
  .home-atmosphere::before { top: 32%; right: 20%; width: 85%; }
  .home-atmosphere::after, .home-atmosphere .atmosphere-star-breathe--later,
  .home-atmosphere .home-star-edge, .home-atmosphere .home-star-near { display: none; }
  .workbench-atmosphere .atmosphere-star-breathe--later,
  .workbench-star-edge, .workbench-star-near { display: none; }
}

/* Services gets one bounded introduction glow; catalogue geometry stays still. */
.services-atmosphere { left: auto; }

/* Workbench is a clear orbital vignette: no broad glow or blurred currents. */
.workbench-atmosphere .atmosphere-star-breathe {
  --star-light: var(--starlight); background: var(--star-light);
  box-shadow: 0 0 8px color-mix(in srgb, var(--star-light) 35%, transparent);
}
.workbench-atmosphere > .atmosphere-star-breathe--late { --star-light: var(--accent); }
.workbench-atmosphere > .atmosphere-star-breathe--later { top: 82%; left: 46%; }
.workbench-atmosphere > .workbench-star-edge { top: 42%; left: 94%; width: 2px; height: 2px; --star-light: var(--accent); }
.workbench-atmosphere > .workbench-star-near { top: 14%; left: 42%; width: 2px; height: 2px; }
@media (prefers-reduced-motion: no-preference) {
  .visual-expressive .workbench-atmosphere > .atmosphere-star-breathe { animation-duration: 8s; }
  .visual-expressive .workbench-atmosphere > .atmosphere-star-breathe--late { animation-duration: 11s; animation-delay: -6s; }
  .visual-expressive .workbench-atmosphere > .atmosphere-star-breathe--later { animation-duration: 13s; animation-delay: -9s; }
  .visual-expressive .workbench-atmosphere > .workbench-star-edge { animation-duration: 10s; animation-delay: -4s; }
  .visual-expressive .workbench-atmosphere > .workbench-star-near { animation-duration: 15s; animation-delay: -12s; }
}