:root {
  --canvas:#111512;
  --panel:#1b211c;
  --raised:#252d26;
  --line:#39443b;
  --ink:#e8e9da;
  --muted:#9da89c;
  --signal:#d7a85b;
  --friendly:#8cbb93;
  --threat:#d97968;
  --intel:#8ba9bd;
  --sans:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"Cascadia Code",Consolas,monospace;
  --s1:4px;
  --s2:8px;
  --s3:12px;
  --s4:16px;
  --s6:24px;
  --s8:32px;
  --radius:8px;
  --tracking-compact:.05em;
  --tracking-body:.06em;
  --tracking-wide:.08em;
  --tracking-micro:.09em;
  --tracking-label:.1em;
  --tracking-spaced:.12em;
  --motion-quick:180ms;
  --motion-state:300ms;
  --motion-reduced:1ms;
  --height-viewport:100vh;
  --tone-01:#29372b;
  --tone-02:#151a16;
  --tone-03:#65715e;
  --tone-04:#29352a;
  --tone-05:#171c18;
  --tone-06:#c7cbbb;
  --tone-07:#8cbb9380;
  --tone-08:#626d62;
  --tone-09:#1c231d;
  --tone-10:#181e19;
  --tone-11:#354037;
  --tone-12:#ffffff08;
  --tone-13:#c4c9b9;
  --tone-14:#788478;
  --tone-15:#343e35;
  --tone-16:#1a211b;
  --tone-17:#68745c;
  --tone-18:#2c3025;
  --tone-19:#aeb7a9;
  --tone-20:#171d18;
  --tone-21:#aeb8ab;
  --tone-22:#465346;
  --tone-23:#263027;
  --tone-24:#c7caba;
  --tone-25:#514832;
  --tone-26:#28271e;
  --tone-27:#1c211a;
  --tone-28:#374036;
  --tone-29:#c8ccbe;
  --tone-30:#19211a;
  --tone-31:#829080;
  --tone-32:#8ba9bd99;
  --tone-33:#d7a85b99;
  --tone-34:#d9ddce;
  --tone-35:#bac4b4;
  --tone-36:#141a16c9;
  --tone-37:#57625155;
  --tone-38:#d4d8c9;
  --tone-39:#171a14;
  --tone-40:#0007;
  --tone-41:#939d90;
  --tone-42:#55513d;
  --tone-43:#e3e5d7;
  --tone-44:#bdc5b9;
  --tone-45:#202720;
  --tone-46:#3c463c;
  --tone-47:#76806a;
  --tone-48:#302e22;
  --tone-49:#aab4a8;
  --tone-50:#ffffff0b;
  --tone-51:#747f73;
  --tone-52:#e29b88;
  --tone-53:#a6bdc8;
  --tone-54:#c99148;
  --tone-55:#efc77c;
  --tone-56:#1c1b14;
  --tone-57:#35231f;
  --tone-58:#8a5146;
  --tone-59:#e39b87;
  --tone-60:#65705e;
  --tone-61:#000b;
  --tone-62:#090c0ad9;
  --tone-63:#b3bdae;
  --tone-64:#697269;
  --tone-65:#18201a;
  --tone-66:#202a21;
  --tone-67:#222c23;
  --tone-68:#202920;
  --tone-69:#65725f;
  --px-1:1px;
  --px-2:2px;
  --px-3:3px;
  --px-4:4px;
  --px-5:5px;
  --px-6:6px;
  --px-7:7px;
  --px-8:8px;
  --px-9:9px;
  --px-10:10px;
  --px-11:11px;
  --px-12:12px;
  --px-13:13px;
  --px-14:14px;
  --px-15:15px;
  --px-16:16px;
  --px-18:18px;
  --px-19:19px;
  --px-20:20px;
  --px-21:21px;
  --px-22:22px;
  --px-24:24px;
  --px-25:25px;
  --px-28:28px;
  --px-30:30px;
  --px-32:32px;
  --px-34:34px;
  --px-38:38px;
  --px-46:46px;
  --px-57:57px;
  --px-60:60px;
  --px-62:62px;
  --px-70:70px;
  --px-72:72px;
  --px-80:80px;
  --px-100:100px;
  --px-112:112px;
  --px-125:125px;
  --px-188:188px;
  --px-220:220px;
  --px-250:250px;
  --px-290:290px;
  --px-300:300px;
  --px-340:340px;
  --px-350:350px;
  --px-420:420px;
  --px-460:460px;
  --px-760:760px;
  --px-1600:1600px;
  --ratio-zero:0%;
  --ratio-half:50%;
  --ratio-full:100%;
  --ratio-gradient:52%;
  --ratio-panel-end:90%;
  --ratio-negative-offset:-20%;
  --ratio-score:74%;
  --ratio-readiness:92%;
  --grid-fr:1fr;
  --weight-medium:600;
  --weight-bold:700;
  --weight-heavy:800;
  --line-height-body:1.45;
  --layer-overlay:2;
  --corner-round:100%;
  --angle-brand:145deg;
  --angle-panel:160deg;
  --angle-score:135deg;
  --angle-action:120deg;

}


* {
  box-sizing:border-box
}
body {
  margin:0;
  background:radial-gradient(ellipse at var(--ratio-half) var(--ratio-negative-offset),var(--tone-01) var(--ratio-zero),var(--canvas) var(--ratio-gradient));
  color:var(--ink);
  font:var(--px-14)/var(--line-height-body) var(--sans);
  min-height:var(--height-viewport)
}
button {
  font:inherit;
  color:inherit;
  cursor:pointer
}
button:focus-visible,a:focus-visible {
  outline:var(--px-2) solid var(--signal);
  outline-offset:var(--px-3)
}
.topbar {
  height:var(--px-72);
  border-bottom:var(--px-1) solid var(--line);
  background:var(--tone-02);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 var(--px-28);
  position:sticky;
  top:0;
  z-index:var(--layer-overlay)
}
.brand {
  display:flex;
  gap:var(--px-12);
  align-items:center;
  text-decoration:none;
  color:var(--ink);
  font-weight:var(--weight-heavy);
  letter-spacing:var(--tracking-wide);
  font-size:var(--px-13)
}
.brand small {
  display:block;
  font:var(--px-10) var(--mono);
  color:var(--muted);
  letter-spacing:var(--tracking-label);
  margin-top:var(--px-3)
}
.brand-mark {
  height:var(--px-38);
  width:var(--px-38);
  border:var(--px-1) solid var(--tone-03);
  color:var(--signal);
  display:grid;
  place-items:center;
  font:var(--weight-bold) var(--px-13) var(--mono);
  background:linear-gradient(var(--angle-brand),var(--tone-04),var(--tone-05));
  border-radius:var(--px-5)
}
.campaign {
  font:var(--px-11) var(--mono);
  letter-spacing:var(--tracking-label);
  color:var(--tone-06);
  display:flex;
  align-items:center;
  gap:var(--px-12)
}
.live-dot {
  width:var(--px-7);
  height:var(--px-7);
  border-radius:var(--ratio-full);
  background:var(--friendly);
  box-shadow:0 0 var(--px-12) var(--tone-07)
}
.divider {
  color:var(--tone-08)
}
.top-stats {
  display:flex;
  gap:var(--px-22);
  align-items:center
}
.top-stats div {
  text-align:right
}
.top-stats small,.score-card small {
  font:var(--px-10) var(--mono);
  color:var(--muted);
  letter-spacing:var(--tracking-micro);
  display:block
}
.top-stats strong {
  font:var(--px-20) var(--mono);
  color:var(--signal)
}
.icon-button,.tiny-button,.text-button {
  border:var(--px-1) solid var(--line);
  background:var(--raised);
  border-radius:var(--px-5)
}
.icon-button {
  width:var(--px-46);
  height:var(--px-46);
  font:var(--weight-medium) var(--px-15) var(--mono)
}
.deck {
  max-width:var(--px-1600);
  margin:auto;
  padding:var(--px-20);
  display:grid;
  grid-template-columns:var(--px-250) minmax(var(--px-350),var(--grid-fr)) var(--px-290);
  gap:var(--px-14);
  min-height:calc(var(--height-viewport) - var(--px-72))
}
.panel {
  background:linear-gradient(var(--angle-panel),var(--tone-09) var(--ratio-zero),var(--tone-10) var(--ratio-panel-end));
  border:var(--px-1) solid var(--tone-11);
  border-radius:var(--radius);
  box-shadow:inset 0 var(--px-1) var(--tone-12);
  min-width:0
}
.left-rail,.right-rail {
  padding:var(--px-16);
  display:flex;
  flex-direction:column
}
.section-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  font:var(--px-10) var(--mono);
  letter-spacing:var(--tracking-label);
  color:var(--tone-13);
  padding-bottom:var(--px-10);
  border-bottom:var(--px-1) solid var(--line)
}
.subtle {
  font-size:var(--px-9);
  color:var(--tone-14)
}
.mission-list {
  display:grid;
  gap:var(--px-7);
  padding:var(--px-12) 0
}
.mission-card {
  width:var(--ratio-full);
  text-align:left;
  border:var(--px-1) solid var(--tone-15);
  background:var(--tone-16);
  padding:var(--px-10);
  border-radius:var(--px-6);
  transition:transform var(--motion-quick),border-color var(--motion-quick),background var(--motion-quick)
}
.mission-card:hover {
  transform:translateY(calc(-1 * var(--px-1)));
  border-color:var(--tone-17)
}
.mission-card[aria-pressed=true] {
  background:var(--tone-18);
  border-color:var(--signal);
  box-shadow:inset var(--px-2) 0 var(--signal)
}
.mission-meta {
  display:flex;
  justify-content:space-between;
  font:var(--px-9) var(--mono);
  color:var(--muted);
  letter-spacing:var(--tracking-body)
}
.mission-name {
  display:block;
  font-size:var(--px-13);
  font-weight:var(--weight-bold);
  margin:var(--px-5) 0 var(--px-2)
}
.mission-objective {
  display:block;
  color:var(--tone-19);
  font-size:var(--px-11)
}
.risk {
  color:var(--signal)
}
.briefing {
  border:var(--px-1) solid var(--tone-15);
  background:var(--tone-20);
  border-radius:var(--px-6);
  padding:var(--px-12)
}
.briefing h2 {
  font-size:var(--px-14);
  margin:0 0 var(--px-6)
}
.briefing p {
  font-size:var(--px-11);
  line-height:1.55;
  color:var(--tone-21);
  margin:0 0 var(--px-10)
}
.brief-grid {
  display:grid;
  grid-template-columns:var(--grid-fr) var(--grid-fr);
  gap:var(--px-8)
}
.brief-grid div {
  font:var(--px-9) var(--mono);
  color:var(--muted)
}
.brief-grid b {
  display:block;
  color:var(--ink);
  font-size:var(--px-10);
  margin-top:var(--px-3)
}
.team-head {
  margin-top:var(--px-18)
}
.team-list {
  display:grid;
  gap:var(--px-8);
  padding:var(--px-10) 0
}
.operator {
  display:flex;
  align-items:center;
  gap:var(--px-9)
}
.operator-avatar {
  width:var(--px-30);
  height:var(--px-30);
  border:var(--px-1) solid var(--tone-22);
  border-radius:var(--ratio-half);
  display:grid;
  place-items:center;
  background:var(--tone-23);
  color:var(--tone-24);
  font:var(--px-10) var(--mono)
}
.operator-info {
  flex:1
}
.operator-info strong {
  font-size:var(--px-11);
  display:block
}
.operator-info small {
  font:var(--px-9) var(--mono);
  color:var(--muted)
}
.op-condition {
  font:var(--px-9) var(--mono);
  color:var(--friendly)
}
.score-card {
  margin-top:auto;
  border:var(--px-1) solid var(--tone-25);
  background:linear-gradient(var(--angle-score),var(--tone-26),var(--tone-27));
  border-radius:var(--px-6);
  padding:var(--px-12)
}
.score-card>div:first-child {
  display:flex;
  justify-content:space-between;
  align-items:center
}
.score-card strong {
  font:var(--px-25) var(--mono);
  color:var(--signal)
}
.score-trend {
  font:var(--px-8) var(--mono);
  color:var(--friendly)
}
.score-track,.bar {
  height:var(--px-4);
  background:var(--tone-28);
  border-radius:var(--px-10);
  overflow:hidden;
  margin:var(--px-8) 0
}
.score-track i,.bar i {
  height:var(--ratio-full);
  display:block;
  background:var(--signal);
  width:var(--ratio-score);
  transition:width var(--motion-state)
}
.muted {
  color:var(--muted)!important
}
.map-section {
  display:flex;
  flex-direction:column;
  padding:0;
  overflow:hidden
}
.map-head {
  height:var(--px-62);
  padding:var(--px-12) var(--px-16);
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:var(--px-1) solid var(--line)
}
.section-headline {
  display:block;
  font:var(--px-11) var(--mono);
  letter-spacing:var(--tracking-label)
}
.map-head small {
  display:block;
  font:var(--px-9) var(--mono);
  color:var(--muted);
  margin-top:var(--px-3)
}
.map-controls {
  display:flex;
  gap:var(--px-12);
  align-items:center
}
.map-coord {
  font:var(--px-9) var(--mono);
  color:var(--muted)
}
.tiny-button {
  font:var(--px-9) var(--mono);
  padding:var(--px-7) var(--px-9);
  color:var(--tone-29)
}
.map-wrap {
  position:relative;
  flex:1;
  min-height:var(--px-460);
  overflow:hidden;
  background:var(--tone-30);
  cursor:crosshair
}
.map {
  width:var(--ratio-full);
  height:var(--ratio-full);
  min-height:var(--px-460);
  display:block
}
.map-label {
  font:var(--px-10) var(--mono);
  fill:var(--tone-31);
  letter-spacing:var(--tracking-spaced)
}
.pin {
  stroke:var(--tone-30);
  stroke-width:var(--px-4)
}
.team-pin {
  fill:var(--friendly);
  filter:drop-shadow(0 0 var(--px-8) var(--tone-07))
}
.intel-pin {
  fill:var(--intel);
  filter:drop-shadow(0 0 var(--px-8) var(--tone-32))
}
.objective-pin {
  fill:var(--signal);
  filter:drop-shadow(0 0 var(--px-10) var(--tone-33))
}
.threat-pin {
  fill:var(--threat)
}
.pin-label {
  font:var(--px-10) var(--mono);
  fill:var(--tone-34);
  letter-spacing:var(--tracking-body)
}
.map-overlay {
  position:absolute;
  left:var(--px-14);
  display:flex;
  gap:var(--px-16);
  color:var(--tone-35);
  font:var(--px-9) var(--mono);
  letter-spacing:var(--tracking-body);
  background:var(--tone-36);
  padding:var(--px-7) var(--px-9);
  border:var(--px-1) solid var(--tone-37);
  border-radius:var(--px-3)
}
.top-left {
  top:var(--px-12)
}
.bottom-left {
  bottom:var(--px-12)
}
.north {
  position:absolute;
  right:var(--px-16);
  top:var(--px-14);
  text-align:center;
  font:var(--px-11) var(--mono);
  color:var(--tone-38)
}
.map-action {
  position:absolute;
  right:var(--px-16);
  bottom:var(--px-16);
  background:var(--signal);
  color:var(--tone-39);
  border:0;
  border-radius:var(--px-4);
  padding:var(--px-12) var(--px-16);
  font:var(--weight-bold) var(--px-10) var(--mono);
  letter-spacing:var(--tracking-wide);
  box-shadow:0 var(--px-5) var(--px-20) var(--tone-40)
}
.map-action[hidden] {
  display:none
}
.map-footer {
  height:var(--px-38);
  padding:0 var(--px-14);
  border-top:var(--px-1) solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:var(--tone-41);
  font:var(--px-9) var(--mono)
}
.legend-dot {
  display:inline-block;
  width:var(--px-6);
  height:var(--px-6);
  border-radius:var(--ratio-half);
  margin:0 var(--px-4) 0 var(--px-10)
}
.legend-dot:first-child {
  margin-left:0
}
.friendly {
  background:var(--friendly)
}
.intel {
  background:var(--intel)
}
.threat {
  background:var(--threat)
}
.signal {
  background:var(--signal)
}
.phase-pill {
  border:var(--px-1) solid var(--tone-42);
  color:var(--signal);
  border-radius:var(--px-20);
  padding:var(--px-4) var(--px-8);
  font:var(--px-8) var(--mono)
}
.field-clock {
  text-align:center;
  padding:var(--px-19) var(--px-8) var(--px-15);
  border-bottom:var(--px-1) solid var(--line)
}
.field-clock small {
  display:block;
  color:var(--muted);
  font:var(--px-9) var(--mono);
  letter-spacing:var(--tracking-label)
}
.field-clock strong {
  display:block;
  font:var(--px-34) var(--mono);
  letter-spacing:var(--tracking-compact);
  margin:var(--px-4) 0;
  color:var(--tone-43)
}
.field-clock span {
  color:var(--signal);
  font:var(--px-10) var(--mono);
  letter-spacing:var(--tracking-body)
}
.readiness {
  padding:var(--px-14) 0
}
.readiness-row {
  display:flex;
  justify-content:space-between;
  font:var(--px-9) var(--mono);
  color:var(--tone-44)
}
.readiness-row strong {
  color:var(--friendly)
}
.readiness .bar {
  height:var(--px-5);
  margin:var(--px-7) 0 var(--px-12)
}
.readiness .bar i {
  background:var(--friendly);
  width:var(--ratio-readiness)
}
.assets-head,.feed-head {
  margin-top:var(--px-2)
}
.assets {
  display:grid;
  grid-template-columns:var(--grid-fr) var(--grid-fr);
  gap:var(--px-7);
  padding:var(--px-10) 0
}
.asset {
  background:var(--tone-45);
  border:var(--px-1) solid var(--tone-46);
  border-radius:var(--px-5);
  padding:var(--px-8);
  text-align:left;
  min-height:var(--px-57)
}
.asset:hover {
  border-color:var(--tone-47)
}
.asset[aria-pressed=true] {
  border-color:var(--signal);
  background:var(--tone-48)
}
.asset strong {
  font-size:var(--px-10);
  display:block
}
.asset small {
  font:var(--px-8) var(--mono);
  color:var(--muted)
}
.asset-count {
  float:right;
  color:var(--signal);
  font:var(--px-10) var(--mono)
}
.text-button {
  padding:var(--px-3) var(--px-6);
  font:var(--px-8) var(--mono);
  color:var(--muted)
}
.comms-log {
  flex:1;
  min-height:var(--px-112);
  max-height:var(--px-188);
  overflow:auto;
  display:flex;
  flex-direction:column-reverse;
  gap:0;
  padding:var(--px-4) 0
}
.log-entry {
  font:var(--px-9)/1.5 var(--mono);
  color:var(--tone-49);
  padding:var(--px-5) 0;
  border-bottom:var(--px-1) solid var(--tone-50)
}
.log-entry time {
  color:var(--tone-51);
  margin-right:var(--px-6)
}
.log-entry.alert {
  color:var(--tone-52)
}
.log-entry.info {
  color:var(--tone-53)
}
.command-area {
  padding-top:var(--px-12)
}
.command-button {
  width:var(--ratio-full);
  min-height:var(--px-46);
  border-radius:var(--px-5);
  text-align:left;
  padding:0 var(--px-13);
  display:flex;
  justify-content:space-between;
  align-items:center;
  font:var(--weight-bold) var(--px-10) var(--mono);
  letter-spacing:var(--tracking-wide)
}
.command-button.primary {
  background:linear-gradient(var(--angle-action),var(--signal),var(--tone-54));
  border:var(--px-1) solid var(--tone-55);
  color:var(--tone-56)
}
.command-button.primary:hover {
  filter:brightness(1.08)
}
.command-button.secondary {
  margin-top:var(--px-8);
  background:var(--tone-57);
  border:var(--px-1) solid var(--tone-58);
  color:var(--tone-59)
}
.command-button[hidden] {
  display:none
}
.command-note {
  margin-top:var(--px-8);
  font-size:var(--px-9);
  line-height:1.4;
  color:var(--muted)
}
dialog {
  max-width:var(--px-420);
  width:calc(var(--ratio-full) - var(--px-32));
  background:var(--tone-09);
  color:var(--ink);
  border:var(--px-1) solid var(--tone-60);
  border-radius:var(--px-8);
  padding:var(--px-20);
  box-shadow:0 var(--px-18) var(--px-70) var(--tone-61)
}
dialog::backdrop {
  background:var(--tone-62);
}
.dialog-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  font:var(--px-10) var(--mono);
  color:var(--signal);
  letter-spacing:var(--tracking-label)
}
.dialog-head button {
  background:none;
  border:0;
  color:var(--muted);
  font-size:var(--px-24)
}
dialog h2 {
  font-size:var(--px-21);
  margin:var(--px-18) 0 var(--px-8)
}
dialog p {
  font-size:var(--px-13);
  color:var(--tone-63);
  line-height:1.6
}
.dialog-head+ h2+p {
  margin-top:0
}
.guide-link {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:var(--px-12);
  min-height:var(--px-46);
  margin:var(--px-14) 0 var(--px-12);
  padding:0 var(--px-12);
  border:var(--px-1) solid var(--tone-60);
  border-radius:var(--px-5);
  background:var(--tone-20);
  color:var(--signal);
  font:var(--weight-bold) var(--px-10) var(--mono);
  letter-spacing:var(--tracking-wide);
  text-decoration:none
}
.guide-link:hover {
  background:var(--raised)
}
.guide-link:focus-visible {
  outline:var(--px-2) solid var(--signal);
  outline-offset:var(--px-2)
}
.guide-page {
  min-height:var(--height-viewport);
  padding:var(--px-24) var(--px-16);
  background-color:var(--canvas);
  background-image:radial-gradient(ellipse at 50% 0,var(--tone-04),var(--canvas) 58%)
}
.guide-shell {
  max-width:var(--px-760);
  margin:0 auto;
  padding:var(--px-28);
  border:var(--px-1) solid var(--tone-11);
  border-radius:var(--radius);
  background:linear-gradient(var(--angle-panel),var(--tone-09),var(--tone-10));
  box-shadow:inset 0 var(--px-1) var(--tone-12)
}
.guide-kicker,.guide-meta {
  color:var(--signal);
  font:var(--px-10) var(--mono);
  letter-spacing:var(--tracking-label)
}
.guide-shell h1 {
  margin:var(--px-14) 0 var(--px-8);
  font-size:var(--px-30)
}
.guide-shell h2 {
  margin:var(--px-24) 0 var(--px-8);
  color:var(--tone-13);
  font:var(--weight-bold) var(--px-13) var(--mono);
  letter-spacing:var(--tracking-label)
}
.guide-shell p,.guide-shell li {
  color:var(--tone-63);
  font-size:var(--px-14);
  line-height:1.7
}
.guide-shell ol {
  padding-left:var(--px-22)
}
.guide-shell a {
  color:var(--signal)
}
.guide-return {
  display:inline-flex;
  align-items:center;
  min-height:var(--px-46);
  margin-top:var(--px-12);
  padding:0 var(--px-14);
  border:var(--px-1) solid var(--tone-60);
  border-radius:var(--px-5);
  color:var(--signal);
  font:var(--weight-bold) var(--px-10) var(--mono);
  letter-spacing:var(--tracking-wide);
  text-decoration:none
}
@media(max-width:520px) {
  .guide-shell {
    padding:var(--px-18)
  }
  .guide-shell h1 {
    font-size:var(--px-24)
  }
}
@media(max-width:1100px) {
  .deck {
  grid-template-columns:var(--px-220) minmax(var(--px-300),var(--grid-fr));
  
}
.right-rail {
  grid-column:1/-1;
  display:grid;
  grid-template-columns:var(--grid-fr) var(--grid-fr);
  gap:0 var(--px-18)
}
.right-rail>.section-head,.right-rail>.command-area {
  grid-column:1/-1
}
.right-rail>.field-clock,.right-rail>.readiness {
  align-self:center
}
.assets {
  grid-row:4
}
.feed-head {
  grid-column:2;
  grid-row:3
}
.comms-log {
  grid-column:2;
  grid-row:4
}
.command-area {
  margin-top:var(--px-8)
}
.score-card {
  margin-top:var(--px-18)
}

}
@media(max-width:700px) {
  .topbar {
  height:var(--px-60);
  padding:0 var(--px-14)
}
.brand {
  font-size:var(--px-11);
  gap:var(--px-8)
}
.brand-mark {
  width:var(--px-32);
  height:var(--px-32)
}
.brand small {
  font-size:var(--px-8)
}
.campaign {
  font-size:0;
  gap:0
}
.campaign .live-dot {
  font-size:0
}
.campaign span:last-child {
  font-size:var(--px-9)
}
.campaign .divider {
  display:none
}
.top-stats {
  gap:var(--px-8)
}
.top-stats small {
  font-size:var(--px-8)
}
.top-stats strong {
  font-size:var(--px-16)
}
.deck {
  display:flex;
  flex-direction:column;
  padding:var(--px-10);
  gap:var(--px-10)
}
.left-rail {
  display:grid;
  grid-template-columns:var(--grid-fr) var(--grid-fr);
  gap:0 var(--px-14)
}
.left-rail>.section-head:first-child,.mission-list,.briefing {
  grid-column:1/-1
}
.mission-list {
  grid-template-columns:repeat(3,minmax(0,var(--grid-fr)));
  
}
.mission-card {
  height:var(--ratio-full)
}
.mission-name {
  font-size:var(--px-11)
}
.mission-objective {
  font-size:var(--px-9)
}
.briefing {
  display:grid;
  grid-template-columns:var(--grid-fr) auto;
  align-items:center;
  gap:0 var(--px-10)
}
.briefing h2,.briefing p {
  grid-column:1
}
.brief-grid {
  grid-column:2;
  grid-row:1/3;
  min-width:var(--px-100)
}
.team-head {
  margin-top:var(--px-12)
}
.team-list {
  grid-template-columns:var(--grid-fr) var(--grid-fr);
  align-content:start
}
.score-card {
  margin-top:var(--px-12);
  align-self:end
}
.map-section {
  order:2
}
.map-wrap,.map {
  min-height:var(--px-340)
}
.map-head {
  padding:var(--px-10)
}
.map-coord {
  display:none
}
.map-footer {
  font-size:var(--px-10)
}
.map-footer #mapMode {
  display:none
}
.right-rail {
  order:3;
  display:flex;
  padding:var(--px-14)
}
.right-rail>.section-head {
  width:var(--ratio-full)
}
.field-clock {
  padding:var(--px-12)
}
.field-clock strong {
  font-size:var(--px-30)
}
.assets {
  grid-template-columns:repeat(4,var(--grid-fr))
}
.asset {
  padding:var(--px-7) var(--px-5)
}
.asset strong {
  font-size:var(--px-11)
}
.asset small {
  font-size:var(--px-10)
}
.comms-log {
  min-height:var(--px-80);
  max-height:var(--px-125)
}
.command-area {
  margin-top:var(--px-4)
}

}
@media(max-width:520px) {
  html,body {
  max-width:var(--ratio-full);
  overflow-x:hidden
}
.topbar {
  gap:var(--px-8);
  padding:0 var(--px-10)
}
.brand {
  min-width:0;
  flex:1
}
.top-stats {
  flex:none
}
.campaign {
  display:none
}
.deck {
  width:var(--ratio-full);
  min-width:0
}
.left-rail {
  grid-template-columns:var(--grid-fr)
}
.mission-list {
  grid-template-columns:var(--grid-fr)
}
.mission-card {
  display:grid;
  grid-template-columns:var(--px-72) minmax(0,var(--grid-fr));
  align-items:center;
  gap:var(--px-2) var(--px-8);
  min-width:0
}
.mission-name {
  grid-column:2;
  grid-row:1;
  min-width:0;
  overflow-wrap:anywhere;
  margin:0
}
.mission-meta {
  grid-column:1;
  grid-row:1/3;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start
}
.mission-objective {
  grid-column:2;
  grid-row:2;
  min-width:0;
  overflow-wrap:anywhere;
  flex:initial
}
.map-head {
  min-width:0;
  gap:var(--px-4)
}
.map-controls {
  min-width:0
}
.briefing,.score-card,.left-rail,.map-section,.right-rail {
  width:var(--ratio-full);
  min-width:0
}
.briefing {
  display:block
}
.brief-grid {
  display:grid
}
.team-head {
  margin-top:var(--px-15)
}
.team-list {
  grid-template-columns:var(--grid-fr) var(--grid-fr)
}
.right-rail>.field-clock,.right-rail>.readiness {
  align-self:stretch;
  width:var(--ratio-full)
}
.readiness-row {
  gap:var(--px-8);
  font-size:var(--px-11)
}
.score-card {
  margin-top:var(--px-8)
}
.map-wrap,.map {
  min-height:var(--px-300)
}
.map-label,.pin-label {
  font-size:var(--px-24)
}
.map-overlay {
  font-size:var(--px-10);
  gap:var(--px-7)
}
.assets {
  grid-template-columns:var(--grid-fr) var(--grid-fr)
}

}

.cursor-pin {
  fill:none;
  stroke:var(--signal);
  stroke-width:var(--px-3);
  stroke-dasharray:var(--px-3) var(--px-3)
}
.map-wrap:focus-visible {
  outline:var(--px-2) solid var(--signal);
  outline-offset:calc(-1 * var(--px-3))
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
  scroll-behavior:auto!important;
  animation-duration:var(--motion-reduced)!important;
  transition-duration:var(--motion-reduced)!important
}

}

