/* 2026-09-10 — flagship-target device/accessibility pass. Gameplay and score semantics untouched. */
:root{--ttt-safe-l:max(8px,env(safe-area-inset-left,0px));--ttt-safe-r:max(8px,env(safe-area-inset-right,0px));--ttt-safe-t:max(8px,env(safe-area-inset-top,0px));--ttt-safe-b:max(8px,env(safe-area-inset-bottom,0px))}
#frame{height:min(100%,calc(100dvh - var(--ttt-safe-t) - var(--ttt-safe-b)));max-width:calc(100vw - var(--ttt-safe-l) - var(--ttt-safe-r));max-height:calc(100dvh - var(--ttt-safe-t) - var(--ttt-safe-b))}
.hud{padding-top:max(7px,var(--ttt-safe-t));padding-left:max(9px,var(--ttt-safe-l));padding-right:max(9px,var(--ttt-safe-r))}.hud-btn{width:44px;height:44px;min-width:44px;min-height:44px}.btn,.auth-link,.nn-nudge-signup,.nn-nudge-later{min-height:44px}button,a{touch-action:manipulation}
button:focus-visible,a:focus-visible{outline:3px solid #f4df9e;outline-offset:3px}canvas#game{outline:none}
#screen-how,#screen-pause,#screen-gameover{padding:max(12px,var(--ttt-safe-t)) max(12px,var(--ttt-safe-r)) max(12px,var(--ttt-safe-b)) max(12px,var(--ttt-safe-l));overflow:auto}
#screen-how .panel,#screen-pause .panel,#screen-gameover .panel{max-height:calc(100dvh - var(--ttt-safe-t) - var(--ttt-safe-b) - 24px);overflow:auto}
@media(max-width:560px){
  #frame{width:auto;height:min(100%,calc(100dvh - var(--ttt-safe-t) - var(--ttt-safe-b)));max-width:calc(100vw - var(--ttt-safe-l) - var(--ttt-safe-r))}
  #screen-start{overflow:auto}#screen-start .panel{position:relative;inset:auto;min-height:100%;height:auto;overflow:auto;justify-content:flex-end;padding:calc(48px + var(--ttt-safe-t)) max(18px,var(--ttt-safe-r)) calc(16px + var(--ttt-safe-b)) max(18px,var(--ttt-safe-l));gap:4px}
  #screen-start .logo{font-size:clamp(2.25rem,11.5vw,3.9rem);margin:4px 0}.subtitle{margin:4px 0 7px!important}.btn{margin-bottom:6px}#screen-start .auth-row{display:flex;margin-top:3px;font-size:.7rem}#screen-start .controls-hint{display:block;margin-top:2px;font-size:.64rem;line-height:1.35}#screen-start .controls-hint>span:not(.touch-only){display:none}#screen-start .controls-hint .touch-only{display:block!important}
  .hud-row{gap:4px;padding:3px 4px}.hud-group{gap:4px}.hud-cell{padding:2px 3px}.hud-value{font-size:17px!important}.combo-chip{font-size:12px!important;padding:4px 6px!important}.lives{font-size:12px!important;letter-spacing:.05em!important}
}
@media(max-width:350px){.hud-label{display:none}.lives{font-size:10px!important}.combo-chip{font-size:11px!important}}
@media(max-height:620px) and (orientation:landscape){#frame{height:calc(100dvh - var(--ttt-safe-t) - var(--ttt-safe-b));width:auto;max-height:100%}#screen-start .panel{padding-top:calc(40px + var(--ttt-safe-t));gap:2px}#screen-start .tag{display:none}#screen-start .logo{font-size:clamp(1.9rem,8vh,2.7rem);margin:0}#screen-start .subtitle{font-size:.62rem;margin:0 0 3px!important}#screen-start .btn{min-height:44px;padding:8px;font-size:.7rem}#screen-start .auth-row,#screen-start .controls-hint{font-size:.58rem;margin:0}.leaderboard{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}