/* Loaded after desktop source layouts. Touch screens use readable controls and
   scroll inside panels; the world and document themselves never scroll. */
img,canvas{-webkit-user-drag:none}
body[data-mode=game]{-webkit-touch-callout:none}
input,textarea,select,[contenteditable=true]{-webkit-touch-callout:default;user-select:text}
html[data-mobile=true],html[data-mobile=true] body{overflow:hidden;overscroll-behavior:none;width:100%;height:100%;touch-action:manipulation}
html[data-mobile=true]{--touch-edge:8px;--touch-top:calc(var(--mobile-top,0px) + env(safe-area-inset-top,0px) + var(--touch-edge));--touch-left:calc(var(--mobile-left,0px) + env(safe-area-inset-left,0px) + var(--touch-edge));--touch-width:calc(var(--mobile-width,100vw) - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px) - 16px);--touch-height:calc(var(--mobile-height,100dvh) - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 16px)}
html[data-mobile=true] button{touch-action:manipulation}
html[data-mobile=true] :is(input,textarea,select){font-size:16px!important}
html[data-mobile=true] .lobby{inset:calc(var(--touch-top) + 44px) auto auto var(--touch-left);width:var(--touch-width);height:calc(var(--touch-height) - 44px);padding:8px 0 20px;overflow:auto;overscroll-behavior:contain;align-items:flex-start}
html[data-mobile=true] .lobby-panel{flex:none;width:min(540px,100%);max-height:none!important;margin:auto 0;padding:16px}
html[data-mobile=true] .auth-tabs button,html[data-mobile=true] .lobby button{min-height:44px;font-size:13px}
html[data-mobile=true] .lobby .class-card{min-height:74px}
html[data-mobile=true] .lobby .source-class-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
html[data-mobile=true] .lobby-footer{display:none}
html[data-mobile=true] body[data-mode=lobby] header{top:var(--mobile-top,0px);height:48px;padding:6px max(12px,env(safe-area-inset-left,0px))}
html[data-mobile=true] .auth-brand-logo{height:48px;margin-bottom:6px}

/* Full-size dialog text with independent scrolling instead of scale-to-fit. */
html[data-mobile=true] body dialog:not(#settings){position:fixed!important;left:var(--touch-left)!important;top:var(--touch-top)!important;right:auto!important;bottom:auto!important;width:var(--touch-width)!important;max-width:var(--touch-width)!important;height:auto!important;min-height:0!important;max-height:var(--touch-height)!important;margin:0!important;transform:none!important;overflow:auto!important;overscroll-behavior:contain;scrollbar-width:thin;--compact-scale:1!important}
html[data-mobile=true] body dialog>.dialog-header{position:sticky!important;top:0!important;left:auto!important;width:100%!important;height:44px!important;min-height:44px!important;margin:0!important;padding:4px 8px!important;z-index:20;background:#111315!important}
html[data-mobile=true] body dialog>.dialog-header h2{font-size:15px!important}
html[data-mobile=true] body dialog>.dialog-header button{width:40px!important;height:36px!important;min-width:40px;min-height:36px;font-size:22px}
html[data-mobile=true] body dialog>.dialog-header button img{width:26px;height:26px}
html[data-mobile=true] body #source-panel-body{overflow:visible!important;min-width:0}
html[data-mobile=true] #source-panel .quest-journal{grid-template-columns:1fr!important;padding:10px}
html[data-mobile=true] #source-panel .quest-journal :is(.menu-stat-line,.reward-chip,.journal-heading strong){font-size:12px!important;line-height:1.5!important;height:auto!important}
html[data-mobile=true] .original-craft{grid-template-columns:minmax(0,1fr)!important;padding:8px!important;gap:12px}
html[data-mobile=true] .craft-formulas{grid-template-columns:1fr;grid-auto-rows:82px;gap:8px;min-height:0}
html[data-mobile=true] .craft-formula{grid-column:auto!important;grid-row:auto!important;justify-content:center;gap:3px}
html[data-mobile=true] .craft-ingredient img{width:30px;height:30px}
html[data-mobile=true] .craft-result{min-height:44px;font-size:12px}
html[data-mobile=true] .craft-pages{position:sticky!important;top:44px;z-index:10;min-height:50px;height:auto;padding:5px;background:#101214}
html[data-mobile=true] .craft-pages nav button{min-width:44px;min-height:44px}
html[data-mobile=true] .craft-owned{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px 6px}
html[data-mobile=true] .craft-tickets{padding:10px 0 0;border-left:0;border-top:1px solid #777}
html[data-mobile=true] .original-benefits{grid-template-columns:minmax(0,1fr)!important}
html[data-mobile=true] .benefit-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
html[data-mobile=true] .benefit-tiers button{height:44px}
html[data-mobile=true] .benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 8px}
html[data-mobile=true] .benefit-card p{font-size:12px;line-height:1.5;min-height:0;padding:22px 6px 8px}
html[data-mobile=true] .point-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 10px}
html[data-mobile=true] .point-offer>span{font-size:12px;line-height:1.5}
html[data-mobile=true] .point-offer[data-point-id='111'],html[data-mobile=true] .point-balance{grid-column:auto;grid-row:auto;width:auto}
html[data-mobile=true] .collection-body{display:block;overflow:visible!important;flex:none}
html[data-mobile=true] .collection-grid:not(.collection-shop){display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:none!important;grid-auto-rows:92px;gap:6px}
html[data-mobile=true] .collection-draws{height:auto;flex-wrap:wrap;gap:8px}
html[data-mobile=true] .collection-draws button{flex:1 1 28%;min-height:64px;font-size:12px}
html[data-mobile=true] .collection-note{font-size:12px;line-height:1.5}
html[data-mobile=true] .collection-body .collection-reveal{position:sticky;top:44px;max-height:calc(var(--touch-height) - 44px);overflow:auto;padding:14px}

/* Inventory contents are real, full-size grid controls on small touch screens. */
html[data-mobile=true] #bag.with-storage{background-color:#101112;background-size:100% 100%!important}
html[data-mobile=true] #bag :is(#inventory-tools,.bag-source-layout,.bag-original-footer){width:100%!important;max-width:100%;height:auto!important;aspect-ratio:auto!important;margin:0!important}
html[data-mobile=true] #bag .bag-source-layout{display:flex!important;flex-direction:column;gap:12px;padding:10px!important}
html[data-mobile=true] #bag .bag-source-layout :is(#stats,#equipment,#inventory,#inventory-summary){position:static!important;inset:auto!important;width:100%!important;height:auto!important;min-height:0;transform:none!important}
html[data-mobile=true] #bag #inventory-summary{order:0;font-size:12px!important}
html[data-mobile=true] #bag #inventory{order:1;display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}
html[data-mobile=true] #bag #equipment{order:2;display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}
html[data-mobile=true] #bag .bag-source-layout .slot{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;min-height:44px;aspect-ratio:1;padding:3px!important}
html[data-mobile=true] #bag .bag-source-layout .slot img{width:100%;height:100%;object-fit:contain}
html[data-mobile=true] #bag .bag-source-layout #stats{order:3;display:grid!important;grid-template-columns:1fr 1fr!important;grid-template-rows:none!important;gap:4px 12px;padding:8px!important}
html[data-mobile=true] #bag .bag-source-layout #stats>div{font-size:12px!important;line-height:18px!important;margin:0!important;padding:3px 0!important}
html[data-mobile=true] #bag .bag-source-layout #stats strong{font-size:13px!important;line-height:18px!important}
html[data-mobile=true] #bag .bag-original-footer{padding:8px!important}
html[data-mobile=true] #bag .bag-original-footer .bag-help,html[data-mobile=true] #bag .auto-salvage{width:auto!important;margin:8px 0!important;font-size:12px!important;line-height:1.5}
html[data-mobile=true] #bag .bag-original-footer .bag-help{position:static!important;inset:auto!important}
html[data-mobile=true] #bag #item-tooltip{position:sticky!important;left:auto!important;right:auto!important;bottom:0!important;width:100%!important;max-width:100%!important;max-height:40dvh;overflow:auto;pointer-events:auto;padding:10px;font-size:13px}
html[data-mobile=true] #game-tooltip{max-width:var(--touch-width)!important;max-height:calc(var(--touch-height) * .65);overflow:auto;font-size:12px}
html[data-mobile=true] #bag .auto-salvage>button{min-height:44px;font-size:11px}
html[data-mobile=true] #bag .source-storage-extension{position:static!important;inset:auto!important;width:auto!important;margin:8px!important;padding:8px}
html[data-mobile=true] #bag .storage-side-grid .slot{min-height:44px!important;height:auto!important;aspect-ratio:1}
html[data-mobile=true] #bag .source-storage-extension nav button{min-height:44px;font-size:12px}
html[data-mobile=true] #bag .storage-help{font-size:12px;line-height:1.5}
html[data-mobile=true] #settings{position:fixed!important;left:var(--touch-left)!important;top:var(--touch-top)!important;width:min(320px,var(--touch-width))!important;max-height:var(--touch-height)!important;transform:none!important;overflow:auto!important;padding:8px!important}
html[data-mobile=true] #source-settings{grid-template-columns:repeat(3,56px)!important;gap:10px}
html[data-mobile=true] #source-settings .menu-icon-row{width:56px!important;height:56px!important}
html[data-mobile=true] #source-settings .menu-icon-row>img{width:44px;height:44px}
html[data-mobile=true] #settings .potion-setting[open]{position:static;width:100%;font-size:12px}
html[data-mobile=true] #settings .text-button{min-height:44px;font-size:12px;margin:4px;padding:6px}
html[data-mobile=true] #deployment-update-notice{right:max(12px,env(safe-area-inset-right,0px));bottom:max(12px,env(safe-area-inset-bottom,0px));max-width:calc(var(--mobile-width,100vw) - 24px)}
/* Existing HUD actions stay available; each strip can be swiped independently. */
html[data-mobile=true] body[data-mode=game] #game-controls{position:fixed!important;left:0!important;right:0!important;top:auto!important;bottom:0!important;width:100%!important;max-width:none!important;height:auto!important;min-height:0!important;transform:none!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;grid-template-rows:42px 48px 48px 48px!important;grid-template-areas:'hero special' 'utility utility' 'quick shortcuts' 'skills skills'!important;gap:4px!important;padding:6px max(8px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px))!important;background:#0b0d10ec;z-index:8;pointer-events:auto}
html[data-mobile=true] #hud-stone-dock{display:none}
html[data-mobile=true] body[data-mode=game] #game-controls .portrait{grid-area:hero;position:static!important;inset:auto!important;transform:none!important;width:100%!important;height:42px!important;padding:0!important;border:0!important;gap:6px!important;background:none!important}
html[data-mobile=true] #game-controls .portrait>img{display:block!important;width:30px!important;height:40px!important;padding:0!important}
html[data-mobile=true] #game-controls .hero-summary{min-width:0}
html[data-mobile=true] #game-controls .hero-summary strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}
html[data-mobile=true] #game-controls .hero-summary small{display:none}
html[data-mobile=true] #game-controls .hero-summary>div:first-child{margin-bottom:0}
html[data-mobile=true] #game-controls .meter{height:11px;margin:2px 0}
html[data-mobile=true] #game-controls .meter span{font-size:10px;line-height:11px}
html[data-mobile=true] #hero-special-menus{grid-area:special;position:static!important;inset:auto!important;display:flex!important;flex-direction:row;justify-content:flex-end;gap:4px}
html[data-mobile=true] #hero-special-menus button{width:60px;height:42px;font-size:10px}
html[data-mobile=true] #hero-special-menus img{height:26px;width:26px}
html[data-mobile=true] #utility-controls{grid-area:utility!important;position:static!important;width:100%;min-width:0;padding:0;display:block}
html[data-mobile=true] #game-controls #source-menu{position:static!important;display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:4px!important;padding:0!important;width:100%!important;height:48px!important}
html[data-mobile=true] #game-controls #source-menu button{position:relative!important;inset:auto!important;transform:none!important;width:100%!important;height:48px!important;min-height:44px!important;padding:2px!important;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:1px!important}
html[data-mobile=true] #source-menu button img{height:27px!important;width:27px!important}
html[data-mobile=true] #game-controls #source-menu .menu-caption{font-size:11px!important;line-height:14px!important}
html[data-mobile=true] #game-controls kbd{display:none!important}
html[data-mobile=true] #game-controls .bottom{display:contents!important}
html[data-mobile=true] #game-controls #quick{grid-area:quick!important}
html[data-mobile=true] #game-controls #skills{grid-area:skills!important}
html[data-mobile=true] #game-controls :is(#quick,#skills){position:static!important;inset:auto!important;transform:none!important;display:flex!important;flex-wrap:nowrap!important;width:100%!important;height:48px!important;min-width:0;gap:4px!important;padding:0!important;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x}
html[data-mobile=true] #game-controls :is(#quick,#skills) .slot{flex:0 0 44px!important;width:44px!important;height:44px!important;min-height:44px!important;padding:3px!important}
html[data-mobile=true] #game-controls :is(#quick,#skills) .slot img{width:36px;height:36px}
html[data-mobile=true] #source-shortcuts{grid-area:shortcuts!important;position:static!important;inset:auto!important;width:100%!important;height:48px!important;display:flex!important;gap:4px!important;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;touch-action:pan-x}
html[data-mobile=true] #source-shortcuts button{flex:0 0 44px!important;width:44px!important;height:46px!important;min-height:44px;align-self:auto!important;padding:1px!important;font-size:10px!important;line-height:12px;gap:0!important}
html[data-mobile=true] #source-shortcuts button img{width:28px!important;height:30px!important;object-fit:contain}
html[data-mobile=true] #source-shortcuts{flex-direction:row!important;align-items:center!important}
html[data-mobile=true] #game-controls :is(#quick,#skills){pointer-events:auto}
html[data-mobile=true] body[data-mode=game] #game-controls .portrait{display:flex!important;text-align:left}
html[data-mobile=true] #game-controls .xp{position:absolute!important;left:8px!important;right:8px!important;top:auto!important;bottom:env(safe-area-inset-bottom,0px)!important;width:auto!important;height:8px!important}
html[data-mobile=true] body[data-mode=game] header{height:32px!important;top:env(safe-area-inset-top,0px)!important;padding:2px 8px!important;gap:8px!important;width:100%!important}
html[data-mobile=true] body[data-mode=game] #currencies{position:fixed!important;top:calc(34px + env(safe-area-inset-top,0px))!important;left:8px!important;right:8px!important;transform:none!important;display:flex!important;gap:12px;max-width:none!important;width:auto!important;height:30px;overflow-x:auto;white-space:nowrap;scrollbar-width:none;background:#080a0dcc}
html[data-mobile=true] #currencies .currency-cell{flex:none;font-size:12px}
html[data-mobile=true] #currencies img{width:20px!important;height:20px!important}
html[data-mobile=true] #map-panel{top:calc(68px + env(safe-area-inset-top,0px))!important;right:8px!important;left:auto!important;width:88px!important;height:88px!important}
html[data-mobile=true] #map-panel canvas{width:100%!important;height:100%!important}
html[data-mobile=true] #map-panel>strong{height:12px;font-size:10px;line-height:12px}
html[data-mobile=true] body[data-mode=game] #minimap{height:64px!important;width:76px!important}
html[data-mobile=true] #hero-bar{left:8px!important;top:calc(68px + env(safe-area-inset-top,0px))!important}
html[data-mobile=true] #game-sidebar{position:fixed!important;left:8px!important;right:auto!important;top:auto!important;bottom:calc(224px + env(safe-area-inset-bottom,0px))!important;width:min(250px,60vw)!important;height:78px!important;padding:0!important;background:#080b0e99!important;z-index:6}
html[data-mobile=true] #game-sidebar .chat{position:static!important;inset:auto!important;width:100%!important;height:78px!important;display:flex;flex-direction:column;padding:0!important}
html[data-mobile=true] #game-sidebar .chat-heading{display:none}
html[data-mobile=true] #game-sidebar #chat-lines{height:42px!important;min-height:42px;padding:3px 6px!important;font-size:11px!important}
html[data-mobile=true] #game-sidebar .chat form{height:36px}
html[data-mobile=true] #game-sidebar .chat input{padding:4px 6px}
@media(min-width:640px) and (max-height:600px){html[data-mobile=true] body[data-mode=game] #game-controls{grid-template-columns:160px minmax(0,1fr) minmax(0,1fr)!important;grid-template-rows:48px 48px!important;grid-template-areas:'hero utility skills' 'special quick shortcuts'!important}html[data-mobile=true] #game-sidebar{bottom:calc(124px + env(safe-area-inset-bottom,0px))!important}}
@media(min-width:640px){html[data-mobile=true] .craft-formulas{grid-template-columns:1fr 1fr}html[data-mobile=true] #source-panel .quest-journal{grid-template-columns:1fr 1fr!important}html[data-mobile=true] .collection-grid:not(.collection-shop){grid-template-columns:repeat(7,minmax(0,1fr))}}