.memory-shell { max-width: 480px; }
.memory-shell h1 { font-size: clamp(25px, 7vw, 38px); margin: 12px 0; }
.memory-shell #lives { font-size: 18px; letter-spacing: 1px; }
.memory-stage { margin: 14px 0 5px; text-align: center; font-size: 14px; font-weight: 900; color: #fff0ba; }
.memory-progress { margin: 0; text-align: center; color: #d2eaff; font-size: 12px; }
.memory-status { min-height: 40px; margin: 10px 0; text-align: center; font-size: 12px; line-height: 1.6; color: #e3f2ff; }
.memory-board { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; width: min(100%, max(196px, calc(100svh - 360px))); margin-inline: auto; }
.memory-shell .memory-pad { min-height: 88px; min-width: 88px; aspect-ratio: 1; font: 900 42px ui-rounded, system-ui, sans-serif; touch-action: manipulation; cursor: pointer; border-radius: 24px; color: #d6efff; }
.memory-shell .memory-pad.memory-lit { border-color: #fff4ce; background: linear-gradient(155deg, #fff8da, #efd990 60%, #d4ae61); color: #20394d; box-shadow: inset 0 3px #fff9, inset 0 -4px #bc9453, 0 0 18px #ead98d66; }
.memory-pad:focus-visible { outline: 3px solid #fff4ce; outline-offset: 3px; }
.memory-shell .memory-pad:disabled { cursor: default; }
.memory-note { font-size: 11px; line-height: 1.7; color: #d0e2ef; text-align: center; }
@media (max-height: 720px) {
  .memory-board { width: min(100%, max(196px, calc(100svh - 420px))); }
  .memory-shell h1 { margin: 8px 0; font-size: 25px; }
  .memory-stage { margin-top: 8px; }
  .memory-status { margin: 7px 0; min-height: 38px; }
}