/* MOSS body replaces the Earth hero subject. */

.quantum-stage {
  width: min(590px, 100%);
}

.quantum-stage::before {
  inset: 11%;
  background:
    radial-gradient(circle at 50% 48%, rgba(255,49,38,.20), transparent 30%),
    radial-gradient(circle at 52% 50%, rgba(75,198,229,.16), transparent 58%);
  filter: blur(32px);
}

.moss-core {
  position: absolute;
  left: 9%;
  top: 3%;
  z-index: 2;
  width: 78%;
  height: 78%;
  object-fit: cover;
  object-position: 48% center;
  border: 1px solid rgba(160,220,232,.32);
  border-radius: 3px;
  filter:
    brightness(.92)
    saturate(1.04)
    drop-shadow(0 24px 46px rgba(0,0,0,.58));
}

.moss-scanline {
  position: absolute;
  left: 22%;
  top: 15%;
  z-index: 3;
  width: 56%;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,82,55,.72), rgba(113,234,251,.55), transparent);
  box-shadow: 0 0 16px rgba(255,82,55,.48);
  animation: none;
}

.q-axis {
  inset: 8%;
}

.q-hud.h1 { left: 1%; top: 11%; }
.q-hud.h2 { right: 0; top: 39%; }
.q-hud.h3 { right: 4%; bottom: 10%; }

.q-hud.h2::before { content: "DECISION ENGINE\A"; color: var(--cyan); white-space: pre; }
.q-hud.h3::before { content: "MOSS PROTOCOL\A"; color: #ff9b61; white-space: pre; }

.quantum-hero::after {
  content: "550W DECISION ENGINE // MOSS ONLINE";
}

@keyframes mossFloat {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(-.45deg); }
  50% { transform: translate3d(0, -10px, 0) rotate(.35deg); }
}

@keyframes mossScan {
  0% { top: 15%; opacity: 0; }
  12% { opacity: 1; }
  82% { opacity: .9; }
  100% { top: 83%; opacity: 0; }
}

@media (max-width: 640px) {
  .moss-core { left: 11%; top: 11%; width: 78%; height: 78%; }
  .moss-scanline { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .moss-core, .moss-scanline { animation: none !important; }
}
