:root {
  --text: #edf3ef;
  --dim: #aebdbb;
  --dimmer: #758e91;
  --brass: #d8b46a;
  --brass-hi: #f2d596;
  --amber: #e5bb72;
  --p0: #071016;
  --p1: #0c1a21;
  --p2: #12242d;
  --p3: #1b3038;
  --p4: #29424b;
  --edge-hi: #42616a;
}

.setup-screen {
  grid-template-columns: minmax(650px, 1.25fr) minmax(320px, .75fr);
  background: linear-gradient(125deg, #061118 0%, #11242b 50%, #090f13 100%);
}
.setup-screen:before {
  background: linear-gradient(90deg, #5fb7b00a 1px, transparent 1px),
              linear-gradient(#5fb7b00a 1px, transparent 1px);
  background-size: 48px 48px;
}
.setup-card {
  max-width: 850px;
  padding: 34px 48px 30px;
  margin: 28px auto;
  background: linear-gradient(165deg, #12252de8, #09161df2 78%);
  border: 1px solid #48636a;
  border-left: 4px solid var(--brass);
  box-shadow: 0 28px 65px #0008, 0 0 0 1px #030b10;
}
.setup-card:before { display: none; }
.eyebrow { color: #e0c183; font-size: 14px; }
.eyebrow span { color: #83abb0; }
.setup-card h1 { font-size: clamp(44px, 5vw, 74px); line-height: .94; margin: 18px 0 12px; text-shadow: none; }
.setup-intro { max-width: 620px; font-size: 14px; color: #b5c9c9; }
.operation-brief {
  display: grid;
  gap: 5px;
  padding: 13px 16px;
  margin: 20px 0;
  background: #0b1d24;
  border: 1px solid #365560;
  border-left: 3px solid #73c4bf;
  color: #c9d9d6;
  font-size: 12px;
}
.operation-brief b { color: #83d6cd; font: 700 13px var(--font-hud); letter-spacing: .16em; }
.setup-grid { gap: 14px 16px; }
.setup-grid label { color: #a7c2c1; }
.setup-grid select, .setup-grid input { background: #07151c; border-color: #3b5960; }
.map-block { margin-top: 20px; }
.map-title { color: #bbd0cc; }
.map-card { background: #0c1b22; border-color: #35515b; padding: 6px; }
.map-card:hover { border-color: #80aea9; }
.map-card.active { border-color: #e4bb70; box-shadow: 0 0 0 1px #d8b46a, 0 6px 18px #0008; }
.map-card b { color: #e4eee9; }
.map-card small { color: #b0c0bc; }
.brief { background: #0b1b22; border-color: #314b53; box-shadow: none; }
.brief ul { color: #bed0cb; }
.brief li span { color: #84a4a7; }
.setup-actions { display: flex; align-items: stretch; gap: 12px; margin-top: 18px; }
.setup-actions .primary.large { flex: 1; width: auto; margin: 0; }
.secondary.large {
  padding: 12px 18px;
  min-width: 205px;
  background: #122b34;
  border: 1px solid #6a9c9e;
  color: #d9ece9;
  font: 700 14px var(--font-cond);
  letter-spacing: .1em;
}
.secondary.large:hover:not(:disabled) { background: #1c3c46; }
.secondary.large:disabled { opacity: .45; cursor: not-allowed; }
.provisional { color: #91aaa9; }
.setup-side {
  position: relative;
  border-left: 1px solid #55848855;
  background: linear-gradient(90deg, #08171ce8, #0b2025a8),
              url('./ground-desert-albedo-C5gQt_10.webp') center / cover;
}
.setup-side-caption { color: #c4dbd5; text-shadow: 0 2px 8px #000; }
.radar-mark { border-color: #9ec1b1; background: repeating-radial-gradient(circle, #b6d5c318 0 1px, transparent 2px 42px), #0b2028b8; }
.radar-mark b { color: #f0d69c; text-shadow: none; }

.topbar { background: linear-gradient(180deg, #152b33, #0a1920); }
.topbar:after { background: linear-gradient(90deg, #2b5960, #dab877, #2b5960); box-shadow: none; }
.hud-panel, .top-resources { filter: none; }
.hud-panel:before { background: #35515b; }
.hud-panel:after { background: linear-gradient(180deg, #1a3038, #0a1920); }
.readout:before { background: #45646d; }
.readout:after { background: linear-gradient(180deg, #102831, #0b1e26); }
.panel-heading { border-bottom-color: #638a8970; text-shadow: none; }
.main-stage:after { box-shadow: inset 0 0 0 1px #173039, inset 0 0 32px #0005; }
.mission-guide {
  position: absolute;
  z-index: 3;
  top: 50px;
  left: 16px;
  max-width: min(460px, 45vw);
  padding: 8px 13px;
  background: #061820e8;
  border-left: 3px solid #d7b573;
  color: #e9e7d4;
  font: 700 12px var(--font-hud);
  letter-spacing: .06em;
  pointer-events: none;
}
.battle-top-left { background: #071820e8; }
.card { border-color: #44626a; }
.card.wide { background: linear-gradient(180deg, #254049, #132832); }
.card-name, .card-meta { background: #0b1d25; }
.card:disabled { opacity: .58; }
.tab { background: linear-gradient(180deg, #e6cd8c, #c4a25d); }

@media (max-width: 950px) {
  .setup-screen { grid-template-columns: 1fr; }
  .setup-side { display: none; }
  .setup-card { margin: 20px auto; width: min(100%, 780px); }
}
@media (max-width: 620px) {
  .setup-card { padding: 22px 20px; margin: 0; }
  .setup-actions { flex-direction: column; }
  .setup-actions .secondary.large { min-width: 0; }
  .mission-guide { max-width: calc(100% - 32px); font-size: 11px; }
}