/* Unified integration overrides. The front-of-game plate remains owned by
   styles.css; this file owns the live combat baseline plus feedback chrome. */

@font-face {
  font-family: "Fixedsys Excelsior Embedded";
  src: url("./assets/fonts/fixedsys-excelsior/FixedsysExcelsior-3.09.10.ttf") format("truetype");
  font-style: normal;
  font-weight: 400 700;
  font-display: block;
}

:root { --gps-font-terminal: "Fixedsys Excelsior Embedded", Fixedsys, monospace; }

.gps-combat-only { display: none; }

body.is-combat-page-candidate,
body.is-combat-page-candidate .match-page-v2 {
  width: 100%;
  height: 100svh;
  min-height: 0;
  overflow: hidden;
}

.match-page-v2 {
  --combat-top: clamp(150px, 20.5svh, 215px);
  --horizon-height: clamp(170px, 23svh, 240px);
  --grid-waterline-gap: clamp(34px, 4.5svh, 54px);
  background: #030b16;
  color: #edf4f7;
}

.match-page-v2 .enemy-horizon {
  top: 0;
  height: var(--horizon-height);
  overflow: hidden;
  background: #0a1722;
  box-shadow: none;
}

.match-page-v2 .enemy-terrain-artboard {
  position: absolute;
  z-index: 0;
  top: -25vw;
  left: 0;
  width: 100%;
  aspect-ratio: 2842 / 1586;
}

.match-page-v2 .enemy-terrain-artboard > img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: fill;
  filter: saturate(.58) contrast(1.1) brightness(.7);
}

.match-page-v2 .enemy-horizon::before {
  z-index: 2;
  background:
    linear-gradient(180deg, rgba(2, 6, 13, .2), transparent 34%, rgba(5, 18, 31, .02) 68%, rgba(6, 23, 39, .66)),
    linear-gradient(90deg, rgba(2, 7, 16, .24), transparent 20% 84%, rgba(2, 7, 16, .2));
}

/* Color-grade only the procedural water layers toward the terrain artwork.
   The depth drift and surface-crosscurrent animations remain unchanged. */
.match-page-v2::before {
  filter: saturate(.58) brightness(.72) hue-rotate(-6deg);
}

.match-page-v2::after {
  opacity: .5;
  filter: saturate(.58) brightness(.75) hue-rotate(-6deg) blur(.35px);
}

.match-page-v2 .enemy-horizon::after {
  z-index: 6;
  top: 64%;
  right: auto;
  bottom: auto;
  left: 47.5%;
  padding: .38rem .62rem;
  border-left: 3px solid #b94839;
  color: #ffd0c4;
  font: 400 clamp(18px, 1.05vw, 22px)/1 var(--gps-font-display);
  letter-spacing: .08em;
}

.match-page-v2 .battle-brand-art {
  z-index: 5;
  top: 0;
  left: clamp(-110px, -5.6vw, -76px);
  width: clamp(360px, 27vw, 520px);
  height: var(--combat-top);
  object-fit: contain;
  object-position: 0 46%;
  filter: drop-shadow(0 3px 1px #000) drop-shadow(0 9px 7px rgba(0,0,0,.72));
  transform: scale(1.3);
  transform-origin: 0 0;
}

.match-page-v2 .enemy-launch-origin {
  position: absolute;
  z-index: 8;
  inset: 0;
  width: 100%;
  height: 100%;
}

.match-page-v2 .enemy-launch-origin > i {
  position: absolute;
  display: block;
  width: .45%;
  min-width: 4px;
  height: 3.4%;
  aspect-ratio: 1 / 2.7;
  border-radius: 45% 45% 18% 18%;
  opacity: 0;
  background: transparent;
}
.match-page-v2 .enemy-launch-origin > i { transform: translate(-50%, -50%); }
/* Exact launcher-mouth anchors in the 2842 x 1586 terrain master. The first
   three racks terminate higher in perspective; the fourth is the lower-right
   rack. Image-relative percentages keep all four points attached under every
   supported responsive scale. */
.match-page-v2 .enemy-launch-origin > i:nth-child(1) { left: 60.17%; top: 49.75%; }
.match-page-v2 .enemy-launch-origin > i:nth-child(2) { left: 63.23%; top: 49.43%; }
.match-page-v2 .enemy-launch-origin > i:nth-child(3) { left: 66.43%; top: 49.81%; }
.match-page-v2 .enemy-launch-origin > i:nth-child(4) { left: 67.45%; top: 53.47%; }
.match-page-v2 .enemy-launch-origin > i.is-firing { opacity: 0; }

.match-page-v2 .battlefield-shell {
  position: absolute;
  z-index: 4;
  top: var(--combat-top);
  right: clamp(9px, .85vw, 18px);
  bottom: clamp(9px, 1.1svh, 14px);
  left: clamp(9px, .85vw, 18px);
  display: grid;
  width: auto;
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  grid-template-columns: clamp(290px, 19vw, 330px) minmax(0, 1fr) clamp(400px, 29vw, 440px);
  gap: clamp(8px, .65vw, 13px);
}

.match-page-v2 .combat-right-rail {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: 2px solid #8e6b34;
  border-radius: 8px;
  background: transparent;
  box-shadow: inset 0 0 0 2px #020817, inset 0 0 0 3px rgba(224,190,115,.2), 0 9px 18px rgba(0,0,0,.5);
}

.match-page-v2 .combat-left-rail {
  grid-column: 1;
  display: grid;
  min-width: 0;
  min-height: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  grid-template-rows: minmax(0, 31%) minmax(0, 69%);
}

.match-page-v2 .combat-right-rail {
  grid-column: 3;
  display: grid;
  height: 100%;
  margin-top: 0;
  padding: 4px;
  grid-template-rows: 270px 170px minmax(0, 1fr);
}

.match-page-v2 .combat-left-rail > section,
.match-page-v2 .combat-right-rail > section {
  box-sizing: border-box;
  min-height: 0;
  margin: 0;
  padding: clamp(10px, .8vw, 15px) !important;
  overflow: hidden;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.match-page-v2 .combat-left-rail > .tactical-panel,
.match-page-v2 .combat-right-rail > .combat-channel {
  background: linear-gradient(180deg, rgba(19,48,85,.97), rgba(7,25,51,.98) 68%, rgba(2,10,25,.99)) !important;
}

.match-page-v2 .combat-left-rail > .tactical-panel {
  border: 2px solid #8e6b34 !important;
  border-radius: 8px !important;
  box-shadow: inset 0 0 0 2px #020817, inset 0 0 0 3px rgba(224,190,115,.2), 0 9px 18px rgba(0,0,0,.5) !important;
}
.match-page-v2 .combat-left-rail > .combat-command-ship {
  padding: 0 !important;
  overflow: visible;
  background: transparent !important;
}
.match-page-v2 .combat-right-rail > .fleet-status-panel {
  background: linear-gradient(180deg, rgba(7,25,51,.96), rgba(7,25,51,.86) 56%, rgba(7,25,51,.2) 68%, transparent 78%) !important;
}
.match-page-v2 .combat-right-rail > section + section { border-top: 1px solid rgba(213,173,94,.48) !important; }
.match-page-v2 .combat-right-rail .combat-command-panel { grid-row: 1; }
.match-page-v2 .combat-right-rail .combat-channel { grid-row: 2; }
.match-page-v2 .combat-right-rail .fleet-status-panel { grid-row: 3; }

.match-page-v2 .tactical-panel { position: relative; width: 100% !important; align-self: stretch; }
.match-page-v2 .tactical-panel .panel-heading { margin-bottom: 4px; font-family: var(--gps-font-display); }
.match-page-v2 .tactical-panel .panel-heading { display: grid; grid-template-columns: minmax(0,170px) 64px; gap: 6px; align-items: start; justify-content: space-between; }
.match-page-v2 .tactical-panel .panel-heading span { min-width: 0; max-width: 170px; overflow: hidden; }
.match-page-v2 .tactical-panel .panel-heading strong { width: 64px; white-space: normal; text-align: right; }
.match-page-v2 .tactical-panel .panel-heading span,
.match-page-v2 .combat-right-rail h2 {
  margin: 0;
  color: #f3d89a;
  font: 400 clamp(17px, 1.22vw, 24px)/1.05 var(--gps-font-display);
  letter-spacing: .055em;
  text-shadow: 0 2px 2px #000;
}
.match-page-v2 .tactical-panel .panel-heading strong { color: #e9f2f5; font: 700 clamp(13px,.92vw,17px)/1 var(--gps-font-ui); }
.match-page-v2 .tactical-panel .mini-map {
  position: relative;
  width: 100%;
  height: auto;
  max-height: calc(100% - 38px);
  aspect-ratio: 24 / 16;
  border: 2px solid rgba(212,178,102,.48);
  background: radial-gradient(circle at 50% 45%, rgba(57,91,131,.28), transparent 58%), #0b2446;
}

.match-page-v2 .combat-command-ship {
  position: relative;
  display: grid;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  grid-template-rows: minmax(0,1fr) auto;
  pointer-events: none;
}
.match-page-v2 .combat-command-ship::before { content: none; }
.match-page-v2 .flagship-artboard {
  position: relative;
  align-self: center;
  left: -32%;
  width: 160%;
  aspect-ratio: 1914 / 822;
  transform: translateY(clamp(-66px,-6.1svh,-44px));
}
.match-page-v2 .flagship-artboard .command-ship {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: fill;
  filter: brightness(.83) contrast(1.08) saturate(.64) drop-shadow(0 13px 10px rgba(0,0,0,.7));
  animation: none;
  transform: scaleX(-1);
}
.match-page-v2 .flagship-artboard .player-missile-battery {
  position: absolute;
  z-index: 12;
  top: 44.55%;
  left: 64.9%;
  display: grid;
  width: 6.2%;
  aspect-ratio: 1.15;
  grid-template-columns: repeat(2,1fr);
  gap: 8%;
  transform: none;
}
.match-page-v2 .flagship-artboard .player-missile-battery i {
  display: block;
  aspect-ratio: 1;
  border: 1px solid rgba(220,209,172,.58);
  border-radius: 28%;
  background: radial-gradient(circle,#222a2d 0 34%,#74756d 36% 54%,#22282b 58%);
  box-shadow: inset 0 0 3px #000;
}
.match-page-v2 .combat-command-ship .combat-escort {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: .84;
  filter: brightness(.72) contrast(1.06) saturate(.56) drop-shadow(0 8px 6px rgba(0,0,0,.72));
}
.match-page-v2 .combat-command-ship .combat-escort-a { transform: none; }
.match-page-v2 .combat-flagship-copy {
  position: relative;
  inset: auto;
  width: auto;
  padding: clamp(8px,.72vw,13px);
  border: 1px solid rgba(213,173,94,.48);
  background: linear-gradient(90deg,rgba(3,12,27,.95),rgba(7,27,52,.72));
}
.match-page-v2 .combat-flagship-copy > span,
.match-page-v2 .combat-flagship-copy > small { font-size: clamp(11px,.76vw,14px); }
.match-page-v2 .combat-flagship-copy > strong { font-size: clamp(16px,1.12vw,22px); }

.match-page-v2 .combat-channel-copy { position: relative; inset: auto; height: calc(100% - 38px); padding-top: clamp(8px,.8svh,11px); color: #eef4f6; }
.match-page-v2 .combat-channel-copy > strong {
  display: block;
  padding: clamp(8px,.62vw,12px);
  border-left: 4px solid #b84636;
  background: rgba(112,27,27,.34);
  color: #fff2e9;
  font: 400 clamp(15px,1.05vw,20px)/1.08 var(--gps-font-display);
}
.match-page-v2 .combat-channel-copy ol { display: grid; gap: 4px; margin-top: 7px; }
.match-page-v2 .combat-channel-copy li { min-height: 0; padding: clamp(5px,.48svh,8px) 0; grid-template-columns: clamp(28px,2vw,38px) 1fr; }
.match-page-v2 .combat-channel-copy li b,
.match-page-v2 .combat-channel-copy li span { font-size: clamp(13px,.9vw,17px); line-height: 1.15; }

.match-page-v2 .fleet-status-panel {
  position: relative;
  display: grid;
  width: 100%;
  min-height: 0;
  min-width: 0;
  grid-template-columns: minmax(0,1fr);
  grid-template-rows: auto minmax(0,1fr);
}
.match-page-v2 .fleet-status-heading {
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: clamp(38px,4.7svh,46px);
  padding: 0 clamp(8px,.66vw,12px);
  border-bottom: 1px solid rgba(222,184,100,.56);
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(180deg,rgba(23,58,94,.92),rgba(6,25,49,.96));
  box-shadow: inset 0 1px rgba(255,255,255,.12),inset 0 -2px rgba(0,0,0,.54);
  gap: 10px;
}
.match-page-v2 .fleet-status-heading h2 {
  margin: 0;
  color: #f0d290;
  font: 400 clamp(15px,1.02vw,20px)/1 var(--gps-font-display);
  letter-spacing: .025em;
  text-shadow: 0 2px 2px #000;
  white-space: nowrap;
}
.match-page-v2 .fleet-status-heading > span {
  color: #a9bcc7;
  font: 700 clamp(8px,.55vw,11px)/1 var(--gps-font-ui);
  letter-spacing: .08em;
  max-width: 112px;
  text-align: right;
}
.match-page-v2 .fleet-status-heading > span { display: none; }
.match-page-v2 .enemy-fleet-status-live {
  display: grid;
  width: 100%;
  min-height: 0;
  min-width: 0;
  padding: clamp(6px,.62svh,9px);
  grid-template-columns: repeat(2,minmax(0,1fr));
  grid-template-rows: repeat(4,minmax(0,1fr));
  gap: clamp(5px,.55svh,8px) clamp(5px,.42vw,8px);
  overflow: hidden;
  background:
    linear-gradient(135deg,rgba(255,255,255,.035),transparent 33%),
    radial-gradient(circle at 50% 0,rgba(38,88,132,.3),transparent 64%),
    #04152b;
  box-shadow: inset 0 0 0 2px rgba(2,9,19,.9),inset 0 0 24px rgba(0,0,0,.62);
}
.match-page-v2 .enemy-formation-card {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: 2px solid #876a34;
  border-radius: 2px;
  grid-template-rows: auto minmax(0,1fr);
  background: linear-gradient(145deg,rgba(25,65,101,.94),rgba(6,23,46,.96) 43%,rgba(2,12,26,.98));
  box-shadow:
    inset 0 0 0 1px rgba(230,194,112,.26),
    inset 0 2px rgba(255,255,255,.08),
    inset 0 -3px 8px rgba(0,0,0,.62),
    0 3px 7px rgba(0,0,0,.52);
}
.match-page-v2 .enemy-formation-card::after {
  position: absolute;
  inset: 3px;
  border: 1px solid rgba(198,218,228,.08);
  content: "";
  pointer-events: none;
}
.match-page-v2 .enemy-formation-card > header {
  position: relative;
  z-index: 2;
  display: grid;
  min-height: clamp(19px,2.25svh,24px);
  padding: 0 clamp(5px,.38vw,7px);
  border-bottom: 1px solid rgba(211,177,98,.36);
  grid-template-columns: auto 1fr;
  gap: 6px;
  align-items: center;
  background: linear-gradient(180deg,rgba(28,70,107,.84),rgba(10,36,65,.74));
}
.match-page-v2 .enemy-formation-card > header b {
  color: #c54b3c;
  font: 700 clamp(10px,.66vw,13px)/1 var(--gps-font-ui);
}
.match-page-v2 .enemy-formation-card > header span {
  overflow: hidden;
  color: #f2ddb0;
  font: 700 clamp(11px,.72vw,14px)/1 var(--gps-font-ui);
  letter-spacing: .035em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.match-page-v2 .enemy-formation-contact {
  position: relative;
  display: grid;
  min-height: 0;
  padding: 2px 4px;
  grid-template-columns: minmax(0,1fr);
  align-items: center;
}
.match-page-v2 .enemy-formation-silhouette {
  display: block;
  width: min(72%,104px);
  height: clamp(30px,4.55svh,50px);
  justify-self: start;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  filter: brightness(1.08) contrast(1.1) drop-shadow(0 2px 2px rgba(0,0,0,.9));
  mix-blend-mode: screen;
}
.match-page-v2 [data-enemy-type="I"] .enemy-formation-silhouette { background-image: url("./assets/combat-ui/formations/formation-i.png"); }
.match-page-v2 [data-enemy-type="S"] .enemy-formation-silhouette { background-image: url("./assets/combat-ui/formations/formation-s.png"); }
.match-page-v2 [data-enemy-type="J"] .enemy-formation-silhouette { background-image: url("./assets/combat-ui/formations/formation-j.png"); }
.match-page-v2 [data-enemy-type="T"] .enemy-formation-silhouette { background-image: url("./assets/combat-ui/formations/formation-t.png"); }
.match-page-v2 [data-enemy-type="L"] .enemy-formation-silhouette { background-image: url("./assets/combat-ui/formations/formation-l.png"); }
.match-page-v2 [data-enemy-type="Z"] .enemy-formation-silhouette { background-image: url("./assets/combat-ui/formations/formation-z.png"); }
.match-page-v2 [data-enemy-type="O"] .enemy-formation-silhouette { background-image: url("./assets/combat-ui/formations/formation-o.png"); }
.match-page-v2 [data-enemy-type="DREADNOUGHT"] .enemy-formation-silhouette { background-image: url("./assets/combat-ui/formations/formation-dreadnought.png"); }
.match-page-v2 .enemy-formation-state {
  position: absolute;
  z-index: 2;
  display: grid;
  right: 3px;
  bottom: 3px;
  min-width: clamp(36px,2.65vw,48px);
  min-height: clamp(19px,2.25svh,24px);
  padding: 0 4px;
  border: 1px solid rgba(134,194,176,.54);
  align-items: center;
  background: rgba(10,70,64,.46);
  color: #9ce4ca;
  font: 800 clamp(10px,.63vw,12px)/1 var(--gps-font-ui);
  letter-spacing: .055em;
  text-align: center;
  text-shadow: 0 1px 1px #000;
}
.match-page-v2 .enemy-formation-card.is-damaged .enemy-formation-state { border-color: rgba(231,165,87,.68); background: rgba(113,55,18,.52); color: #ffc47f; }
.match-page-v2 .enemy-formation-card.is-sunk { border-color: #684238; background: linear-gradient(145deg,#2c3337,#10171d 45%,#060a0e); }
.match-page-v2 .enemy-formation-card.is-sunk .enemy-formation-silhouette { filter: grayscale(1) brightness(.38) contrast(1.55) sepia(.32) drop-shadow(0 2px 2px #000); }
.match-page-v2 .enemy-formation-card.is-sunk .enemy-formation-state { border-color: rgba(190,91,70,.7); background: rgba(91,22,17,.62); color: #ff9c8d; }
.match-page-v2 .enemy-formation-card.is-empty { border-color: #435363; }
.match-page-v2 .enemy-formation-card.is-empty .enemy-formation-silhouette { opacity: .4; filter: grayscale(1) brightness(.68) contrast(1.25); }
.match-page-v2 .enemy-formation-card.is-empty .enemy-formation-silhouette { opacity: .76; filter: grayscale(.65) brightness(.95) contrast(1.2); }
.match-page-v2 .enemy-formation-card.is-empty .enemy-formation-state { min-width: clamp(62px,4.8vw,88px); border-color: rgba(111,132,145,.54); background: rgba(25,38,50,.92); color: #aab8c0; letter-spacing: .025em; }

.match-page-v2 .board-stage { grid-column: 2; display: grid; box-sizing: border-box; width: 100%; height: 100%; min-width: 0; min-height: 0; padding: calc(var(--grid-waterline-gap) + var(--horizon-height) - var(--combat-top)) 0 0; place-items: start center; }
.match-page-v2 .board-assembly,
.match-page-v2 .board-stage:has(.board-plane.is-deploying) .board-assembly { display: grid; width: min(100%,calc((100svh - var(--combat-top) - 66px - var(--grid-waterline-gap)) * 1.5)); height: auto; max-width: 100%; max-height: 100%; aspect-ratio: auto; grid-template-rows: auto auto auto; }
.match-page-v2 .theater-strip { display: grid; min-height: clamp(26px,3.3svh,34px); font-size: clamp(11px,.76vw,14px); }
.match-page-v2 .board-plane { position: relative; width: 100%; height: auto; min-height: 0; aspect-ratio: 24 / 16; overflow: visible; border: 0; background: transparent; box-shadow: none; transform: none; }
.match-page-v2 .board-surface { position: absolute; inset: 0; width: 100%; height: 100%; border: 2px solid rgba(211,176,96,.7); background: transparent; box-shadow: inset 0 0 0 1px rgba(3,12,26,.9),inset 0 0 48px rgba(1,8,20,.25),0 10px 24px rgba(0,0,0,.42); transform: none; }
.match-page-v2 .target-grid { grid-template-columns: repeat(24,1fr); grid-template-rows: repeat(16,1fr); }
.match-page-v2 .target-cell,
.match-page-v2 .target-cell:nth-child(4n) { aspect-ratio: 1; min-width: 0; min-height: 0; border: 1px solid rgba(190,214,232,.19); }
.match-page-v2 .grid-north i,
.match-page-v2 .grid-west i { color: rgba(232,242,248,.86); font-size: clamp(9px,.68vw,13px); text-shadow: 0 1px 2px #000; }
.match-page-v2 .board-readout { width: 92%; margin-top: 4px; }
.match-page-v2 .board-readout div { padding: clamp(6px,.58vw,10px); }
.match-page-v2 .board-readout span { font-size: clamp(11px,.76vw,14px); }
.match-page-v2 .board-readout strong { font-size: clamp(13px,.9vw,17px); }

.match-page-v2 .island-piece { transform: none; }
.match-page-v2 .island-piece > img { object-fit: fill; transform-origin: 50% 50%; }
.match-page-v2 .island-smoke { top: 51%; left: 47%; width: 46%; height: 58%; transform: translate(-50%,-52%); transform-origin: 50% 65%; }
.match-page-v2 .island-bear { transform-origin: 50% 68%; animation: gps-polar-bear-fixed-rear 12s cubic-bezier(.42,0,.28,1) infinite; }
@keyframes gps-polar-bear-fixed-rear {
  0%, 68%, 100% { transform: translate(0,0) rotate(0) scale(1); }
  76% { transform: translate(0,-1.5%) rotate(-1deg) scale(1.04,1.13); }
  83% { transform: translate(0,-4.2%) rotate(-2deg) scale(1.12,1.42); }
  90% { transform: translate(0,-1.2%) rotate(0) scale(1.03,1.1); }
}
.match-page-v2 .missile-hardpoint { display: none !important; }
.missile.is-enemy { transform-origin: 50% 100%; }

body.is-combat-page-candidate[data-stage="battle-screen"] .gps-start-controls,
body.is-combat-page-candidate[data-stage="battle-screen"] .gps-feedback-entry,
body.is-combat-page-candidate[data-stage="battle-screen"] .match-command-cluster { display: none !important; }

.target-cell.is-hit > .hit-fire,
.mini-cell.is-hit > .hit-fire { position: absolute; z-index: 7; inset: -20% -16% -10%; display: block; overflow: visible; mix-blend-mode: screen; filter: blur(.2px) drop-shadow(0 0 4px rgba(255,83,19,.74)); pointer-events: none; }
.target-cell.is-hit > .hit-fire > i,
.mini-cell.is-hit > .hit-fire > i { --ember-drift: 0%; position: absolute; bottom: 4%; left: 28%; width: 46%; aspect-ratio: 1; border-radius: 50%; opacity: 0; background: radial-gradient(circle at 50% 56%,#fff9c9 0 8%,#ffc24a 17%,rgba(255,79,15,.9) 38%,rgba(172,24,7,.42) 58%,transparent 72%); transform-origin: 50% 80%; animation: gps-hit-particle-rise 1.08s cubic-bezier(.3,.05,.62,.9) infinite; }
.target-cell.is-hit > .hit-fire > i:nth-child(1), .mini-cell.is-hit > .hit-fire > i:nth-child(1) { left: 2%; width: 38%; --ember-drift: -12%; animation-delay: -.12s; }
.target-cell.is-hit > .hit-fire > i:nth-child(2), .mini-cell.is-hit > .hit-fire > i:nth-child(2) { left: 15%; width: 52%; --ember-drift: 8%; animation-delay: -.68s; animation-duration: .92s; }
.target-cell.is-hit > .hit-fire > i:nth-child(3), .mini-cell.is-hit > .hit-fire > i:nth-child(3) { left: 30%; width: 42%; --ember-drift: -5%; animation-delay: -.34s; animation-duration: 1.22s; }
.target-cell.is-hit > .hit-fire > i:nth-child(4), .mini-cell.is-hit > .hit-fire > i:nth-child(4) { left: 45%; width: 55%; --ember-drift: 12%; animation-delay: -.82s; animation-duration: 1.04s; }
.target-cell.is-hit > .hit-fire > i:nth-child(5), .mini-cell.is-hit > .hit-fire > i:nth-child(5) { left: 66%; width: 36%; --ember-drift: 5%; animation-delay: -.49s; animation-duration: .86s; }
.target-cell.is-hit > .hit-fire > i:nth-child(6), .mini-cell.is-hit > .hit-fire > i:nth-child(6) { left: 8%; width: 29%; --ember-drift: 17%; animation-delay: -.93s; animation-duration: 1.3s; }
.target-cell.is-hit > .hit-fire > i:nth-child(7), .mini-cell.is-hit > .hit-fire > i:nth-child(7) { left: 38%; width: 31%; --ember-drift: -16%; animation-delay: -.57s; animation-duration: .78s; }
.target-cell.is-hit > .hit-fire > i:nth-child(8), .mini-cell.is-hit > .hit-fire > i:nth-child(8) { left: 58%; width: 45%; --ember-drift: -7%; animation-delay: -.21s; animation-duration: 1.16s; }
.target-cell.is-hit > .hit-fire > i:nth-child(9), .mini-cell.is-hit > .hit-fire > i:nth-child(9) { left: 23%; width: 34%; --ember-drift: 14%; animation-delay: -.75s; animation-duration: .98s; }
.target-cell.is-hit.is-fire-left > .hit-fire,
.mini-cell.is-hit.is-fire-left > .hit-fire { left: -44%; }
.target-cell.is-hit.is-fire-right > .hit-fire,
.mini-cell.is-hit.is-fire-right > .hit-fire { right: -44%; }
.target-cell.is-hit.is-fire-up > .hit-fire,
.mini-cell.is-hit.is-fire-up > .hit-fire { top: -42%; }
.target-cell.is-hit.is-fire-down > .hit-fire,
.mini-cell.is-hit.is-fire-down > .hit-fire { bottom: -38%; }
.target-cell.is-hit.is-burning > .hit-fire,
.mini-cell.is-hit.is-burning > .hit-fire { filter: brightness(1.18) saturate(1.1) blur(.15px) drop-shadow(0 0 6px rgba(255,92,20,.88)); }
.target-cell.is-hit.is-charred > .hit-fire,
.mini-cell.is-hit.is-charred > .hit-fire { display: none; }

/* A Dreadnought section at one of two hits is damaged, not disabled. Keep its
   smolder small and subdued; the existing full fire remains reserved for the
   second hit that disables the section. */
.target-cell.is-hit.is-dreadnought-section-damaged::before {
  inset: 16%;
  opacity: .46;
  filter: saturate(.7) brightness(.86) blur(.2px) drop-shadow(0 0 2px rgba(224, 99, 35, .48));
  animation: gps-dreadnought-section-smolder-fire 1.25s steps(2, end) infinite alternate;
}
.target-cell.is-hit.is-dreadnought-section-damaged::after {
  inset: 8% 14% 54%;
  opacity: .26;
  filter: blur(1.2px);
  animation: gps-dreadnought-section-smolder-smoke 2.4s ease-in-out infinite alternate;
}
.target-cell.is-hit.is-dreadnought-section-damaged > .hit-fire {
  inset: 18% 20% 12%;
  opacity: .44;
  filter: saturate(.68) brightness(.86) blur(.15px) drop-shadow(0 0 2px rgba(224, 91, 28, .46));
}
.target-cell.is-hit.is-dreadnought-section-damaged > .hit-fire > i:nth-child(n + 5) {
  display: none;
}
@keyframes gps-dreadnought-section-smolder-fire {
  from { opacity: .28; transform: scale(.88, .96) skewX(-1deg); }
  to { opacity: .46; transform: scale(.98, .9) skewX(1deg); }
}
@keyframes gps-dreadnought-section-smolder-smoke {
  from { opacity: .12; transform: translate(-1%, 3%) scale(.88); }
  to { opacity: .26; transform: translate(2%, -8%) scale(1.04); }
}
@keyframes gps-hit-particle-rise {
  0% { opacity: 0; transform: translate3d(0,34%,0) scale(.48); }
  18% { opacity: .96; }
  62% { opacity: .78; }
  100% { opacity: 0; transform: translate3d(var(--ember-drift),-92%,0) scale(.18); }
}

/* Feedback is a small header utility during combat and a safe-edge tab elsewhere. */
.gps-feedback-entry {
  position: fixed;
  z-index: 120;
  right: max(10px,env(safe-area-inset-right));
  bottom: max(10px,env(safe-area-inset-bottom));
  min-width: 116px;
  min-height: 42px;
  padding: 8px 16px;
  border: 2px solid #b58a43;
  border-radius: 7px;
  background: linear-gradient(180deg,#173f73,#071b3b);
  box-shadow: inset 0 0 0 2px #020817,0 5px 14px rgba(0,0,0,.5);
  color: #f0d18b;
  font: 400 14px/1 var(--gps-font-display);
  letter-spacing: .06em;
}
body.is-combat-page-candidate[data-stage="battle-screen"] .gps-feedback-entry {
  top: clamp(9px,1svh,13px);
  right: auto;
  bottom: auto;
  left: 44vw;
  min-width: clamp(112px,8.5vw,164px);
  min-height: 44px;
}
.gps-feedback-entry:hover { filter: brightness(1.14); }
.gps-feedback-entry:focus-visible { outline: 3px solid #fff1b5; outline-offset: 3px; }

.gps-feedback-dialog {
  width: min(620px,calc(100vw - 28px));
  max-height: min(820px,calc(100svh - 28px));
  padding: 0;
  overflow: auto;
  border: 3px solid #b58a43;
  border-radius: 12px;
  background: linear-gradient(180deg,#173b67,#07182f 72%,#030b18);
  box-shadow: inset 0 0 0 3px #020817,0 24px 60px rgba(0,0,0,.72);
  color: #eef4f6;
}
.gps-feedback-dialog::backdrop { background: rgba(1,6,14,.78); backdrop-filter: blur(4px); }
.gps-feedback-form { display: grid; gap: 10px; padding: clamp(20px,3vw,34px); }
.gps-feedback-form header { display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: start; }
.gps-feedback-form h2 { margin: 4px 0 8px; color: #f2d394; font: 400 clamp(26px,4vw,40px)/1 var(--gps-font-display); }
.gps-feedback-form p { margin: 0; color: #dbe7ec; font: 600 15px/1.45 var(--gps-font-ui); }
.gps-feedback-form label { margin-top: 5px; color: #f1d799; font: 400 14px/1 var(--gps-font-display); letter-spacing: .04em; }
.gps-feedback-form :is(select,textarea,input) { box-sizing: border-box; width: 100%; border: 1px solid rgba(224,190,115,.62); border-radius: 6px; background: #06162c; color: #eef4f6; font: 600 16px/1.4 var(--gps-font-ui); }
.gps-feedback-form :is(select,input) { min-height: 44px; padding: 9px 11px; }
.gps-feedback-form textarea { min-height: 150px; padding: 11px; resize: vertical; }
.gps-feedback-form :is(select,textarea,input):focus { outline: 3px solid rgba(150,210,255,.72); outline-offset: 2px; }
.gps-feedback-close { min-width: 44px; min-height: 44px; border: 2px solid #b58a43; border-radius: 6px; background: #07172f; color: #f1d799; font: 700 27px/1 var(--gps-font-ui); }
.gps-feedback-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.gps-feedback-turnstile { min-height: 66px; display: grid; align-items: center; }
.gps-feedback-turnstile[data-state="hosted-only"]::before { content: "TURNSTILE · HOSTED BUILD"; display: grid; min-height: 54px; padding: 10px; border: 1px dashed rgba(181,138,67,.65); align-items: center; color: #aebdca; font: 700 12px/1.2 var(--gps-font-ui); letter-spacing: .07em; text-align: center; }
.gps-feedback-actions { display: grid; grid-template-columns: 1fr 1.45fr; gap: 10px; }
.gps-feedback-actions button { min-height: 46px; border: 2px solid #b58a43; border-radius: 7px; background: linear-gradient(180deg,#1f4b80,#081d3f); color: #f1d799; font: 400 15px/1 var(--gps-font-display); }
.gps-feedback-actions button:disabled { opacity: .56; }
.gps-feedback-status { min-height: 24px; }
.gps-feedback-status[data-kind="error"] { color: #ffb3a7; }
.gps-feedback-status[data-kind="success"] { color: #a9f0c4; }
.gps-feedback-status[data-kind="preview"] { color: #bfd2e2; }

@media (max-height: 820px) and (min-width: 900px) {
  .match-page-v2 { --combat-top: clamp(142px,20svh,158px); --horizon-height: clamp(160px,23svh,184px); }
  .match-page-v2 .battlefield-shell { grid-template-columns: clamp(205px,15.4vw,240px) minmax(0,1fr) clamp(265px,19.5vw,300px); }
  .match-page-v2 .combat-left-rail { grid-template-rows: minmax(0,31%) minmax(0,69%); }
  .match-page-v2 .combat-right-rail { grid-template-rows: minmax(0,34%) minmax(0,66%); }
  .match-page-v2 .flagship-artboard { transform: translateY(clamp(-48px,-5.2svh,-34px)); }
  .match-page-v2 .combat-channel-copy li { padding-block: 3px; }
  body.is-combat-page-candidate[data-stage="battle-screen"] { --gps-combat-page-top: clamp(142px,20svh,158px); --gps-combat-rail-width: clamp(265px,19.5vw,300px); }
}

@media (max-width: 1180px) {
  .match-page-v2 .combat-flagship-copy > span,
  .match-page-v2 .combat-flagship-copy > small { display: none; }
  .match-page-v2 .combat-flagship-copy > strong { margin: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .match-page-v2 .island-bear { animation: none !important; transform: none; }
  .match-page-v2 .island-smoke i { animation: none !important; opacity: .38; }
  .target-cell.is-hit > .hit-fire > i,
  .mini-cell.is-hit > .hit-fire > i { animation: none !important; opacity: .42; transform: translateY(-10%) scale(.7); }
}

/* The main film, supplied 16:9 bridge, and live cabinet use the same cover
   geometry at every desktop ratio. This prevents the 1440 x 900 letterbox jump
   while retaining the source MP4 unchanged and using a one-frame direct cut. */
.gps-opening-video-shadow-bridge {
  object-fit: cover;
  object-position: center;
  transition: none !important;
}
.gps-opening-cinematic[data-phase="bridge"] .gps-opening-video-post { opacity: 0 !important; }
.gps-opening-cinematic[data-phase="bridge"] .gps-opening-video-shadow-bridge { opacity: 1 !important; }
.gps-opening-cinematic[data-phase="bridge"] .gps-opening-cinematic-shade { display: none !important; }
.gps-opening-cinematic[data-phase="hub"] .gps-opening-video-shadow-bridge { opacity: 0 !important; }

/* The complete title-screen hardware scales as hardware: artwork, hit targets,
   frame, and labels grow together rather than enlarging only their type. */
#mode-screen.is-opening-cinematic .gps-opening-logo {
  top: clamp(112px, 16svh, 176px);
  left: clamp(28px, 3.2vw, 62px);
  width: clamp(610px, 49vw, 940px);
  max-width: calc(100vw - 56px);
  height: auto;
  object-fit: contain;
}
#mode-screen.is-opening-cinematic .gps-radar-action {
  bottom: clamp(38px, 6.5svh, 74px);
  width: clamp(520px, 39vw, 720px);
  height: clamp(104px, 12svh, 134px);
  padding-inline: clamp(52px, 5vw, 86px);
  border-width: 4px;
  border-radius: 14px;
  font-size: clamp(36px, 3vw, 54px);
}
.gps-start-controls .gps-achievements-control {
  width: clamp(250px, 18vw, 330px);
  height: clamp(66px, 7.6svh, 86px);
}
.gps-start-controls .gps-achievements-control::after { font-size: clamp(22px, 1.45vw, 28px); }
.gps-start-controls .gps-global-audio {
  top: clamp(14px, 1.6svh, 24px);
  right: clamp(260px, 18vw, 350px);
  width: clamp(410px, 27vw, 520px);
  height: clamp(88px, 10svh, 116px);
}
.gps-start-controls .gps-global-audio::before { top: 8%; font-size: clamp(20px, 1.35vw, 26px); }
.gps-start-controls .gps-audio-toggle {
  top: 37%;
  height: 48%;
  font-size: clamp(20px, 1.25vw, 24px);
}
.gps-start-controls .gps-volume-control { top: 38%; height: 43%; }
.gps-start-controls .gps-volume-control input::-webkit-slider-thumb {
  width: clamp(20px, 1.45vw, 28px);
  height: clamp(42px, 4.5svh, 56px);
}
.gps-start-controls .gps-volume-control input::-moz-range-thumb {
  width: clamp(20px, 1.45vw, 28px);
  height: clamp(42px, 4.5svh, 56px);
}
.gps-start-controls .gps-cgh-link {
  top: clamp(10px, 1.2svh, 18px);
  right: clamp(14px, 1.5vw, 28px);
  width: clamp(225px, 15vw, 295px);
  height: auto;
}
.gps-start-controls .gps-cgh-link img { width: 100%; height: auto; object-fit: contain; }
.gps-opening-credit {
  top: clamp(58px, 7.5svh, 92px);
  width: min(82vw, 1260px);
  font-size: clamp(48px, 4vw, 72px);
  line-height: 1.12;
}

/* Permanent command deck and combat hierarchy. */
.match-page-v2 .battle-studio-logo {
  position: fixed !important;
  z-index: 70 !important;
  top: clamp(8px, 1svh, 14px);
  right: clamp(12px, 1.25vw, 24px);
  display: block;
  width: clamp(175px, 12vw, 230px);
  height: auto;
  object-fit: contain;
}
.match-page-v2 .combat-command-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr);
  grid-template-rows: auto auto auto minmax(62px, 1fr);
  gap: 6px;
  padding: 9px !important;
  border-bottom: 2px solid #8e6b34 !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.13), transparent 15%),
    linear-gradient(180deg, #1c497b, #0a2a53 48%, #03152f) !important;
  box-shadow: inset 0 0 0 2px #020817, inset 0 0 0 4px rgba(226,188,104,.24) !important;
}
.match-page-v2 .combat-command-panel > header {
  display: flex;
  min-width: 0;
  grid-column: 1 / -1;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: #f3d89a;
  font-family: var(--gps-font-display);
}
.match-page-v2 .combat-command-panel > header span { font-size: clamp(24px, 1.45vw, 30px); line-height: 1; }
.match-page-v2 .combat-command-panel > header strong { color: #d9e8ed; font: 700 18px/1.1 var(--gps-font-ui); text-align: right; }
.match-page-v2 .combat-command-action,
.match-page-v2 .combat-command-utility {
  min-width: 0;
  min-height: 44px;
  padding: 6px 8px;
  border: 2px solid #cda755;
  border-radius: 7px;
  background: linear-gradient(180deg, #214b81, #123663 44%, #061a3a 78%, #020b20);
  box-shadow: inset 0 0 0 2px #4b310d, inset 0 0 0 4px rgba(255,226,157,.25), 0 3px 0 #2b1c0c;
  color: #f4d78f;
  font: 400 22px/1.08 var(--gps-font-display);
  text-shadow: 0 2px 2px #000;
  line-height: 1.12;
  white-space: normal;
}
.match-page-v2 .combat-pause-toggle { grid-column: 1; grid-row: 2; }
.match-page-v2 .combat-command-utility { grid-column: 2; grid-row: 2; }
.match-page-v2 #restart-button { grid-column: 1; grid-row: 3; }
.match-page-v2 #home-button { grid-column: 2; grid-row: 3; }
.match-page-v2 #restart-button { min-height: 64px; }
.match-page-v2 .battle-audio-console {
  display: grid;
  min-height: 62px;
  grid-column: 1 / -1;
  grid-row: 4;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 3px 10px;
  padding: 5px 8px;
  border: 1px solid rgba(222,184,100,.62);
  background: rgba(2,13,31,.58);
}
.match-page-v2 .battle-audio-console > div { display: flex; grid-column: 1 / -1; justify-content: space-between; }
.match-page-v2 .battle-audio-console :is(strong, output, span) { font-size: 18px; line-height: 1; }
.match-page-v2 .battle-mute-control { min-width: 88px; min-height: 34px; font-size: 20px; }
.match-page-v2 .battle-mute-control::before,
.match-page-v2 .battle-volume-control::before,
.match-page-v2 .battle-volume-control::after { display: none !important; }
.match-page-v2 .battle-volume-control { display: grid; min-width: 0; grid-template-columns: auto minmax(80px,1fr); align-items: center; gap: 8px; }
.match-page-v2 .battle-volume-control input { position: relative; inset: auto; width: 100%; height: 28px; margin: 0; opacity: 1; }
body[data-combat-paused="true"] .match-page-v2 .board-stage { pointer-events: none; }
body[data-combat-paused="true"] .match-page-v2 :is(.island-bear, .island-smoke i, .mini-sweep, .reticle) { animation-play-state: paused !important; }

/* The tactical overview uses a contained hit pip, never the full combat flame. */
.match-page-v2 .mini-cell.is-hit {
  position: relative;
  z-index: 2;
  overflow: hidden;
  isolation: auto;
  background: rgba(115, 39, 31, .34) !important;
}
.match-page-v2 .mini-cell.is-hit::before {
  z-index: 3;
  inset: 22%;
  border: 1px solid #f0b05d;
  border-radius: 50%;
  background: #b84636;
  box-shadow: 0 0 0 1px rgba(0,0,0,.65), 0 0 4px rgba(255,126,61,.72);
  opacity: 1;
  filter: none;
  mix-blend-mode: normal;
  transform: none;
  animation: none;
}
.match-page-v2 .mini-cell.is-hit::after,
.match-page-v2 .mini-cell.is-hit > .hit-fire { display: none !important; }
.match-page-v2 .mini-cell.is-hit.is-dreadnought-section-damaged::before {
  inset: 30%;
  border-color: #b98755;
  background: #805035;
  box-shadow: 0 0 0 1px rgba(0,0,0,.58), 0 0 2px rgba(213,133,67,.44);
  opacity: .68;
}
.match-page-v2 .mini-cell.is-hit.is-charred::before { background: #322b28; border-color: #7d6b5d; box-shadow: 0 0 0 1px #000; }

/* Project-wide live typography floor. Fixedsys remains on monitor surfaces and
   Black Ops One on hardware; panels reflow or scroll rather than miniaturize. */
:is(.gps-opening-shadow-box, .gps-fleet-inspector, .gps-mode-reveal, .map-room-screen, .match-page-v2, .gps-feedback-dialog)
  :is(p, li, dt, dd, label, small, output, span, strong, b) { font-size: 20px !important; }
:is(.gps-opening-shadow-box, .gps-fleet-inspector, .gps-mode-reveal, .map-room-screen, .match-page-v2, .gps-feedback-dialog)
  :is(button, select, textarea, input:not([type="range"])) { font-size: 22px !important; }
:is(.gps-opening-shadow-box, .gps-fleet-inspector, .gps-mode-reveal, .map-room-screen, .match-page-v2, .gps-feedback-dialog)
  :is(h1, h2, h3, .panel-heading > span, .fleet-status-heading h2) { font-size: 30px !important; line-height: 1.08; }
.gps-shadow-welcome,
.gps-shadow-welcome span { font-size: clamp(48px, 5.25vw, 94px) !important; }
.gps-shadow-actions button { font-size: clamp(30px, 3vw, 54px) !important; }
.gps-fleet-inspector .gps-fleet-inspector-kicker { font-size: 20px !important; }
.gps-fleet-inspector h2 { font-size: clamp(30px, 2.1vw, 40px) !important; }
.gps-fleet-inspector > p { font-size: 20px !important; overflow: auto !important; }
.gps-fleet-inspector :is(dt, dd) { font-size: 20px !important; }
.gps-fleet-inspector dl { overflow: auto !important; }
.gps-fleet-inspector-nav button { min-height: 48px; font-size: 22px !important; }
.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-confirm { min-height: 62px; font-size: 28px !important; }
.gps-mode-card :is(p, span, strong, b),
.gps-card-copy :is(p, span, strong, b) { font-size: 20px !important; line-height: 1.25; }
.gps-mode-card :is(h2, h3), .gps-card-copy > strong { font-size: 30px !important; }
.gps-mode-card, .gps-card-copy { overflow: auto; }
.map-room-panel-display { height: auto !important; min-height: 64px; overflow: auto !important; }
.map-room-panel-display :is(span, strong) { font-size: 20px !important; line-height: 1.15; }
.map-room-live-instruction { height: auto !important; min-height: 42px; font-size: 20px !important; overflow: auto !important; }
.map-room-panel-control,
.map-room-panel-deploy,
.map-room-panel-back,
.map-room-panel-mute { font-size: 22px !important; }
.match-page-v2 .tactical-panel .panel-heading span,
.match-page-v2 .combat-right-rail h2,
.match-page-v2 .fleet-status-heading h2 { font-size: 30px !important; }
.match-page-v2 .tactical-panel .panel-heading strong { font-size: 20px !important; }
.match-page-v2 .combat-channel-copy { height: calc(100% - 42px); overflow: auto; }
.match-page-v2 .combat-channel-copy > strong { font-size: 24px !important; line-height: 1.18; }
.match-page-v2 .combat-channel-copy li :is(b, span) { font-size: 20px !important; line-height: 1.2; }
.match-page-v2 .combat-channel { padding: 10px !important; }
.match-page-v2 .combat-channel-copy { height: calc(100% - 34px); }
.match-page-v2 .combat-channel-copy > strong { padding: 6px 8px; }
.match-page-v2 .combat-channel-copy ol { gap: 2px; margin-top: 4px; }
.match-page-v2 .combat-channel-copy li { padding-block: 2px; }
.match-page-v2 .fleet-status-heading { min-height: 42px; }
.match-page-v2 .fleet-status-heading > span { font-size: 18px !important; }
.match-page-v2 .enemy-formation-card > header { min-height: 24px; }
.match-page-v2 .enemy-formation-card > header :is(b, span),
.match-page-v2 .enemy-formation-state { font-size: 18px !important; }
.match-page-v2 .enemy-formation-silhouette { width: min(76%, 132px); height: clamp(27px, 3.7svh, 42px); }
.match-page-v2 .grid-north i,
.match-page-v2 .grid-west i { font-size: 18px !important; }
.match-page-v2 .theater-strip,
.match-page-v2 .board-readout :is(span, strong) { font-size: 20px !important; }
.gps-feedback-entry { min-height: 52px; font-size: 22px; }
.gps-feedback-dialog { width: min(760px, calc(100vw - 28px)); }
.gps-feedback-form { gap: 15px; }
.gps-feedback-form h2 { font-size: clamp(34px, 4vw, 48px) !important; }
.gps-feedback-form :is(p, label, .gps-feedback-status) { font-size: 20px !important; }
.gps-feedback-form :is(select, textarea, input) { font-size: 20px !important; }
.gps-feedback-actions button { min-height: 56px; font-size: 22px !important; }
.gps-feedback-turnstile[data-state="hosted-only"]::before { font-size: 18px; }

/* At the two narrower desktop targets, each formation card becomes a compact
   horizontal instrument so its silhouette and state remain visible at 18px+. */
@media (max-width: 1600px) {
  .match-page-v2 .enemy-formation-card { grid-template-columns: 54px minmax(0,1fr); grid-template-rows: minmax(0,1fr); }
  .match-page-v2 .enemy-formation-card > header { grid-column: 1; grid-row: 1; min-height: 0; padding: 0 4px; border-right: 1px solid rgba(211,177,98,.36); border-bottom: 0; grid-template-columns: auto auto; gap: 3px; }
  .match-page-v2 .enemy-formation-contact { grid-column: 2; grid-row: 1; padding: 0 3px; }
  .match-page-v2 .enemy-formation-silhouette { width: min(66%,78px); height: 30px; }
  .match-page-v2 .enemy-formation-state { right: 2px; bottom: 50%; min-height: 24px; transform: translateY(50%); }
  .match-page-v2 [data-enemy-type="DREADNOUGHT"] > header span { font-size: 0 !important; }
  .match-page-v2 [data-enemy-type="DREADNOUGHT"] > header span::after { color: #f2ddb0; content: "DREAD"; font-size: 18px; }
  .match-page-v2 [data-enemy-type="DREADNOUGHT"] { grid-template-columns: 90px minmax(0,1fr); }
  .match-page-v2 [data-enemy-type="DREADNOUGHT"] .enemy-formation-silhouette { width: 44px; }
  .match-page-v2 .enemy-formation-card.is-empty .enemy-formation-state { min-width: 38px; padding-inline: 2px; font-size: 0 !important; }
  .match-page-v2 .enemy-formation-card.is-empty .enemy-formation-state::after { content: "N/C"; font-size: 18px; }
}

@media (max-height: 820px) and (min-width: 900px) {
  .match-page-v2 { --combat-top: clamp(142px, 20svh, 158px); --horizon-height: clamp(160px, 23svh, 184px); }
  .match-page-v2 .battlefield-shell { grid-template-columns: 290px minmax(0,1fr) clamp(400px, 29vw, 420px); }
  .match-page-v2 .combat-right-rail { grid-template-rows: 238px 148px minmax(209px, 1fr); }
  .match-page-v2 .combat-command-panel { gap: 4px; padding: 6px !important; }
  .match-page-v2 #restart-button { min-height: 64px; }
  .match-page-v2 .fleet-status-heading > span { display: none; }
  .match-page-v2 .fleet-status-panel { padding: 6px !important; }
  .match-page-v2 .enemy-formation-silhouette { height: 20px; }
  .match-page-v2 .flagship-artboard { transform: translateY(-34px); }
  .match-page-v2 .combat-channel-copy li { padding-block: 3px; }
  .match-page-v2 .combat-channel-copy ol { gap: 1px; margin-top: 3px; }
  .match-page-v2 .combat-channel-copy li { padding-block: 0; }
  .match-page-v2 .combat-channel-copy > strong { padding: 6px 8px; }
  #mode-screen.is-opening-cinematic .gps-opening-logo { top: 112px; width: clamp(590px, 48vw, 760px); }
  #mode-screen.is-opening-cinematic .gps-radar-action { width: clamp(500px, 40vw, 620px); height: 104px; bottom: 34px; }
  .gps-start-controls .gps-global-audio { width: clamp(390px, 29vw, 450px); height: 90px; right: clamp(235px, 18vw, 285px); }
  .gps-start-controls .gps-cgh-link { width: clamp(210px, 15vw, 245px); }
}

/* One large cinematic control set, distributed around the film's safe edges. */
.gps-opening-video-controls {
  inset: 0;
  display: block;
  width: 100%;
  max-width: none;
  opacity: 1;
  pointer-events: none;
}
.gps-opening-video-controls > * {
  position: absolute;
  box-sizing: border-box;
  min-height: 68px;
  border: 2px solid rgba(224,184,96,.88);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(21,54,96,.96), rgba(3,13,33,.97));
  box-shadow: inset 0 0 0 2px #020817, inset 0 0 0 4px rgba(255,226,157,.18), 0 8px 22px rgba(0,0,0,.56);
  color: #f2d99b;
  font-size: 22px;
  opacity: 1;
  pointer-events: auto;
  backdrop-filter: none;
}
#opening-video-achievements {
  top: clamp(18px, 2svh, 28px);
  left: clamp(18px, 1.6vw, 30px);
  width: clamp(260px, 19vw, 340px);
  padding-inline: 24px;
}
#opening-video-mute {
  top: clamp(18px, 2svh, 28px);
  right: clamp(390px, 28vw, 530px);
  width: clamp(124px, 9vw, 165px);
  padding-inline: 16px;
}
.gps-opening-video-controls label {
  top: clamp(18px, 2svh, 28px);
  right: clamp(18px, 1.6vw, 30px);
  display: grid;
  width: clamp(350px, 25vw, 470px);
  min-width: 350px;
  grid-template-columns: auto minmax(170px,1fr);
  gap: 14px;
  padding-inline: 18px;
}
.gps-opening-video-controls label span { font-size: 22px; }
.gps-opening-video-controls input { min-height: 44px; accent-color: #d9b66b; }
#opening-video-skip {
  right: auto;
  bottom: clamp(28px, 4svh, 48px);
  left: 50%;
  width: clamp(320px, 24vw, 430px);
  min-height: clamp(76px, 8.5svh, 94px);
  padding-inline: 28px;
  font-size: clamp(24px, 1.8vw, 32px);
  opacity: 1;
  transform: translateX(-50%);
}
#opening-video-skip:hover,
#opening-video-skip:focus-visible { transform: translateX(-50%); }

@media (max-height: 820px) and (min-width: 900px) {
  .gps-opening-video-controls > * { min-height: 62px; }
  #opening-video-achievements { width: 250px; }
  #opening-video-mute { right: 375px; width: 122px; }
  .gps-opening-video-controls label { right: 16px; width: 350px; min-width: 350px; }
  #opening-video-skip { bottom: 24px; min-height: 74px; }
}

/* Every live glyph inside the blue monitor uses the bundled bitmap face. */
.gps-shadow-display,
.gps-shadow-display *,
.gps-shadow-box-stage > .gps-mode-reveal,
.gps-shadow-box-stage > .gps-mode-reveal * {
  font-family: var(--gps-font-terminal) !important;
  font-synthesis: none;
  -webkit-font-smoothing: none;
  text-rendering: geometricPrecision;
}

/* Compact live footprint: it sits in the blueprint's reserved lower-right
   footprint zone and sizes its grid from the actual footprint, not dead rows. */
.gps-fleet-footprint,
.gps-fleet-inspector[data-vessel-class="leviathan"] .gps-fleet-footprint {
  right: 2.2%;
  bottom: 2.2%;
  width: clamp(190px, 19%, 270px);
  height: auto;
  max-height: 31%;
  padding: 8px 10px;
  grid-template-rows: auto auto auto;
  gap: 3px;
  align-content: end;
  overflow: hidden;
}
.gps-fleet-inspector[data-vessel-class="leviathan"] .gps-fleet-footprint { width: clamp(230px, 25%, 350px); }
.gps-fleet-footprint strong,
.gps-fleet-footprint > span {
  font-family: var(--gps-font-terminal) !important;
  font-size: 20px !important;
  line-height: 1.05;
}
.gps-fleet-footprint-grid {
  width: min(100%, calc(var(--footprint-columns) * clamp(14px, .9vw, 18px)));
  height: auto;
  max-width: 100%;
  justify-self: center;
  aspect-ratio: var(--footprint-columns) / var(--footprint-rows);
}
.gps-fleet-footprint-grid i { min-width: 0; min-height: 0; }
.gps-fleet-inspector-nav #fleet-inspector-back {
  right: auto;
  bottom: 7%;
  left: 43%;
  width: clamp(240px, 24%, 350px);
  height: clamp(58px, 10%, 82px);
  font-size: clamp(24px, 2vw, 36px) !important;
}

@media (max-height: 820px) and (min-width: 900px) {
  .gps-fleet-footprint,
  .gps-fleet-inspector[data-vessel-class="leviathan"] .gps-fleet-footprint {
    width: clamp(180px, 19%, 240px);
    max-height: 30%;
    padding: 6px 8px;
  }
  .gps-fleet-inspector[data-vessel-class="leviathan"] .gps-fleet-footprint { width: clamp(215px, 24%, 290px); }
  .gps-fleet-footprint strong,
  .gps-fleet-footprint > span { font-size: 18px !important; }
  .gps-fleet-footprint-grid { width: min(100%, calc(var(--footprint-columns) * 14px)); }
  .gps-fleet-inspector-nav #fleet-inspector-back { bottom: 6%; height: 58px; }
}

/* Map Room and combat share one 24 × 16 square-cell coordinate instrument.
   Lenny's approved vertical monitor order is status, board, then controls. */
.map-room-playfield {
  top: 20.1% !important;
  left: 37.95% !important;
  width: 27.42% !important;
  height: 32.5% !important;
  aspect-ratio: 24 / 16 !important;
  overflow: visible;
}
.map-room-exact-grid-layer { overflow: visible; }
.map-room-column-labels,
.map-room-row-labels {
  position: absolute;
  z-index: 8;
  display: grid;
  color: #eaf8ff;
  font-family: var(--gps-font-terminal);
  font-size: 18px;
  line-height: 1;
  text-align: center;
  text-shadow: 0 1px 2px #001127, 0 0 6px rgba(122,205,255,.62);
  pointer-events: none;
}
.map-room-column-labels {
  right: 0;
  bottom: 100%;
  left: 0;
  height: 22px;
  grid-template-columns: repeat(24, minmax(0,1fr));
  align-items: end;
}
.map-room-row-labels {
  top: 0;
  right: 100%;
  bottom: 0;
  width: 30px;
  grid-template-rows: repeat(16, minmax(0,1fr));
  align-items: center;
}
.map-room-column-labels span,
.map-room-row-labels span { font-size: 18px !important; }
.map-room-island-art-layer,
.map-room-interaction-layer,
.map-room-exact-grid-layer { position: absolute; inset: 0; }
.map-room-island-art-layer { overflow: visible; }
.map-room-playfield .island-piece > img { object-fit: fill; transform-origin: 50% 50%; }
.map-room-playfield .island-smoke { top: 51%; left: 47%; width: 46%; height: 58%; transform: translate(-50%,-52%); transform-origin: 50% 65%; }
.map-room-playfield .island-bear { transform-origin: 50% 68%; animation: gps-polar-bear-fixed-rear 12s cubic-bezier(.42,0,.28,1) infinite; }
.map-room-panel-display {
  top: 10.3% !important;
  width: 26.7% !important;
  height: 5.7% !important;
  padding: 7px 10px !important;
}
.map-room-panel-status { left: 24% !important; }
.map-room-panel-selected { left: 51.2% !important; }
.map-room-panel-display :is(span, strong) { white-space: normal !important; }
.map-room-live-instruction {
  top: 16.25% !important;
  left: 24% !important;
  width: 53.9% !important;
  height: 3.25% !important;
  min-height: 0 !important;
  padding-inline: 8px !important;
  white-space: normal !important;
}
#map-room-auto-arrange,
#map-room-rotate,
#map-room-deploy,
#map-room-back {
  top: 54.3% !important;
  height: 7.6% !important;
  min-height: 0;
  font-size: 22px !important;
}
#map-room-auto-arrange { left: 24% !important; width: 13.2% !important; }
#map-room-rotate { left: 38% !important; width: 11.8% !important; }
#map-room-deploy { left: 50.6% !important; width: 16.4% !important; }
#map-room-back { left: 67.8% !important; width: 10.1% !important; }
#map-room-deploy > strong { display: block !important; font-size: 26px !important; }
.map-room-board-size {
  top: 49.6% !important;
  right: auto !important;
  left: 66.2% !important;
  font-size: 18px !important;
}
.map-room-glass-treatment {
  top: 20.1% !important;
  left: 37.95% !important;
  width: 27.42% !important;
  height: 32.5% !important;
}

@media (max-height: 820px) and (min-width: 900px) {
  .map-room-panel-display { padding: 5px 8px !important; }
  .map-room-panel-display :is(span, strong) { font-size: 18px !important; }
  #map-room-auto-arrange,
  #map-room-rotate,
  #map-room-deploy,
  #map-room-back { font-size: 22px !important; }
  .map-room-live-instruction { font-size: 18px !important; }
}

/* Short desktop monitors need the same vertical order without letting the
   status copy or instructions trespass into the column labels. Keep the live
   copy readable, compact the two status blocks into inline two-line summaries,
   then reduce the authoritative board uniformly so its cells remain square. */
@media (max-height: 950px) and (min-width: 900px) {
  .map-room-panel-display {
    height: 6.4% !important;
    min-height: 0 !important;
    padding: 5px 8px !important;
    overflow: auto !important;
  }
  .map-room-panel-display :is(span, strong) {
    display: inline !important;
    line-height: 1.15 !important;
  }
  .map-room-panel-display span { margin-right: .45em; }
  .map-room-live-instruction {
    top: 17.4% !important;
    height: 3.5% !important;
    min-height: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 8px;
    overflow: hidden !important;
  }
  .map-room-live-instruction :is(span, i) { white-space: nowrap; }
  .map-room-playfield,
  .map-room-glass-treatment {
    top: 23.9% !important;
    left: 51.66% !important;
    width: auto !important;
    height: 28.8% !important;
    aspect-ratio: 24 / 16 !important;
    transform: translateX(-50%);
  }
}

/* Combat Channel sonar/event report number: exact 59% increase from 20px. */
.match-page-v2 #combat-event-log > li > span {
  font-size: 31.8px !important;
  line-height: 1 !important;
}

.match-page-v2 #combat-event-log > li {
  grid-template-columns: clamp(44.52px, 3.18vw, 60.42px) minmax(0, 1fr) !important;
  min-height: 31.8px !important;
  align-items: center;
}

.match-page-v2 #combat-event-log {
  flex: 0 0 auto;
  grid-auto-rows: minmax(31.8px, auto);
  overflow: visible !important;
}

/* 2026-08-28 pre-flight: the post-BEGIN film overlay must stay as substantial
   as the title hardware. The explicit button/label selectors and !important
   values defeat the older high-specificity "quiet utility" treatment. */
.gps-opening-video-controls > button,
.gps-opening-video-controls > label {
  min-height: clamp(76px, 8.5svh, 94px) !important;
  border: 3px solid rgba(224, 184, 96, .96) !important;
  border-radius: 10px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), transparent 18%),
    linear-gradient(180deg, rgba(27,67,116,.98), rgba(7,26,59,.99) 62%, rgba(2,10,27,.99)) !important;
  box-shadow:
    inset 0 0 0 2px #020817,
    inset 0 0 0 5px rgba(255,226,157,.2),
    0 8px 24px rgba(0,0,0,.6) !important;
  color: #f5dca0 !important;
  font-size: clamp(24px, 1.55vw, 30px) !important;
  opacity: 1 !important;
}
#opening-video-achievements {
  width: clamp(300px, 21vw, 380px) !important;
  padding-inline: 28px !important;
}
#opening-video-mute {
  right: clamp(450px, 29.5vw, 565px) !important;
  width: clamp(140px, 9.5vw, 180px) !important;
  padding-inline: 18px !important;
}
.gps-opening-video-controls > label {
  right: clamp(18px, 1.6vw, 30px) !important;
  width: clamp(400px, 28vw, 520px) !important;
  min-width: 400px !important;
  grid-template-columns: auto minmax(190px, 1fr) !important;
  gap: 16px !important;
  padding-inline: 22px !important;
}
.gps-opening-video-controls > label > span { font-size: clamp(24px, 1.55vw, 30px) !important; }
.gps-opening-video-controls > label input { min-height: 48px !important; }
#opening-video-skip {
  right: auto !important;
  bottom: clamp(120px, 17svh, 190px) !important;
  left: 50% !important;
  width: clamp(420px, 31vw, 560px) !important;
  min-height: clamp(96px, 11svh, 116px) !important;
  border-width: 4px !important;
  font-size: clamp(30px, 2vw, 38px) !important;
  transform: translateX(-50%) !important;
}
#opening-video-skip:hover,
#opening-video-skip:focus-visible { transform: translateX(-50%) !important; }

/* BEGIN belongs in the lower-middle presentation band with substantial water
   beneath it, rather than riding the bottom safe-area edge. */
#mode-screen.is-opening-cinematic .gps-radar-action {
  bottom: clamp(120px, 17svh, 190px) !important;
}

/* The welcome remains persistent while both primary monitor actions use the
   same large embedded Fixedsys treatment and equal geometry. */
.gps-opening-hub.is-actions-ready .gps-shadow-welcome {
  opacity: 1 !important;
  visibility: visible !important;
}
.gps-shadow-welcome,
.gps-shadow-welcome span {
  font-size: clamp(64px, 6.3vw, 116px) !important;
}
#opening-select-mode,
#opening-inspect-fleet {
  min-height: clamp(110px, 14svh, 150px) !important;
  padding: .38em .58em !important;
  font-family: var(--gps-font-terminal) !important;
  font-size: clamp(32px, 3vw, 54px) !important;
  line-height: 1.05 !important;
}

/* The dossier arrows already share a baseline and mirrored margins; center the
   Return action on the same monitor axis instead of leaving it 7% off-center. */
.gps-fleet-inspector-nav #fleet-inspector-back {
  left: 50% !important;
  transform: translateX(-50%);
}

/* The imported blueprint plates already contain a legacy footprint drawing.
   An opaque live state panel fully replaces that baked area so exactly one
   authoritative footprint remains visible without changing approved art. */
.gps-fleet-footprint,
.gps-fleet-inspector[data-vessel-class="leviathan"] .gps-fleet-footprint {
  width: clamp(220px, 22%, 300px) !important;
  max-height: none !important;
  background: #073f75 !important;
}
.gps-fleet-inspector[data-vessel-class="leviathan"] .gps-fleet-footprint {
  width: clamp(236px, 23.5%, 312px) !important;
}
.gps-fleet-footprint strong { white-space: nowrap; }

/* The monitor scan plane is purely visual. Keep it clipped inside the glass
   and below navigation so it cannot leave a mask scar or intercept controls. */
.gps-shadow-display::after {
  inset: 1px !important;
  z-index: 3 !important;
  pointer-events: none !important;
}

/* The two unrequested Map Room display panels are absent from the DOM. Their
   changing values remain as visually-hidden live text for assistive technology,
   leaving the visible monitor to the instruction, board, and lower controls. */
.map-room-live-instruction {
  top: 10.5% !important;
  height: 4.1% !important;
}
.map-room-playfield,
.map-room-glass-treatment {
  top: 17.5% !important;
  left: 51.66% !important;
  width: auto !important;
  height: 39.5% !important;
  aspect-ratio: 24 / 16 !important;
  transform: translateX(-50%);
}
#map-room-auto-arrange,
#map-room-rotate,
#map-room-deploy,
#map-room-back {
  top: 57.8% !important;
}
#map-room-auto-arrange,
#map-room-rotate,
#map-room-deploy,
#map-room-deploy > strong,
#map-room-back {
  font-family: var(--gps-font-terminal) !important;
  font-synthesis: none;
}
.map-room-board-size { top: 54.2% !important; }

/* Tactical hits use only the contained mini-cell marker. Full-size flame and
   body-level impact effects are forbidden inside the overview instrument. */
.match-page-v2 .mini-map :is(.hit-fire, .resolved-impact),
.match-page-v2 .mini-grid :is(.hit-fire, .resolved-impact) {
  display: none !important;
}

/* Combat buttons retain their 22px labels. Give the audio interactions a true
   44px target; the short-desktop console reflows them into one row. */
.match-page-v2 .battle-mute-control,
.match-page-v2 .battle-volume-control {
  min-height: 44px !important;
}
.match-page-v2 .battle-mute-control,
.match-page-v2 .battle-volume-control > span { font-size: 22px !important; }

@media (max-height: 820px) and (min-width: 900px) {
  .match-page-v2 .battle-audio-console {
    min-height: 54px;
    grid-template-columns: minmax(78px, .58fr) 90px minmax(0, 1.42fr);
    grid-template-rows: 1fr;
    align-items: center;
    gap: 4px 7px;
    padding: 4px 6px;
  }
  .match-page-v2 .battle-audio-console > div {
    grid-column: 1;
    grid-row: 1;
    display: grid;
    justify-content: start;
    gap: 1px;
  }
  .match-page-v2 .battle-mute-control { grid-column: 2; grid-row: 1; min-width: 90px; }
  .match-page-v2 .battle-volume-control { grid-column: 3; grid-row: 1; }
}

/* Adopted post-transition Strike arrival frame supplied by Lenny on 2026-08-30.
   The literal film-end composite is reference-only: every top-rail control is live. */
.gps-opening-shadow-box .gps-shadow-box-stage {
  top: 50% !important;
  left: 50% !important;
  width: min(100vw, 177.7778svh) !important;
  height: min(100svh, 56.25vw) !important;
  margin: 0 !important;
  aspect-ratio: 16 / 9;
  transform: translate(-50%, -50%) !important;
}
.gps-opening-shadow-box .gps-shadow-cabinet-base {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
}
.gps-opening-shadow-box :is(.gps-shadow-diorama-foreground, .gps-shadow-diorama-overlap) {
  display: none !important;
  background: none !important;
}
/* Repaint only the portions of the left teddy, VW bus, polar bear, and knight
   that rise above the monitor lip. They sit over live display content for
   physical depth, but remain decorative and can never intercept a control. */
.gps-opening-shadow-box :is(.gps-shadow-diorama-overlap-teddy-left, .gps-shadow-diorama-overlap-van, .gps-shadow-diorama-overlap-bear, .gps-shadow-diorama-overlap-knight) {
  z-index: 24 !important;
  display: block !important;
  background: url("./assets/opening/gps_adopted_strike_arrival_frame_v1.png") 0 0 / 100% 100% no-repeat !important;
  pointer-events: none !important;
}
.gps-opening-shadow-box .gps-shadow-diorama-overlap-teddy-left {
  clip-path: polygon(21.5% 69.4%, 21.7% 67.5%, 22.3% 66.7%, 23.1% 65.9%, 24.5% 65.5%, 25.6% 65.9%, 26.3% 65.8%, 27.2% 66.5%, 27.9% 67.5%, 28.1% 69.4%);
}
.gps-opening-shadow-box .gps-shadow-diorama-overlap-van {
  clip-path: polygon(33.9% 69.4%, 34% 68.5%, 34.1% 67.7%, 34.8% 67.35%, 35.3% 67.08%, 35.9% 66.8%, 36.3% 66.6%, 37% 66.5%, 37.8% 66.55%, 38.5% 66.7%, 39.2% 66.95%, 40% 67.3%, 40.8% 67.7%, 41.5% 68.4%, 42.3% 69.4%);
}
.gps-opening-shadow-box .gps-shadow-diorama-overlap-bear {
  clip-path: polygon(43.7% 69.5%, 44.5% 68.3%, 45% 67.7%, 45.3% 67.35%, 45.55% 67.08%, 45.8% 66.8%, 46.5% 66.5%, 47% 66.45%, 47.6% 66.75%, 48.4% 67.08%, 49.45% 67.35%, 50.4% 67.65%, 51.65% 67.65%, 51.95% 67.8%, 52.2% 68.2%, 52.8% 68.6%, 53.4% 69.5%);
}
.gps-opening-shadow-box .gps-shadow-diorama-overlap-knight {
  clip-path: polygon(73.2% 69.3%, 73.8% 67.5%, 74.45% 67.36%, 74.53% 67.08%, 74.77% 66.8%, 74.92% 66.53%, 75% 66.25%, 75.16% 65.97%, 75.31% 65.69%, 75.47% 65.14%, 75.63% 64.86%, 75.7% 64.58%, 75.86% 64.31%, 76.33% 64.58%, 76.95% 64.86%, 77.1% 65.14%, 77.27% 65.42%, 77.42% 65.97%, 77.58% 66.53%, 77.73% 67.36%, 78% 69.3%);
}
.gps-opening-shadow-box :is(.gps-shadow-display, .gps-shadow-box-stage > .gps-mode-reveal) {
  top: 10.7% !important;
  left: 22% !important;
  width: 59.2% !important;
  height: 57.4% !important;
  background: transparent !important;
}
.gps-opening-shadow-box .gps-shadow-display::before,
.gps-opening-shadow-box .gps-shadow-display::after { display: none !important; }

/* Exact live translation of Lenny's locked Shadowbox UI end-frame CSS source.
   Geometry is expressed against the source 1280 × 720 frame; the controls stay
   real, focusable inputs while retaining the authored mounted-hardware design. */
.gps-opening-shadow-box #shadow-box-controls {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none;
  --cgh-blue-top: #174778;
  --cgh-blue-mid: #0d315e;
  --cgh-blue-deep: #06162f;
  --cgh-gold-bright: #f2d18b;
  --cgh-gold: #c99643;
  --cgh-gold-dark: #5e3b17;
  --cgh-ink: #020817;
}
.gps-opening-shadow-box #shadow-box-controls::before {
  position: absolute;
  z-index: 0;
  top: .972222%;
  left: 51.875%;
  display: block !important;
  width: 12.34375%;
  height: 5.833333%;
  border: 1px solid #3b240d !important;
  border-radius: 8px;
  background: linear-gradient(135deg, #4a2d11 0%, #a87531 12%, #efd28c 23%, #6d461c 39%, #c69648 57%, #f0d18a 72%, #71481c 87%, #3d250e 100%) !important;
  box-shadow: 0 3px 5px rgba(0,0,0,.64), 0 0 0 1px rgba(233,195,113,.36), inset 0 1px 1px rgba(255,241,196,.5), inset 0 -2px 2px rgba(26,13,4,.74) !important;
  content: "";
  pointer-events: none;
}
.gps-opening-shadow-box #shadow-box-controls::after {
  position: absolute;
  z-index: 1;
  top: 1.527778%;
  left: 52.1875%;
  display: block;
  width: 11.71875%;
  height: 4.722222%;
  border: 1px solid rgba(239,204,128,.86);
  border-radius: 4px;
  background: radial-gradient(ellipse at 50% 4%, rgba(91,148,207,.28), transparent 48%), linear-gradient(180deg, var(--cgh-blue-top), var(--cgh-blue-mid) 46%, var(--cgh-blue-deep));
  box-shadow: inset 0 0 0 2px rgba(1,7,18,.82), inset 0 1px 8px rgba(146,205,255,.18), inset 0 -4px 8px rgba(0,0,0,.44);
  content: "";
  pointer-events: none;
}
.gps-opening-shadow-box #shadow-box-controls > :is(button, label, a) {
  position: absolute;
  z-index: 3;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  opacity: 1 !important;
  pointer-events: auto;
}
.gps-opening-shadow-box #shadow-box-controls > button {
  position: absolute;
  display: grid;
  height: 5.833333%;
  place-items: center;
  padding: 3px;
  overflow: hidden;
  border: 1px solid #3b240d !important;
  border-radius: 8px;
  background: linear-gradient(135deg, #4a2d11 0%, #a87531 12%, #efd28c 23%, #6d461c 39%, #c69648 57%, #f0d18a 72%, #71481c 87%, #3d250e 100%) !important;
  color: var(--cgh-gold-bright) !important;
  box-shadow: 0 3px 5px rgba(0,0,0,.64), 0 0 0 1px rgba(233,195,113,.36), inset 0 1px 1px rgba(255,241,196,.5), inset 0 -2px 2px rgba(26,13,4,.74) !important;
  transition: filter 100ms ease, transform 100ms ease, box-shadow 100ms ease;
}
.gps-opening-shadow-box #shadow-box-controls > button::before {
  position: absolute;
  z-index: 0;
  inset: 4px;
  display: block;
  border: 1px solid rgba(239,204,128,.86);
  border-radius: 4px;
  background: radial-gradient(ellipse at 50% 4%, rgba(91,148,207,.28), transparent 48%), linear-gradient(180deg, var(--cgh-blue-top), var(--cgh-blue-mid) 46%, var(--cgh-blue-deep));
  box-shadow: inset 0 0 0 2px rgba(1,7,18,.82), inset 0 1px 8px rgba(146,205,255,.18), inset 0 -4px 8px rgba(0,0,0,.44);
  content: "";
  pointer-events: none;
}
.gps-opening-shadow-box #shadow-box-controls > button::after {
  position: absolute;
  z-index: 1;
  inset: 6px 7px auto;
  display: block;
  height: 8px;
  border-radius: 50%;
  background: linear-gradient(180deg, rgba(255,255,255,.16), transparent);
  content: "";
  pointer-events: none;
}
.gps-opening-shadow-box #shadow-box-controls > button:hover {
  filter: brightness(1.12);
  box-shadow: 0 3px 5px rgba(0,0,0,.64), 0 0 0 2px rgba(242,209,139,.72), inset 0 1px 1px rgba(255,241,196,.5), inset 0 -2px 2px rgba(26,13,4,.74) !important;
}
.gps-opening-shadow-box #shadow-box-controls > button:active { transform: translateY(1px); }
.gps-opening-shadow-box #shadow-box-controls > :is(button, a):focus-visible,
.gps-opening-shadow-box #shadow-box-controls > label:focus-within {
  outline: 3px solid #fff2bf;
  outline-offset: 2px;
}
.gps-opening-shadow-box .gps-shadow-command-label {
  position: relative !important;
  z-index: 2;
  display: block !important;
  inset: auto !important;
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  font-family: Rockwell, "Rockwell Extra Bold", Georgia, serif !important;
  font-size: clamp(14px, 1.40625vw, 27px) !important;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .75px;
  white-space: nowrap;
  text-align: center;
  text-shadow: 0 2px 1px #100904, 0 0 5px rgba(255,214,126,.22);
}
.gps-opening-shadow-box .gps-shadow-command-home { top: .972222%; left: 21.71875%; width: 8.75%; }
.gps-opening-shadow-box .gps-shadow-command-achievements { top: .972222%; left: 31.09375%; width: 14.21875%; }
.gps-opening-shadow-box .gps-shadow-command-feedback { top: .972222%; left: 64.84375%; width: 9.0625%; }
.gps-opening-shadow-box .gps-shadow-command-achievements .gps-shadow-command-label { font-size: clamp(13px, 1.25vw, 24px) !important; letter-spacing: .35px; }
.gps-opening-shadow-box .gps-shadow-command-feedback .gps-shadow-command-label { font-size: clamp(13px, 1.25vw, 24px) !important; letter-spacing: .25px; }
.gps-opening-shadow-box .gps-shadow-command-mute {
  top: 3.055556%;
  left: 52.421875%;
  display: flex !important;
  width: 3.828125%;
  height: 2.916667% !important;
  align-items: center;
  justify-content: space-between;
  padding: 0 0 0 5px !important;
  border: 1px solid #b6873e !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #102b52, #06142d) !important;
  box-shadow: inset 0 0 0 1px rgba(2,7,17,.82) !important;
  color: #ebca82 !important;
}
.gps-opening-shadow-box .gps-shadow-command-mute::before,
.gps-opening-shadow-box .gps-shadow-command-mute::after { display: none !important; }
.gps-opening-shadow-box .gps-shadow-command-mute .gps-shadow-command-label {
  font-size: clamp(8px, .625vw, 12px) !important;
  letter-spacing: .2px;
  text-shadow: 0 1px 1px #000;
}
.gps-opening-shadow-box .gps-shadow-speaker {
  position: relative !important;
  z-index: 2;
  display: block !important;
  width: min(1.484375vw, 19px);
  height: min(2.638889vh, 19px);
  margin-right: -1px;
  border: 1px solid #c29145 !important;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 30%, #285992, #0a234c 64%, #030a18) !important;
  box-shadow: inset 0 0 0 1px rgba(240,202,120,.22) !important;
}
.gps-opening-shadow-box .gps-shadow-speaker::before {
  position: absolute;
  top: 31.578947%;
  left: 21.052632%;
  width: 26.315789%;
  height: 36.842105%;
  background: #e3bd6d;
  clip-path: polygon(0 28%, 38% 28%, 100% 0, 100% 100%, 38% 72%, 0 72%);
  content: "";
  filter: drop-shadow(0 1px 1px #000);
}
.gps-opening-shadow-box .gps-shadow-speaker::after {
  position: absolute;
  top: 15.789474%;
  left: 47.368421%;
  color: #e3bd6d;
  font: 700 clamp(7px, .625vw, 12px)/1 Arial, sans-serif;
  letter-spacing: -3px;
  content: "))";
  text-shadow: 0 1px 1px #000;
  transform: scaleX(.7);
  transform-origin: left center;
}
.gps-opening-shadow-box .gps-shadow-command-volume {
  --shadow-volume-percent: 65%;
  top: 1.527778%;
  left: 56.640625%;
  display: block !important;
  width: 7.109375%;
  height: 4.722222%;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  color: #efd08b !important;
  box-shadow: none !important;
  cursor: pointer;
}
.gps-opening-shadow-box .gps-shadow-volume-title {
  position: absolute !important;
  top: 0;
  left: 0;
  display: block !important;
  width: 100%;
  height: 41.176471%;
  color: #efd08b !important;
  font-family: Rockwell, Georgia, serif !important;
  font-size: clamp(8px, .625vw, 12px) !important;
  font-weight: 800;
  line-height: 1;
  text-align: center;
  text-shadow: 0 1px 1px #000;
  z-index: 2;
}
.gps-opening-shadow-box #shadow-box-volume {
  position: absolute;
  top: 47.058824% !important;
  right: 0;
  bottom: auto;
  left: 0;
  appearance: none;
  width: 100%;
  height: 47.058824%;
  margin: 0;
  border: 2px solid #a97936;
  border-radius: 999px;
  background: linear-gradient(to right, #1e5791 0%, #0a2f64 var(--shadow-volume-percent), #030919 var(--shadow-volume-percent), #030919 100%);
  box-shadow: inset 0 0 0 1px rgba(236,202,127,.32), inset 0 2px 5px rgba(0,0,0,.9);
  opacity: 1;
  cursor: pointer;
}
.gps-opening-shadow-box #shadow-box-volume::-webkit-slider-runnable-track { height: 100%; background: transparent; }
.gps-opening-shadow-box #shadow-box-volume::-moz-range-track { height: 100%; background: transparent; }
.gps-opening-shadow-box #shadow-box-volume::-webkit-slider-thumb {
  appearance: none;
  width: clamp(8px, .625vw, 12px);
  height: 137.5%;
  margin-top: -3px;
  border: 1px solid #5e3b17;
  border-radius: 3px;
  background: linear-gradient(90deg, #8d642d, #f0d18b 50%, #8d642d);
  box-shadow: 0 1px 2px rgba(0,0,0,.7);
}
.gps-opening-shadow-box #shadow-box-volume::-moz-range-thumb {
  width: clamp(8px, .625vw, 12px);
  height: 137.5%;
  border: 1px solid #5e3b17;
  border-radius: 3px;
  background: linear-gradient(90deg, #8d642d, #f0d18b 50%, #8d642d);
  box-shadow: 0 1px 2px rgba(0,0,0,.7);
}
.gps-opening-shadow-box #shadow-box-mute[aria-pressed="true"] {
  border-color: #f2d18b !important;
  background: linear-gradient(180deg, #322415, #100b08) !important;
  box-shadow: inset 0 0 0 1px rgba(242,209,139,.42), 0 0 5px rgba(242,209,139,.42) !important;
}
.gps-opening-shadow-box #shadow-box-mute[aria-pressed="true"] .gps-shadow-speaker { filter: grayscale(1) brightness(.78); }
.gps-opening-shadow-box .gps-shadow-command-cgh {
  top: .694444%;
  left: 74.53125%;
  display: grid !important;
  width: 7.5%;
  height: 7.222222%;
  place-items: center;
  overflow: visible;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.gps-opening-shadow-box .gps-shadow-command-cgh img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: none;
  filter: drop-shadow(0 2px 2px rgba(0,0,0,.65));
}
body.is-opening-hub #feedback-open {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* The greeting occupies its final position from its first visible frame.
   The two choices wait below it and enter by opacity only, so their reveal
   never causes the greeting or buttons to jump. */
.gps-opening-shadow-box .gps-shadow-welcome {
  top: 25% !important;
  transform: translate(-50%, -50%) !important;
  transition: opacity 440ms ease !important;
}
.gps-opening-shadow-box .gps-shadow-welcome,
.gps-opening-shadow-box .gps-shadow-welcome span {
  font-size: clamp(58px, 4.7vw, 88px) !important;
  line-height: 1.02;
}
.gps-opening-shadow-box .gps-shadow-actions {
  top: 68% !important;
  width: 88% !important;
  gap: 4% !important;
  transform: translate(-50%, -50%) !important;
  transition: opacity 480ms ease !important;
}
.gps-opening-shadow-box #opening-select-mode,
.gps-opening-shadow-box #opening-inspect-fleet {
  min-height: clamp(76px, 9.8svh, 108px) !important;
  padding: .28em .42em !important;
  font-size: clamp(26px, 2.2vw, 42px) !important;
}

/* Lenny's supplied corrected sheet is the complete card face. The live layer
   adds only selection/focus treatment and the functional Classic-only switch. */
.gps-opening-shadow-box .gps-shadow-box-stage > .gps-mode-reveal {
  grid-template-rows: minmax(0, 1fr) auto !important;
  gap: 1% !important;
  padding: .6% 1.5% .8% !important;
  overflow: hidden !important;
}
.gps-opening-shadow-box .gps-select-mode-prompt {
  position: static !important;
  inset: auto !important;
  display: none !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #edf9ff;
  font-size: clamp(18px, 1.25vw, 24px) !important;
  line-height: 1;
  letter-spacing: .15em;
  text-align: center;
  transform: none !important;
}
.gps-opening-shadow-box .gps-mode-grid {
  position: static !important;
  display: grid !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
  gap: 2.2% 4% !important;
  align-items: stretch !important;
  align-self: stretch !important;
  overflow: visible !important;
}
.gps-opening-shadow-box .gps-mode-card-shell,
.gps-opening-shadow-box .gps-mode-card-shell.is-selected {
  position: relative !important;
  inset: auto !important;
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0;
  min-height: 0;
  align-self: stretch !important;
  justify-self: stretch !important;
  aspect-ratio: auto !important;
  place-items: center;
  overflow: visible !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}
.gps-opening-shadow-box .gps-mode-card-frame {
  position: relative;
  display: block;
  width: auto;
  max-width: 88%;
  height: 100%;
  aspect-ratio: 680 / 874;
  transition: filter 120ms ease, transform 120ms ease;
}
.gps-opening-shadow-box .gps-mode-card {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-width: 0;
  min-height: 0;
  aspect-ratio: 680 / 874 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  box-shadow: 0 4px 10px rgba(0,0,0,.48) !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}
.gps-opening-shadow-box .gps-mode-card > img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  max-height: 100% !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: 50% 50% !important;
  border-radius: 8px;
  opacity: 1;
  filter: none;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .72);
}
.gps-opening-shadow-box .gps-mode-card-footer {
  position: absolute;
  z-index: 4;
  right: 25%;
  bottom: 4.4%;
  left: 42%;
  display: flex;
  height: 5.6%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  overflow: hidden;
  background: #071b32;
  color: #efd6a4;
  font-family: var(--gps-font-terminal);
  font-size: clamp(5px, .32vw, 6.5px) !important;
  font-weight: 700;
  line-height: .9;
  letter-spacing: .02em;
  white-space: nowrap;
  text-align: center;
  text-shadow: 0 1px 1px #000;
  box-shadow: 0 0 2px 1px #071b32;
  pointer-events: none;
}
.gps-opening-shadow-box .gps-mode-card-footer > span {
  font: inherit !important;
  line-height: inherit !important;
}
.gps-opening-shadow-box .gps-mode-card.has-runtime-footer::before {
  position: absolute;
  z-index: 3;
  right: 25%;
  bottom: 4.4%;
  left: 42%;
  display: block;
  height: 5.6%;
  border: 0;
  background: #071b32;
  box-shadow: 0 0 2px 1px #071b32;
  content: "";
  pointer-events: none;
}
.gps-opening-shadow-box .gps-mode-selection-cue {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}
.gps-opening-shadow-box .gps-mode-card-shell.is-selected .gps-mode-card {
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}
.gps-opening-shadow-box .gps-mode-card-shell.is-selected .gps-mode-card > img {
  box-shadow: none;
}
.gps-opening-shadow-box .gps-mode-card-shell.is-selected .gps-mode-card-frame {
  filter: drop-shadow(0 0 2px #ffffff) drop-shadow(0 0 11px rgba(244, 216, 147, .95));
  transform: translateY(-2px) scale(1.025);
}
.gps-opening-shadow-box .gps-mode-card-shell.is-selected .gps-mode-selection-cue {
  visibility: hidden;
  opacity: 0;
}
.gps-opening-shadow-box .gps-mode-card:focus-visible {
  outline: 3px solid #ffffff !important;
  outline-offset: 2px !important;
}

/* The supplied Classic face includes the Chain Fire name and rule. This live
   control occupies its blank switch well without covering that artwork. */
.gps-opening-shadow-box .gps-chain-fire-card-control {
  position: absolute !important;
  z-index: 12;
  top: 78% !important;
  left: 12% !important;
  display: block !important;
  width: 28% !important;
  height: 14% !important;
  padding: 0;
  border: 0 !important;
  background: transparent !important;
  color: #f1d39a;
  cursor: pointer;
}
.gps-opening-shadow-box .gps-chain-fire-card-control[hidden] { display: none !important; }
.gps-opening-shadow-box .gps-chain-fire-card-control input {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  opacity: 0 !important;
  cursor: pointer;
}
.gps-opening-shadow-box .gps-chain-fire-switch {
  display: none !important;
}
.gps-opening-shadow-box .gps-chain-fire-state {
  position: absolute !important;
  top: 25% !important;
  left: 13% !important;
  display: grid !important;
  width: 58% !important;
  height: 50% !important;
  place-items: center;
  padding: 0 !important;
  border: 1px solid #c9a875 !important;
  border-radius: 4px !important;
  background: rgba(6, 18, 40, .96) !important;
  color: #d9e5ed;
  font-family: var(--gps-font-terminal);
  font-size: clamp(8px, .52vw, 10px) !important;
  line-height: 1;
  text-align: center;
  box-shadow: inset 0 0 4px rgba(0,0,0,.9);
}
.gps-opening-shadow-box .gps-chain-fire-state::before,
.gps-opening-shadow-box .gps-chain-fire-state::after { display: none !important; }
.gps-opening-shadow-box .gps-chain-fire-card-control.is-enabled {
  background: transparent !important;
  box-shadow: none !important;
}
.gps-opening-shadow-box .gps-chain-fire-card-control.is-enabled .gps-chain-fire-state {
  border-color: #f4d893 !important;
  background: rgba(10, 73, 115, .98) !important;
  color: #ffffff;
  box-shadow: inset 0 0 5px rgba(255,255,255,.24), 0 0 6px rgba(244,216,147,.65);
}
.gps-opening-shadow-box .gps-chain-fire-card-control:has(input:focus-visible) {
  outline: 2px solid #ffffff;
  outline-offset: -2px;
}

.gps-opening-shadow-box .gps-mode-selection-actions {
  display: grid !important;
  min-height: clamp(62px, 7svh, 76px) !important;
  grid-template-columns: 18% minmax(0, 1fr) 27% !important;
  gap: 1.5% !important;
}
.gps-opening-shadow-box .gps-mode-selection-actions button {
  min-height: 82% !important;
  align-self: end;
  padding: .22em .35em !important;
  font-size: clamp(15px, 1.05vw, 20px) !important;
}
.gps-opening-shadow-box .gps-mode-selection-actions .gps-mode-confirm {
  min-height: 100% !important;
  font-size: clamp(20px, 1.45vw, 28px) !important;
  white-space: normal !important;
}

/* Lenny's narrow Map Room correction: DEPLOY is the unambiguous primary
   action; all four controls remain below the unchanged 24 × 16 grid. */
#map-room-auto-arrange,
#map-room-rotate,
#map-room-back {
  top: 58.5% !important;
  height: 6.5% !important;
  font-size: clamp(18px, 1.15vw, 22px) !important;
}
#map-room-auto-arrange { left: 23.5% !important; width: 14.5% !important; }
#map-room-rotate { left: 39.2% !important; width: 11.6% !important; }
#map-room-deploy {
  top: 57.5% !important;
  left: 52% !important;
  width: 17.8% !important;
  height: 9% !important;
  border-width: 3px !important;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.3), 0 0 24px rgba(168, 218, 255, .55) !important;
}
#map-room-deploy > strong {
  font-size: clamp(30px, 2.4vw, 46px) !important;
  line-height: 1 !important;
  letter-spacing: .06em;
}
#map-room-back { left: 71% !important; width: 9.5% !important; }

@media (max-height: 820px) and (min-width: 900px) {
  .gps-opening-shadow-box .gps-shadow-welcome,
  .gps-opening-shadow-box .gps-shadow-welcome span { font-size: clamp(52px, 4.4vw, 66px) !important; }
  .gps-opening-shadow-box #opening-select-mode,
  .gps-opening-shadow-box #opening-inspect-fleet { min-height: 74px !important; font-size: clamp(26px, 2.15vw, 34px) !important; }
  .gps-opening-shadow-box .gps-mode-selection-actions { min-height: 62px !important; }
}

/* Opening-film continuity lock: the loop and post-BEGIN film occupy one
   centered 16:9 stage from the first frame onward. This removes the visible
   width drop on BEGIN without any guessed pixel crop. The post-BEGIN film
   keeps its complete supplied frame, and live controls remain mounted over
   its baked rail. */
.gps-opening-video-cloaked,
.gps-opening-video-post {
  inset: auto !important;
  top: 50% !important;
  left: 50% !important;
  width: min(100vw, 177.7778svh) !important;
  height: min(100svh, 56.25vw) !important;
  object-position: center !important;
  transform: translate(-50%, -50%);
}

.gps-opening-video-cloaked { object-fit: cover !important; }
.gps-opening-video-post { object-fit: fill !important; }

.gps-opening-cinematic:not([data-phase="hub"]) .gps-opening-shadow-box {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.gps-opening-cinematic[data-phase="hub"] .gps-opening-shadow-box {
  display: block !important;
}

.gps-opening-video-controls {
  --opening-volume-percent: 65%;
  --opening-blue-top: #174778;
  --opening-blue-mid: #0d315e;
  --opening-blue-deep: #06162f;
  inset: auto !important;
  top: 50% !important;
  left: 50% !important;
  width: min(100vw, 177.7778svh) !important;
  height: min(100svh, 56.25vw) !important;
  transform: translate(-50%, -50%);
}
.gps-opening-video-controls::before {
  position: absolute;
  z-index: 0;
  top: .972222%;
  left: 51.875%;
  width: 12.34375%;
  height: 5.833333%;
  border: 1px solid #3b240d;
  border-radius: 8px;
  background: linear-gradient(135deg, #4a2d11 0%, #a87531 12%, #efd28c 23%, #6d461c 39%, #c69648 57%, #f0d18a 72%, #71481c 87%, #3d250e 100%);
  box-shadow: 0 3px 5px rgba(0,0,0,.64), 0 0 0 1px rgba(233,195,113,.36), inset 0 1px 1px rgba(255,241,196,.5), inset 0 -2px 2px rgba(26,13,4,.74);
  content: "";
  pointer-events: none;
}
.gps-opening-video-controls::after {
  position: absolute;
  z-index: 1;
  top: 1.527778%;
  left: 52.1875%;
  width: 11.71875%;
  height: 4.722222%;
  border: 1px solid rgba(239,204,128,.86);
  border-radius: 4px;
  background: radial-gradient(ellipse at 50% 4%, rgba(91,148,207,.28), transparent 48%), linear-gradient(180deg, var(--opening-blue-top), var(--opening-blue-mid) 46%, var(--opening-blue-deep));
  box-shadow: inset 0 0 0 2px rgba(1,7,18,.82), inset 0 1px 8px rgba(146,205,255,.18), inset 0 -4px 8px rgba(0,0,0,.44);
  content: "";
  pointer-events: none;
}
.gps-opening-video-controls > :is(button, label, a):not(#opening-video-skip) {
  position: absolute !important;
  z-index: 3;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
  pointer-events: auto;
}
#opening-video-achievements,
#opening-video-feedback {
  top: .972222% !important;
  height: 5.833333% !important;
  padding: 3px !important;
  overflow: hidden;
  border: 1px solid #3b240d !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #4a2d11 0%, #a87531 12%, #efd28c 23%, #6d461c 39%, #c69648 57%, #f0d18a 72%, #71481c 87%, #3d250e 100%) !important;
  color: #f2d18b !important;
  box-shadow: 0 3px 5px rgba(0,0,0,.64), 0 0 0 1px rgba(233,195,113,.36), inset 0 1px 1px rgba(255,241,196,.5), inset 0 -2px 2px rgba(26,13,4,.74) !important;
  font-family: Rockwell, "Rockwell Extra Bold", Georgia, serif !important;
  font-size: clamp(13px, 1.25vw, 24px) !important;
  font-weight: 800;
  letter-spacing: .25px;
  text-shadow: 0 2px 1px #100904;
}
#opening-video-achievements { left: 31.09375% !important; width: 14.21875% !important; }
#opening-video-feedback { left: 64.84375% !important; width: 9.0625% !important; }
#opening-video-achievements::before,
#opening-video-feedback::before {
  position: absolute;
  z-index: 0;
  inset: 4px;
  border: 1px solid rgba(239,204,128,.86);
  border-radius: 4px;
  background: radial-gradient(ellipse at 50% 4%, rgba(91,148,207,.28), transparent 48%), linear-gradient(180deg, var(--opening-blue-top), var(--opening-blue-mid) 46%, var(--opening-blue-deep));
  box-shadow: inset 0 0 0 2px rgba(1,7,18,.82), inset 0 1px 8px rgba(146,205,255,.18), inset 0 -4px 8px rgba(0,0,0,.44);
  content: "";
  pointer-events: none;
}
#opening-video-achievements,
#opening-video-feedback { isolation: isolate; }
.gps-opening-film-label {
  position: relative;
  z-index: 1;
  display: block;
  color: inherit;
}
#opening-video-mute {
  top: 3.055556% !important;
  right: auto !important;
  left: 52.421875% !important;
  width: 3.828125% !important;
  height: 2.916667% !important;
  padding: 0 !important;
  border: 1px solid #b6873e !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #102b52, #06142d) !important;
  color: #ebca82 !important;
  box-shadow: inset 0 0 0 1px rgba(2,7,17,.82) !important;
  font-family: Rockwell, Georgia, serif !important;
  font-size: clamp(7px, .625vw, 12px) !important;
  font-weight: 800;
}
#opening-video-mute[aria-pressed="true"] {
  border-color: #f2d18b !important;
  background: linear-gradient(180deg, #322415, #100b08) !important;
}
.gps-opening-video-controls > label {
  top: 1.527778% !important;
  right: auto !important;
  left: 56.640625% !important;
  display: block !important;
  width: 7.109375% !important;
  min-width: 0 !important;
  height: 4.722222% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #efd08b !important;
}
.gps-opening-video-controls > label > span {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 41.176471%;
  color: #efd08b !important;
  font-family: Rockwell, Georgia, serif !important;
  font-size: clamp(7px, .625vw, 12px) !important;
  font-weight: 800;
  line-height: 1;
  text-align: center;
  text-shadow: 0 1px 1px #000;
}
#opening-video-volume {
  position: absolute;
  top: 47.058824% !important;
  right: 0;
  bottom: auto;
  left: 0;
  appearance: none;
  width: 100% !important;
  height: 47.058824% !important;
  min-height: 0 !important;
  margin: 0;
  border: 2px solid #a97936;
  border-radius: 999px;
  background: linear-gradient(to right, #1e5791 0%, #0a2f64 var(--opening-volume-percent), #030919 var(--opening-volume-percent), #030919 100%);
  box-shadow: inset 0 0 0 1px rgba(236,202,127,.32), inset 0 2px 5px rgba(0,0,0,.9);
  opacity: 1;
  cursor: pointer;
}
#opening-video-volume::-webkit-slider-runnable-track { height: 100%; background: transparent; }
#opening-video-volume::-moz-range-track { height: 100%; background: transparent; }
#opening-video-volume::-webkit-slider-thumb {
  appearance: none;
  width: clamp(8px, .625vw, 12px);
  height: 137.5%;
  margin-top: -3px;
  border: 1px solid #5e3b17;
  border-radius: 3px;
  background: linear-gradient(90deg, #8d642d, #f0d18b 50%, #8d642d);
  box-shadow: 0 1px 2px rgba(0,0,0,.7);
}
#opening-video-volume::-moz-range-thumb {
  width: clamp(8px, .625vw, 12px);
  height: 137.5%;
  border: 1px solid #5e3b17;
  border-radius: 3px;
  background: linear-gradient(90deg, #8d642d, #f0d18b 50%, #8d642d);
  box-shadow: 0 1px 2px rgba(0,0,0,.7);
}
#opening-video-cgh {
  top: .694444% !important;
  left: 74.53125% !important;
  display: grid !important;
  width: 7.5% !important;
  height: 7.222222% !important;
  place-items: center;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
#opening-video-cgh img { display: block; width: 100%; height: 100%; object-fit: contain; }
.gps-opening-video-controls > :is(button, label, a):not(#opening-video-skip):focus-visible,
.gps-opening-video-controls > label:focus-within {
  outline: 3px solid #fff2bf !important;
  outline-offset: 2px;
}
body.is-opening-post #feedback-open,
body.is-opening-shadow-bridge #feedback-open {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
/* Approved 2026-08-28 combat-page visual correction. The tactical overview
   owns the complete responsive bay between the viewport edge and targeting
   board, while its live 24 x 16 grid always retains square-cell proportions. */
.match-page-v2 {
  --combat-shell-inset: clamp(9px, .85vw, 18px);
  --combat-shell-gap: clamp(8px, .65vw, 13px);
}

.match-page-v2 .enemy-horizon::after {
  display: none !important;
  content: none !important;
}

.match-page-v2 .battle-brand-art {
  top: 0;
  left: clamp(-76px, -3.3vw, -44px);
  width: auto;
  height: calc(var(--horizon-height) * 1.15);
  object-fit: contain;
  object-position: 0 0;
  transform: none;
}

.match-page-v2 .combat-left-rail {
  grid-template-rows: auto minmax(0, 1fr);
}

.match-page-v2 .combat-left-rail > .tactical-panel {
  position: relative;
  top: auto;
  bottom: auto;
  left: calc(var(--combat-shell-inset) * -1);
  width: calc(
    100%
    + var(--combat-shell-inset)
    + var(--combat-shell-gap)
  ) !important;
  height: auto;
  padding: clamp(7px, .55vw, 10px) clamp(5px, .4vw, 8px) !important;
  margin: clamp(26px, 4svh, 44px) 0 0;
  align-self: start;
  overflow: hidden;
}

.match-page-v2 .tactical-panel .mini-map {
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: 24 / 16;
}

/* The overview is a tactical plot, not a second ship-art gallery. Its own-force
   contacts come directly from each live rotated cell mask, preserving all seven
   tetrimino silhouettes and the Dreadnought's separate 2 x 5 footprint. */
.match-page-v2 .mini-formation-layer {
  z-index: 1;
  overflow: hidden;
}

.match-page-v2 .mini-tetrimino {
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .82));
}

.match-page-v2 .mini-tetrimino-cell {
  position: absolute;
  display: block;
  box-sizing: border-box;
  width: calc(100% / var(--mini-formation-cols));
  height: calc(100% / var(--mini-formation-rows));
  border: 1px solid rgba(220, 235, 243, .76);
  border-radius: 8%;
  background: linear-gradient(145deg, #d4e1e6 0 12%, #8fa7b5 38%, #536e82 68%, #263d52 100%);
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, .38), inset -1px -1px 1px rgba(0, 10, 24, .62);
}

.match-page-v2 .mini-tetrimino.is-burning .mini-tetrimino-cell {
  border-color: #f0b05d;
  background: linear-gradient(145deg, #ddb679, #aa583d 52%, #5d2929);
}

.match-page-v2 .mini-tetrimino.is-charred .mini-tetrimino-cell {
  border-color: #776b61;
  background: linear-gradient(145deg, #5b5b58, #302e2c 58%, #151719);
}

/* Combat feedback uses the same upper-right utility placement as the other
   pages. Pulling it out of the command grid lets PAUSE own the full row. */
.match-page-v2 #combat-feedback-open {
  position: fixed;
  z-index: 71;
  top: clamp(9px, 1svh, 14px);
  right: calc(
    clamp(12px, 1.25vw, 24px)
    + clamp(175px, 12vw, 230px)
    + clamp(10px, 1vw, 18px)
  );
  width: clamp(140px, 10vw, 190px);
  min-height: 52px;
  grid-column: auto;
  grid-row: auto;
}

.match-page-v2 .combat-pause-toggle { grid-column: 1 / -1; }

/* 2026-08-28 foreground presentation refinements. The ship artwork remains a
   separate transparent layer; a small responsive shift reveals more of the
   stern without changing the targeting grid geometry. The launcher overlay is
   vertically foreshortened to follow the photographed deck perspective. */
.match-page-v2 .flagship-artboard {
  left: -9%;
  width: 118%;
}

.match-page-v2 .flagship-artboard .player-missile-battery {
  top: 44.85%;
  left: 65.05%;
  width: 5.65%;
  transform: translateY(16%) scaleY(.58);
  transform-origin: 50% 100%;
}

.match-page-v2 .flagship-artboard .player-missile-battery i {
  border-radius: 34%;
}

/* 2026-08-29 D-89 upgrade. The ship, its live missile battery, and both VTOL
   rotors share one local artboard, so none of the equipment can remain behind
   when the flagship moves or scales. */
.match-page-v2 .flagship-artboard {
  left: -7%;
  width: 114%;
  aspect-ratio: 1676 / 938;
  transform: translateY(clamp(-58px, -5.3svh, -36px));
}

.match-page-v2 .flagship-artboard .command-ship {
  object-fit: contain;
  filter: brightness(.88) contrast(1.07) saturate(.72) drop-shadow(0 13px 10px rgba(0,0,0,.7));
  transform: none;
}

/* The four animated hatches sit directly on the visible starboard launcher
   bank instead of retaining the retired carrier's absolute screen position. */
.match-page-v2 .flagship-artboard .player-missile-battery {
  top: 48.6%;
  left: 73.15%;
  width: 4.8%;
  transform: rotate(1.5deg) scaleY(.72);
  transform-origin: 50% 50%;
}

.match-page-v2 .flagship-artboard .flagship-vtol-rotor {
  position: absolute;
  z-index: 14;
  display: block;
  overflow: hidden;
  border-radius: 50%;
  opacity: .88;
  pointer-events: none;
  mix-blend-mode: screen;
  transform-origin: 50% 50%;
}

.match-page-v2 .flagship-artboard .flagship-vtol-rotor-a {
  top: 53.35%;
  left: 8.05%;
  width: 4.45%;
  aspect-ratio: 1.62;
  transform: rotate(4deg);
}

.match-page-v2 .flagship-artboard .flagship-vtol-rotor-b {
  top: 55.8%;
  left: 16.05%;
  width: 4.7%;
  aspect-ratio: 1.58;
  transform: rotate(8deg);
}

.match-page-v2 .flagship-artboard .flagship-vtol-rotor > i {
  position: absolute;
  inset: -34%;
  display: block;
  border-radius: 50%;
  background:
    radial-gradient(circle, #c4cbcd 0 4%, #12191e 5% 12%, transparent 13%),
    conic-gradient(from 8deg,
      transparent 0 7%, rgba(218, 228, 231, .82) 8% 14%, transparent 15% 32%,
      rgba(204, 217, 221, .72) 33% 40%, transparent 41% 57%,
      rgba(218, 228, 231, .78) 58% 65%, transparent 66% 82%,
      rgba(204, 217, 221, .7) 83% 90%, transparent 91%);
  filter: blur(.25px);
  animation: ducted-rotor-spin .18s linear infinite;
}

.match-page-v2 .flagship-artboard .flagship-vtol-rotor-b > i {
  animation-duration: .21s;
  animation-direction: reverse;
}

body[data-combat-paused="true"] .match-page-v2 .flagship-vtol-rotor > i {
  animation-play-state: paused !important;
}

@media (prefers-reduced-motion: reduce) {
  .match-page-v2 .flagship-artboard .flagship-vtol-rotor > i {
    animation: none !important;
    transform: rotate(18deg);
  }
}

/* The enemy launch is already readable at ignition. This short, localized
   double bloom calls out the larger acceleration handoff without washing out
   the battlefield or changing missile timing. */
.missile-acceleration-flash {
  position: fixed;
  z-index: 102;
  width: clamp(30px, 2.8vw, 54px);
  aspect-ratio: 1;
  pointer-events: none;
  transform: translate(-50%, -50%);
  animation: gps-enemy-acceleration-flash 420ms cubic-bezier(.12,.72,.28,1) both;
}

.missile-acceleration-flash > i {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: radial-gradient(circle, #fff 0 7%, #fff5bd 13%, #ffb22f 30%, rgba(255,69,12,.62) 49%, transparent 72%);
  box-shadow: 0 0 10px #fff7bf, 0 0 25px rgba(255,153,24,.92), 0 0 44px rgba(255,65,8,.68);
}

.missile-acceleration-flash > i:last-child {
  inset: 39% -44%;
  border-radius: 50%;
  background: linear-gradient(90deg, transparent, rgba(255,246,188,.96) 42% 58%, transparent);
  filter: blur(1px);
}

@keyframes gps-enemy-acceleration-flash {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.18); }
  17% { opacity: 1; transform: translate(-50%, -50%) scale(1.08); }
  42% { opacity: .88; transform: translate(-50%, -50%) scale(.78); }
  100% { opacity: 0; transform: translate(-50%, -58%) scale(.32); }
}

@media (prefers-reduced-motion: reduce) {
  .missile-acceleration-flash {
    animation-duration: 180ms;
  }
}

@media (max-width: 1440px) {
  .match-page-v2 .flagship-artboard {
    left: -7%;
  }
}

/* Each escort and its radar share one local artboard. That preserves the exact
   source-image radar pivot when a vessel scales or rotates responsively. */
.match-page-v2 .combat-command-ship .combat-escort-vessel {
  position: absolute;
  pointer-events: none;
  transform-origin: 50% 50%;
}

.match-page-v2 .combat-command-ship .combat-patrol-vessel {
  z-index: 3;
  top: 5%;
  left: 35%;
  width: 40%;
  aspect-ratio: 369 / 200;
  transform: rotate(-3deg);
}

.match-page-v2 .combat-command-ship .combat-destroyer-vessel {
  z-index: 5;
  right: auto;
  bottom: 6%;
  left: 2%;
  width: 75%;
  aspect-ratio: 603 / 168;
  transform: rotate(-1.5deg);
}

.match-page-v2 .combat-command-ship .combat-destroyer {
  opacity: .88;
  filter: brightness(.68) contrast(1.09) saturate(.58) drop-shadow(0 8px 6px rgba(0,0,0,.75));
}

.match-page-v2 .combat-command-ship .combat-corvette-vessel {
  z-index: 6;
  right: -6%;
  bottom: 25%;
  left: auto;
  width: 60%;
  aspect-ratio: 1729 / 593;
  transform: rotate(-2deg);
}

.match-page-v2 .combat-command-ship .combat-corvette {
  opacity: .9;
  filter: brightness(.72) contrast(1.08) saturate(.62) drop-shadow(0 8px 6px rgba(0,0,0,.74));
}

/* Three compact T-bar arrays mount directly on the visible masts of the
   patrol boat, destroyer, and corvette. Perspective rotation foreshortens the
   bar as it turns instead of making it spin like a flat clock hand. */
.match-page-v2 .combat-command-ship .ship-radar {
  position: absolute;
  z-index: 10;
  display: block;
  height: clamp(5px, .65svh, 8px);
  pointer-events: none;
  perspective: 44px;
  transform: translate(-50%, -100%);
  transform-origin: 50% 100%;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.9));
}

.match-page-v2 .combat-command-ship .ship-radar::before {
  position: absolute;
  bottom: 0;
  left: calc(50% - 1px);
  width: 2px;
  height: 65%;
  border-radius: 1px;
  background: linear-gradient(#b8c0bc, #515a5b);
  content: "";
}

.match-page-v2 .combat-command-ship .ship-radar::after {
  position: absolute;
  bottom: -1px;
  left: 50%;
  width: 4px;
  height: 3px;
  border-radius: 50%;
  background: #747d7c;
  box-shadow: 0 0 1px #050708;
  content: "";
  transform: translateX(-50%);
}

.match-page-v2 .combat-command-ship .ship-radar > i {
  position: absolute;
  top: 4%;
  left: 0;
  display: block;
  width: 100%;
  height: 24%;
  min-height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, #41494b, #d6d9cc 17% 48%, #646c6c 58%, #c3c9c2);
  box-shadow: 0 0 2px rgba(211,226,220,.55);
  animation: gps-ship-radar-sweep 1.18s linear infinite;
  transform-origin: 50% 50%;
}

.match-page-v2 .combat-command-ship .ship-radar-patrol {
  top: 15.25%;
  left: 51.76%;
  width: 11%;
}

.match-page-v2 .combat-command-ship .ship-radar-destroyer {
  top: 15.476%;
  left: 47.098%;
  width: 8%;
}

.match-page-v2 .combat-command-ship .ship-radar-corvette {
  top: 11.804%;
  left: 56.102%;
  width: 8%;
}

@keyframes gps-ship-radar-sweep {
  to { transform: rotateY(1turn); }
}

/* MUSIC and SFX are deliberately independent. Each row keeps a true 44px
   interaction target and the short-desktop command rail gains enough space
   to show both controls without covering combat status. */
.match-page-v2 .combat-command-panel {
  grid-template-rows: auto auto auto minmax(96px, 1fr);
}

.match-page-v2 .combat-right-rail {
  grid-template-rows: 292px 150px minmax(0, 1fr);
}

.match-page-v2 .battle-audio-console {
  min-height: 96px;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: repeat(2, minmax(44px, 1fr));
  gap: 4px;
  padding: 4px 6px;
}

.match-page-v2 .battle-audio-console > .battle-audio-row {
  display: grid;
  min-width: 0;
  min-height: 44px;
  grid-column: 1;
  grid-template-columns: minmax(76px, .62fr) minmax(82px, .66fr) minmax(90px, 1.72fr);
  align-items: center;
  gap: 6px;
}

.match-page-v2 .battle-audio-console > .battle-music-row { grid-row: 1; }
.match-page-v2 .battle-audio-console > .battle-sfx-row { grid-row: 2; }
.match-page-v2 .battle-audio-name {
  display: grid;
  min-width: 0;
  gap: 1px;
}
.match-page-v2 .battle-audio-name output { color: #dbe8ec; }
.match-page-v2 .battle-audio-row .battle-mute-control,
.match-page-v2 .battle-audio-row .battle-volume-control {
  grid-column: auto;
  grid-row: auto;
}
.match-page-v2 .battle-audio-row .battle-mute-control {
  min-width: 82px;
  min-height: 44px;
  padding-inline: 5px;
  font-size: 18px !important;
}
.match-page-v2 .battle-audio-row .battle-volume-control {
  min-width: 0;
  min-height: 44px !important;
  grid-template-columns: minmax(0, 1fr);
}

body[data-combat-paused="true"] .match-page-v2 .ship-radar > i {
  animation-play-state: paused !important;
}

@media (max-height: 820px) and (min-width: 900px) {
  .match-page-v2 .combat-right-rail {
    grid-template-rows: 274px 140px minmax(185px, 1fr);
  }

  .match-page-v2 .battle-audio-console {
    min-height: 96px;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: repeat(2, minmax(44px, 1fr));
  }

  .match-page-v2 .battle-audio-console > .battle-audio-row {
    grid-column: 1;
    grid-template-columns: minmax(76px, .62fr) minmax(82px, .66fr) minmax(90px, 1.72fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  .match-page-v2 .ship-radar > i {
    animation: none;
  }
}

/* ========================================================================== */
/* 2026-08-28 CRT MODE + MAP AUTHORITY                                        */
/* One source-derived transparent foreground is shared by every cabinet state. */
/* ========================================================================== */

.gps-shadow-diorama-foreground,
.gps-shadow-diorama-overlap,
.map-room-knight-foreground {
  display: none !important;
}

.gps-shared-foreground-occlusion {
  position: absolute;
  z-index: 30;
  inset: 0;
  display: block;
  background: url("./assets/opening/gps_shadow_box_foreground_occlusion_2026-08-28.png") 0 0 / 100% 100% no-repeat;
  pointer-events: none;
}

/* Mode selection stays completely inside the mock CRT. */
.gps-shadow-box-stage > .gps-mode-reveal {
  z-index: 8 !important;
  top: 9.25% !important;
  left: 22.55% !important;
  display: grid !important;
  width: 58.3% !important;
  height: 58.68% !important;
  grid-template-columns: 27.2% minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  gap: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(225, 246, 255, .84);
  background: rgba(4, 27, 63, .94) !important;
  box-shadow: inset 0 0 28px rgba(83, 167, 232, .12);
  color: #f2f9ff;
  font-family: var(--gps-font-terminal) !important;
}

.gps-shadow-box-stage > .gps-mode-reveal[hidden] { display: none !important; }
.gps-shadow-box-stage > .gps-mode-reveal .gps-select-mode-prompt { display: none !important; }

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-grid {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: .7% !important;
  padding: .7% !important;
  border-left: 2px solid rgba(235, 247, 255, .88);
  background: rgba(4, 25, 58, .9);
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card-shell,
.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card-shell.is-selected {
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  place-items: center !important;
  transform: none !important;
  opacity: 1 !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card-frame {
  width: 96%;
  height: 97%;
  min-height: 0;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card,
.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card.is-selected,
.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card.is-prev,
.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card.is-next,
.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card.is-far {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 2px solid rgba(195, 216, 225, .48) !important;
  border-radius: 3.8% !important;
  background: #061a32 !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .68) !important;
  transform: none !important;
  opacity: 1 !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card > img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
  filter: brightness(.9) saturate(.88) !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card:hover,
.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card:focus-visible {
  border-color: #f8edc5 !important;
  outline: 2px solid #f5f9ff !important;
  outline-offset: -2px !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card-shell.is-selected .gps-mode-card {
  border: 4px solid #f1b91f !important;
  box-shadow: 0 0 0 2px rgba(255, 246, 193, .94), 0 0 16px rgba(255, 188, 31, .68) !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-card-shell.is-selected .gps-mode-card > img {
  filter: brightness(1.06) saturate(1.02) !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-selection-cue { display: none !important; }

.gps-shadow-box-stage > .gps-mode-reveal .gps-classic::before {
  position: absolute;
  z-index: 8;
  top: 2.2%;
  right: 4%;
  padding: .2em .45em;
  border: 1px solid rgba(255, 229, 150, .9);
  border-radius: 999px;
  background: rgba(4, 31, 65, .9);
  color: #ffe49b;
  content: "RECOMMENDED";
  font: 400 clamp(6px, .45vw, 9px)/1 var(--gps-font-terminal);
  letter-spacing: .03em;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-chain-fire-card-control {
  z-index: 10;
  bottom: 3.8% !important;
  left: 13% !important;
  width: 74% !important;
  height: 9% !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-selection-actions {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: 34% 14% 28% 12% 12% !important;
  gap: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: linear-gradient(180deg, rgba(18, 54, 105, .98), rgba(5, 27, 67, .98));
}

.gps-mode-rail-heading,
.gps-mode-current-selection {
  display: grid;
  min-width: 0;
  min-height: 0;
  place-content: center;
  margin: 0;
  border-bottom: 2px solid rgba(237, 247, 255, .92);
  text-align: center;
  text-shadow: 0 0 6px rgba(210, 240, 255, .42);
}

.gps-mode-rail-heading span { display: block; }
.gps-mode-rail-heading { font-size: clamp(23px, 2.9vw, 49px); line-height: 1.12; letter-spacing: .035em; }
.gps-mode-current-selection { gap: .25em; padding: 4%; }
.gps-mode-current-selection span { font-size: clamp(10px, 1vw, 17px); }
.gps-mode-current-selection strong {
  overflow: hidden;
  font-size: clamp(15px, 1.45vw, 25px);
  font-weight: 400;
  text-decoration: underline;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-selection-actions button,
.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-selection-actions .gps-mode-confirm {
  position: static !important;
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: .25em .45em !important;
  place-items: center !important;
  border: 0 !important;
  border-bottom: 2px solid rgba(237, 247, 255, .92) !important;
  border-radius: 0 !important;
  background: rgba(7, 35, 80, .28) !important;
  color: #f2f9ff !important;
  font: 400 clamp(12px, 1.4vw, 23px)/1.12 var(--gps-font-terminal) !important;
  text-shadow: 0 0 6px rgba(213, 241, 255, .44) !important;
  white-space: normal !important;
  box-shadow: none !important;
  transform: none !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-selection-actions .gps-mode-confirm {
  border: 3px solid #f3f8ff !important;
  border-radius: 19% / 26% !important;
  font-size: clamp(19px, 2vw, 34px) !important;
  line-height: 1.15 !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-selection-actions button:hover,
.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-selection-actions button:focus-visible {
  z-index: 2;
  outline: 2px solid #fff !important;
  outline-offset: -4px !important;
  background: rgba(33, 91, 148, .48) !important;
}

.gps-classic-recommendation {
  position: absolute;
  z-index: 50;
  top: 50%;
  left: 50%;
  display: grid;
  width: min(72%, 520px);
  min-height: 48%;
  align-content: center;
  gap: 8%;
  padding: 5% 7%;
  border: 3px double #f3f9ff;
  background: linear-gradient(180deg, #123b73, #071d45);
  color: #f3faff;
  text-align: center;
  text-shadow: 0 0 7px rgba(205, 239, 255, .46);
  box-shadow: 0 0 0 999px rgba(1, 9, 24, .68), 0 0 26px rgba(127, 207, 255, .42);
  transform: translate(-50%, -50%);
}

.gps-classic-recommendation[hidden] { display: none !important; }
.gps-classic-recommendation p { margin: 0; font-size: clamp(13px, 1.35vw, 23px); }
.gps-classic-recommendation h3 { margin: 0; font-size: clamp(24px, 2.6vw, 43px); font-weight: 400; }
.gps-classic-recommendation > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8%; }
.gps-classic-recommendation button {
  min-height: clamp(44px, 7svh, 68px);
  border: 2px solid #eff9ff;
  border-radius: 12px;
  background: #123b73;
  color: #fff;
  font: 400 clamp(18px, 1.8vw, 30px)/1 var(--gps-font-terminal);
}
.gps-classic-recommendation button:focus-visible { outline: 3px solid #ffd66f; outline-offset: 3px; }

/* Map Room: same 16:9 cabinet and the same foreground asset. */
.map-room-stage {
  --map-room-grid-line: rgba(163, 213, 235, .43);
  --map-room-grid-hot: rgba(210, 239, 248, .82);
  width: min(100vw, calc(100svh * 16 / 9)) !important;
  aspect-ratio: 16 / 9 !important;
  overflow: hidden !important;
  background: #020915 !important;
}

.map-room-decorated-background,
.imagination-map-room-shell {
  content: url("./assets/opening/gps_adopted_strike_arrival_frame_v1.png") !important;
  z-index: 0 !important;
  object-fit: fill !important;
}

.map-room-top-controls {
  position: absolute;
  z-index: 20;
  inset: 0;
  color: #f7d683;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 800;
  pointer-events: none;
}

.map-room-top-controls > button,
.map-room-top-controls > a,
.map-room-panel-audio {
  position: absolute;
  display: grid;
  min-width: 0;
  min-height: 0;
  place-items: center;
  border: 2px solid #a26f23;
  border-radius: 8px;
  background: linear-gradient(180deg, #154d82, #05254e 72%);
  color: #f6d883;
  font: 800 clamp(10px, 1.25vw, 21px)/1 Georgia, "Times New Roman", serif;
  text-shadow: 0 1px 1px #00122b;
  box-shadow: inset 0 0 0 2px rgba(255, 219, 116, .22), 0 2px 4px rgba(0, 0, 0, .65);
  pointer-events: auto;
}

.map-room-top-controls > button:hover,
.map-room-top-controls > button:focus-visible,
.map-room-top-controls > a:focus-visible {
  outline: 2px solid #fff2bd;
  outline-offset: 2px;
  filter: brightness(1.15);
}

.map-room-top-home { top: 1.25%; left: 21.65%; width: 9%; height: 6.15%; }
.map-room-top-achievements { top: 1.25%; left: 31.1%; width: 14.4%; height: 6.15%; }
.map-room-top-feedback { top: 1.25%; left: 65%; width: 8.95%; height: 6.15%; }

.map-room-top-controls .map-room-panel-audio {
  top: 1.25% !important;
  left: 51.75% !important;
  display: block !important;
  width: 12.55% !important;
  height: 6.15% !important;
  overflow: visible !important;
}

.map-room-top-controls .map-room-panel-audio::before { display: none !important; }

.map-room-top-controls .map-room-panel-mute {
  position: absolute !important;
  top: 35% !important;
  left: 3% !important;
  right: auto !important;
  width: 31% !important;
  height: 45% !important;
  padding: 0 !important;
  border: 1px solid #bd913f !important;
  border-radius: 999px !important;
  background: #114778 !important;
  color: #f6d883 !important;
  font: 700 clamp(6px, .55vw, 10px)/1 Georgia, serif !important;
}

.map-room-top-controls .map-room-panel-volume {
  position: absolute !important;
  top: 4% !important;
  right: auto !important;
  left: 35% !important;
  display: grid !important;
  width: 62% !important;
  height: 88% !important;
  align-content: center !important;
  gap: 2% !important;
}

.map-room-top-controls .map-room-panel-volume span {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  color: #f5d580;
  font: 700 clamp(5px, .5vw, 9px)/1 Georgia, "Times New Roman", serif !important;
  text-align: center;
  white-space: nowrap;
}

.map-room-top-controls .map-room-panel-volume input { position: absolute; right: 0; bottom: 5%; left: 0; width: 100%; height: 45%; margin: 0; }

.map-room-top-controls .map-room-panel-cgh {
  top: .7% !important;
  left: 75.5% !important;
  width: 7.2% !important;
  height: 7% !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.map-room-top-controls .map-room-panel-cgh img { width: 100%; height: 100%; object-fit: contain; }

.map-room-command-panel {
  z-index: 8 !important;
  top: 9.25% !important;
  left: 22.55% !important;
  display: block !important;
  width: 12.15% !important;
  height: 58.68% !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 2px solid rgba(237, 248, 255, .94) !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, rgba(18, 55, 107, .98), rgba(5, 28, 68, .98)) !important;
  box-shadow: inset 0 0 24px rgba(95, 175, 232, .1) !important;
  clip-path: none !important;
  color: #f2f9ff !important;
  font-family: var(--gps-font-terminal) !important;
  pointer-events: auto !important;
  transform: none !important;
}

.map-room-rail-heading {
  position: absolute;
  inset: 0 0 auto;
  display: grid;
  height: 32%;
  place-content: center;
  margin: 0;
  border-bottom: 2px solid rgba(237, 248, 255, .94);
  color: #f4faff;
  font: 400 clamp(18px, 2.25vw, 38px)/1.12 var(--gps-font-terminal);
  text-align: center;
  text-shadow: 0 0 6px rgba(211, 241, 255, .44);
}
.map-room-rail-heading span { display: block; }

.map-room-panel-buttons {
  position: absolute !important;
  inset: 32% 0 0 !important;
  display: grid !important;
  width: auto !important;
  height: auto !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: 22% 15% 20% 29.5% 13.5% !important;
  gap: 0 !important;
}

.map-room-panel-buttons > button,
.map-room-panel-buttons .map-room-panel-deploy,
.map-room-panel-buttons .map-room-panel-back {
  position: static !important;
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: .15em .2em !important;
  place-items: center !important;
  border: 0 !important;
  border-bottom: 2px solid rgba(237, 248, 255, .94) !important;
  border-radius: 0 !important;
  background: rgba(6, 33, 76, .22) !important;
  color: #f4faff !important;
  font: 400 clamp(12px, 1.28vw, 22px)/1 var(--gps-font-terminal) !important;
  text-shadow: 0 0 6px rgba(211, 241, 255, .44) !important;
  box-shadow: none !important;
  pointer-events: auto !important;
  transform: none !important;
}

.map-room-panel-buttons > #map-room-auto-arrange,
.map-room-panel-buttons > #map-room-rotate,
.map-room-panel-buttons > #map-room-deploy,
.map-room-panel-buttons > #map-room-back {
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  width: 100% !important;
  height: 100% !important;
}

.map-room-panel-buttons .map-room-panel-deploy {
  font-size: clamp(18px, 2vw, 34px) !important;
}

.map-room-panel-buttons .map-room-panel-deploy strong {
  position: static !important;
  display: block !important;
  width: auto !important;
  margin: 0 !important;
  font: inherit !important;
  text-indent: 0 !important;
  transform: none !important;
}

.map-room-panel-buttons > button:hover,
.map-room-panel-buttons > button:focus-visible {
  outline: 2px solid #fff !important;
  outline-offset: -4px !important;
  background: rgba(32, 91, 149, .5) !important;
}

.map-room-panel-buttons > button:disabled {
  cursor: not-allowed !important;
  filter: grayscale(.75) brightness(.65) !important;
  opacity: .62 !important;
}

.map-room-screen.is-deployment-ready:not(.is-deploy-handoff) #map-room-deploy:not(:disabled) {
  animation: gps-map-deploy-pulse 1.55s ease-in-out infinite;
}

@keyframes gps-map-deploy-pulse {
  0%, 100% { background: rgba(7, 38, 83, .35); box-shadow: inset 0 0 0 0 rgba(216, 247, 255, 0), 0 0 0 rgba(126, 215, 255, 0) !important; }
  50% { background: rgba(29, 94, 151, .72); box-shadow: inset 0 0 18px rgba(217, 248, 255, .22), 0 0 18px rgba(126, 215, 255, .65) !important; }
}

.map-room-radar {
  position: relative;
  overflow: hidden;
  border-bottom: 2px solid rgba(237, 248, 255, .94);
  background: radial-gradient(circle, rgba(28, 80, 137, .4), rgba(5, 26, 64, .2));
}

.map-room-radar-rings,
.map-room-radar-crosshair,
.map-room-radar-sweep,
.map-room-radar-blip { position: absolute; display: block; pointer-events: none; }
.map-room-radar-rings {
  top: 50%; left: 50%; width: 54%; aspect-ratio: 1; border: 2px solid #f1f9ff; border-radius: 50%;
  background: repeating-radial-gradient(circle, transparent 0 18%, #f1f9ff 18.5% 20%, transparent 20.5% 38%, #f1f9ff 38.5% 40%, transparent 40.5% 58%);
  transform: translate(-50%, -50%);
}
.map-room-radar-crosshair { inset: 23%; background: linear-gradient(90deg, transparent 49.4%, #f1f9ff 49.4% 50.6%, transparent 50.6%), linear-gradient(0deg, transparent 49.4%, #f1f9ff 49.4% 50.6%, transparent 50.6%); border-radius: 50%; }
.map-room-radar-sweep {
  top: 50%; left: 50%; width: 35%; height: 2px; background: #fff; box-shadow: 0 0 6px rgba(220, 247, 255, .82);
  animation: gps-map-radar-sweep 2.8s linear infinite; transform-origin: 0 50%;
}
.map-room-radar-blip { width: 5px; height: 5px; border-radius: 50%; background: #fff; box-shadow: 0 0 8px #fff; animation: gps-map-radar-blip 1.4s ease-in-out infinite; }
.map-room-radar-blip-a { top: 33%; left: 61%; }
.map-room-radar-blip-b { top: 62%; left: 38%; animation-delay: .55s; }
@keyframes gps-map-radar-sweep { to { transform: rotate(1turn); } }
@keyframes gps-map-radar-blip { 0%, 100% { opacity: .22; } 45% { opacity: 1; } }

.map-room-screen.is-radar-frozen .map-room-radar-sweep,
.map-room-screen.is-radar-frozen .map-room-radar-blip { animation-play-state: paused !important; }
.map-room-screen.is-radar-frozen .map-room-radar-sweep { transform: rotate(318deg); }

/* Command-rail readability lock.
   Establish a comfortably readable cabinet-size baseline, then apply the
   requested 60% increase. Fixedsys has compact glyphs, so the deliberately
   tight line heights preserve the approved rail geometry. */
.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-selection-actions {
  grid-template-rows: 31% 18% 27% 12% 12% !important;
  align-items: stretch !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-selection-actions .gps-mode-rail-heading {
  font-size: clamp(54px, 7.8svh, 100px) !important;
  line-height: .72 !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-selection-actions .gps-mode-rail-heading span {
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-current-selection {
  gap: 0 !important;
  padding: 2% 3% !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-current-selection span {
  font-size: clamp(16px, 1.5vw, 24px) !important;
  line-height: .74 !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-current-selection strong {
  font-size: clamp(23px, 2.25vw, 36px) !important;
  line-height: .72 !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-selection-actions button {
  height: 100% !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  padding: .1em .15em !important;
  font-size: clamp(23px, 2.25vw, 36px) !important;
  line-height: .75 !important;
}

.gps-shadow-box-stage > .gps-mode-reveal .gps-mode-selection-actions .gps-mode-confirm {
  font-size: clamp(31px, 3.05vw, 49px) !important;
  line-height: .68 !important;
}

/* The Map Room keeps the locked shadow-box plaques instead of substituting
   a flat control family after mode selection. */
.map-room-top-controls > button,
.map-room-top-controls .map-room-panel-audio {
  border: 4px solid transparent !important;
  border-radius: 8px !important;
  background:
    radial-gradient(ellipse at 50% 4%, rgba(91, 148, 207, .28), transparent 48%) padding-box,
    linear-gradient(180deg, #174778, #0d315e 46%, #06162f) padding-box,
    linear-gradient(135deg, #4a2d11 0%, #a87531 12%, #efd28c 23%, #6d461c 39%, #c69648 57%, #f0d18a 72%, #71481c 87%, #3d250e 100%) border-box !important;
  color: #f2d18b !important;
  font-family: Rockwell, "Rockwell Extra Bold", Georgia, serif !important;
  text-shadow: 0 2px 1px #100904, 0 0 5px rgba(255, 214, 126, .22) !important;
  box-shadow:
    0 3px 5px rgba(0, 0, 0, .64),
    0 0 0 1px rgba(233, 195, 113, .36),
    inset 0 0 0 2px rgba(1, 7, 18, .82),
    inset 0 1px 8px rgba(146, 205, 255, .18),
    inset 0 -4px 8px rgba(0, 0, 0, .44) !important;
}

#map-room-home { font-size: 18px !important; }
#map-room-achievements,
#map-room-feedback { font-size: 16px !important; }

#map-room-screen .map-room-panel-mute {
  overflow: hidden !important;
  font: 800 9px/1 Rockwell, Georgia, serif !important;
  text-transform: uppercase !important;
}

#map-room-screen .map-room-panel-volume span {
  top: 0 !important;
  height: 42% !important;
  font: 800 8px/1 Rockwell, Georgia, serif !important;
  text-shadow: 0 1px 1px #000 !important;
}

#map-room-screen #map-room-volume {
  position: absolute !important;
  top: 47% !important;
  right: 0 !important;
  bottom: auto !important;
  left: 0 !important;
  appearance: none !important;
  width: 100% !important;
  height: 47% !important;
  margin: 0 !important;
  border: 2px solid #a97936 !important;
  border-radius: 999px !important;
  background: linear-gradient(to right, #1e5791 0 65%, #030919 65% 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(236, 202, 127, .32), inset 0 2px 5px rgba(0, 0, 0, .9) !important;
}

#map-room-screen #map-room-volume::-webkit-slider-runnable-track { height: 100%; background: transparent; }
#map-room-screen #map-room-volume::-moz-range-track { height: 100%; background: transparent; }
#map-room-screen #map-room-volume::-webkit-slider-thumb {
  appearance: none;
  width: 8px;
  height: 137.5%;
  margin-top: -2px;
  border: 1px solid #5e3b17;
  border-radius: 3px;
  background: linear-gradient(90deg, #8d642d, #f0d18b 50%, #8d642d);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .7);
}
#map-room-screen #map-room-volume::-moz-range-thumb {
  width: 8px;
  height: 137.5%;
  border: 1px solid #5e3b17;
  border-radius: 3px;
  background: linear-gradient(90deg, #8d642d, #f0d18b 50%, #8d642d);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .7);
}

.map-room-top-controls > button:hover,
.map-room-top-controls > button:focus-visible {
  filter: brightness(1.12);
}

#map-room-screen .map-room-command-panel .map-room-rail-heading {
  font-size: clamp(61px, 6vw, 76px) !important;
  line-height: .7 !important;
}

#map-room-screen .map-room-command-panel .map-room-rail-heading span {
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: -.08em !important;
}

#map-room-screen #map-room-auto-arrange,
#map-room-screen #map-room-rotate,
#map-room-screen #map-room-back {
  padding: 0 .1em !important;
  font-size: clamp(32px, 3.2vw, 51.2px) !important;
  line-height: .72 !important;
  letter-spacing: -.035em !important;
}

#map-room-screen #map-room-deploy {
  padding: 0 .1em !important;
  font-size: clamp(54.4px, 5.04vw, 80px) !important;
  line-height: .55 !important;
  letter-spacing: -.075em !important;
}

#map-room-screen #map-room-deploy > strong {
  font: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  text-shadow: 0 0 8px rgba(225, 247, 255, .62) !important;
}


.map-room-live-instruction {
  z-index: 7 !important;
  top: 9.55% !important;
  left: 37.3% !important;
  display: flex !important;
  width: 43.55% !important;
  height: 3% !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 1.4% !important;
  color: #eff8ff !important;
  font: 400 clamp(8px, .86vw, 15px)/1 var(--gps-font-terminal) !important;
  letter-spacing: .03em !important;
  text-shadow: 0 0 5px rgba(204, 238, 255, .44) !important;
}

.map-room-playfield {
  z-index: 5 !important;
  top: 16.1% !important;
  left: 37.3% !important;
  width: 43.55% !important;
  height: 51.62% !important;
  aspect-ratio: 24 / 16 !important;
  overflow: visible !important;
  border: 1px solid rgba(216, 241, 252, .86);
  background: rgba(6, 31, 62, .78);
  box-shadow: inset 0 0 38px rgba(9, 38, 77, .52), 0 0 10px rgba(89, 177, 230, .12);
  transform: none !important;
}

.map-room-glass-treatment {
  z-index: 6 !important;
  top: 16.1% !important;
  left: 37.3% !important;
  width: 43.55% !important;
  height: 51.62% !important;
  background: linear-gradient(110deg, transparent 9%, rgba(220, 244, 249, .055) 30%, transparent 43%) !important;
}

.map-room-column-labels,
.map-room-row-labels { color: rgba(232, 247, 255, .9) !important; font-family: var(--gps-font-terminal) !important; }
.map-room-column-labels span,
.map-room-row-labels span { font-size: clamp(7px, .63vw, 11px) !important; }

.map-room-board-size {
  z-index: 9 !important;
  top: 64.6% !important;
  right: 22.5% !important;
  color: rgba(231, 246, 255, .78) !important;
  font: 400 clamp(8px, .76vw, 13px)/1 var(--gps-font-terminal) !important;
  text-shadow: 0 0 5px rgba(206, 240, 255, .4) !important;
}

.map-room-formation,
.map-room-formation img,
.map-room-cell-reticle {
  transition: opacity 620ms ease, filter 620ms ease, transform 620ms ease !important;
}

.map-room-screen.is-deploy-handoff .map-room-formation,
.map-room-screen.is-deploy-handoff .map-room-cell-reticle {
  opacity: 0 !important;
  filter: blur(2px) brightness(1.25) !important;
  pointer-events: none !important;
}

.map-room-screen.is-deploy-handoff .map-room-formation-layer {
  pointer-events: none !important;
}

.map-room-screen.is-deploy-handoff .map-room-panel-buttons > button { pointer-events: none !important; }

.combat-deployment-transition {
  position: fixed !important;
  inset: 0 !important;
  z-index: 120 !important;
  overflow: hidden !important;
  background: #000 !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

.combat-deployment-transition[hidden] { display: none !important; }

.combat-deployment-transition > video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #000;
}

body[data-stage="map-room-screen"] > #feedback-open { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  .map-room-radar-sweep,
  .map-room-radar-blip,
  .map-room-screen.is-deployment-ready:not(.is-deploy-handoff) #map-room-deploy:not(:disabled) {
    animation: none !important;
  }
  .map-room-radar-sweep { transform: rotate(318deg); }
  .map-room-screen.is-deployment-ready:not(.is-deploy-handoff) #map-room-deploy:not(:disabled) {
    background: rgba(29, 94, 151, .72) !important;
    box-shadow: inset 0 0 15px rgba(217, 248, 255, .2), 0 0 12px rgba(126, 215, 255, .52) !important;
  }
  .map-room-formation,
  .map-room-formation img,
  .map-room-cell-reticle { transition-duration: 80ms !important; }
}

/* Attrition reinforcement correction: center the overlay against the viewport,
   preserve the full formation footprint, and keep every instruction readable. */
.match-page-v2[data-phase="attrition-choice"] .turn-command,
.match-page-v2[data-phase="attrition-placement"] .turn-command {
  top: 12px !important;
  left: 50vw !important;
  width: min(1060px, calc(100vw - 32px)) !important;
  max-height: 224px;
  padding: 14px !important;
  overflow: auto;
  grid-template-columns: minmax(0, 1fr) !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,.08), transparent 24%),
    linear-gradient(180deg, #173b6d, #07172f 68%, #030b1c) !important;
  box-shadow: inset 0 0 0 2px #020817, inset 0 0 0 4px rgba(237,202,124,.32), 0 24px 72px rgba(0,0,0,.86) !important;
  transform: translateX(-50%) !important;
}

.match-page-v2[data-phase="attrition-choice"] .turn-command > .turn-copy,
.match-page-v2[data-phase="attrition-placement"] .turn-command > .turn-copy { display: none !important; }

.match-page-v2 #attrition-controls {
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1.32fr) minmax(390px, .68fr);
  grid-template-rows: auto auto;
  gap: 10px 14px;
  width: 100%;
}

.match-page-v2 .attrition-copy {
  grid-column: 1;
  grid-row: 1 / 3;
  gap: 7px;
  width: 100%;
  padding: 14px 16px;
  border: 1px solid rgba(231,198,123,.52);
  background: rgba(2, 12, 29, .74);
}

.match-page-v2 .attrition-copy > span {
  color: #f0d28e;
  font-size: 20px !important;
  line-height: 1.1;
}

.match-page-v2 .attrition-copy > strong {
  color: #ffffff;
  font-size: clamp(25px, 2.2vw, 32px) !important;
  line-height: 1.08;
  text-shadow: 0 2px 3px #000;
}

.match-page-v2 .attrition-copy > small {
  overflow: visible;
  color: #eef7fb;
  font-size: 21px !important;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: .015em;
  text-overflow: clip;
  white-space: normal;
}

.match-page-v2 .attrition-choice-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  grid-column: 2;
  grid-row: 1;
}

.match-page-v2 .attrition-choice-list button,
.match-page-v2 .attrition-position-control,
.match-page-v2 #attrition-confirm {
  min-height: 56px;
  padding: 10px 16px;
  border: 2px solid #cda755;
  border-radius: 7px;
  background: linear-gradient(180deg, #214b81, #0b2852 62%, #04142f);
  color: #f8e4ad;
  font: 400 22px/1.1 var(--gps-font-display);
  text-transform: uppercase;
  text-shadow: 0 2px 2px #000;
  cursor: pointer;
}

.match-page-v2 .attrition-choice-list button:disabled {
  min-height: 44px;
  border-color: rgba(146,171,193,.46);
  background: rgba(4,18,37,.72);
  color: #cddde7;
}

.match-page-v2 .attrition-placement-actions {
  display: grid;
  grid-column: 2;
  grid-row: 2;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.match-page-v2 .attrition-placement-actions[hidden] { display: none !important; }

.match-page-v2 #attrition-confirm {
  grid-column: 1 / -1;
  background: linear-gradient(180deg, #dfba68, #95651f);
  color: #071326;
  text-shadow: 0 1px rgba(255,255,255,.25);
}

.formation-sprite.is-current-formation { overflow: visible; }
.formation-current-component {
  position: absolute;
  display: block;
  pointer-events: none;
  filter: brightness(1.16) contrast(1.08) drop-shadow(0 2px 2px rgba(0,0,0,.82));
}
.formation-sprite.is-current-formation.is-selected {
  filter: drop-shadow(0 0 7px rgba(255,220,132,1)) brightness(1.22) contrast(1.08);
}
.formation-sprite.is-current-formation.is-draggable::after {
  content: "DRAG FORMATION";
  position: absolute;
  z-index: 4;
  left: 50%;
  bottom: calc(100% + 4px);
  padding: 3px 7px;
  border: 1px solid rgba(241,207,128,.78);
  background: rgba(2,12,27,.9);
  color: #fff0bd;
  font: 700 14px/1 var(--gps-font-ui);
  letter-spacing: .05em;
  white-space: nowrap;
  transform: translateX(-50%);
}

/* Sonar reports: retain the locked 31.8px prefix while making the report copy
   brighter, larger, and less cramped. Reallocate existing rail height only. */
.match-page-v2 .combat-right-rail {
  grid-template-rows: 264px 178px minmax(0, 1fr);
}

.match-page-v2 #combat-event-log > li {
  min-height: 37px !important;
  padding: 4px 5px 4px 0 !important;
  border-bottom-color: rgba(197, 220, 238, .32);
  background: linear-gradient(90deg, rgba(32, 76, 126, .64), rgba(5, 20, 44, .22));
}

.match-page-v2 #combat-event-log > li > b {
  color: #f7fcff;
  font-size: 24px !important;
  font-weight: 800;
  line-height: 1.18;
  letter-spacing: .015em;
  text-shadow: 0 2px 3px #000;
}

.match-page-v2 #combat-event-log > li.is-hit > b,
.match-page-v2 #combat-event-log > li.is-sink > b { color: #ffd6c7; }
.match-page-v2 #combat-event-log > li.is-sonar > b { color: #ffe4a0; }

/* Board sonar reports: restore the original cool-to-hot information scale and
   keep every reading legible over the photographic ocean and combat effects. */
.match-page-v2 .target-cell.is-sonar { --gps-sonar-contact: #d8b4fe; }
.match-page-v2 .target-cell.is-sonar[data-sonar="2"] { --gps-sonar-contact: #a5b4fc; }
.match-page-v2 .target-cell.is-sonar[data-sonar="3"] { --gps-sonar-contact: #7dd3fc; }
.match-page-v2 .target-cell.is-sonar[data-sonar="4"] { --gps-sonar-contact: #86efac; }
.match-page-v2 .target-cell.is-sonar[data-sonar="5"] { --gps-sonar-contact: #fde68a; }
.match-page-v2 .target-cell.is-sonar[data-sonar="6"] { --gps-sonar-contact: #fdba74; }
.match-page-v2 .target-cell.is-sonar[data-sonar="7"] { --gps-sonar-contact: #fb7185; }
.match-page-v2 .target-cell.is-sonar[data-sonar="8"] { --gps-sonar-contact: #ff453a; }

.match-page-v2 .target-cell.is-sonar::before {
  color: var(--gps-sonar-contact);
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: clamp(16px, 1.05vw, 20px);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  -webkit-text-stroke: .2px rgba(0, 5, 13, .92);
  text-shadow: 0 1px 2px #000, 0 0 4px rgba(0, 0, 0, .92);
}

.match-page-v2 .target-cell.is-sonar::after {
  opacity: .92;
  transform: scale(.9);
  background: rgba(1, 11, 24, .82);
  box-shadow: 0 0 0 1px var(--gps-sonar-contact), 0 0 8px rgba(0, 0, 0, .78);
}

@media (max-height: 820px) and (min-width: 900px) {
  .match-page-v2 .combat-right-rail {
    grid-template-rows: 246px 168px minmax(185px, 1fr);
  }
}

@media (max-width: 720px) {
  .match-page-v2[data-phase="attrition-choice"] .turn-command,
  .match-page-v2[data-phase="attrition-placement"] .turn-command {
    max-height: calc(100vh - 24px);
  }
  .match-page-v2 #attrition-controls { grid-template-columns: minmax(0, 1fr); }
  .match-page-v2 .attrition-copy,
  .match-page-v2 .attrition-choice-list,
  .match-page-v2 .attrition-placement-actions { grid-column: 1; grid-row: auto; }
  .match-page-v2 .attrition-placement-actions { grid-template-columns: minmax(0, 1fr); }
}