/* The terminal's backdrop: what the glass panels sit on. Glass over plain white
   reads as nothing, so the page lives on a moving sky: drifting colour blobs,
   a few chrome and gold trinkets, and snow. Fixed, behind everything. */
.tbg { position: fixed; inset: 0; z-index: -2; overflow: hidden; pointer-events: none; background: linear-gradient(160deg, #f3f9ff 0%, #e6f3ff 38%, #efeeff 72%, #e7f5ff 100%); }
.tbg-blob { position: absolute; border-radius: 50%; filter: blur(30px); opacity: var(--o, 0.7); will-change: transform; animation: tbgDrift var(--t, 46s) ease-in-out infinite alternate; }
.tbg-blob.b1 { width: 62vmax; height: 62vmax; left: -18vmax; top: -22vmax; background: radial-gradient(circle at 50% 50%, #a6dbff 0%, rgba(166, 219, 255, 0) 68%); --o: 0.95; --t: 52s; }
.tbg-blob.b2 { width: 54vmax; height: 54vmax; right: -16vmax; top: -10vmax; background: radial-gradient(circle at 50% 50%, #d8d2ff 0%, rgba(216, 210, 255, 0) 68%); --o: 0.85; --t: 61s; animation-delay: -12s; }
.tbg-blob.b3 { width: 46vmax; height: 46vmax; left: 22vw; top: 30vh; background: radial-gradient(circle at 50% 50%, #7fcbff 0%, rgba(127, 203, 255, 0) 66%); --o: 0.6; --t: 44s; animation-delay: -20s; }
.tbg-blob.b4 { width: 58vmax; height: 58vmax; left: -12vmax; bottom: -30vmax; background: radial-gradient(circle at 50% 50%, #c4f1ff 0%, rgba(196, 241, 255, 0) 68%); --o: 0.9; --t: 57s; animation-delay: -6s; }
.tbg-blob.b5 { width: 50vmax; height: 50vmax; right: -14vmax; bottom: -24vmax; background: radial-gradient(circle at 50% 50%, #b8c8ff 0%, rgba(184, 200, 255, 0) 66%); --o: 0.8; --t: 49s; animation-delay: -30s; }
.tbg-blob.b6 { width: 34vmax; height: 34vmax; left: 52vw; top: -8vh; background: radial-gradient(circle at 50% 50%, #ffffff 0%, rgba(255, 255, 255, 0) 70%); --o: 1; --t: 39s; animation-delay: -9s; }
@keyframes tbgDrift {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(6vw, 4vh, 0) scale(1.08); }
  100% { transform: translate3d(-4vw, 8vh, 0) scale(0.94); }
}
.tbg-trk { position: absolute; width: var(--w, 140px); height: auto; opacity: var(--o, 0.95); filter: drop-shadow(0 24px 28px rgba(46, 123, 196, 0.3)); animation: tbgFloat var(--t, 11s) ease-in-out infinite alternate; will-change: transform; }
@keyframes tbgFloat {
  from { transform: translate3d(0, -12px, 0) rotate(calc(var(--r, 0deg) - 6deg)); }
  to { transform: translate3d(10px, 14px, 0) rotate(calc(var(--r, 0deg) + 6deg)); }
}
.tbg-grain { position: absolute; inset: 0; opacity: 0.06; mix-blend-mode: multiply; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E"); }
.snow { pointer-events: none; display: block; }
.snow-page { position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; z-index: -1; }
@media (max-width: 760px) {
  .tbg-trk { --w: 84px !important; }
  .tbg-trk.hide-s { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .tbg-blob, .tbg-trk { animation: none; }
}
