/* v39 quick position hotfix.
   Restore the proven HUD anchors from the previous build. Sizes stay enlarged;
   gameplay geometry/canvas coordinates are untouched. */

/* Score remains geometrically centered just like before the readability pass. */
.game-shell .hud{display:block!important;grid-template:none!important;align-content:normal!important;align-items:normal!important;gap:0!important}
.game-shell .hud-top{position:relative!important;display:grid!important;grid-area:auto!important;grid-template-areas:none!important;grid-template-rows:none!important;align-items:start!important}
.game-shell .hud-top>.round-button{grid-column:1!important;justify-self:start!important}
.game-shell .hud-counters{grid-column:3!important;justify-self:stretch!important;width:auto!important}
.game-shell .hud .score-stack{
  position:absolute!important;top:-3px!important;left:50%!important;right:auto!important;
  margin:0!important;transform:translateX(-50%)!important;translate:none!important;
  justify-self:auto!important;align-self:auto!important;width:auto!important;max-width:none!important;
}

/* Desktop: keep the old anchors (18/22 px from the edges and the old Y levels),
   while retaining the new ~20% larger controls/type. */
@media (hover:hover) and (pointer:fine){
  .game-shell .hud{padding:max(18px,env(safe-area-inset-top)) 18px max(18px,env(safe-area-inset-bottom))!important}
  .game-shell .hud-top{grid-template-columns:var(--polish-pause) minmax(0,1fr) var(--polish-counter)!important;gap:10px!important;min-height:84px!important}
  .game-shell .hud .score-stack{padding:8px!important}
  .game-shell .hud .hud-sound-button{
    position:absolute!important;grid-area:auto!important;inset:auto 18px auto auto!important;
    top:max(98px,calc(env(safe-area-inset-top) + 88px))!important;
    width:var(--polish-sound)!important;height:var(--polish-sound)!important;
    justify-self:auto!important
  }
  .game-shell .hud .life-row{
    position:absolute!important;grid-area:auto!important;inset:auto!important;
    left:18px!important;top:max(98px,calc(env(safe-area-inset-top) + 88px))!important;
    justify-self:auto!important
  }
  .game-shell .hud .wave-meter{
    position:absolute!important;grid-area:auto!important;inset:auto!important;
    left:50%!important;top:max(111px,calc(env(safe-area-inset-top) + 101px))!important;
    width:max-content!important;max-width:none!important;transform:translateX(-50%)!important;translate:none!important;
    flex-wrap:nowrap!important;justify-content:flex-start!important
  }

  /* Pause menu was visually behind the rest of the enlarged desktop UI. */
  .game-shell .pause-overlay .modal-card.compact{
    width:min(500px,100%)!important;padding:29px!important;border-radius:32px!important
  }
  .game-shell .pause-app-icon{width:112px!important;height:112px!important;border-radius:25px!important}
  .game-shell .pause-overlay .modal-card.compact>h2{font-size:42px!important;margin:15px 0 20px!important}
  .game-shell .pause-overlay .modal-card.compact>.primary-button,
  .game-shell .pause-overlay .modal-card.compact>.plain-button{
    height:79px!important;min-height:79px!important;border-radius:22px!important;font-size:22px!important
  }
  .game-shell .pause-overlay .modal-card.compact>.plain-button{margin-top:15px!important}
  .game-shell .pause-settings{gap:16px!important;margin-top:20px!important}
  .game-shell .pause-settings .pause-volume-setting>button,
  .game-shell .pause-settings>button{
    height:69px!important;min-height:69px!important;padding:9px 10px!important;
    border-radius:19px!important;font-size:19px!important;line-height:1.15!important
  }
  .game-shell .volume-control{gap:9px!important;margin-top:10px!important}
  .game-shell .volume-control input[type="range"]{height:29px!important}
  .game-shell .volume-control input[type="range"]::-webkit-slider-runnable-track{height:9px!important}
  .game-shell .volume-control input[type="range"]::-moz-range-track{height:9px!important}
  .game-shell .volume-control input[type="range"]::-webkit-slider-thumb{width:28px!important;height:28px!important;margin-top:-10px!important}
  .game-shell .volume-control input[type="range"]::-moz-range-thumb{width:24px!important;height:24px!important}

  /* Center the artwork inside the achievements shortcut instead of nudging the icon. */
  .game-shell .menu-achievement-shortcut{display:grid!important;place-items:center!important;padding:0!important}
  .game-shell .menu-achievement-shortcut img{
    position:static!important;inset:auto!important;display:block!important;
    width:82%!important;height:82%!important;object-fit:contain!important;
    margin:0!important;transform:none!important
  }
}

@media (hover:hover) and (pointer:fine) and (min-height:760px){
  .game-shell .hud{padding:max(18px,env(safe-area-inset-top)) 18px max(18px,env(safe-area-inset-bottom))!important}
  .game-shell .hud-top{min-height:98px!important}
  .game-shell .hud .hud-sound-button{
    inset:auto 22px auto auto!important;
    top:max(112px,calc(env(safe-area-inset-top) + 102px))!important
  }
  .game-shell .hud .life-row{left:22px!important;top:max(112px,calc(env(safe-area-inset-top) + 102px))!important}
  .game-shell .hud .wave-meter{top:max(128px,calc(env(safe-area-inset-top) + 118px))!important}
}

/* Phones/tablets: restore the original HUD layout completely. The only requested
   mobile gameplay enlargement is the music/mute control and its note. */
@media (hover:none), (pointer:coarse){
  .game-shell .hud{
    display:block!important;padding:max(14px,env(safe-area-inset-top)) 15px max(14px,env(safe-area-inset-bottom))!important
  }
  .game-shell .hud-top{
    position:relative!important;display:grid!important;grid-template-columns:59px 1fr 88px!important;
    grid-template-rows:none!important;grid-template-areas:none!important;gap:7px!important;min-height:72px!important
  }
  .game-shell .hud .round-button{width:55px!important;height:55px!important;border-radius:19px!important;font-size:22px!important}
  .game-shell .hud .score-stack{
    position:absolute!important;top:-3px!important;left:50%!important;right:auto!important;
    margin:0!important;padding:6px 12px!important;transform:translateX(-50%)!important;translate:none!important;
    width:auto!important;max-width:none!important;min-width:118px!important
  }
  .game-shell .hud .score-value{font-size:var(--hud-score-fit,clamp(42px,11vw,62px))!important}
  .game-shell .hud .hud-counters{grid-column:3!important;width:auto!important;max-width:none!important}
  .game-shell .hud .hud-sound-button{
    position:absolute!important;grid-area:auto!important;inset:auto 15px auto auto!important;
    top:max(74px,calc(env(safe-area-inset-top) + 66px))!important;
    width:46px!important;height:46px!important;border-radius:15px!important;justify-self:auto!important
  }
  .game-shell .hud .life-row{
    position:absolute!important;grid-area:auto!important;inset:auto!important;
    left:14px!important;top:max(72px,calc(env(safe-area-inset-top) + 58px))!important;
    padding:5px 7px!important;gap:3px!important;border-radius:17px!important;justify-self:auto!important
  }
  .game-shell .hud .life-ball{width:28px!important;height:28px!important}
  .game-shell .hud .wave-meter{
    position:absolute!important;grid-area:auto!important;inset:auto!important;
    left:50%!important;top:max(82px,calc(env(safe-area-inset-top) + 68px))!important;
    width:max-content!important;max-width:none!important;transform:translateX(-50%)!important;translate:none!important;
    display:flex!important;flex-wrap:nowrap!important;justify-content:flex-start!important;gap:5px!important
  }
  .game-shell .hud .wave-meter span{width:15.5px!important;height:5.5px!important;flex:0 0 15.5px!important}
  .game-shell .hud-sound-button>.music-note-glyph{width:56%!important;height:56%!important}
}

/* Final collision/legibility tune: the progress dashes keep their proven compact
   footprint so the larger life and score controls do not visually collide. */
@media (hover:hover) and (pointer:fine){
  .game-shell .hud .wave-meter{gap:7px!important}
  .game-shell .hud .wave-meter span{width:18px!important;height:7px!important;flex:0 0 18px!important}
  .game-shell .pause-settings>button:last-child{
    height:69px!important;min-height:69px!important;font-size:19px!important;
    border-radius:19px!important;padding:9px 10px!important
  }
  .game-shell .pause-overlay .menu-home-glyph{width:31px!important;height:31px!important;flex:0 0 31px!important}
}
@media (hover:hover) and (pointer:fine) and (min-height:760px){
  .game-shell .hud .wave-meter span{width:21px!important;height:8px!important;flex-basis:21px!important}
}

/* Enlarged record text needs a little more vertical clearance before the mute button. */
@media (hover:hover) and (pointer:fine){
  .game-shell .hud .hud-sound-button{top:max(122px,calc(env(safe-area-inset-top) + 112px))!important}
}
@media (hover:hover) and (pointer:fine) and (min-height:760px){
  .game-shell .hud .hud-sound-button{top:max(140px,calc(env(safe-area-inset-top) + 130px))!important}
}
/* Only compact desktop courts need the center progress meter lower; wide courts keep
   the original vertical anchor. This prevents a collision with the larger lives row. */
@container court (max-width:420px){
  @media (hover:hover) and (pointer:fine){
    .game-shell .hud .wave-meter{top:max(166px,calc(env(safe-area-inset-top) + 156px))!important}
  }
}

/* Compact desktop court: preserve the same anchors, but cap the two center/right
   readouts just enough to prevent overlap inside a 360-420 px game shell. */
@container court (max-width:420px){
  @media (hover:hover) and (pointer:fine){
    .game-shell{--polish-counter:118px;--polish-score:82px;--polish-star:50px;--polish-star-type:22px;--polish-best:14px;--polish-best-value:20px}
    .game-shell .hud .star-pill{padding-inline:8px!important;gap:6px!important}
    .game-shell .hud .score-caption{font-size:15px!important;margin-top:8px!important}
  }
}

/* Very short desktop embeds still get larger pause controls, but keep the whole
   pause menu usable without hiding the last row below the fold. */
@media (hover:hover) and (pointer:fine) and (max-height:700px){
  .game-shell .pause-overlay .modal-card.compact{padding:21px!important;border-radius:28px!important}
  .game-shell .pause-app-icon{width:90px!important;height:90px!important;border-radius:21px!important}
  .game-shell .pause-overlay .modal-card.compact>h2{font-size:36px!important;margin:10px 0 14px!important}
  .game-shell .pause-overlay .modal-card.compact>.primary-button,
  .game-shell .pause-overlay .modal-card.compact>.plain-button{height:70px!important;min-height:70px!important;font-size:20px!important;border-radius:20px!important}
  .game-shell .pause-overlay .modal-card.compact>.plain-button{margin-top:11px!important}
  .game-shell .pause-settings{gap:11px!important;margin-top:14px!important}
  .game-shell .pause-settings .pause-volume-setting>button,
  .game-shell .pause-settings>button,
  .game-shell .pause-settings>button:last-child{height:58px!important;min-height:58px!important;font-size:17px!important;border-radius:17px!important}
  .game-shell .volume-control{margin-top:6px!important;gap:6px!important}
  .game-shell .volume-control input[type="range"]{height:24px!important}
  .game-shell .volume-control input[type="range"]::-webkit-slider-thumb{width:24px!important;height:24px!important;margin-top:-8px!important}
  .game-shell .pause-overlay .menu-home-glyph{width:28px!important;height:28px!important;flex-basis:28px!important}
}
@container court (max-width:420px){
  @media (hover:hover) and (pointer:fine){
    .game-shell{--polish-counter:112px}
  }
}
@container court (max-width:420px){
  @media (hover:hover) and (pointer:fine){
    .game-shell .hud{--polish-score:82px;--polish-star:50px;--polish-star-type:22px;--polish-best:14px;--polish-best-value:20px}
    .game-shell .hud-top{grid-template-columns:var(--polish-pause) minmax(0,1fr) 112px!important}
    .game-shell .hud-counters{width:112px!important}
  }
}