/* One landscape, on every screen. Panels sit over the world; gameplay keeps its space. */
:root { --world-panel: #20382fea; --world-line: #b7b39242; --world-text: #f4eddd; }
html[data-shell="on"], html[data-shell="on"] body { width:100%; height:100%; overflow:hidden; background:#172d25; }
html[data-shell="on"] .site-header, html[data-shell="on"] main#top > :not(#play) { display:none!important; }
html[data-shell="on"] #shell .sh-menu { position:relative; background:#213b2e; }
#shell .mx-topbar { position:absolute; z-index:8; top:0; left:0; right:0; min-height:62px; padding:calc(8px + env(safe-area-inset-top)) 16px 8px; background:linear-gradient(#162a24f5,#162a24bb,transparent); border:0; pointer-events:none; }
#shell .mx-topbar > * { pointer-events:auto; }
#shell .mx-topbar-title { font-size:20px; font-weight:600; }
#shell .mx-currency { border-color:var(--world-line); background:#1b302bd9; min-height:36px; }
#shell .mx-tabbar { position:absolute; z-index:9; bottom:0; left:50%; transform:translateX(-50%); width:min(100%,600px); grid-template-columns:repeat(4,1fr); min-height:64px; padding:4px 6px calc(4px + env(safe-area-inset-bottom)); border:1px solid var(--world-line); border-bottom:0; border-radius:18px 18px 0 0; background:var(--world-panel); backdrop-filter:blur(12px); }
#shell .mx-tabbar .mx-tab { min-height:52px; border:0; border-radius:10px; font-size:12px; gap:3px; }
#shell .mx-tabbar .mx-tab .mx-ic { width:20px; height:20px; }
#shell .mx-tabbar .mx-tab[aria-current] { background:#d3ba7e24; color:#f0d39b; }
#shell .sh-screen { position:relative; padding:calc(64px + env(safe-area-inset-top)) 0 calc(66px + env(safe-area-inset-bottom)); }
#shell .mx-screen-body { width:min(100%,680px); margin:0 auto; padding:16px; gap:12px; }
#shell .sh-screen:has(.sh-village-world) { padding:0; }
#shell .sh-village-world { position:absolute; inset:0; width:100%; max-width:none; padding:0; overflow:hidden; }
#shell .sh-village-world .sh-village { position:absolute; inset:0; width:100%; height:100%; border:0; border-radius:0; }
#shell .sh-village-toolbar { position:absolute; z-index:5; top:calc(66px + env(safe-area-inset-top)); left:12px; right:12px; display:flex; gap:8px; justify-content:space-between; align-items:center; pointer-events:none; }
#shell .sh-village-toolbar > * { pointer-events:auto; }
#shell .sh-village-toolbar .mx-seg { margin:0; min-height:44px; width:auto; background:var(--world-panel); border:1px solid var(--world-line); border-radius:12px; }
#shell .sh-village-toolbar .mx-seg button { min-height:42px; font-size:12px; padding:8px 12px; }
#shell .sh-village-toolbar > .mx-btn { min-height:44px; background:var(--world-panel); font-size:12px; text-decoration:none; }
#shell .sh-village-world #sh-village-info { position:absolute; z-index:5; bottom:calc(76px + env(safe-area-inset-bottom)); left:12px; right:12px; max-height:30dvh; overflow:auto; overscroll-behavior:contain; gap:6px; scrollbar-width:thin; }
#shell .sh-v-onboarding { padding:12px 14px; gap:8px; border-color:var(--world-line); background:var(--world-panel); border-radius:14px; backdrop-filter:blur(10px); }
#shell .sh-v-onboarding .sh-vinfo-tx b { color:var(--world-text); font-weight:650; }
#shell .sh-v-onboarding-actions { display:flex; gap:8px; }
#shell .sh-v-onboarding-actions .mx-btn { font-size:12px; }
#shell .sh-vinfo-tx small { line-height:1.4; }
#shell .sh-v-details { background:var(--world-panel); border-radius:12px; padding:8px 12px; border:1px solid var(--world-line); }
#shell .sh-v-details summary { min-height:28px; cursor:pointer; font-size:12px; display:list-item; align-content:center; }
#shell .sh-v-details > :not(summary) { margin-top:8px; }
#shell .sh-village .mx-float-btn.sh-gear { display:none; }
#shell .sh-chip { font-size:11px; font-weight:500; background:#193028dd; border-color:#c9c59a55; }
#shell .sh-village-world .mx-plot { background:#a9b98b20; border:1px dashed #decea48a; color:#f0dab0; border-radius:10px; box-shadow:none; }
#shell .sh-village-world .mx-plot.is-locked { opacity:.45; }
#shell .mx-btn { border-color:var(--world-line); box-shadow:none; border-radius:10px; }
#shell .mx-btn-primary { background:#d8bb82; color:#233128; font-weight:700; }
#shell .mx-slab, #shell .mx-row { border-color:var(--world-line); }
#shell .sh-more-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
#shell .sh-more-grid .mx-btn { min-height:92px; display:flex; flex-direction:column; gap:10px; font-size:13px; text-decoration:none; }
#shell .sh-fullsheet { display:flex; align-items:flex-end; justify-content:center; padding:0; }
#shell .sh-fullsheet .mx-modal { width:100%; height:auto; max-height:86dvh; max-width:600px; border:1px solid var(--world-line); border-radius:22px 22px 0 0; background:#20372ff7; box-shadow:0 -18px 60px #0b17173d; }
#shell .sh-sheet-header { padding:16px 18px 12px; background:transparent; border-color:var(--world-line); }
#shell .sh-sheet-header > div > span { display:none; }
#shell .sh-sheet-header h2 { font-size:23px; font-weight:500; }
#shell .sh-sheet-body { width:100%; padding:16px 18px calc(22px + env(safe-area-inset-bottom)); }
#shell .sh-sheet-close { background:#314a3d; }
#shell .sh-scrim, #shell .mx-scrim { background:#071b1447; backdrop-filter:blur(2px); }
#shell .sh-building-art { min-height:120px; }
#shell .sh-building-art img { width:130px; }
#shell .sh-march { gap:12px; }
#shell .sh-chapters { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
#shell .sh-chapter { display:flex; flex-direction:column; gap:5px; align-items:flex-start; text-align:left; min-height:80px; padding:12px; color:var(--world-text); background:#304b3d; border:1px solid var(--world-line); border-radius:14px; font:inherit; cursor:pointer; }
#shell .sh-chapter strong { font:600 17px Georgia,serif; }
#shell .sh-chapter small { font-size:11px; color:#c3cdbd; }
#shell .sh-chapter[aria-pressed="true"] { background:#567153; border-color:#d5c18d; }
#shell .sh-chapter:disabled { opacity:.55; cursor:default; }
#shell .sh-scene { min-height:170px; flex:1 0 170px; border-color:var(--world-line); }
#shell .sh-card, #shell .sh-supply-brief { background:#294135; border-radius:14px; }
#shell .sh-supply-brief p { font-size:12px; }
#shell .sh-march .mx-need { text-align:left; }
#shell .sh-march-tools { display:flex; gap:8px; }
#shell .sh-march-tools > * { flex:1; }
/* A single full-screen field. HUD and contextual commands float over it. */
#play { --mx-phone-head:calc(54px + env(safe-area-inset-top)); --mx-phone-hud:48px; --mx-phone-nav:calc(62px + env(safe-area-inset-bottom)); --mx-phone-field-dock:76px; --mx-phone-content:calc(var(--mx-phone-head) + var(--mx-phone-hud)); }
#play .stage-frame, #play[data-mobile-view]:not([data-mobile-view="field"]):not([data-mobile-view="map"]) .stage-frame { display:block!important; inset:0!important; width:100%!important; height:100%!important; padding:0!important; }
#play .field-surface { position:absolute; inset:0; width:100%; height:100%; aspect-ratio:auto; }
#play .stage-top { position:absolute; z-index:4; top:calc(var(--mx-phone-content) + 8px); left:12px; right:12px; width:auto; padding:8px 10px; border:1px solid var(--world-line); border-radius:10px; background:#20372fdf; pointer-events:none; }
#play .mx-mobile-field-tip { font-size:12px; line-height:1.35; }
#play .mx-mobile-field-status { font-size:12px; font-weight:600; }
#play .mx-mobile-header { background:linear-gradient(#172e26ed,#172e26d9); box-shadow:none; border:0; padding-inline:12px; }
#play .mx-mobile-identity strong { font-size:9px; font-weight:600; }
#play .mx-mobile-identity span { font-size:16px; font-weight:500; }
#play .mx-mobile-header button { font-weight:600; }
#play .match-hud { background:#172e26db; border:0; box-shadow:none; padding:0 12px; }
#play .hud-stat { flex-direction:row!important; gap:6px; }
#play .hud-stat strong { font-size:15px; font-weight:650; }
#play .hud-stat small { font-size:9px; letter-spacing:.03em; }
#play .mx-mobile-nav { grid-template-columns:repeat(4,1fr); inset:auto 8px 0; height:var(--mx-phone-nav); border:1px solid var(--world-line); border-radius:16px 16px 0 0; background:var(--world-panel); box-shadow:none; backdrop-filter:blur(10px); }
#play .mx-mobile-nav [data-mx-view="menu"] { display:none; }
#play .mx-mobile-nav button { font-size:12px; font-weight:500; }
#play .mx-mobile-nav button[aria-current] { background:#d7be852a; color:#f0d39b; }
#play .command-strip { border:1px solid var(--world-line); border-radius:14px; background:var(--world-panel); backdrop-filter:blur(10px); }
#play[data-mobile-view="field"] .command-strip { left:8px; right:8px; bottom:calc(var(--mx-phone-nav) + 8px); height:var(--mx-phone-field-dock); padding:6px; gap:6px; }
#play .command-strip button.mx-cmd { background:#35503e; border-color:#acb49340; font-weight:500; }
#play .command-strip button.mx-cmd strong { font-size:12px; font-weight:600; }
#play .command-strip button.mx-cmd small { font-size:12px; }
#play .command-strip button.mx-cmd:disabled { opacity:.64; }
#play .command-strip #next-wave:not(:disabled) { background:#d3b67b; color:#203329; }
#play .command-strip #next-wave:not(:disabled) :is(small,.mx-ic) { color:#3d4c37; }
#play .field-tools { bottom:calc(var(--mx-phone-nav) + var(--mx-phone-field-dock) + 20px); inset-inline:12px; }
#play .field-tools button { background:#20372fe6; border-color:var(--world-line); font-size:12px; font-weight:500; }
#play:not([data-mobile-view="field"]) .field-tools { display:none; }
#play[data-mobile-view="orders"] .command-strip, #play[data-mobile-view="map"] .world-controls,
#play[data-mobile-view="log"] .command-desk, #play[data-mobile-view="menu"] .match-actions {
 top:auto; bottom:calc(var(--mx-phone-nav) + 8px); left:8px; right:8px; max-height:55dvh; height:auto; padding:14px; border:1px solid var(--world-line); border-radius:18px; background:#20372ff2; backdrop-filter:blur(10px); gap:8px; overflow:auto;
}
#play[data-mobile-view="orders"] .command-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
#play[data-mobile-view="orders"] .command-strip button.mx-cmd { min-height:68px; padding:6px; }
#play .mx-mobile-panel-head { margin:0 0 6px; }
#play .mx-mobile-panel-head h2 { font-size:21px; font-weight:500; }
#play .mx-mobile-panel-head > small, #play .mx-mobile-panel-head > p:not(.mx-mobile-order-brief) { display:none; }
#play[data-mobile-view="orders"] .mx-mobile-order-brief { font-size:12px; padding:8px; margin-top:6px; }
#play .formation-orders { background:#2b4437; border-color:var(--world-line); padding:10px; }
#play .formation-orders h3 { font-size:13px; font-weight:600; }
#play .formation-choices button { background:#243c31; border-color:var(--world-line); font-size:12px; font-weight:500; }
#play .formation-choices button[aria-pressed="true"] { background:#d3b67b; color:#203329; }
#play #formation-description { font-size:12px; }
#play .world-controls button { font-size:12px; }
#play .field-ground { bottom:calc(var(--mx-phone-nav) + 88px); }
#play[data-mobile-view="map"] .field-ground { bottom:calc(50dvh + 20px); }
#play .mx-cmd[hidden], #play .match-actions button[hidden] { display:none!important; }
#play .command-desk .desk-title, #play .command-desk .desk-footer { display:none; }
#play .command-desk .feed-head { padding:10px 0; }
#play .command-desk .battle-brief { margin-top:0; }
@media (min-width:721px) {
 #shell .mx-topbar { padding-inline:28px; }
 #shell .mx-screen-body { width:min(100%,760px); }
 #shell .sh-village-world { width:100%; }
 #shell .sh-village-world #sh-village-info { left:24px; right:auto; width:340px; bottom:96px; max-height:48dvh; }
 #shell .sh-village-toolbar { left:24px; right:24px; }
 #shell .sh-fullsheet { align-items:center; padding:24px; }
 #shell .sh-fullsheet .mx-modal { border-radius:22px; max-height:90dvh; }
 #play .mx-mobile-header { padding-inline:22px; }
 #play .match-hud { width:390px; left:20px; right:auto; top:calc(var(--mx-phone-head) + 6px); border-radius:12px; }
 #play .stage-top { left:22px; right:auto; max-width:400px; top:calc(var(--mx-phone-content) + 16px); }
 #play .mx-mobile-nav { left:50%; right:auto; transform:translateX(-50%); width:480px; }
 #play[data-mobile-view="field"] .command-strip { left:50%; right:auto; transform:translateX(-50%); width:480px; }
 #play .field-tools { left:22px; right:22px; bottom:24px; }
 #play[data-mobile-view="orders"] .command-strip, #play[data-mobile-view="map"] .world-controls,
 #play[data-mobile-view="log"] .command-desk, #play[data-mobile-view="menu"] .match-actions { left:auto; right:22px; width:350px; top:calc(var(--mx-phone-head) + 16px); bottom:22px; max-height:calc(100dvh - var(--mx-phone-head) - 38px); }
 #play .formation-orders { display:block; }
 #play[data-mobile-view="field"] .formation-orders { display:none; }
}
@media (orientation:landscape) and (max-height:540px) {
 #play .stage-top { display:none; }
 #play[data-mobile-view="map"] .stage-frame { right:0!important; width:100%!important; }
 #play .mx-mobile-nav { width:300px; left:8px; right:auto; transform:none; }
 #play[data-mobile-view="field"] .command-strip { width:300px; left:8px; right:auto; transform:none; }
 #play[data-mobile-view="orders"] .command-strip, #play[data-mobile-view="map"] .world-controls,
 #play[data-mobile-view="log"] .command-desk, #play[data-mobile-view="menu"] .match-actions { width:min(48vw,360px); left:auto; right:8px; top:56px; bottom:8px; max-height:none; }
 #shell .sh-village-world #sh-village-info { width:270px; left:auto; right:10px; top:116px; bottom:74px; max-height:none; }
 #shell .sh-village-toolbar { top:64px; }
 #shell .sh-fullsheet .mx-modal { max-height:96dvh; }
 #shell .sh-building-art { display:none; }
 #play .field-tools { left:auto; width:210px; right:8px; bottom:18px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; } }

#play .field-camera { order:2; border-top:1px solid var(--world-line); padding-top:6px; margin-top:4px; }
#play .field-camera summary { min-height:44px; align-content:center; font-size:12px; color:#c7d1bf; cursor:pointer; }
#play .field-camera[open] summary { color:#e9c78a; }
#play .field-construction { order:1; }
#play .field-construction #survey-sites { width:100%; min-height:44px; }
#play #site-description { margin:8px 0; font-size:13px; line-height:1.4; }
#play .site-actions { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
#play .site-actions #site-build { grid-column:1/-1; min-height:44px; color:#233128; background:#d8bb82; }
#play .site-actions #site-build:disabled { color:#b9c7ba; background:#2d4438; }
#play .mx-mobile-header .mx-mobile-playback, #play .mx-mobile-header .mx-mobile-settings, #play .mx-mobile-header #sh-leave { font-weight:600; font-size:12px; }
#play .field-tools button[aria-pressed="true"] { background:#d8bb82; color:#233128; }
#play[data-mobile-view="map"] .world-controls { align-content:start; }
@media(min-width:721px) { #play[data-mobile-view="map"] .world-controls { bottom:auto; height:auto; } }
@media(orientation:landscape) and (max-height:540px) { #play[data-mobile-view="map"] .world-controls { bottom:8px; } }

#play .field-construction #survey-sites[aria-expanded="true"] { display:none; }
#play #site-description { color:#e7e9d5; }

#shell .sh-scene.is-ironwood { background-image:linear-gradient(180deg,transparent 55%,#142820bf),url("brand/scenes/ironwood-reach-gameplay.jpg");background-position:center 40%; }
#play .match-hud { pointer-events:none; }
@media(orientation:landscape) and (max-height:540px) {
 #play .match-hud { left:8px; right:auto; width:min(46vw,360px); }
 #play .match-hud .hud-stat { gap:3px; }
 #play .match-hud .hud-stat small { font-size:8px; }
 #play .match-hud .hud-stat strong { font-size:12px; }
}