body{padding-bottom:env(safe-area-inset-bottom)}
header{flex-wrap:wrap;gap:16px;padding-top:max(18px,env(safe-area-inset-top))}
.install-app{border:1px solid #214d40;border-radius:24px;background:transparent;color:var(--ink);font:600 14px 'DM Sans',Arial,sans-serif;padding:10px 16px;min-height:44px;cursor:pointer}
.install-dialog{max-height:calc(100dvh - 32px);overflow:auto;padding:28px}
.install-dialog h2{font-size:30px;letter-spacing:-1px}
.install-dialog .small{font-size:13px}
button,a,input,select{touch-action:manipulation}
#accountForm input{width:100%;min-height:48px;padding:10px 12px;font:16px 'DM Sans',Arial,sans-serif;color:var(--ink);border:1px solid #c9d0bd;border-radius:8px;background:#fffdf7}
#register,#logout,#retryScore{min-height:44px;padding:10px 14px;border:1px solid #c9d0bd;border-radius:8px;background:transparent;color:var(--ink);font:inherit;cursor:pointer}
@media(max-width:760px){
 .layout{grid-template-columns:minmax(0,1fr)}
 #board{width:100%}
 #undo,#flip,#resign{min-height:44px}
 header{gap:12px;padding-left:16px;padding-right:16px}
 header>a:not(.brand){font-size:14px}
 .brand{font-size:16px}.brand-icon{font-size:32px}
 main{padding-left:16px;padding-right:16px}
 .heading{padding-top:22px}.heading h1{font-size:36px}
 .panel select,.search input{font-size:16px;min-height:44px}
 .filters button{min-height:44px}
 .install-app{padding:8px 14px}
}
@media(max-width:360px){.game-content{padding:10px}.game h3{font-size:20px}.game-art{font-size:48px}.piece{font-size:26px}}
