#pan-view{display:inline-flex;align-items:center;gap:6px;font-size:11px;padding:6px 9px;width:auto;min-height:36px}
#pan-view svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}
#pan-view[aria-pressed=true]{border-color:var(--amber);background:#ffce7b1a;color:var(--amber)}
#mobile-game-details{display:none}
.canvas-wrap.view-panning{cursor:grab}.canvas-wrap.view-panning canvas{cursor:grab}
@media(max-width:900px){
 body[data-game-focus=true]>.main{padding:12px 12px 20px}
 body[data-game-focus=true]>.page-footer{display:none}
 body[data-game-focus=true] .header .header-language{display:none}
 body[data-game-focus=true] #puzzle-view>.page-heading{margin-bottom:12px;gap:8px;flex-wrap:nowrap}
 body[data-game-focus=true] #puzzle-view>.page-heading h1{font-size:17px;margin:0;max-width:230px;line-height:1.3}
 body[data-game-focus=true] #puzzle-view>.page-heading .eyebrow{display:none}
 body[data-game-focus=true] .classic-actions .button{min-height:38px;height:38px;font-size:10px;padding:8px}
 body[data-game-focus=true] .classic-actions .icon-button{width:38px;height:38px}
 body[data-game-focus=true] .workspace{gap:12px;display:flex;flex-direction:column}
 body[data-game-focus=true] .canvas-wrap.playing{height:clamp(100px,calc(100dvh - 236px),800px);min-height:0!important;display:flex;align-items:safe center;justify-content:flex-start;overflow:auto!important;overscroll-behavior:contain;scrollbar-width:thin}
 body[data-game-focus=true] .workspace:not(.classic-workspace) .canvas-wrap.playing{height:clamp(100px,calc(100dvh - 380px),720px)}
 body[data-game-focus=true] .canvas-wrap.playing canvas{flex:0 0 auto;max-width:none;min-width:0}
 body[data-game-focus=true] .classic-workspace .arena-top{padding:10px 12px;min-height:46px;grid-template-columns:auto 1fr auto;gap:8px}
 body[data-game-focus=true] .classic-workspace .save-status{padding:8px 12px;font-size:10px;gap:4px 10px}
 body[data-game-focus=true] .arena-footer{padding:8px 10px;min-height:52px;gap:7px;flex-wrap:wrap;align-items:center}
 body[data-game-focus=true] .arena-footer .zoom-controls{gap:5px;margin-left:auto;margin-right:0}
 body[data-game-focus=true] .zoom-controls button{width:38px;height:38px;border-radius:8px;min-height:38px}
 body[data-game-focus=true] .zoom-controls span{font-size:10px;min-width:32px}
 body[data-game-focus=true] .arena-footer .text-button{font-size:10px;min-height:38px;padding:6px}
 body[data-game-focus=true] #pan-view{min-height:38px;padding:6px 8px}
 body[data-game-focus=true] .arena-footer>span:first-child{display:none}
 body[data-game-focus=true] .fairness-note{display:none}
 body[data-game-focus=true] .metrics{gap:6px;margin:0 0 10px}
 body[data-game-focus=true] .metrics .metric{min-height:66px;padding:9px;border-radius:9px}
 body[data-game-focus=true] .metrics .metric-label{font-size:8px;gap:4px}
 body[data-game-focus=true] .metrics .metric-label svg{width:12px;height:12px}
 body[data-game-focus=true] .metrics .metric-value{font-size:22px;margin-top:7px}
 body[data-game-focus=true] .metrics .metric-detail{display:none}
 body[data-game-focus=true] .metrics .timer>span{font-size:12px}
 body[data-game-focus=true] .sidebar{display:none}
 body[data-game-focus=true][data-game-details=true] .workspace:not(.classic-workspace) .sidebar{display:grid}
 body[data-game-focus=true] .workspace:not(.classic-workspace) #mobile-game-details{display:flex;gap:8px;align-items:center;justify-content:center;min-height:42px;border:1px solid var(--border);background:var(--panel);border-radius:9px;color:var(--muted);font:inherit;font-size:11px;padding:10px;cursor:pointer}
 #mobile-game-details svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.65}
 .mobile-controls{bottom:max(8px,env(safe-area-inset-bottom));left:10px;right:10px;padding:10px 12px;border-radius:12px;max-width:480px;margin:auto;box-shadow:0 7px 30px #0009}
 .mobile-controls>div{flex-wrap:wrap;gap:6px}
 .mobile-controls>span{font-size:10px;margin-bottom:8px}
 .mobile-controls .direction,.mobile-controls .icon-button{min-width:44px;min-height:44px;width:44px;border-radius:8px}
 .mobile-controls .button{min-height:44px;font-size:11px;flex:1;max-width:140px}
 .app-layout .app-sidebar{padding-bottom:max(24px,env(safe-area-inset-bottom));overscroll-behavior:contain}
 .app-layout .header{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}
 .app-layout>.main{padding-bottom:max(32px,env(safe-area-inset-bottom))}
}
@media(max-width:380px){body[data-game-focus=true] .arena-footer{gap:4px}body[data-game-focus=true] #pan-view{font-size:10px;padding:6px}body[data-game-focus=true] .arena-footer .text-button{font-size:9px;padding:4px}.mobile-controls .direction{min-width:42px;width:42px}}

@media(max-width:520px){body[data-game-focus=true] #puzzle-records-button{font-size:0;padding:0}body[data-game-focus=true] #puzzle-records-button span{display:none}}
@media(max-width:900px) and (max-height:500px){
 body[data-game-focus=true]{--header-height:48px}
 body[data-game-focus=true]>.main{padding:8px 12px}
 body[data-game-focus=true] #puzzle-view>.page-heading{margin-bottom:8px}
 body[data-game-focus=true] .classic-actions .button,body[data-game-focus=true] .classic-actions .icon-button{min-height:32px;height:32px}
 body[data-game-focus=true] .classic-workspace .arena-top{min-height:38px;padding:8px 12px}
 body[data-game-focus=true] .arena-footer{padding:5px 10px;min-height:46px}
 body[data-game-focus=true] .canvas-wrap.playing{height:clamp(80px,calc(100dvh - 196px),300px)}
 body[data-game-focus=true] .workspace:not(.classic-workspace) .canvas-wrap.playing{height:clamp(80px,calc(100dvh - 280px),300px)}
 body[data-game-focus=true] .metrics .metric{min-height:50px;padding:6px 9px}
 body[data-game-focus=true] .metrics .metric-value{font-size:19px;margin-top:4px}
}

@media(max-width:900px){
 body[data-game-focus=true] #arena-view>.page-heading{margin-bottom:10px}
 body[data-game-focus=true] #arena-view>.page-heading .eyebrow,body[data-game-focus=true] #arena-view h1>span{display:none}
 body[data-game-focus=true] #arena-view h1{font-size:17px;line-height:1.3;margin:0}
 body[data-game-focus=true] .workspace:not(.classic-workspace) .arena-top{min-height:46px;padding:8px 12px;font-size:8px}
 body[data-game-focus=true] .workspace:not(.classic-workspace) #leave-button{width:auto;height:auto;min-height:40px;padding:9px 12px;font-size:12px}
 body[data-game-focus=true] .position-tag{font-size:8px;line-height:1.3;margin-top:5px}
}
@media(max-width:900px) and (max-height:500px){
 body[data-game-focus=true] #arena-view>.page-heading{display:none}
 body[data-game-focus=true] .workspace:not(.classic-workspace) .canvas-wrap.playing{height:clamp(70px,calc(100dvh - 286px),300px)}
 body[data-game-focus=true] .workspace:not(.classic-workspace) .arena-top{min-height:40px;padding:5px 12px}
}

@media(max-width:900px){body[data-game-focus=true][data-view=arena] .toast{bottom:138px}}

.arena-top .arena-status-group{flex-wrap:wrap;min-width:0}
.arena-top .battle-leave{width:auto;min-height:42px;gap:8px;font-size:14px;font-weight:700;letter-spacing:.02em;white-space:nowrap;flex-shrink:0}
.arena-top .battle-leave svg{width:17px;height:17px}
@media(max-width:900px){.workspace:not(.classic-workspace) .arena-top{flex-wrap:wrap;gap:8px}.workspace:not(.classic-workspace) .arena-status-group{flex:1 1 100%;justify-content:space-between}.workspace:not(.classic-workspace) #leave-button{width:auto;min-height:42px;font-size:12px;padding:9px 12px}}
