/* Balanced play layout: a large board without hiding the start menu or shop. */
html,body{min-height:100%;background:#eef0dd}body{overflow:auto}.wrap{max-width:1220px;height:auto;padding:16px 20px 28px}.top{position:sticky;z-index:12;top:10px;left:auto;translate:0 0;width:auto;margin:0;padding:10px 14px;border-radius:22px;background:#fffbedf2}.layout{display:grid;height:auto;margin-top:18px;grid-template-columns:minmax(0,760px) minmax(270px,1fr);gap:22px}.play-column{display:block;height:auto}.game{width:100%;height:auto;aspect-ratio:auto;margin:0;border:6px solid #99713f;border-radius:25px;box-shadow:0 0 0 2px #ddc28d,0 8px 0 #7f5e3322,0 18px 35px #4b633422}.board-wrap{width:100%;height:auto;aspect-ratio:630/665}.board-wrap canvas{width:100%;height:100%;aspect-ratio:630/665}.panel{display:block;border-radius:24px}.journey{top:10px;width:223px}.play-tools{position:static;left:auto;bottom:auto;translate:0 0;margin:15px auto 12px}.controls{position:static;right:auto;bottom:auto;scale:1;transform:none;margin:0 auto}.control-hint{display:block}.overlay{position:absolute;padding:18px;background:#244831a8}.modal{max-width:420px}.cover{height:145px}.shop-screen{position:absolute;z-index:4;inset:0;padding:14px;background:#1f4731c9}.shop-modal{max-height:100%}.shop-button{min-height:64px}.top .stats{width:auto}.stat{min-width:70px;padding:7px 10px}.stat strong{font-size:23px}.brand-name{font-size:26px}
@media(max-width:980px) and (min-width:781px){.wrap{padding:14px}.layout{grid-template-columns:minmax(0,1fr) 270px;gap:16px}.stat{min-width:58px;padding:6px}.stat strong{font-size:19px}.brand-name{font-size:22px}}
@media(max-width:780px){body{overflow:auto}.wrap{height:auto;padding:8px 10px 20px}.top{position:static;margin:0;border-radius:18px}.layout{display:block;height:auto;margin-top:12px}.play-column{display:block;height:auto}.game{width:min(100%,calc((100dvh - 250px)*630/665 + 12px));min-width:0;margin:auto;border-radius:19px;border-width:5px}.board-wrap{aspect-ratio:630/665}.play-tools{position:static;margin:12px auto 10px}.controls{position:static;scale:1;margin:0 auto}.control-hint{display:block}.overlay{position:absolute;padding:12px}.shop-screen{position:absolute;padding:10px}.shop-modal{max-height:100%}.panel{display:none}.top .stats{width:100%}.shop-button{min-height:52px}}
/* Keep menus and touch controls reachable on short phone screens. */
@media(max-width:900px) and (max-height:650px){
  .board-wrap{isolation:auto}
  .overlay{position:fixed;z-index:30;padding:8px;inset:0}
  .overlay .modal{max-height:calc(100dvh - 16px);padding:10px 12px}
  .overlay .cover{height:clamp(48px,16dvh,90px)}
  .overlay .modal h1{font-size:20px;margin:7px 0 5px}
  .overlay .modal>p{font-size:9px;line-height:1.4;margin:5px 0}
  .overlay .shop-button{min-height:38px;margin-top:5px;padding:3px 10px}
  .overlay .shop-button img{width:28px;height:30px}
  .overlay .modal-hint,.overlay .modal-eyebrow{display:none}
  .game{width:min(100%,calc(max(80px,100dvh - 330px)*630/665 + 10px))}
}
@media(min-width:781px) and (max-width:900px) and (max-height:650px){
  .top{position:static}.layout{display:block;margin-top:8px}.panel{display:none}
  .play-column{display:grid;grid-template-columns:minmax(0,1fr) 210px;grid-template-rows:auto 1fr auto;align-items:center;gap:8px 16px}
  .game{grid-column:1;grid-row:1/4;width:min(100%,calc((100dvh - 110px)*630/665 + 12px));margin:auto}
  .play-tools,.controls,.control-hint{grid-column:2;margin:0 auto}
}
