/* Mobile controls: translucent, multitouch, separate move/pass/shoot/sprint. */
.match .touch{display:none}.match .overlay{z-index:6}
button,select{touch-action:manipulation}button:focus-visible{outline:2px solid #edbc56;outline-offset:3px}
@media(max-width:900px),(pointer:coarse){
header,main{padding:12px}header span{display:none}.top{gap:8px}.top small{font-size:10px}h1{font-size:21px;margin:4px 0 10px}.top>div:last-child{display:flex;gap:5px}.top button{font-size:12px;min-height:44px;padding:7px 8px}.scoreboard{gap:12px;padding:8px;font-size:11px}.score{font-size:23px}.clock{font-size:15px}
.match{padding-bottom:126px;background:#263e2a;border-width:3px}.match .status{position:absolute;bottom:0;left:0;right:0;height:36px;align-items:center;padding:7px;gap:4px;font-size:9px}.status #message{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:42%}.status .bar{width:45px}.match .touch{display:flex;position:absolute;bottom:36px;left:0;right:0;height:126px;min-height:0;margin:0;padding:6px 14px;justify-content:space-between;align-items:center;background:transparent;pointer-events:none;z-index:4;gap:8px;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.stick-area{gap:0;pointer-events:auto}.stick-area>span{display:none}
#stick{width:108px;height:108px;background:rgba(230,245,237,.12);border:2px solid rgba(255,255,255,.34);box-shadow:inset 0 0 0 12px rgba(255,255,255,.035);touch-action:none}#knob{width:42px;height:42px;left:31px;top:31px;background:rgba(236,247,238,.36);border:2px solid rgba(255,255,255,.62);box-shadow:0 2px 8px #0003}.stick-cross:before,.stick-cross:after{left:51px;top:12px;height:80px;background:#ffffff18}
.actions{position:relative;display:block;width:154px;height:114px;flex:none;pointer-events:none}.touch .action{position:absolute;width:58px;height:58px;min-height:44px;background:rgba(224,239,231,.16);border:2px solid rgba(255,255,255,.5);color:white;border-radius:50%;padding:2px;font:600 13px 'Microsoft YaHei',sans-serif;text-shadow:0 1px 3px #0009;pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent;box-shadow:0 2px 12px #0002}.touch .pass{left:0;bottom:0}.touch .shoot{right:4px;top:0;background:rgba(245,208,134,.22)}.touch .dash{right:0;bottom:0;width:50px;height:50px;background:rgba(167,215,237,.2)}.touch .action.pressed{background:rgba(255,255,255,.42);transform:scale(.94);filter:none}
.overlay{inset:43px 0 36px}.overlay h2{font-size:28px}.overlay small{font-size:10px;letter-spacing:2px}.overlay p{font-size:11px}.settings{gap:8px;padding:10px;font-size:10px}.settings label{display:flex;gap:5px;align-items:center}.settings select{min-height:38px;padding:5px}.controls{display:none}footer{font-size:9px;gap:8px}#stats-dialog{max-height:calc(100dvh - 24px);padding:12px}.stats-selects input,.stats-selects select,.stats-fields input{font-size:16px;min-height:44px}.stats-fields label{grid-template-columns:minmax(0,1fr) 76px}.stats-fields input{width:76px}.stats-heading button,.stats-bottom button{min-height:44px}
}
@media(max-width:900px) and (orientation:landscape) and (max-height:600px){
header,.top>div:first-child,footer{display:none}main{padding:4px max(8px,env(safe-area-inset-right)) 8px max(8px,env(safe-area-inset-left))}.top{justify-content:flex-end;margin-bottom:4px}.top>div:last-child{width:auto}.top button{min-height:32px;font-size:11px;padding:4px 12px}.match{width:min(100%,calc((100dvh - 111px)*16/9));margin:0 auto;padding-bottom:0}.scoreboard{padding:5px;gap:12px}.score{font-size:19px}.status{position:relative!important;height:25px!important;font-size:8px!important}.match .touch{position:fixed;bottom:max(12px,env(safe-area-inset-bottom));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));height:114px;padding:0}.match .overlay{inset:34px 0 25px}.overlay p{margin:5px}.overlay h2{font-size:26px;margin:4px}.start{font-size:12px;padding:8px 16px}.settings{margin-top:8px}#stats-dialog{width:min(760px,calc(100% - 20px))}.stats-fields{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:360px){.scoreboard{gap:7px}.top button{font-size:11px}.match .touch{padding:6px 8px}#stick{width:98px;height:98px}#knob{left:26px;top:26px}.stick-cross:before,.stick-cross:after{left:46px;top:10px;height:74px}.actions{width:143px}}