/* Mobile layout for the shared shell, game screens and utility pages. */
@media(max-width:800px){
 body.approved-site{overflow-x:hidden!important}
 body.approved-site .approved-header{height:144px!important;align-content:start!important;padding:6px 12px!important;gap:2px!important}
 body.approved-site .approved-header .logo{height:32px!important;line-height:32px!important}
 body.approved-site .approved-header .tools{order:2!important;width:100%!important;height:42px!important;min-width:0!important;justify-content:flex-start!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin;gap:0!important}
 body.approved-site .approved-header .tools>button{flex:0 0 auto!important;min-height:34px!important;padding:0 8px!important;font-size:11px!important}
 body.approved-site .approved-header .approved-nav{order:3!important;width:100%!important;flex:0 0 100%!important;height:50px!important;gap:17px!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin;scroll-snap-type:x proximity!important}
 body.approved-site .approved-header .approved-nav a{flex:0 0 auto!important;min-height:44px!important;scroll-snap-align:start;font-size:13px!important}
 body.approved-site{padding-top:144px!important;padding-bottom:74px!important}
 body.approved-site .approved-ui.screen{height:auto!important;min-height:calc(100dvh - 218px)!important}
 body.approved-site :is(#hubHome,#hubPlay){min-height:calc(100dvh - 218px)!important}
 body.approved-site .approved-footer{height:58px!important;min-height:58px!important;padding:4px 8px calc(4px + env(safe-area-inset-bottom))!important;gap:6px!important}
 body.approved-site .approved-footer>.hub-footer-left,body.approved-site .approved-footer>.bottom-radio{min-width:0!important;padding:4px!important}
 body.approved-site .approved-footer .visitors{display:flex!important;font-size:10px!important}
 body.approved-site .approved-footer .bottom-radio small,body.approved-site .approved-footer .bottom-radio select{font-size:10px!important}
 body.approved-site .chat-widget{bottom:calc(66px + env(safe-area-inset-bottom))!important;max-width:calc(100vw - 24px)!important}
 body.approved-site :is(.hub-dialog,#draftOptionsModal){top:144px!important;bottom:58px!important}
 body.approved-site #hostWrenchBtn{top:153px!important}
 body.approved-site #hostControlsWidget{top:195px!important}
 body.approved-site :is(.active-users-widget,.activity-widget){top:150px!important;max-height:calc(100dvh - 226px)!important}
 body.approved-site #hubCommunity{display:grid!important;place-items:center!important;padding:18px!important;overflow-x:hidden!important}
 body.approved-site #hubCommunity[hidden]{display:none!important}
 body.approved-site #hubCommunity .community-panel{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:16px!important;width:min(100%,520px)!important;max-width:100%!important;min-width:0!important;padding:18px!important}
 body.approved-site #hubCommunity .community-panel img{display:block!important;width:100%!important;height:clamp(145px,25dvh,230px)!important;object-fit:cover!important}
 body.approved-site #hubCommunity .community-panel>div{min-width:0!important;max-width:100%!important}
 body.approved-site #hubCommunity .community-panel h2{font-size:clamp(22px,6vw,30px)!important;overflow-wrap:anywhere}
 body.approved-site #hubCommunity .community-panel .archive{max-width:100%;white-space:normal}
 body.approved-site #hubCollection{display:flex!important;flex-direction:column!important;gap:12px!important;padding:16px!important;overflow:visible!important}
 body.approved-site #hubCollection[hidden]{display:none!important}
 body.approved-site #hubCollection .filter-panel,body.approved-site #hubCollection .card-content{width:100%!important;max-width:100%!important;min-width:0!important}
 body.approved-site #hubCollection .collection-heading{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:12px!important}
 body.approved-site #hubCollection .collection-heading input{width:100%!important;max-width:none!important}
 body.approved-site #hubCollection .card-toolbar{flex-wrap:wrap!important;gap:8px!important}
 body.approved-site #hubCollection .collection-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:none!important;overflow:visible!important;gap:12px!important}
 body.approved-site #hubCollection .collection-grid figure{min-width:0!important}
 body.approved-site #hubCollection .collection-grid .approved-card{width:100%!important;height:auto!important;max-width:210px!important}
 body.approved-site .hub-utility-page{height:auto!important;min-height:calc(100dvh - 218px)!important;overflow:visible!important;padding:16px!important}
 body.approved-site .hub-page-source{width:100%!important;min-width:0!important;max-width:100%!important;opacity:1!important;animation:none!important}
 body.approved-site .hub-page-source>:is(.profiles-modal,.patchnotes-modal,.guide-container){max-width:100%!important;min-width:0!important;padding:18px!important;background-image:none!important;backdrop-filter:none!important}
 html[data-fc-theme=light] body.approved-site .hub-page-source>:is(.profiles-modal,.patchnotes-modal,.guide-container){background:#f7efe3!important;color:#302015!important}
 html:not([data-fc-theme=light]) body.approved-site .hub-page-source>:is(.profiles-modal,.patchnotes-modal,.guide-container){background:#161411!important;color:#f4e8d7!important}
 body.approved-site .hub-page-source :is(img,table,pre){max-width:100%!important}
 body.approved-site #draftOptionsModal .draft-modal-content{max-width:calc(100vw - 16px)!important;max-height:calc(100dvh - 218px)!important;overflow-y:auto!important}
 body.approved-site #draftPickingScreen{padding:18px!important}
 body.approved-site .hub-draft-roster{position:static!important;width:100%!important;margin-bottom:16px!important;padding:12px!important}
 body.approved-site .hub-draft-roster #draftOthersStatus{flex-direction:row!important;overflow-x:auto!important;gap:8px!important}
 body.approved-site .hub-draft-roster #draftOthersStatus>div{flex:0 0 130px!important;min-width:130px!important;padding:10px!important}
 body.approved-site #draftOptionsContainer{max-width:100%!important;overflow-x:auto!important;overflow-y:visible!important;flex-wrap:nowrap!important;justify-content:flex-start!important}
 body.approved-site #draftOptionsContainer .pack-card-container{flex:0 0 clamp(95px,27vw,160px)!important;width:clamp(95px,27vw,160px)!important;min-width:0!important}
 body.approved-site #votingScreen .vs-matchups-grid.hub-multi-duels{display:grid!important;grid-template-columns:1fr!important;grid-template-rows:none!important;height:auto!important;gap:12px!important}
 body.approved-site #votingScreen .vs-matchup-panel{width:100%!important;min-width:0!important;overflow:visible!important}
 body.approved-site #votingScreen .vs-matchup-panel .vs-inner-wrap{display:grid!important;grid-template-columns:minmax(0,1fr) 35px minmax(0,1fr)!important;gap:4px!important;align-items:stretch!important;width:100%!important;min-width:0!important}
 body.approved-site #votingScreen .vs-matchup-panel .vs-side{width:auto!important;min-width:0!important;max-width:none!important;display:flex!important;flex-direction:column!important;overflow:hidden!important}
 body.approved-site #votingScreen .vs-matchup-panel .vs-mid-wrap{width:35px!important;min-width:35px!important;align-self:center!important}
 body.approved-site #votingScreen .vs-matchup-panel .vs-card-row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;width:100%!important;min-width:0!important;gap:2px!important}
 body.approved-site #votingScreen .vs-matchup-panel .vs-card-wrap{width:100%!important;min-width:0!important;max-width:none!important;height:auto!important;aspect-ratio:3/4!important}
 body.approved-site #votingScreen .vs-matchup-panel .vs-side h2{overflow-wrap:anywhere!important}
 body.approved-site #votingScreen .vs-matchup-panel .vote-btn{white-space:normal!important;overflow-wrap:anywhere!important}
}
@media(max-width:420px){
 body.approved-site .approved-header .tools>button{padding-inline:7px!important}
 body.approved-site .approved-footer .bottom-radio select{width:92px!important}
 body.approved-site #hubCollection .card-toolbar span{font-size:11px!important}
}