#localResultInfo { padding: 10px; margin-bottom: 12px; border: 1px solid #2f7898; border-radius: 8px; color: #e4f8ff; font: 13px/1.4 system-ui, sans-serif; overflow-wrap: anywhere; }
#localResultInfo button { min-height: 44px; padding: 8px 10px; margin: 4px 4px 4px 0; max-width: 100%; }
#localResultInfo button:disabled { opacity: .65; cursor: not-allowed; }
#localResultInfo p { margin: 6px 0; }
#onlineSaveReason { font-size: 12px; color: #bdd9ed; }
/* Match the existing Game Over lettering without changing HUD dimensions. */
#game-hud #scoreboard,
#highScoreInfo :is(h4, .high-score-name, .high-score-result strong, .high-score-result small, .high-score-empty),
#highScoreInfo a:not(:has(img)),
#score-point-message > p {
  font-family: 'TetrisMania', 'Arial Black', Impact, sans-serif;
  font-weight: bold;
  background: linear-gradient(45deg, magenta, cyan, yellow, lime, red);
  background-size: 300%;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: gradientAnimation 4s ease infinite;
  text-shadow: 2px 2px 3px rgb(0 0 0 / .5);
}
#highScoreInfo { font-family: 'TetrisMania', 'Arial Black', Impact, sans-serif; }
#highScoreList .high-score-result { display: inline-flex; align-items: baseline; gap: 8px; margin-left: auto; white-space: nowrap; }
#highScoreList .high-score-result strong { margin-left: 0; }
#highScoreList .high-score-result small { font-size: 9px; line-height: 1; }
#score-point-message {
  top: calc(var(--hud-height, 130px) + 18px);
  left: 50%; width: calc(100% - 56px); max-width: 560px; height: auto; max-height: none;
  transform: translateX(-50%); pointer-events: none;
}
#score-point-message.modal-zoom-in { animation: none; }
#score-point-message > p {
  margin: 0; font-size: clamp(24px, 4vw, 48px); line-height: 1.25;
  overflow-wrap: anywhere; transform-origin: center top;
  animation: gradientAnimation 4s ease infinite, scorePointsPop .6s ease-out both;
}
@keyframes scorePointsPop {
  0% { transform: scale(.55); opacity: 0; }
  65% { transform: scale(1.12); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}
#tutorial-scoreRules .score-credits {
  margin-top: 14px; padding: 14px 12px;
  border: 1px solid #2f7898; border-radius: 11px;
  background: linear-gradient(145deg, #123146, #0c2034);
  color: #bdd9ed; font: 12px/1.5 Inter, Manrope, system-ui, sans-serif;
}
#tutorial-scoreRules .score-credits h3 { margin: 0 0 4px; color: #9bf8ff; font-size: 14px; }
#tutorial-scoreRules .score-credits p { margin: 6px 0; }
.score-credits .credits-period { color: #a7ffb9; font-size: 11px; }
.score-credits dl { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 8px 12px; margin: 12px 0; }
.score-credits dt { color: #a8c4d8; }
.score-credits dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
#tutorial-scoreRules .score-credits a { color: #8ff5ff; text-decoration: underline; text-underline-offset: 3px; }
.score-credits a:focus-visible { outline: 2px solid #a7ff24; outline-offset: 3px; }
.score-credits .credits-signoff { padding-top: 10px; border-top: 1px solid #38e9ff30; }
.score-credits .credits-copyright { color: #a7ffb9; font-size: 11px; }
@media (prefers-reduced-motion: reduce) {
  #game-hud #scoreboard,
  #highScoreInfo :is(h4, a, span, strong, small),
  #score-point-message > p { animation: none; }
}
