body { overflow: auto; }
.stage { padding: 34px 16px 110px; }
.gif { position: fixed; width: min(22vw, 280px); opacity: .85; pointer-events: none; }
.gif-one { top: 9vh; left: 1vw; }
.gif-two { right: 1vw; top: 32vh; }
.gif-three { bottom: 3vh; left: 3vw; }
.arcade { position: relative; z-index: 2; margin: 0 auto; max-width: 790px; padding: 25px;
  border: 1px solid #ffffff30; border-radius: 24px; background: #090911ec; box-shadow: 0 20px 80px #0009; }
.arcade h1 { font-size: 32px; margin: 0 0 8px; letter-spacing: -.05em; }
.hint { color: #aaaabd; font-size: 13px; line-height: 1.6; }
.game-layout { display: grid; grid-template-columns: minmax(0, 1fr) 200px; gap: 24px; margin-top: 20px; }
canvas { display: block; width: 100%; aspect-ratio: 1; background: #11111c; border: 1px solid #ffffff20; border-radius: 12px; touch-action: none; }
.toolbar { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; }
button, input { font: inherit; }
.arcade button { border: 0; border-radius: 8px; padding: 10px 15px; background:#c0ff72; color:#111; cursor:pointer; font-weight:700; }
.arcade button:disabled { opacity:.45; cursor:default; }
.arcade input { width:100%; background:#191925; color:white; border:1px solid #ffffff30; border-radius:8px; padding:10px; margin:8px 0; }
.arcade h2 { font-size:18px; margin:0 0 14px; }
#leaders { padding:0; list-style:none; font-size:14px; }
#leaders li { display:flex; gap:10px; justify-content:space-between; padding:10px 0; border-bottom:1px solid #ffffff15; }
#leaders span { overflow-wrap:anywhere; }
#game-status { min-height:42px; }
.dpad { display:flex; justify-content:center; gap:8px; margin-top:12px; }
.dpad button { min-width:45px; min-height:45px; touch-action:manipulation; }
.audio-bar { position:fixed; z-index:5; bottom:16px; right:16px; display:flex; align-items:center; gap:10px;
  border:1px solid #ffffff40; border-radius:30px; background:#101018ed; padding:8px 14px; }
.sound { position:static; flex-shrink:0; }
#volume { width:100px; accent-color:#c0ff72; }
#volume-value { min-width:38px; font-size:12px; }
@media(max-width:650px) {
 .arcade { padding:18px; } .game-layout { grid-template-columns:1fr; } .gif { width:33vw; opacity:.45; }
 .audio-bar { right:10px; bottom:10px; } .arcade h1 { font-size:27px; }
}
@media(prefers-reduced-motion:reduce) { .line { animation:none; } }
