/* V70.1: measured Three Posters geometry + tokens copied from menu-v64. */
:root {
 --riot-panel:#101c22;
 --riot-panel-deep:#0b151b;
 --riot-text:#e8e0cc;
 --riot-muted:#aab0ac;
 --riot-accent:#eaa75b;
 --riot-selection:#efb065;
 --riot-button:#e6a35f;
 --riot-button-edge:#f2bf82;
 --riot-line:#78858070;
 --riot-font:'Ops Pixel',monospace;
}
#mission-select70[hidden]{display:none!important}
body.mission-select-open70{overflow:hidden}
body.mission-select-open70 main{position:fixed;inset:0;max-width:none;width:100%;height:100dvh;margin:0;padding:0;overflow:hidden}
body.mission-select-open70 main>header{display:none}
body.mission-select-open70 .game{width:100%;height:100%;min-height:0;max-height:none;border:0}
body.mission-select-open70 canvas{width:100%;height:100%;min-width:0;aspect-ratio:auto;object-fit:cover}
body.mission-select-open70 #overlay,body.mission-select-open70 #menu-credit64{visibility:hidden;pointer-events:none}
/* Campaign Spotlight composition. Armory palette, typography, panel and button
   treatments; page-specific image layout and 44px touch floor. */
#mission-select70{
 position:absolute;inset:0;z-index:8;display:grid;grid-template-rows:auto minmax(620px,1fr) auto;
 gap:22px;padding:max(3.4vh,env(safe-area-inset-top)) max(2.4vw,env(safe-area-inset-right)) max(3.4vh,env(safe-area-inset-bottom)) max(2.4vw,env(safe-area-inset-left));
 background:var(--a73-bg);color:var(--a73-text);font-family:var(--a73-font);text-align:left;overflow:auto;touch-action:pan-y;
}
#mission-select70>*{width:100%;max-width:1600px;margin:0 auto;min-width:0;box-sizing:border-box}
.mission-heading70{display:flex;align-items:center;justify-content:space-between;gap:28px;border-bottom:1px solid #788580;padding-bottom:18px}
.mission-heading70 h2{font:400 clamp(24px,2.9vw,50px)/1.3 var(--a73-font);color:#ddd9c1;margin:0;letter-spacing:1px}
#mission-back70{position:static;transform:none;min-width:44px;min-height:44px;padding:12px 20px;background:var(--a73-panel);border:1px solid #788580;border-radius:0;color:var(--a73-text);font:400 14px/1.4 var(--a73-font);box-shadow:none;letter-spacing:1px}
#mission-back70:hover{border-color:var(--a73-amber)}
.mission-posters70{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:12px;min-height:0}
.mission-poster70{position:relative;isolation:isolate;min-width:0;overflow:hidden;border:1px solid var(--a73-line);background:var(--a73-panel)}
#mission-campaign-card70{grid-row:1/3;border:2px solid var(--a73-amber);cursor:pointer}
.mission-art70{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;max-width:none}
.mission-art-campaign70{object-position:62% 32%}
.mission-art-operation70{object-position:65% 40%}
.mission-art-territory-raid70{object-position:48% 34%}
.mission-poster70:after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,#0b151bf2 0%,#0b151bcc 25%,transparent 75%),linear-gradient(0deg,#0b151b 0%,transparent 75%)}
#mission-campaign-card70:after{background:linear-gradient(90deg,#0b151bcc,transparent 75%),linear-gradient(0deg,#0b151bf2,transparent 70%)}
.mission-copy70{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:12px;padding:26px;min-height:100%;box-sizing:border-box;width:55%;pointer-events:none}
.mission-copy70 h3{font:400 clamp(18px,1.6vw,27px)/1.3 var(--a73-font);margin:0;color:var(--a73-text);overflow-wrap:normal}
.mission-copy70 p{font:400 12px/1.85 var(--a73-font);margin:0;color:var(--a73-muted)}
.mission-development70{border:1px solid #788580;padding:6px;font:400 9px/1.5 var(--a73-font);color:var(--a73-muted);white-space:nowrap;background:var(--a73-bg)}
#mission-campaign-card70 .mission-copy70{width:58%;padding:30px;gap:18px}
#mission-campaign-card70 h3{font-size:clamp(28px,3.4vw,58px)}
#mission-campaign-card70 h3:after{content:'';display:block;width:24px;height:4px;margin-top:18px;background:var(--a73-amber)}
#mission-campaign-card70 .mission-story70{font-size:clamp(16px,1.5vw,24px);line-height:1.4;color:var(--a73-text);text-transform:uppercase}
#mission-campaign-card70 .mission-description70{font-size:13px}
#mission-campaign70{pointer-events:auto;min-height:54px;min-width:44px;width:100%;padding:12px 20px;border:2px solid #f2bf82;border-radius:0;box-shadow:inset 0 0 0 2px #573b28;background:#e6a35f;color:#102028;font:400 clamp(12px,1.35vw,22px)/1.4 var(--a73-font);margin-top:8px}
#mission-campaign70:hover{background:#efb065}
#mission-select70 :is(button,#mission-campaign-card70):focus-visible{outline:3px solid var(--a73-text);outline-offset:3px}
.mission-footer70{display:flex;align-items:center;gap:16px}
#mission-message70{font:11px/1.5 var(--a73-font);color:var(--a73-muted)}
@media(max-width:1100px){
 .mission-copy70{padding:18px;width:60%}
 #mission-campaign-card70 .mission-copy70{padding:20px;width:65%}
 .mission-copy70 h3{font-size:20px}
 .mission-copy70 p{font-size:11px}
}
/* Portrait: keep all faces above the copy, with a natural vertical reading order. */
@media(max-width:800px) and (orientation:portrait){
 #mission-select70{display:flex;flex-direction:column;padding: max(18px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));gap:22px}
 .mission-heading70{flex-wrap:wrap;gap:12px}
 .mission-heading70 h2{font-size:24px}
 .mission-posters70{display:flex;flex-direction:column;flex:none;gap:18px}
 .mission-poster70{display:flex;flex-direction:column;flex:none}
 .mission-art70{position:static;flex:none;width:100%;height:220px}
 .mission-art-campaign70{height:330px;object-position:62% 25%}
 .mission-art-operation70{object-position:65% 40%}
 .mission-art-territory-raid70{object-position:48% 30%}
 .mission-poster70:after{display:none}
 .mission-copy70,#mission-campaign-card70 .mission-copy70{width:100%;padding:20px;gap:12px;min-height:0;border-top:1px solid var(--a73-line)}
 #mission-campaign-card70 h3{font-size:28px}
 #mission-campaign-card70 .mission-description70{font-size:12px}
 #mission-campaign70{font-size:14px}
 .mission-copy70 h3{font-size:22px}
 .mission-copy70 p{font-size:12px}
 .mission-footer70{flex:none}
}
/* Short landscape keeps readable type and controls; scroll instead of scaling. */
@media(max-height:650px) and (orientation:landscape){
 #mission-select70{padding:max(12px,env(safe-area-inset-top)) max(2.4vw,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(2.4vw,env(safe-area-inset-left));gap:12px;grid-template-rows:auto minmax(500px,1fr) auto}
 .mission-heading70{padding-bottom:12px;gap:16px}
 .mission-heading70 h2{font-size:24px}
 .mission-posters70{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
 .mission-art-campaign70{object-position:62% 28%}
 .mission-art-operation70{object-position:68% 42%}
 .mission-art-territory-raid70{object-position:48% 35%}
 #mission-campaign-card70 .mission-copy70{width:75%;padding:18px;gap:12px}
 #mission-campaign-card70 h3{font-size:28px}
 #mission-campaign-card70 .mission-story70{font-size:16px}
 .mission-copy70{padding:14px;width:65%;gap:8px}
 .mission-copy70 h3{font-size:18px}
 #mission-campaign70{font-size:14px}
}
