.game-utilities { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; max-width: 100%; }
.game-utilities > [data-game-music] { display: inline-grid; place-items: center; flex: 0 0 44px; width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0; border: 1px solid #758097; border-radius: 8px; background: #141c2a; color: #e6ff9b; font: 24px/1 sans-serif; cursor: pointer; position: relative; touch-action: manipulation; }
.game-utilities > [data-game-music]:hover { border-color: #e6ff9b; }
.game-utilities > [data-game-music]:focus-visible { outline: 3px solid #dafa63; outline-offset: 3px; }
[data-game-music]::before { content: '♫'; }
[data-game-music][data-music-state='off']::after,
[data-game-music][data-music-state='unavailable']::after { content: ''; position: absolute; width: 26px; height: 2px; background: currentColor; transform: rotate(-45deg); box-shadow: 0 1px #141c2a; }
[data-game-music][data-music-state='retry']::after { content: '!'; position: absolute; right: 4px; top: 3px; font: bold 12px/1 sans-serif; }
[data-game-music]:disabled { opacity: .6; cursor: default; }
[data-fullscreen-region='head'] { flex-wrap: wrap; gap: 6px; }
.runner-hud .game-utilities { align-self: center; }
@media (max-width: 650px) {
  .runner-hud { flex-wrap: wrap; }
  .runner-hud .game-utilities { gap: 4px; }
  .runner-game { grid-template-rows: auto minmax(0, 1fr) 100px; }
}
@media (max-height: 540px) and (orientation: landscape) {
  .runner-game { grid-template-rows: auto minmax(0, 1fr) 52px; }
}