/* Touch controls share the game viewport; browser scrolling remains available in the lobby. */
.game-player{top:var(--player-visible-top,0px);height:var(--player-visible-height,100dvh);overscroll-behavior:none}
.game-player:fullscreen{height:var(--player-visible-height,100%)}
.touch-controls{display:none;position:absolute;inset:0;z-index:2;pointer-events:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.is-loaded.has-touch .touch-controls{display:block}
.game-player:has(dialog[open]) .touch-controls{visibility:hidden}
.touch-controls button,.touch-stick{pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.touch-controls button{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:1px solid #b9e9cb58;color:#eefcf2;background:#14271ec4;box-shadow:0 3px 12px #0005}
.touch-controls button:active,.touch-controls .is-held,.touch-controls [aria-pressed=true]{background:#9aebbbcc;color:#102b1a;border-color:#c7fbd9}
.touch-controls .icon{width:21px;height:21px}
.touch-quick{position:absolute;top:12px;left:50%;display:flex;gap:5px;padding:5px;transform:translateX(-50%);border:1px solid #7aab8b40;background:#09160fa6;border-radius:16px}
.touch-quick button{border-radius:11px}
.has-touch:not(.is-touch-playing):not(.touch-scratch) .touch-quick{top:auto;bottom:max(12px,env(safe-area-inset-bottom))}
.touch-rotate{display:none;position:absolute;top:75px;left:50%;transform:translateX(-50%);max-width:90%;margin:0;padding:5px 12px;border-radius:20px;background:#07140db5;color:#cfebd9;font-size:11px;text-align:center;line-height:1.6;white-space:nowrap}
.touch-world{display:none}
.is-touch-playing .touch-world,.touch-scratch .touch-world{display:block}
.touch-left{position:absolute;left:max(20px,env(safe-area-inset-left));bottom:calc(92px + env(safe-area-inset-bottom));width:136px}
.touch-toggles{display:flex;justify-content:center;gap:9px;margin-bottom:13px}
.touch-toggles button{width:48px;height:44px;border-radius:13px}
.touch-stick{position:relative;width:136px;height:136px;border:2px solid #d2f1dd72;border-radius:50%;background:#0c211783;box-shadow:inset 0 0 30px #0003,0 3px 20px #0002}
.stick-cross{position:absolute;inset:22%;border:1px solid #d2f1dd24;border-radius:50%}
.stick-cross:before,.stick-cross:after{content:"";position:absolute;background:#d2f1dd34}
.stick-cross:before{top:50%;left:-10%;width:120%;height:1px}
.stick-cross:after{left:50%;top:-10%;height:120%;width:1px}
.stick-knob{position:absolute;left:50%;top:50%;width:48px;height:48px;transform:translate(calc(-50% + var(--stick-x,0px)),calc(-50% + var(--stick-y,0px)));border:1px solid #d7f7e1a6;border-radius:50%;background:#d1f0dc88;box-shadow:0 2px 10px #0005;pointer-events:none}
.touch-actions{position:absolute;right:max(20px,env(safe-area-inset-right));bottom:calc(92px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(2,70px);gap:10px}
.touch-controls .touch-action{display:flex;flex-direction:column;gap:4px;width:70px;height:70px;border-radius:22px;padding:6px;font-size:10px;line-height:1.25;text-align:center;overflow-wrap:anywhere}
.touch-controls .touch-action .icon{width:22px;height:22px}
.touch-jump{grid-column:1/3;justify-self:end}
.touch-hotbar{position:absolute;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));display:flex;width:max-content;max-width:calc(100% - 28px - env(safe-area-inset-left) - env(safe-area-inset-right));gap:4px;padding:5px;transform:translateX(-50%);border:1px solid #accdb765;border-radius:13px;background:#07160dbd;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x;pointer-events:auto}
.touch-hotbar::-webkit-scrollbar{display:none}
.touch-hotbar button{flex:0 0 44px;min-width:44px;min-height:44px;border-radius:6px;font:13px ui-monospace,SFMono-Regular,Consolas,monospace;touch-action:pan-x}
.touch-help{margin:0 23px 20px;padding:18px;border:1px solid #385d43;border-radius:12px;background:#1c3224}
.touch-help h3{font-size:14px;margin:0 0 10px;line-height:1.6}
.touch-help p{font-size:12px;line-height:1.9;color:#b0ccba;margin:0 0 18px}
.touch-help label{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:12px;color:#c7e6d1}
.touch-help output{margin-left:auto;font-variant-numeric:tabular-nums}
.touch-help input{width:100%;min-height:44px;accent-color:#a0f1c0}
.touch-guide{margin-bottom:28px;padding:24px;border:1px solid #3d634a;border-radius:16px;background:#1b3023}
.touch-guide h2{display:flex;align-items:center;gap:10px;font-size:18px;margin:0 0 12px;line-height:1.6}
.touch-guide p{color:#aecbb8;font-size:13px;line-height:1.9;margin:0}
.touch-guide ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;list-style:none;margin:22px 0 0;padding:0}
.touch-guide li{display:flex;align-items:center;gap:9px;color:#c7ead3;font-size:12px;line-height:1.7}
.touch-guide li .icon{flex-shrink:0}
.game-player .touch-text-dialog{width:min(540px,calc(100vw - 32px));padding:24px}
.touch-text-dialog h2{margin:0 0 10px;font-size:21px;line-height:1.4}
.touch-text-dialog p{margin:0 0 20px;color:#aac9b5;font-size:12px;line-height:1.8}
.touch-text-dialog input{width:100%;min-height:50px;padding:12px;border:1px solid #527a5d;border-radius:10px;background:#0b1c11;color:#effaf3;font-size:16px}
.touch-replace{display:flex;align-items:center;gap:8px;margin-top:15px;color:#b9d7c4;font-size:13px;min-height:44px}
.touch-text-dialog .touch-replace input{width:20px;min-height:20px;height:20px;accent-color:#a0f1c0}
.game-player .player-toolbar{padding-top:max(8px,env(safe-area-inset-top));padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
.game-player .player-tools{gap:4px}
.game-player .player-tool,.game-player .player-back{min-width:44px;min-height:44px}
.game-player .player-tool{width:44px;height:44px}
.game-player dialog{position:fixed;left:0;right:0;top:calc(var(--player-visible-top,0px) + var(--player-visible-height,100dvh) / 2);bottom:auto;margin:0 auto;transform:translateY(-50%);max-height:calc(var(--player-visible-height,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px);overscroll-behavior:contain}
@media(max-width:740px){.game-player .player-toolbar{gap:8px}.player-tools{gap:3px}.game-player .player-back{padding:8px}.game-player .player-heading h2{font-size:12px}.game-player .live-dot{display:none}.game-player .player-heading p{font-size:10px}.game-player .player-tool{border-radius:11px}}
@media(max-width:600px){.touch-left{width:112px;left:max(14px,env(safe-area-inset-left))}.touch-stick{width:112px;height:112px}.stick-knob{width:42px;height:42px}.touch-actions{right:max(14px,env(safe-area-inset-right));grid-template-columns:repeat(2,60px);gap:8px}.touch-controls .touch-action{width:60px;height:60px;border-radius:19px;font-size:9px}.touch-hotbar{gap:2px;padding:4px}.touch-hotbar button{min-width:44px;min-height:44px;font-size:12px}}
@media(max-width:1000px){.touch-guide ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:580px){.touch-guide{padding:19px}.touch-guide h2{font-size:16px}.touch-guide p{font-size:12px}.touch-guide li{font-size:11px}}
@media(max-width:350px){.touch-hotbar button{min-width:44px}.touch-left{width:100px;left:max(12px,env(safe-area-inset-left))}.touch-stick{width:100px;height:100px}.touch-actions{grid-template-columns:repeat(2,56px);right:max(12px,env(safe-area-inset-right))}.touch-controls .touch-action{width:56px;height:60px}.game-player .player-toolbar{padding-left:6px;padding-right:6px;gap:5px}.game-player .player-heading h2{font-size:10px}.game-player .player-heading p{font-size:9px}}
@media(max-width:600px) and (orientation:portrait){.has-touch .touch-rotate{display:block}.has-touch.is-touch-playing .touch-rotate{display:none}}
@media(orientation:landscape) and (max-height:600px){.game-player .player-toolbar{min-height:52px;padding-top:max(4px,env(safe-area-inset-top));padding-bottom:4px}.game-player .player-heading p{display:none}.touch-left{bottom:calc(18px + env(safe-area-inset-bottom));width:104px}.touch-stick{width:104px;height:104px}.stick-knob{width:38px;height:38px}.touch-toggles{margin-bottom:7px;gap:6px}.touch-toggles button{width:44px}.touch-actions{bottom:calc(18px + env(safe-area-inset-bottom));grid-template-columns:repeat(2,56px);gap:6px}.touch-controls .touch-action{width:56px;height:56px;font-size:9px;border-radius:17px}.touch-quick{top:7px}.touch-hotbar{bottom:calc(18px + env(safe-area-inset-bottom));max-width:calc(100% - 320px)}.touch-hotbar button{min-width:44px}.touch-help{margin-bottom:12px}.game-player .touch-text-dialog{padding:18px}.touch-text-dialog .confirm-actions{margin-top:15px}}
@media(any-pointer:coarse){.button,.card-play,.variant-select,.category-tab,.language-control select,.sort-wrap select,.reset-link{min-height:46px}.icon-button{min-width:44px;min-height:44px}.search-wrap input,.language-control select,.sort-wrap select{font-size:16px}.search-wrap{min-height:48px}.card-description{font-size:12px}.faq-item summary{min-height:56px;font-size:14px}.page-shell{padding-bottom:env(safe-area-inset-bottom)}.nav-item{font-size:14px}.reference-panel summary{min-height:48px}.search-wrap input{scroll-margin-top:90px}}
@media(any-pointer:coarse) and (min-width:581px) and (max-width:1000px){.nav-item{font-size:11px}}
@media(any-pointer:coarse) and (max-width:580px){.nav-item{font-size:11px}.sidebar{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}.page-shell{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}.language-control select{width:104px}.global-search input{font-size:16px}.topbar{min-height:76px}}
