/* Keep the feedback anchor fixed; animate scale only, never its coordinates. */
.compact-game #feedback {
  left: 50%; top: 12%; width: min(42%, 260px); max-height: 30%;
  transform: translateX(-50%); padding: 4px; font-size: clamp(16px, 2.2vw, 26px);
  line-height: 1.15; overflow-wrap: anywhere; text-transform: uppercase;
  pointer-events: none; contain: layout;
}
.compact-game #feedback small {font-size: clamp(11px, 1.1vw, 14px);line-height:1.3;text-transform:none;}
.compact-game #feedback.feedback-pop {animation: feedback-safe-pop 220ms ease-out;}
@keyframes feedback-safe-pop {from{scale:.92;opacity:.8}to{scale:1;opacity:1}}
.compact-game [hidden] {display:none!important}
.compact-game .stats {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
.compact-game .stats>div {min-width:0;}
.compact-game .stats .round {margin-left:0;text-align:right;}
.compact-game #new-record {color:var(--lime);border-color:var(--lime);font-size:14px;letter-spacing:.07em;}
.compact-game .result-grid strong {color:#f4f0e7;}
.compact-game[data-game-state='finished'] .dance-stage,
.compact-game[data-game-state='challenge'] .dance-stage {display:none;}
.compact-game[data-game-state='finished'] .start-overlay,
.compact-game[data-game-state='challenge'] .start-overlay {
  left:0; padding:16px; display:flex; flex-direction:column; align-items:center;
  justify-content:flex-start; overflow-y:auto; touch-action:pan-y; gap:10px;
  background:#111119; width:100%;
}
.compact-game[data-game-state='finished'] .start-overlay h2,
.compact-game[data-game-state='challenge'] .start-overlay h2 {font-size:clamp(20px,3vw,30px);flex-shrink:0;}
.compact-game[data-game-state='finished'] #overlay-text {width:min(100%,470px);flex-shrink:0;}
.compact-game .result-grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;}
.compact-game .result-grid span {font-size:14px;letter-spacing:0;padding:6px;}
.compact-game #challenge-result {max-width:560px;color:#79bfff;font-size:14px;line-height:1.5;flex-shrink:0;}
.compact-game .secondary {background:#211e30;color:#f5f0e7;border:1px solid #706482;border-radius:8px;padding:10px 16px;min-height:44px;font-size:14px;}
.compact-game #share-score {width:min(100%,260px);flex-shrink:0;border-color:var(--lime);color:var(--lime);}
.compact-game .start-overlay button {flex-shrink:0;}
#share-dialog {color:#f5f0e7;background:#111119;border:1px solid #706482;border-radius:14px;width:min(94vw,480px);max-height:90dvh;padding:20px;overflow:auto;}
#share-dialog::backdrop {background:#000b;}
.share-heading {display:flex;gap:12px;align-items:center;justify-content:space-between;}
#share-title {font-size:24px;margin:0;}
#close-share {background:none;border:0;color:inherit;font-size:26px;min-width:44px;min-height:44px;}
#score-card-preview {display:block;width:auto;max-width:100%;height:min(42dvh,500px);margin:12px auto;}
#share-dialog .primary,#share-dialog .secondary {display:block;width:100%;min-width:0;text-align:center;text-decoration:none;margin:12px 0;}
#share-dialog label {display:block;font-size:14px;}
#challenge-link {width:100%;padding:10px;margin-top:6px;color:#f5f0e7;background:#211e30;border:1px solid #706482;border-radius:6px;font-size:14px;}
#share-message {font-size:14px;line-height:1.4;}
@media(max-height:480px){
 .compact-game .stats>div {display:block;}
 .compact-game .stats strong {font-size:16px;}
 .compact-game #feedback {top:4%;font-size:16px;}
 .compact-game #feedback small {display:block;font-size:11px;}
 .compact-game[data-game-state='finished'] .arena {min-height:280px;}
 .compact-game[data-game-state='finished'] .game-card {overflow-y:auto;}
}
@media(prefers-reduced-motion:reduce){.compact-game #feedback.feedback-pop{animation:none}}
/* Completed rounds use the inactive pad row for readable result actions. */
.compact-game[data-game-state='finished'] .game-card {grid-template-rows:46px 44px minmax(0,1fr) 0px 44px 3px;}
.compact-game[data-game-state='finished'] .touch-controls {visibility:hidden;padding:0;overflow:hidden;}
.compact-game[data-game-state='finished'] .wave-panel {padding-block:2px;}
.compact-game[data-game-state='finished'] #waveform {height:26px;}
.compact-game[data-game-state='finished'] .start-overlay {gap:8px;padding:12px;}
@media(max-width:420px){.compact-game .result-grid span{font-size:12px;}.compact-game #challenge-result{font-size:13px;}}
.compact-game[data-game-state='finished'] .arena,
.compact-game[data-game-state='challenge'] .arena {touch-action:pan-y;}
