
/* WAR IS BLIND — Mission Dispatch / WWII-era field briefing aesthetic */
:root{--ink:#0b0e0c;--olive:#c1bd94;--white:#eee9da;--muted:#a4a28f;--line:#3d4339}
body.war-body{background:#0a0c0a;color:var(--white)}
body:before{content:"";position:fixed;inset:0;z-index:100;pointer-events:none;opacity:.065;background-image:repeating-linear-gradient(25deg,transparent 0 2px,rgba(255,255,255,.10) 3px 4px);mix-blend-mode:screen}
.war-btn{background:#d0c8a2;border-color:#d0c8a2;color:#1a1c12;font-weight:700;letter-spacing:.15em;text-transform:uppercase;transition:transform .2s,background .2s,box-shadow .2s}
.war-btn:hover{transform:translateY(-2px);background:#e4d8ae;box-shadow:0 8px 28px #0008}
.site-header--mission{position:relative;z-index:5;background:#11140f;height:auto;min-height:78px;border-bottom:1px solid #535440}
.site-header--mission .brand{color:#f0e9d4;white-space:nowrap}
.site-header--mission .brand span:not(.brand-reg){color:#c9bd85}
.site-header--mission .header-nav{gap:23px;letter-spacing:.12em}
.mission-replay{background:transparent;color:#b0a88a;border:1px solid #555843;font:10px var(--mono);letter-spacing:.08em;padding:10px;white-space:nowrap}
.mission-replay:hover{border-color:#bdb48c;color:#eee9da}
.war-command{min-height:min(875px,96svh);background:radial-gradient(ellipse at 60% 48%,#293023 0%,#111810 36%,#0b0d0a 74%);border-bottom:4px solid #a49d76;padding:26px max(5%,24px);isolation:isolate}
.war-command:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#b6b89a14 1px,transparent 1px),linear-gradient(90deg,#b6b89a14 1px,transparent 1px);background-size:74px 74px;opacity:.47;pointer-events:none}
.war-command:after{opacity:.5}
.war-command-grid{position:absolute;width:600px;height:600px;top:50%;left:50%;transform:translate(-50%,-50%);border:1px solid #868b6349;border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 77px,#a2a27824 78px 79px);pointer-events:none}
.war-command-grid:after{content:"";position:absolute;inset:20%;border:1px dashed #9c9f7652;border-radius:50%}
.war-sweep{position:absolute;top:50%;left:50%;width:400px;height:400px;transform-origin:0 0;background:conic-gradient(from 0deg,transparent 0 310deg,#c7b8751a 335deg,#f4df8447 358deg,transparent 360deg);border-radius:50%;opacity:.6;animation:field-sweep 14s linear infinite;pointer-events:none}
@keyframes field-sweep{to{transform:rotate(360deg)}}
.war-command .hero-topline,.war-command .hero-bottomline{color:#c0baa0;font-size:10px;letter-spacing:.14em}
.war-command .hero-core{padding:55px 20px 45px}
.command-classified{color:#e6d59b;border:1px solid #a59c66;padding:10px 20px;letter-spacing:.2em;font:10px var(--mono);margin:14px 0}
.war-command .hero-mark{width:155px;margin:19px auto 12px}
.war-command .hero-mark img{animation:war-spin 28s linear infinite}
.war-command .hero-core .overline{margin:14px 0 18px;letter-spacing:.18em}
.war-command h1{font:900 clamp(92px,13.8vw,200px)/.75 var(--display);letter-spacing:-.025em;text-shadow:0 15px 50px #000a;margin:9px 0 35px}
.war-command h1 em{color:#d9cfa0}
.war-command .hero-deck{color:#ece4ce;font-size:11px;letter-spacing:.22em}
.command-timer-title{font:10px var(--mono);letter-spacing:.2em;color:#b1b59d;margin:15px 0 8px}
.war-command .hero-timer{margin:12px auto 22px}
.war-command .hero-timer b{font-size:52px}
.war-command .hero-timer span{color:#bebda9}
.command-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;justify-content:center}
.command-secondary{padding:20px;color:#e5dfc9;font-size:10px;letter-spacing:.13em;border-bottom:1px solid #777b5d}
.command-secondary:hover{color:#fff}
.command-crosshair{position:absolute;inset:0;pointer-events:none;display:flex;justify-content:space-between;padding:15% 4%;align-items:center;color:#b8b18980}
.command-crosshair span{font-size:30px}
.command-coordinate{position:absolute;right:5%;bottom:78px;display:flex;flex-direction:column;align-items:flex-end;gap:5px;opacity:.65;color:#dad2b4;font-size:9px;letter-spacing:.12em}
.command-coordinate strong{font-size:13px}
.mission-catalog{padding-top:130px}
.mission-catalog .section-heading h2{font-size:clamp(74px,9vw,135px)}
.mission-catalog .section-heading em{color:#c1b68b}
.mission-card{background:#10130f;border:1px solid #343c32;padding:7px 7px 20px;transition:transform .3s,border-color .3s}
.mission-card:hover{transform:translateY(-4px);border-color:#adad88}
.mission-card .card-media{background:#d8d8ce}
.mission-card .card-signal{left:10px;right:auto;background:#10120fe8;color:#ebe7d3}
.mission-card .card-badge{position:absolute;right:10px;top:10px;background:#6d6b3e;color:#fff;padding:8px 12px;font:10px var(--mono)}
.mission-card .card-caption{padding:15px 12px 0}
.mission-card h3{font-size:31px;max-width:250px}
.mission-card small{display:block;margin-top:12px;color:#b6b6a4}
.mission-story{position:relative;min-height:610px;overflow:hidden;background:#cbc4a6;color:#191d14;display:grid;place-items:center;padding:110px 7%}
.mission-story:before{content:"";position:absolute;inset:0;opacity:.31;background:repeating-linear-gradient(0deg,#666c4840 0 1px,transparent 1px 65px),repeating-linear-gradient(90deg,#666c4840 0 1px,transparent 1px 65px)}
.mission-story-map{position:absolute;inset:25px;display:flex;justify-content:space-between;align-items:center;color:#52603b99;font-size:13px}
.mission-story-map b{font-size:70px;font-weight:300;opacity:.35}
.mission-story-inner{position:relative;max-width:930px;text-align:center}
.mission-story .micro{color:#434c33;font-weight:700}
.mission-story h2{font:900 clamp(72px,10vw,140px)/.85 var(--display);margin:25px 0}
.mission-story h2 em{font-style:normal;color:#657044}
.mission-story-inner>p{font:12px/2 var(--mono);letter-spacing:.10em;max-width:620px;margin:20px auto 35px}
.mission-transmission{background:#1b2117;color:#eee8d2;max-width:750px;margin:40px auto 0;padding:30px;border:1px solid #5b654b;display:flex;flex-direction:column;gap:12px}
.mission-transmission>span{font-size:9px;letter-spacing:.18em;color:#c3bd96}
.mission-transmission>strong{font:800 37px var(--display)}
.mission-newsletter{display:flex;gap:8px;flex-wrap:wrap}
.mission-newsletter input{flex:1;min-width:200px;border:1px solid #636b55;background:#111610;color:#eee8d2;padding:18px;font:12px var(--mono)}
.mission-newsletter .war-btn{padding:16px;min-height:54px}
.mission-success{width:100%;margin-top:12px;color:#d0dda1;font-size:11px}
.ww2-product{padding-top:65px}
.ww2-product .product-issue-header{display:flex;justify-content:space-between;background:#1c241b;padding:14px 18px;font-size:10px;letter-spacing:.10em;border:1px solid #4c5544}
.ww2-product .spin-stage{border:2px solid #65704f}
.ww2-product .spin-hint,.ww2-product .spin-counter{background:#171d15e8}
.ww2-product .product-info h1{color:#ede7d5}
.ww2-product .product-price{color:#d2c698}
.ww2-product .spin-dots button{padding:17px 8px;font-size:8px}
.ww2-product .render-disclaimer{font-size:10px;line-height:1.85}
.mission-intro[hidden]{display:none!important}
.mission-intro{position:fixed;inset:0;z-index:9000;overflow-y:auto;color:#e7e1c8;background:radial-gradient(ellipse at center,#262d21 0,#0b0f0b 75%);padding:24px;display:grid;place-items:center;isolation:isolate}
.mission-intro:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(#d2c49512 1px,transparent 1px),linear-gradient(90deg,#d2c49512 1px,transparent 1px);background-size:72px 72px}
.mission-noise{position:absolute;inset:0;pointer-events:none;opacity:.15;background:repeating-linear-gradient(50deg,transparent 0 7px,#a0a58d16 8px 9px)}
.mission-stage{width:min(960px,100%);min-height:min(750px,calc(100svh - 48px));display:flex;flex-direction:column;justify-content:space-between;gap:25px;position:relative}
.mission-top,.mission-foot{display:flex;justify-content:space-between;gap:18px;border-top:1px solid #aaa57f6b;padding-top:16px;font:10px var(--mono);letter-spacing:.12em;color:#b5b494}
.mission-foot{font-size:9px;border-top:0;border-bottom:1px solid #aaa57f6b;padding:0 0 14px}
.mission-insignia{position:absolute;right:20px;top:55px;width:100px;opacity:.72}
.mission-insignia img{width:100%;height:auto;filter:sepia(.55)}
.mission-eyebrow{text-align:center;margin:16px auto -12px;letter-spacing:.24em;color:#c1b98d;font:10px var(--mono)}
.mission-dossier{position:relative;margin:auto;max-width:640px;width:100%;padding:38px clamp(20px,5vw,65px);background:#c4bda0;color:#202518;box-shadow:15px 18px 0 #070807,0 0 0 1px #ded9bb;transform:rotate(-1deg);overflow:hidden}
.mission-dossier:before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 20px,#262c2111 21px 22px)}
.mission-dossier-head{display:flex;justify-content:space-between;gap:15px;padding:0 0 18px;border-bottom:2px solid #55563b;font:bold 10px var(--mono);letter-spacing:.12em}
.mission-stamp{position:absolute;right:18px;top:90px;transform:rotate(14deg);color:#8b3f36;border:3px solid #8b3f36;padding:10px 14px;opacity:.72;font:bold 18px var(--mono);letter-spacing:.14em}
.mission-dossier h2{position:relative;font:900 clamp(68px,10vw,116px)/.80 var(--display);margin:40px 0 22px}
.mission-dossier h2 em{font-style:normal;color:#55613c}
.mission-type{min-height:30px;font:11px/1.8 var(--mono);letter-spacing:.12em;margin:0 0 25px}
.mission-list{display:grid;gap:6px;font:10px var(--mono);letter-spacing:.11em}
.mission-list span{padding:11px 0;border-top:1px dashed #77795b;display:flex;justify-content:space-between;gap:15px}
.mission-list b{text-align:right}
.mission-meter{margin:25px 0 19px;display:grid;gap:10px;font:bold 10px var(--mono);letter-spacing:.11em}
.mission-track{background:#7a8063;height:6px;overflow:hidden}
.mission-track i{display:block;height:100%;width:5%;background:#292f20;transition:width .6s}
.mission-enter{width:100%;background:#252c1e;color:#f3eccd;border:1px solid #252c1e;font:bold 14px var(--mono);letter-spacing:.15em;padding:21px;display:flex;justify-content:space-between;gap:10px}
.mission-enter:hover{background:#39452a}
.mission-enter:disabled{opacity:.75;cursor:wait}
.mission-skip{border:0;background:transparent;color:#3b3e2f;font:10px var(--mono);text-decoration:underline;letter-spacing:.12em;display:block;margin:15px auto 0}
body.mission-open{overflow:hidden}
.mission-intro.is-exiting{animation:mission-out .5s ease-in both}
@keyframes mission-out{to{opacity:0;transform:scale(1.04)}}
@media(max-width:820px){
 .war-command{min-height:700px}.war-command h1{font-size:clamp(72px,14vw,125px)}.war-command .hero-core{padding:65px 10px}
 .war-command .hero-topline span:nth-child(2),.war-command .hero-bottomline span:nth-child(2),.command-coordinate{display:none}
 .war-command-grid{width:400px;height:400px}.site-header--mission .header-nav{gap:11px;flex-wrap:wrap;justify-content:flex-end;font-size:9px}
 .mission-replay{display:none}.mission-dossier{transform:rotate(0)}.mission-stamp{top:75px;font-size:11px}
}
@media(max-width:560px){
 .site-header--mission{padding:14px 16px;display:block}.site-header--mission .brand{font-size:30px}.site-header--mission .header-nav{margin-top:12px;justify-content:space-between}
 .war-command{min-height:680px;padding:20px 15px}.war-command h1{font-size:clamp(64px,16vw,96px)}.war-command .hero-deck{font-size:9px;line-height:2}.war-command .hero-timer{gap:5px}.war-command .hero-timer b{font-size:35px}.war-command .hero-timer>div{min-width:54px}.war-command .hero-timer i{font-size:29px}
 .command-actions{gap:9px}.command-crosshair{display:none}.war-command-grid{width:320px;height:320px}
 .mission-catalog{padding-top:80px}.mission-catalog .section-heading{display:block}.mission-catalog .section-heading p{text-align:left;margin-top:16px}
 .mission-story{padding:75px 20px}.mission-story h2{font-size:clamp(60px,13vw,95px)}.mission-story-inner>p{font-size:10px}.mission-transmission{padding:18px}
 .mission-intro{padding:12px}.mission-top,.mission-foot{font-size:8px}.mission-top span:last-child,.mission-foot span:last-child{display:none}.mission-dossier{padding:25px 18px}.mission-dossier h2{font-size:clamp(59px,17vw,87px)}.mission-insignia{width:65px;top:40px}.mission-dossier-head{font-size:9px}
 .ww2-product .spin-dots button{font-size:8px;padding:13px 4px}.ww2-product .angle-arrow{width:38px}
}
@media(prefers-reduced-motion:reduce){.war-sweep,.war-command .hero-mark img{animation:none!important}.mission-intro.is-exiting{animation:none!important}html{scroll-behavior:auto}}
