/* Touch landscape keeps the illustrated desktop composition and native controls. */
.mobile-landscape{--dock-height:58px}
.mobile-landscape .game-dock{bottom:max(10px,env(safe-area-inset-bottom));height:58px;width:470px;max-width:78vw;padding:4px 10px;gap:10px}
.mobile-landscape .game-dock .dock-command{flex-direction:row;gap:5px;min-height:44px;padding:4px}
.mobile-landscape .game-dock b{font-size:19px}
.mobile-landscape .game-dock .dock-label>span{font-size:13px}
.mobile-landscape .game-dock .dock-home{width:44px;flex-basis:44px;height:44px}
.mobile-landscape .game-dock .dock-seal{width:42px;height:42px}
/* Keep the white stamp proportional so it cannot cover the wax rim. */
.mobile-landscape .game-dock .dock-seal img{width:24px;height:24px}
.mobile-landscape .game-dock .dock-icon{width:18px;flex-basis:18px}
.mobile-landscape header{top:14px;left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right))}
.mobile-landscape .chapter-tabs{top:65px}
.mobile-landscape .scene-stepper button{min-width:36px;min-height:44px}
.mobile-landscape .hero-quote{font-size:20px;top:9%;width:52%}
.mobile-landscape .lore-commands{bottom:78px;gap:22px}
.mobile-landscape .lore-command img{width:44px;height:44px}
.mobile-landscape .lore-command span{font-size:18px}
.mobile-landscape dialog{max-height:calc(100dvh - 20px);max-width:calc(100vw - 36px);overflow:auto}
.mobile-landscape #wares{--inventory-card-height:min(420px,calc(100dvh - 145px));--inventory-card-width:calc(var(--inventory-card-height) * .714286)}
.mobile-landscape #wares .card-controls{bottom:65px;transform:scale(.8);transform-origin:center bottom}
.mobile-landscape #wares .wares-speech{top:16%;left:17%;width:35%;max-width:none;min-height:0;padding:16px 20px}
.mobile-landscape #wares .wares-speech p{font-size:20px}
.mobile-landscape #wares .shop-choice{font-size:16px}
.mobile-landscape #wares .ware{grid-template-rows:32px minmax(0,1fr) 20px 58px 22px;gap:3px;padding:12px 16px}
.mobile-landscape #wares .card-name{font-size:21px}
.mobile-landscape #wares .card-stats{font-size:12px}
.mobile-landscape #wares .card-type,.mobile-landscape #wares .card-bottom{font-size:11px}
.mobile-landscape main:not(#main){height:100dvh;padding:58px 84px 74px;min-height:0}
.mobile-landscape main:not(#main) .room{width:100%;min-height:0;max-width:760px}
.mobile-landscape main:not(#main) header{position:fixed;inset:14px 20px auto;width:auto}
.mobile-landscape .archive-heading{gap:3px}
.mobile-landscape .archive-heading h1{font-size:27px}
.mobile-landscape .archive-heading #count{font-size:11px}
.mobile-landscape .back{left:max(16px,env(safe-area-inset-left));top:0;margin:0;position:absolute}
.mobile-landscape .back small{font-size:12px}
.mobile-landscape .spellbook{bottom:10px;padding:0 8px}
.mobile-landscape .spellbook button{font-size:16px;min-height:36px;padding:4px 10px}
.mobile-landscape .shelf-pager{right:max(20px,env(safe-area-inset-right));gap:4px}
.mobile-landscape .archive-settings-open{top:14px;right:max(20px,env(safe-area-inset-right))}
.mobile-landscape .relic strong{font-size:17px}
.mobile-landscape .relic small{font-size:10px}
.mobile-landscape .lantern-label{padding:2px 6px;gap:2px}
.mobile-landscape .wall-shelf{width:32%}
.mobile-landscape .relic{width:34%}
@media(max-height:350px){.mobile-landscape .game-dock{height:50px}.mobile-landscape .lore-commands{bottom:66px}.mobile-landscape .hero-quote{font-size:17px}}
.mobile-landscape .game-dock .dock-label>span{font:10px/1.1 monospace;color:#555}
.mobile-landscape #wares .wares-stage{height:calc(100dvh - 110px)}
/* Size both axes together; a tall window must not stretch a fixed-width card. */
.mobile-landscape #wares{--inventory-card-top:calc(18px + (100dvh - 145px - var(--inventory-card-height)) / 2)}
.mobile-landscape #wares .card-stage{left:43%;right:3%;top:var(--inventory-card-top);height:var(--inventory-card-height)}
.mobile-landscape #wares .inventory-footer{left:43%;right:3%;top:calc(var(--inventory-card-top) + var(--inventory-card-height) + 12px);bottom:auto}
.mobile-landscape #wares .card-controls{transform:none;gap:12px}
.mobile-landscape #wares .card-controls button{width:52px;height:44px}
.mobile-landscape #wares .arrow-plaque{width:52px;height:38px}
.mobile-landscape #wares .control-caption{display:none}
.mobile-landscape #wares #card-count{padding-top:12px}
/* Narrow landscape must not inherit the older vertical-phone scene crops. */
.mobile-landscape #contact{--desk-width:max(100vw,177.6833vh);--desk-bottom:20px;--desk-left:50%}
.mobile-landscape #contact .raven-room{object-position:60% center}
.mobile-landscape .letter-message{width:620px;height:180px;padding:8px 14px}
.mobile-landscape .letter-message h2{font-size:64px;margin-bottom:8px}
.mobile-landscape .letter-action{font-size:29px}.mobile-landscape .letter-address{font-size:22px}
.mobile-landscape #house.riverside-house .house-stage{left:50%;width:max(100vw,177.6833vh);height:max(56.281vw,100vh)}
.mobile-landscape #wall .tavern-stage{left:50%;width:max(100vw,177.6833vh);height:max(56.281vw,100vh)}
.mobile-landscape #wall .guild-jordain-layer{left:0;top:23.7%;width:56%;height:99.5%}
.mobile-landscape #wall .guest-position{left:55.5%;top:20%;width:44%;height:78.18%}
.mobile-landscape #wall .guild-wall-sign{width:42%;height:23%;min-height:0;top:max(1.5%,calc((100% - 100dvh) / 2 + 8px))}
.mobile-landscape #wall .guild-sign-lettering{inset:29% 5% 13%}
.mobile-landscape #wall .guild-sign-lettering h2{font-size:20px}
.mobile-landscape #wall .guild-sign-lettering p{font-size:10px;margin-top:4px}
.mobile-landscape #home .home-actor{left:-4%;bottom:-22%;width:96vh;height:96vh}
.mobile-landscape #home .goliath-wrap{left:60%;right:auto;bottom:18%;width:49vh;height:64vh;max-height:none}
/* The old narrow-screen height:auto rule collapses absolutely positioned relics. */
html.mobile-landscape .relic{width:34%;height:var(--relic-height);aspect-ratio:auto}
