/* ==========================================================================
   LOGANBYTE — floating sound control
   Neon 80s arcade styling, respects reduced-motion
   ========================================================================== */

.sound-control {
  position: fixed;
  right: 18px;
  bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 80;
  min-height: 46px;
  padding: 10px 18px;
  border: 2px solid var(--neon-cyan);
  background: rgba(10, 14, 32, 0.96);
  color: #b8f6ff;
  border-radius: 10px;
  font: 700 11.5px/1.35 "Press Start 2P", monospace;
  letter-spacing: .08em;
  cursor: pointer;
  box-shadow: 0 4px 22px -4px #000a,
              0 0 0 4px rgba(0, 243, 255, .1);
  text-shadow: 0 0 10px var(--neon-cyan);
  transition: all .2s linear;
  backdrop-filter: blur(8px);
}

.sound-control:hover {
  background: #1a2544;
  border-color: var(--neon-magenta);
  color: #fff;
  box-shadow: 0 4px 22px -4px #000a,
              0 0 0 4px rgba(255, 46, 178, .25);
}

.sound-control:focus-visible {
  outline: 4px solid var(--neon-amber);
  outline-offset: 5px;
}

body {
  padding-bottom: 78px;
}

@media (prefers-reduced-motion: reduce) {
  .sound-control {
    transition: none;
  }
}