/* Title-only presentation: no changes to the Phaser canvas or gameplay HUD. */
#menu.title-menu{z-index:6;background:#163c42;display:grid;place-items:center;overflow:auto}
.title-art{position:relative;width:min(100vw,177.6833vh);aspect-ratio:1672/941;flex:none}
.title-art>img{display:block;width:100%;height:100%;object-fit:contain;user-select:none;pointer-events:none}
.title-hit{position:absolute;left:3%;width:17.5%;height:8.7%;padding:0;background:transparent;border:2px solid transparent;border-radius:12px;transition:background .16s,box-shadow .16s;touch-action:manipulation}
.title-hit>span{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.title-play{top:62%}.title-settings{top:71%}.title-exit{top:79.3%}
.title-hit:hover,.title-hit:focus-visible{background:#ffdc6326;border-color:#ffedac;box-shadow:0 0 24px #ffd86f80;outline:3px solid #fff1bb;outline-offset:1px}
.title-hit:active{background:#fff0b24a}
.title-utilities{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));right:24px;display:flex;align-items:center;gap:16px;font-size:8px;letter-spacing:1.3px;text-shadow:0 2px 4px #143e31}
.title-utilities button{border:1px solid #fff1c580;background:#203e2de6;border-radius:20px;padding:12px 20px;font-size:12px;letter-spacing:0;color:#fff1c5}
body:not(.playing) header{visibility:hidden}
/* Match dialog materials to the cover without replacing their existing behavior. */
.dialog>div{background:linear-gradient(145deg,#183d3af7,#102c36fa);border:2px solid #bd914e;border-radius:16px;box-shadow:0 16px 65px #031b35a8,inset 0 0 0 4px #f9db9514}
.dialog h2{color:#ffecb5}.dialog .primary{background:linear-gradient(#ffe7a0,#e6b65b);box-shadow:0 4px 0 #91602c,0 8px 20px #081e304d}
@media(orientation:portrait){
  #menu.title-menu{display:block;background:radial-gradient(ellipse at top,#438f71,#173c38 64%,#102d35)}
  .title-art{width:100%;aspect-ratio:auto;padding-bottom:20px}
  .title-art>img{height:auto}
  .title-buttons{position:relative;display:grid;gap:12px;width:min(78%,330px);margin:30px auto 0}
  .title-hit{position:relative;inset:auto;width:100%;height:68px;border:2px solid #cb974e;border-radius:9px;background:linear-gradient(170deg,#a46e33,#70441f 65%,#5f381b);box-shadow:0 5px 0 #422d1d,inset 0 2px 0 #eccb8580;color:#fff0c1;text-shadow:0 2px 0 #56351e}
  .title-hit>span{position:static;width:auto;height:auto;overflow:visible;clip-path:none;white-space:normal;font-size:23px;font-weight:900;letter-spacing:1px}
  .title-hit small{display:block;font-size:10px;font-weight:400;letter-spacing:0;margin-top:3px}
  .title-utilities{position:relative;right:auto;bottom:auto;justify-content:center;flex-wrap:wrap;margin:12px 20px 35px}
  .title-utilities>span{width:100%;text-align:center}
}
@media(orientation:landscape) and (max-height:500px){.title-utilities{right:12px;bottom:8px}.title-utilities>span{display:none}.title-utilities button{padding:9px 14px}.title-hit{height:9%;border-radius:6px}}
@media(prefers-reduced-motion:reduce){.title-hit{transition:none}}