/* Materials and artwork shared with the current game. */
:root{--paper:#e4d4b0;--brass:#c3a368;--enamel:#161a16;--line:#c3a36840}
.site-header{position:sticky;top:0;height:82px;background:#141914ed;backdrop-filter:blur(18px);gap:24px}
.site-header:after{content:'';position:absolute;bottom:-1px;left:0;height:2px;width:var(--reading-progress,0%);background:#c3a368;transition:width .1s linear}
.site-header nav{gap:24px}.hero-backdrop{background:linear-gradient(90deg,#101711f5 4%,#141711b0 50%,#15171022),url('/assets/desk.webp') center/cover}
.hero-grid{min-height:690px;padding-top:35px;padding-bottom:40px}.hero h1{font-size:clamp(62px,7.6vw,116px);letter-spacing:-4px}.hero .year{font-size:.64em;letter-spacing:10px}.hero-tagline{color:#d6bd85}.hero-description{max-width:430px}.command-desk{height:570px}.hero-book{width:100%;top:-3%;left:-3%;filter:drop-shadow(20px 28px 22px #000a)}
.map-sheet{right:-3%;top:38%;width:65%;height:48%;padding:12px 12px 27px;background:#b9a47a;transform:rotate(10deg)}.map-sheet img{filter:none;object-position:center}.map-sheet span{font-size:8px}.hero-compass{right:-1%;bottom:0;width:30%}.desk-note{left:1%;bottom:3%;font-size:17px}.desk-coordinate{position:absolute;right:0;top:3%;font:9px/1.8 monospace;color:#d5bd89;letter-spacing:2px;transform:rotate(2deg)}
.lamplight{pointer-events:none;position:absolute;inset:-30%;z-index:-1;background:radial-gradient(ellipse at 80% 30%,#e5ad4a22,transparent 45%);animation:lamplight 16s ease-in-out infinite alternate}
@keyframes lamplight{to{transform:translate(-4%,4%);opacity:.6}}
.button{border-radius:2px;background-image:linear-gradient(120deg,#ffffff0c,transparent 60%);box-shadow:inset 0 0 0 3px #201b1410,0 5px 15px #0002}.hero-foot{background:#10150f75}
.terrain-section{background:radial-gradient(ellipse at 20% 60%,#293025,#171b16 70%);max-width:none;padding-bottom:80px}.terrain-section .section-heading,.terrain-console,.atlas-footnote{max-width:1300px;margin-left:auto;margin-right:auto}.terrain-console{border:1px solid #98836170;box-shadow:0 20px 70px #0004}
.atlas-toolbar{display:flex;gap:24px;align-items:center;padding:18px 25px;background:#151b15;flex-wrap:wrap}.atlas-label{font:9px/1.7 monospace;letter-spacing:1.5px;margin-right:auto;color:#a8a28e}.atlas-label b{color:#e5d1a4;font-weight:400}.season-controls,.faction-controls{display:flex;gap:3px}.season-controls button,.faction-controls button,#atlas-bw{min-height:44px;border:1px solid transparent;background:transparent;padding:10px 14px;font:11px monospace;color:#b8b6a3}.season-controls button:hover,.season-controls button[aria-pressed=true]{background:#c5ac7117;border-color:#c5ac7155;color:#e8d5ab}#atlas-bw{border-color:#8c92713b;font-size:10px}#atlas-bw[aria-pressed=true]{background:#ddd;color:#111}
.terrain-atlas{position:relative;isolation:isolate;overflow:hidden;padding:70px 65px 55px;background:radial-gradient(ellipse,#56614a,#303b2c);transition:background .7s}.terrain-atlas[data-season=winter]{background:radial-gradient(ellipse,#b4beb6,#67776f)}.terrain-atlas[data-season=autumn]{background:radial-gradient(ellipse,#716344,#3c392b)}.terrain-atlas[data-season=spring]{background:radial-gradient(ellipse,#687856,#354933)}.atlas-grid{position:absolute;inset:0;z-index:-1;opacity:.22;background-image:linear-gradient(#d1d2b150 1px,transparent 1px),linear-gradient(90deg,#d1d2b150 1px,transparent 1px);background-size:55px 55px;mask-image:radial-gradient(ellipse,#000,transparent)}.atlas-north{position:absolute;right:24px;top:18px;font:13px/1.3 Georgia;color:#eee0bd;text-align:center}.terrain-plates{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;align-items:center;perspective:1200px}.terrain-plate{position:relative;min-width:0;padding:7px 7px 0;border:1px solid #bba87880;background:#e7d9b8;box-shadow:8px 16px 20px #0005;text-align:left;color:#2d3023;transition:transform .4s,box-shadow .4s}.terrain-plate img{width:100%;aspect-ratio:1;object-fit:cover}.terrain-plate>span{display:block;font:19px Georgia;padding:15px 10px 20px}.terrain-plate small{display:block;font:8px/1.7 monospace;letter-spacing:1px;margin-bottom:8px;color:#6b624a}.copse-plate{transform:rotate(-5deg) translateY(12px)}.ridge-plate{transform:rotate(2deg) translateY(-6px)}.pond-plate{transform:rotate(6deg) translateY(12px)}.terrain-plate[aria-pressed=true]{transform:translateY(-14px) rotate(0);box-shadow:0 0 0 2px #d8bc7b,12px 25px 25px #0006;z-index:2}.terrain-plate:hover{transform:translateY(-20px) rotate(0);z-index:3}.atlas-key{display:block;text-align:center;margin-top:42px;font:8px monospace;letter-spacing:2px;color:#eee3c9}.terrain-atlas.is-bw{filter:saturate(.16) contrast(1.12)}
@keyframes snowfall{to{background-position:80px 137px,130px 251px}}
.terrain-brief{display:grid;grid-template-columns:90px 1fr 1.8fr;gap:25px;align-items:center;padding:28px 30px;background:#172016;min-height:125px}.terrain-brief>span{font:9px monospace;color:var(--brass);letter-spacing:1px}.terrain-brief h3{font:28px Georgia;margin:0}.terrain-brief p{font-size:13px;color:#b8bea8;line-height:1.7;margin:0}.atlas-footnote{font:10px/1.8 monospace;color:#a9ae99;margin-top:20px}
.battle-intro{background:#171b16;max-width:none}.battle-intro>div,.battle-intro>p{max-width:1300px;margin-left:auto;margin-right:auto}.battle-window{background:#252c21}.field-guide{max-width:none;background:linear-gradient(#e4d4b0e6,#e4d4b0ed),url('/assets/paper.webp') center/700px}.field-guide>div,.field-guide>article{max-width:1300px;margin-left:auto;margin-right:auto}.roster-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:0 0 20px}.roster-heading>span{font:9px monospace;letter-spacing:2px;color:#786544}.faction-controls{border:1px solid #75634666;padding:3px}.faction-controls button{color:#615439}.faction-controls button[aria-pressed=true]{background:#263324;color:#f1e2bf}.faction-controls button[data-faction=central][aria-pressed=true]{background:#624b32}.unit-tabs{background:#75634633}.unit-tab{background:#e5d6b790}.unit-tab[aria-pressed=true]{background:#263324}.field-guide[data-faction=central] .unit-tab[aria-pressed=true]{background:#624b32}.portrait-stage img{max-width:440px}.portrait-ring{border-color:#75634622}.portrait-ring:after{animation:survey 90s linear infinite}
@keyframes survey{to{transform:rotate(360deg)}}
.fire-section{max-width:none;background:radial-gradient(ellipse at 75% 45%,#323a2b,#111710 65%)}.modes-section{background:#181e16;max-width:none}.mode-card{border-top:3px solid #b79b6150;background:linear-gradient(135deg,#3b452525,transparent)}.mode-number{color:#b7945912}.dispatch{max-width:none;background:linear-gradient(90deg,#1c2118ef,#1c2118e6),url('/assets/desk.webp') center/cover}.press-note{background:linear-gradient(#dac9a8df,#dac9a8df),url('/assets/paper.webp') center/cover}.subpage{background:#171b16}.document-page{min-height:70vh}.document-page .card{border-color:#a38b5960}.motion-paused *, .motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}.motion-paused .terrain-plate,.motion-paused .terrain-atlas{transition:none}
@media(min-width:1600px){.hero-grid{min-height:780px}.command-desk{height:650px}}
@media(max-width:1000px){.site-header{gap:18px;padding-left:4vw;padding-right:4vw}.site-header nav{gap:15px;font-size:11px}.terrain-atlas{padding:65px 30px 40px}.terrain-plates{gap:15px}.terrain-plate>span{font-size:16px;padding-left:5px}.atlas-toolbar{gap:12px;padding:15px}.atlas-label{flex-basis:100%}.terrain-brief{grid-template-columns:70px 1fr;gap:12px}.terrain-brief p{grid-column:2}.hero-grid{min-height:640px}.command-desk{height:480px}}
@media(max-width:720px){html{scroll-padding-top:130px}.site-header{min-height:100px;height:auto;padding:14px 5vw;gap:10px}.site-header nav{gap:8px;font-size:10px}.site-header nav a{min-height:32px;display:flex;align-items:center}.site-header .motion-toggle{min-height:36px}.hero-grid{padding-top:30px;min-height:0}.hero h1{font-size:clamp(62px,14vw,95px);line-height:.95;letter-spacing:-3px;margin-top:24px}.hero .year{font-size:.65em}.hero-copy{position:relative;z-index:2}.hero-tagline{font-size:22px}.hero-description{font-size:13px}.command-desk{height:390px;max-width:460px;margin-top:30px}.hero-book{width:88%;left:0;top:-6%}.map-sheet{top:29%;right:1%;width:58%;height:50%}.hero-compass{width:28%;bottom:3%;right:3%}.desk-note{bottom:4%;left:5%;font-size:14px}.desk-coordinate{font-size:7px;top:1%;right:2%}.hero-foot{font-size:7px}.terrain-section{padding-top:65px;padding-bottom:55px}.atlas-toolbar{gap:8px;padding:14px}.atlas-label{font-size:8px}.season-controls{width:100%;justify-content:space-between}.season-controls button{padding:10px 7px;font-size:10px;flex:1}#atlas-bw{margin-left:auto;min-height:36px;font-size:9px}.terrain-atlas{padding:50px 16px 30px}.terrain-plates{gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))}.terrain-plate{padding:3px 3px 0}.terrain-plate>span{font:12px/1.3 Georgia;padding:8px 3px 12px}.terrain-plate small{font:6px/1.6 monospace;letter-spacing:0}.atlas-key{font-size:6px;letter-spacing:1px;margin-top:30px}.atlas-north{right:15px;top:13px;font-size:11px}.terrain-brief{padding:20px 16px;grid-template-columns:1fr;gap:10px;min-height:180px}.terrain-brief h3{font-size:25px}.terrain-brief p{grid-column:auto;font-size:12px}.atlas-footnote{font-size:9px}.roster-heading{align-items:flex-start;flex-direction:column;gap:15px}.faction-controls{width:100%}.faction-controls button{flex:1;padding:10px 6px;font-size:11px}.portrait-stage img{max-width:340px}.hero .actions{gap:15px;margin-top:24px}.hero .button{padding:16px}.hero .text-link{font-size:11px}.site-header:after{transition:none}}
@media(prefers-reduced-motion:reduce){.lamplight,.atlas-weather,.portrait-ring:after{animation:none}.terrain-plate,.terrain-atlas{transition:none}}

.studio-credit{display:flex;align-items:center;gap:10px}.studio-credit img{border-radius:4px}section[id]{scroll-margin-top:20px}

/* Game-matched fire control and selection voices. */
.drill-difficulty{margin-top:24px;max-width:460px}.drill-difficulty label{display:block;font:9px monospace;letter-spacing:1.5px;color:var(--brass);margin-bottom:10px}.drill-difficulty select{width:100%;min-height:48px;padding:12px 15px;background:#24231e;color:var(--ivory);border:1px solid #b7945970;border-radius:0;font:15px Georgia}.drill-difficulty p{font:11px/1.6 monospace;color:#bdb19a;min-height:36px;margin:10px 0 0}button.dial{display:block;padding:0;border:0;background:transparent;color:inherit;cursor:crosshair;touch-action:manipulation}button.dial:focus-visible{outline:2px solid var(--brass);outline-offset:6px;border-radius:25%}button.dial .dial-state{pointer-events:none}.voice-controls{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:18px}.voice-controls button{border:1px solid #75634665;background:transparent;color:var(--ink);padding:12px 15px;min-height:44px;font:11px monospace}.voice-controls button:hover{background:#75634618}.voice-controls button:disabled{opacity:.5;cursor:default}.voice-controls span{font:10px/1.6 monospace;color:#695b40}.mode-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.mode-card{padding:32px 22px}.mode-card h3{font-size:27px}.mode-coming{background:#b7945908}.mode-coming .mode-note{border:1px solid #b7945960;padding:9px;font-size:8px;line-height:1.6}
@media(max-width:1100px){.mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mode-card:nth-child(3){border-left:0}.mode-card:nth-child(n+3){border-top:1px solid var(--line)}}
@media(max-width:720px){.drill-difficulty{order:1;width:100%;max-width:none}.fire-copy .demo-note{order:0}.voice-controls span{flex-basis:100%}.mode-grid{grid-template-columns:1fr}.mode-card+.mode-card{border-left:0;border-top:1px solid var(--line)}}

.fire-sound-controls{display:flex;gap:12px 18px;align-items:center;flex-wrap:wrap;margin-top:16px}.fire-sound-controls button{min-height:44px;white-space:nowrap}.fire-sound-controls span{font:10px/1.6 monospace;color:#bdb19a;max-width:290px}.fire-section>audio{display:none}
@media(max-width:720px){.fire-copy .fire-sound-controls{order:4;width:100%}.fire-copy .drill-result{order:5}}

/* Put the playable gauge before its settings on a phone. */
@media (max-width: 720px) {
  .fire-section > .instrument { order: 1; }
  .fire-copy .drill-difficulty { order: 2; }
  .fire-copy .demo-note { order: 6; }
}

/* The field study uses the same fixed sector in summer and winter. */
.weather-study { max-width:1300px; margin:clamp(56px,8vw,100px) auto 0; color:#ede4d0; }
.weather-heading { margin-bottom:26px; }
.weather-heading h2 { margin:.12em 0 .18em; }
.weather-heading p:last-child { max-width:62ch; color:#c9c3b1; line-height:1.6; }
.weather-layout { display:grid; grid-template-columns:minmax(0,1.85fr) minmax(235px,1fr); align-items:start; gap:clamp(18px,3vw,46px); }
.sector-frame { min-width:0; padding:8px; background:#262c23; border:1px solid #a18f64; box-shadow:0 16px 38px #0005; }
.sector-strip,.sector-key { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 6px; color:#e1d2ae; font:10px/1.4 monospace; letter-spacing:1px; }
.sector-board { position:relative; isolation:isolate; aspect-ratio:9/7; background:#292a21; overflow:hidden; border:1px solid #85775a; }
.sector-terrain,.sector-atmosphere,.sector-range { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.sector-terrain { display:grid; grid-template-columns:repeat(9,1fr); grid-template-rows:repeat(7,1fr); }
.sector-terrain span { position:relative; background-image:url('/assets/weather-board-summer.webp'); background-size:400% 200%; box-shadow:inset 0 0 0 .5px #231c1970; }
.sector-board[data-weather="snow"] .sector-terrain span { background-image:url('/assets/weather-board-winter.webp'); }
.sector-terrain span::after { content:''; position:absolute; inset:0; background:#171b18; opacity:0; transition:opacity .24s; }
.sector-terrain .veiled::after { opacity:.80; }
.sector-atmosphere { background-position:center; background-size:cover; opacity:.5; }
.sector-board[data-weather="snow"] .sector-atmosphere { background-image:url('/assets/atlas-snow.webp'); }
.sector-board[data-weather="fog"] .sector-atmosphere { background-image:url('/assets/atlas-fog.webp'); background-color:#dbe1d126; }
.sector-board[data-weather="rain"] .sector-atmosphere { background-image:url('/assets/atlas-rain.webp'); background-color:#48657928; }
.range-edge { fill:none; stroke:#66b6ff; stroke-width:4; stroke-linecap:round; stroke-linejoin:round; }
.range-wash { fill:#479aff; fill-opacity:.12; }
.sector-piece { position:absolute; top:50%; width:10.8%; height:14.2%; transform:translate(-50%,-50%); display:grid; place-items:center; pointer-events:none; }
.sector-piece[hidden] { display:none; }
.sector-piece img { position:relative; z-index:1; height:100%; width:100%; object-fit:contain; filter:drop-shadow(1px 2px 2px #000a); }
.sector-piece.friendly { left:50%; }
.sector-piece.hostile { left:83.3333%; }
.sector-piece.hostile img { transform:scaleX(-1); }
.sector-piece::before { content:''; position:absolute; border-radius:50%; border:2px solid #9dcdf4; background:#163d4a52; inset:72% 9% 3%; }
.sector-piece.hostile::before { border-color:#ef996b; background:#853c285a; }
.sector-piece.friendly i { position:absolute; top:-12%; left:43%; width:14%; height:12%; background:#fff7db; clip-path:polygon(0 0,100% 0,50% 100%); }
.signal-contact .hostile::after { content:''; position:absolute; inset:0; border:2px solid #f5a76f; border-radius:50%; animation:sector-contact .85s ease-out 1 both; }
@keyframes sector-contact { from { transform:scale(.65);opacity:1; } to { transform:scale(1.45);opacity:0; } }
.sector-key { justify-content:flex-start; flex-wrap:wrap; gap:6px 20px; font-size:10px; letter-spacing:0; }
.sector-key span { display:inline-flex; align-items:center; gap:7px; }
.sector-key i { width:12px; height:12px; }
.key-friendly { background:#f4ead2; clip-path:polygon(0 15%,100% 15%,50% 95%); }
.key-range { border:2px solid #66b6ff; background:#479aff22; }
.key-fog { background:#171b18; border:1px solid #716f61; }
.weather-options { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:20px; }
.weather-options button,.sector-switch { min-height:44px; padding:8px 13px; border:1px solid #817760; background:#20261d; color:#eee3c8; font:14px Georgia,serif; }
.weather-options button[aria-pressed="true"] { background:#d6bd85; color:#201f19; }
.sector-reading { border-block:1px solid #9b89644f; padding:20px 0; }
.contact-label { color:#dcba76; text-transform:uppercase; font:11px/1.5 monospace; letter-spacing:1px; }
.sector-reading h3 { font:normal clamp(25px,2.6vw,38px)/1.1 Georgia,serif; margin:.5em 0 .3em; }
#sector-account { font-size:15px; line-height:1.6; color:#d1c7b4; }
.sector-reading dl { display:flex; gap:32px; margin:20px 0 0; }
.sector-reading dt { color:#bcb398; font:11px monospace; }
.sector-reading dd { margin:4px 0 0; font:22px Georgia,serif; }
.sector-switch { display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; margin-top:10px; }
.sector-switch span { font:12px monospace; color:#ccb481; }
#sector-overlay[aria-pressed="true"] span { color:#9cd2ff; }
.motion-paused .sector-piece::after,.motion-paused .sector-terrain span::after { animation:none; transition:none; }
@media (prefers-reduced-motion:reduce) { .signal-contact .hostile::after { display:none; } .sector-terrain span::after { transition:none; } }
@media (max-width:760px) {
 .weather-layout { display:flex; flex-direction:column; gap:12px; }
 .sector-orders { display:contents; }
 .sector-frame,.sector-reading,.sector-switch { width:100%; }
 .weather-options { order:-1; margin:0; }
 .sector-reading { padding:12px 0; }
 .sector-strip,.sector-key { font-size:9px; }
 .sector-switch { margin-top:0; }
}
