/* Broadcast controls: the arena and the players carry the colour. */
#touch-controls {
  background:#fbfdff; color:#0c204a; border:1px solid #fff;
  box-shadow:0 4px 18px #10295820; border-radius:28px;
  max-width:550px; padding:10px 10px 10px 18px; gap:16px;
}
#touch-controls .touch-heading { color:#0c204a; letter-spacing:0; font-size:11px; }
#touch-power-label { color:#0c204a; }
#touch-controls>button {
  background:#ff7115; color:#fff; border:0; border-radius:24px;
  box-shadow:0 2px 0 #e75b08; min-height:64px;
}
#touch-controls>button:active { background:#eb600d; }
#touch-controls>button:disabled { background:#19345b; color:#fff; border:0; box-shadow:none; }
#touch-power::-webkit-slider-runnable-track {
  height:14px; background:linear-gradient(90deg,#ff7115 0%,#ff7115 var(--power-progress,44.44%),#d4ddef var(--power-progress,44.44%),#d4ddef 100%); box-shadow:none;
}
#touch-power::-webkit-slider-thumb { background:#ff7115; border:3px solid #fff; margin-top:-9px; box-shadow:0 1px 4px #10295830; }
#touch-power::-moz-range-track { height:14px; background:#d4ddef; }
#touch-power::-moz-range-progress { height:14px; background:#ff7115; }
#touch-power::-moz-range-thumb { background:#ff7115; border-color:#fff; }
#mobile-settings {
  position:fixed; top:max(12px,env(safe-area-inset-top)); right:max(12px,env(safe-area-inset-right)); z-index:90;
}
#mobile-settings #mobile-settings-toggle {
  width:44px; height:44px; border:0; background:#fbfdff; color:#0c204a;
  font:900 20px/1 system-ui; box-shadow:0 2px 10px #10295815; border-radius:14px;
}
#mobile-settings #mobile-settings-panel {
  position:absolute; top:52px; right:0; display:flex; flex-wrap:wrap; justify-content:center;
  gap:8px; padding:12px; width:120px; background:#fbfdff; border:0;
  box-shadow:0 8px 24px #12233b22; border-radius:18px;
}
#mobile-settings #mobile-settings-panel[hidden] { display:none; }
#mobile-settings-panel small { flex:0 0 100%; text-align:center; font:700 11px 'Nunito',sans-serif; color:#435477; }
#mobile-settings #music-mute, #mobile-settings #unity-fullscreen-button {
  position:static!important; width:48px; height:48px; opacity:1; pointer-events:auto; border:1px solid #d4ddef;
}
@media(orientation:landscape) and (max-height:540px) {
  #touch-controls { left:auto; width:min(490px,70vw); margin:0; padding-block:7px; }
  #touch-controls>button { min-height:54px; }
}