/* Alpha 0.9: readable field instruments and thumb-sized controls. */
:root{--ux-text:#eee9cb;--ux-muted:#c3c8aa;--ux-panel:#172115f5;--ux-border:#90946b;--field-height:176px;--safe-bottom:env(safe-area-inset-bottom,0px)}
#app{min-height:0;font-size:14px}
#app button{touch-action:manipulation}
#app button:focus-visible{outline:3px solid #f4da91;outline-offset:3px}
#app .icon-button,#app:not(.base-mode) .icon-button{min-height:44px;height:44px;min-width:44px;padding:0 10px;font-size:14px;color:var(--ux-text);background:#1b2517ed;border-color:#798368}
#app .topbar,#app:not(.base-mode) .topbar{height:64px;padding:10px max(14px,env(safe-area-inset-right)) 10px max(14px,env(safe-area-inset-left));background:linear-gradient(#080e08fa,#0c130ccb);gap:12px}
#app .wordmark{font-size:18px;letter-spacing:1px}#app .wordmark small{font-size:10px}#app .build-tag{display:none}#app .top-actions{gap:6px}
#app .hero-copy p{font-size:14px}#app .hero-copy .edition{font-size:12px}
#app .base-screen{padding-top:80px;justify-content:flex-start;overflow:auto;overscroll-behavior:contain;touch-action:pan-y}
#app .base-console{width:min(1160px,100%);margin-bottom:16px}
#app .console-heading{font-size:16px}#app .section-label{font-size:14px;letter-spacing:.5px;flex-wrap:wrap}#app .section-label small{font-size:12px;color:var(--ux-muted)}
#app .merc-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}#app .portrait{height:92px}
#app .merc-info strong{font-size:18px}#app .merc-info>span{font-size:12px;line-height:1.5;color:var(--ux-muted)}#app .merc-call{font-size:10px}#app .merc-stats span{font-size:12px}#app .merc-stats b{font-size:14px}
#app .merc-insight{background:#0b140c;border:1px solid #768761;margin:10px 0;padding:12px;color:var(--ux-text);font-size:14px}#app .merc-insight p{font-size:14px;color:var(--ux-muted);line-height:1.6}#app .merc-insight small{font-size:12px;color:#d4c68d;display:block;margin-top:7px}
#app .mission-filter{display:flex;gap:6px;margin:10px 0}#app .mission-filter button{min-height:44px;padding:8px 12px;border:1px solid #788661;background:#182313;color:var(--ux-muted);font-size:14px}#app .mission-filter button[aria-pressed=true]{background:#3d4829;color:#f0e9bb;border-color:#d2c482}
#app .mission-tabs{grid-template-columns:repeat(2,minmax(0,1fr));max-height:220px;gap:7px;padding:2px}
#app .mission-tab{min-height:60px;font-size:14px;padding:9px 11px;color:#d4deba}#app .mission-tab small{font-size:12px;color:#bec9a3}#app .mission-tab.locked{opacity:.7}#app .mission-tab.selected{color:#fff0be}
#app .difficulty-select{font-size:14px;margin:12px 0;flex-wrap:wrap}#app .difficulty-choice{min-height:44px;padding:8px 13px;font-size:14px}
#app .briefing{grid-template-columns:minmax(0,1fr) 120px}#app .briefing h3{font-size:20px}#app .briefing p,#app .brief-story{font-size:14px!important;line-height:1.7}#app .briefing .reward{font-size:13px;flex-wrap:wrap;gap:8px 16px}#app .merc-summary{font-size:14px;line-height:1.6;margin-top:9px}#app .brief-map>small,#app .brief-map>span,#app .brief-map p.brief-regions{font-size:12px!important}
#app .echo-status{font-size:13px;line-height:1.7}#app .readiness{font-size:14px;line-height:1.6;padding:10px 12px;color:#d3dfb6;background:#111c0f;border-left:3px solid #abc783;margin-bottom:12px}#app .readiness.warning{color:#f5cba2;border-color:#e5a46b}
#app .primary-button,#app .outline-button,#app .deploy-row button,#app .footer-save button{min-height:48px;font-size:15px;padding:12px 15px}#app .deploy-row{gap:8px}#app .console-footer{font-size:12px;color:var(--ux-muted)}
#app .sheet{max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;color:var(--ux-text);background:var(--ux-panel);border-color:var(--ux-border)}
#app .sheet p{font-size:14px;line-height:1.7;color:var(--ux-muted)}#app .sheet-heading h2{font-size:23px}#app .sheet-heading small{font-size:12px}#app .close-button{width:48px;height:48px;min-width:48px;font-size:27px}#app .sheet-note{font-size:13px}
#app .shop-tabs{gap:6px;padding-block:6px}#app .shop-tabs button{min-height:44px;font-size:14px;padding:9px 12px}#app .shop-item h3{font-size:17px}#app .shop-item p,#app .gear-weapon small,#app .gear-profile>p{font-size:13px}#app .shop-item button,#app .carry-toggle{min-height:44px;font-size:14px}#app .gear-weapon strong{font-size:16px}#app .gear-weapon>i,#app .gear-stats>span,#app .gear-weight>span,#app .gear-ready>span,#app .upgrade-effect,#app .upgrade-value{font-size:13px}#app .gear-stats b{font-size:15px}#app .upgrade-row h3{font-size:17px}#app .upgrade-row small,#app .upgrade-price,#app .clinic-summary>span,#app .scan-id{font-size:12px}#app .clinic-summary b{font-size:15px}
#app .settings-sheet{width:min(680px,calc(100% - 24px))}#app .music-switch{min-height:44px;margin:7px 0;font-size:14px;color:var(--ux-text)}#app .music-switch input{width:22px;height:22px;flex-shrink:0}#app .audio-slider{font-size:14px;color:var(--ux-text)}#app .audio-slider b{font-size:14px}#app .audio-slider input{height:44px}#app .visual-settings{border-top:1px solid #6d7853;padding-top:12px;margin-top:18px}#app .visual-settings button{margin-top:10px;width:100%}
#app .compact-sheet{width:min(580px,calc(100% - 24px))}#app .tool-choices{display:grid;gap:9px;margin-top:16px}#app .tool-choices button{padding:14px;text-align:left;background:#25331d;border:1px solid #76875c;min-height:64px;color:var(--ux-text)}#app .tool-choices strong{display:block;font-size:16px}#app .tool-choices span{display:block;font-size:14px;line-height:1.5;color:var(--ux-muted);margin-top:5px}#app .tool-choices button[aria-pressed=true]{border-color:#e1d39a;background:#3c4726}
#app .field-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}#app .field-summary>div{padding:12px;border:1px solid #627450;background:#0d180b}#app .field-summary span{display:block;font-size:13px;color:var(--ux-muted)}#app .field-summary strong{display:block;font-size:18px;margin-top:6px}
/* The lower console keeps only health, carried weapons and immediate actions. */
#app .battle-console{height:calc(var(--field-height) + var(--safe-bottom));padding:10px 184px calc(10px + var(--safe-bottom)) 14px;grid-template-columns:145px minmax(0,1fr);gap:14px;background-color:#737b53}
#app .vital-heading strong{font-size:20px}#app .vital-heading span{font-size:12px}#app .status-display{height:69px}#app .health-readout small{font-size:12px}#app .health-readout b{font-size:20px}#app .armor-line{font-size:13px}#app .console-vitals{padding:8px}#app .low-health .console-vitals{border:2px solid #e6a088}
#app .console-core{min-width:0;display:flex;flex-direction:column;gap:5px}#app .current-weapon{font-size:16px;color:#f2f0ce;background:#0e1b0e;padding:4px 9px;min-height:26px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#app .loadout{display:flex;gap:6px;min-height:54px;scroll-padding:3px}#app .weapon-button{flex:0 0 110px;min-width:100px;height:54px;padding:5px 7px;text-align:left;background:#142011;color:#d6e1bb}#app .weapon-button small{font-size:12px}#app .weapon-button small i{font-size:16px}#app .weapon-button strong{font-size:14px;bottom:10px;left:7px;right:4px}#app .weapon-button span{display:none}#app .gun-icon{display:none}#app .mag-strip{height:4px}
#app .field-readouts{margin:0;gap:6px;display:flex;align-items:center}#app .quick-actions{display:flex;gap:6px;flex:1;min-width:0}#app .quick-actions button{height:44px;min-height:44px;min-width:54px;flex:1;font-size:15px;padding:7px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#app .quick-actions kbd{font-size:12px}#app .field-button{height:44px;min-width:50px;background:#24351c;color:#ebedca;border:1px solid #b0b98a;font-size:14px}
#app .cargo-readout,#app .tactical,#app .desktop-hint{display:none}
#app .radar-panel.console-radar{position:absolute;top:auto;bottom:calc(10px + var(--safe-bottom));right:14px;width:155px;padding:6px;background:#9ba776;min-width:0}#app .radar-heading{font-size:13px;gap:4px}#app .radar-heading button{min-height:44px;position:relative;font-size:13px;font-weight:bold}#app .radar-heading button:after{display:none}#app .radar-heading b{font-size:12px}#app .radar-panel canvas{height:78px}#app .radar-readout{font-size:12px;white-space:normal;color:#243416;line-height:1.3}#app .radar-readout.danger{color:#752411}
#app .tool-strip{left:170px;right:auto;bottom:calc(var(--field-height) + var(--safe-bottom) + 8px);padding:4px;gap:6px}#app .tool-strip button{min-height:44px;font-size:14px;padding:8px 11px}#app .tool-strip span{display:none}
#app .magic-controls{left:auto;right:180px;bottom:calc(var(--field-height) + var(--safe-bottom) + 8px);padding:4px;gap:6px;font-size:12px;flex-wrap:wrap;max-width:230px}#app .magic-controls span{font-size:12px;flex-basis:100%}#app .magic-controls button{min-height:44px;font-size:14px;padding:7px 10px;flex:1}
#app .objective{top:72px;left:14px;max-width:calc(100% - 28px);padding:10px 14px;background:#101b0ff0}#app .objective small{font-size:12px}#app .objective strong{font-size:18px}#app .objective>span{font-size:15px}#app .objective-progress{margin-top:7px}
#app .toast{bottom:calc(var(--field-height) + var(--safe-bottom) + 102px);font-size:14px;padding:10px 14px;line-height:1.5;max-width:min(520px,78%)}#app .boss-hud{bottom:auto;top:150px;font-size:14px;max-width:70%;letter-spacing:.5px}
#app .interaction-hint{top:45%;font-size:14px;max-width:80%;background:#14220eef}#app .interaction-hint kbd{width:24px;height:24px;font-size:14px}
#app .tutorial-hint{position:absolute;z-index:9;left:50%;transform:translateX(-50%);bottom:calc(var(--field-height) + var(--safe-bottom) + 86px);max-width:420px;width:calc(100% - 32px);display:flex;gap:10px;align-items:center;padding:8px 12px;background:#101b0ff0;border:1px solid #9aa36c;color:#e4eac6;font-size:14px;line-height:1.5;pointer-events:auto}#app .tutorial-hint button{min-height:44px;min-width:48px;padding:6px;background:#3d4b2b;color:#e7e6bf;font-size:13px}
#app .threat-cue{position:absolute;z-index:7;right:14px;top:74px;max-width:200px;padding:8px 12px;font-size:14px;color:#ffe0b4;border:1px solid #bc895b;background:#341c12ed;pointer-events:none}#app .base-mode .threat-cue,#app .base-mode .tutorial-hint{display:none}
#app.reduced-motion .scanlines{display:none}#app.reduced-motion *,#app.reduced-motion *:before,#app.reduced-motion *:after{animation:none!important;transition:none!important}
#app .radar-panel.console-radar{pointer-events:auto}#app .progress-rows{display:grid;gap:8px;margin-top:16px}#app .progress-rows article{background:#0f1b0e;border:1px solid #65774f;padding:12px}#app .progress-rows strong{font-size:15px;display:block}#app .progress-rows span{font-size:14px;color:#cfdfb1;display:block;margin-top:6px}#app .progress-rows small{font-size:12px;color:var(--ux-muted);display:block;margin-top:6px}
@media(max-width:700px){
 :root{--field-height:132px}
 #app .wordmark{font-size:16px}#app .wordmark small,#app .logo-icon{display:none}#app .topbar,#app:not(.base-mode) .topbar{padding:7px 8px;height:58px;gap:6px}#app .top-actions{gap:4px}#app .icon-button,#app:not(.base-mode) .icon-button{padding:0 8px;font-size:13px}
 #app .base-screen{padding:74px 12px 16px}#app .hero-copy{margin-bottom:16px}#app .hero-copy h1{font-size:32px}#app .console-grid{grid-template-columns:1fr}#app .merc-section{border-right:0;border-bottom:1px solid #66744b}#app .merc-section,#app .mission-section{padding:14px}#app .merc-list{grid-template-columns:repeat(3,minmax(0,1fr))}#app .portrait{height:68px}#app .merc-stats{display:none}#app .merc-info{padding:8px}#app .merc-info strong{font-size:16px}#app .merc-info>span{font-size:12px}#app .briefing{grid-template-columns:1fr}#app .brief-map{display:none}#app .deploy-row{position:sticky;bottom:0;background:#172115f5;padding:8px 0;z-index:1}#app .deploy-row button{flex:1;font-size:14px;padding:10px;min-height:48px}#app .mission-tabs{max-height:240px}#app .merc-insight{margin:8px 0}
 #app .battle-console{grid-template-columns:85px minmax(0,1fr);gap:6px;padding:6px 8px calc(6px + var(--safe-bottom))}#app .console-vitals{padding:5px}#app .vital-heading strong{font-size:17px}#app .vital-heading span{display:none}#app .status-display{height:67px;margin-top:6px;padding:5px;gap:3px}#app .bio-meter{display:none}#app .health-readout small{font-size:12px}#app .health-readout b{font-size:16px;display:block;line-height:1.5}#app .armor-line{font-size:12px;margin-top:4px}#app .current-weapon{min-height:22px;font-size:14px;padding:3px 6px}#app .console-core{gap:3px}#app .weapon-button{height:44px;min-width:88px;flex-basis:88px;padding:3px 6px}#app .weapon-button small{display:none}#app .weapon-button strong{font-size:14px;bottom:13px;line-height:1.2}#app .loadout{min-height:44px;gap:5px}#app .quick-actions{gap:4px}#app .quick-actions button{font-size:14px;padding:6px 3px;min-width:0}#app .quick-actions kbd{display:none}#app .field-button{min-width:44px;font-size:12px}#app .field-readouts{gap:4px}
 #app .radar-panel.console-radar{position:absolute;top:64px;bottom:auto;right:8px;width:124px;height:auto;padding:4px 6px;border:1px solid #7f8d60;z-index:7}#app .radar-panel canvas{display:none}#app .radar-heading{margin:0}#app .radar-heading button{min-height:44px;font-size:13px}#app .radar-heading b{font-size:12px}#app .radar-readout{font-size:12px;margin:0;line-height:1.3}#app .objective{top:64px;left:8px;max-width:calc(100% - 148px);padding:8px 10px}#app .objective small{display:none}#app .objective strong{font-size:16px;margin:0 0 4px;display:block}#app .objective>span{font-size:14px;line-height:1.4;display:block}
 #app .threat-cue{top:150px;right:8px;font-size:13px;max-width:124px;padding:6px 9px}#app .boss-hud{top:192px;max-width:calc(100% - 32px);width:80%;font-size:14px}
 #app .tool-strip{left:8px;right:auto;bottom:calc(var(--field-height) + var(--safe-bottom) + 6px);max-width:calc(50% - 10px);padding:3px;gap:3px}#app .tool-strip button{font-size:13px;padding:7px 6px;min-width:0;white-space:nowrap}#app .tool-strip kbd{display:none}#app .magic-controls{right:8px;left:auto;bottom:calc(var(--field-height) + var(--safe-bottom) + 6px);max-width:calc(50% - 10px);padding:3px;gap:3px}#app .magic-controls span{font-size:12px}#app .magic-controls button{font-size:13px;padding:7px 6px;min-width:44px}
 #app .joystick,#app .mage-field .joystick,#app.mage-field .joystick{width:100px;height:100px;left:16px;bottom:calc(var(--field-height) + var(--safe-bottom) + 92px)}#app .stick-knob{width:36px;height:36px;left:32px;top:32px}#app .stick-ring{inset:18px}#app .joystick>span{font-size:12px;bottom:9px}
 #app .mobile-combat,#app.mage-field .mobile-combat{right:16px;bottom:calc(var(--field-height) + var(--safe-bottom) + 92px);gap:7px}#app .attack-button{width:92px;height:92px;font-size:23px}#app .attack-button span{font-size:12px}#app .melee-button{width:48px;height:48px;font-size:14px}
 #app .tutorial-hint{bottom:calc(var(--field-height) + var(--safe-bottom) + 204px);font-size:13px}#app .toast{bottom:calc(var(--field-height) + var(--safe-bottom) + 270px);font-size:14px;max-width:90%}#app .interaction-hint{display:none}
 #app.left-handed .joystick{left:auto;right:16px}#app.left-handed .mobile-combat{right:auto;left:16px}
 #app .shop-items.clinic-layout,#app .shop-items.gear-layout{grid-template-columns:1fr}#app .clinic-scan,#app .gear-profile{display:none}#app .gear-weapon{min-height:88px}#app .shop-meta{font-size:13px;gap:8px;flex-wrap:wrap}
 #app.map-mode .radar-panel{width:172px}#app.map-mode .radar-panel canvas{display:block;height:112px}#app.map-mode .threat-cue{top:270px}
}
@media(max-width:365px){#app .wordmark{font-size:14px}#app #soundButton{min-width:44px;max-width:58px;padding:0 4px;font-size:11px}#app .top-actions{gap:2px}#app .icon-button,#app:not(.base-mode) .icon-button{padding:0 5px;font-size:12px}#app .battle-console{grid-template-columns:72px minmax(0,1fr)}#app .health-readout b{font-size:14px}#app .merc-list{grid-template-columns:repeat(2,minmax(0,1fr))}#app .quick-actions button{font-size:13px}#app .field-button{font-size:12px}}
@media(max-height:520px) and (orientation:landscape){
 :root{--field-height:104px}
 #app .topbar,#app:not(.base-mode) .topbar{height:56px;padding-block:6px}#app .wordmark small{display:none}#app .base-screen{padding:68px 18px 14px}#app .base-screen .hero-copy{display:none}#app .console-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}#app .merc-section,#app .mission-section{padding:12px}#app .merc-info strong{font-size:16px}#app .merc-info>span{font-size:12px}#app .merc-stats{display:none}#app .mission-tabs{max-height:180px}
 #app .battle-console{grid-template-columns:110px minmax(0,1fr);padding:5px 12px calc(5px + var(--safe-bottom));gap:9px}#app .status-display{height:48px;margin-top:4px;padding:3px}#app .health-readout b{font-size:18px}#app .health-readout small{font-size:12px}#app .vital-heading strong{font-size:16px}#app .vital-heading span,#app .bio-meter{display:none}#app .console-vitals{padding:4px}#app .armor-line{font-size:12px;margin-top:3px}
 #app .console-core{display:grid;grid-template-columns:minmax(0,1fr) 280px;grid-template-rows:20px 1fr;gap:4px 8px}#app .current-weapon{grid-column:1/-1;font-size:14px;min-height:20px;padding:2px 7px}#app .loadout{min-height:44px;align-self:center}#app .weapon-button{height:52px;flex-basis:110px}#app .weapon-button small{display:none}#app .weapon-button strong{font-size:14px;bottom:18px}#app .field-readouts{align-self:center}#app .quick-actions button{min-height:44px;height:44px;font-size:14px}#app .quick-actions kbd{display:none}
 #app .radar-panel.console-radar{position:absolute;top:62px;bottom:auto;right:12px;width:148px;height:auto;padding:4px;z-index:7}#app .radar-panel canvas{display:none}#app .radar-heading button{min-height:44px}#app .radar-readout{font-size:12px}#app .objective{top:62px;left:12px;max-width:350px;padding:6px 10px}#app .objective small{display:none}#app .objective strong{font-size:16px;margin:0 8px 3px 0}#app .objective>span{font-size:14px}#app .objective-progress{margin-top:2px}
 #app .joystick,#app.mage-field .joystick{width:96px;height:96px;left:16px;bottom:calc(var(--field-height) + var(--safe-bottom) + 10px)}#app .stick-knob{width:36px;height:36px;top:30px;left:30px}#app .joystick>span{font-size:12px;bottom:8px}#app .stick-ring{inset:17px}#app .mobile-combat,#app.mage-field .mobile-combat{right:16px;bottom:calc(var(--field-height) + var(--safe-bottom) + 12px);gap:7px}#app .attack-button{width:84px;height:84px;font-size:21px}#app .attack-button span{font-size:12px}#app .melee-button{width:48px;height:48px;font-size:14px}
 #app .tool-strip{left:124px;right:auto;bottom:calc(var(--field-height) + var(--safe-bottom) + 8px);padding:3px;gap:4px;max-width:190px}#app .tool-strip button{font-size:13px;padding:7px;min-height:44px}#app .tool-strip span,#app .tool-strip kbd{display:none}#app .magic-controls{left:auto;right:178px;bottom:calc(var(--field-height) + var(--safe-bottom) + 8px);max-width:180px;padding:3px;gap:4px}#app .magic-controls button{font-size:13px;min-height:44px}#app .magic-controls span{font-size:12px}
 #app .threat-cue{top:62px;right:178px;font-size:13px;max-width:210px}#app .boss-hud{top:124px;font-size:14px;width:45%}#app .tutorial-hint{bottom:auto;top:126px;max-width:350px;font-size:13px;padding:5px 10px}#app .toast{bottom:auto;top:188px;font-size:14px;max-width:50%}#app .interaction-hint{display:none}
 #app.left-handed .joystick{left:auto;right:16px}#app.left-handed .mobile-combat{right:auto;left:16px}
 #app.map-mode .radar-panel{width:170px}#app.map-mode .radar-panel canvas{display:block;height:90px}#app.map-mode .threat-cue{right:190px}
}

@media(max-width:365px){#app:not(.base-mode) .wordmark{display:none}#app:not(.base-mode) .top-actions{width:100%;justify-content:flex-end}}

/* Field feedback stays readable and the navigation view uses a tactical pause. */
#app .toast.critical{border-color:#ebad7f;background:#321b12f5;color:#fff0d1;box-shadow:0 3px 18px #0009}
#app .critical-message .tutorial-hint,#app .boss-active .tutorial-hint,#app .controls-held .tutorial-hint{opacity:0;pointer-events:none}
#app .empty-ammo .current-weapon{background:#532516;color:#ffe0b6}
#app .field-log{display:grid;gap:8px;max-height:260px;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;margin-top:12px}
#app .field-log article{padding:10px 12px;background:#0d190c;border-left:3px solid #9bb66b}
#app .field-log article.critical{border-color:#df9b6d;background:#281a10}
#app .field-log small{font-size:12px;color:#c1c7a9}
#app .field-log p{font-size:14px;margin-top:4px}
#app .shop-feedback{min-height:24px;color:#e0eabd!important;background:#101b0d;font-size:14px;padding:8px 12px;margin:8px 0;border-left:3px solid #b2c788}
#app .shop-feedback:empty{display:none}
#app .navigation-sheet{width:min(620px,calc(100% - 24px))}
#app #navigationMap{display:block;width:100%;height:auto;max-height:55dvh;object-fit:contain;background:#071007;border:1px solid #8f9f6e;margin:14px 0}
#app .navigation-sheet>.primary-button{width:100%}
#app .purchase-action{display:flex;flex-direction:column;gap:7px;align-items:stretch;min-width:110px}
#app .shop-cost{font-size:14px;color:#e9d49b;text-align:center;white-space:nowrap}
#app .purchase-action button{min-height:44px;width:100%}
#app .result-tip{padding:12px;border-left:3px solid #b9c98c;background:#111c0e;color:#dce6c0!important;font-size:14px;line-height:1.7}
#app .result-actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}
#app .result-actions button{flex:1;min-width:160px;min-height:48px;font-size:16px}
@media(max-width:700px){#app .purchase-action{min-width:100px}#app .result-actions{flex-direction:column}#app .result-actions button{width:100%}}
#app.standalone-mode{--safe-bottom:0px}
@media(max-width:700px), (max-height:520px) and (orientation:landscape){
 #app.map-mode .radar-panel{width:124px}
 #app.map-mode .radar-panel canvas{display:none}
 #app.map-mode .threat-cue{top:150px;right:8px}
}
@media(max-height:520px) and (orientation:landscape){
 #app.map-mode .radar-panel{width:148px}
 #app.map-mode .threat-cue{top:62px;right:178px}
 #app .navigation-sheet .sheet-heading{margin-bottom:4px}
}
@media(max-height:650px) and (orientation:portrait){
 #app .joystick,#app.mage-field .joystick{width:84px;height:84px;bottom:calc(var(--field-height) + var(--safe-bottom) + 70px)}
 #app .stick-knob{width:32px;height:32px;top:26px;left:26px}
 #app .stick-ring{inset:15px}
 #app .mobile-combat,#app.mage-field .mobile-combat{bottom:calc(var(--field-height) + var(--safe-bottom) + 70px)}
 #app .attack-button{width:84px;height:84px;font-size:21px}
 #app .tutorial-hint{top:160px;bottom:auto;max-width:300px;font-size:13px}
 #app .toast{top:156px;bottom:auto;max-width:90%;font-size:14px}
 #app .boss-hud{top:205px}
}