/* Small screens scroll naturally, including landscape and browser toolbars. */
html{min-width:280px;overflow-x:hidden;-webkit-text-size-adjust:100%}
body{min-height:100vh;min-height:100svh;overflow-x:hidden}
header,main,footer{width:100%;min-width:0}
header{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
main{padding-bottom:max(24px,env(safe-area-inset-bottom))}
button,input,select,textarea{font-size:16px}
.mode{min-height:80px}
dialog{max-height:85vh;max-height:85dvh;overflow:auto;overscroll-behavior:contain}
#board-wrap{width:100%;min-width:0}
.tile{overflow:hidden}
.tile img{display:block;width:100%;height:100%;position:absolute;inset:0}
.load-status{margin:8px 0;padding:12px;border:1px solid var(--line);border-radius:8px;font-size:13px;line-height:1.7}
.load-status button{margin-left:10px}
.save-actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.save-actions button{min-height:44px;padding:9px 12px;font-size:14px}
#save-text{font-size:13px;min-height:110px;overflow-wrap:anywhere}
#save-status{line-height:1.8;font-size:12px}
@media(max-width:700px),(max-height:500px){
 #home{min-height:0;gap:8px}
 #board-wrap{max-width:760px;padding:12px}
 header{padding-top:12px;padding-bottom:12px;gap:10px;flex-wrap:wrap}
 main{padding-left:12px;padding-right:12px}
 h1{font-size:clamp(25px,7vw,32px);line-height:1.45}
 .brand{font-size:23px;letter-spacing:2px;gap:8px}
 .brand small{letter-spacing:1px;font-size:9px}
 nav{gap:8px;margin-left:auto}nav button,nav a{min-height:44px;display:inline-flex;align-items:center;padding:8px}
 .intro .subtitle{margin:8px 0}.sample img{width:60px;height:60px}.sample{margin:0}
 .mode{margin:10px 0;padding:16px;gap:14px}.mode h2{font-size:22px}
 .game-top{flex-wrap:wrap;gap:8px}.game-top>span{margin-left:auto}
 .stats{padding:10px 6px;gap:5px}.stats strong{font-size:23px}
 #board{gap:3px}.tile{aspect-ratio:1/1}
 .tools button{min-height:44px}.tools{gap:6px}
 #settings-dialog{max-height:85vh;max-height:85dvh;padding:20px}
 .form-grid{grid-template-columns:1fr}
}
@media(max-width:340px){.brand small{display:none}.seal{font-size:20px}.stats strong{font-size:20px}.mode p{font-size:11px}}