/* Gameplay polish pass: correct canvas ratios, improve player readability and keep game-first layouts stable. */
body[data-game="match"] .game-layout{grid-template-columns:minmax(0,780px) 320px;justify-content:center}
body[data-game="match"] .game-panel{min-width:0}
body[data-game="match"] .canvas-box{aspect-ratio:1/1!important;max-width:780px;width:100%;margin:0 auto}
body[data-game="match"] .canvas-box canvas{width:100%!important;height:100%!important;aspect-ratio:1/1!important}

.snake-you-legend{position:absolute;z-index:8;left:12px;top:12px;display:flex;align-items:center;gap:7px;padding:6px 9px;border:1px solid rgba(126,240,223,.55);border-radius:999px;background:rgba(4,20,27,.78);color:#ecfffb;font-size:10px;font-weight:950;letter-spacing:.08em;pointer-events:none;box-shadow:0 8px 24px rgba(0,0,0,.28)}
.snake-you-legend i{width:9px;height:9px;border-radius:50%;background:#72f2df;box-shadow:0 0 12px #72f2df}
.snake-you-legend span{color:#86a8af;font-weight:800;letter-spacing:0}
.snake-you-legend.pulse{animation:youPulse .8s ease-in-out 3}
@keyframes youPulse{50%{transform:scale(1.06);border-color:#e9fff9;box-shadow:0 0 0 5px rgba(111,236,216,.12)}}

/* Robust fallback and simple grid for Merge v3. */
.merge-loading-fallback{width:min(900px,94vw);margin:48px auto;padding:28px;border:1px solid #244650;border-radius:16px;background:#0a1821;color:#dff8f3;text-align:center}
.merge-loading-fallback h1{font-size:30px;margin:0 0 8px}.merge-loading-fallback p{margin:0;color:#819aa2}
body[data-game="merge-v3"] .merge-board{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;grid-template-rows:repeat(5,minmax(0,1fr))!important;gap:8px!important;padding:8px!important;position:relative!important}
body[data-game="merge-v3"] .merge-board .merge-cell{position:relative!important;inset:auto!important;grid-row:auto;grid-column:auto;min-height:0}
body[data-game="merge-v3"] .merge-board .merge-cell.tile{animation:mergeV3Spawn .16s ease-out}
body[data-game="merge-v3"] .merge-board.move{animation:mergeBoardNudge .13s ease-out}
body[data-game="merge-v3"] .merge-board .merge-cell.fused{animation:mergeV3Fuse .24s cubic-bezier(.2,.9,.25,1)}
@keyframes mergeV3Spawn{from{opacity:.25;transform:scale(.72)}to{opacity:1;transform:scale(1)}}
@keyframes mergeV3Fuse{0%{transform:scale(.86);filter:brightness(1.5)}60%{transform:scale(1.12)}100%{transform:scale(1);filter:none}}
@keyframes mergeBoardNudge{50%{transform:scale(.992)}}

/* Quest and Blaster get a cleaner playfield focus. */
body[data-game="quest"] .canvas-box,body[data-game="blaster"] .canvas-box{background:#07131a}
body[data-game="blaster"] .canvas-box{cursor:crosshair}

@media(max-width:1000px){body[data-game="match"] .game-layout{grid-template-columns:1fr}}
@media(max-width:720px){
  body[data-game="match"] .canvas-box{max-width:none}
  .snake-you-legend{left:8px;top:8px;font-size:9px;padding:5px 7px}
  body[data-game="merge-v3"] .merge-board{gap:5px!important;padding:5px!important}
}
@media(prefers-reduced-motion:reduce){.snake-you-legend,.merge-board,.merge-cell{animation:none!important}}