/* Tablet controls use the available width, including tablets wider than 1024px. */
@media (any-pointer:coarse) and (min-width:700px) and (max-width:1600px){
 html body:has(.mainNav) main{box-sizing:border-box!important;min-width:0!important;width:100%!important;max-width:100%!important;margin-left:0!important;padding-left:20px!important;padding-right:20px!important}
 html body:has(.mainNav) #shop #newShopGrid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important}
 html body:has(.mainNav) #shop .shopCard{min-width:0!important;padding:12px!important}
 html body:has(.mainNav) #shop .shopCard h3{font-size:15px!important;line-height:1.3!important;overflow-wrap:anywhere}
 html body:has(.mainNav) #shop .shopCard button{min-height:44px!important;max-width:100%;white-space:normal}
 html body:has(.mainNav) :is(.shopFilters,.catalogTabs,.wardrobeFilters,.profileTabs){display:flex;flex-wrap:wrap;gap:8px;max-width:100%;min-width:0}
 html body:has(.mainNav) :is(.shopFilters,.catalogTabs,.wardrobeFilters,.profileTabs) button{min-height:44px;min-width:0}
 html body:has(.mainNav) #avatar .avatarStudio{display:grid!important;grid-template-columns:minmax(200px,.7fr) minmax(0,1.6fr)!important;gap:18px!important;align-items:start}
 html body:has(.mainNav) #avatar :is(.avatarPreviewCard,.avatarCatalog){min-width:0!important;max-width:100%}
 html body:has(.mainNav) #avatar .preview3d{height:clamp(240px,44dvh,380px)!important;min-height:0!important}
 html body:has(.mainNav) #avatar :is(.faceGrid,.itemGrid){grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important}
 html body:has(.mainNav) #communityGamesGrid.communityGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}
 html body:has(.mainNav) :is(.profileHeroInfo,.profileInventoryScroll,.adminWorkspace,.adminUserRow,.tradeInventoryGrid){min-width:0;max-width:100%;box-sizing:border-box}
 html body:has(.mainNav) :is(.profileHeroInfo,.adminUserRow) input{min-width:0;max-width:100%;box-sizing:border-box}
 html body:has(.mainNav) :is(.dialogButtons,.tryOnActions,.adminUserActions){flex-wrap:wrap}
 html body:has(.mainNav) dialog{box-sizing:border-box;width:min(900px,calc(100vw - 32px))!important;max-height:calc(min(var(--visual-height,100dvh),100dvh) - 32px)!important;overflow:auto!important;overscroll-behavior:contain}
 html body:has(.mainNav) .globalSearchResults{max-height:calc(min(var(--visual-height,100dvh),100dvh) - 170px)!important;overflow:auto;overscroll-behavior:contain}
}
@media (any-pointer:coarse) and (min-width:1100px) and (max-width:1600px){
 html body:has(.mainNav) #shop #newShopGrid{grid-template-columns:repeat(5,minmax(0,1fr))!important}
 html body:has(.mainNav) #avatar :is(.faceGrid,.itemGrid){grid-template-columns:repeat(4,minmax(0,1fr))!important}
 html body:has(.mainNav) #communityGamesGrid.communityGrid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
/* Landscape game sheets fit the visible height and retain all their actions. */
@media (any-pointer:coarse) and (orientation:landscape) and (min-width:700px) and (max-width:1600px){
 html body:is([data-nizur-screen],.mysteryGame,.classicSurvival,#squid-game,[data-learning-game]){--tablet-height:min(var(--visual-height,100dvh),100dvh)}
 html body:is([data-nizur-screen],.mysteryGame,.classicSurvival,#squid-game,[data-learning-game]) dialog:not(#studioGuideOverlay){box-sizing:border-box;min-width:0;max-width:calc(100vw - 32px)!important;max-height:calc(var(--tablet-height) - 24px)!important;overflow-y:auto!important;overscroll-behavior:contain;scroll-padding:16px}
 html body:is([data-nizur-screen],.mysteryGame,.classicSurvival,#squid-game,[data-learning-game]) dialog :is(input,select,textarea){box-sizing:border-box;max-width:100%;min-width:0;font-size:16px}
 html body:has(#worldSplash) #worldSplash .splashCard{max-height:calc(var(--tablet-height,100dvh) - 32px);overflow:auto;overscroll-behavior:contain}
 html body.mysteryGame :is(#mysteryPause,#mysteryControls){box-sizing:border-box;max-width:calc(100vw - 32px);max-height:calc(var(--tablet-height) - 32px);overflow:auto;overscroll-behavior:contain}
 html body.mysteryGame .playerList{max-height:calc(var(--tablet-height) - 190px);overflow-y:auto}
 html body:has(#tdJoystick) #menu{box-sizing:border-box;max-height:calc(var(--tablet-height,100dvh) - 32px)!important;overflow-y:auto!important;overscroll-behavior:contain}
 html body:has(#restaurantWorld)>header.topbar{grid-template-columns:44px minmax(0,1fr) 140px 110px!important;grid-template-areas:'exit identity level wallet'!important;max-width:calc(100vw - 24px)!important}
 html body:has(#restaurantWorld)>header.topbar>.level{display:flex!important;min-width:0}
 html body:has(#restaurantWorld) #rightHud{max-height:calc(var(--tablet-height,100dvh) - 190px)!important;overflow-y:auto;overscroll-behavior:contain}
 html body.classicSurvival #touchControls .touchActions{grid-template-columns:repeat(2,var(--nizur-action-size,64px))!important;gap:8px!important}
 html body.classicSurvival #dialogContent{min-width:0;overflow-x:auto;overscroll-behavior:contain}
 html body#squid-game .panel{max-height:calc(var(--tablet-height) - 32px)!important;overflow-y:auto;overscroll-behavior:contain}
 html body#squid-game #trial-tutorial .lesson{max-height:calc(var(--tablet-height) - 32px);overflow:auto;box-sizing:border-box}
 html body#squid-game #trial-tutorial .tutorialStage{height:clamp(150px,30dvh,250px)}
 /* Robo Islands: a wide tablet must not keep the 400px phone minimum. */
 html body[data-learning-game=robotica]{overflow-y:auto!important}
 html body[data-learning-game=robotica] main{min-height:0!important;align-items:start}
 html body[data-learning-game=robotica] .left{max-height:clamp(110px,22dvh,180px)!important;overflow:auto!important}
 html body[data-learning-game=robotica] .world{min-height:280px!important;height:clamp(280px,calc(100dvh - 240px),600px)!important}
 html body[data-learning-game=robotica] .right{min-height:0!important;max-height:calc(var(--tablet-height) - 90px);overflow:auto!important;overscroll-behavior:contain}
 /* mBot keeps the simulator and program accessible on shorter displays. */
 html body.kidLab.referenceLab{overflow-y:auto!important}
 html body.kidLab.referenceLab .layout{height:auto!important;min-height:0!important;align-items:stretch}
 html body.kidLab.referenceLab .layout>aside.panel{min-height:0!important;height:clamp(300px,60dvh,620px)!important;overflow:auto}
 html body.kidLab.referenceLab .layout>.center{min-height:0!important;height:auto!important;max-height:none!important}

}
@media (any-pointer:coarse) and (orientation:landscape) and (min-width:900px) and (max-width:1600px){
 html body.kidLab.referenceLab .layout{grid-template-columns:minmax(160px,.75fr) minmax(0,1.35fr) minmax(260px,1.1fr)!important;grid-template-rows:minmax(0,1fr)!important}
 html body.kidLab.referenceLab .layout>aside.panel:not(.right){grid-column:1!important;grid-row:1!important}
 html body.kidLab.referenceLab .layout>.center{grid-column:2!important;grid-row:1!important;display:flex!important;flex-direction:column}
 html body.kidLab.referenceLab .layout>.right{grid-column:3!important;grid-row:1!important}
}
/* Four game covers per row on tablets, with no clipped cards. */
@media (min-width:700px) and (max-width:1600px){
 html body.nizurDashboard #app#app#app #home :is(#educationalGamesGrid,#gamesGrid){display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important;overflow:visible!important}
 html body.nizurDashboard #app#app#app #home :is(#educationalGamesGrid,#gamesGrid)>*{min-width:0!important;width:auto!important;max-width:100%!important}
 html body.nizurDashboard #app#app#app #home .managedGame .gameTitle{overflow-wrap:anywhere}
 html body.nizurDashboard #app#app#app #home .managedGame .gameCardFooter{flex-wrap:wrap;gap:6px}
 html body.nizurDashboard #app#app#app #home .managedGame .playButton{min-height:44px!important}
}
@media (min-width:700px) and (max-width:1024px), (any-pointer:coarse) and (min-width:700px) and (max-width:1600px){
 html body.nizurDashboard:not(.isSignedOut)>header.topbar nav.mainNav{justify-content:safe center!important}
}