/* GT200 /play — ambient life: slow lab backdrop, drifting spotlight,
   whisper-level animation on panels. All pointer-transparent, all
   disabled under prefers-reduced-motion. */

.bg-backdrop, .bg-spot {
  position: fixed; inset: -6%; z-index: -1;
  pointer-events: none;
}
.bg-backdrop {
  background: url("lab-bg.jpg") center 38% / cover no-repeat, #0e0a13;
  filter: brightness(.42) saturate(.92);
  animation: bgDrift 75s ease-in-out infinite alternate;
  will-change: transform;
}
@keyframes bgDrift {
  0%   { transform: scale(1.06) translate(0, 0); }
  50%  { transform: scale(1.13) translate(-1.6%, 1.1%); }
  100% { transform: scale(1.08) translate(1.4%, -0.9%); }
}

/* moving spotlight + vignette over the backdrop */
.bg-spot {
  inset: 0;
  background:
    radial-gradient(46% 60% at 30% 42%, rgba(255, 214, 150, .10), transparent 62%),
    radial-gradient(120% 100% at 50% 50%, transparent 42%, rgba(6, 4, 12, .58) 100%);
  animation: spotSweep 48s ease-in-out infinite alternate;
  will-change: transform, opacity;
}
@keyframes spotSweep {
  0%   { transform: translate(-4%, -1.5%) scale(1);    opacity: .9; }
  38%  { transform: translate(3.5%, 2%)   scale(1.06); opacity: 1; }
  72%  { transform: translate(1%, -2.5%)  scale(1.02); opacity: .82; }
  100% { transform: translate(-2.5%, 1.5%) scale(1.05); opacity: .95; }
}

/* panels breathe slightly over the scene */
.stage-panel, .cloud-panel, .tool-card, .sell, .meters .meter {
  background-color: rgba(21, 16, 32, .88);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}
.tool-card { background-image: linear-gradient(180deg, rgba(26, 20, 40, .92), rgba(15, 11, 26, .92)); }

/* spectrum hairline slowly shimmers */
.spec-rule {
  background-size: 220% 100%;
  animation: specSheen 14s ease-in-out infinite alternate;
}
@keyframes specSheen { from { background-position: 0% 0; } to { background-position: 100% 0; } }

/* the primary button glows softly, slowly */
.btn-primary { animation: btnGlow 6.5s ease-in-out infinite; }
@keyframes btnGlow {
  0%, 100% { box-shadow: 0 0 18px rgba(217, 164, 65, .22), inset 0 1px 0 rgba(255,255,255,.5); }
  50%      { box-shadow: 0 0 34px rgba(217, 164, 65, .40), inset 0 1px 0 rgba(255,255,255,.5); }
}

/* notebook paper stays readable — solid, no backdrop-filter */
.notebook { background: var(--paper); }

@media (prefers-reduced-motion: reduce) {
  .bg-backdrop, .bg-spot, .spec-rule, .btn-primary { animation: none; }
  .bg-backdrop { transform: scale(1.08); }
}