:root {
  color-scheme: dark;
  --ink: #f4f7f8;
  --muted: #a7b4b8;
  --panel: rgba(13, 18, 22, 0.76);
  --line: rgba(244, 247, 248, 0.18);
  --gold: #f2cb57;
  --blue: #b9f6ff;
  --red: #ed5b47;
}

* {
  box-sizing: border-box;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
  background: #10161a;
  color: var(--ink);
  font-family: Inter, Segoe UI, Arial, sans-serif;
}

#shell,
#viewport {
  position: relative;
  width: 100vw;
  height: 100vh;
  min-width: 320px;
  min-height: 420px;
}

canvas {
  display: block;
  width: 100%;
  height: 100%;
}

#damage-vignette {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  opacity: var(--damage-opacity, 0);
  background:
    linear-gradient(90deg, rgba(237, 91, 71, var(--damage-left, 0)) 0%, rgba(237, 91, 71, 0) 26%, rgba(237, 91, 71, 0) 74%, rgba(237, 91, 71, var(--damage-right, 0)) 100%),
    linear-gradient(90deg, rgba(255, 140, 56, var(--supply-breach-left, 0)) 0%, rgba(255, 140, 56, 0) 27%, rgba(255, 140, 56, 0) 73%, rgba(255, 140, 56, var(--supply-breach-right, 0)) 100%),
    linear-gradient(90deg, rgba(255, 179, 108, var(--horde-left, 0)) 0%, rgba(255, 179, 108, 0) 28%, rgba(255, 179, 108, 0) 72%, rgba(255, 179, 108, var(--horde-right, 0)) 100%),
    linear-gradient(90deg, rgba(141, 255, 177, var(--first-objective-left, 0)) 0%, rgba(141, 255, 177, 0) 28%, rgba(141, 255, 177, 0) 72%, rgba(141, 255, 177, var(--first-objective-right, 0)) 100%),
    linear-gradient(90deg, rgba(141, 255, 177, var(--extraction-wind-left, 0)) 0%, rgba(185, 246, 255, 0) 30%, rgba(185, 246, 255, 0) 70%, rgba(141, 255, 177, var(--extraction-wind-right, 0)) 100%),
    linear-gradient(90deg, rgba(141, 255, 177, var(--extraction-complete-left, 0)) 0%, rgba(185, 246, 255, 0) 28%, rgba(185, 246, 255, 0) 72%, rgba(141, 255, 177, var(--extraction-complete-right, 0)) 100%),
    linear-gradient(90deg, rgba(92, 255, 126, var(--run-coach-relief-left, 0)) 0%, rgba(92, 255, 126, 0) 29%, rgba(92, 255, 126, 0) 71%, rgba(92, 255, 126, var(--run-coach-relief-right, 0)) 100%),
    linear-gradient(90deg, rgba(255, 190, 92, var(--roof-recovery-noise-left, 0)) 0%, rgba(255, 190, 92, 0) 30%, rgba(255, 190, 92, 0) 70%, rgba(255, 190, 92, var(--roof-recovery-noise-right, 0)) 100%),
    linear-gradient(90deg, rgba(var(--tactical-restock-rgb, 185, 246, 255), var(--tactical-restock-left, 0)) 0%, rgba(var(--tactical-restock-rgb, 185, 246, 255), 0) 30%, rgba(var(--tactical-restock-rgb, 185, 246, 255), 0) 70%, rgba(var(--tactical-restock-rgb, 185, 246, 255), var(--tactical-restock-right, 0)) 100%),
    linear-gradient(90deg, rgba(255, 211, 107, var(--route-lock-stop-visual-left, 0)) 0%, rgba(255, 211, 107, 0) 24%, rgba(255, 211, 107, 0) 76%, rgba(255, 211, 107, var(--route-lock-stop-visual-right, 0)) 100%),
    linear-gradient(90deg, rgba(var(--boss-dust-thump-rgb, 255, 179, 108), var(--boss-dust-thump-left, 0)) 0%, rgba(var(--boss-dust-thump-rgb, 255, 179, 108), 0) 24%, rgba(var(--boss-dust-thump-rgb, 255, 179, 108), 0) 76%, rgba(var(--boss-dust-thump-rgb, 255, 179, 108), var(--boss-dust-thump-right, 0)) 100%),
    linear-gradient(104deg, rgba(var(--boss-air-slice-rgb, 217, 165, 255), var(--boss-air-slice-left, 0)) 0%, rgba(var(--boss-air-slice-rgb, 217, 165, 255), 0) 30%, rgba(var(--boss-air-slice-rgb, 217, 165, 255), 0) 70%, rgba(var(--boss-air-slice-rgb, 217, 165, 255), var(--boss-air-slice-right, 0)) 100%),
    linear-gradient(90deg, rgba(255, 96, 80, var(--boss-air-slice-fail-left, 0)) 0%, rgba(255, 96, 80, 0) 25%, rgba(255, 196, 107, 0) 75%, rgba(255, 96, 80, var(--boss-air-slice-fail-right, 0)) 100%),
    linear-gradient(96deg, rgba(var(--mutant-near-miss-rgb, 255, 121, 242), var(--mutant-near-miss-surface, 0)) 0%, rgba(var(--mutant-near-miss-rgb, 255, 121, 242), 0) 32%, rgba(var(--mutant-near-miss-rgb, 255, 121, 242), 0) 68%, rgba(var(--mutant-near-miss-rgb, 255, 121, 242), var(--mutant-near-miss-surface, 0)) 100%),
    linear-gradient(96deg, rgba(255, 121, 242, var(--mutant-near-miss-left, 0)) 0%, rgba(157, 121, 255, 0) 29%, rgba(157, 121, 255, 0) 71%, rgba(255, 121, 242, var(--mutant-near-miss-right, 0)) 100%),
    linear-gradient(92deg, rgba(255, 211, 106, var(--wounded-ammo-threat-left, 0)) 0%, rgba(255, 126, 98, 0) 26%, rgba(255, 126, 98, 0) 74%, rgba(255, 211, 106, var(--wounded-ammo-threat-right, 0)) 100%),
    linear-gradient(180deg, rgba(255, 126, 98, var(--wounded-ammo-threat-rear-top, 0)) 0%, rgba(255, 126, 98, 0) 23%, rgba(255, 126, 98, 0) 77%, rgba(255, 211, 106, var(--wounded-ammo-threat-rear-bottom, 0)) 100%),
    radial-gradient(circle at 50% 52%, rgba(92, 255, 126, 0) 42%, rgba(92, 255, 126, var(--near-miss-relief, 0)) 68%, rgba(6, 56, 28, var(--near-miss-relief-deep, 0)) 100%),
    radial-gradient(circle at 50% 52%, rgba(92, 255, 126, 0) 44%, rgba(92, 255, 126, var(--run-coach-relief-core, 0)) 70%, rgba(6, 56, 28, var(--run-coach-relief-deep, 0)) 100%),
    radial-gradient(circle at 50% 52%, rgba(141, 255, 177, 0) 45%, rgba(141, 255, 177, var(--first-objective-core, 0)) 70%, rgba(70, 58, 12, 0) 100%),
    radial-gradient(circle at 50% 52%, rgba(185, 246, 255, 0) 45%, rgba(141, 255, 177, var(--extraction-wind-core, 0)) 70%, rgba(10, 42, 52, 0) 100%),
    radial-gradient(circle at 50% 52%, rgba(185, 246, 255, 0) 42%, rgba(185, 246, 255, var(--extraction-complete-core, 0)) 66%, rgba(10, 42, 52, 0) 100%),
    radial-gradient(circle at 50% 52%, rgba(255, 241, 166, 0) 43%, rgba(255, 241, 166, var(--route-lock-streak-core, 0)) 67%, rgba(130, 85, 18, 0) 100%),
    radial-gradient(circle at 50% 52%, rgba(255, 211, 107, 0) 41%, rgba(255, 211, 107, var(--route-lock-stop-shock-core, 0)) 66%, rgba(96, 38, 10, 0) 100%),
    radial-gradient(circle at 50% 52%, rgba(var(--tactical-restock-rgb, 185, 246, 255), 0) 45%, rgba(var(--tactical-restock-rgb, 185, 246, 255), var(--tactical-restock-core, 0)) 70%, rgba(10, 42, 52, var(--tactical-restock-deep, 0)) 100%),
    radial-gradient(circle at 50% 52%, rgba(255, 140, 56, 0) 43%, rgba(255, 140, 56, var(--supply-breach-amber, 0)) 69%, rgba(91, 36, 9, var(--supply-breach-deep, 0)) 100%),
    radial-gradient(circle at 50% 52%, rgba(255, 179, 108, 0) 44%, rgba(255, 179, 108, var(--horde-amber, 0)) 70%, rgba(72, 45, 12, var(--horde-deep, 0)) 100%),
    radial-gradient(circle at 50% 52%, rgba(255, 179, 108, 0) 42%, rgba(255, 179, 108, var(--boss-haptic-fallback, 0)) 66%, rgba(96, 38, 10, 0) 100%),
    radial-gradient(circle at 50% 52%, rgba(var(--boss-dust-thump-rgb, 255, 179, 108), 0) 38%, rgba(var(--boss-dust-thump-rgb, 255, 179, 108), var(--boss-dust-thump-core, 0)) 64%, rgba(85, 43, 12, var(--boss-dust-thump-deep, 0)) 100%),
    radial-gradient(ellipse at 50% 52%, rgba(var(--boss-air-slice-rgb, 217, 165, 255), 0) 40%, rgba(var(--boss-air-slice-rgb, 217, 165, 255), var(--boss-air-slice-core, 0)) 62%, rgba(18, 20, 45, 0) 100%),
    radial-gradient(ellipse at 50% 52%, rgba(255, 121, 242, 0) 40%, rgba(255, 121, 242, var(--mutant-near-miss-core, 0)) 63%, rgba(42, 16, 68, 0) 100%),
    radial-gradient(circle at 50% 52%, rgba(0, 0, 0, 0) var(--low-health-tunnel-focus, 56%), rgba(19, 0, 0, calc(var(--low-health-tunnel, 0) * 0.42)) 78%, rgba(0, 0, 0, calc(var(--low-health-tunnel, 0) * 0.58)) 100%),
    radial-gradient(circle at 50% 52%, rgba(237, 91, 71, 0) 46%, rgba(237, 91, 71, var(--low-health-red, 0)) 72%, rgba(70, 9, 9, var(--low-health-deep, 0)) 100%),
    radial-gradient(circle at 50% 52%, rgba(237, 91, 71, 0) 42%, rgba(237, 91, 71, var(--damage-red, 0.18)) 68%, rgba(75, 12, 9, var(--damage-red-deep, 0.58)) 100%);
  box-shadow:
    inset 0 0 132px rgba(92, 255, 126, var(--near-miss-edge, 0)),
    inset 0 0 42px rgba(206, 255, 222, var(--near-miss-heartbeat, 0)),
    inset 0 0 132px rgba(92, 255, 126, var(--run-coach-relief-edge, 0)),
    inset 0 0 42px rgba(206, 255, 222, var(--run-coach-relief-heartbeat, 0)),
    inset 0 0 136px rgba(var(--tactical-restock-rgb, 185, 246, 255), var(--tactical-restock-edge, 0)),
    inset 0 0 42px rgba(var(--tactical-restock-rgb, 185, 246, 255), var(--tactical-restock-heartbeat, 0)),
    inset 0 0 126px rgba(141, 255, 177, var(--first-objective-edge, 0)),
    inset 0 0 38px rgba(255, 241, 166, var(--first-objective-heartbeat, 0)),
    inset 0 0 132px rgba(141, 255, 177, var(--extraction-wind-edge, 0)),
    inset 0 0 40px rgba(185, 246, 255, var(--extraction-wind-heartbeat, 0)),
    inset 0 0 148px rgba(141, 255, 177, var(--extraction-complete-edge, 0)),
    inset 0 0 48px rgba(185, 246, 255, var(--extraction-complete-heartbeat, 0)),
    inset 0 0 132px rgba(255, 190, 92, var(--roof-recovery-noise-edge, 0)),
    inset 0 0 40px rgba(255, 232, 168, var(--roof-recovery-noise-heartbeat, 0)),
    inset 0 0 138px rgba(255, 241, 166, var(--route-lock-streak-edge, 0)),
    inset 0 0 40px rgba(185, 246, 255, var(--route-lock-streak-heartbeat, 0)),
    inset 0 0 156px rgba(255, 211, 107, var(--route-lock-stop-shock-edge, 0)),
    inset 0 0 54px rgba(255, 140, 56, var(--route-lock-stop-shock-heartbeat, 0)),
    inset 0 0 146px rgba(var(--boss-dust-thump-rgb, 255, 179, 108), var(--boss-dust-thump-edge, 0)),
    inset 0 0 70px rgba(255, 230, 170, var(--boss-dust-thump-center, 0)),
    inset 0 0 44px rgba(255, 230, 170, var(--boss-dust-thump-heartbeat, 0)),
    inset 0 0 138px rgba(var(--boss-air-slice-rgb, 217, 165, 255), var(--boss-air-slice-edge, 0)),
    inset 0 0 46px rgba(var(--boss-air-slice-rgb, 217, 165, 255), var(--boss-air-slice-heartbeat, 0)),
    inset 0 0 146px rgba(255, 96, 80, var(--boss-air-slice-fail-edge, 0)),
    inset 0 0 48px rgba(255, 196, 107, var(--boss-air-slice-fail-heartbeat, 0)),
    inset 0 0 96px rgba(var(--mutant-near-miss-rgb, 255, 121, 242), var(--mutant-near-miss-surface, 0)),
    inset 0 0 142px rgba(255, 121, 242, var(--mutant-near-miss-edge, 0)),
    inset 0 0 42px rgba(216, 255, 238, var(--mutant-near-miss-heartbeat, 0)),
    inset 0 0 150px rgba(255, 140, 56, var(--supply-breach-edge, 0)),
    inset 0 0 52px rgba(255, 230, 170, var(--supply-breach-heartbeat, 0)),
    inset 0 0 142px rgba(255, 179, 108, var(--horde-edge, 0)),
    inset 0 0 46px rgba(255, 223, 142, var(--horde-heartbeat, 0)),
    inset 0 0 164px rgba(255, 140, 56, var(--boss-haptic-fallback-edge, 0)),
    inset 0 0 48px rgba(255, 230, 170, var(--boss-haptic-fallback-heartbeat, 0)),
    inset 0 0 136px rgba(141, 255, 177, var(--wounded-ammo-recovery-edge, 0)),
    inset 0 0 38px rgba(185, 246, 255, calc(var(--wounded-ammo-recovery-edge, 0) * 0.68)),
    inset 0 0 194px rgba(141, 255, 177, calc(var(--wounded-ammo-recovery-tunnel-relief, 0) * 0.5)),
    inset 0 0 132px rgba(255, 211, 106, var(--wounded-ammo-threat-edge, 0)),
    inset 0 0 40px rgba(255, 126, 98, var(--wounded-ammo-threat-heartbeat, 0)),
    inset 0 0 86px rgba(255, 126, 98, var(--wounded-ammo-threat-rear, 0)),
    inset 0 0 178px rgba(141, 255, 177, calc(var(--wounded-ammo-recovery-breath, 0) * 0.84)),
    inset 0 0 62px rgba(206, 255, 222, var(--wounded-ammo-recovery-breath, 0)),
    inset 0 0 210px rgba(0, 0, 0, calc(var(--low-health-tunnel, 0) * 0.34)),
    inset 0 0 152px rgba(237, 91, 71, var(--low-health-edge, 0)),
    inset 0 0 46px rgba(255, 117, 82, var(--low-health-heartbeat, 0)),
    inset 0 0 120px rgba(237, 91, 71, var(--damage-edge, 0)),
    inset 0 0 38px rgba(255, 179, 108, var(--damage-heartbeat, 0));
  transition: opacity 90ms linear;
}

#damage-scratch {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  opacity: var(--scratch-opacity, 0);
  transform: translateX(var(--scratch-offset, 0px)) rotate(var(--scratch-rotate, 0deg)) scale(var(--scratch-scale, 1));
  transform-origin: 50% 54%;
  mix-blend-mode: screen;
  transition: opacity 60ms linear, transform 70ms ease-out;
}

#damage-scratch i {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  width: clamp(118px, 22vw, 238px);
  height: 5px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 244, 210, 0), rgba(255, 244, 210, 0.78) 18%, rgba(237, 91, 71, 0.8) 54%, rgba(120, 20, 16, 0.12) 88%, rgba(237, 91, 71, 0));
  box-shadow: 0 0 14px rgba(237, 91, 71, 0.36), 0 0 3px rgba(255, 244, 210, 0.8);
  filter: drop-shadow(0 0 5px rgba(255, 179, 108, 0.32));
}

#damage-scratch i:nth-child(1) {
  transform: translate(-55%, -48px) rotate(-20deg);
}

#damage-scratch i:nth-child(2) {
  width: clamp(96px, 18vw, 202px);
  transform: translate(-50%, -18px) rotate(-14deg);
}

#damage-scratch i:nth-child(3) {
  width: clamp(110px, 20vw, 220px);
  transform: translate(-46%, 14px) rotate(-18deg);
}

#main-menu,
#settings-panel,
#help-panel {
  position: absolute;
  inset: 0;
  z-index: 8;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(6, 9, 12, 0.68);
  backdrop-filter: blur(6px);
}

#main-menu.hidden,
#settings-panel.hidden,
#help-panel.hidden,
#end-summary.hidden,
#ammo-guide.hidden,
#ammo-guide-resolve.hidden,
#tactical-guide.hidden,
#tactical-ready-cue.hidden,
#breach-push-cue.hidden,
#boss-compass-cue.hidden,
#route-side-chirp.hidden,
#boss-break-flash.hidden,
#boss-finisher-flash.hidden,
#flight-card.hidden,
#warmup-card.hidden,
#coach-kit-card.hidden,
#boss-threat-card.hidden,
#boss-phase-card.hidden,
#tab-menu-hint.hidden,
#powers-hint.hidden,
#look-hint.hidden,
#low-ammo-motion-hint.hidden,
#warmup-drill.hidden,
#roof-plant-feel-debug.hidden,
#toast.hidden {
  display: none;
}

.menu-card,
.settings-card,
.help-card {
  width: min(820px, calc(100vw - 32px));
  max-height: min(740px, calc(100vh - 32px));
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(13, 18, 22, 0.96);
  box-shadow: 0 24px 90px rgba(0, 0, 0, 0.52);
}

.menu-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px;
  gap: 22px;
  align-items: center;
  padding: 24px;
}

.label,
.hud-card span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0;
}

h1 {
  margin: 5px 0 10px;
  font-size: clamp(34px, 5.8vw, 68px);
  line-height: 0.95;
  letter-spacing: 0;
}

p {
  margin: 0;
  color: #dce7ea;
  font-size: 16px;
  line-height: 1.5;
}

.menu-actions {
  display: grid;
  gap: 10px;
}

.menu-actions button,
.menu-actions a,
.help-head button {
  display: grid;
  min-height: 42px;
  place-items: center;
  padding: 0 14px;
  border: 1px solid rgba(244, 247, 248, 0.22);
  border-radius: 8px;
  background: rgba(244, 247, 248, 0.08);
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
  text-decoration: none;
  cursor: pointer;
}

.menu-actions .primary-action {
  background: var(--gold);
  color: #151515;
}

.menu-mode-badge {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid rgba(141, 255, 177, 0.2);
  border-radius: 8px;
  background: rgba(35, 73, 58, 0.26);
}

.menu-mode-badge[data-context="paused"] {
  border-color: rgba(242, 203, 87, 0.45);
  background: rgba(67, 55, 27, 0.32);
}

.menu-mode-badge[data-context="ended"] {
  border-color: rgba(185, 246, 255, 0.34);
  background: rgba(45, 79, 88, 0.28);
}

.menu-mode-badge span {
  display: inline-flex;
  gap: 6px;
  align-items: baseline;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.menu-mode-badge strong {
  color: #8dffb1;
  font-size: 12px;
}

.menu-mode-badge em {
  padding: 2px 5px;
  border: 1px solid rgba(185, 246, 255, 0.18);
  border-radius: 999px;
  color: var(--blue);
  font-size: 9px;
  font-style: normal;
  font-weight: 950;
  line-height: 1;
}

.menu-mode-badge small {
  flex-basis: 100%;
  color: #dce7ea;
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.menu-status {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 16px;
  border-top: 1px solid rgba(244, 247, 248, 0.12);
}

.menu-status span {
  display: inline-flex;
  gap: 6px;
  align-items: baseline;
  position: relative;
  min-width: 0;
  padding: 7px 10px;
  border: 1px solid rgba(185, 246, 255, 0.2);
  border-radius: 8px;
  background: rgba(45, 79, 88, 0.32);
  overflow: hidden;
  color: var(--blue);
  font-size: 11px;
  font-weight: 850;
}

.menu-status span.is-control-updated {
  animation: menu-control-updated 1100ms ease-out both;
}

.menu-status span.is-preset-applied::after {
  content: "";
  position: absolute;
  inset: -18px -44px;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 28%, rgba(141, 255, 177, 0.34) 48%, rgba(185, 246, 255, 0.28) 56%, transparent 72%);
  transform: translateX(-80%) skewX(-18deg);
  animation: menu-preset-sweep 980ms ease-out both;
}

.menu-status b,
.menu-status em {
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  letter-spacing: 0;
}

.menu-status b {
  flex: 0 1 auto;
  max-width: 168px;
  color: var(--ink);
  font-size: 11px;
  font-weight: 950;
}

.menu-status em {
  flex: 1 1 auto;
  color: var(--blue);
  font-style: normal;
  font-size: 10px;
  font-weight: 850;
}

.menu-control-drill {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(242, 203, 87, 0.22);
  border-radius: 8px;
  background: rgba(67, 55, 27, 0.22);
}

.menu-drill-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.menu-drill-steps span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px;
  border: 1px solid rgba(244, 247, 248, 0.12);
  border-radius: 8px;
  background: rgba(6, 9, 12, 0.36);
  color: #dce7ea;
}

.menu-drill-steps b,
.menu-drill-steps small,
.menu-drill-steps em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  letter-spacing: 0;
}

.menu-drill-steps b {
  color: var(--gold);
  font-size: 10px;
  font-weight: 950;
}

.menu-drill-steps small {
  color: var(--ink);
  font-size: 11px;
  font-weight: 900;
}

.menu-drill-steps em {
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
  font-weight: 850;
  text-transform: uppercase;
}

.menu-drill-steps span[data-state="active"] {
  border-color: rgba(141, 255, 177, 0.42);
  background: rgba(42, 113, 72, 0.28);
  box-shadow: 0 0 0 1px rgba(141, 255, 177, 0.08);
}

.menu-drill-steps span[data-state="active"] b,
.menu-drill-steps span[data-state="active"] em {
  color: #8dffb1;
}

@keyframes menu-control-updated {
  0% {
    border-color: rgba(242, 203, 87, 0.95);
    background: rgba(242, 203, 87, 0.28);
    box-shadow: 0 0 0 0 rgba(242, 203, 87, 0.36);
  }
  55% {
    border-color: rgba(141, 255, 177, 0.55);
    box-shadow: 0 0 0 7px rgba(141, 255, 177, 0);
  }
  100% {
    border-color: rgba(185, 246, 255, 0.2);
    background: rgba(45, 79, 88, 0.32);
    box-shadow: none;
  }
}

@keyframes menu-preset-sweep {
  0% {
    opacity: 0;
    transform: translateX(-80%) skewX(-18deg);
  }
  18% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translateX(82%) skewX(-18deg);
  }
}

.menu-best-scores {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  padding-top: 6px;
}

.best-score-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.best-score-row {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid rgba(244, 247, 248, 0.12);
  border-radius: 8px;
  background: rgba(244, 247, 248, 0.055);
}

.best-score-row.is-active {
  border-color: rgba(242, 203, 87, 0.5);
  background: rgba(242, 203, 87, 0.12);
}

.best-score-row span,
.best-score-row small,
.best-score-row strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.best-score-row span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
}

.best-score-row small {
  margin-top: 6px;
  color: var(--gold);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.best-score-row strong {
  margin-top: 3px;
  color: var(--blue);
  font-size: 15px;
  font-weight: 950;
}

.help-card {
  padding: 14px;
}

.settings-card {
  display: grid;
  gap: 14px;
  padding: 14px;
}

.help-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(244, 247, 248, 0.12);
}

.setting-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 170px;
  gap: 16px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(244, 247, 248, 0.12);
  border-radius: 8px;
  background: rgba(244, 247, 248, 0.055);
}

.setting-row.low-ammo-accessibility-row:focus-within {
  border-color: rgba(185, 246, 255, 0.36);
  background: rgba(185, 246, 255, 0.07);
  box-shadow: inset 0 0 0 1px rgba(141, 255, 177, 0.12), 0 0 18px rgba(141, 255, 177, 0.1);
}

.setting-row span {
  display: grid;
  gap: 4px;
}

.setting-row .setting-control-stack {
  gap: 6px;
  justify-self: stretch;
  min-width: 0;
}

.setting-row strong {
  color: var(--gold);
  font-size: 14px;
}

.setting-row small,
.settings-summary {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.setting-row select,
.setting-row button {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(244, 247, 248, 0.22);
  border-radius: 8px;
  background: rgba(6, 9, 12, 0.84);
  color: var(--ink);
  font: inherit;
  font-size: 13px;
  font-weight: 850;
}

.setting-row select.is-settings-applied {
  border-color: rgba(141, 255, 177, 0.7);
  box-shadow: inset 0 0 0 1px rgba(141, 255, 177, 0.28), 0 0 14px rgba(141, 255, 177, 0.14);
}

#low-ammo-motion-mode[data-motion="full"] {
  border-color: rgba(185, 246, 255, 0.28);
  background: linear-gradient(135deg, rgba(6, 9, 12, 0.86), rgba(18, 42, 52, 0.62));
}

#low-ammo-motion-mode[data-motion="reduced"] {
  border-color: rgba(141, 255, 177, 0.42);
  background: linear-gradient(135deg, rgba(6, 9, 12, 0.86), rgba(24, 52, 41, 0.66));
  box-shadow: inset 0 0 0 1px rgba(141, 255, 177, 0.14);
}

#low-ammo-motion-mode:focus-visible {
  border-color: rgba(141, 255, 177, 0.72);
  outline: 2px solid rgba(185, 246, 255, 0.66);
  outline-offset: 2px;
  box-shadow: 0 0 18px rgba(141, 255, 177, 0.18), inset 0 0 0 1px rgba(185, 246, 255, 0.18);
}

.setting-inline-hint {
  justify-self: end;
  padding: 2px 7px;
  border: 1px solid rgba(185, 246, 255, 0.18);
  border-radius: 999px;
  background: rgba(6, 9, 12, 0.52);
  color: var(--blue);
  font-size: 9px;
  font-style: normal;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
}

.setting-inline-hint[data-graphics="performance"] {
  border-color: rgba(141, 255, 177, 0.24);
  color: var(--green);
}

.setting-inline-hint[data-graphics="high"] {
  border-color: rgba(255, 211, 106, 0.26);
  color: var(--gold);
}

.setting-motion-readout {
  justify-self: stretch;
  padding: 5px 7px;
  border: 1px solid rgba(244, 247, 248, 0.12);
  border-radius: 6px;
  background: rgba(6, 9, 12, 0.44);
  color: rgba(244, 247, 248, 0.72);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: 0;
  text-transform: uppercase;
}

.setting-motion-readout[data-motion="reduced"] {
  border-color: rgba(141, 255, 177, 0.24);
  color: rgba(185, 246, 255, 0.88);
}

.setting-motion-detail {
  justify-self: stretch;
  color: rgba(244, 247, 248, 0.6);
  font-size: 9px;
  font-weight: 750;
  line-height: 1.35;
  letter-spacing: 0;
}

.setting-motion-detail[data-motion="reduced"] {
  color: rgba(217, 255, 230, 0.78);
}

.setting-motion-readout.is-settings-applied {
  border-color: rgba(141, 255, 177, 0.48);
  background: rgba(24, 52, 41, 0.74);
  color: rgba(217, 255, 230, 0.96);
  box-shadow: inset 0 0 0 1px rgba(141, 255, 177, 0.24), 0 0 14px rgba(141, 255, 177, 0.12);
}

.setting-row button {
  cursor: pointer;
}

.settings-controls {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(244, 247, 248, 0.12);
  border-radius: 8px;
  background: rgba(244, 247, 248, 0.055);
}

.settings-controls-head,
.control-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(128px, 154px);
  gap: 12px;
  align-items: center;
}

.settings-controls-head span,
.control-row div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.settings-controls-head strong,
.control-row span {
  color: var(--gold);
  font-size: 14px;
  font-weight: 900;
}

.settings-controls-head small,
.control-row small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.control-row .control-recent-marker {
  justify-self: start;
  border: 1px solid rgba(242, 203, 87, 0.34);
  border-radius: 999px;
  background: rgba(242, 203, 87, 0.14);
  color: #f2cb57;
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
  padding: 4px 7px;
  text-transform: uppercase;
}

.settings-controls-head button,
.control-bind {
  min-height: 38px;
  border: 1px solid rgba(244, 247, 248, 0.22);
  border-radius: 8px;
  background: rgba(6, 9, 12, 0.84);
  color: var(--ink);
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}

.settings-control-actions {
  display: grid;
  gap: 8px;
}

.settings-control-actions button:first-child {
  border-color: rgba(141, 255, 177, 0.34);
  color: #8dffb1;
}

.settings-control-actions button:nth-child(2) {
  border-color: rgba(117, 213, 255, 0.34);
  color: #75d5ff;
}

.settings-control-actions button:nth-child(4) {
  border-color: rgba(242, 203, 87, 0.34);
  color: #f2cb57;
}

.settings-control-actions button:disabled {
  border-color: rgba(244, 247, 248, 0.12);
  color: rgba(167, 180, 184, 0.52);
  cursor: not-allowed;
  opacity: 0.62;
}

.settings-preset-note {
  display: block;
  max-width: 154px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.35;
}

.controls-preset-status {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid rgba(141, 255, 177, 0.18);
  border-radius: 8px;
  background: rgba(35, 73, 58, 0.14);
}

.controls-preset-status strong {
  color: var(--muted);
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
}

.controls-preset-status output {
  color: #8dffb1;
  font-size: 12px;
  font-weight: 950;
}

.controls-preset-status[data-preset="custom"] output {
  color: var(--gold);
}

.controls-filter {
  display: grid;
  grid-template-columns: minmax(88px, 0.36fr) minmax(0, 1fr) minmax(76px, auto);
  gap: 8px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid rgba(117, 213, 255, 0.18);
  border-radius: 8px;
  background: rgba(24, 48, 65, 0.18);
}

.controls-filter span,
.controls-filter output {
  color: var(--muted);
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
}

.controls-filter input {
  min-width: 0;
  height: 34px;
  border: 1px solid rgba(244, 247, 248, 0.18);
  border-radius: 8px;
  background: rgba(6, 9, 12, 0.72);
  color: var(--ink);
  font: inherit;
  font-size: 12px;
  font-weight: 850;
  padding: 0 10px;
}

.controls-filter input:focus {
  border-color: rgba(117, 213, 255, 0.56);
  outline: none;
  box-shadow: 0 0 0 2px rgba(117, 213, 255, 0.14);
}

.controls-filter output {
  justify-self: end;
  color: #75d5ff;
  white-space: nowrap;
}

.controls-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.controls-categories button {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  border: 1px solid rgba(244, 247, 248, 0.14);
  border-radius: 8px;
  background: rgba(6, 9, 12, 0.58);
  color: var(--muted);
  font: inherit;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
  padding: 0 10px;
  cursor: pointer;
}

.controls-categories button small {
  min-width: 18px;
  height: 18px;
  border-radius: 999px;
  background: rgba(244, 247, 248, 0.08);
  color: rgba(167, 180, 184, 0.82);
  display: inline-grid;
  place-items: center;
  font-size: 10px;
  font-weight: 950;
  line-height: 1;
}

.controls-categories button.has-custom small {
  background: rgba(242, 203, 87, 0.2);
  color: var(--gold);
}

.controls-categories button[aria-pressed="true"] {
  border-color: rgba(117, 213, 255, 0.56);
  background: rgba(31, 71, 92, 0.62);
  color: #b9f6ff;
  box-shadow: inset 0 -2px 0 rgba(117, 213, 255, 0.42);
}

.controls-categories .controls-reset-category {
  margin-left: auto;
  border-color: rgba(242, 203, 87, 0.28);
  color: var(--gold);
}

.controls-categories .controls-reset-category:disabled {
  border-color: rgba(244, 247, 248, 0.1);
  color: rgba(167, 180, 184, 0.5);
  cursor: not-allowed;
  opacity: 0.62;
}

.controls-list {
  display: grid;
  gap: 8px;
  max-height: min(340px, 42vh);
  overflow: auto;
  padding-right: 4px;
}

.control-row {
  padding: 10px;
  border: 1px solid rgba(244, 247, 248, 0.1);
  border-radius: 8px;
  background: rgba(6, 9, 12, 0.34);
}

.control-row.is-recent-control {
  border-color: rgba(242, 203, 87, 0.36);
  box-shadow: inset 3px 0 0 rgba(242, 203, 87, 0.72);
}

.control-row:focus-within {
  border-color: rgba(242, 203, 87, 0.42);
  box-shadow: inset 3px 0 0 #f2cb57;
}

.control-row.is-empty {
  grid-template-columns: 1fr;
  border-style: dashed;
  text-align: left;
}

.control-bind.waiting {
  border-color: rgba(185, 246, 255, 0.58);
  background: rgba(45, 79, 88, 0.44);
  color: #b9f6ff;
}

.control-bind:disabled {
  color: rgba(167, 180, 184, 0.62);
  cursor: not-allowed;
}

.controls-change-log {
  display: grid;
  gap: 7px;
  padding: 10px;
  border: 1px solid rgba(141, 255, 177, 0.18);
  border-radius: 8px;
  background: rgba(35, 73, 58, 0.18);
}

.controls-change-log strong {
  color: #8dffb1;
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}

.controls-change-list {
  display: grid;
  gap: 5px;
  max-height: 78px;
  margin: 0;
  padding-left: 18px;
  overflow: auto;
}

.controls-change-list li {
  color: #dce7ea;
  font-size: 11px;
  line-height: 1.35;
}

.controls-change-list li:first-child:not(.is-placeholder) {
  color: var(--blue);
  font-weight: 900;
}

.controls-change-list .is-placeholder {
  list-style: none;
  margin-left: -18px;
  color: var(--muted);
}

.controls-test-panel {
  display: grid;
  gap: 7px;
  padding: 10px;
  border: 1px solid rgba(185, 246, 255, 0.18);
  border-radius: 8px;
  background: rgba(45, 79, 88, 0.16);
}

.controls-test-panel strong {
  color: var(--blue);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}

.controls-test-panel p {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.controls-test-status {
  min-height: 34px;
  padding: 8px 10px;
  border: 1px solid rgba(244, 247, 248, 0.14);
  border-radius: 8px;
  background: rgba(6, 9, 12, 0.48);
  color: #dce7ea;
  font-size: 12px;
  font-weight: 900;
}

.controls-test-status[data-state="assigned"] {
  border-color: rgba(141, 255, 177, 0.38);
  color: #8dffb1;
}

.controls-test-status[data-state="unassigned"] {
  border-color: rgba(242, 203, 87, 0.34);
  color: var(--gold);
}

.controls-test-groups {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.controls-test-chip {
  display: grid;
  gap: 2px;
  min-height: 36px;
  padding: 6px 7px;
  border: 1px solid rgba(244, 247, 248, 0.1);
  border-radius: 8px;
  background: rgba(6, 9, 12, 0.36);
  color: rgba(220, 231, 234, 0.76);
}

.controls-test-chip b,
.controls-test-chip small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.controls-test-chip b {
  font-size: 10px;
  font-weight: 950;
}

.controls-test-chip small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.controls-test-chip[data-state="active"] {
  border-color: rgba(141, 255, 177, 0.38);
  background: rgba(42, 113, 72, 0.28);
  color: #8dffb1;
}

.controls-test-chip[data-state="active"] small {
  color: #8dffb1;
}

.controls-coach {
  display: grid;
  gap: 7px;
  padding: 10px;
  border: 1px solid rgba(141, 255, 177, 0.18);
  border-radius: 8px;
  background: rgba(35, 73, 58, 0.16);
}

.controls-coach strong {
  color: #8dffb1;
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}

.controls-coach-status {
  min-height: 34px;
  padding: 8px 10px;
  border: 1px solid rgba(141, 255, 177, 0.28);
  border-radius: 8px;
  background: rgba(6, 9, 12, 0.44);
  color: #8dffb1;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.35;
}

.controls-coach-status[data-state="warn"] {
  border-color: rgba(242, 203, 87, 0.38);
  color: var(--gold);
}

.controls-coach-tip {
  color: rgba(185, 246, 255, 0.82);
  font-size: 10px;
  font-weight: 850;
  line-height: 1.35;
}

.controls-coach-tip[data-state="warn"] {
  color: #f2cb57;
}

.controls-coach-apply {
  justify-self: start;
  min-height: 30px;
  border: 1px solid rgba(242, 203, 87, 0.34);
  border-radius: 8px;
  background: rgba(6, 9, 12, 0.72);
  color: #f2cb57;
  cursor: pointer;
  font: inherit;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 0;
  padding: 0 10px;
  text-transform: uppercase;
}

.controls-coach-apply[hidden] {
  display: none;
}

.setting-range-row {
  grid-template-columns: minmax(0, 1fr) minmax(170px, 230px);
}

.range-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 50px;
  gap: 10px;
  align-items: center;
  min-width: 0;
}

.range-control input[type="range"] {
  width: 100%;
  accent-color: var(--gold);
}

.range-control strong {
  color: var(--blue);
  font-size: 12px;
  font-weight: 950;
  text-align: right;
}

.haptic-range-control {
  grid-template-columns: minmax(0, 1fr) 50px 56px 58px;
}

.haptic-range-control button {
  min-width: 0;
  padding: 9px 7px;
}

.boss-warning-range-control {
  grid-template-columns: minmax(0, 1fr) 50px 58px;
}

.low-ammo-feedback-range-control {
  grid-template-columns: minmax(0, 1fr) 50px 58px;
}

.low-ammo-feedback-range-control button {
  min-width: 0;
  padding: 9px 7px;
}

#low-ammo-feedback-test:focus-visible {
  border-color: rgba(141, 255, 177, 0.72);
  outline: 2px solid rgba(185, 246, 255, 0.66);
  outline-offset: 2px;
  box-shadow: 0 0 18px rgba(141, 255, 177, 0.18), inset 0 0 0 1px rgba(185, 246, 255, 0.18);
}

.low-ammo-feedback-range-control .haptic-cue-status {
  color: var(--green);
  overflow-wrap: anywhere;
  white-space: normal;
}

.low-ammo-feedback-detail {
  grid-column: 1 / -1;
  margin-top: -2px;
  color: rgba(244, 247, 248, 0.58);
  font-size: 9px;
  font-weight: 750;
  line-height: 1.35;
  letter-spacing: 0;
}

.low-ammo-feedback-detail[data-feedback-mode="soft"] {
  color: rgba(185, 246, 255, 0.78);
}

.low-ammo-feedback-detail[data-feedback-mode="boost"] {
  color: rgba(255, 211, 106, 0.82);
}

.low-ammo-feedback-scale {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin-top: -2px;
  padding-top: 7px;
  position: relative;
  color: rgba(221, 247, 255, 0.56);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.1;
  text-transform: uppercase;
}

.low-ammo-feedback-scale::before,
.low-ammo-feedback-scale::after {
  content: "";
  position: absolute;
  top: 0;
  height: 3px;
  border-radius: 999px;
}

.low-ammo-feedback-scale::before {
  left: 0;
  right: 0;
  background: linear-gradient(90deg, rgba(185, 246, 255, 0.18), rgba(141, 255, 177, 0.28), rgba(242, 203, 87, 0.2));
}

.low-ammo-feedback-range-control:focus-within .low-ammo-feedback-scale::before {
  background: linear-gradient(90deg, rgba(185, 246, 255, 0.3), rgba(141, 255, 177, 0.42), rgba(242, 203, 87, 0.3));
  box-shadow: 0 0 14px rgba(185, 246, 255, 0.12);
}

.low-ammo-feedback-scale::after {
  left: calc(var(--low-ammo-feedback-position, 0.5) * 100%);
  width: 14px;
  background: var(--gold);
  box-shadow: 0 0 12px rgba(242, 203, 87, 0.32);
  transform: translateX(-50%);
}

.low-ammo-feedback-range-control:focus-within .low-ammo-feedback-scale::after {
  box-shadow: 0 0 16px rgba(242, 203, 87, 0.48), 0 0 8px rgba(185, 246, 255, 0.18);
}

@media (prefers-reduced-motion: no-preference) {
  .low-ammo-feedback-scale::after {
    transition: left 180ms ease-out, box-shadow 180ms ease-out;
  }
}

@media (forced-colors: active) {
  .low-ammo-feedback-scale::before,
  .low-ammo-feedback-range-control:focus-within .low-ammo-feedback-scale::before {
    background: CanvasText;
    box-shadow: none;
  }

  .low-ammo-feedback-scale::after,
  .low-ammo-feedback-range-control:focus-within .low-ammo-feedback-scale::after {
    background: Highlight;
    box-shadow: none;
  }
}

.low-ammo-feedback-scale span:nth-child(1) {
  text-align: left;
}

.low-ammo-feedback-scale span:nth-child(2) {
  color: rgba(141, 255, 177, 0.72);
  text-align: center;
}

.low-ammo-feedback-scale span:nth-child(3) {
  text-align: right;
}

.low-ammo-feedback-scale[data-feedback-band="soft"] span:nth-child(1),
.low-ammo-feedback-scale[data-feedback-band="normal"] span:nth-child(2),
.low-ammo-feedback-scale[data-feedback-band="boost"] span:nth-child(3) {
  color: var(--gold);
  text-shadow: 0 0 10px rgba(242, 203, 87, 0.26);
}

.boss-warning-range-control button {
  min-width: 0;
  padding: 9px 7px;
}

#boss-warning-test:focus-visible {
  border-color: rgba(242, 203, 87, 0.72);
  outline: 2px solid rgba(242, 203, 87, 0.62);
  outline-offset: 2px;
  box-shadow: 0 0 18px rgba(242, 203, 87, 0.2);
}

.boss-warning-range-control button:disabled {
  background: linear-gradient(135deg, rgba(242, 203, 87, 0.2), rgba(255, 241, 166, 0.08));
  border-color: rgba(242, 203, 87, 0.42);
  color: var(--gold);
  cursor: wait;
  font-size: 8px;
  opacity: 0.55;
}

.boss-warning-presets {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.boss-warning-presets:focus-within {
  border-radius: 8px;
  outline: 1px solid rgba(185, 246, 255, 0.32);
  outline-offset: 3px;
}

.boss-warning-presets button {
  min-height: 28px;
  padding: 7px 6px;
  font-size: 9px;
}

.boss-warning-presets button.is-selected {
  border-color: rgba(141, 255, 177, 0.58);
  color: var(--green);
  box-shadow: 0 0 14px rgba(141, 255, 177, 0.12);
}

.boss-warning-preset-status {
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  grid-column: 1 / -1;
  letter-spacing: 0;
  text-align: right;
  text-transform: uppercase;
}

.boss-warning-preset-status[data-preset="subtle"],
.boss-warning-preset-status[data-preset="cinematic"] {
  color: var(--green);
}

.boss-warning-presets:focus-within .boss-warning-preset-status {
  color: var(--blue);
}

.boss-warning-meter {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: 0.64fr 1fr;
  gap: 5px;
  height: 7px;
}

.boss-warning-meter i {
  display: block;
  border-radius: 999px;
  background: rgba(242, 203, 87, 0.18);
  box-shadow: inset 0 0 0 1px rgba(242, 203, 87, 0.15);
  opacity: calc(0.34 + var(--boss-warning-cooldown, 0) * 0.52);
  transform: scaleX(calc(0.58 + var(--boss-warning-cooldown, 0) * 0.42));
  transform-origin: left center;
}

.boss-warning-meter.is-flashing i {
  animation: boss-warning-meter-preview 680ms ease-out both;
}

.boss-warning-meter.is-flashing i:nth-child(2) {
  animation-delay: 110ms;
}

.boss-warning-meter.is-cooldown i {
  background: rgba(242, 203, 87, 0.32);
}

.boss-warning-meter.is-ready-returned i {
  background: rgba(141, 255, 177, 0.32);
  box-shadow: inset 0 0 0 1px rgba(141, 255, 177, 0.22), 0 0 12px rgba(141, 255, 177, 0.12);
}

.haptic-cue-status {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  grid-column: 1 / -1;
  letter-spacing: 0;
  text-align: right;
}

.haptic-cue-status.is-ready {
  color: var(--blue);
}

.haptic-cue-status.is-ready.is-ready-returned {
  color: var(--green);
  text-shadow: 0 0 12px rgba(141, 255, 177, 0.18);
}

.haptic-cue-status.is-sent {
  color: var(--green);
}

.haptic-cue-status.is-muted {
  color: var(--orange);
}

#boss-warning-status.is-boss-cooldown {
  color: var(--gold);
  text-shadow: 0 0 12px rgba(242, 203, 87, 0.18);
}

@media (prefers-reduced-motion: no-preference) {
  .setting-row select.is-settings-applied {
    animation: settings-control-applied 720ms ease-out both;
  }

  .setting-motion-readout.is-settings-applied {
    animation: settings-control-applied 720ms ease-out both;
  }

  .haptic-cue-status.is-ready-returned,
  .audio-cue-status.is-ready-returned {
    animation: settings-status-ready-return 680ms ease-out both;
  }

  #boss-warning-status.is-boss-cooldown {
    animation: boss-warning-status-cooldown 900ms ease-in-out infinite alternate;
  }
}

@keyframes settings-control-applied {
  0% {
    background: rgba(6, 9, 12, 0.84);
    box-shadow: inset 0 0 0 1px rgba(141, 255, 177, 0.16), 0 0 0 rgba(141, 255, 177, 0);
  }

  42% {
    background: rgba(24, 52, 41, 0.86);
    box-shadow: inset 0 0 0 1px rgba(141, 255, 177, 0.42), 0 0 18px rgba(141, 255, 177, 0.22);
  }

  100% {
    background: rgba(6, 9, 12, 0.84);
    box-shadow: inset 0 0 0 1px rgba(141, 255, 177, 0.28), 0 0 14px rgba(141, 255, 177, 0.14);
  }
}

@keyframes settings-status-ready-return {
  0% {
    opacity: 0.74;
    transform: translateY(1px);
  }

  42% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes boss-warning-status-cooldown {
  from {
    opacity: 0.72;
    text-shadow: 0 0 8px rgba(242, 203, 87, 0.16);
  }

  to {
    opacity: 1;
    text-shadow: 0 0 16px rgba(242, 203, 87, 0.32);
  }
}

@keyframes boss-warning-meter-preview {
  0% { background: rgba(242, 203, 87, 0.16); transform: scaleX(0.44); }
  38% { background: rgba(255, 241, 166, 0.9); transform: scaleX(1); }
  100% { background: rgba(242, 203, 87, 0.26); transform: scaleX(0.68); }
}

.audio-cue-test-control {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.roof-lock-cue-control {
  display: grid;
  grid-template-columns: minmax(92px, 1fr) auto;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.roof-lock-cue-control small,
.roof-lock-cue-meter {
  grid-column: 1 / -1;
}

.roof-lock-cue-meter {
  display: grid;
  grid-template-columns: 1fr 0.62fr;
  gap: 5px;
  height: 6px;
}

.roof-lock-cue-meter i {
  display: block;
  border-radius: 999px;
  background: rgba(185, 246, 255, 0.18);
  box-shadow: inset 0 0 0 1px rgba(185, 246, 255, 0.14);
}

.roof-lock-cue-meter.is-flashing i {
  animation: roof-lock-cue-preview 560ms ease-out both;
}

.roof-lock-cue-meter.is-flashing i:nth-child(2) {
  animation-delay: 85ms;
}

.audio-cue-meter {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  height: 8px;
}

.audio-cue-meter i {
  display: block;
  border-radius: 999px;
  background: rgba(185, 246, 255, 0.25);
  transform: scaleY(0.48);
  transform-origin: bottom;
}

.audio-cue-meter.is-flashing i {
  animation: settings-audio-meter 640ms ease-out both;
}

.audio-cue-meter.is-flashing i:nth-child(2) {
  animation-delay: 80ms;
}

.audio-cue-meter.is-flashing i:nth-child(3) {
  animation-delay: 160ms;
}

.audio-cue-status {
  color: #8dffb1;
  font-size: 9px;
  font-weight: 950;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
}

.audio-cue-status.is-muted {
  color: #ffb36c;
}

.audio-cue-status.is-playing {
  color: var(--blue);
}

.audio-cue-status.is-ready-returned {
  color: var(--green);
  text-shadow: 0 0 12px rgba(141, 255, 177, 0.18);
}

@keyframes settings-audio-meter {
  0% { background: rgba(185, 246, 255, 0.22); transform: scaleY(0.48); }
  36% { background: rgba(141, 255, 177, 0.92); transform: scaleY(1); }
  100% { background: rgba(185, 246, 255, 0.28); transform: scaleY(0.48); }
}

@keyframes roof-lock-cue-preview {
  0% { background: rgba(185, 246, 255, 0.18); transform: scaleX(0.48); }
  42% { background: rgba(141, 255, 177, 0.9); transform: scaleX(1); }
  100% { background: rgba(185, 246, 255, 0.26); transform: scaleX(0.62); }
}

.settings-summary {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid rgba(185, 246, 255, 0.16);
  border-radius: 8px;
  background: rgba(45, 79, 88, 0.22);
  transition: color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.settings-summary.settings-saved {
  color: #f4f7f8;
  background: rgba(45, 79, 88, 0.56);
  box-shadow: inset 0 0 0 1px rgba(141, 255, 177, 0.3), 0 0 18px rgba(141, 255, 177, 0.12);
}

.help-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.help-grid article {
  min-height: 112px;
  padding: 13px;
  border: 1px solid rgba(244, 247, 248, 0.12);
  border-radius: 8px;
  background: rgba(244, 247, 248, 0.055);
}

.help-grid h2 {
  margin: 0 0 8px;
  color: var(--gold);
  font-size: 14px;
  letter-spacing: 0;
}

.help-grid kbd {
  display: inline-grid;
  min-width: 24px;
  min-height: 20px;
  place-items: center;
  margin: 0 2px;
  padding: 1px 6px;
  border: 1px solid rgba(185, 246, 255, 0.34);
  border-bottom-color: rgba(185, 246, 255, 0.18);
  border-radius: 5px;
  background: rgba(45, 79, 88, 0.38);
  color: #f4f7f8;
  font-family: inherit;
  font-size: 11px;
  font-weight: 950;
  line-height: 1;
  white-space: nowrap;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.28), 0 0 14px rgba(185, 246, 255, 0.08);
}

.badge-glossary span {
  display: inline-block;
  margin: 2px 3px 2px 0;
  padding: 2px 6px;
  border: 1px solid rgba(242, 203, 87, 0.38);
  border-radius: 999px;
  background: rgba(242, 203, 87, 0.09);
  color: var(--gold);
  font-size: 10px;
  font-weight: 950;
  line-height: 1.25;
  text-transform: uppercase;
  white-space: nowrap;
}

#hud {
  position: absolute;
  top: 14px;
  left: 14px;
  right: 14px;
  z-index: 4;
  pointer-events: none;
}

.hud-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.hud-card {
  min-width: 82px;
  height: 52px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(8px);
}

.hud-card strong {
  display: block;
  margin-top: 4px;
  font-size: 16px;
  line-height: 1;
}

.hud-card.objective-pulse {
  border-color: rgba(141, 255, 177, calc(0.38 + var(--objective-pulse, 0) * 0.36));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.2),
    0 0 calc(10px + var(--objective-pulse, 0) * 18px) rgba(141, 255, 177, calc(0.08 + var(--objective-pulse, 0) * 0.16));
}

.hud-card.objective-drop strong {
  color: #8dffb1;
}

.hud-card.objective-danger {
  position: relative;
  overflow: hidden;
  border-color: rgba(255, 179, 108, calc(0.42 + var(--objective-pulse, 0) * 0.36));
  background: rgba(47, 26, 18, 0.78);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(12px + var(--objective-pulse, 0) * 22px) rgba(237, 91, 71, calc(0.1 + var(--objective-pulse, 0) * 0.18));
}

.hud-card.objective-danger::before,
.hud-card.objective-secure::before {
  content: "";
  position: absolute;
  inset: 5px auto 5px 5px;
  width: 3px;
  border-radius: 999px;
  opacity: calc(0.48 + var(--objective-pulse, 0) * 0.38);
  pointer-events: none;
}

.hud-card.objective-danger::before {
  background: #ffb36c;
  box-shadow: 0 0 calc(8px + var(--objective-pulse, 0) * 12px) rgba(237, 91, 71, 0.52);
}

.hud-card.objective-danger strong {
  color: #ffb36c;
}

.hud-card.objective-secure {
  position: relative;
  overflow: hidden;
  border-color: rgba(185, 246, 255, calc(0.42 + var(--objective-pulse, 0) * 0.34));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(12px + var(--objective-pulse, 0) * 20px) rgba(185, 246, 255, calc(0.1 + var(--objective-pulse, 0) * 0.16));
  animation: objective-secure-confirm 0.46s ease-out;
}

.hud-card.objective-secure::before {
  background: #b9f6ff;
  box-shadow: 0 0 calc(8px + var(--objective-pulse, 0) * 12px) rgba(185, 246, 255, 0.5);
}

.hud-card.objective-secure strong {
  color: #b9f6ff;
}

.hud-card.objective-lane-nudge {
  position: relative;
  overflow: hidden;
}

.hud-card.objective-route-stitch-wave {
  position: relative;
  overflow: hidden;
  box-shadow:
    inset 0 -2px 0 rgba(185, 246, 255, calc(0.2 + var(--objective-route-stitch-wave-pulse, 0) * 0.34)),
    0 0 calc(8px + var(--objective-route-stitch-wave-pulse, 0) * 12px) rgba(141, 255, 177, 0.18);
}

.hud-card.objective-route-lock {
  position: relative;
  overflow: hidden;
  border-color: rgba(141, 255, 177, calc(0.42 + var(--objective-route-lock-pulse, 0) * 0.34));
  box-shadow:
    inset 0 0 calc(8px + var(--objective-route-lock-pulse, 0) * 12px) rgba(141, 255, 177, calc(0.08 + var(--objective-route-lock-pulse, 0) * 0.12)),
    0 0 calc(10px + var(--objective-route-lock-pulse, 0) * 14px) rgba(185, 246, 255, 0.18);
}

.hud-card.objective-route-lock-arrival {
  border-color: rgba(185, 246, 255, calc(0.36 + var(--objective-route-lock-arrival-pulse, 0) * 0.34));
  box-shadow:
    inset 0 0 calc(6px + var(--objective-route-lock-arrival-pulse, 0) * 10px) rgba(185, 246, 255, calc(0.07 + var(--objective-route-lock-arrival-pulse, 0) * 0.16)),
    0 0 calc(8px + var(--objective-route-lock-arrival-pulse, 0) * 12px) rgba(141, 255, 177, 0.2);
}

.hud-card.objective-route-lock-arrival::after {
  content: attr(data-route-lock-arrival);
  position: absolute;
  right: 10px;
  bottom: 8px;
  color: rgba(185, 246, 255, calc(0.62 + var(--objective-route-lock-arrival-pulse, 0) * 0.32));
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0;
  pointer-events: none;
  text-shadow: 0 0 calc(5px + var(--objective-route-lock-arrival-pulse, 0) * 8px) rgba(185, 246, 255, 0.46);
  transform: translateY(calc(var(--objective-route-lock-arrival-pulse, 0) * -1px));
}

.hud-card.objective-extraction-meter {
  position: relative;
  overflow: hidden;
  background-image:
    linear-gradient(
      90deg,
      rgba(141, 255, 177, 0.2) 0,
      rgba(185, 246, 255, 0.3) calc(var(--objective-extraction-progress, 0) * 100%),
      transparent calc(var(--objective-extraction-progress, 0) * 100%)
    );
  background-blend-mode: screen;
}

.hud-card.objective-extraction-meter {
  box-shadow:
    inset 0 -2px 0 rgba(141, 255, 177, calc(0.18 + var(--objective-extraction-progress, 0) * 0.36)),
    0 0 calc(6px + var(--objective-extraction-progress, 0) * 10px) rgba(185, 246, 255, 0.14);
}

.hud-card.objective-route-stitch-wave::before {
  content: "";
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 4px;
  height: 3px;
  border-radius: 999px;
  background:
    repeating-linear-gradient(
      90deg,
      rgba(185, 246, 255, 0.94) 0 4px,
      rgba(141, 255, 177, 0.62) 4px 7px,
      transparent 7px calc(100% / var(--objective-route-stitch-wave-ticks, 5))
    );
  opacity: calc(0.22 + var(--objective-route-stitch-wave-pulse, 0) * 0.72);
  transform: scaleX(calc(0.72 + var(--objective-route-stitch-wave-pulse, 0) * 0.28));
  transform-origin: left center;
  filter: drop-shadow(0 0 5px rgba(185, 246, 255, 0.54));
  pointer-events: none;
}

.hud-card.objective-lane-nudge::after {
  content: attr(data-lane-nudge);
  position: absolute;
  top: 6px;
  right: 7px;
  min-width: 22px;
  text-align: center;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0;
  color: #fff1a6;
  opacity: calc(0.58 + var(--objective-lane-nudge-pulse, 0) * 0.34);
  text-shadow:
    0 0 7px rgba(255, 241, 166, 0.74),
    0 0 14px rgba(185, 246, 255, 0.28);
  transform: translateX(var(--objective-lane-nudge-x, 0px));
  animation: objective-lane-nudge 0.52s ease-in-out infinite alternate;
  pointer-events: none;
}

.hud-card.objective-route-stitch-wave:not(.objective-lane-nudge)::after {
  content: attr(data-route-stitch-wave);
  position: absolute;
  top: 6px;
  right: 7px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0;
  color: #b9f6ff;
  opacity: calc(0.44 + var(--objective-route-stitch-wave-pulse, 0) * 0.42);
  text-shadow: 0 0 8px rgba(185, 246, 255, 0.64);
  pointer-events: none;
}

.hud-card.objective-route-stitch-wave.objective-lane-nudge::after {
  content: attr(data-lane-nudge) " " attr(data-route-stitch-wave);
}

.hud-card.objective-route-lock strong {
  color: #8dffb1;
  text-shadow: 0 0 calc(8px + var(--objective-route-lock-pulse, 0) * 8px) rgba(141, 255, 177, 0.48);
}

.hud-card.objective-route-lock strong::after {
  content: attr(data-route-lock);
  display: inline-block;
  margin-left: 7px;
  padding: 1px 4px;
  border-radius: 4px;
  font-size: 8px;
  line-height: 1;
  vertical-align: 1px;
  color: #071510;
  background: rgba(141, 255, 177, calc(0.66 + var(--objective-route-lock-pulse, 0) * 0.22));
  box-shadow: 0 0 calc(6px + var(--objective-route-lock-pulse, 0) * 8px) rgba(141, 255, 177, 0.42);
  opacity: calc(0.58 + var(--objective-route-lock-pulse, 0) * 0.36);
  transform: translateY(calc(var(--objective-route-lock-pulse, 0) * -1px));
}

@keyframes objective-lane-nudge {
  from {
    transform: translateX(calc(var(--objective-lane-nudge-x, 0px) - 3px));
  }

  to {
    transform: translateX(calc(var(--objective-lane-nudge-x, 0px) + 3px));
  }
}

@keyframes objective-secure-confirm {
  0% {
    transform: translateY(1px) scale(0.99);
  }
  45% {
    transform: translateY(-1px) scale(1.018);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

.hud-card.warmup-card {
  min-width: 96px;
  border-color: rgba(141, 255, 177, calc(0.36 + var(--warmup-pulse, 0) * 0.34));
  background: rgba(14, 37, 25, 0.82);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(10px + var(--warmup-pulse, 0) * 18px) rgba(141, 255, 177, calc(0.08 + var(--warmup-pulse, 0) * 0.18));
}

.hud-card.warmup-card strong {
  color: #8dffb1;
}

.hud-card.warmup-card.warmup-pulse {
  animation: warmup-shield-pulse 0.42s ease-out;
}

.hud-card.coach-kit {
  min-width: 164px;
  border-color: rgba(242, 203, 87, calc(0.34 + var(--coach-kit-pulse, 0) * 0.36));
  background: rgba(51, 43, 20, 0.82);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(10px + var(--coach-kit-pulse, 0) * 20px) rgba(242, 203, 87, calc(0.08 + var(--coach-kit-pulse, 0) * 0.18));
}

.hud-card.coach-kit strong {
  color: var(--gold);
  font-size: 12px;
  line-height: 1.1;
  white-space: nowrap;
}

.hud-card.coach-kit.coach-kit-pulse {
  animation: coach-kit-hud-pulse 0.68s ease-out;
}

.hud-card.coach-kit.coach-kit-loaded {
  border-color: rgba(141, 255, 177, calc(0.42 + var(--coach-kit-pulse, 0) * 0.28));
  animation: coach-kit-loaded-shimmer 0.9s ease-out;
}

.hud-card.coach-kit.coach-kit-loaded span {
  color: rgba(141, 255, 177, 0.92);
}

.hud-card.coach-kit.coach-kit-continue {
  background: linear-gradient(90deg, rgba(51, 43, 20, 0.86), rgba(50, 82, 42, 0.78));
}

.hud-card.coach-kit.coach-kit-restart {
  background: linear-gradient(90deg, rgba(51, 43, 20, 0.86), rgba(26, 65, 78, 0.76));
}

@keyframes coach-kit-hud-pulse {
  0% {
    transform: translateY(0) scale(1);
  }
  44% {
    transform: translateY(-1px) scale(1.04);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes coach-kit-loaded-shimmer {
  0% {
    filter: brightness(1);
    box-shadow:
      0 10px 28px rgba(0, 0, 0, 0.22),
      0 0 10px rgba(141, 255, 177, 0.12);
  }
  46% {
    filter: brightness(1.18);
    box-shadow:
      0 12px 30px rgba(0, 0, 0, 0.24),
      0 0 28px rgba(141, 255, 177, 0.36);
  }
  100% {
    filter: brightness(1);
  }
}

@keyframes warmup-shield-pulse {
  0% {
    transform: translateY(0) scale(1);
  }
  46% {
    transform: translateY(-1px) scale(1.04);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

.hud-card.radio-queue {
  position: relative;
  min-width: 118px;
  border-color: rgba(185, 246, 255, calc(0.3 + var(--radio-queue-pulse, 0) * 0.34));
}

.hud-card.radio-queue strong {
  color: #b9f6ff;
  white-space: nowrap;
}

.hud-card.radio-queue.radio-queue-active {
  border-color: rgba(255, 241, 166, 0.58);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(10px + var(--radio-queue-pulse, 0) * 18px) rgba(255, 241, 166, calc(0.08 + var(--radio-queue-pulse, 0) * 0.16));
}

.hud-card.radio-queue.radio-queue-active strong {
  color: #fff1a6;
}

.hud-card.radio-queue.radio-queue-urgent {
  background: rgba(18, 43, 52, 0.8);
  animation: radio-queue-hud-pulse 0.72s ease-out;
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(12px + var(--radio-queue-pulse, 0) * 22px) rgba(185, 246, 255, calc(0.1 + var(--radio-queue-pulse, 0) * 0.18));
}

.hud-card.radio-queue.radio-queue-secured {
  border-color: rgba(141, 255, 177, calc(0.52 + var(--radio-queue-pulse, 0) * 0.28));
  background:
    linear-gradient(90deg, rgba(141, 255, 177, calc(0.1 + var(--radio-queue-pulse, 0) * 0.08)), rgba(18, 43, 52, 0.82) 42%, rgba(185, 246, 255, calc(0.08 + var(--radio-queue-pulse, 0) * 0.08)));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(14px + var(--radio-queue-pulse, 0) * 20px) rgba(141, 255, 177, calc(0.14 + var(--radio-queue-pulse, 0) * 0.18)),
    inset 0 0 calc(8px + var(--radio-queue-pulse, 0) * 10px) rgba(185, 246, 255, 0.12);
}

.hud-card.radio-queue.radio-queue-secured strong {
  color: #8dffb1;
  text-shadow: 0 0 calc(8px + var(--radio-queue-pulse, 0) * 8px) rgba(141, 255, 177, 0.58);
}

.hud-card.radio-queue.radio-queue-locked {
  opacity: 0.74;
}

.hud-card.radio-queue.radio-queue-next {
  padding-left: 24px;
  padding-right: 28px;
}

.hud-card.radio-queue.radio-queue-next::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--radio-next-accent, #fff1a6);
  box-shadow: 0 0 10px var(--radio-next-accent, #fff1a6);
  opacity: calc(0.72 + var(--radio-queue-pulse, 0) * 0.2);
  transform: translateY(-50%);
}

.hud-card.radio-queue.radio-queue-next[data-next-pattern="danger"]::before {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  transform: translateY(-50%) rotate(45deg);
  animation: radio-objective-danger 0.46s ease-in-out infinite alternate;
}

.hud-card.radio-queue.radio-queue-next[data-next-pattern="rescue"]::before {
  box-shadow:
    0 0 10px var(--radio-next-accent, #9dffbd),
    0 0 0 3px rgba(157, 255, 189, 0.14);
  animation: radio-objective-soft 0.86s ease-in-out infinite alternate;
}

.hud-card.radio-queue.radio-queue-next[data-next-pattern="supply"]::before {
  box-shadow:
    0 0 10px var(--radio-next-accent, #fff1a6),
    0 -6px 0 -3px var(--radio-next-accent, #fff1a6),
    0 6px 0 -3px var(--radio-next-accent, #fff1a6);
}

.hud-card.radio-queue.radio-queue-next[data-next-pattern="signal"]::before {
  animation: radio-objective-signal 0.72s steps(2, end) infinite;
}

.hud-card.radio-queue.radio-queue-next[data-next-pattern="evac"]::before {
  width: 10px;
  height: 4px;
  border-radius: 3px;
}

.hud-card.radio-queue.radio-queue-next[data-next-pattern="power"]::before {
  border-radius: 1px;
  box-shadow:
    0 0 10px var(--radio-next-accent, #8bd9ff),
    0 0 0 2px rgba(139, 217, 255, 0.16);
}

.hud-card.radio-queue.radio-queue-next::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 9px solid var(--radio-next-accent, #fff1a6);
  filter: drop-shadow(0 0 7px var(--radio-next-accent, #fff1a6));
  opacity: calc(0.72 + var(--radio-queue-pulse, 0) * 0.22);
  transform: translateY(-50%) rotate(var(--radio-next-rot, 0deg));
  transform-origin: 50% 58%;
}

.hud-card.radio-queue.radio-queue-next strong {
  color: var(--radio-next-accent, #fff1a6);
}

.hud-card.radio-queue.radio-queue-reply-shimmer {
  overflow: hidden;
  background:
    linear-gradient(
      110deg,
      rgba(255, 255, 255, 0) 0%,
      var(--radio-next-glow-soft, rgba(255, 241, 166, 0.08)) 34%,
      var(--radio-next-glow, rgba(255, 241, 166, 0.22)) 48%,
      var(--radio-next-glow-soft, rgba(255, 241, 166, 0.08)) 60%,
      rgba(255, 255, 255, 0) 78%
    ),
    rgba(18, 43, 52, 0.82);
  background-size: 240% 100%, auto;
  background-position: 150% 0, 0 0;
  animation: radio-reply-card-sweep 0.82s ease-out, radio-queue-hud-pulse 0.72s ease-out;
}

.hud-card.radio-queue.radio-queue-reply-shimmer.radio-queue-next {
  box-shadow:
    inset 0 3px 0 var(--radio-next-accent, #fff1a6),
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 var(--radio-next-glow, 24px) var(--radio-next-glow-soft, rgba(185, 246, 255, 0.18));
}

.hud-card.radio-queue.radio-queue-reply-shimmer.radio-queue-next::before {
  animation: radio-next-ready-dot 0.82s ease-out;
}

.hud-card.radio-queue.radio-queue-reply-shimmer.radio-queue-next::after {
  animation: radio-direction-notch-ping 0.82s ease-out;
}

.hud-card.radio-queue.radio-queue-reply-shimmer strong {
  display: inline-block;
  animation: radio-reply-shimmer 0.82s ease-out;
  text-shadow:
    0 0 8px var(--radio-next-accent, #fff1a6),
    0 0 16px rgba(185, 246, 255, 0.22);
}

.hud-card.radio-queue.radio-queue-boarding-clear {
  border-color: rgba(141, 255, 177, calc(0.62 + var(--radio-queue-pulse, 0) * 0.24));
  background:
    linear-gradient(100deg, rgba(141, 255, 177, 0.16), rgba(18, 43, 52, 0.84) 34%, rgba(185, 246, 255, 0.16) 58%, rgba(141, 255, 177, 0.12)),
    rgba(18, 43, 52, 0.86);
  box-shadow:
    0 0 0 1px rgba(141, 255, 177, calc(0.08 + var(--radio-queue-pulse, 0) * 0.18)),
    0 0 calc(16px + var(--radio-queue-pulse, 0) * 18px) rgba(141, 255, 177, 0.28),
    inset 0 0 18px rgba(185, 246, 255, 0.1);
}

.hud-card.radio-queue.radio-queue-boarding-clear strong {
  color: #eaffcf;
  letter-spacing: 0;
  text-shadow:
    0 0 calc(10px + var(--radio-queue-pulse, 0) * 10px) rgba(141, 255, 177, 0.7),
    0 0 calc(18px + var(--radio-queue-pulse, 0) * 12px) rgba(185, 246, 255, 0.28);
}

.hud-card.radio-queue.radio-queue-boarding-clear.radio-queue-reply-shimmer {
  animation:
    radio-boarding-clear-sweep 0.82s ease-out,
    radio-queue-hud-pulse 0.72s ease-out;
}

.hud-card.radio-queue.radio-queue-boarding-edge-glint::after {
  content: "";
  position: absolute;
  top: 7px;
  bottom: 7px;
  right: 5px;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(185, 246, 255, 0), rgba(141, 255, 177, calc(0.32 + var(--radio-boarding-edge-glint, 0) * 0.54)), rgba(185, 246, 255, 0));
  box-shadow:
    0 0 calc(8px + var(--radio-boarding-edge-glint, 0) * 14px) rgba(141, 255, 177, calc(0.12 + var(--radio-boarding-edge-glint, 0) * 0.3)),
    0 0 calc(4px + var(--radio-boarding-edge-glint, 0) * 8px) rgba(185, 246, 255, 0.16);
  opacity: clamp(0, var(--radio-boarding-edge-glint, 0), 1);
  pointer-events: none;
  transform: translateX(calc((1 - var(--radio-boarding-edge-side, 1)) * -1px)) scaleY(calc(0.62 + var(--radio-boarding-edge-glint, 0) * 0.28));
}

.hud-card.radio-queue.radio-queue-aligned {
  border-color: rgba(141, 255, 177, 0.72);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 26px rgba(141, 255, 177, 0.24);
}

.hud-card.radio-queue.radio-queue-aligned strong::after {
  content: " LOCK";
  color: rgba(141, 255, 177, 0.96);
  font-size: 10px;
  font-weight: 900;
  margin-left: 4px;
  text-shadow: 0 0 8px rgba(141, 255, 177, 0.48);
}

@keyframes radio-reply-card-sweep {
  0% {
    background-position: 150% 0, 0 0;
    border-color: rgba(185, 246, 255, 0.32);
  }
  42% {
    background-position: 54% 0, 0 0;
    border-color: var(--radio-next-glow, rgba(255, 241, 166, 0.22));
  }
  100% {
    background-position: -80% 0, 0 0;
    border-color: rgba(185, 246, 255, 0.34);
  }
}

@keyframes radio-boarding-clear-sweep {
  0% {
    filter: brightness(1.26) saturate(1.18);
    background-position: 138% 0, 0 0;
    transform: translateY(-1px);
  }
  42% {
    filter: brightness(1.14) saturate(1.1);
    background-position: 42% 0, 0 0;
  }
  100% {
    filter: brightness(1) saturate(1);
    background-position: -36% 0, 0 0;
    transform: translateY(0);
  }
}

@keyframes radio-direction-notch-ping {
  0% {
    opacity: 0.5;
    filter: drop-shadow(0 0 4px var(--radio-next-accent, #fff1a6));
    transform: translateY(-50%) rotate(var(--radio-next-rot, 0deg)) scale(0.82) translateY(0);
  }
  38% {
    opacity: 1;
    filter:
      drop-shadow(0 0 8px var(--radio-next-accent, #fff1a6))
      drop-shadow(0 0 16px var(--radio-next-glow, rgba(255, 241, 166, 0.22)));
    transform: translateY(-50%) rotate(var(--radio-next-rot, 0deg)) scale(1.22) translateY(-2px);
  }
  100% {
    opacity: calc(0.72 + var(--radio-queue-pulse, 0) * 0.22);
    filter: drop-shadow(0 0 7px var(--radio-next-accent, #fff1a6));
    transform: translateY(-50%) rotate(var(--radio-next-rot, 0deg)) scale(1) translateY(0);
  }
}

@keyframes radio-next-ready-dot {
  0% {
    opacity: 1;
    transform: translateY(-50%) scale(1.7);
    box-shadow:
      0 0 12px var(--radio-next-accent, #fff1a6),
      0 0 0 0 rgba(255, 241, 166, 0.34);
  }
  48% {
    opacity: 0.94;
    transform: translateY(-50%) scale(1.16);
    box-shadow:
      0 0 14px var(--radio-next-accent, #fff1a6),
      0 0 0 8px rgba(255, 241, 166, 0.08);
  }
  100% {
    opacity: calc(0.72 + var(--radio-queue-pulse, 0) * 0.2);
    transform: translateY(-50%) scale(1);
    box-shadow: 0 0 10px var(--radio-next-accent, #fff1a6);
  }
}

@keyframes radio-reply-shimmer {
  0% {
    opacity: 0.72;
    filter: brightness(1);
    transform: translateY(0) scale(1);
  }
  36% {
    opacity: 1;
    filter: brightness(1.46);
    transform: translateY(-1px) scale(1.025);
  }
  100% {
    opacity: 1;
    filter: brightness(1);
    transform: translateY(0) scale(1);
  }
}

@keyframes radio-objective-danger {
  from {
    opacity: 0.62;
    filter: brightness(0.92);
  }
  to {
    opacity: 1;
    filter: brightness(1.35);
  }
}

@keyframes radio-objective-soft {
  from {
    transform: translateY(-50%) scale(0.92);
  }
  to {
    transform: translateY(-50%) scale(1.12);
  }
}

@keyframes radio-objective-signal {
  0%, 100% {
    opacity: 0.48;
  }
  50% {
    opacity: 1;
  }
}

@keyframes radio-queue-hud-pulse {
  0% {
    transform: translateY(0) scale(1);
  }
  42% {
    transform: translateY(-1px) scale(1.03);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

.route-side-chirp {
  position: fixed;
  z-index: 24;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: min(210px, calc(100vw - 44px));
  padding: 5px 8px;
  border: 1px solid var(--route-chirp-glow, rgba(255, 241, 166, 0.2));
  border-radius: 6px;
  background: rgba(8, 18, 23, 0.72);
  color: var(--route-chirp-accent, #fff1a6);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  text-shadow: 0 0 8px var(--route-chirp-glow, rgba(255, 241, 166, 0.2));
  pointer-events: none;
  box-shadow:
    0 0 14px var(--route-chirp-glow, rgba(255, 241, 166, 0.2)),
    inset 0 0 12px rgba(185, 246, 255, 0.06);
}

.route-side-chirp i {
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 9px solid var(--route-chirp-accent, #fff1a6);
  filter: drop-shadow(0 0 7px var(--route-chirp-accent, #fff1a6));
}

.route-side-chirp span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.route-side-chirp[data-direction="ahead"] {
  left: 50%;
  top: 86px;
  transform: translateX(-50%);
}

.route-side-chirp[data-direction="right"] {
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}

.route-side-chirp[data-direction="behind"] {
  left: 50%;
  bottom: 74px;
  transform: translateX(-50%);
}

.route-side-chirp[data-direction="left"] {
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
}

.route-side-chirp[data-direction="right"] i {
  transform: rotate(90deg);
}

.route-side-chirp[data-direction="behind"] i {
  transform: rotate(180deg);
}

.route-side-chirp[data-direction="left"] i {
  transform: rotate(-90deg);
}

.route-side-chirp.route-side-chirp-active {
  animation: route-side-chirp-ping 0.82s ease-out;
}

@keyframes route-side-chirp-ping {
  0% {
    opacity: 0;
    filter: brightness(0.92);
  }
  36% {
    opacity: 1;
    filter: brightness(1.34);
  }
  100% {
    opacity: 0;
    filter: brightness(1);
  }
}

.hud-card.flight-card {
  min-width: 224px;
  border-color: rgba(185, 246, 255, 0.36);
}

.hud-card.flight-card strong {
  color: var(--blue);
  font-size: 12px;
  line-height: 1.1;
  white-space: nowrap;
}

.hud-card.flight-card.heli-flight-active {
  background: rgba(18, 43, 52, 0.78);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 22px rgba(185, 246, 255, 0.14);
}

.hud-card.flight-card.heli-flight-climb {
  border-color: rgba(141, 255, 177, 0.58);
}

.hud-card.flight-card.heli-flight-climb strong,
.hud-card.flight-card.heli-flight-mouse strong {
  color: #8dffb1;
}

.hud-card.flight-card.heli-flight-descend,
.hud-card.flight-card.heli-flight-low {
  border-color: rgba(255, 179, 108, 0.62);
}

.hud-card.flight-card.heli-flight-descend strong,
.hud-card.flight-card.heli-flight-low strong {
  color: #ffb36c;
}

.hud-card.flight-card.heli-flight-exit-ready {
  border-color: rgba(141, 255, 177, 0.64);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 18px rgba(141, 255, 177, 0.16);
}

.hud-card.flight-card.heli-flight-exit-ready strong {
  color: #8dffb1;
}

.hud-card.flight-card.heli-flight-extraction-altitude {
  border-color: rgba(255, 211, 106, 0.82);
  background: rgba(52, 34, 18, 0.84);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.24),
    0 0 calc(18px + var(--heli-extraction-altitude-pulse, 0) * 18px) rgba(255, 140, 56, 0.22);
  transform: translateY(calc(var(--heli-extraction-altitude-pulse, 0) * -1px));
}

.hud-card.flight-card.heli-flight-extraction-altitude strong {
  color: #ffd36a;
  text-shadow: 0 0 calc(8px + var(--heli-extraction-altitude-pulse, 0) * 8px) rgba(255, 140, 56, 0.42);
}

.hud-card.flight-card.heli-flight-alt-ok {
  border-color: rgba(141, 255, 177, 0.82);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(16px + var(--heli-alt-ok-pulse, 0) * 18px) rgba(141, 255, 177, 0.2);
  transform: translateY(calc(var(--heli-alt-ok-pulse, 0) * -0.8px));
}

.hud-card.flight-card.heli-flight-alt-ok strong {
  color: #8dffb1;
  text-shadow: 0 0 calc(7px + var(--heli-alt-ok-pulse, 0) * 7px) rgba(141, 255, 177, 0.38);
}

.hud-card.flight-card.heli-flight-crew-clear {
  border-color: rgba(185, 246, 255, 0.84);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(16px + var(--heli-crew-clear-pulse, 0) * 18px) rgba(185, 246, 255, 0.18);
  transform: translateY(calc(var(--heli-crew-clear-pulse, 0) * -0.7px));
}

.hud-card.flight-card.heli-flight-crew-clear strong {
  color: #b9f6ff;
  text-shadow: 0 0 calc(7px + var(--heli-crew-clear-pulse, 0) * 7px) rgba(185, 246, 255, 0.38);
}

.hud-card.flight-card.heli-flight-exit-high {
  border-color: rgba(255, 179, 108, 0.7);
}

.hud-card.flight-card.heli-flight-exit-high strong {
  color: #ffb36c;
}

.hud-card.flight-card.heli-flight-exit-assist {
  animation: heli-exit-assist-pulse 0.58s ease-out;
}

.hud-card.boss-threat {
  min-width: 188px;
  border-color: rgba(255, 179, 108, 0.48);
  background: rgba(47, 26, 18, 0.78);
}

.hud-card.boss-threat strong {
  color: #ffb36c;
  font-size: 12px;
  line-height: 1.1;
  margin-top: 2px;
  white-space: nowrap;
}

.hud-card.boss-threat small {
  color: #dce7ea;
  display: block;
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
  margin-top: 2px;
  white-space: nowrap;
}

.hud-card.boss-threat.boss-threat-active {
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 20px rgba(255, 179, 108, 0.14);
}

.hud-card.boss-threat[data-direction="ahead"] {
  border-top-color: rgba(255, 231, 151, 0.76);
}

.hud-card.boss-threat[data-direction="behind"] {
  border-bottom-color: rgba(237, 91, 71, 0.82);
}

.hud-card.boss-threat[data-direction="left"] {
  border-left-color: rgba(110, 231, 183, 0.86);
}

.hud-card.boss-threat[data-direction="right"] {
  border-right-color: rgba(110, 231, 183, 0.86);
}

.hud-card.boss-threat.boss-threat-critical {
  border-color: rgba(237, 91, 71, 0.72);
  background: rgba(62, 22, 18, 0.82);
}

.hud-card.boss-threat.boss-threat-critical strong {
  color: #fff1a6;
}

.hud-card.boss-threat.boss-threat-weak-window {
  border-color: rgba(141, 255, 177, 0.88);
  background: rgba(12, 34, 22, 0.84);
  box-shadow: 0 0 22px rgba(141, 255, 177, 0.18), 0 0 34px rgba(255, 241, 166, 0.12);
}

.hud-card.boss-threat.boss-threat-weak-window strong {
  color: #8dffb1;
  text-shadow: 0 0 12px rgba(141, 255, 177, 0.54);
}

.hud-card.boss-threat.boss-threat-critical[data-direction="ahead"] {
  border-top-color: rgba(255, 231, 151, 0.9);
}

.hud-card.boss-threat.boss-threat-critical[data-direction="behind"] {
  border-bottom-color: rgba(255, 231, 151, 0.9);
}

.hud-card.boss-threat.boss-threat-critical[data-direction="left"] {
  border-left-color: rgba(110, 231, 183, 0.94);
}

.hud-card.boss-threat.boss-threat-critical[data-direction="right"] {
  border-right-color: rgba(110, 231, 183, 0.94);
}

.hud-card.boss-phase {
  position: relative;
  min-width: 176px;
  overflow: hidden;
  border-color: rgba(185, 246, 255, 0.36);
  background: rgba(16, 26, 31, 0.78);
}

.hud-card.boss-phase strong {
  color: #b9f6ff;
  font-size: 12px;
  line-height: 1;
  margin-top: 2px;
  white-space: nowrap;
}

.hud-card.boss-phase small {
  display: block;
  margin-top: 2px;
  color: #dce7ea;
  font-size: 8px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.boss-phase-meter {
  position: absolute;
  right: 9px;
  bottom: 6px;
  left: 9px;
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(244, 247, 248, 0.1);
}

.boss-phase-meter b {
  display: block;
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #ed5b47, #ffb36c, #b9f6ff);
  box-shadow: 0 0 10px rgba(185, 246, 255, 0.34);
}

.boss-phase-meter em {
  position: absolute;
  top: -2px;
  bottom: -2px;
  left: 50%;
  width: 2px;
  background: #fff1a6;
  box-shadow: 0 0 8px rgba(255, 241, 166, 0.72);
}

.hud-card.boss-phase.boss-phase-active {
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 20px rgba(185, 246, 255, 0.12);
}

.hud-card.boss-phase.boss-phase-near-break {
  border-color: rgba(255, 179, 108, 0.72);
  background: rgba(45, 29, 16, 0.82);
}

.hud-card.boss-phase.boss-phase-near-break strong {
  color: #ffb36c;
}

.hud-card.boss-phase.boss-phase-weak-window {
  border-color: rgba(141, 255, 177, 0.86);
  background: rgba(12, 34, 22, 0.84);
}

.hud-card.boss-phase.boss-phase-weak-window strong {
  color: #8dffb1;
  text-shadow: 0 0 12px rgba(141, 255, 177, 0.54);
}

.hud-card.boss-phase.boss-phase-weak-window .boss-phase-meter b {
  background: linear-gradient(90deg, #8dffb1, #fff1a6);
  box-shadow: 0 0 14px rgba(141, 255, 177, 0.42);
}

.hud-card.boss-phase.boss-phase-two {
  border-color: rgba(237, 91, 71, 0.62);
  background: rgba(50, 18, 17, 0.82);
}

.hud-card.boss-phase.boss-phase-two strong {
  color: #fff1a6;
}

.hud-card.heli-weapons {
  min-width: 236px;
}

.hud-card.heli-weapons strong {
  font-size: 11px;
  white-space: nowrap;
}

.hud-card.atomic {
  border-color: rgba(242, 203, 87, 0.34);
}

.hud-card.atomic strong {
  color: var(--gold);
}

.hud-card.tactical {
  min-width: 206px;
  border-color: rgba(141, 255, 177, 0.3);
  background: rgba(18, 43, 34, 0.76);
}

.hud-card.tactical strong {
  color: #8dffb1;
  font-size: 11px;
  white-space: nowrap;
}

.hud-card.chain-active {
  border-color: rgba(255, 241, 166, 0.5);
  background: rgba(66, 49, 16, 0.76);
}

.hud-card.chain-active strong {
  color: #fff1a6;
  text-shadow: 0 0 14px rgba(255, 213, 109, 0.46);
}

.hud-card.chain-route {
  border-color: rgba(185, 246, 255, calc(0.34 + var(--route-lock-chain-pulse, 0) * 0.28));
  background: rgba(20, 48, 54, 0.76);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(12px + var(--route-lock-chain-pulse, 0) * 18px) rgba(185, 246, 255, calc(0.08 + var(--route-lock-chain-pulse, 0) * 0.14));
}

.hud-card.chain-route strong {
  color: #b9f6ff;
  font-size: 13px;
  white-space: nowrap;
  text-shadow: 0 0 14px rgba(185, 246, 255, 0.42);
}

.hud-card.chain-route-ready {
  border-color: rgba(255, 241, 166, 0.86);
  background: rgba(72, 52, 16, 0.84);
  animation: boss-chain-hud-pulse 0.68s ease-out;
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.24),
    0 0 30px rgba(255, 241, 166, 0.28),
    inset 0 0 18px rgba(185, 246, 255, 0.1);
}

.hud-card.chain-route-ready strong {
  color: #fff1a6;
  text-shadow: 0 0 16px rgba(255, 241, 166, 0.56);
}

.hud-card.chain-route-stop-read {
  position: relative;
  overflow: hidden;
  border-color: rgba(var(--route-lock-stop-read-rgb, 255, 241, 166), calc(0.58 + var(--route-lock-chain-pulse, 0) * 0.24));
  background:
    linear-gradient(90deg, rgba(var(--route-lock-stop-read-rgb, 255, 241, 166), calc(0.14 + var(--route-lock-chain-pulse, 0) * 0.1)), rgba(20, 48, 54, 0.78));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.24),
    0 0 calc(18px + var(--route-lock-chain-pulse, 0) * 18px) rgba(var(--route-lock-stop-read-rgb, 255, 241, 166), calc(0.18 + var(--route-lock-chain-pulse, 0) * 0.14)),
    inset 0 0 18px rgba(185, 246, 255, 0.08);
}

.hud-card.chain-route-stop-read strong {
  color: rgb(var(--route-lock-stop-read-rgb, 255, 241, 166));
  text-shadow: 0 0 16px rgba(var(--route-lock-stop-read-rgb, 255, 241, 166), 0.58);
}

.hud-card.chain-route-stop-visual span {
  color: rgba(var(--route-lock-stop-read-rgb, 255, 241, 166), 0.9);
  text-shadow: 0 0 10px rgba(var(--route-lock-stop-read-rgb, 255, 241, 166), 0.46);
}

.hud-card.chain-route-stop-read::after {
  content: "";
  position: absolute;
  right: 9px;
  bottom: 5px;
  left: 9px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(var(--route-lock-stop-read-rgb, 255, 241, 166), 0), rgba(var(--route-lock-stop-read-rgb, 255, 241, 166), 0.76), rgba(185, 246, 255, 0.34));
  box-shadow: 0 0 10px rgba(var(--route-lock-stop-read-rgb, 255, 241, 166), 0.52);
  opacity: calc(0.32 + var(--route-lock-chain-pulse, 0) * 0.34);
  transform: scaleX(calc(0.34 + var(--route-lock-chain-pulse, 0) * 0.5));
  transform-origin: left center;
  pointer-events: none;
  animation: route-lock-stop-read-tick 0.72s ease-out;
}

.hud-card.chain-hot {
  border-color: rgba(255, 179, 108, 0.72);
  background: rgba(88, 38, 14, 0.8);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 26px rgba(255, 166, 72, 0.2);
}

.hud-card.chain-hot strong {
  color: #ffdd80;
}

.hud-card.chain-mutant {
  --mutant-chain-rgb: 255, 121, 242;
  --mutant-chain-pulse: 0;
  --mutant-chain-side: 0;
  --mutant-chain-side-nudge: 0;
  --mutant-chain-audio-pan: 0;
  --mutant-chain-pan-side: 0;
  --mutant-chain-low-fps: 0;
  --mutant-chain-card-glow-size: 18px;
  --mutant-chain-stripe-alpha: 0.22;
  --mutant-chain-stripe-glow-size: 7px;
  --mutant-chain-text-glow-size: 9px;
  position: relative;
  overflow: hidden;
  border-color: rgba(var(--mutant-chain-rgb), calc(0.58 + var(--mutant-chain-pulse) * 0.18));
  background: linear-gradient(180deg, rgba(var(--mutant-chain-rgb), 0.16), rgba(48, 20, 58, 0.84));
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24), 0 0 var(--mutant-chain-card-glow-size) rgba(var(--mutant-chain-rgb), 0.22);
  transform: translateX(calc(var(--mutant-chain-side-nudge) * 4px));
  transition: transform 90ms ease-out, border-color 90ms ease-out;
}

.hud-card.chain-mutant::after {
  content: "";
  position: absolute;
  top: 7px;
  bottom: 7px;
  left: calc(50% + var(--mutant-chain-pan-side) * (30px + var(--mutant-chain-audio-pan) * 8px));
  width: 3px;
  border-radius: 999px;
  background: rgba(var(--mutant-chain-rgb), var(--mutant-chain-stripe-alpha));
  box-shadow: 0 0 var(--mutant-chain-stripe-glow-size) rgba(var(--mutant-chain-rgb), 0.48);
  transform: translateX(-50%);
  pointer-events: none;
}

.hud-card.chain-mutant span,
.hud-card.chain-mutant strong {
  position: relative;
  z-index: 1;
}

.hud-card.chain-mutant strong {
  color: rgb(var(--mutant-chain-rgb));
  font-size: 12px;
  white-space: nowrap;
  text-shadow: 0 0 var(--mutant-chain-text-glow-size) rgba(var(--mutant-chain-rgb), 0.58);
}

.hud-card.chain-mutant-hot {
  border-color: rgba(var(--mutant-chain-rgb), 0.88);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24), 0 0 30px rgba(var(--mutant-chain-rgb), 0.24), inset 0 0 18px rgba(var(--mutant-chain-rgb), 0.14);
}

.hud-card.chain-mutant-hot strong {
  color: rgb(var(--mutant-chain-rgb));
}

.hud-card.chain-bomb {
  border-color: rgba(255, 140, 56, 0.84);
  background: rgba(83, 36, 15, 0.86);
  animation: boss-chain-hud-pulse 0.68s ease-out;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24), 0 0 28px rgba(255, 140, 56, 0.24);
}

.hud-card.chain-bomb strong {
  color: #ffb36c;
  font-size: 14px;
  white-space: nowrap;
  text-shadow: 0 0 14px rgba(255, 140, 56, 0.58);
}

.hud-card.chain-breach {
  border-color: rgba(141, 255, 177, 0.82);
  background: rgba(18, 68, 47, 0.86);
  animation: boss-chain-hud-pulse 0.68s ease-out;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24), 0 0 30px rgba(141, 255, 177, 0.22);
}

.hud-card.chain-breach strong {
  color: #8dffb1;
  font-size: 13px;
  white-space: nowrap;
  text-shadow: 0 0 15px rgba(141, 255, 177, 0.62);
}

.hud-card.chain-breach-hot {
  border-color: rgba(255, 241, 166, 0.88);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24), 0 0 34px rgba(141, 255, 177, 0.28), inset 0 0 18px rgba(255, 241, 166, 0.12);
}

.hud-card.chain-breach-hot strong {
  color: #fff1a6;
}

.hud-card.chain-bomb-downed {
  border-color: rgba(255, 241, 166, 0.92);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24), 0 0 34px rgba(255, 241, 166, 0.28), inset 0 0 18px rgba(255, 140, 56, 0.12);
}

.hud-card.chain-bomb-downed strong {
  color: #fff1a6;
}

.hud-card.roof-warn {
  border-color: rgba(255, 140, 56, 0.52);
  background: rgba(76, 40, 17, 0.72);
}

.hud-card.roof-warn strong {
  color: #ffb36c;
}

.hud-card.roof-breach {
  border-color: rgba(237, 91, 71, 0.62);
  background: rgba(78, 18, 18, 0.78);
}

.hud-card.roof-breach strong {
  color: #ff7d70;
}

.hud-card.perf-low {
  border-color: rgba(237, 91, 71, 0.52);
  background: rgba(76, 20, 17, 0.72);
}

.hud-card.perf-low strong {
  color: #ffb36c;
}

.hud-card.perf-trim {
  --perf-trim-pulse: 0;
  --perf-trim-severity: 0;
  --perf-trim-stripe-scale: 0;
  position: relative;
  overflow: hidden;
  min-width: 112px;
  border-color: rgba(255, 179, 108, calc(0.36 + var(--perf-trim-pulse, 0) * 0.24));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(8px + var(--perf-trim-pulse, 0) * 16px) rgba(255, 179, 108, calc(0.08 + var(--perf-trim-pulse, 0) * 0.2)),
    inset 0 0 0 1px rgba(255, 241, 166, calc(0.08 + var(--perf-trim-pulse, 0) * 0.16));
}

.hud-card.perf-trim::after {
  content: "";
  position: absolute;
  right: 8px;
  bottom: 5px;
  left: 8px;
  height: calc(3px + var(--perf-trim-severity, 0) * 1px);
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 179, 108, calc(0.18 + var(--perf-trim-severity, 0) * 0.12)), rgba(255, 241, 166, calc(0.74 + var(--perf-trim-severity, 0) * 0.18)));
  box-shadow: 0 0 calc(4px + var(--perf-trim-pulse, 0) * 9px + var(--perf-trim-severity, 0) * 3px) rgba(255, 179, 108, calc(0.14 + var(--perf-trim-pulse, 0) * 0.26 + var(--perf-trim-severity, 0) * 0.1));
  opacity: calc(0.18 + var(--perf-trim-pulse, 0) * 0.68 + var(--perf-trim-severity, 0) * 0.12);
  pointer-events: none;
  transform: scaleX(var(--perf-trim-stripe-scale, 0));
  transform-origin: left center;
}

.hud-card.perf-trim strong {
  position: relative;
  z-index: 1;
  font-size: 13px;
  text-shadow: 0 0 calc(3px + var(--perf-trim-pulse, 0) * 7px) rgba(255, 179, 108, calc(0.18 + var(--perf-trim-pulse, 0) * 0.3));
}

.hud-card.health-damage {
  --health-damage-pulse: 0;
  border-color: rgba(237, 91, 71, 0.62);
  background: linear-gradient(135deg, rgba(88, 25, 18, 0.78), rgba(41, 23, 20, 0.72));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(20px * var(--health-damage-pulse, 0)) rgba(237, 91, 71, 0.28),
    inset 0 0 0 1px rgba(255, 179, 108, 0.18);
  animation: health-damage-pulse 0.38s ease-out;
}

.hud-card.health-damage strong {
  color: #ffb36c;
  text-shadow: 0 0 14px rgba(237, 91, 71, 0.44);
}

.hud-card.health-recovery {
  border-color: rgba(141, 255, 177, 0.64);
  background: linear-gradient(135deg, rgba(25, 72, 45, 0.74), rgba(24, 45, 36, 0.7));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(16px + var(--health-recovery-pulse, 0) * 10px) rgba(141, 255, 177, 0.24),
    inset 0 0 calc(5px + var(--health-recovery-pulse, 0) * 8px) rgba(141, 255, 177, 0.1);
  animation: health-recovery-pulse 0.5s ease-out;
}

.hud-card.health-recovery strong {
  color: #8dffb1;
  text-shadow: 0 0 calc(10px + var(--health-recovery-pulse, 0) * 6px) rgba(141, 255, 177, 0.48);
}

.hud-card.health-critical {
  border-color: rgba(237, 91, 71, 0.72);
  background: rgba(68, 18, 18, 0.74);
}

.hud-card.health-critical strong {
  color: #ff7d70;
}

.hud-card.health-heartbeat {
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(22px * var(--health-critical-pulse, 0)) rgba(237, 91, 71, 0.28),
    inset 0 0 0 1px rgba(255, 117, 82, 0.2);
}

.hud-card.health-heartbeat strong {
  text-shadow: 0 0 calc(16px * var(--health-critical-pulse, 0)) rgba(255, 117, 82, 0.62);
}

.hud-card.health-heartbeat-calmed {
  position: relative;
  border-color: rgba(141, 255, 177, calc(0.42 + var(--health-heartbeat-calm, 0) * 0.22));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(12px + var(--health-heartbeat-calm, 0) * 16px) rgba(141, 255, 177, calc(var(--health-heartbeat-calm, 0) * 0.22)),
    inset 0 0 calc(5px + var(--health-heartbeat-calm, 0) * 8px) rgba(185, 246, 255, calc(var(--health-heartbeat-calm, 0) * 0.16));
}

.hud-card.health-heartbeat-calmed strong {
  color: #b9f6ff;
  text-shadow: 0 0 calc(8px + var(--health-heartbeat-calm, 0) * 8px) rgba(141, 255, 177, 0.46);
}

.hud-card.health-heartbeat-calmed::after {
  content: attr(data-heartbeat-calm);
  position: absolute;
  right: 7px;
  top: 5px;
  color: rgba(185, 246, 255, calc(0.5 + var(--health-heartbeat-calm, 0) * 0.36));
  font-size: 0.56rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  opacity: calc(0.62 + var(--health-heartbeat-calm-stack-ease, 0) * 0.38);
  text-shadow: 0 0 calc(7px + var(--health-heartbeat-calm, 0) * 9px) rgba(141, 255, 177, 0.54);
  transform: scale(calc(0.92 + var(--health-heartbeat-calm-stack-ease, 0) * 0.08));
  transform-origin: right top;
  pointer-events: none;
}

.hud-card.ammo-low {
  border-color: rgba(255, 213, 109, 0.54);
  background: rgba(75, 52, 16, 0.68);
}

.hud-card.ammo-low strong {
  color: #ffd56d;
}

.hud-card.ammo-low-pulse {
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 22px rgba(255, 213, 109, 0.18);
}

.hud-card.ammo-low-weapon-profile {
  position: relative;
  border-color: rgba(var(--ammo-low-profile-rgb, 255, 213, 109), calc(0.38 + var(--ammo-low-profile, 0) * 0.24));
}

.hud-card.ammo-low-weapon-profile::before {
  content: attr(data-low-ammo-profile);
  position: absolute;
  left: 8px;
  top: 5px;
  color: rgba(var(--ammo-low-profile-rgb, 255, 213, 109), calc(0.5 + var(--ammo-low-profile, 0) * 0.42));
  font-size: 0.5rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  opacity: clamp(0, var(--ammo-low-profile, 0), 1);
  text-shadow: 0 0 calc(5px + var(--ammo-low-profile, 0) * 9px) rgba(var(--ammo-low-profile-rgb, 255, 213, 109), 0.5);
  transform: translateY(calc(var(--ammo-low-profile, 0) * -1px));
  pointer-events: none;
}

.hud-card.ammo-low-profile-rifle strong {
  color: #b9f6ff;
}

.hud-card.ammo-motion-reduced span {
  position: relative;
}

.hud-card.ammo-motion-reduced span::after {
  content: attr(data-low-ammo-motion);
  display: inline-block;
  margin-left: 4px;
  color: rgba(185, 246, 255, 0.86);
  font-size: 0.48rem;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
  text-shadow: 0 0 8px rgba(141, 255, 177, 0.34);
  transform: translateY(-1px);
}

.hud-card.ammo-empty-urgency.ammo-motion-reduced span::after {
  content: attr(data-empty-urgency-motion);
  color: rgba(141, 255, 177, 0.94);
  text-shadow: 0 0 8px rgba(141, 255, 177, 0.46), 0 0 8px rgba(185, 246, 255, 0.24);
}

.hud-card.ammo-low span[data-low-ammo-action]::before,
.hud-card.ammo-empty span[data-low-ammo-action]::before {
  content: attr(data-low-ammo-action);
  display: inline-block;
  margin-right: 5px;
  color: rgba(255, 241, 166, 0.82);
  font-size: 0.48rem;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
  text-shadow: 0 0 8px rgba(255, 213, 109, 0.34);
  transform: translateY(-1px);
}

.hud-card.ammo-empty span[data-low-ammo-action]::before {
  color: #fff1a6;
  text-shadow: 0 0 9px rgba(237, 91, 71, 0.44), 0 0 6px rgba(255, 213, 109, 0.34);
}

.hud-card.ammo-motion-confirm {
  border-color: rgba(141, 255, 177, calc(0.44 + var(--ammo-low-motion-confirm, 0) * 0.2));
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 calc(14px + var(--ammo-low-motion-confirm, 0) * 14px) rgba(141, 255, 177, 0.16);
}

.hud-card.ammo-motion-confirm strong::before {
  content: attr(data-low-ammo-motion-confirm);
  position: absolute;
  left: 0;
  top: -0.68rem;
  color: rgba(141, 255, 177, calc(0.48 + var(--ammo-low-motion-confirm, 0) * 0.42));
  font-size: 0.5rem;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
  opacity: clamp(0, var(--ammo-low-motion-confirm, 0), 1);
  text-shadow: 0 0 calc(6px + var(--ammo-low-motion-confirm, 0) * 8px) rgba(141, 255, 177, 0.44);
  transform: translateY(calc(var(--ammo-low-motion-confirm, 0) * -1px));
  pointer-events: none;
}

.hud-card.ammo-low-feedback-scaled {
  border-color: rgba(255, 213, 109, calc(0.46 + var(--ammo-low-feedback-scale, 0) * 0.2));
}

.hud-card.ammo-low-feedback-settle {
  border-color: rgba(255, 213, 109, 0.34);
}

.hud-card.ammo-motion-confirm strong,
.hud-card.ammo-low-feedback-scaled strong {
  position: relative;
}

.hud-card.ammo-low-feedback-scaled span {
  position: relative;
}

.hud-card.ammo-low-feedback-scaled span::before {
  content: attr(data-low-ammo-channels);
  position: absolute;
  left: 0;
  top: -0.6rem;
  color: rgba(255, 241, 166, calc(0.42 + var(--ammo-low-feedback-scale, 0) * 0.34));
  font-size: 0.48rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  opacity: clamp(0, var(--ammo-low-feedback-scale, 0), 1);
  text-shadow: 0 0 calc(5px + var(--ammo-low-feedback-scale, 0) * 7px) rgba(255, 213, 109, 0.4);
  transform: translateY(calc(var(--ammo-low-feedback-scale, 0) * -1px));
  pointer-events: none;
}

.hud-card.ammo-low-feedback-settle span::before {
  opacity: calc(clamp(0, var(--ammo-low-feedback-scale, 0), 1) * 0.68);
  transform: translateY(0);
}

.hud-card.ammo-low-feedback-scaled strong::after {
  content: attr(data-low-ammo-scale);
  position: absolute;
  right: -2px;
  top: -0.62rem;
  color: rgba(255, 241, 166, calc(0.48 + var(--ammo-low-feedback-scale, 0) * 0.42));
  font-size: 0.52rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  opacity: clamp(0, var(--ammo-low-feedback-scale, 0), 1);
  text-shadow: 0 0 calc(6px + var(--ammo-low-feedback-scale, 0) * 8px) rgba(255, 213, 109, 0.46);
  transform: translateY(calc(var(--ammo-low-feedback-scale, 0) * -1px)) translateX(calc(var(--ammo-low-feedback-scale-value, 0) * 4px));
  pointer-events: none;
}

.hud-card.ammo-low-feedback-settle strong::after {
  opacity: calc(clamp(0, var(--ammo-low-feedback-scale, 0), 1) * 0.72);
  transform: translateY(0) translateX(calc(var(--ammo-low-feedback-scale-value, 0) * 2px));
}

.hud-card.ammo-last-rounds-chamber {
  position: relative;
  overflow: hidden;
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(16px + var(--ammo-last-rounds-chamber, 0) * 16px) rgba(255, 213, 109, calc(0.12 + var(--ammo-last-rounds-chamber, 0) * 0.16));
}

.hud-card.ammo-last-rounds-chamber::after {
  content: "";
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 6px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 140, 56, 0), rgba(255, 213, 109, 0.86), rgba(255, 241, 166, 0));
  opacity: clamp(0, var(--ammo-last-rounds-chamber, 0), 1);
  pointer-events: none;
  transform: scaleX(calc(0.38 + var(--ammo-last-rounds-chamber, 0) * 0.62));
  transform-origin: center;
}

.hud-card.ammo-last-rounds-chamber strong {
  transform: translateY(calc(var(--ammo-last-rounds-chamber, 0) * -1px));
  text-shadow:
    0 0 calc(8px + var(--ammo-last-rounds-chamber, 0) * 8px) rgba(255, 213, 109, calc(0.34 + var(--ammo-last-rounds-chamber, 0) * 0.24)),
    0 0 calc(16px + var(--ammo-last-rounds-chamber, 0) * 10px) rgba(255, 140, 56, calc(var(--ammo-last-rounds-chamber, 0) * 0.18));
}

.hud-card.ammo-casing-settle {
  position: relative;
  overflow: hidden;
  border-color: rgba(var(--ammo-casing-settle-rgb, 255, 213, 109), calc(0.42 + var(--ammo-casing-settle, 0) * 0.22));
}

.hud-card.ammo-casing-settle::before {
  content: "";
  position: absolute;
  inset: 5px 8px auto 8px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(var(--ammo-casing-settle-rgb, 255, 213, 109), 0), rgba(var(--ammo-casing-settle-rgb, 255, 213, 109), 0.72), rgba(255, 241, 166, 0));
  opacity: clamp(0, var(--ammo-casing-settle, 0), 0.78);
  pointer-events: none;
  transform: translateX(calc(var(--ammo-casing-settle-side, 0) * var(--ammo-casing-settle, 0) * 7px)) scaleX(calc(0.46 + var(--ammo-casing-settle, 0) * 0.54));
  transform-origin: center;
}

.hud-card.ammo-casing-settle strong {
  text-shadow:
    0 0 calc(7px + var(--ammo-casing-settle, 0) * 7px) rgba(var(--ammo-casing-settle-rgb, 255, 213, 109), calc(0.3 + var(--ammo-casing-settle, 0) * 0.24)),
    0 0 calc(14px + var(--ammo-casing-settle, 0) * 8px) rgba(255, 241, 166, calc(var(--ammo-casing-settle, 0) * 0.14));
}

.hud-card.ammo-empty {
  border-color: rgba(237, 91, 71, 0.56);
  background: rgba(76, 20, 17, 0.72);
}

.hud-card.ammo-empty strong {
  color: #ffb36c;
}

.hud-card.ammo-dry-fire {
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 26px rgba(237, 91, 71, 0.2);
}

.hud-card.ammo-empty-urgency {
  transform: translateY(calc(var(--ammo-empty-urgency, 0) * -1px)) scale(calc(1 + var(--ammo-empty-urgency, 0) * 0.012));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.24),
    0 0 calc(22px + var(--ammo-empty-urgency, 0) * 16px) rgba(237, 91, 71, 0.28),
    inset 0 0 0 1px rgba(255, 241, 166, calc(var(--ammo-empty-urgency, 0) * 0.22));
}

.hud-card.ammo-pressure {
  border-color: rgba(255, 140, 56, 0.72);
  background: rgba(82, 25, 15, 0.78);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 30px rgba(237, 91, 71, 0.24);
}

.hud-card.ammo-pressure strong {
  color: #ffb36c;
  text-shadow: 0 0 14px rgba(255, 140, 56, 0.44);
}

.hud-card.heli-threat {
  border-color: rgba(255, 179, 108, 0.78);
  background: rgba(74, 31, 18, 0.78);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 28px rgba(255, 140, 56, 0.28);
}

.hud-card.heli-threat strong {
  color: #ffb36c;
  text-shadow: 0 0 16px rgba(255, 140, 56, 0.54);
}

.hud-card.heli-rocket-fire {
  border-color: rgba(255, 140, 56, 0.78);
  background: linear-gradient(135deg, rgba(82, 33, 14, 0.82), rgba(32, 26, 22, 0.76));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 30px rgba(255, 140, 56, 0.3),
    inset 0 0 0 1px rgba(255, 213, 109, 0.2);
  animation: heli-rocket-fire-pulse 0.42s ease-out;
}

.hud-card.heli-rocket-fire strong {
  color: #ffb36c;
  text-shadow: 0 0 16px rgba(255, 140, 56, 0.58);
}

.hud-card.heli-rocket-rearm {
  border-color: rgba(141, 255, 177, 0.64);
  background: linear-gradient(135deg, rgba(18, 68, 40, 0.78), rgba(22, 36, 31, 0.76));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 24px rgba(141, 255, 177, 0.24),
    inset 0 0 0 1px rgba(185, 246, 255, 0.16);
  animation: heli-rocket-rearm-pulse 0.48s ease-out;
}

.hud-card.heli-rocket-rearm strong {
  color: #8dffb1;
  text-shadow: 0 0 14px rgba(141, 255, 177, 0.48);
}

.hud-card.heli-rocket-ready {
  border-color: rgba(255, 241, 166, 0.78);
  background: linear-gradient(135deg, rgba(64, 58, 20, 0.82), rgba(18, 54, 36, 0.76));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 28px rgba(255, 241, 166, 0.26),
    inset 0 0 0 1px rgba(141, 255, 177, 0.18);
  animation: heli-rocket-ready-pulse 0.52s ease-out;
}

.hud-card.heli-rocket-ready strong {
  color: #fff1a6;
  text-shadow: 0 0 15px rgba(255, 241, 166, 0.52);
}

.hud-card.heli-rocket-combo {
  border-color: rgba(185, 246, 255, calc(0.42 + (var(--heli-rocket-combo, 0) * 0.34)));
  background:
    linear-gradient(90deg, rgba(185, 246, 255, calc(var(--heli-rocket-combo, 0) * 0.18)) 0%, rgba(185, 246, 255, 0) 58%),
    linear-gradient(135deg, rgba(18, 64, 78, 0.82), rgba(42, 39, 20, 0.78));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 24px rgba(185, 246, 255, calc(0.16 + (var(--heli-rocket-combo, 0) * 0.18))),
    inset 0 0 0 1px rgba(255, 241, 166, 0.14);
}

.hud-card.heli-rocket-combo strong {
  color: #b9f6ff;
  text-shadow: 0 0 15px rgba(185, 246, 255, 0.5);
}

.hud-card.heli-rocket-combo-hot {
  animation: heli-rocket-combo-pulse 0.56s ease-out;
}

.hud-card.heli-rocket-combo-warning {
  border-color: rgba(255, 241, 166, 0.78);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.24),
    0 0 28px rgba(255, 241, 166, 0.34),
    inset 0 0 0 1px rgba(255, 241, 166, 0.22);
  animation: heli-rocket-combo-warning 0.46s ease-out;
}

.hud-card.heli-rocket-combo-warning strong {
  color: #fff1a6;
  text-shadow: 0 0 16px rgba(255, 241, 166, 0.58);
}

.hud-card.ammo-gain {
  border-color: rgba(var(--ammo-gain-rgb, 141, 255, 177), calc(0.46 + var(--ammo-gain-accent, 0) * 0.14));
  background: rgba(20, 60, 35, 0.72);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 calc(18px + var(--ammo-gain-accent, 0) * 8px) rgba(var(--ammo-gain-rgb, 141, 255, 177), 0.24);
  animation: ammo-gain-pulse 0.42s ease-out;
}

.hud-card.ammo-gain strong {
  color: rgb(var(--ammo-gain-rgb, 141, 255, 177));
  text-shadow: 0 0 calc(11px + var(--ammo-gain-accent, 0) * 4px) rgba(var(--ammo-gain-rgb, 141, 255, 177), 0.44);
}

.hud-card.ammo-gain-settle {
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(12px + var(--ammo-gain-settle, 0) * 9px) rgba(var(--ammo-gain-rgb, 141, 255, 177), 0.2),
    inset 0 0 calc(7px + var(--ammo-gain-settle, 0) * 6px) rgba(var(--ammo-gain-rgb, 141, 255, 177), 0.08);
  animation: ammo-gain-settle 0.46s 0.16s ease-out both;
}

.hud-card.ammo-gain-settle strong {
  text-shadow:
    0 0 calc(8px + var(--ammo-gain-settle, 0) * 4px) rgba(var(--ammo-gain-rgb, 141, 255, 177), 0.34),
    0 0 2px rgba(255, 255, 255, 0.16);
}

.hud-card.ammo-gain-rifle {
  background: rgba(19, 55, 62, 0.74);
}

.hud-card.ammo-gain-pistol {
  background: rgba(62, 51, 22, 0.72);
}

.hud-card.ammo-wounded-recovery {
  position: relative;
  border-color: rgba(141, 255, 177, calc(0.42 + var(--ammo-wounded-recovery, 0) * 0.22));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(16px + var(--ammo-wounded-recovery, 0) * 14px) rgba(141, 255, 177, 0.22),
    inset 0 0 calc(7px + var(--ammo-wounded-recovery, 0) * 8px) rgba(185, 246, 255, 0.1);
}

.hud-card.ammo-wounded-settle {
  background:
    linear-gradient(135deg, rgba(141, 255, 177, calc(var(--ammo-wounded-settle, 0) * 0.12)), rgba(185, 246, 255, calc(var(--ammo-wounded-settle, 0) * 0.08))),
    rgba(19, 35, 38, 0.74);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(10px + var(--ammo-wounded-settle, 0) * 10px) rgba(141, 255, 177, calc(var(--ammo-wounded-settle, 0) * 0.18)),
    inset 0 0 calc(5px + var(--ammo-wounded-settle, 0) * 7px) rgba(185, 246, 255, calc(var(--ammo-wounded-settle, 0) * 0.12));
}

.hud-card.ammo-wounded-ready-breath {
  background:
    linear-gradient(90deg, rgba(141, 255, 177, 0), rgba(185, 246, 255, calc(var(--ammo-wounded-ready-breath, 0) * 0.12)) 46%, rgba(141, 255, 177, calc(var(--ammo-wounded-ready-breath, 0) * 0.1)) 58%, rgba(141, 255, 177, 0)),
    rgba(19, 35, 38, 0.74);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(12px + var(--ammo-wounded-ready-breath, 0) * 14px) rgba(141, 255, 177, calc(var(--ammo-wounded-ready-breath, 0) * 0.2)),
    inset 0 0 calc(6px + var(--ammo-wounded-ready-breath, 0) * 9px) rgba(185, 246, 255, calc(var(--ammo-wounded-ready-breath, 0) * 0.14));
}

.hud-card.ammo-wounded-recovery::after {
  content: "STABILIZED";
  position: absolute;
  right: 7px;
  bottom: 3px;
  color: rgba(185, 246, 255, calc(0.62 + var(--ammo-wounded-recovery, 0) * 0.28));
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  text-shadow: 0 0 calc(8px + var(--ammo-wounded-recovery, 0) * 7px) rgba(141, 255, 177, 0.5);
}

.hud-card.ammo-wounded-round-seated::before {
  content: "";
  position: absolute;
  right: 9px;
  top: 7px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background:
    radial-gradient(
      circle,
      rgba(255, 241, 166, calc(var(--ammo-wounded-round-seated, 0) * 0.96)) 0 34%,
      rgba(141, 255, 177, calc(var(--ammo-wounded-round-seated, 0) * 0.72)) 35% 62%,
      rgba(141, 255, 177, 0) 70%
    );
  box-shadow: 0 0 calc(6px + var(--ammo-wounded-round-seated, 0) * 12px) rgba(141, 255, 177, calc(var(--ammo-wounded-round-seated, 0) * 0.48));
  opacity: var(--ammo-wounded-round-seated, 0);
  transform: scale(var(--ammo-wounded-round-seated-scale, 0.78));
  pointer-events: none;
}

.hud-card.ammo-wounded-recovery strong {
  text-shadow:
    0 0 calc(10px + var(--ammo-wounded-recovery, 0) * 6px) rgba(141, 255, 177, 0.4),
    0 0 2px rgba(255, 255, 255, 0.18);
}

.hud-card.ammo-wounded-ready-breath strong {
  text-shadow:
    0 0 calc(9px + var(--ammo-wounded-ready-breath, 0) * 9px) rgba(185, 246, 255, calc(0.26 + var(--ammo-wounded-ready-breath, 0) * 0.28)),
    0 0 calc(15px + var(--ammo-wounded-ready-breath, 0) * 10px) rgba(141, 255, 177, calc(var(--ammo-wounded-ready-breath, 0) * 0.18));
}

.hud-card.ammo-overfull {
  border-color: rgba(185, 246, 255, 0.62);
  background: rgba(19, 55, 62, 0.76);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 24px rgba(185, 246, 255, 0.2);
  animation: ammo-overfull-pulse 0.5s ease-out;
}

.hud-card.ammo-overfull strong {
  color: #b9f6ff;
  text-shadow: 0 0 14px rgba(185, 246, 255, 0.42);
}

.supply-loot-magnet {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 92;
  pointer-events: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  height: 22px;
  padding: 0 9px;
  border: 1px solid color-mix(in srgb, var(--magnet-color, #8dffb1) 72%, white 14%);
  border-radius: 6px;
  background: rgba(9, 23, 18, 0.86);
  color: var(--magnet-color, #8dffb1);
  box-shadow:
    0 0 18px color-mix(in srgb, var(--magnet-color, #8dffb1) 34%, transparent),
    0 8px 22px rgba(0, 0, 0, 0.34);
  font: 800 0.72rem/1 "Arial", sans-serif;
  letter-spacing: 0;
  text-shadow: 0 0 10px color-mix(in srgb, var(--magnet-color, #8dffb1) 42%, transparent);
  will-change: transform, opacity;
}

.hud-card.power-gain {
  border-color: rgba(141, 255, 177, 0.64);
  background: rgba(18, 62, 38, 0.74);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 24px rgba(141, 255, 177, 0.24);
  animation: power-charge-pulse 0.48s ease-out;
}

.hud-card.power-gain strong {
  color: #8dffb1;
  text-shadow: 0 0 14px rgba(141, 255, 177, 0.42);
}

.hud-card.tactical-gain {
  border-color: rgba(141, 255, 177, 0.66);
  background: linear-gradient(135deg, rgba(18, 68, 40, 0.78), rgba(20, 42, 35, 0.74));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 24px rgba(141, 255, 177, 0.24),
    inset 0 0 0 1px rgba(185, 246, 255, 0.14);
  animation: tactical-hud-gain-pulse 0.48s ease-out;
}

.hud-card.tactical-gain strong {
  color: #8dffb1;
  text-shadow: 0 0 14px rgba(141, 255, 177, 0.46);
}

.hud-card.supply-reward {
  position: relative;
  overflow: hidden;
  border-color: rgba(255, 241, 166, calc(0.48 + var(--supply-reward-pulse, 0) * 0.18));
  background: linear-gradient(135deg, rgba(32, 66, 46, 0.78), rgba(48, 44, 24, 0.72));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(16px + var(--supply-reward-pulse, 0) * 14px) rgba(255, 241, 166, 0.22),
    inset 0 0 calc(8px + var(--supply-reward-pulse, 0) * 9px) rgba(141, 255, 177, 0.1);
  animation: supply-reward-hud-pulse 0.56s ease-out;
}

.hud-card.supply-reward-card-settle {
  transform:
    translateX(calc(var(--supply-reward-settle-tick, 0) * 1.4px))
    translateY(calc(var(--supply-reward-card-settle, 0) * 1.6px));
}

.hud-card.supply-reward-settle-tick strong {
  text-shadow:
    0 0 calc(8px + var(--supply-reward-settle-tick, 0) * 7px) rgba(255, 241, 166, 0.42),
    0 0 calc(12px + var(--supply-reward-settle-tick, 0) * 8px) rgba(141, 255, 177, 0.24);
}

.hud-card.supply-reward-endpoint-sync {
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(12px + var(--supply-reward-endpoint-sync, 0) * var(--supply-reward-polish-dampen, 1) * var(--supply-reward-endpoint-soften, 1) * 16px) rgba(255, 241, 166, 0.2),
    inset 0 0 calc(7px + var(--supply-reward-endpoint-sync, 0) * var(--supply-reward-polish-dampen, 1) * var(--supply-reward-endpoint-soften, 1) * 12px) rgba(217, 255, 230, 0.18);
}

.hud-card.supply-reward-endpoint-sync strong {
  transform: translateY(calc(var(--supply-reward-endpoint-sync, 0) * var(--supply-reward-polish-dampen, 1) * var(--supply-reward-endpoint-soften, 1) * -0.7px));
  text-shadow:
    0 0 calc(6px + var(--supply-reward-endpoint-sync, 0) * var(--supply-reward-polish-dampen, 1) * var(--supply-reward-endpoint-soften, 1) * 9px) rgba(255, 241, 166, 0.34),
    0 0 calc(11px + var(--supply-reward-endpoint-sync, 0) * var(--supply-reward-polish-dampen, 1) * var(--supply-reward-endpoint-soften, 1) * 12px) rgba(217, 255, 230, 0.22);
}

.hud-card.supply-reward-afterglow {
  border-color: rgba(141, 255, 177, calc(0.2 + var(--supply-reward-afterglow, 0) * var(--supply-reward-polish-dampen, 1) * 0.24));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(10px + var(--supply-reward-afterglow, 0) * var(--supply-reward-polish-dampen, 1) * 22px) rgba(141, 255, 177, 0.18),
    inset 0 0 calc(8px + var(--supply-reward-afterglow, 0) * var(--supply-reward-polish-dampen, 1) * 14px) rgba(255, 241, 166, 0.1);
}

.hud-card.supply-reward-tail-settle {
  filter: saturate(calc(1 + var(--supply-reward-tail-settle, 0) * var(--supply-reward-polish-dampen, 1) * 0.14)) brightness(calc(1 + var(--supply-reward-tail-settle, 0) * var(--supply-reward-polish-dampen, 1) * 0.05));
}

.hud-card.supply-reward-tail-settle strong {
  transform: translateY(calc(var(--supply-reward-tail-settle, 0) * var(--supply-reward-polish-dampen, 1) * -0.8px));
  text-shadow:
    0 0 calc(5px + var(--supply-reward-tail-settle, 0) * var(--supply-reward-polish-dampen, 1) * 10px) rgba(141, 255, 177, 0.26),
    0 0 calc(9px + var(--supply-reward-tail-settle, 0) * var(--supply-reward-polish-dampen, 1) * 12px) rgba(255, 241, 166, 0.18);
}

.hud-card.supply-reward-inventory-lock::after {
  content: attr(data-reward-lock);
  position: absolute;
  right: 8px;
  bottom: 4px;
  font-size: 7px;
  line-height: 1;
  letter-spacing: 0;
  color: rgba(217, 255, 230, calc(0.1 + var(--supply-reward-inventory-lock, 0) * var(--supply-reward-polish-dampen, 1) * 0.82));
  text-shadow:
    0 0 calc(3px + var(--supply-reward-inventory-lock, 0) * var(--supply-reward-polish-dampen, 1) * 7px) rgba(141, 255, 177, 0.46),
    0 0 calc(6px + var(--supply-reward-inventory-lock, 0) * var(--supply-reward-polish-dampen, 1) * 10px) rgba(185, 246, 255, 0.22);
  opacity: calc(var(--supply-reward-inventory-lock, 0) * var(--supply-reward-polish-dampen, 1));
  transform: translateY(calc((1 - var(--supply-reward-inventory-lock, 0)) * 4px));
  pointer-events: none;
}

.hud-card.supply-reward-row-ripple {
  animation:
    supply-reward-hud-pulse 0.56s ease-out,
    supply-reward-row-ripple 0.72s ease-out var(--supply-reward-row-delay, 0ms) both;
  border-color: rgba(217, 255, 230, calc(0.3 + var(--supply-reward-row-ripple, 0) * var(--supply-reward-polish-dampen, 1) * 0.26));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(12px + var(--supply-reward-row-ripple, 0) * var(--supply-reward-polish-dampen, 1) * 18px) rgba(141, 255, 177, 0.16),
    inset 0 0 calc(8px + var(--supply-reward-row-ripple, 0) * var(--supply-reward-polish-dampen, 1) * 13px) rgba(185, 246, 255, 0.11);
}

.hud-card.supply-reward-cooldown-trace {
  outline: calc(1px + var(--supply-reward-cooldown-trace, 0) * 1px) solid rgba(185, 246, 255, calc(var(--supply-reward-cooldown-trace, 0) * var(--supply-reward-polish-dampen, 1) * 0.24));
  outline-offset: calc(var(--supply-reward-cooldown-trace, 0) * -2px);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(8px + var(--supply-reward-cooldown-trace, 0) * var(--supply-reward-polish-dampen, 1) * 14px) rgba(185, 246, 255, 0.12),
    inset 0 -2px calc(6px + var(--supply-reward-cooldown-trace, 0) * 12px) rgba(141, 255, 177, 0.1);
  transition: outline-color var(--supply-reward-cooldown-ms, 560ms) ease-out;
}

.hud-card.supply-reward-direction-cue {
  transform:
    translateX(calc(var(--supply-reward-settle-tick, 0) * 1.4px + var(--supply-reward-direction, 0) * var(--supply-reward-direction-pulse, 0) * var(--supply-reward-polish-dampen, 1) * 2.4px))
    translateY(calc(var(--supply-reward-card-settle, 0) * 1.6px));
  border-left-color: rgba(255, 241, 166, calc(0.32 + var(--supply-reward-direction-pulse, 0) * var(--supply-reward-polish-dampen, 1) * 0.32));
  border-right-color: rgba(185, 246, 255, calc(0.22 + var(--supply-reward-direction-pulse, 0) * var(--supply-reward-polish-dampen, 1) * 0.24));
}

.hud-card.supply-reward-edge-glint {
  background-image:
    linear-gradient(
      90deg,
      rgba(255, 241, 166, calc((1 - var(--supply-reward-edge-side, 0)) * 0.5 * var(--supply-reward-edge-glint, 0) * var(--supply-reward-polish-dampen, 1) * 0.28)),
      transparent 24%,
      transparent 76%,
      rgba(185, 246, 255, calc((1 + var(--supply-reward-edge-side, 0)) * 0.5 * var(--supply-reward-edge-glint, 0) * var(--supply-reward-polish-dampen, 1) * 0.26))
    );
}

.hud-card.supply-reward-stack-compact.supply-reward-row-ripple.supply-reward-cooldown-trace.supply-reward-edge-glint {
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.22),
    0 0 calc(7px + var(--supply-reward-stack-compact, 0) * 9px) rgba(141, 255, 177, 0.11),
    inset 0 0 calc(5px + var(--supply-reward-stack-compact, 0) * 8px) rgba(185, 246, 255, 0.08);
  filter: saturate(calc(1 + var(--supply-reward-stack-compact, 0) * 0.08)) brightness(calc(1 + var(--supply-reward-stack-compact, 0) * 0.025));
}

.hud-card.supply-reward-target-glint {
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(13px + var(--supply-reward-target-glint, 0) * 18px) rgba(255, 241, 166, 0.28),
    inset 0 0 calc(9px + var(--supply-reward-target-glint, 0) * 12px) rgba(185, 246, 255, 0.18);
  filter: saturate(calc(1 + var(--supply-reward-target-glint, 0) * 0.22));
}

.hud-card.supply-reward-shimmer::before {
  content: "";
  position: absolute;
  inset: 3px auto 3px -28%;
  width: 42%;
  border-radius: 5px;
  pointer-events: none;
  background: linear-gradient(92deg, transparent, rgba(255, 241, 166, calc(var(--supply-reward-shimmer, 0) * 0.26)), rgba(141, 255, 177, calc(var(--supply-reward-shimmer, 0) * 0.14)), transparent);
  opacity: var(--supply-reward-shimmer, 0);
  mix-blend-mode: screen;
  transform: translateX(calc(var(--supply-reward-shimmer, 0) * 190%)) skewX(-15deg);
}

.hud-card.supply-reward-catch::after {
  content: attr(data-reward-catch);
  position: absolute;
  right: 7px;
  bottom: 4px;
  min-width: 36px;
  height: 11px;
  border-radius: 6px;
  pointer-events: none;
  background: linear-gradient(105deg, rgba(255, 241, 166, calc(var(--supply-reward-catch, 0) * 0.18)), rgba(141, 255, 177, calc(var(--supply-reward-catch, 0) * 0.16)));
  color: rgba(255, 241, 166, calc(0.55 + var(--supply-reward-catch, 0) * 0.32));
  font-size: 8px;
  font-weight: 900;
  line-height: 11px;
  text-align: center;
  letter-spacing: 0;
  opacity: var(--supply-reward-catch, 0);
  transform: translateY(calc(3px - var(--supply-reward-catch, 0) * 2px));
  mix-blend-mode: screen;
  text-shadow: 0 0 calc(6px + var(--supply-reward-catch, 0) * 5px) rgba(141, 255, 177, 0.42);
}

.hud-card.supply-reward strong {
  color: #fff1a6;
  text-shadow:
    0 0 12px rgba(255, 241, 166, 0.42),
    0 0 calc(8px + var(--supply-reward-pulse, 0) * 8px) rgba(141, 255, 177, 0.24);
}

.hud-card.supply-reward-number-tick strong {
  color: rgb(var(--supply-reward-number-rgb, 255, 241, 166));
  transform-origin: 0 50%;
  animation: supply-reward-number-tick 0.44s var(--supply-reward-number-delay, 0ms) cubic-bezier(0.18, 0.95, 0.24, 1.18) both;
  text-shadow:
    0 0 calc(10px + var(--supply-reward-pulse, 0) * 8px) rgba(var(--supply-reward-number-rgb, 255, 241, 166), 0.5),
    0 0 calc(22px + var(--supply-reward-pulse, 0) * 12px) rgba(141, 255, 177, 0.2);
}

.hud-card.tactical-spend {
  border-color: rgba(255, 179, 108, 0.68);
  background: linear-gradient(135deg, rgba(76, 37, 18, 0.78), rgba(39, 31, 24, 0.74));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 24px rgba(255, 179, 108, 0.24),
    inset 0 0 0 1px rgba(255, 213, 109, 0.16);
  animation: tactical-hud-spend-pulse 0.42s ease-out;
}

.hud-card.tactical-spend strong {
  color: #ffb36c;
  text-shadow: 0 0 14px rgba(255, 179, 108, 0.46);
}

.hud-card.tactical-route {
  border-color: rgba(255, 241, 166, 0.76);
  background: linear-gradient(135deg, rgba(48, 77, 40, 0.8), rgba(31, 44, 35, 0.76));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 28px rgba(255, 241, 166, 0.24),
    inset 0 0 0 1px rgba(141, 255, 177, 0.18);
  animation: tactical-hud-route-pulse 0.54s ease-out;
}

.hud-card.tactical-route strong {
  color: #fff1a6;
  text-shadow: 0 0 16px rgba(255, 241, 166, 0.5);
}

.hud-card.tactical-scarcity {
  border-color: rgba(255, 140, 56, 0.72);
  background: linear-gradient(135deg, rgba(83, 31, 17, 0.82), rgba(39, 31, 24, 0.78));
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    0 0 calc(24px * var(--tactical-scarcity-pulse, 0)) rgba(255, 140, 56, 0.22),
    inset 0 0 0 1px rgba(255, 213, 109, 0.14);
}

.hud-card.tactical-scarcity strong {
  color: #ffb36c;
  text-shadow: 0 0 calc(14px * var(--tactical-scarcity-pulse, 0)) rgba(255, 179, 108, 0.5);
}

.hud-card.tactical-empty {
  border-color: rgba(237, 91, 71, 0.76);
  background: linear-gradient(135deg, rgba(86, 22, 18, 0.84), rgba(44, 24, 22, 0.8));
}

.hud-card.tactical-empty strong {
  color: #ff8f76;
}

@keyframes ammo-gain-pulse {
  0% {
    transform: translateY(0) scale(1);
  }
  38% {
    transform: translateY(-1px) scale(1.04);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes ammo-gain-settle {
  0% {
    transform: translateY(0) scale(1);
  }
  46% {
    transform: translateY(1px) scale(0.985);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes supply-reward-row-ripple {
  0% { filter: brightness(1); }
  38% { filter: brightness(calc(1 + var(--supply-reward-row-ripple, 0) * var(--supply-reward-polish-dampen, 1) * 0.09)); }
  100% { filter: brightness(1); }
}

@keyframes supply-reward-hud-pulse {
  0% {
    transform: translateY(0) scale(1);
  }
  36% {
    transform: translateY(-1px) scale(1.035);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes supply-reward-number-tick {
  0% {
    transform: translateY(0) scale(1);
  }
  24% {
    transform: translateY(-1px) scale(1.1);
  }
  56% {
    transform: translateY(1px) scale(0.98);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes tactical-hud-gain-pulse {
  0% {
    transform: translateY(0) scale(1);
  }
  36% {
    transform: translateY(-1px) scale(1.04);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes tactical-hud-spend-pulse {
  0% {
    transform: translateY(0) scale(1);
  }
  40% {
    transform: translateY(1px) scale(1.03);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes tactical-hud-route-pulse {
  0% {
    transform: translateY(0) scale(1);
  }
  34% {
    transform: translateY(-2px) scale(1.055);
  }
  68% {
    transform: translateY(0) scale(1.018);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes health-damage-pulse {
  0% {
    transform: translateY(0) scale(1);
  }
  36% {
    transform: translateY(-1px) scale(1.035);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes health-recovery-pulse {
  0% {
    transform: translateY(1px) scale(0.99);
  }
  45% {
    transform: translateY(-1px) scale(1.025);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes ammo-overfull-pulse {
  0% {
    transform: translateY(0) scale(1);
  }
  42% {
    transform: translateY(-1px) scale(1.035);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes power-charge-pulse {
  0% {
    transform: translateY(0) scale(1);
  }
  36% {
    transform: translateY(-1px) scale(1.045);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes heli-rocket-fire-pulse {
  0% {
    transform: translateY(0) scale(1);
  }

  36% {
    transform: translateY(-2px) scale(1.05);
  }

  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes heli-rocket-rearm-pulse {
  0% {
    transform: translateY(0) scale(1);
  }

  42% {
    transform: translateY(-1px) scale(1.04);
  }

  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes heli-rocket-ready-pulse {
  0% {
    transform: translateY(0) scale(1);
    filter: brightness(1);
  }

  34% {
    transform: translateY(-2px) scale(1.052);
    filter: brightness(1.34);
  }

  100% {
    transform: translateY(0) scale(1);
    filter: brightness(1);
  }
}

@keyframes heli-rocket-combo-pulse {
  0% {
    transform: translateY(0) scale(1);
    filter: brightness(1);
  }

  34% {
    transform: translateY(-2px) scale(1.058);
    filter: brightness(1.38);
  }

  100% {
    transform: translateY(0) scale(1);
    filter: brightness(1);
  }
}

@keyframes heli-rocket-combo-warning {
  0% {
    transform: translateY(0) scale(1);
    filter: brightness(1);
  }

  30% {
    transform: translateY(-2px) scale(1.07);
    filter: brightness(1.55) saturate(1.2);
  }

  100% {
    transform: translateY(0) scale(1);
    filter: brightness(1);
  }
}

@keyframes boss-chain-hud-pulse {
  0% {
    transform: translateY(0) scale(1);
    filter: brightness(1);
  }

  26% {
    transform: translateY(-1px) scale(1.045);
    filter: brightness(1.32);
  }

  100% {
    transform: translateY(0) scale(1);
    filter: brightness(1);
  }
}

@keyframes route-lock-stop-read-tick {
  0% {
    opacity: 0.18;
    transform: scaleX(0.18);
  }

  34% {
    opacity: 0.86;
    transform: scaleX(1);
  }

  100% {
    opacity: 0.38;
    transform: scaleX(0.72);
  }
}

@keyframes heli-exit-assist-pulse {
  0% {
    transform: translateY(0) scale(1);
  }

  36% {
    transform: translateY(-1px) scale(1.04);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22), 0 0 26px rgba(141, 255, 177, 0.42), 0 0 14px rgba(255, 179, 108, 0.22);
  }

  100% {
    transform: translateY(0) scale(1);
  }
}

.perf-toggle {
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 7;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-width: 110px;
  height: 38px;
  padding: 0 10px;
  border: 1px solid rgba(242, 203, 87, 0.48);
  border-radius: 8px;
  background: rgba(13, 18, 22, 0.88);
  color: var(--gold);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  cursor: pointer;
  backdrop-filter: blur(8px);
}

.perf-load-badge {
  --perf-density-pulse: 0;
  min-width: 42px;
  padding: 4px 6px;
  border: 1px solid rgba(185, 246, 255, 0.22);
  border-radius: 999px;
  background: rgba(185, 246, 255, 0.08);
  color: var(--blue);
  font-size: 9px;
  line-height: 1;
  text-align: center;
  box-shadow: 0 0 calc(var(--perf-density-pulse, 0) * 14px) rgba(185, 246, 255, calc(var(--perf-density-pulse, 0) * 0.42));
  transform: translateZ(0) scale(calc(1 + var(--perf-density-pulse, 0) * 0.045));
  transition: box-shadow 120ms ease, transform 120ms ease, border-color 120ms ease;
}

.perf-load-badge[data-density-pulse="on"] {
  border-color: rgba(185, 246, 255, 0.44);
  background: linear-gradient(90deg, rgba(185, 246, 255, 0.14), rgba(242, 203, 87, 0.12));
}

.perf-load-badge[data-density-haptic="synced"] {
  border-color: rgba(141, 255, 177, 0.48);
  box-shadow:
    0 0 calc(var(--perf-density-pulse, 0) * 14px) rgba(185, 246, 255, calc(var(--perf-density-pulse, 0) * 0.42)),
    0 0 0 1px rgba(141, 255, 177, 0.22) inset;
}

.perf-load-badge[data-density-haptic="fallback"],
.perf-load-badge[data-density-haptic="failed"] {
  border-style: dashed;
}

.perf-load-badge[data-load="rising"] {
  border-color: rgba(141, 255, 177, 0.34);
  background: rgba(141, 255, 177, 0.1);
  color: var(--green);
}

.perf-load-badge[data-load="falling"],
.perf-load-badge[data-load="performance"],
.perf-load-badge[data-load="high"] {
  border-color: rgba(242, 203, 87, 0.34);
  background: rgba(242, 203, 87, 0.1);
  color: var(--gold);
}

.perf-load-badge[data-load="alert"],
.perf-load-badge[data-load="dropping"] {
  border-color: rgba(237, 91, 71, 0.44);
  background: rgba(237, 91, 71, 0.12);
  color: var(--red);
}

.tab-menu-hint,
.powers-hint,
.look-hint {
  position: absolute;
  left: 50%;
  z-index: 6;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  padding: 8px 11px;
  border: 1px solid rgba(242, 203, 87, 0.44);
  border-radius: 8px;
  background: rgba(13, 18, 22, 0.78);
  color: var(--ink);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  pointer-events: none;
  transform: translateX(-50%);
  transition: opacity 260ms ease, transform 260ms ease;
  backdrop-filter: blur(8px);
}

.tab-menu-hint {
  bottom: 60px;
}

.powers-hint {
  bottom: 106px;
  border-color: rgba(141, 255, 177, 0.42);
}

.look-hint {
  bottom: 152px;
  max-width: calc(100vw - 28px);
  flex-wrap: wrap;
  justify-content: center;
  border-color: rgba(185, 246, 255, 0.46);
}

.warmup-drill {
  position: absolute;
  left: 50%;
  bottom: 202px;
  z-index: 6;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  max-width: calc(100vw - 28px);
  padding: 8px 11px;
  border: 1px solid rgba(141, 255, 177, 0.44);
  border-radius: 8px;
  background: rgba(12, 31, 22, 0.82);
  color: var(--ink);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  pointer-events: none;
  transform: translateX(-50%);
  backdrop-filter: blur(8px);
}

.warmup-drill b,
.warmup-drill span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  letter-spacing: 0;
}

.warmup-drill b {
  color: #8dffb1;
  font-size: 10px;
  font-weight: 950;
}

.warmup-drill span {
  min-width: 54px;
  padding: 4px 7px;
  border: 1px solid rgba(244, 247, 248, 0.14);
  border-radius: 8px;
  background: rgba(6, 9, 12, 0.34);
  color: #dce7ea;
  font-size: 10px;
  font-weight: 900;
  text-align: center;
}

.warmup-drill span[data-state="active"] {
  border-color: rgba(141, 255, 177, 0.54);
  background: rgba(42, 113, 72, 0.38);
  color: #8dffb1;
  box-shadow: 0 0 0 1px rgba(141, 255, 177, 0.1), 0 0 14px rgba(141, 255, 177, 0.14);
}

.tab-menu-hint b,
.powers-hint b,
.look-hint b {
  color: #151515;
  padding: 3px 7px;
  border-radius: 6px;
}

.tab-menu-hint b {
  background: var(--gold);
}

.powers-hint b {
  background: #8dffb1;
}

.look-hint b {
  background: var(--blue);
}

.tab-menu-hint.is-dismissed,
.powers-hint.is-dismissed,
.look-hint.is-dismissed {
  opacity: 0;
  transform: translate(-50%, 8px);
}

.low-ammo-motion-hint {
  position: absolute;
  left: 50%;
  bottom: 202px;
  z-index: 7;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: min(520px, calc(100vw - 28px));
  padding: 8px 10px;
  border: 1px solid rgba(185, 246, 255, 0.42);
  border-radius: 8px;
  background: rgba(13, 18, 22, 0.84);
  color: var(--ink);
  font-size: 10px;
  font-weight: 850;
  line-height: 1.35;
  text-transform: uppercase;
  transform: translateX(-50%);
  transition: opacity 240ms ease, transform 240ms ease, border-color 160ms ease;
  backdrop-filter: blur(8px);
}

.low-ammo-motion-hint b {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 6px;
  background: var(--blue);
  color: #091014;
  font-weight: 950;
}

.low-ammo-motion-hint span {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}

.low-ammo-motion-hint button {
  flex: 0 0 auto;
  min-width: 36px;
  padding: 5px 8px;
  border: 1px solid rgba(185, 246, 255, 0.38);
  border-radius: 6px;
  background: rgba(185, 246, 255, 0.12);
  color: var(--ink);
  font: inherit;
  font-size: 10px;
  font-weight: 950;
  cursor: pointer;
}

.low-ammo-motion-hint[data-motion="reduced"] {
  border-color: rgba(141, 255, 177, 0.46);
  box-shadow: 0 0 18px rgba(141, 255, 177, 0.08);
}

.low-ammo-motion-hint[data-motion="reduced"] b {
  background: #8dffb1;
}

.low-ammo-motion-hint.is-dismissed {
  opacity: 0;
  transform: translate(-50%, 8px);
}

#perf-snapshot {
  position: absolute;
  right: 14px;
  bottom: 60px;
  z-index: 7;
  display: grid;
  gap: 8px;
  width: min(360px, calc(100vw - 28px));
  padding: 10px 12px;
  border: 1px solid rgba(185, 246, 255, 0.34);
  border-radius: 8px;
  background: rgba(9, 14, 18, 0.88);
  color: var(--ink);
  backdrop-filter: blur(8px);
}

#perf-snapshot.hidden {
  display: none;
}

#perf-snapshot > span {
  color: var(--blue);
  font-size: 10px;
  font-weight: 900;
}

#perf-snapshot dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 10px;
  margin: 0;
}

#perf-snapshot div {
  min-width: 0;
}

#perf-snapshot dt {
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

#perf-snapshot dd {
  margin: 2px 0 0;
  overflow-wrap: anywhere;
  color: var(--gold);
  font-size: 11px;
  font-weight: 900;
}

#perf-trend[data-trend="steady"] {
  color: var(--blue);
}

#perf-trend[data-trend="rising"] {
  color: var(--green);
}

#perf-trend[data-trend="falling"] {
  color: var(--gold);
}

#perf-trend[data-trend="dropping"] {
  color: var(--red);
}

#perf-alert[data-alert="none"] {
  color: var(--blue);
}

#perf-alert[data-alert="current"],
#perf-alert[data-alert="fresh"] {
  color: var(--green);
}

#perf-alert[data-alert="stale"] {
  color: var(--gold);
}

#perf-ammo-reduced-motion {
  display: inline-block;
  max-width: min(128px, 42vw);
  padding: 1px 5px;
  border: 1px solid rgba(185, 246, 255, 0.12);
  border-radius: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  background: rgba(185, 246, 255, 0.035);
  vertical-align: bottom;
}

#perf-ammo-reduced-motion[data-ammo-rm="active"] {
  color: var(--gold);
  border-color: rgba(242, 203, 87, 0.28);
  background: rgba(242, 203, 87, 0.075);
  box-shadow:
    inset 0 0 0 1px rgba(255, 241, 166, 0.06),
    0 0 10px rgba(242, 203, 87, 0.08);
}

#perf-ammo-reduced-motion[data-ammo-rm-channel*="empty"] {
  color: #ffb36c;
  border-color: rgba(255, 179, 108, 0.3);
  background: rgba(255, 179, 108, 0.07);
}

#perf-ammo-reduced-motion[data-ammo-rm-channel*="guide"] {
  color: var(--blue);
  border-color: rgba(185, 246, 255, 0.3);
  background: rgba(185, 246, 255, 0.07);
}

#perf-ammo-reduced-motion[data-ammo-rm-channel*="route"] {
  color: var(--green);
  border-color: rgba(141, 255, 177, 0.3);
  background: rgba(141, 255, 177, 0.07);
}

#perf-ammo-reduced-motion[data-ammo-rm-compact="true"] {
  min-width: 24px;
  max-width: min(74px, 32vw);
  text-align: center;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
}

#perf-ammo-reduced-motion[data-ammo-rm-compact-reason="narrow"] {
  text-decoration-line: overline;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(185, 246, 255, 0.38);
}

#perf-grit-budget {
  display: inline-block;
  max-width: min(120px, 38vw);
  --perf-grit-budget-pulse: 0;
  padding: 1px 5px;
  border: 1px solid rgba(185, 246, 255, 0.12);
  border-radius: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  background: rgba(185, 246, 255, 0.035);
  vertical-align: bottom;
}

#perf-grit-budget[data-grit-budget="compact"],
#perf-grit-budget[data-grit-budget="normal"] {
  color: var(--gold);
  border-color: rgba(242, 203, 87, 0.3);
  background: rgba(242, 203, 87, 0.075);
  box-shadow: 0 0 10px rgba(242, 203, 87, 0.08);
}

#perf-grit-budget[data-grit-budget-pulse="on"] {
  box-shadow:
    0 0 calc(10px + var(--perf-grit-budget-pulse, 0) * 10px) rgba(242, 203, 87, calc(0.1 + var(--perf-grit-budget-pulse, 0) * 0.22)),
    inset 0 0 0 1px rgba(255, 241, 166, calc(0.06 + var(--perf-grit-budget-pulse, 0) * 0.18));
}

#perf-grit-budget[data-grit-compact-reason="low-fps"] {
  text-decoration-line: overline;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(242, 203, 87, 0.42);
}

#perf-grit-budget[data-grit-budget-pressure="sustained"] {
  border-style: dashed;
}

#perf-audio-tail {
  display: inline-block;
  max-width: min(118px, 38vw);
  --perf-audio-tail-strength: 0;
  --perf-audio-tail-clear-pulse: 0;
  --perf-audio-tail-memory-rgb: 242, 203, 87;
  padding: 1px 5px;
  border: 1px solid rgba(185, 246, 255, 0.12);
  border-radius: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  background: rgba(185, 246, 255, 0.035);
  vertical-align: bottom;
}

#perf-audio-tail[data-tail-fresh="recent"] {
  color: var(--green);
  border-color: rgba(138, 231, 208, 0.34);
  background: rgba(138, 231, 208, 0.08);
  box-shadow:
    0 0 calc(8px + var(--perf-audio-tail-strength, 0) * 12px) rgba(138, 231, 208, calc(0.08 + var(--perf-audio-tail-strength, 0) * 0.18)),
    inset 0 -2px 0 rgba(138, 231, 208, calc(0.16 + var(--perf-audio-tail-strength, 0) * 0.28));
}

#perf-audio-tail[data-tail-compact-reason="low-fps"] {
  border-style: solid;
  text-decoration-line: overline;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(242, 203, 87, 0.42);
}

#perf-audio-tail[data-tail-clear-pulse="on"] {
  color: var(--gold);
  border-color: rgba(242, 203, 87, calc(0.18 + var(--perf-audio-tail-clear-pulse, 0) * 0.24));
  background: rgba(242, 203, 87, calc(0.04 + var(--perf-audio-tail-clear-pulse, 0) * 0.08));
  box-shadow:
    0 0 calc(7px + var(--perf-audio-tail-clear-pulse, 0) * 12px) rgba(242, 203, 87, calc(0.08 + var(--perf-audio-tail-clear-pulse, 0) * 0.18)),
    inset 0 -2px 0 rgba(242, 203, 87, calc(0.16 + var(--perf-audio-tail-clear-pulse, 0) * 0.3));
}

#perf-audio-tail[data-tail-clear-pulse="on"][data-tail-last-label]:not([data-tail-last-label="label:none"]) {
  border-style: dashed;
  border-color: rgba(var(--perf-audio-tail-memory-rgb), calc(0.2 + var(--perf-audio-tail-clear-pulse, 0) * 0.28));
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(var(--perf-audio-tail-memory-rgb), calc(0.24 + var(--perf-audio-tail-clear-pulse, 0) * 0.4));
  text-underline-offset: 2px;
}

#perf-audio-tail[data-tail-last-surface="roof"] {
  --perf-audio-tail-memory-rgb: 185, 246, 255;
}

#perf-audio-tail[data-tail-last-surface="runway"] {
  --perf-audio-tail-memory-rgb: 164, 211, 224;
}

#perf-audio-tail[data-tail-last-surface="road"] {
  --perf-audio-tail-memory-rgb: 176, 197, 190;
}

#perf-audio-tail[data-tail-last-surface="dirt"] {
  --perf-audio-tail-memory-rgb: 255, 179, 108;
}

#perf-audio-tail[data-tail-decay="snap"] {
  border-color: rgba(185, 246, 255, 0.28);
  background: rgba(185, 246, 255, 0.055);
}

#perf-audio-tail[data-tail-decay="bright"] {
  border-color: rgba(138, 231, 208, 0.28);
  background: rgba(138, 231, 208, 0.055);
}

#perf-audio-tail[data-tail-decay="drag"] {
  border-color: rgba(176, 197, 190, 0.24);
  background: rgba(176, 197, 190, 0.048);
}

#perf-audio-tail[data-tail-decay="heavy"] {
  border-color: rgba(255, 179, 108, 0.26);
  background: rgba(255, 179, 108, 0.052);
}

#perf-hud-edge-cooldown {
  --perf-hud-edge-cooldown-pulse: 0;
  --perf-hud-edge-cooldown-rgb: 242, 203, 87;
  display: inline-block;
  max-width: min(126px, 38vw);
  padding: 1px 5px;
  border: 1px solid rgba(185, 246, 255, 0.12);
  border-radius: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  background: rgba(185, 246, 255, 0.035);
  vertical-align: bottom;
}

#perf-hud-edge-cooldown[data-edge-cooldown="active"] {
  color: var(--gold);
  border-color: rgba(var(--perf-hud-edge-cooldown-rgb), 0.3);
  background: rgba(var(--perf-hud-edge-cooldown-rgb), 0.075);
  box-shadow:
    0 0 10px rgba(var(--perf-hud-edge-cooldown-rgb), 0.1),
    inset 0 0 0 1px rgba(255, 241, 166, 0.08);
}

#perf-hud-edge-cooldown[data-edge-cooldown-pulse="on"] {
  border-color: rgba(var(--perf-hud-edge-cooldown-rgb), calc(0.26 + var(--perf-hud-edge-cooldown-pulse, 0) * 0.28));
  box-shadow:
    0 0 calc(8px + var(--perf-hud-edge-cooldown-pulse, 0) * 14px) rgba(var(--perf-hud-edge-cooldown-rgb), calc(0.1 + var(--perf-hud-edge-cooldown-pulse, 0) * 0.24)),
    inset 0 0 0 1px rgba(255, 241, 166, calc(0.08 + var(--perf-hud-edge-cooldown-pulse, 0) * 0.18));
}

#perf-hud-edge-cooldown[data-edge-compact="true"] {
  max-width: min(86px, 30vw);
  padding-inline: 4px;
  letter-spacing: 0;
}

#perf-hud-edge-cooldown[data-edge-dominant="pan"] {
  --perf-hud-edge-cooldown-rgb: 185, 246, 255;
}

#perf-hud-edge-cooldown[data-edge-dominant="shimmer"] {
  --perf-hud-edge-cooldown-rgb: 138, 231, 208;
}

#perf-hud-edge-cooldown[data-edge-dominant="bridge"] {
  --perf-hud-edge-cooldown-rgb: 255, 211, 107;
}

#perf-hud-edge-cooldown[data-edge-dominant="muffle"] {
  --perf-hud-edge-cooldown-rgb: 164, 211, 224;
}

#perf-hud-edge-cooldown[data-edge-dominant="confidence"] {
  --perf-hud-edge-cooldown-rgb: 141, 255, 177;
}

#perf-hud-edge-cooldown[data-edge-dominant="cap"] {
  --perf-hud-edge-cooldown-rgb: 255, 179, 108;
}

.perf-ammo-rm-legend {
  display: block;
  max-width: min(150px, 46vw);
  margin-top: 3px;
  padding: 2px 5px;
  border-left: 2px solid rgba(185, 246, 255, 0.28);
  border-radius: 3px;
  color: var(--muted);
  background: rgba(185, 246, 255, 0.045);
  font-size: 8px;
  font-weight: 800;
  line-height: 1.15;
  text-transform: uppercase;
}

.perf-ammo-rm-legend[hidden] {
  display: none;
}

#perf-density-cue[data-compact="true"] {
  display: inline-block;
  max-width: min(128px, 42vw);
  padding: 1px 5px;
  border: 1px solid rgba(185, 246, 255, 0.16);
  border-radius: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: rgba(185, 246, 255, 0.045);
  vertical-align: bottom;
}

#perf-density-cue[data-compact-reason="low-fps"] {
  border-color: rgba(242, 203, 87, 0.26);
  background: rgba(242, 203, 87, 0.065);
}

#perf-density-cue[data-compact-reason="narrow"] {
  border-color: rgba(185, 246, 255, 0.18);
}

#perf-density-cue[data-cue="calm"] {
  color: var(--blue);
}

#perf-density-cue[data-cue="active"] {
  color: var(--gold);
}

#perf-density-cue[data-cue="synced"] {
  color: var(--green);
}

#perf-density-cue[data-cue="fallback"] {
  color: var(--gold);
  text-decoration: underline dashed rgba(242, 203, 87, 0.48);
  text-underline-offset: 2px;
}

#perf-density-cue[data-cue="failed"] {
  color: var(--red);
}

#perf-secured-feedback {
  display: inline-block;
  max-width: min(190px, 48vw);
  padding: 1px 5px;
  border: 1px solid rgba(185, 246, 255, 0.12);
  border-radius: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: rgba(185, 246, 255, 0.04);
  vertical-align: bottom;
}

#perf-secured-feedback[data-secured-feedback-lane="normal"] {
  color: var(--green);
  border-color: rgba(130, 245, 164, 0.18);
  background: rgba(130, 245, 164, 0.055);
}

#perf-secured-feedback[data-secured-feedback-lane="compact"] {
  color: var(--gold);
  border-color: rgba(242, 203, 87, 0.22);
  background: rgba(242, 203, 87, 0.065);
}

#perf-secured-feedback[data-compact="true"] {
  max-width: min(140px, 42vw);
  letter-spacing: 0.02em;
  border-color: rgba(242, 203, 87, 0.3);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025);
}

#perf-secured-feedback[data-secured-pickup-lock-state="locked"] {
  box-shadow:
    inset 0 0 0 1px rgba(141, 255, 177, 0.06),
    0 0 10px rgba(141, 255, 177, 0.055);
}

#perf-secured-feedback[data-secured-pickup-lock-state="drift"] {
  color: var(--gold);
  border-color: rgba(255, 198, 87, 0.36);
  background: rgba(255, 198, 87, 0.09);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.035),
    0 0 12px rgba(255, 198, 87, 0.08);
}

#perf-secured-feedback[data-secured-pickup-drift-pulse="on"] {
  transform: translateY(calc(var(--secured-pickup-drift-pulse, 0) * -1px));
  border-color: rgba(255, 205, 101, 0.5);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, calc(0.04 + var(--secured-pickup-drift-pulse, 0) * 0.08)),
    0 0 calc(10px + var(--secured-pickup-drift-pulse, 0) * 8px) rgba(255, 198, 87, calc(0.08 + var(--secured-pickup-drift-pulse, 0) * 0.12));
}

#perf-secured-feedback[data-secured-haptic-status="fallback"] {
  border-color: rgba(255, 241, 166, 0.34);
  background: rgba(255, 241, 166, 0.075);
}

#perf-secured-feedback[data-secured-haptic-status="failed"],
#perf-secured-feedback[data-secured-haptic-status="off"] {
  border-color: rgba(255, 179, 108, 0.28);
  background: rgba(255, 179, 108, 0.065);
}

#perf-secured-feedback[data-secured-feedback-lane="idle"] {
  color: var(--muted);
}

#perf-snapshot .perf-recommendation-row {
  grid-column: 1 / -1;
  padding: 6px 8px;
  border: 1px solid rgba(185, 246, 255, 0.14);
  border-radius: 8px;
  background: rgba(185, 246, 255, 0.055);
}

#perf-snapshot .perf-recommendation-row dd {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  overflow: hidden;
}

#perf-recommendation {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#perf-warning {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#perf-recommendation[data-recommendation="steady"] {
  color: var(--blue);
}

#perf-recommendation[data-recommendation="switch"] {
  color: var(--green);
}

#perf-recommendation[data-recommendation="active"] {
  color: var(--gold);
}

#perf-recommendation[data-recommendation="recover"] {
  color: var(--blue);
}

#perf-recommendation[data-recommendation="confirmed"] {
  color: var(--green);
}

.perf-apply-performance,
.perf-apply-balanced {
  flex: 0 0 auto;
  max-width: 136px;
  min-height: 26px;
  padding: 0 9px;
  border: 1px solid rgba(141, 255, 177, 0.42);
  border-radius: 8px;
  background: rgba(141, 255, 177, 0.1);
  color: var(--green);
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
}

.perf-apply-balanced {
  border-color: rgba(185, 246, 255, 0.38);
  background: rgba(185, 246, 255, 0.09);
  color: var(--blue);
}

.perf-apply-performance:disabled,
.perf-apply-balanced:disabled {
  cursor: default;
  opacity: 0.45;
}

#perf-snapshot div:last-child {
  grid-column: 1 / -1;
}

#crosshair {
  --ammo-cover-peek-settle-x: 0px;
  --ammo-cover-peek-settle-y: 0px;
  --ammo-cover-peek-settle-scale: 1;
  --ammo-cover-peek-settle-opacity: 0;
  --boss-dust-thump-reticle: 0;
  --boss-dust-thump-reticle-beat: 0;
  --boss-dust-thump-reticle-alpha: 0;
  --boss-dust-thump-reticle-beat-alpha: 0;
  --boss-dust-thump-reticle-glow-size: 18px;
  --boss-dust-thump-reticle-beat-glow-size: 34px;
  --boss-air-slice-x: 0px;
  --boss-air-slice-rotate: 0deg;
  --boss-air-slice-cross-x: 0px;
  --boss-air-slice-cross-y: 0px;
  --boss-air-slice-before-rotate: 0deg;
  --boss-air-slice-after-rotate: 0deg;
  --boss-air-slice-reticle-stretch: 0;
  --boss-air-slice-reticle-alpha: 0;
  --boss-air-slice-reticle-beat-alpha: 0;
  --boss-air-slice-reticle-glow-size: 16px;
  --boss-air-slice-reticle-beat-glow-size: 30px;
  --boss-air-slice-rgb: 217, 165, 255;
  --boss-air-slice-hot-rgb: 96, 210, 255;
  --boss-air-slice-dodge-before-x: 0px;
  --boss-air-slice-dodge-after-x: 0px;
  --boss-air-slice-dodge-y: 0px;
  --boss-air-slice-dodge-before-rotate: 0deg;
  --boss-air-slice-dodge-after-rotate: 0deg;
  --boss-air-slice-dodge-before-scale: 0;
  --boss-air-slice-dodge-after-scale: 0;
  --boss-air-slice-dodge-alpha: 0;
  --boss-air-slice-dodge-soft-alpha: 0;
  --boss-air-slice-dodge-glow-size: 20px;
  --boss-air-slice-dodge-soft-glow-size: 38px;
  --boss-air-slice-safe-alpha: 0;
  --boss-air-slice-safe-x: 0px;
  --boss-air-slice-safe-scale: 1;
  --boss-air-slice-safe-glow-size: 15px;
  --boss-air-slice-fail-alpha: 0;
  --boss-air-slice-fail-x: 0px;
  --boss-air-slice-fail-scale: 1;
  --boss-air-slice-fail-glow-size: 17px;
  --ammo-safe-lane-reticle: 0;
  --ammo-safe-lane-reticle-beat: 0;
  --ammo-safe-lane-reticle-alpha: 0;
  --ammo-safe-lane-reticle-surface-tick: 0;
  --ammo-safe-lane-reticle-surface-rgb: 180, 154, 104;
  --ammo-safe-lane-reticle-tail: 0;
  --ammo-safe-lane-reticle-tail-rgb: 185, 246, 255;
  --ammo-chase-footfall-reticle: 0;
  --ammo-chase-footfall-reticle-x: 0px;
  --ammo-chase-footfall-reticle-alpha: 0;
  --ammo-chase-footfall-reticle-rgb: 255, 179, 108;
  --ammo-clear-lock-reticle: 0;
  --ammo-clear-lock-x: 0px;
  --ammo-clear-lock-glow-size: 18px;
  --ammo-group-ripple-reticle-lean: 0;
  --ammo-group-ripple-reticle-lean-x: 0px;
  --ammo-group-ripple-reticle-lean-glow: 0;
  --casing-landing-reticle: 0;
  --casing-landing-reticle-x: 0px;
  --casing-landing-reticle-rgb: 255, 213, 109;
  --casing-landing-reticle-surface: 0;
  --casing-landing-reticle-surface-x: 0px;
  --casing-landing-reticle-surface-rgb: 202, 165, 106;
  --mutant-near-miss-reticle: 0;
  --mutant-near-miss-reticle-alpha: 0;
  --mutant-near-miss-reticle-rgb: 255, 121, 242;
  --mutant-near-miss-reticle-surface: 0;
  --mutant-near-miss-reticle-low-fps: 0;
  --mutant-near-miss-reticle-surface-glow-size: 10px;
  --mutant-near-miss-reticle-core-glow-size: 13px;
  --mutant-near-miss-reticle-soft-glow-size: 24px;
  --mutant-near-miss-reticle-soft-alpha: 0;
  --mutant-near-miss-reticle-before-x: 0px;
  --mutant-near-miss-reticle-after-x: 0px;
  --mutant-near-miss-reticle-y: 0px;
  --mutant-near-miss-reticle-before-rotate: 0deg;
  --mutant-near-miss-reticle-after-rotate: 0deg;
  --extraction-altitude-reticle: 0;
  --extraction-altitude-reticle-beat: 0;
  --extraction-altitude-reticle-alpha: 0;
  --extraction-altitude-reticle-glow-size: 17px;
  --extraction-boarding-lock-reticle: 0;
  --extraction-boarding-lock-alpha: 0;
  --extraction-boarding-lock-glow-size: 16px;
  --extraction-endpoint-reticle: 0;
  --extraction-endpoint-reticle-x: 0px;
  --extraction-route-lock-reticle: 0;
  --extraction-route-lock-scale: 1;
  --extraction-complete-reticle: 0;
  --extraction-complete-reticle-beat: 0;
  --extraction-complete-reticle-alpha: 0;
  --extraction-complete-reticle-glow-size: 18px;
  --extraction-complete-reticle-soft-glow-size: 34px;
  --wounded-ammo-recovery-aim: 0;
  --wounded-ammo-recovery-aim-settle: 0;
  --wounded-ammo-recovery-aim-x: 0px;
  --wounded-ammo-recovery-aim-y: 0px;
  --wounded-ammo-ready-settle: 0;
  --wounded-ammo-ready-settle-scale: 0;
  --wounded-ammo-steady-tick: 0;
  --wounded-ammo-steady-tick-scale: 1;
  --wounded-ammo-secured-pip: 0;
  --wounded-ammo-secured-pip-scale: 1;
  --wounded-ammo-secured-tail-sync: 0;
  --wounded-ammo-secured-seat: 0;
  --wounded-ammo-secured-pan-glint: 0;
  --wounded-ammo-secured-pan-glint-x: 0px;
  --heartbeat-calm-echo: 0;
  --heartbeat-calm-echo-scale: 1;
  --wounded-ammo-threat-flick: 0;
  --wounded-ammo-threat-flick-x: 0px;
  --wounded-ammo-threat-clear: 0;
  --wounded-ammo-clear-forward-bead: 0;
  --wounded-ammo-clear-forward-bead-y: 0px;
  --wounded-ammo-clear-forward-bead-scale: 0.72;
  --wounded-supply-reticle: 0;
  --wounded-supply-reticle-x: 0px;
  --wounded-supply-reticle-opacity: 0;
  --sprint-skid-strain: 0;
  --sprint-skid-strain-x: 0px;
  --roof-landing-recovery: 0;
  --roof-landing-recovery-y: 0px;
  --roof-recovery-reacquire-reticle: 0;
  --roof-recovery-reacquire-side: 0;
  --roof-recovery-reacquire-x: 0px;
  --roof-recovery-plant-edge: 0;
  --roof-recovery-plant-edge-side: 0;
  --roof-recovery-plant-edge-x: 0px;
  --roof-recovery-plant-reticle-side-shimmer: 0;
  --roof-recovery-plant-reticle-side-shimmer-x: 0px;
  --roof-recovery-plant-reticle-side-shimmer-spread: 10px;
  --roof-recovery-plant-edge-rgb: 255, 220, 150;
  --roof-recovery-plant-edge-glow-scale: 1;
  --roof-recovery-plant-edge-afterglow: 0;
  --roof-recovery-plant-afterglow-shape: 0.5;
  --roof-recovery-plant-afterglow-streak: 0.5;
  --roof-recovery-plant-grit-hud: 0;
  --roof-recovery-plant-grit-hud-x: 0px;
  --roof-recovery-plant-grit-hud-rgb: 255, 220, 150;
  --extraction-route-lock-arrival-reticle: 0;
  --extraction-route-lock-arrival-side: 0px;
  --extraction-route-lock-arrival-scale: 1;
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 3;
  width: 22px;
  height: 22px;
  transform: translate(calc(-50% + var(--boss-air-slice-x, 0px) + var(--ammo-clear-lock-x, 0px) + var(--ammo-group-ripple-reticle-lean-x, 0px) + var(--wounded-ammo-recovery-aim-x, 0px) + var(--sprint-skid-strain-x, 0px) + var(--roof-recovery-reacquire-x, 0px) + var(--roof-recovery-plant-edge-x, 0px) + var(--extraction-endpoint-reticle-x, 0px)), calc(-50% + var(--wounded-ammo-recovery-aim-y, 0px) + var(--roof-landing-recovery-y, 0px))) rotate(var(--boss-air-slice-rotate, 0deg)) scale(var(--kick-scale, 1));
  opacity: var(--kick-opacity, 0.82);
  pointer-events: none;
  transition: filter 90ms ease-out;
}

.roof-plant-feel-debug {
  position: absolute;
  left: 50%;
  top: calc(50% + 44px);
  z-index: 6;
  min-width: 148px;
  max-width: min(72vw, 760px);
  padding: 6px 10px;
  transform: translateX(-50%);
  border: 1px solid rgba(255, 220, 150, 0.32);
  border-radius: 6px;
  background: rgba(10, 14, 18, 0.74);
  color: rgba(255, 241, 166, 0.92);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.35;
  letter-spacing: 0;
  text-align: center;
  text-transform: uppercase;
  white-space: normal;
  overflow-wrap: anywhere;
  pointer-events: none;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.72);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28), 0 0 16px rgba(255, 220, 150, 0.1);
  transition: transform 90ms ease-out, box-shadow 120ms ease-out, filter 120ms ease-out;
}

.roof-plant-feel-debug[data-feel="sharp"] {
  border-color: rgba(255, 238, 176, 0.52);
  color: rgba(255, 248, 202, 0.96);
}

.roof-plant-feel-debug[data-feel="balanced"] {
  border-color: rgba(138, 231, 208, 0.46);
  color: rgba(188, 255, 236, 0.94);
}

.roof-plant-feel-debug[data-feel="soft"] {
  border-color: rgba(190, 210, 150, 0.42);
  color: rgba(229, 244, 184, 0.92);
}

.roof-plant-feel-debug[data-surface="roof"] {
  background: linear-gradient(90deg, rgba(185, 246, 255, 0.24) 0 5px, rgba(10, 14, 18, 0.78) 5px);
  box-shadow: inset 0 0 0 1px rgba(185, 246, 255, 0.08), 0 8px 22px rgba(0, 0, 0, 0.28), 0 0 16px rgba(185, 246, 255, 0.1);
}

.roof-plant-feel-debug[data-surface="runway"] {
  background: linear-gradient(90deg, rgba(138, 231, 208, 0.22) 0 5px, rgba(10, 14, 18, 0.78) 5px);
  box-shadow: inset 0 0 0 1px rgba(138, 231, 208, 0.08), 0 8px 22px rgba(0, 0, 0, 0.28), 0 0 16px rgba(138, 231, 208, 0.1);
}

.roof-plant-feel-debug[data-surface="road"] {
  background: linear-gradient(90deg, rgba(255, 211, 106, 0.22) 0 5px, rgba(10, 14, 18, 0.78) 5px);
  box-shadow: inset 0 0 0 1px rgba(255, 211, 106, 0.08), 0 8px 22px rgba(0, 0, 0, 0.28), 0 0 16px rgba(255, 211, 106, 0.1);
}

.roof-plant-feel-debug[data-surface="dirt"] {
  background: linear-gradient(90deg, rgba(255, 156, 90, 0.24) 0 5px, rgba(10, 14, 18, 0.78) 5px);
  box-shadow: inset 0 0 0 1px rgba(255, 156, 90, 0.08), 0 8px 22px rgba(0, 0, 0, 0.28), 0 0 16px rgba(255, 156, 90, 0.1);
}

.roof-plant-feel-debug[data-threat-band="near"] {
  border-color: rgba(255, 126, 98, 0.7);
  color: rgba(255, 226, 207, 0.98);
  box-shadow: inset 0 0 0 1px rgba(255, 126, 98, 0.12), 0 8px 22px rgba(0, 0, 0, 0.32), 0 0 22px rgba(255, 126, 98, 0.24);
}

.roof-plant-feel-debug[data-threat-band="mid"] {
  border-color: rgba(255, 211, 106, 0.55);
  box-shadow: inset 0 0 0 1px rgba(255, 211, 106, 0.1), 0 8px 22px rgba(0, 0, 0, 0.3), 0 0 18px rgba(255, 211, 106, 0.16);
}

.roof-plant-feel-debug[data-threat-band="far"] {
  filter: saturate(0.96);
}

.roof-plant-feel-debug[data-landing-confidence-band="high"] {
  outline: 1px solid rgba(138, 231, 208, 0.38);
  outline-offset: 2px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.72), 0 0 9px rgba(138, 231, 208, 0.32);
}

.roof-plant-feel-debug[data-landing-confidence-band="steady"] {
  outline: 1px solid rgba(255, 238, 176, 0.3);
  outline-offset: 2px;
}

.roof-plant-feel-debug[data-landing-confidence-band="low"] {
  border-color: rgba(255, 156, 90, 0.62);
  box-shadow: inset 0 0 0 1px rgba(255, 156, 90, 0.14), 0 8px 22px rgba(0, 0, 0, 0.32), 0 0 18px rgba(255, 156, 90, 0.2);
}

.roof-plant-feel-debug[data-threat-decay="hot"] {
  outline: 1px solid rgba(255, 126, 98, 0.38);
  outline-offset: 2px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.72), 0 0 9px rgba(255, 126, 98, 0.42);
}

.roof-plant-feel-debug[data-threat-decay="warm"] {
  outline: 1px solid rgba(255, 211, 106, 0.24);
  outline-offset: 2px;
}

.roof-plant-feel-debug[data-threat-decay="cool"] {
  opacity: 0.9;
}

.roof-plant-feel-debug[data-threat-decay="hot"][data-threat-decay-age-band="fresh"] {
  box-shadow: inset 0 0 0 1px rgba(255, 126, 98, 0.2), 0 8px 22px rgba(0, 0, 0, 0.34), 0 0 28px rgba(255, 126, 98, 0.34);
}

.roof-plant-feel-debug[data-threat-decay-age-band="settling"] {
  filter: saturate(1.03);
}

.roof-plant-feel-debug[data-threat-decay-age-band="spent"] {
  filter: saturate(0.92);
}

.roof-plant-feel-debug[data-material-tick-age-band="fresh"] {
  border-color: rgba(255, 238, 176, 0.62);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.72), 0 0 10px rgba(255, 238, 176, 0.42);
}

.roof-plant-feel-debug[data-material-tick-age-band="settling"] {
  filter: saturate(1.02) brightness(0.96);
}

.roof-plant-feel-debug[data-material-tick-age-band="stale"] {
  filter: saturate(0.88) brightness(0.9);
  opacity: 0.86;
}

.roof-plant-feel-debug[data-material-tick-side="left"] {
  transform: translateX(calc(-50% - 5px));
  box-shadow: inset 4px 0 0 rgba(255, 238, 176, 0.24), 0 8px 22px rgba(0, 0, 0, 0.3), -8px 0 18px rgba(255, 238, 176, 0.12);
}

.roof-plant-feel-debug[data-material-tick-side="right"] {
  transform: translateX(calc(-50% + 5px));
  box-shadow: inset -4px 0 0 rgba(255, 238, 176, 0.24), 0 8px 22px rgba(0, 0, 0, 0.3), 8px 0 18px rgba(255, 238, 176, 0.12);
}

.roof-plant-feel-debug[data-previous-material*="->"] {
  outline: 1px solid rgba(255, 255, 255, 0.1);
  outline-offset: 2px;
}

.roof-plant-feel-debug[data-chain-summary*="hop"] {
  filter: saturate(1.08);
}

.roof-plant-feel-debug[data-sync="drift"] {
  border-color: rgba(255, 136, 112, 0.46);
  color: rgba(255, 195, 180, 0.94);
}

.roof-plant-feel-debug[data-cue-stack-sync="drift"] {
  border-color: rgba(255, 102, 86, 0.62);
  color: rgba(255, 210, 202, 0.98);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.3), 0 0 20px rgba(255, 102, 86, 0.2);
}

.roof-plant-feel-debug[data-cue-stack-drift-map="v1/a1/h1/s1"] {
  box-shadow: inset 0 0 0 1px rgba(138, 231, 208, 0.1), 0 8px 22px rgba(0, 0, 0, 0.28), 0 0 16px rgba(138, 231, 208, 0.12);
}

.roof-plant-feel-debug[data-cue-stack-drift-map*="v0"] {
  border-color: rgba(255, 102, 86, 0.66);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.72), 0 0 8px rgba(255, 102, 86, 0.34);
}

.roof-plant-feel-debug[data-cue-stack-drift-map*="/a0"] {
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.3), 0 0 20px rgba(95, 220, 255, 0.22);
}

.roof-plant-feel-debug[data-cue-stack-drift-map*="/h0"] {
  outline: 1px solid rgba(180, 146, 255, 0.36);
  outline-offset: 2px;
}

.roof-plant-feel-debug[data-cue-stack-drift-map*="/s0"] {
  filter: saturate(1.1);
}

.roof-plant-feel-debug[data-cue-stack-compaction="lfc"] {
  border-style: dashed;
  color: rgba(210, 244, 255, 0.96);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.72), 0 0 7px rgba(95, 220, 255, 0.28);
}

.roof-plant-feel-debug[data-cue-stack-budget="5/5"] {
  outline: 1px solid rgba(138, 231, 208, 0.24);
  outline-offset: 2px;
}

.roof-plant-feel-debug[data-cue-stack-budget="4/5"],
.roof-plant-feel-debug[data-cue-stack-budget="3/5"] {
  border-color: rgba(255, 211, 106, 0.58);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.72), 0 0 8px rgba(255, 211, 106, 0.28);
}

.roof-plant-feel-debug[data-cue-stack-budget-miss="ok"] {
  filter: saturate(1.02);
}

.roof-plant-feel-debug[data-cue-stack-budget-miss*="hud"],
.roof-plant-feel-debug[data-cue-stack-budget-miss*="aud"],
.roof-plant-feel-debug[data-cue-stack-budget-miss*="side"] {
  color: rgba(255, 235, 184, 0.98);
  box-shadow: inset 0 0 0 1px rgba(255, 211, 106, 0.12), 0 8px 22px rgba(0, 0, 0, 0.32), 0 0 18px rgba(255, 211, 106, 0.2);
}

.roof-plant-feel-debug[data-cue-stack-cause*="visual"] {
  background: linear-gradient(90deg, rgba(255, 102, 86, 0.24) 0 4px, rgba(10, 14, 18, 0.78) 4px);
}

.roof-plant-feel-debug[data-cue-stack-cause*="audio"] {
  background: linear-gradient(90deg, rgba(95, 220, 255, 0.24) 0 4px, rgba(10, 14, 18, 0.78) 4px);
}

.roof-plant-feel-debug[data-cue-stack-cause*="haptic"] {
  background: linear-gradient(90deg, rgba(180, 146, 255, 0.26) 0 4px, rgba(10, 14, 18, 0.78) 4px);
}

.roof-plant-feel-debug[data-cue-stack-cause*="side"] {
  background: linear-gradient(90deg, rgba(255, 210, 96, 0.26) 0 4px, rgba(10, 14, 18, 0.78) 4px);
}

.roof-plant-feel-debug[data-cue-stack-cause="forced"] {
  background: linear-gradient(90deg, rgba(255, 102, 86, 0.28) 0 4px, rgba(95, 220, 255, 0.2) 4px 8px, rgba(10, 14, 18, 0.78) 8px);
}

.roof-plant-feel-debug[data-freshness="stale"] {
  border-color: rgba(255, 156, 90, 0.58);
  color: rgba(255, 209, 164, 0.96);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.3), 0 0 18px rgba(255, 156, 90, 0.18);
}

.roof-plant-feel-debug[data-landing-confidence-streak-band="recovering"] {
  outline: 1px solid rgba(255, 238, 176, 0.34);
  outline-offset: 3px;
}

.roof-plant-feel-debug[data-landing-confidence-streak-band="building"] {
  border-color: rgba(138, 231, 208, 0.62);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.72), 0 0 10px rgba(138, 231, 208, 0.34);
  box-shadow: inset 0 0 0 1px rgba(138, 231, 208, 0.14), 0 8px 22px rgba(0, 0, 0, 0.3), 0 0 22px rgba(138, 231, 208, 0.2);
}

.roof-plant-feel-debug[data-landing-confidence-streak-band="locked"] {
  border-color: rgba(185, 246, 255, 0.72);
  color: rgba(224, 255, 247, 0.98);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.72), 0 0 12px rgba(185, 246, 255, 0.42);
  box-shadow: inset 0 0 0 1px rgba(185, 246, 255, 0.16), 0 8px 22px rgba(0, 0, 0, 0.32), 0 0 28px rgba(185, 246, 255, 0.24);
  animation: roof-plant-confidence-lock-pulse 0.64s ease-out;
}

.roof-plant-feel-debug[data-landing-confidence-lock-age-band="fresh"] {
  outline: 1px solid rgba(185, 246, 255, 0.46);
  outline-offset: 3px;
}

.roof-plant-feel-debug[data-landing-confidence-lock-age-band="settling"] {
  filter: saturate(1.04) brightness(0.98);
}

.roof-plant-feel-debug[data-landing-confidence-lock-age-band="stale"] {
  border-color: rgba(255, 211, 106, 0.62);
  color: rgba(255, 239, 190, 0.96);
}

.roof-plant-feel-debug[data-landing-confidence-lock-audio-age-band="fresh"] {
  text-decoration: underline;
  text-decoration-color: rgba(185, 246, 255, 0.72);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  box-shadow: inset 0 -3px 0 rgba(185, 246, 255, 0.16), inset 0 0 0 1px rgba(185, 246, 255, 0.14), 0 8px 22px rgba(0, 0, 0, 0.32), 0 0 30px rgba(185, 246, 255, 0.22);
}

.roof-plant-feel-debug[data-landing-confidence-lock-audio-age-band="settling"] {
  text-decoration: underline;
  text-decoration-color: rgba(138, 231, 208, 0.38);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.roof-plant-feel-debug[data-landing-confidence-lock-audio-age-band="stale"] {
  box-shadow: inset 0 -2px 0 rgba(255, 211, 106, 0.12), 0 8px 22px rgba(0, 0, 0, 0.3);
}

.roof-plant-feel-debug[data-landing-confidence-lock-audio-status="audible"] {
  border-bottom-color: rgba(138, 231, 208, 0.8);
}

.roof-plant-feel-debug[data-landing-confidence-lock-audio-status="visual-only"] {
  border-bottom-color: rgba(255, 211, 106, 0.82);
  color: rgba(255, 239, 190, 0.98);
}

.roof-plant-feel-debug[data-landing-confidence-lock-audio-status="silent"] {
  border-bottom-color: rgba(255, 255, 255, 0.2);
}

.roof-plant-feel-debug[data-landing-confidence-lock-audio-reason="played"] {
  outline-color: rgba(138, 231, 208, 0.54);
}

.roof-plant-feel-debug[data-landing-confidence-lock-audio-reason="visual-mode"] {
  outline-color: rgba(255, 211, 106, 0.62);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.72), 0 0 10px rgba(255, 211, 106, 0.22);
}

.roof-plant-feel-debug[data-landing-confidence-lock-audio-reason="audio-locked"] {
  outline-color: rgba(95, 220, 255, 0.48);
  border-bottom-style: dashed;
}

.roof-plant-feel-debug[data-landing-confidence-lock-audio-reason="gain-muted"] {
  outline-color: rgba(255, 255, 255, 0.24);
  opacity: 0.92;
}

@keyframes roof-plant-confidence-lock-pulse {
  0% {
    filter: brightness(0.96) saturate(1);
  }
  42% {
    filter: brightness(1.24) saturate(1.12);
  }
  100% {
    filter: brightness(1) saturate(1);
  }
}

#crosshair.is-low-ammo-steady {
  filter:
    drop-shadow(0 0 6px rgba(255, 213, 109, 0.42))
    drop-shadow(0 0 13px rgba(255, 140, 56, 0.18));
}

#crosshair.is-low-ammo {
  filter:
    drop-shadow(0 0 8px rgba(255, 213, 109, 0.6))
    drop-shadow(0 0 16px rgba(255, 140, 56, 0.24));
}

#crosshair.is-hit-confirm {
  outline: 1px solid rgba(141, 255, 177, 0.42);
  outline-offset: 5px;
  filter:
    drop-shadow(0 0 10px rgba(92, 231, 126, 0.62))
    drop-shadow(0 0 18px rgba(185, 246, 255, 0.18));
}

#crosshair.is-kill-confirm {
  outline: 1px solid rgba(255, 241, 166, 0.52);
  outline-offset: 7px;
  filter:
    drop-shadow(0 0 12px rgba(92, 255, 126, 0.78))
    drop-shadow(0 0 24px rgba(255, 241, 166, 0.34));
}

#crosshair.is-first-kill-confidence {
  outline: 1px solid rgba(185, 246, 255, 0.5);
  outline-offset: 8px;
  filter:
    drop-shadow(0 0 13px rgba(141, 255, 177, 0.76))
    drop-shadow(0 0 26px rgba(255, 241, 166, 0.38));
}

#crosshair.is-supply-reward-spark {
  outline: 1px solid rgba(255, 241, 166, calc(0.38 + var(--supply-reward-reticle, 0) * 0.24));
  outline-offset: calc(5px + var(--supply-reward-reticle, 0) * 3px);
  filter:
    drop-shadow(0 0 calc(10px + var(--supply-reward-reticle, 0) * 14px) rgba(255, 241, 166, 0.62))
    drop-shadow(0 0 calc(20px + var(--supply-reward-reticle, 0) * 18px) rgba(141, 255, 177, 0.28));
}

#crosshair.is-supply-reward-soften {
  transform: scale(calc(1 - var(--supply-reward-reticle-soften, 0) * 0.035));
}

#crosshair.is-supply-reward-secured-tick {
  outline-style: double;
  outline-offset: calc(3px + var(--supply-reward-secured-tick, 0) * 2px);
  transition: outline-offset var(--supply-reward-secured-tick-ms, 360ms) ease-out;
}

#crosshair.is-supply-reward-endpoint-glint {
  transform: translateX(var(--supply-reward-endpoint-glint-x, 0px)) scale(calc(1 + var(--supply-reward-endpoint-glint, 0) * 0.045));
}

#crosshair.is-extraction-endpoint-reticle {
  outline: 1px solid rgba(185, 246, 255, calc(0.28 + var(--extraction-endpoint-reticle, 0) * 0.22));
  outline-offset: calc(4px + var(--extraction-endpoint-reticle, 0) * 2px);
  filter:
    drop-shadow(0 0 calc(8px + var(--extraction-endpoint-reticle, 0) * 10px) rgba(185, 246, 255, 0.58))
    drop-shadow(0 0 calc(18px + var(--extraction-endpoint-reticle, 0) * 16px) rgba(141, 255, 177, 0.24));
}

#crosshair.is-extraction-route-locked {
  outline: 1px solid rgba(141, 255, 177, calc(0.24 + var(--extraction-route-lock-reticle, 0) * 0.2));
  outline-offset: calc(3px + var(--extraction-route-lock-reticle, 0) * 2px);
  filter:
    drop-shadow(0 0 calc(7px + var(--extraction-route-lock-reticle, 0) * 9px) rgba(141, 255, 177, 0.58))
    drop-shadow(0 0 calc(16px + var(--extraction-route-lock-reticle, 0) * 12px) rgba(185, 246, 255, 0.22));
}

#crosshair.is-extraction-route-lock-arrival {
  outline-color: rgba(185, 246, 255, calc(0.3 + var(--extraction-route-lock-arrival-reticle, 0) * 0.28));
  outline-offset: calc(4px + var(--extraction-route-lock-arrival-reticle, 0) * 3px);
  filter:
    drop-shadow(var(--extraction-route-lock-arrival-side, 0px) 0 calc(7px + var(--extraction-route-lock-arrival-reticle, 0) * 12px) rgba(185, 246, 255, 0.62))
    drop-shadow(calc(var(--extraction-route-lock-arrival-side, 0px) * -0.55) 0 calc(5px + var(--extraction-route-lock-arrival-reticle, 0) * 9px) rgba(141, 255, 177, 0.34));
}

#crosshair.is-dry-fire {
  filter:
    drop-shadow(0 0 9px rgba(255, 140, 56, 0.64))
    drop-shadow(0 0 18px rgba(237, 91, 71, 0.3));
}

#crosshair.is-empty-urgency {
  outline-color: rgba(255, 241, 166, calc(0.18 + var(--crosshair-empty-urgency, 0) * 0.22));
  outline-offset: calc(3px + var(--crosshair-empty-urgency, 0) * 2px);
  filter:
    drop-shadow(calc(var(--crosshair-empty-urgency, 0) * 2px) 0 calc(8px + var(--crosshair-empty-urgency, 0) * 8px) rgba(255, 140, 56, 0.62))
    drop-shadow(calc(var(--crosshair-empty-urgency, 0) * -1.5px) 0 calc(16px + var(--crosshair-empty-urgency, 0) * 14px) rgba(237, 91, 71, 0.34));
}

#crosshair.is-sprint-skid-strain {
  filter:
    drop-shadow(0 0 calc(7px + var(--sprint-skid-strain, 0) * 8px) rgba(255, 211, 106, 0.58))
    drop-shadow(0 0 calc(14px + var(--sprint-skid-strain, 0) * 12px) rgba(255, 140, 56, 0.22));
}

#crosshair.is-roof-landing-recovery {
  filter:
    drop-shadow(0 0 calc(8px + var(--roof-landing-recovery, 0) * 9px) rgba(185, 246, 255, 0.56))
    drop-shadow(0 0 calc(18px + var(--roof-landing-recovery, 0) * 14px) rgba(141, 255, 177, 0.22))
    drop-shadow(0 0 calc(6px + var(--roof-recovery-reacquire-reticle, 0) * 9px) rgba(255, 190, 92, calc(var(--roof-recovery-reacquire-reticle, 0) * 0.46)))
    drop-shadow(var(--roof-recovery-plant-reticle-side-shimmer-x, 0px) 0 calc(3px + var(--roof-recovery-plant-reticle-side-shimmer, 0) * var(--roof-recovery-plant-reticle-side-shimmer-spread, 10px)) rgba(var(--roof-recovery-plant-edge-rgb), calc(var(--roof-recovery-plant-reticle-side-shimmer, 0) * 0.42)))
    drop-shadow(var(--roof-recovery-plant-mote-reticle-echo-x, 0px) 0 calc(4px + var(--roof-recovery-plant-mote-reticle-echo, 0) * 11px) rgba(var(--roof-recovery-plant-grit-hud-rgb), calc(var(--roof-recovery-plant-mote-reticle-echo, 0) * 0.32)))
    drop-shadow(0 0 calc(10px + var(--roof-recovery-plant-edge-afterglow, 0) * (12px + var(--roof-recovery-plant-afterglow-shape, 0.5) * 12px)) rgba(var(--roof-recovery-plant-edge-rgb), calc(var(--roof-recovery-plant-edge-afterglow, 0) * (0.22 + var(--roof-recovery-plant-afterglow-shape, 0.5) * 0.16))))
    drop-shadow(0 0 calc(5px + var(--roof-recovery-plant-edge, 0) * var(--roof-recovery-plant-edge-glow-scale, 1) * 12px) rgba(var(--roof-recovery-plant-edge-rgb), calc(var(--roof-recovery-plant-edge, 0) * 0.5)));
}

#crosshair.is-roof-landing-recovery.is-roof-plant-confidence-lock {
  filter:
    drop-shadow(0 0 calc(9px + var(--roof-landing-recovery, 0) * 10px) rgba(185, 246, 255, 0.72))
    drop-shadow(0 0 calc(20px + var(--roof-landing-recovery, 0) * 16px) rgba(141, 255, 177, 0.28))
    drop-shadow(0 0 8px rgba(224, 255, 247, 0.34))
    drop-shadow(0 0 calc(6px + var(--roof-recovery-reacquire-reticle, 0) * 9px) rgba(255, 190, 92, calc(var(--roof-recovery-reacquire-reticle, 0) * 0.46)))
    drop-shadow(var(--roof-recovery-plant-reticle-side-shimmer-x, 0px) 0 calc(3px + var(--roof-recovery-plant-reticle-side-shimmer, 0) * var(--roof-recovery-plant-reticle-side-shimmer-spread, 10px)) rgba(var(--roof-recovery-plant-edge-rgb), calc(var(--roof-recovery-plant-reticle-side-shimmer, 0) * 0.42)))
    drop-shadow(var(--roof-recovery-plant-mote-reticle-echo-x, 0px) 0 calc(4px + var(--roof-recovery-plant-mote-reticle-echo, 0) * 11px) rgba(var(--roof-recovery-plant-grit-hud-rgb), calc(var(--roof-recovery-plant-mote-reticle-echo, 0) * 0.32)))
    drop-shadow(0 0 calc(10px + var(--roof-recovery-plant-edge-afterglow, 0) * (12px + var(--roof-recovery-plant-afterglow-shape, 0.5) * 12px)) rgba(var(--roof-recovery-plant-edge-rgb), calc(var(--roof-recovery-plant-edge-afterglow, 0) * (0.22 + var(--roof-recovery-plant-afterglow-shape, 0.5) * 0.16))))
    drop-shadow(0 0 calc(5px + var(--roof-recovery-plant-edge, 0) * var(--roof-recovery-plant-edge-glow-scale, 1) * 12px) rgba(var(--roof-recovery-plant-edge-rgb), calc(var(--roof-recovery-plant-edge, 0) * 0.5)));
}

#crosshair.is-roof-landing-recovery[data-roof-plant-surface="roof"] {
  --roof-recovery-plant-afterglow-shape: 0.88;
  --roof-recovery-plant-afterglow-streak: 0.34;
  --roof-recovery-plant-reticle-side-shimmer-spread: 7px;
}

#crosshair.is-roof-landing-recovery[data-roof-plant-surface="runway"] {
  --roof-recovery-plant-afterglow-shape: 0.72;
  --roof-recovery-plant-afterglow-streak: 0.94;
  --roof-recovery-plant-reticle-side-shimmer-spread: 14px;
}

#crosshair.is-roof-landing-recovery[data-roof-plant-surface="road"] {
  --roof-recovery-plant-afterglow-shape: 0.52;
  --roof-recovery-plant-afterglow-streak: 0.72;
  --roof-recovery-plant-reticle-side-shimmer-spread: 11px;
}

#crosshair.is-roof-landing-recovery[data-roof-plant-surface="dirt"] {
  --roof-recovery-plant-afterglow-shape: 0.24;
  --roof-recovery-plant-afterglow-streak: 0.48;
  --roof-recovery-plant-reticle-side-shimmer-spread: 16px;
}

#crosshair.is-empty-ammo-steady {
  filter:
    drop-shadow(0 0 7px rgba(255, 140, 56, 0.46))
    drop-shadow(0 0 15px rgba(237, 91, 71, 0.2));
}

#crosshair.is-ammo-route-resolved {
  filter:
    drop-shadow(0 0 10px rgba(255, 241, 166, 0.68))
    drop-shadow(0 0 20px rgba(141, 255, 177, 0.3));
}

#crosshair.is-ammo-path-clear {
  filter: drop-shadow(0 0 10px rgba(185, 246, 255, 0.58));
  animation: ammo-path-clear-reticle 360ms cubic-bezier(0.2, 1.08, 0.26, 1);
}

#crosshair.is-ammo-clear-lock {
  filter:
    drop-shadow(0 0 var(--ammo-clear-lock-glow-size, 18px) rgba(185, 246, 255, 0.64))
    drop-shadow(0 0 calc(var(--ammo-clear-lock-glow-size, 18px) * 1.55) rgba(141, 255, 177, 0.28));
}

#crosshair.is-ammo-pressure {
  filter:
    drop-shadow(0 0 10px rgba(255, 140, 56, 0.72))
    drop-shadow(0 0 22px rgba(237, 91, 71, 0.34));
}

#crosshair.is-ammo-cover-peek {
  filter: var(
    --ammo-cover-peek-filter,
    drop-shadow(0 0 9px rgba(185, 246, 255, 0.68)) drop-shadow(0 0 19px rgba(255, 179, 108, 0.26))
  );
}

#crosshair.is-low-fps-safe-lane {
  filter:
    drop-shadow(0 0 calc(8px + var(--ammo-safe-lane-reticle, 0) * 8px) rgba(141, 255, 177, 0.58))
    drop-shadow(0 0 calc(18px + var(--ammo-safe-lane-reticle-beat, 0) * 12px) rgba(185, 246, 255, 0.24))
    drop-shadow(0 0 calc(6px + var(--ammo-safe-lane-reticle-surface-tick, 0) * 8px) rgba(var(--ammo-safe-lane-reticle-surface-rgb), 0.28))
    drop-shadow(0 0 calc(5px + var(--ammo-safe-lane-reticle-tail, 0) * 7px) rgba(var(--ammo-safe-lane-reticle-tail-rgb), 0.24));
}

#crosshair.is-ammo-chase-footfall {
  filter:
    drop-shadow(var(--ammo-chase-footfall-reticle-x, 0px) 0 calc(7px + var(--ammo-chase-footfall-reticle, 0) * 10px) rgba(var(--ammo-chase-footfall-reticle-rgb), var(--ammo-chase-footfall-reticle-alpha, 0)))
    drop-shadow(calc(var(--ammo-chase-footfall-reticle-x, 0px) * -0.45) 0 calc(12px + var(--ammo-chase-footfall-reticle, 0) * 13px) rgba(var(--ammo-chase-footfall-reticle-rgb), calc(var(--ammo-chase-footfall-reticle-alpha, 0) * 0.48)));
}

#crosshair.is-ammo-chase-footfall::before,
#crosshair.is-ammo-chase-footfall::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    var(--ammo-chase-footfall-reticle-x, 0px) 0 calc(8px + var(--ammo-chase-footfall-reticle, 0) * 12px) rgba(var(--ammo-chase-footfall-reticle-rgb), calc(var(--ammo-chase-footfall-reticle-alpha, 0) * 0.72));
}

#crosshair.is-ammo-chase-footfall[data-chase-footfall-surface="roof"] {
  --ammo-chase-footfall-reticle-rgb: 224, 208, 180;
}

#crosshair.is-ammo-chase-footfall[data-chase-footfall-surface="runway"] {
  --ammo-chase-footfall-reticle-rgb: 164, 211, 224;
}

#crosshair.is-ammo-chase-footfall[data-chase-footfall-surface="road"] {
  --ammo-chase-footfall-reticle-rgb: 176, 197, 190;
}

#crosshair.is-ammo-chase-footfall[data-chase-footfall-surface="dirt"] {
  --ammo-chase-footfall-reticle-rgb: 255, 179, 108;
}

#crosshair.is-ammo-chase-footfall-clear {
  filter:
    drop-shadow(0 0 calc((6px + var(--ammo-chase-footfall-clear, 0) * 10px) * var(--ammo-chase-footfall-clear-spread, 1)) rgba(var(--ammo-chase-footfall-reticle-rgb), calc(var(--ammo-chase-footfall-clear, 0) * 0.38)))
    drop-shadow(0 0 calc((15px + var(--ammo-chase-footfall-clear, 0) * 14px) * var(--ammo-chase-footfall-clear-spread, 1)) rgba(242, 203, 87, calc(var(--ammo-chase-footfall-clear, 0) * 0.18 * var(--ammo-chase-footfall-clear-warmth, 1))));
}

#crosshair.is-ammo-chase-footfall-clear::before,
#crosshair.is-ammo-chase-footfall-clear::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc((7px + var(--ammo-chase-footfall-clear, 0) * 11px) * var(--ammo-chase-footfall-clear-spread, 1)) rgba(var(--ammo-chase-footfall-reticle-rgb), calc(var(--ammo-chase-footfall-clear, 0) * 0.34)),
    0 0 calc((18px + var(--ammo-chase-footfall-clear, 0) * 18px) * var(--ammo-chase-footfall-clear-spread, 1)) rgba(242, 203, 87, calc(var(--ammo-chase-footfall-clear, 0) * 0.2 * var(--ammo-chase-footfall-clear-warmth, 1)));
}

#crosshair.is-low-fps-safe-lane[data-low-fps-surface="road"] {
  --ammo-safe-lane-reticle-surface-rgb: 89, 100, 98;
}

#crosshair.is-low-fps-safe-lane[data-low-fps-surface="roof"] {
  --ammo-safe-lane-reticle-surface-rgb: 138, 133, 122;
}

#crosshair.is-low-fps-safe-lane[data-low-fps-surface="runway"] {
  --ammo-safe-lane-reticle-surface-rgb: 102, 113, 121;
}

#crosshair.is-low-fps-safe-lane[data-low-fps-surface="dirt"] {
  --ammo-safe-lane-reticle-surface-rgb: 180, 154, 104;
}

#crosshair.is-low-fps-safe-lane[data-low-fps-tail="skid"] {
  --ammo-safe-lane-reticle-tail-rgb: 132, 150, 147;
}

#crosshair.is-low-fps-safe-lane[data-low-fps-tail="tin"] {
  --ammo-safe-lane-reticle-tail-rgb: 174, 185, 182;
}

#crosshair.is-low-fps-safe-lane[data-low-fps-tail="slab"] {
  --ammo-safe-lane-reticle-tail-rgb: 148, 170, 184;
}

#crosshair.is-low-fps-safe-lane[data-low-fps-tail="grit"] {
  --ammo-safe-lane-reticle-tail-rgb: 205, 164, 105;
}

#crosshair.is-tactical-scarcity {
  filter:
    drop-shadow(0 0 9px rgba(255, 179, 108, 0.7))
    drop-shadow(0 0 20px rgba(237, 91, 71, 0.3));
}

#crosshair.is-counterfire-ready {
  filter:
    drop-shadow(0 0 12px rgba(255, 241, 166, 0.72))
    drop-shadow(0 0 24px rgba(255, 166, 72, 0.34));
}

#crosshair.is-threat-tagged {
  filter:
    drop-shadow(0 0 10px rgba(255, 179, 108, 0.7))
    drop-shadow(0 0 22px rgba(255, 140, 56, 0.34));
}

#crosshair.is-boss-finisher {
  filter:
    drop-shadow(0 0 16px rgba(141, 255, 177, 0.84))
    drop-shadow(0 0 34px rgba(255, 241, 166, 0.42));
}

#crosshair.is-boss-execute {
  filter:
    drop-shadow(0 0 14px rgba(255, 241, 166, 0.86))
    drop-shadow(0 0 30px rgba(255, 140, 56, 0.42));
}

#crosshair.is-boss-damage-warning {
  filter:
    drop-shadow(0 0 14px rgba(255, 179, 108, 0.82))
    drop-shadow(0 0 32px rgba(237, 91, 71, 0.44));
  animation: boss-damage-warning-crosshair 360ms cubic-bezier(0.2, 1.16, 0.22, 1);
}

#crosshair.is-boss-damage-warning.is-boss-damage-critical {
  filter:
    drop-shadow(0 0 18px rgba(255, 211, 107, 0.92))
    drop-shadow(0 0 42px rgba(237, 91, 71, 0.58));
  animation-duration: 280ms;
}

#crosshair.is-boss-damage-warning.is-boss-damage-tank {
  filter:
    drop-shadow(0 0 18px rgba(255, 211, 107, 0.92))
    drop-shadow(0 0 40px rgba(255, 140, 56, 0.54));
  animation-duration: 420ms;
}

#crosshair.is-boss-damage-warning.is-boss-damage-screamer {
  filter:
    drop-shadow(0 0 16px rgba(217, 165, 255, 0.9))
    drop-shadow(0 0 36px rgba(96, 210, 255, 0.46));
  animation-duration: 320ms;
}

#crosshair.is-boss-damage-warning.is-boss-damage-mutant {
  filter:
    drop-shadow(0 0 16px rgba(141, 255, 177, 0.88))
    drop-shadow(0 0 34px rgba(255, 241, 166, 0.38));
  animation-duration: 300ms;
}

#crosshair.is-boss-damage-warning.is-boss-damage-exploder {
  filter:
    drop-shadow(0 0 18px rgba(255, 140, 56, 0.94))
    drop-shadow(0 0 44px rgba(237, 91, 71, 0.62));
  animation-duration: 240ms;
}

#crosshair.is-boss-air-slice {
  filter:
    drop-shadow(0 0 15px rgba(var(--boss-air-slice-rgb, 217, 165, 255), 0.84))
    drop-shadow(0 0 34px rgba(var(--boss-air-slice-hot-rgb, 96, 210, 255), 0.42));
}

#crosshair.is-boss-air-slice-dodge-read {
  filter:
    drop-shadow(0 0 17px rgba(var(--boss-air-slice-hot-rgb, 96, 210, 255), 0.78))
    drop-shadow(0 0 36px rgba(var(--boss-air-slice-rgb, 217, 165, 255), 0.4));
}

#crosshair.is-breach-push {
  filter:
    drop-shadow(0 0 14px rgba(141, 255, 177, 0.82))
    drop-shadow(0 0 28px rgba(185, 246, 255, 0.34));
}

#crosshair.is-route-lock-next {
  filter:
    drop-shadow(0 0 13px rgba(185, 246, 255, 0.78))
    drop-shadow(0 0 27px rgba(255, 241, 166, 0.32));
  animation: route-lock-next-crosshair 360ms ease-out;
}

#crosshair.is-route-lock-snap {
  filter:
    drop-shadow(0 0 15px rgba(185, 246, 255, 0.86))
    drop-shadow(0 0 32px rgba(255, 241, 166, 0.4));
  animation: route-lock-snap-crosshair 280ms cubic-bezier(0.2, 1.2, 0.24, 1);
}

#crosshair.is-route-lock-stop {
  filter:
    drop-shadow(0 0 17px rgba(255, 211, 107, 0.9))
    drop-shadow(0 0 38px rgba(255, 140, 56, 0.46));
  animation: route-lock-stop-crosshair 420ms cubic-bezier(0.18, 1.26, 0.22, 1);
}

@keyframes ammo-path-clear-reticle {
  0% {
    transform: translate(-50%, -50%) scale(calc(var(--kick-scale, 1) * 0.88));
  }
  42% {
    transform: translate(-50%, -50%) scale(calc(var(--kick-scale, 1) * 1.25));
  }
  100% {
    transform: translate(-50%, -50%) scale(var(--kick-scale, 1));
  }
}

@keyframes route-lock-next-crosshair {
  0% {
    transform: translate(-50%, -50%) scale(calc(var(--kick-scale, 1) + 0.18));
  }

  100% {
    transform: translate(-50%, -50%) scale(var(--kick-scale, 1));
  }
}

@keyframes route-lock-snap-crosshair {
  0% {
    transform: translate(-50%, -50%) scale(calc(var(--kick-scale, 1) + 0.26));
  }

  54% {
    transform: translate(-50%, -50%) scale(calc(var(--kick-scale, 1) - 0.06));
  }

  100% {
    transform: translate(-50%, -50%) scale(var(--kick-scale, 1));
  }
}

@keyframes route-lock-stop-crosshair {
  0% {
    transform: translate(-50%, -50%) scale(calc(var(--kick-scale, 1) + 0.34));
  }

  38% {
    transform: translate(-50%, -50%) scale(calc(var(--kick-scale, 1) - 0.08));
  }

  68% {
    transform: translate(-50%, -50%) scale(calc(var(--kick-scale, 1) + 0.1));
  }

  100% {
    transform: translate(-50%, -50%) scale(var(--kick-scale, 1));
  }
}

@keyframes boss-damage-warning-crosshair {
  0% {
    transform: translate(-50%, -50%) scale(calc(var(--kick-scale, 1) + 0.24)) rotate(0deg);
  }

  34% {
    transform: translate(-50%, -50%) scale(calc(var(--kick-scale, 1) - 0.05)) rotate(-2deg);
  }

  68% {
    transform: translate(-50%, -50%) scale(calc(var(--kick-scale, 1) + 0.09)) rotate(1.4deg);
  }

  100% {
    transform: translate(-50%, -50%) scale(var(--kick-scale, 1)) rotate(0deg);
  }
}

.breach-push-cue {
  position: absolute;
  left: calc(50% + var(--breach-push-x, 86px));
  top: calc(50% - 42px);
  z-index: 5;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-width: 94px;
  max-width: min(160px, calc(50vw - 18px));
  min-height: 38px;
  align-items: center;
  gap: 2px;
  padding: 6px 9px 8px;
  border: 1px solid rgba(141, 255, 177, 0.66);
  border-radius: 8px;
  background: rgba(4, 12, 10, 0.66);
  box-shadow:
    0 0 18px rgba(141, 255, 177, 0.24),
    inset 0 0 18px rgba(185, 246, 255, 0.08);
  color: #8dffb1;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(var(--breach-push-scale, 1));
  opacity: var(--breach-push-opacity, 0.92);
}

.breach-push-cue b,
.breach-push-cue span {
  position: relative;
  z-index: 1;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  text-shadow: 0 0 10px rgba(141, 255, 177, 0.52);
  text-transform: uppercase;
  white-space: nowrap;
}

.breach-push-cue b {
  font-size: 14px;
  font-weight: 950;
}

.breach-push-cue span {
  color: #f4f7f8;
  font-size: 10px;
  font-weight: 900;
}

.breach-push-cue i {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 4px;
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(244, 247, 248, 0.12);
}

.breach-push-cue i::after {
  display: block;
  width: var(--breach-push-meter, 0%);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #8dffb1, #b9f6ff, #fff1a6);
  box-shadow: 0 0 10px rgba(141, 255, 177, 0.72);
  content: "";
  transition: width 80ms linear;
}

.breach-push-cue.is-hot {
  border-color: rgba(255, 241, 166, 0.78);
  color: #fff1a6;
  animation: breach-push-hot 420ms ease-in-out infinite alternate;
}

@keyframes breach-push-hot {
  from {
    box-shadow:
      0 0 16px rgba(141, 255, 177, 0.2),
      inset 0 0 18px rgba(185, 246, 255, 0.08);
  }

  to {
    box-shadow:
      0 0 24px rgba(255, 241, 166, 0.34),
      inset 0 0 20px rgba(141, 255, 177, 0.14);
  }
}

.boss-execute-cue {
  position: absolute;
  left: 50%;
  top: calc(50% + 34px);
  z-index: 5;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  width: min(230px, calc(100vw - 28px));
  min-height: 34px;
  align-items: center;
  gap: 8px;
  padding: 6px 10px 8px;
  border: 1px solid rgba(255, 241, 166, 0.56);
  border-radius: 8px;
  background: rgba(6, 9, 12, 0.68);
  box-shadow:
    0 0 18px rgba(255, 241, 166, 0.2),
    inset 0 0 18px rgba(255, 140, 56, 0.08);
  color: #fff1a6;
  pointer-events: none;
  transform: translateX(-50%) scale(var(--boss-execute-scale, 1));
  opacity: var(--boss-execute-opacity, 0.96);
}

.boss-execute-cue.hidden {
  display: none;
}

.boss-execute-cue b,
.boss-execute-cue span {
  position: relative;
  z-index: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-shadow: 0 0 10px rgba(255, 241, 166, 0.5);
}

.boss-execute-cue b {
  font-size: 12px;
  font-weight: 950;
  letter-spacing: 0;
}

.boss-execute-cue span {
  justify-self: end;
  color: #f4f7f8;
  font-size: 11px;
  font-weight: 950;
}

.boss-execute-cue i {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 4px;
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(244, 247, 248, 0.12);
}

.boss-execute-cue i::after {
  display: block;
  width: var(--boss-execute-meter, 0%);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #8dffb1, #fff1a6, #ff8c38);
  box-shadow: 0 0 10px rgba(255, 241, 166, 0.72);
  content: "";
  transition: width 90ms linear;
}

.boss-execute-cue.is-critical {
  border-color: rgba(255, 140, 56, 0.82);
  color: #ffb36c;
  animation: boss-execute-critical 460ms ease-in-out infinite alternate;
}

.boss-execute-cue[data-boss="screamer"] {
  border-color: rgba(185, 246, 255, 0.62);
  color: #b9f6ff;
}

.boss-execute-cue[data-boss="mutant"] {
  border-color: rgba(141, 255, 177, 0.62);
  color: #8dffb1;
}

.boss-execute-cue[data-boss="exploder"] {
  border-color: rgba(255, 141, 118, 0.68);
  color: #ffb36c;
}

@keyframes boss-execute-critical {
  from {
    box-shadow:
      0 0 18px rgba(255, 179, 108, 0.26),
      inset 0 0 18px rgba(255, 140, 56, 0.1);
  }

  to {
    box-shadow:
      0 0 28px rgba(255, 140, 56, 0.46),
      inset 0 0 24px rgba(237, 91, 71, 0.16);
  }
}

.boss-compass-cue {
  position: absolute;
  left: 50%;
  top: calc(50% - 54px);
  z-index: 4;
  display: inline-flex;
  min-width: 112px;
  height: 24px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 10px;
  border: 1px solid rgba(255, 179, 108, 0.36);
  border-radius: 999px;
  background: rgba(20, 13, 10, 0.66);
  color: #ffb36c;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  pointer-events: none;
  text-shadow: 0 0 10px rgba(255, 179, 108, 0.42);
  transform: translateX(-50%);
  white-space: nowrap;
  box-shadow: 0 0 18px rgba(0, 0, 0, 0.24), inset 0 0 0 1px rgba(255, 241, 166, 0.08);
}

.boss-compass-cue i {
  width: 0;
  height: 0;
  border-right: 5px solid transparent;
  border-bottom: 9px solid currentColor;
  border-left: 5px solid transparent;
  filter: drop-shadow(0 0 8px currentColor);
  transform: rotate(var(--boss-compass-rot, 0deg));
  transform-origin: 50% 62%;
}

.boss-compass-cue[data-direction="ahead"] {
  border-color: rgba(255, 241, 166, 0.52);
  color: #fff1a6;
}

.boss-compass-cue[data-direction="behind"] {
  border-color: rgba(237, 91, 71, 0.58);
  color: #ff8d76;
}

.boss-compass-cue[data-direction="left"],
.boss-compass-cue[data-direction="right"] {
  border-color: rgba(110, 231, 183, 0.52);
  color: #8dffb1;
}

.boss-compass-cue[data-boss="tank"] {
  background: rgba(35, 26, 10, 0.7);
  color: #fff1a6;
  text-shadow: 0 0 12px rgba(255, 241, 166, 0.5);
}

.boss-compass-cue[data-boss="screamer"] {
  background: rgba(9, 25, 31, 0.68);
  color: #b9f6ff;
  text-shadow: 0 0 12px rgba(185, 246, 255, 0.5);
}

.boss-compass-cue[data-boss="mutant"] {
  background: rgba(9, 30, 20, 0.68);
  color: #8dffb1;
  text-shadow: 0 0 12px rgba(141, 255, 177, 0.5);
}

.boss-compass-cue[data-boss="exploder"] {
  background: rgba(43, 19, 10, 0.72);
  color: #ff8d76;
  text-shadow: 0 0 12px rgba(237, 91, 71, 0.5);
}

.boss-compass-cue.is-critical {
  animation: boss-compass-threat-pulse 1.18s ease-in-out infinite;
  box-shadow: 0 0 20px rgba(237, 91, 71, 0.24), 0 0 34px rgba(255, 179, 108, 0.16), inset 0 0 0 1px rgba(255, 241, 166, 0.12);
}

.boss-compass-cue.is-weak-window {
  border-color: rgba(141, 255, 177, 0.78);
  color: #8dffb1;
  box-shadow: 0 0 20px rgba(141, 255, 177, 0.22), 0 0 36px rgba(255, 241, 166, 0.16), inset 0 0 0 1px rgba(141, 255, 177, 0.12);
  text-shadow: 0 0 14px rgba(141, 255, 177, 0.62);
}

.boss-break-flash {
  --boss-break-pulse: 0;
  --boss-break-scale: 0.96;
  --boss-break-opacity: 0.36;
  --boss-break-line: 34px;
  --boss-break-glow: 18px;
  --boss-break-glow-wide: 28px;
  position: absolute;
  left: 50%;
  top: calc(50% - 128px);
  z-index: 7;
  display: grid;
  min-width: 240px;
  gap: 5px;
  justify-items: center;
  padding: 9px 16px 10px;
  border: 1px solid rgba(141, 255, 177, 0.72);
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 120%, rgba(141, 255, 177, 0.16), transparent 72%),
    rgba(7, 17, 14, 0.78);
  color: #8dffb1;
  text-align: center;
  pointer-events: none;
  transform: translateX(-50%) scale(var(--boss-break-scale));
  opacity: var(--boss-break-opacity);
  box-shadow:
    0 0 var(--boss-break-glow) rgba(141, 255, 177, 0.32),
    0 0 var(--boss-break-glow-wide) rgba(255, 241, 166, 0.16),
    inset 0 0 0 1px rgba(255, 241, 166, 0.14);
  backdrop-filter: blur(8px);
}

.boss-break-flash::before,
.boss-break-flash::after {
  content: "";
  position: absolute;
  top: 50%;
  width: var(--boss-break-line);
  height: 1px;
  background: currentColor;
  box-shadow: 0 0 13px currentColor;
  opacity: var(--boss-break-opacity);
}

.boss-break-flash::before {
  right: calc(100% + 10px);
}

.boss-break-flash::after {
  left: calc(100% + 10px);
}

.boss-break-flash b,
.boss-break-flash span {
  display: block;
  line-height: 1;
  text-shadow: 0 0 12px currentColor;
  white-space: nowrap;
}

.boss-break-flash b {
  color: currentColor;
  font-size: 18px;
  font-weight: 950;
}

.boss-break-flash span {
  color: #fff1a6;
  font-size: 10px;
  font-weight: 900;
}

.boss-break-flash[data-boss="tank"] {
  border-color: rgba(255, 241, 166, 0.78);
  background:
    radial-gradient(circle at 50% 120%, rgba(255, 179, 108, 0.17), transparent 72%),
    rgba(35, 25, 10, 0.78);
  color: #fff1a6;
}

.boss-break-flash[data-boss="screamer"] {
  border-color: rgba(185, 246, 255, 0.78);
  color: #b9f6ff;
}

.boss-break-flash[data-boss="mutant"] {
  border-color: rgba(141, 255, 177, 0.78);
  color: #8dffb1;
}

.boss-break-flash[data-boss="exploder"] {
  border-color: rgba(255, 141, 118, 0.78);
  background:
    radial-gradient(circle at 50% 120%, rgba(237, 91, 71, 0.18), transparent 72%),
    rgba(42, 17, 13, 0.78);
  color: #ff8d76;
}

.boss-finisher-flash {
  --boss-finisher-pulse: 0;
  --boss-finisher-scale: 0.92;
  --boss-finisher-opacity: 0.3;
  --boss-finisher-line: 26px;
  --boss-finisher-glow: 18px;
  --boss-finisher-glow-wide: 32px;
  position: absolute;
  left: 50%;
  top: calc(50% + 64px);
  z-index: 7;
  display: grid;
  min-width: 188px;
  gap: 4px;
  justify-items: center;
  padding: 7px 14px 8px;
  border: 1px solid rgba(141, 255, 177, 0.74);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(141, 255, 177, 0.08), rgba(255, 241, 166, 0.16), rgba(141, 255, 177, 0.08)),
    rgba(5, 19, 14, 0.76);
  color: #8dffb1;
  text-align: center;
  pointer-events: none;
  transform: translateX(-50%) scale(var(--boss-finisher-scale));
  opacity: var(--boss-finisher-opacity);
  box-shadow:
    0 0 var(--boss-finisher-glow) rgba(141, 255, 177, 0.32),
    0 0 var(--boss-finisher-glow-wide) rgba(255, 241, 166, 0.18),
    inset 0 0 0 1px rgba(255, 241, 166, 0.14);
  backdrop-filter: blur(8px);
}

.boss-finisher-flash::before,
.boss-finisher-flash::after {
  content: "";
  position: absolute;
  top: 50%;
  width: var(--boss-finisher-line);
  height: 1px;
  background: currentColor;
  box-shadow: 0 0 13px currentColor;
  opacity: var(--boss-finisher-opacity);
}

.boss-finisher-flash::before {
  right: calc(100% + 8px);
}

.boss-finisher-flash::after {
  left: calc(100% + 8px);
}

.boss-finisher-flash b,
.boss-finisher-flash span {
  display: block;
  line-height: 1;
  text-shadow: 0 0 12px currentColor;
  white-space: nowrap;
}

.boss-finisher-flash b {
  color: currentColor;
  font-size: 15px;
  font-weight: 950;
}

.boss-finisher-flash span {
  color: #fff1a6;
  font-size: 9px;
  font-weight: 900;
}

.boss-finisher-flash[data-boss="tank"] {
  border-color: rgba(255, 241, 166, 0.78);
  background:
    linear-gradient(90deg, rgba(255, 140, 56, 0.08), rgba(255, 241, 166, 0.18), rgba(255, 140, 56, 0.08)),
    rgba(35, 24, 10, 0.78);
  color: #fff1a6;
}

.boss-finisher-flash[data-boss="screamer"] {
  border-color: rgba(185, 246, 255, 0.78);
  background:
    linear-gradient(90deg, rgba(185, 246, 255, 0.08), rgba(255, 241, 166, 0.13), rgba(185, 246, 255, 0.08)),
    rgba(8, 25, 31, 0.78);
  color: #b9f6ff;
}

.boss-finisher-flash[data-boss="mutant"] {
  border-color: rgba(141, 255, 177, 0.78);
  color: #8dffb1;
}

.boss-finisher-flash[data-boss="exploder"] {
  border-color: rgba(255, 141, 118, 0.78);
  background:
    linear-gradient(90deg, rgba(237, 91, 71, 0.1), rgba(255, 241, 166, 0.17), rgba(237, 91, 71, 0.1)),
    rgba(42, 17, 13, 0.78);
  color: #ff8d76;
}

@keyframes boss-compass-threat-pulse {
  0%, 100% {
    transform: translateX(-50%) scale(1);
  }
  45% {
    transform: translateX(-50%) scale(1.06);
  }
}

.tactical-ready-cue {
  position: absolute;
  left: 50%;
  top: calc(50% + 33px);
  z-index: 4;
  display: inline-flex;
  gap: 6px;
  min-width: 94px;
  height: 22px;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  border: 1px solid rgba(185, 246, 255, 0.28);
  border-radius: 999px;
  background: rgba(10, 16, 19, 0.58);
  color: rgba(244, 247, 248, 0.88);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0;
  text-shadow: 0 0 10px rgba(185, 246, 255, 0.35);
  transform: translateX(-50%) scale(var(--tactical-ready-scale, 1));
  pointer-events: none;
  white-space: nowrap;
  box-shadow: 0 0 18px rgba(0, 0, 0, 0.24), inset 0 0 0 1px rgba(244, 247, 248, 0.06);
}

.tactical-ready-cue span {
  display: inline-flex;
  min-width: 66px;
  height: 16px;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 0 4px;
  border: 1px solid rgba(244, 247, 248, 0.08);
  border-radius: 999px;
  color: var(--slot-color, rgba(244, 247, 248, 0.86));
  transition: transform 90ms ease-out, background 90ms ease-out, border-color 90ms ease-out, color 90ms ease-out, box-shadow 90ms ease-out;
  will-change: transform;
}

.tactical-ready-cue span::before {
  content: "";
  width: 6px;
  height: 6px;
  flex: 0 0 auto;
  background: var(--slot-color, rgba(244, 247, 248, 0.86));
  box-shadow: 0 0 8px var(--slot-glow, rgba(185, 246, 255, 0.28));
}

.tactical-ready-cue span[data-slot="grenade"] {
  --slot-color: #8dffb1;
  --slot-glow: rgba(141, 255, 177, 0.46);
}

.tactical-ready-cue span[data-slot="grenade"]::before {
  border-radius: 50%;
  box-shadow: inset -2px -1px 0 rgba(10, 16, 19, 0.36), 0 0 8px var(--slot-glow);
}

.tactical-ready-cue span[data-slot="flashbang"] {
  --slot-color: #b9f6ff;
  --slot-glow: rgba(185, 246, 255, 0.48);
}

.tactical-ready-cue span[data-slot="flashbang"]::before {
  transform: rotate(45deg);
  border-radius: 1px;
}

.tactical-ready-cue span[data-slot="mine"] {
  --slot-color: #ffb36c;
  --slot-glow: rgba(255, 179, 108, 0.48);
}

.tactical-ready-cue span[data-slot="mine"]::before {
  height: 5px;
  border: 1px solid var(--slot-color);
  border-radius: 999px;
  background: rgba(10, 16, 19, 0.5);
  box-sizing: border-box;
}

.tactical-ready-cue span.is-active {
  transform: scale(1.12);
  background: rgba(244, 247, 248, 0.12);
  border-color: color-mix(in srgb, var(--slot-color, #b9f6ff) 54%, transparent);
  box-shadow: 0 0 12px rgba(185, 246, 255, 0.24);
  animation: tactical-slot-pop 180ms cubic-bezier(0.17, 0.8, 0.36, 1.22) both;
}

.tactical-ready-cue span[data-slot="grenade"].is-active {
  background: rgba(141, 255, 177, 0.14);
  box-shadow: 0 0 14px rgba(141, 255, 177, 0.24);
}

.tactical-ready-cue span[data-slot="flashbang"].is-active {
  background: rgba(185, 246, 255, 0.13);
  box-shadow: 0 0 14px rgba(185, 246, 255, 0.24);
}

.tactical-ready-cue span[data-slot="mine"].is-active {
  background: rgba(255, 179, 108, 0.14);
  box-shadow: 0 0 14px rgba(255, 179, 108, 0.24);
}

.tactical-ready-cue.is-gain span.is-active::before {
  animation: tactical-slot-gain-spark 280ms ease-out both;
}

.tactical-ready-cue.is-spend span.is-active::before {
  animation: tactical-slot-spend-snap 220ms ease-out both;
}

.tactical-ready-cue.is-route span.is-active::before {
  animation: tactical-slot-route-secure 320ms ease-out both;
}

@keyframes tactical-slot-pop {
  0% {
    transform: scale(0.86) translateY(2px);
  }

  62% {
    transform: scale(1.2) translateY(-1px);
  }

  100% {
    transform: scale(1.12) translateY(0);
  }
}

@keyframes tactical-slot-gain-spark {
  0% {
    filter: brightness(1);
    box-shadow: 0 0 6px var(--slot-glow, rgba(185, 246, 255, 0.3));
  }

  45% {
    filter: brightness(1.8);
    box-shadow: 0 0 14px var(--slot-glow, rgba(185, 246, 255, 0.5));
  }

  100% {
    filter: brightness(1.05);
  }
}

@keyframes tactical-slot-spend-snap {
  0% {
    opacity: 0.58;
    filter: brightness(1.55) saturate(1.25);
  }

  52% {
    opacity: 1;
    filter: brightness(0.82) saturate(1.12);
  }

  100% {
    opacity: 1;
    filter: brightness(1);
  }
}

@keyframes tactical-slot-route-secure {
  0% {
    filter: brightness(1);
    box-shadow: 0 0 8px var(--slot-glow, rgba(255, 241, 166, 0.28));
  }

  46% {
    filter: brightness(1.95) saturate(1.25);
    box-shadow: 0 0 18px var(--slot-glow, rgba(255, 241, 166, 0.58));
  }

  100% {
    filter: brightness(1.08);
  }
}

.tactical-ready-cue.is-gain {
  border-color: rgba(141, 255, 177, 0.62);
  color: #8dffb1;
  box-shadow: 0 0 22px rgba(141, 255, 177, 0.22), inset 0 0 0 1px rgba(185, 246, 255, 0.12);
}

.tactical-ready-cue.is-spend {
  border-color: rgba(255, 179, 108, 0.66);
  color: #ffb36c;
  box-shadow: 0 0 22px rgba(255, 179, 108, 0.2), inset 0 0 0 1px rgba(255, 213, 109, 0.12);
}

.tactical-ready-cue.is-route {
  border-color: rgba(255, 241, 166, 0.7);
  color: #fff1a6;
  box-shadow: 0 0 24px rgba(255, 241, 166, 0.24), inset 0 0 0 1px rgba(141, 255, 177, 0.14);
}

.tactical-ready-cue.is-scarcity {
  border-color: rgba(255, 140, 56, 0.7);
  background: rgba(44, 24, 22, 0.7);
  color: #ffb36c;
  box-shadow: 0 0 20px rgba(255, 140, 56, 0.22), inset 0 0 0 1px rgba(255, 213, 109, 0.1);
}

.tactical-ready-cue.is-empty {
  border-color: rgba(237, 91, 71, 0.72);
  color: #ff8f76;
  box-shadow: 0 0 22px rgba(237, 91, 71, 0.24), inset 0 0 0 1px rgba(255, 179, 108, 0.12);
}

.tactical-ready-cue span.is-empty-slot {
  opacity: 0.48;
  color: rgba(255, 143, 118, 0.82);
  border-color: rgba(237, 91, 71, 0.26);
  background: rgba(237, 91, 71, 0.08);
}

.tactical-ready-cue span.is-empty-slot::before {
  filter: grayscale(0.25) brightness(0.82);
  box-shadow: 0 0 8px rgba(237, 91, 71, 0.24);
}

#crosshair::before,
#crosshair::after {
  content: "";
  position: absolute;
  background: var(--crosshair-color, rgba(244, 247, 248, 0.82));
  box-shadow: var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42));
  transition:
    transform 90ms ease-out,
    opacity 90ms ease-out;
}

#crosshair::before {
  left: 10px;
  top: 0;
  width: 2px;
  height: 22px;
  transform: translate(calc(var(--ammo-cover-peek-settle-x, 0px) + var(--boss-air-slice-cross-x, 0px) + var(--boss-air-slice-dodge-before-x, 0px) + var(--mutant-near-miss-reticle-before-x, 0px) + var(--wounded-supply-reticle-x, 0px) + var(--extraction-route-lock-arrival-side, 0px) * 0.24), calc(var(--boss-air-slice-dodge-y, 0px) + var(--mutant-near-miss-reticle-y, 0px))) rotate(calc(var(--boss-air-slice-before-rotate, 0deg) + var(--boss-air-slice-dodge-before-rotate, 0deg) + var(--mutant-near-miss-reticle-before-rotate, 0deg))) scaleY(calc(var(--ammo-cover-peek-settle-scale, 1) + var(--boss-air-slice-reticle-stretch, 0) + var(--boss-air-slice-dodge-before-scale, 0) + var(--mutant-near-miss-reticle, 0) * 0.08 + var(--extraction-route-lock-arrival-reticle, 0) * 0.08));
  transform-origin: center;
}

#crosshair::after {
  left: 0;
  top: 10px;
  width: 22px;
  height: 2px;
  transform: translate(calc(var(--boss-air-slice-dodge-after-x, 0px) + var(--mutant-near-miss-reticle-after-x, 0px) + var(--wounded-supply-reticle-x, 0px) * -0.46 + var(--extraction-route-lock-arrival-side, 0px) * -0.18), calc(var(--ammo-cover-peek-settle-y, 0px) + var(--boss-air-slice-cross-y, 0px) + var(--boss-air-slice-dodge-y, 0px) + var(--mutant-near-miss-reticle-y, 0px))) rotate(calc(var(--boss-air-slice-after-rotate, 0deg) + var(--boss-air-slice-dodge-after-rotate, 0deg) + var(--mutant-near-miss-reticle-after-rotate, 0deg))) scaleX(calc(var(--ammo-cover-peek-settle-scale, 1) + var(--boss-air-slice-reticle-stretch, 0) + var(--boss-air-slice-dodge-after-scale, 0) + var(--mutant-near-miss-reticle, 0) * 0.1 + var(--extraction-route-lock-arrival-reticle, 0) * 0.11));
  transform-origin: center;
}

#crosshair.is-mutant-near-miss-reticle::before,
#crosshair.is-mutant-near-miss-reticle::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 var(--mutant-near-miss-reticle-surface-glow-size, 10px) rgba(var(--mutant-near-miss-reticle-rgb, 255, 121, 242), var(--mutant-near-miss-reticle-surface, 0)),
    0 0 var(--mutant-near-miss-reticle-core-glow-size, 13px) rgba(255, 121, 242, var(--mutant-near-miss-reticle-alpha, 0)),
    0 0 var(--mutant-near-miss-reticle-soft-glow-size, 24px) rgba(157, 121, 255, var(--mutant-near-miss-reticle-soft-alpha, 0));
}

#crosshair.is-sprint-skid-strain::before,
#crosshair.is-sprint-skid-strain::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(9px + var(--sprint-skid-strain, 0) * 8px) rgba(255, 211, 106, calc(var(--sprint-skid-strain, 0) * 0.36)),
    0 0 calc(18px + var(--sprint-skid-strain, 0) * 14px) rgba(255, 140, 56, calc(var(--sprint-skid-strain, 0) * 0.2));
}

#crosshair.is-casing-landing-glimmer::before,
#crosshair.is-casing-landing-glimmer::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    var(--casing-landing-reticle-x, 0px) 0 calc(5px + var(--casing-landing-reticle, 0) * 9px) rgba(var(--casing-landing-reticle-rgb, 255, 213, 109), calc(var(--casing-landing-reticle, 0) * 0.42)),
    var(--casing-landing-reticle-x, 0px) 0 calc(12px + var(--casing-landing-reticle, 0) * 16px) rgba(var(--casing-landing-reticle-rgb, 255, 213, 109), calc(var(--casing-landing-reticle, 0) * 0.2)),
    var(--casing-landing-reticle-surface-x, 0px) 0 calc(9px + var(--casing-landing-reticle-surface, 0) * 17px) rgba(var(--casing-landing-reticle-surface-rgb, 202, 165, 106), calc(var(--casing-landing-reticle-surface, 0) * 0.24));
}

#crosshair.is-supply-reward-spark::before,
#crosshair.is-supply-reward-spark::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(9px + var(--supply-reward-reticle, 0) * 14px) rgba(255, 241, 166, calc(var(--supply-reward-reticle, 0) * 0.46)),
    0 0 calc(18px + var(--supply-reward-reticle, 0) * 20px) rgba(141, 255, 177, calc(var(--supply-reward-reticle, 0) * 0.22));
}

#crosshair.is-supply-reward-secured-tick::before,
#crosshair.is-supply-reward-secured-tick::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(5px + var(--supply-reward-secured-tick, 0) * 9px) rgba(217, 255, 230, calc(var(--supply-reward-secured-tick, 0) * 0.34)),
    0 0 calc(12px + var(--supply-reward-secured-tick, 0) * 13px) rgba(255, 241, 166, calc(var(--supply-reward-secured-tick, 0) * 0.18));
}

#crosshair.is-supply-reward-endpoint-glint::before,
#crosshair.is-supply-reward-endpoint-glint::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc((7px + var(--supply-reward-endpoint-glint, 0) * 11px) * var(--supply-reward-endpoint-glint-glow, 1)) rgba(255, 241, 166, calc(var(--supply-reward-endpoint-glint, 0) * 0.38)),
    0 0 calc((16px + var(--supply-reward-endpoint-glint, 0) * 16px) * var(--supply-reward-endpoint-glint-glow, 1)) rgba(141, 255, 177, calc(var(--supply-reward-endpoint-glint, 0) * 0.2));
}

#crosshair.is-roof-landing-recovery::before,
#crosshair.is-roof-landing-recovery::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(10px + var(--roof-landing-recovery, 0) * 8px) rgba(185, 246, 255, calc(var(--roof-landing-recovery, 0) * 0.36)),
    0 0 calc(20px + var(--roof-landing-recovery, 0) * 14px) rgba(141, 255, 177, calc(var(--roof-landing-recovery, 0) * 0.2)),
    0 0 calc(8px + var(--roof-recovery-reacquire-reticle, 0) * 10px) rgba(255, 190, 92, calc(var(--roof-recovery-reacquire-reticle, 0) * 0.28)),
    0 0 calc(4px + var(--roof-recovery-plant-edge-afterglow, 0) * (6px + var(--roof-recovery-plant-afterglow-streak, 0.5) * 12px)) rgba(var(--roof-recovery-plant-edge-rgb), calc(var(--roof-recovery-plant-edge-afterglow, 0) * (0.16 + var(--roof-recovery-plant-afterglow-streak, 0.5) * 0.12))),
    var(--roof-recovery-plant-grit-hud-x, 0px) 0 calc(5px + var(--roof-recovery-plant-grit-hud, 0) * 12px) rgba(var(--roof-recovery-plant-grit-hud-rgb), calc(var(--roof-recovery-plant-grit-hud, 0) * 0.36));
}

#crosshair.is-wounded-ammo-recovery::before,
#crosshair.is-wounded-ammo-recovery::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(8px + var(--wounded-ammo-recovery-aim, 0) * 10px) rgba(141, 255, 177, calc(var(--wounded-ammo-recovery-aim, 0) * 0.42)),
    0 0 calc(16px + var(--wounded-ammo-recovery-aim-settle, 0) * 18px) rgba(185, 246, 255, calc(var(--wounded-ammo-recovery-aim-settle, 0) * 0.24));
}

#crosshair.is-wounded-ammo-ready-settle::before,
#crosshair.is-wounded-ammo-ready-settle::after {
  transform: scale(calc(1 + var(--wounded-ammo-ready-settle-scale, 0)));
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(10px + var(--wounded-ammo-ready-settle-scale, 0) * 42px) rgba(206, 255, 222, calc(var(--wounded-ammo-ready-settle, 0) * 0.38)),
    0 0 calc(18px + var(--wounded-ammo-ready-settle-scale, 0) * 50px) rgba(185, 246, 255, calc(var(--wounded-ammo-ready-settle, 0) * 0.18));
}

#crosshair.is-wounded-ammo-steady-tick::before,
#crosshair.is-wounded-ammo-steady-tick::after {
  transform: scale(var(--wounded-ammo-steady-tick-scale, 1));
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(7px + var(--wounded-ammo-steady-tick, 0) * 18px) rgba(206, 255, 222, calc(var(--wounded-ammo-steady-tick, 0) * 0.46)),
    0 0 calc(15px + var(--wounded-ammo-steady-tick, 0) * 24px) rgba(141, 255, 177, calc(var(--wounded-ammo-steady-tick, 0) * 0.2));
}

#crosshair.is-wounded-ammo-secured-pip {
  outline: 1px solid rgba(206, 255, 222, calc(var(--wounded-ammo-secured-pip, 0) * 0.32));
  filter:
    drop-shadow(0 0 calc(3px + var(--wounded-ammo-secured-pip, 0) * 7px) rgba(206, 255, 222, calc(var(--wounded-ammo-secured-pip, 0) * 0.28)))
    drop-shadow(0 0 calc(8px + var(--wounded-ammo-secured-pip, 0) * 12px) rgba(141, 255, 177, calc(var(--wounded-ammo-secured-pip, 0) * 0.18)))
    drop-shadow(0 0 calc(4px + var(--wounded-ammo-secured-seat, 0) * 15px) rgba(255, 241, 166, calc(var(--wounded-ammo-secured-seat, 0) * 0.42)))
    drop-shadow(0 0 calc(10px + var(--wounded-ammo-secured-tail-sync, 0) * 44px) rgba(185, 246, 255, calc(var(--wounded-ammo-secured-tail-sync, 0) * 1.85)));
}

#crosshair.is-wounded-ammo-secured-pip::before,
#crosshair.is-wounded-ammo-secured-pip::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(4px + var(--wounded-ammo-secured-pip, 0) * 10px) rgba(206, 255, 222, calc(var(--wounded-ammo-secured-pip, 0) * 0.5)),
    0 0 calc(9px + var(--wounded-ammo-secured-pip, 0) * 18px) rgba(141, 255, 177, calc(var(--wounded-ammo-secured-pip, 0) * 0.24)),
    0 0 calc(5px + var(--wounded-ammo-secured-seat, 0) * 20px) rgba(255, 241, 166, calc(var(--wounded-ammo-secured-seat, 0) * 0.5)),
    0 0 calc(12px + var(--wounded-ammo-secured-tail-sync, 0) * 52px) rgba(185, 246, 255, calc(var(--wounded-ammo-secured-tail-sync, 0) * 1.55)),
    var(--wounded-ammo-secured-pan-glint-x, 0px) 0 calc(7px + var(--wounded-ammo-secured-pan-glint, 0) * 18px) rgba(255, 241, 166, var(--wounded-ammo-secured-pan-glint, 0));
  transform: scale(var(--wounded-ammo-secured-pip-scale, 1));
}

#crosshair.is-heartbeat-calm-echo::before,
#crosshair.is-heartbeat-calm-echo::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc((9px + var(--heartbeat-calm-echo, 0) * 18px) * var(--heartbeat-calm-echo-scale, 1)) rgba(141, 255, 177, calc(var(--heartbeat-calm-echo, 0) * 0.44)),
    0 0 calc((20px + var(--heartbeat-calm-echo, 0) * 28px) * var(--heartbeat-calm-echo-scale, 1)) rgba(185, 246, 255, calc(var(--heartbeat-calm-echo, 0) * 0.2));
}

#crosshair.is-wounded-ammo-threat-flick::before,
#crosshair.is-wounded-ammo-threat-flick::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    var(--wounded-ammo-threat-flick-x, 0px) 0 calc(8px + var(--wounded-ammo-threat-flick, 0) * 14px) rgba(255, 211, 106, calc(var(--wounded-ammo-threat-flick, 0) * 0.42)),
    calc(var(--wounded-ammo-threat-flick-x, 0px) * -0.35) 0 calc(14px + var(--wounded-ammo-threat-flick, 0) * 18px) rgba(255, 126, 98, calc(var(--wounded-ammo-threat-flick, 0) * 0.18));
}

#crosshair.is-wounded-ammo-threat-clear::before,
#crosshair.is-wounded-ammo-threat-clear::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(9px + var(--wounded-ammo-threat-clear, 0) * 26px) rgba(185, 246, 255, calc(var(--wounded-ammo-threat-clear, 0) * 0.52)),
    0 0 calc(18px + var(--wounded-ammo-threat-clear, 0) * 34px) rgba(141, 255, 177, calc(var(--wounded-ammo-threat-clear, 0) * 0.24));
}

#crosshair.is-wounded-ammo-clear-forward-bead {
  background:
    radial-gradient(circle at 50% calc(50% + var(--wounded-ammo-clear-forward-bead-y, 0px)),
      rgba(206, 255, 222, calc(var(--wounded-ammo-clear-forward-bead, 0) * 0.92)) 0 2px,
      rgba(185, 246, 255, calc(var(--wounded-ammo-clear-forward-bead, 0) * 0.42)) 3px,
      rgba(185, 246, 255, 0) calc(7px + var(--wounded-ammo-clear-forward-bead-scale, 0.72) * 5px));
  filter:
    drop-shadow(0 var(--wounded-ammo-clear-forward-bead-y, 0px) calc(5px + var(--wounded-ammo-clear-forward-bead-scale, 0.72) * 5px) rgba(185, 246, 255, calc(var(--wounded-ammo-clear-forward-bead, 0) * 0.48)))
    drop-shadow(0 var(--wounded-ammo-clear-forward-bead-y, 0px) calc(10px + var(--wounded-ammo-clear-forward-bead-scale, 0.72) * 8px) rgba(141, 255, 177, calc(var(--wounded-ammo-clear-forward-bead, 0) * 0.22)));
}

#crosshair.is-wounded-supply-reticle::before,
#crosshair.is-wounded-supply-reticle::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    var(--wounded-supply-reticle-x, 0px) 0 calc(8px + var(--wounded-supply-reticle, 0) * 12px) rgba(185, 246, 255, var(--wounded-supply-reticle-opacity, 0)),
    calc(var(--wounded-supply-reticle-x, 0px) * -0.5) 0 calc(12px + var(--wounded-supply-reticle, 0) * 16px) rgba(141, 255, 177, calc(var(--wounded-supply-reticle-opacity, 0) * 0.58));
}

#crosshair.is-roof-landing-recovery.is-roof-plant-grit-roof::before,
#crosshair.is-roof-landing-recovery.is-roof-plant-grit-roof::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(10px + var(--roof-landing-recovery, 0) * 8px) rgba(185, 246, 255, calc(var(--roof-landing-recovery, 0) * 0.34)),
    0 0 calc(20px + var(--roof-landing-recovery, 0) * 12px) rgba(141, 255, 177, calc(var(--roof-landing-recovery, 0) * 0.18)),
    var(--roof-recovery-plant-grit-hud-x, 0px) -2px calc(4px + var(--roof-recovery-plant-grit-hud, 0) * 8px) rgba(var(--roof-recovery-plant-grit-hud-rgb), calc(var(--roof-recovery-plant-grit-hud, 0) * 0.48));
}

#crosshair.is-roof-landing-recovery.is-roof-plant-grit-runway::before,
#crosshair.is-roof-landing-recovery.is-roof-plant-grit-runway::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(10px + var(--roof-landing-recovery, 0) * 7px) rgba(185, 246, 255, calc(var(--roof-landing-recovery, 0) * 0.33)),
    0 0 calc(18px + var(--roof-landing-recovery, 0) * 13px) rgba(141, 255, 177, calc(var(--roof-landing-recovery, 0) * 0.17)),
    calc(var(--roof-recovery-plant-grit-hud-x, 0px) * 1.18) 1px calc(6px + var(--roof-recovery-plant-grit-hud, 0) * 13px) rgba(var(--roof-recovery-plant-grit-hud-rgb), calc(var(--roof-recovery-plant-grit-hud, 0) * 0.4));
}

#crosshair.is-roof-landing-recovery.is-roof-plant-grit-road::before,
#crosshair.is-roof-landing-recovery.is-roof-plant-grit-road::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(10px + var(--roof-landing-recovery, 0) * 9px) rgba(185, 246, 255, calc(var(--roof-landing-recovery, 0) * 0.32)),
    0 0 calc(20px + var(--roof-landing-recovery, 0) * 14px) rgba(141, 255, 177, calc(var(--roof-landing-recovery, 0) * 0.17)),
    calc(var(--roof-recovery-plant-grit-hud-x, 0px) * 0.82) 2px calc(7px + var(--roof-recovery-plant-grit-hud, 0) * 15px) rgba(var(--roof-recovery-plant-grit-hud-rgb), calc(var(--roof-recovery-plant-grit-hud, 0) * 0.36));
}

#crosshair.is-roof-landing-recovery.is-roof-plant-grit-dirt::before,
#crosshair.is-roof-landing-recovery.is-roof-plant-grit-dirt::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(10px + var(--roof-landing-recovery, 0) * 8px) rgba(185, 246, 255, calc(var(--roof-landing-recovery, 0) * 0.32)),
    0 0 calc(20px + var(--roof-landing-recovery, 0) * 15px) rgba(141, 255, 177, calc(var(--roof-landing-recovery, 0) * 0.18)),
    var(--roof-recovery-plant-grit-hud-x, 0px) 3px calc(8px + var(--roof-recovery-plant-grit-hud, 0) * 18px) rgba(var(--roof-recovery-plant-grit-hud-rgb), calc(var(--roof-recovery-plant-grit-hud, 0) * 0.34));
}

#crosshair.is-extraction-complete {
  filter:
    drop-shadow(0 0 calc(10px + var(--extraction-complete-reticle, 0) * 14px) rgba(141, 255, 177, 0.7))
    drop-shadow(0 0 calc(24px + var(--extraction-complete-reticle-beat, 0) * 18px) rgba(185, 246, 255, 0.34));
}

#crosshair.is-extraction-altitude {
  filter:
    drop-shadow(0 0 calc(8px + var(--extraction-altitude-reticle, 0) * 10px) rgba(255, 211, 106, 0.72))
    drop-shadow(0 0 calc(18px + var(--extraction-altitude-reticle-beat, 0) * 14px) rgba(255, 140, 56, 0.28));
}

#crosshair.is-extraction-boarding-lock {
  filter:
    drop-shadow(0 0 calc(8px + var(--extraction-boarding-lock-reticle, 0) * 9px) rgba(141, 255, 177, 0.62))
    drop-shadow(0 0 calc(18px + var(--extraction-boarding-lock-reticle, 0) * 14px) rgba(185, 246, 255, 0.28));
}

#crosshair.is-extraction-altitude::before,
#crosshair.is-extraction-altitude::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 var(--extraction-altitude-reticle-glow-size, 17px) rgba(255, 211, 106, var(--extraction-altitude-reticle-alpha, 0)),
    0 0 calc(var(--extraction-altitude-reticle-glow-size, 17px) * 1.8) rgba(255, 140, 56, calc(var(--extraction-altitude-reticle-alpha, 0) * 0.42));
}

#crosshair.is-extraction-boarding-lock::before,
#crosshair.is-extraction-boarding-lock::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 var(--extraction-boarding-lock-glow-size, 16px) rgba(141, 255, 177, var(--extraction-boarding-lock-alpha, 0)),
    0 0 calc(var(--extraction-boarding-lock-glow-size, 16px) * 1.7) rgba(185, 246, 255, calc(var(--extraction-boarding-lock-alpha, 0) * 0.46));
}

#crosshair.is-extraction-complete::before,
#crosshair.is-extraction-complete::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 var(--extraction-complete-reticle-glow-size, 18px) rgba(141, 255, 177, var(--extraction-complete-reticle-alpha, 0)),
    0 0 var(--extraction-complete-reticle-soft-glow-size, 34px) rgba(185, 246, 255, calc(var(--extraction-complete-reticle-alpha, 0) * 0.58));
}

#crosshair.is-boss-dust-thump::before,
#crosshair.is-boss-dust-thump::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 var(--boss-dust-thump-reticle-glow-size, 18px) rgba(255, 211, 107, var(--boss-dust-thump-reticle-alpha, 0)),
    0 0 var(--boss-dust-thump-reticle-beat-glow-size, 34px) rgba(255, 140, 56, var(--boss-dust-thump-reticle-beat-alpha, 0));
}

#crosshair.is-boss-air-slice::before,
#crosshair.is-boss-air-slice::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 var(--boss-air-slice-reticle-glow-size, 16px) rgba(var(--boss-air-slice-rgb, 217, 165, 255), var(--boss-air-slice-reticle-alpha, 0)),
    0 0 var(--boss-air-slice-reticle-beat-glow-size, 30px) rgba(var(--boss-air-slice-hot-rgb, 96, 210, 255), var(--boss-air-slice-reticle-beat-alpha, 0));
}

#crosshair.is-boss-air-slice-dodge-read::before,
#crosshair.is-boss-air-slice-dodge-read::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 var(--boss-air-slice-dodge-glow-size, 20px) rgba(var(--boss-air-slice-hot-rgb, 96, 210, 255), var(--boss-air-slice-dodge-alpha, 0)),
    0 0 var(--boss-air-slice-dodge-soft-glow-size, 38px) rgba(var(--boss-air-slice-rgb, 217, 165, 255), var(--boss-air-slice-dodge-soft-alpha, 0));
}

#crosshair.is-boss-air-slice-safe-confirm::before,
#crosshair.is-boss-air-slice-safe-confirm::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 var(--boss-air-slice-dodge-glow-size, 20px) rgba(var(--boss-air-slice-hot-rgb, 96, 210, 255), var(--boss-air-slice-dodge-alpha, 0)),
    0 0 var(--boss-air-slice-dodge-soft-glow-size, 38px) rgba(var(--boss-air-slice-rgb, 217, 165, 255), var(--boss-air-slice-dodge-soft-alpha, 0)),
    0 0 var(--boss-air-slice-safe-glow-size, 15px) rgba(141, 255, 177, var(--boss-air-slice-safe-alpha, 0)),
    0 0 calc(var(--boss-air-slice-safe-glow-size, 15px) * 1.8) rgba(185, 246, 255, calc(var(--boss-air-slice-safe-alpha, 0) * 0.48));
}

#crosshair.is-boss-air-slice-fail-confirm::before,
#crosshair.is-boss-air-slice-fail-confirm::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 var(--boss-air-slice-dodge-glow-size, 20px) rgba(var(--boss-air-slice-hot-rgb, 96, 210, 255), var(--boss-air-slice-dodge-alpha, 0)),
    0 0 var(--boss-air-slice-dodge-soft-glow-size, 38px) rgba(var(--boss-air-slice-rgb, 217, 165, 255), var(--boss-air-slice-dodge-soft-alpha, 0)),
    0 0 var(--boss-air-slice-fail-glow-size, 17px) rgba(255, 96, 80, var(--boss-air-slice-fail-alpha, 0)),
    0 0 calc(var(--boss-air-slice-fail-glow-size, 17px) * 1.9) rgba(255, 196, 107, calc(var(--boss-air-slice-fail-alpha, 0) * 0.44));
}

#crosshair.is-ammo-cover-peek-settle::before,
#crosshair.is-ammo-cover-peek-settle::after {
  opacity: calc(0.78 + var(--ammo-cover-peek-settle-opacity, 0) * 0.22);
}

#crosshair.is-ammo-clear-lock::before,
#crosshair.is-ammo-clear-lock::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 calc(9px + var(--ammo-clear-lock-reticle, 0) * 12px) rgba(185, 246, 255, calc(var(--ammo-clear-lock-reticle, 0) * 0.48)),
    0 0 calc(18px + var(--ammo-clear-lock-reticle, 0) * 18px) rgba(141, 255, 177, calc(var(--ammo-clear-lock-reticle, 0) * 0.24)),
    0 0 calc(10px + var(--ammo-group-ripple-reticle-lean, 0) * 12px) rgba(255, 211, 107, var(--ammo-group-ripple-reticle-lean-glow, 0));
}

#crosshair.is-low-fps-safe-lane::before,
#crosshair.is-low-fps-safe-lane::after {
  box-shadow:
    var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
    0 0 14px rgba(141, 255, 177, var(--ammo-safe-lane-reticle-alpha, 0)),
    0 0 26px rgba(185, 246, 255, calc(var(--ammo-safe-lane-reticle-alpha, 0) * 0.55)),
    0 0 18px rgba(var(--ammo-safe-lane-reticle-surface-rgb), calc(var(--ammo-safe-lane-reticle-surface-tick, 0) * 0.42)),
    0 0 22px rgba(var(--ammo-safe-lane-reticle-tail-rgb), calc(var(--ammo-safe-lane-reticle-tail, 0) * 0.34));
}

.ammo-guide {
  --ammo-guide-offscreen-pulse: 0;
  --ammo-guide-offscreen-urgent: 0;
  --ammo-guide-offscreen-glow: 20px;
  --ammo-guide-offscreen-scale: 1;
  --ammo-guide-offscreen-rate: 1.08s;
  --ammo-guide-blocked-scrape: 0;
  --ammo-guide-blocked-scrape-x: 0px;
  --ammo-guide-blocked-scrape-scale: 1;
  --ammo-guide-cover-peek-pulse: 0;
  --ammo-guide-cover-peek-knock-x: 0px;
  --ammo-guide-cover-peek-knock-y: 0px;
  --ammo-guide-cover-peek-knock-rot: 0deg;
  --ammo-guide-cover-peek-knock-scale: 1;
  --ammo-guide-cover-peek-material-read: 0;
  --ammo-guide-cover-peek-material-pressure: 0;
  --ammo-guide-chase-assist: 0;
  --ammo-guide-chase-glow: 18px;
  --ammo-guide-chase-threat: 0;
  --ammo-guide-chase-threat-side: 1;
  --ammo-guide-low-fps-safe-lane: 0;
  --ammo-guide-safe-lane-surface-tick: 0;
  --ammo-guide-safe-lane-surface-color: rgba(180, 154, 104, 0.78);
  --ammo-guide-cover-peek-material-color: #ffddad;
  --ammo-guide-blocked-glow-size: 20px;
  --ammo-guide-blocked-border: rgba(255, 179, 108, 0.76);
  --ammo-guide-blocked-glow: rgba(255, 179, 108, 0.14);
  --ammo-guide-blocked-inset: rgba(185, 246, 255, 0.1);
  --ammo-guide-blocked-arrow: #ffb36c;
  --ammo-guide-blocked-label: #ffddad;
  --ammo-guide-blocked-label-glow: rgba(255, 179, 108, 0.42);
  --ammo-guide-clear-sweep: 0;
  --ammo-guide-clear-edge-x: -12px;
  --ammo-guide-clear-pan-echo: 0;
  --ammo-guide-clear-muffle: 0;
  --ammo-guide-clear-edge-core: rgba(185, 246, 255, 0.42);
  --ammo-guide-clear-edge-trail: rgba(141, 255, 177, 0.22);
  --ammo-guide-clear-edge-glow: rgba(185, 246, 255, 0.2);
  --ammo-guide-clear-edge-border: rgba(185, 246, 255, 0.72);
  --ammo-guide-clear-material-tick: 0;
  --ammo-guide-clear-material-color: rgba(180, 154, 104, 0.82);
  --ammo-guide-clear-material-width: 12px;
  --ammo-guide-clear-material-height: 3px;
  --ammo-guide-clear-material-opacity-base: 0.18;
  --ammo-guide-clear-material-opacity-gain: 0.74;
  --ammo-guide-clear-material-glow: 8px;
  --ammo-guide-wounded-supply: 0;
  position: absolute;
  left: var(--ammo-guide-x, 50%);
  top: var(--ammo-guide-y, 50%);
  z-index: 6;
  display: grid;
  grid-template-columns: 18px auto;
  grid-template-rows: auto auto auto;
  gap: 1px 7px;
  min-width: 76px;
  padding: 8px 10px;
  transform:
    translate(calc(-50% + var(--ammo-guide-cover-peek-knock-x)), calc(-50% + var(--ammo-guide-cover-peek-knock-y)))
    rotate(var(--ammo-guide-cover-peek-knock-rot))
    scale(var(--ammo-guide-cover-peek-knock-scale));
  border: 1px solid rgba(242, 203, 87, 0.62);
  border-radius: 8px;
  background: rgba(13, 18, 22, 0.86);
  color: var(--gold);
  pointer-events: none;
  overflow: hidden;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.32), 0 0 20px rgba(242, 203, 87, 0.18);
}

.ammo-guide > * {
  position: relative;
  z-index: 1;
}

.ammo-guide::before {
  content: "";
  position: absolute;
  top: -8px;
  bottom: -8px;
  z-index: 0;
  width: 26px;
  opacity: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(185, 246, 255, 0), var(--ammo-guide-clear-edge-core), var(--ammo-guide-clear-edge-trail), rgba(185, 246, 255, 0));
}

.ammo-guide.is-clear-lane-sweep {
  border-color: var(--ammo-guide-clear-edge-border);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.32),
    0 0 22px var(--ammo-guide-clear-edge-glow),
    inset 0 0 0 1px var(--ammo-guide-clear-edge-trail),
    inset 0 0 calc(var(--ammo-guide-clear-muffle) * 48px) rgba(255, 211, 107, 0.16);
}

.ammo-guide.is-clear-lane-sweep::before {
  opacity: var(--ammo-guide-clear-sweep);
  filter:
    saturate(calc(1 + var(--ammo-guide-clear-muffle) * 1.8))
    blur(calc(var(--ammo-guide-clear-muffle) * 3px))
    drop-shadow(calc(var(--ammo-guide-clear-pan-echo) * 10px) 0 8px var(--ammo-guide-clear-edge-glow));
}

.ammo-guide.is-clear-lane-sweep[data-clear-side="left"]::before {
  left: var(--ammo-guide-clear-edge-x);
  transform: translateX(calc(var(--ammo-guide-clear-pan-echo) * 4px));
}

.ammo-guide.is-clear-lane-sweep[data-clear-side="right"]::before {
  right: var(--ammo-guide-clear-edge-x);
  transform: scaleX(-1) translateX(calc(var(--ammo-guide-clear-pan-echo) * -4px));
}

.ammo-guide.is-clear-material-tick b::after {
  content: "";
  display: inline-block;
  width: var(--ammo-guide-clear-material-width);
  height: var(--ammo-guide-clear-material-height);
  margin-left: 5px;
  vertical-align: 3px;
  border-radius: 99px;
  opacity: calc(var(--ammo-guide-clear-material-opacity-base) + var(--ammo-guide-clear-material-tick) * var(--ammo-guide-clear-material-opacity-gain));
  transform: translateY(calc(var(--ammo-guide-clear-material-tick) * -1px)) scaleX(calc(0.42 + var(--ammo-guide-clear-material-tick) * 0.58));
  transform-origin: left center;
  background: linear-gradient(90deg, var(--ammo-guide-clear-material-color), rgba(185, 246, 255, 0.28));
  box-shadow: 0 0 calc(4px + var(--ammo-guide-clear-material-tick) * var(--ammo-guide-clear-material-glow)) var(--ammo-guide-clear-material-color);
}

.ammo-guide.is-clear-material-tick[data-clear-material-surface="road"] {
  --ammo-guide-clear-material-color: rgba(89, 100, 98, 0.84);
  --ammo-guide-clear-material-width: 14px;
  --ammo-guide-clear-material-height: 2px;
  --ammo-guide-clear-material-opacity-base: 0.16;
  --ammo-guide-clear-material-opacity-gain: 0.64;
  --ammo-guide-clear-material-glow: 5px;
}

.ammo-guide.is-clear-material-tick[data-clear-material-surface="roof"] {
  --ammo-guide-clear-material-color: rgba(138, 133, 122, 0.84);
  --ammo-guide-clear-material-width: 10px;
  --ammo-guide-clear-material-height: 3px;
  --ammo-guide-clear-material-opacity-base: 0.2;
  --ammo-guide-clear-material-opacity-gain: 0.7;
  --ammo-guide-clear-material-glow: 7px;
}

.ammo-guide.is-clear-material-tick[data-clear-material-surface="runway"] {
  --ammo-guide-clear-material-color: rgba(102, 113, 121, 0.84);
  --ammo-guide-clear-material-width: 11px;
  --ammo-guide-clear-material-height: 2px;
  --ammo-guide-clear-material-opacity-base: 0.18;
  --ammo-guide-clear-material-opacity-gain: 0.68;
  --ammo-guide-clear-material-glow: 6px;
}

.ammo-guide.is-clear-material-tick[data-clear-material-surface="dirt"] {
  --ammo-guide-clear-material-color: rgba(180, 154, 104, 0.84);
  --ammo-guide-clear-material-width: 13px;
  --ammo-guide-clear-material-height: 4px;
  --ammo-guide-clear-material-opacity-base: 0.22;
  --ammo-guide-clear-material-opacity-gain: 0.76;
  --ammo-guide-clear-material-glow: 10px;
}

.ammo-guide.is-low-fps-safe-lane {
  border-color: rgba(141, 255, 177, 0.78);
  background:
    linear-gradient(90deg, rgba(141, 255, 177, 0.14), rgba(13, 18, 22, 0.9) 50%, rgba(185, 246, 255, 0.1)),
    rgba(13, 18, 22, 0.88);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.32),
    0 0 calc(20px + var(--ammo-guide-low-fps-safe-lane) * 18px) rgba(141, 255, 177, 0.2),
    inset 0 0 0 1px rgba(185, 246, 255, 0.16);
}

.ammo-guide.is-low-fps-safe-lane .ammo-guide-arrow {
  border-left-color: #8dffb1;
  filter:
    drop-shadow(0 0 8px rgba(141, 255, 177, 0.5))
    drop-shadow(0 0 calc(10px + var(--ammo-guide-low-fps-safe-lane) * 10px) rgba(185, 246, 255, 0.22));
}

.ammo-guide.is-low-fps-safe-lane b {
  color: #fff1a6;
  text-shadow: 0 0 calc(7px + var(--ammo-guide-low-fps-safe-lane) * 8px) rgba(141, 255, 177, 0.36);
}

.ammo-guide.is-low-fps-safe-lane small::after {
  content: " SAFE";
  display: inline-block;
  margin-left: 3px;
  color: #8dffb1;
  opacity: calc(0.58 + var(--ammo-guide-low-fps-safe-lane) * 0.34);
  text-shadow: 0 0 8px rgba(141, 255, 177, 0.42);
}

.ammo-guide.is-low-fps-safe-lane small::before {
  content: "";
  display: inline-block;
  width: 13px;
  height: 3px;
  margin-right: 4px;
  vertical-align: 2px;
  border-radius: 99px;
  opacity: calc(0.24 + var(--ammo-guide-safe-lane-surface-tick) * 0.7);
  transform: scaleX(calc(0.52 + var(--ammo-guide-safe-lane-surface-tick) * 0.48));
  transform-origin: left center;
  background: linear-gradient(90deg, rgba(244, 247, 248, 0), var(--ammo-guide-safe-lane-surface-color), rgba(185, 246, 255, 0.24));
  box-shadow: 0 0 calc(4px + var(--ammo-guide-safe-lane-surface-tick) * 8px) var(--ammo-guide-safe-lane-surface-color);
}

.ammo-guide.is-low-fps-safe-lane[data-low-fps-surface="road"] {
  --ammo-guide-safe-lane-surface-color: rgba(89, 100, 98, 0.82);
}

.ammo-guide.is-low-fps-safe-lane[data-low-fps-surface="roof"] {
  --ammo-guide-safe-lane-surface-color: rgba(138, 133, 122, 0.82);
}

.ammo-guide.is-low-fps-safe-lane[data-low-fps-surface="runway"] {
  --ammo-guide-safe-lane-surface-color: rgba(102, 113, 121, 0.82);
}

.ammo-guide.is-low-fps-safe-lane[data-low-fps-surface="dirt"] {
  --ammo-guide-safe-lane-surface-color: rgba(180, 154, 104, 0.82);
}

.ammo-guide.is-wounded-supply {
  border-color: rgba(141, 255, 177, 0.76);
  background:
    linear-gradient(90deg, rgba(141, 255, 177, 0.12), rgba(13, 18, 22, 0.9) 44%, rgba(255, 241, 166, 0.1)),
    rgba(10, 22, 28, 0.9);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.34),
    0 0 calc(18px + var(--ammo-guide-wounded-supply) * 18px) rgba(141, 255, 177, 0.22),
    0 0 calc(var(--ammo-guide-wounded-supply) * 14px) rgba(255, 241, 166, 0.22),
    inset 0 0 0 1px rgba(185, 246, 255, calc(0.12 + var(--ammo-guide-wounded-supply) * 0.18));
}

.ammo-guide.is-wounded-supply .ammo-guide-arrow {
  border-left-color: #8dffb1;
  filter:
    drop-shadow(0 0 8px rgba(141, 255, 177, 0.58))
    drop-shadow(0 0 calc(10px + var(--ammo-guide-wounded-supply) * 12px) rgba(255, 241, 166, 0.24));
}

.ammo-guide.is-wounded-supply b {
  color: #fff1a6;
  text-shadow:
    0 0 8px rgba(141, 255, 177, 0.34),
    0 0 calc(var(--ammo-guide-wounded-supply) * 10px) rgba(255, 241, 166, 0.28);
}

.ammo-guide.is-wounded-supply b::before {
  content: "STABILIZE";
  display: inline-block;
  margin-right: 5px;
  color: #8dffb1;
  opacity: calc(0.52 + var(--ammo-guide-wounded-supply) * 0.4);
  text-shadow: 0 0 8px rgba(141, 255, 177, 0.42);
}

.ammo-guide.is-chase-assist {
  border-color: rgba(141, 255, 177, 0.72);
  background:
    linear-gradient(90deg, rgba(141, 255, 177, 0.12), rgba(10, 22, 28, 0.9) 48%, rgba(185, 246, 255, 0.1)),
    rgba(10, 22, 28, 0.9);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.34),
    0 0 var(--ammo-guide-chase-glow) rgba(141, 255, 177, 0.2),
    inset 0 0 0 1px rgba(185, 246, 255, calc(0.12 + var(--ammo-guide-chase-assist) * 0.18));
}

.ammo-guide.is-chase-assist .ammo-guide-arrow {
  border-left-color: #8dffb1;
  filter:
    drop-shadow(0 0 8px rgba(141, 255, 177, 0.52))
    drop-shadow(0 0 calc(10px + var(--ammo-guide-chase-assist) * 12px) rgba(185, 246, 255, 0.24));
}

.ammo-guide.is-chase-assist[data-chase-threat-side="left"]::before,
.ammo-guide.is-chase-assist[data-chase-threat-side="right"]::before {
  width: calc(15px + var(--ammo-guide-chase-threat) * 15px);
  opacity: calc(var(--ammo-guide-chase-threat) * 0.78);
  background: linear-gradient(90deg, rgba(255, 179, 108, 0), rgba(255, 179, 108, 0.76), rgba(141, 255, 177, 0.28));
  filter:
    blur(calc(0.5px + var(--ammo-guide-chase-threat) * 1.5px))
    drop-shadow(calc(var(--ammo-guide-chase-threat-side) * 9px) 0 10px rgba(255, 179, 108, 0.34));
}

.ammo-guide.is-chase-assist[data-chase-threat-side="left"]::before {
  left: -12px;
  transform: scaleX(-1);
}

.ammo-guide.is-chase-assist[data-chase-threat-side="right"]::before {
  right: -12px;
}

.ammo-guide.is-chase-assist small::after {
  content: " " attr(data-chase-assist);
  color: #8dffb1;
  opacity: calc(0.58 + var(--ammo-guide-chase-assist) * 0.34);
  text-shadow: 0 0 8px rgba(141, 255, 177, 0.42);
}

.ammo-guide.is-chase-assist small[data-chase-assist=""]::after {
  display: none;
}

.ammo-guide-arrow {
  grid-row: 1 / 3;
  align-self: center;
  width: 0;
  height: 0;
  transform: rotate(var(--ammo-guide-rot, 0deg));
  transform-origin: center;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 16px solid var(--gold);
  filter: drop-shadow(0 0 8px rgba(242, 203, 87, 0.52));
}

.ammo-guide b {
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0;
}

.ammo-guide[data-low-ammo-action]:not([data-low-ammo-action=""]) b::after {
  content: attr(data-low-ammo-action);
  display: inline-block;
  margin-left: 5px;
  color: #ffd56d;
  font-size: 8px;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
  text-shadow: 0 0 8px rgba(255, 213, 109, 0.42);
  transform: translateY(-1px);
}

.ammo-guide.is-empty[data-low-ammo-action]:not([data-low-ammo-action=""]) b::after {
  color: #fff1a6;
  text-shadow: 0 0 10px rgba(237, 91, 71, 0.42), 0 0 6px rgba(255, 213, 109, 0.34);
}

.ammo-guide.is-empty.is-urgent.is-reduced-motion[data-motion]:not([data-motion=""]) small::before {
  content: attr(data-motion);
  display: inline-block;
  margin-right: 5px;
  color: rgba(141, 255, 177, 0.92);
  font-size: 8px;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
  text-shadow: 0 0 8px rgba(141, 255, 177, 0.42), 0 0 6px rgba(185, 246, 255, 0.24);
  transform: translateY(-1px);
}

.ammo-guide small {
  color: var(--ink);
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
}

.ammo-guide-confidence {
  --ammo-guide-confidence-pulse: 0;
  grid-column: 1 / 3;
  justify-self: stretch;
  margin-top: 3px;
  padding: 3px 6px;
  border: 1px solid rgba(141, 255, 177, 0.34);
  border-radius: 5px;
  background: rgba(12, 31, 22, 0.52);
  color: #8dffb1;
  font-size: 8px;
  font-style: normal;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 0 calc(8px + var(--ammo-guide-confidence-pulse) * 10px) rgba(141, 255, 177, 0.34);
  transform: translateY(calc(var(--ammo-guide-confidence-pulse) * -1px)) scale(calc(1 + var(--ammo-guide-confidence-pulse) * 0.035));
  box-shadow:
    0 0 calc(var(--ammo-guide-confidence-pulse) * 14px) rgba(141, 255, 177, 0.18),
    inset 0 0 0 1px rgba(185, 246, 255, calc(var(--ammo-guide-confidence-pulse) * 0.12));
}

.ammo-guide-confidence[data-confidence="blocked"] {
  border-color: rgba(255, 179, 108, 0.46);
  background: rgba(48, 23, 16, 0.58);
  color: #ffddad;
  text-shadow: 0 0 9px rgba(255, 179, 108, 0.38);
}

.ammo-guide-confidence[data-confidence="resolved"] {
  border-color: rgba(185, 246, 255, 0.44);
  background: rgba(9, 30, 34, 0.62);
  color: #b9f6ff;
  text-shadow: 0 0 10px rgba(185, 246, 255, 0.42);
}

.ammo-guide-confidence[data-feedback="soft"] {
  border-color: rgba(141, 255, 177, 0.24);
  background: rgba(12, 31, 22, 0.42);
  color: rgba(141, 255, 177, 0.86);
  box-shadow:
    0 0 calc(var(--ammo-guide-confidence-pulse) * 7px) rgba(141, 255, 177, 0.1),
    inset 0 0 0 1px rgba(185, 246, 255, 0.05);
}

.ammo-guide-resolve {
  grid-column: 1 / 3;
  min-width: 106px;
  margin-top: 5px;
  padding: 4px 7px;
  border: 1px solid rgba(141, 255, 177, 0.42);
  border-radius: 6px;
  background: rgba(12, 31, 22, 0.76);
  color: #8dffb1;
  font-size: 9px;
  font-style: normal;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
  text-shadow: 0 0 10px rgba(141, 255, 177, 0.42);
  opacity: calc(0.25 + var(--ammo-guide-resolve-pulse, 0) * 0.75);
  transform: translateY(calc((1 - var(--ammo-guide-resolve-pulse, 0)) * 5px)) scale(calc(0.96 + var(--ammo-guide-resolve-pulse, 0) * 0.04));
}

.ammo-guide-resolve[data-mode="clear"] {
  border-color: rgba(185, 246, 255, 0.5);
  background: rgba(9, 30, 34, 0.78);
  color: #b9f6ff;
  text-shadow: 0 0 11px rgba(185, 246, 255, 0.48);
}

.ammo-guide.is-resolved {
  border-color: rgba(141, 255, 177, 0.72);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.32),
    0 0 24px rgba(141, 255, 177, 0.2),
    inset 0 0 0 1px rgba(255, 241, 166, 0.1);
}

.ammo-guide.is-resolved .ammo-guide-arrow {
  border-left-color: #8dffb1;
  filter:
    drop-shadow(0 0 9px rgba(141, 255, 177, 0.66))
    drop-shadow(0 0 15px rgba(255, 241, 166, 0.3));
}

.ammo-guide.is-offscreen {
  animation: ammo-guide-offscreen-breathe var(--ammo-guide-offscreen-rate) ease-in-out infinite alternate;
  border-style: dashed;
  border-color: rgba(185, 246, 255, 0.62);
  background: rgba(10, 22, 28, 0.88);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.32),
    0 0 var(--ammo-guide-offscreen-glow) rgba(185, 246, 255, 0.18),
    0 0 calc(var(--ammo-guide-offscreen-urgent) * 18px) rgba(255, 140, 56, 0.24);
}

.ammo-guide.is-offscreen .ammo-guide-arrow {
  transform: rotate(var(--ammo-guide-rot, 0deg)) scale(var(--ammo-guide-offscreen-scale));
  border-left-color: #b9f6ff;
  filter:
    drop-shadow(0 0 8px rgba(185, 246, 255, 0.58))
    drop-shadow(0 0 14px rgba(255, 241, 166, 0.22));
}

.ammo-guide.is-offscreen small {
  color: #b9f6ff;
}

.ammo-guide.is-offscreen::after {
  content: attr(data-offscreen-turn);
  grid-column: 1 / 3;
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px solid rgba(185, 246, 255, 0.28);
  color: #b9f6ff;
  font-size: 8px;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
  text-shadow:
    0 0 9px rgba(185, 246, 255, 0.4),
    0 0 calc(var(--ammo-guide-offscreen-urgent) * 10px) rgba(255, 140, 56, 0.46);
}

.ammo-guide.is-offscreen[data-offscreen-turn=""]::after {
  display: none;
}

.ammo-guide.is-blocked {
  border-color: var(--ammo-guide-blocked-border);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.34),
    0 0 var(--ammo-guide-blocked-glow-size) var(--ammo-guide-blocked-glow),
    inset 0 0 0 1px var(--ammo-guide-blocked-inset);
}

.ammo-guide.is-blocked .ammo-guide-arrow {
  border-left-color: var(--ammo-guide-blocked-arrow);
  filter:
    drop-shadow(0 0 8px var(--ammo-guide-blocked-glow))
    drop-shadow(0 0 14px var(--ammo-guide-blocked-inset));
}

.ammo-guide.is-blocked b {
  color: var(--ammo-guide-blocked-label);
  text-shadow: 0 0 9px var(--ammo-guide-blocked-label-glow);
}

.ammo-guide.is-blocked small {
  color: var(--ammo-guide-blocked-label);
  text-shadow:
    0 0 calc(4px + var(--ammo-guide-cover-peek-material-read) * 10px) var(--ammo-guide-cover-peek-material-color),
    0 0 9px var(--ammo-guide-blocked-label-glow);
}

.ammo-guide.is-blocked[data-cover-material]:not([data-cover-material=""]) small::before {
  content: attr(data-cover-material) " ";
  color: var(--ammo-guide-cover-peek-material-color);
  opacity: calc(0.18 + var(--ammo-guide-cover-peek-material-read) * 0.82);
  text-shadow: 0 0 calc(6px + var(--ammo-guide-cover-peek-material-read) * 12px) var(--ammo-guide-cover-peek-material-color);
}

.ammo-guide.is-blocked.is-low-fps-material-pressure {
  background:
    linear-gradient(90deg, rgba(185, 246, 255, 0.1), rgba(13, 18, 22, 0.93) 46%, rgba(255, 179, 108, 0.12)),
    rgba(13, 18, 22, 0.92);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.36),
    0 0 calc(var(--ammo-guide-blocked-glow-size) + var(--ammo-guide-cover-peek-material-pressure) * 12px) var(--ammo-guide-blocked-glow),
    inset 0 0 0 1px var(--ammo-guide-blocked-inset);
}

.ammo-guide.is-blocked.is-low-fps-material-pressure small {
  color: #fff1a6;
  text-shadow:
    0 0 calc(7px + var(--ammo-guide-cover-peek-material-pressure) * 12px) var(--ammo-guide-cover-peek-material-color),
    0 0 11px var(--ammo-guide-blocked-label-glow);
}

.ammo-guide.is-blocked.is-low-fps-material-pressure[data-cover-material]:not([data-cover-material=""]) small::before {
  display: inline-block;
  margin-right: 2px;
  padding: 1px 3px;
  border: 1px solid rgba(255, 241, 166, 0.45);
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.28);
  color: #fff1a6;
  opacity: calc(0.62 + var(--ammo-guide-cover-peek-material-pressure) * 0.38);
  text-shadow: 0 0 calc(9px + var(--ammo-guide-cover-peek-material-pressure) * 14px) var(--ammo-guide-cover-peek-material-color);
}

.ammo-guide.is-blocked-scrape {
  transform:
    translate(calc(-50% + var(--ammo-guide-blocked-scrape-x) + var(--ammo-guide-cover-peek-knock-x)), calc(-50% + var(--ammo-guide-cover-peek-knock-y)))
    rotate(var(--ammo-guide-cover-peek-knock-rot))
    scale(var(--ammo-guide-blocked-scrape-scale))
    scale(var(--ammo-guide-cover-peek-knock-scale));
  background:
    linear-gradient(90deg, rgba(255, 179, 108, 0.16), rgba(13, 18, 22, 0.88) 42%, rgba(185, 246, 255, 0.08)),
    rgba(13, 18, 22, 0.9);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.34),
    0 0 24px rgba(255, 179, 108, 0.24),
    inset 0 0 0 1px rgba(255, 241, 166, 0.16);
  animation: ammo-guide-blocked-scrape 180ms steps(2, end) 2;
}

.ammo-guide.is-blocked-scrape small {
  color: #fff1a6;
}

@keyframes ammo-guide-blocked-scrape {
  0%, 100% {
    filter: drop-shadow(0 0 0 rgba(255, 179, 108, 0));
  }

  50% {
    filter: drop-shadow(0 0 10px rgba(255, 179, 108, 0.42));
  }
}

@keyframes ammo-guide-offscreen-breathe {
  from {
    filter: drop-shadow(0 0 0 rgba(185, 246, 255, 0));
  }

  to {
    filter: drop-shadow(0 0 var(--ammo-guide-offscreen-glow) rgba(185, 246, 255, 0.28));
  }
}

.ammo-guide.is-empty {
  border-color: rgba(237, 91, 71, 0.72);
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.32), 0 0 22px rgba(237, 91, 71, 0.2);
}

.ammo-guide.is-empty .ammo-guide-arrow {
  border-left-color: #ffb36c;
  filter: drop-shadow(0 0 8px rgba(237, 91, 71, 0.58));
}

.ammo-guide.is-empty-priority {
  transform: translate(-50%, -50%) scale(1.06);
  border-color: rgba(255, 179, 108, 0.9);
  background: rgba(61, 19, 12, 0.92);
  color: #ffddad;
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.36),
    0 0 24px rgba(237, 91, 71, 0.3),
    inset 0 0 0 1px rgba(255, 241, 166, 0.12);
}

.ammo-guide.is-empty-priority .ammo-guide-arrow {
  border-left-color: #fff1a6;
  filter:
    drop-shadow(0 0 10px rgba(255, 179, 108, 0.76))
    drop-shadow(0 0 18px rgba(237, 91, 71, 0.34));
}

.ammo-guide.is-empty-priority b {
  color: #fff1a6;
}

.ammo-guide.is-urgent {
  border-color: rgba(255, 140, 56, 0.84);
  background: rgba(61, 19, 12, 0.9);
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.34), 0 0 28px rgba(237, 91, 71, 0.28);
}

.ammo-guide.is-urgent .ammo-guide-arrow {
  border-left-color: #fff1a6;
  filter:
    drop-shadow(0 0 10px rgba(255, 140, 56, 0.72))
    drop-shadow(0 0 18px rgba(237, 91, 71, 0.32));
}

.ammo-guide.is-urgent b {
  color: #ffb36c;
}

.tactical-guide {
  position: absolute;
  left: var(--tactical-guide-x, 50%);
  top: var(--tactical-guide-y, 50%);
  z-index: 6;
  display: grid;
  grid-template-columns: 18px auto;
  grid-template-rows: auto auto;
  gap: 1px 7px;
  min-width: 82px;
  padding: 8px 10px;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(141, 255, 177, 0.66);
  border-radius: 8px;
  background: rgba(10, 32, 23, 0.88);
  color: #8dffb1;
  pointer-events: none;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.32), 0 0 22px rgba(92, 231, 126, 0.18);
}

.tactical-guide-arrow {
  grid-row: 1 / 3;
  align-self: center;
  width: 0;
  height: 0;
  transform: rotate(var(--tactical-guide-rot, 0deg));
  transform-origin: center;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 16px solid #8dffb1;
  filter: drop-shadow(0 0 8px rgba(92, 231, 126, 0.52));
}

.tactical-guide b {
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0;
}

.tactical-guide small {
  color: var(--ink);
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
}

.tactical-guide[data-type="flashbang"] {
  border-color: rgba(185, 246, 255, 0.68);
  background: rgba(12, 38, 47, 0.9);
  color: #b9f6ff;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.32), 0 0 22px rgba(185, 246, 255, 0.2);
}

.tactical-guide[data-type="flashbang"] .tactical-guide-arrow {
  border-left-color: #b9f6ff;
  filter: drop-shadow(0 0 8px rgba(185, 246, 255, 0.56));
}

.tactical-guide[data-type="mine"] {
  border-color: rgba(255, 179, 108, 0.72);
  background: rgba(50, 31, 12, 0.9);
  color: #ffb36c;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.32), 0 0 22px rgba(255, 179, 108, 0.2);
}

.tactical-guide[data-type="mine"] .tactical-guide-arrow {
  border-left-color: #ffb36c;
  filter: drop-shadow(0 0 8px rgba(255, 179, 108, 0.56));
}

.tactical-guide.is-urgent {
  border-color: rgba(255, 140, 56, 0.84);
  background: rgba(61, 22, 14, 0.92);
  color: #ffb36c;
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.34),
    0 0 28px rgba(237, 91, 71, 0.28),
    inset 0 0 0 1px rgba(255, 213, 109, 0.12);
}

.tactical-guide.is-urgent .tactical-guide-arrow {
  border-left-color: #fff1a6;
  filter:
    drop-shadow(0 0 10px rgba(255, 140, 56, 0.72))
    drop-shadow(0 0 18px rgba(237, 91, 71, 0.32));
}

.tactical-guide.is-urgent b {
  color: #ffb36c;
}

#toast {
  position: absolute;
  left: 50%;
  bottom: 34px;
  z-index: 6;
  max-width: min(520px, calc(100vw - 32px));
  padding: 12px 16px;
  transform: translateX(-50%);
  border: 1px solid rgba(242, 203, 87, 0.42);
  border-radius: 8px;
  background: rgba(13, 18, 22, 0.88);
  color: var(--gold);
  font-size: 13px;
  font-weight: 900;
  text-align: center;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.38);
}

#toast.is-controls-preset {
  border-color: rgba(141, 255, 177, 0.6);
  background: linear-gradient(135deg, rgba(18, 48, 38, 0.94), rgba(14, 34, 44, 0.9));
  color: #b9f6ff;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.42), 0 0 24px rgba(141, 255, 177, 0.16);
}

#end-summary {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 9;
  width: min(440px, calc(100vw - 32px));
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.end-card {
  position: relative;
  display: grid;
  gap: 8px;
  max-height: calc(100vh - 32px);
  overflow: auto;
  padding: 18px;
  border: 1px solid rgba(185, 246, 255, 0.48);
  border-radius: 8px;
  background: rgba(9, 14, 18, 0.9);
  color: var(--ink);
  text-align: center;
  box-shadow: 0 20px 70px rgba(0, 0, 0, 0.48), 0 0 26px rgba(185, 246, 255, 0.16);
  backdrop-filter: blur(10px);
  pointer-events: auto;
}

#end-summary.is-clean-extract-secured .end-card {
  border-color: rgba(141, 255, 177, 0.68);
  box-shadow:
    0 20px 70px rgba(0, 0, 0, 0.48),
    0 0 30px rgba(141, 255, 177, 0.2),
    inset 0 0 18px rgba(185, 246, 255, 0.08);
  animation: clean-extraction-card-secured 880ms ease-out both;
}

#end-summary.is-clean-extract-secured .end-lane-badge {
  border-color: rgba(141, 255, 177, 0.72);
  background: linear-gradient(90deg, rgba(141, 255, 177, 0.18), rgba(185, 246, 255, 0.1));
  box-shadow: 0 0 18px rgba(141, 255, 177, 0.22);
  animation: clean-extraction-badge-secured 720ms ease-out 120ms both;
}

#end-summary.is-route-stamped .end-card {
  border-color: rgba(185, 246, 255, 0.56);
}

#end-summary.is-route-stamped .end-card::before {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(185, 246, 255, 0.5);
  border-radius: 8px;
  opacity: 0;
  pointer-events: none;
  animation: route-stamp-card-impact 680ms ease-out both;
}

#end-summary.is-route-stamped-clean .end-card {
  box-shadow:
    0 20px 70px rgba(0, 0, 0, 0.48),
    0 0 24px rgba(141, 255, 177, 0.22),
    inset 0 0 18px rgba(141, 255, 177, 0.08);
}

#end-summary.is-route-stamped-clean .end-card::before {
  border-color: rgba(141, 255, 177, 0.58);
  box-shadow: 0 0 20px rgba(141, 255, 177, 0.18);
}

#end-summary.is-route-stamped-recovered .end-card {
  border-color: rgba(242, 203, 87, 0.62);
  box-shadow:
    0 20px 70px rgba(0, 0, 0, 0.48),
    0 0 24px rgba(242, 203, 87, 0.2),
    inset 0 0 18px rgba(242, 203, 87, 0.08);
}

#end-summary.is-route-stamped-recovered .end-card::before {
  border-color: rgba(242, 203, 87, 0.62);
  box-shadow: 0 0 20px rgba(242, 203, 87, 0.18);
}

@keyframes route-stamp-card-impact {
  0% {
    opacity: 0;
    transform: scale(0.94);
  }

  38% {
    opacity: 0.82;
    transform: scale(1.012);
  }

  100% {
    opacity: 0;
    transform: scale(1.045);
  }
}

@keyframes clean-extraction-card-secured {
  0% {
    filter: brightness(0.92);
    transform: scale(0.985);
  }

  44% {
    filter: brightness(1.12);
    transform: scale(1.018);
  }

  100% {
    filter: brightness(1);
    transform: scale(1);
  }
}

@keyframes clean-extraction-badge-secured {
  0% {
    letter-spacing: 0;
    transform: scale(0.96);
  }

  52% {
    letter-spacing: 0.4px;
    transform: scale(1.08);
  }

  100% {
    letter-spacing: 0;
    transform: scale(1);
  }
}

.end-card strong {
  font-size: 24px;
  letter-spacing: 0;
}

.end-card span {
  justify-self: center;
  padding: 5px 10px;
  border: 1px solid rgba(242, 203, 87, 0.5);
  border-radius: 999px;
  color: var(--gold);
  font-size: 12px;
  font-weight: 900;
}

.end-card .end-lane-badge {
  position: relative;
  overflow: hidden;
  min-width: 118px;
  border-color: rgba(141, 255, 177, 0.42);
  background: rgba(141, 255, 177, 0.11);
  color: #8dffb1;
  font-size: 11px;
  line-height: 1.2;
  text-transform: uppercase;
}

.end-card .end-lane-badge.is-continued {
  border-color: rgba(242, 203, 87, 0.58);
  background: rgba(242, 203, 87, 0.16);
  color: var(--gold);
  box-shadow: 0 0 18px rgba(242, 203, 87, 0.16);
}

.end-card .end-lane-badge:not(.is-continued)::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(105deg, transparent 18%, rgba(201, 255, 221, 0.32) 46%, transparent 76%);
  opacity: 0;
  pointer-events: none;
  transform: translateX(-130%);
  animation: clean-lane-badge-confirm 720ms ease-out 120ms both;
}

.end-card .end-lane-badge.is-continued::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(105deg, transparent 15%, rgba(255, 226, 128, 0.34) 44%, transparent 76%);
  opacity: 0;
  pointer-events: none;
  transform: translateX(-130%);
  animation: continued-lane-badge-reroute 760ms ease-out 130ms both;
}

@keyframes continued-lane-badge-reroute {
  0% {
    opacity: 0;
    transform: translateX(-130%);
  }

  36% {
    opacity: 0.84;
  }

  100% {
    opacity: 0;
    transform: translateX(130%);
  }
}

@keyframes clean-lane-badge-confirm {
  0% {
    opacity: 0;
    transform: translateX(-130%);
  }

  34% {
    opacity: 0.78;
  }

  100% {
    opacity: 0;
    transform: translateX(130%);
  }
}

.end-medals {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.end-card .end-medals span {
  position: relative;
  justify-self: stretch;
  overflow: hidden;
  min-height: 30px;
  padding: 7px 6px;
  border-radius: 8px;
  background: rgba(185, 246, 255, 0.07);
  color: rgba(244, 247, 248, 0.94);
  cursor: help;
  font-size: 10px;
  line-height: 1.15;
  box-shadow: 0 0 0 rgba(185, 246, 255, 0);
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, color 160ms ease;
  animation: end-medal-pop 520ms ease-out both;
}

.end-card .end-medals span::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  background: linear-gradient(110deg, transparent 0%, rgba(255, 255, 255, 0.2) 44%, transparent 74%);
  opacity: 0;
  pointer-events: none;
  transform: translateX(-130%);
}

.end-card .end-medals span:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
  box-shadow: 0 0 16px rgba(185, 246, 255, 0.18);
}

.end-card .end-medals span.is-selected {
  border-color: rgba(185, 246, 255, 0.66);
  background: rgba(185, 246, 255, 0.12);
  color: #f8fdff;
  box-shadow: 0 0 18px rgba(185, 246, 255, 0.2), inset 0 0 14px rgba(185, 246, 255, 0.08);
}

.end-card .end-medals span.is-selected::after {
  animation: end-moment-shine 680ms ease-out both;
}

.end-card .end-medals span:nth-child(2) {
  animation-delay: 55ms;
}

.end-card .end-medals span:nth-child(3) {
  animation-delay: 110ms;
}

.end-card .end-medals span:nth-child(4) {
  animation-delay: 165ms;
}

.end-card .end-medals.is-extracted span:first-child,
.end-card .end-medals.is-new-best span:last-child {
  border-color: rgba(141, 255, 177, 0.62);
  background: rgba(141, 255, 177, 0.13);
  color: #8dffb1;
  box-shadow: inset 0 0 18px rgba(141, 255, 177, 0.08), 0 0 16px rgba(141, 255, 177, 0.1);
}

.end-card .end-medals.is-continued span:nth-child(3),
.end-card .end-medals.is-matched-best span:last-child {
  border-color: rgba(242, 203, 87, 0.58);
  background: rgba(242, 203, 87, 0.14);
  color: var(--gold);
}

.end-card .end-medals.is-extracted:not(.is-continued) span:nth-child(3)::after {
  background: linear-gradient(110deg, transparent 0%, rgba(201, 255, 221, 0.34) 44%, transparent 74%);
  animation: clean-medal-route-gleam 720ms ease-out 150ms both;
}

.end-card .end-medals.is-continued span:nth-child(3)::after {
  background: linear-gradient(110deg, transparent 0%, rgba(255, 226, 128, 0.36) 44%, transparent 74%);
  animation: recovered-medal-route-gleam 760ms ease-out 150ms both;
}

@keyframes end-medal-pop {
  0% {
    opacity: 0;
    transform: translateY(6px) scale(0.96);
  }

  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes clean-medal-route-gleam {
  0% {
    opacity: 0;
    transform: translateX(-130%);
  }

  34% {
    opacity: 0.8;
  }

  100% {
    opacity: 0;
    transform: translateX(130%);
  }
}

@keyframes recovered-medal-route-gleam {
  0% {
    opacity: 0;
    transform: translateX(-130%);
  }

  38% {
    opacity: 0.86;
  }

  100% {
    opacity: 0;
    transform: translateX(130%);
  }
}

.end-card b {
  color: var(--blue);
  font-size: 22px;
}

.end-card #end-score {
  display: inline-block;
  min-width: 142px;
  color: #b9f6ff;
  text-shadow: 0 0 14px rgba(185, 246, 255, 0.2);
  transition: color 180ms ease, text-shadow 180ms ease, transform 180ms ease;
}

.end-card #end-score.is-counting {
  color: #fff1a6;
  text-shadow: 0 0 22px rgba(242, 203, 87, 0.36), 0 0 34px rgba(185, 246, 255, 0.16);
  animation: end-score-count-glow 620ms ease-out both;
}

@keyframes end-score-count-glow {
  0% {
    transform: scale(0.96);
  }

  48% {
    transform: scale(1.055);
  }

  100% {
    transform: scale(1);
  }
}

.end-card p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.end-highlights {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.end-highlights span {
  position: relative;
  display: grid;
  gap: 2px;
  overflow: hidden;
  min-height: 40px;
  padding: 7px 6px;
  border: 1px solid rgba(185, 246, 255, 0.18);
  border-radius: 8px;
  background: rgba(185, 246, 255, 0.055);
  cursor: help;
  text-align: left;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, color 160ms ease;
  animation: end-medal-pop 520ms ease-out both;
}

.end-highlights span::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  background: linear-gradient(110deg, transparent 0%, rgba(255, 255, 255, 0.18) 44%, transparent 74%);
  opacity: 0;
  pointer-events: none;
  transform: translateX(-130%);
}

.end-highlights span:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
  box-shadow: 0 0 16px rgba(185, 246, 255, 0.18);
}

.end-highlights span.is-selected {
  border-color: rgba(185, 246, 255, 0.62);
  background: rgba(185, 246, 255, 0.11);
  box-shadow: 0 0 18px rgba(185, 246, 255, 0.18), inset 0 0 14px rgba(185, 246, 255, 0.07);
}

.end-highlights span.is-selected::after {
  animation: end-moment-shine 680ms ease-out both;
}

.end-highlights span:nth-child(2) {
  animation-delay: 45ms;
}

.end-highlights span:nth-child(3) {
  animation-delay: 90ms;
}

.end-highlights span:nth-child(4) {
  animation-delay: 135ms;
}

.end-highlights small,
.end-highlights strong {
  overflow: hidden;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.end-highlights small {
  color: rgba(167, 180, 184, 0.92);
  font-size: 9px;
  font-weight: 900;
}

.end-highlights strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.1;
}

.end-highlights.is-extracted span:last-child,
.end-highlights.is-supplies-complete span:nth-child(3) {
  border-color: rgba(141, 255, 177, 0.46);
  background: rgba(141, 255, 177, 0.1);
}

.end-highlights.is-extracted span:last-child strong,
.end-highlights.is-supplies-complete span:nth-child(3) strong {
  color: #8dffb1;
}

.end-highlights.is-continued span:last-child {
  border-color: rgba(242, 203, 87, 0.5);
  background: rgba(242, 203, 87, 0.13);
}

.end-highlights.is-continued span:last-child strong {
  color: var(--gold);
}

.end-moments {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.end-moments span {
  position: relative;
  overflow: hidden;
  min-height: 28px;
  padding: 7px 6px;
  border: 1px solid rgba(242, 203, 87, 0.3);
  border-radius: 999px;
  background: rgba(242, 203, 87, 0.08);
  color: var(--gold);
  cursor: help;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.1;
  box-shadow: 0 0 0 rgba(242, 203, 87, 0);
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, color 160ms ease;
  animation: end-medal-pop 520ms ease-out both;
}

.end-moments span::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  background: linear-gradient(110deg, transparent 0%, rgba(255, 255, 255, 0.22) 45%, transparent 74%);
  opacity: 0;
  pointer-events: none;
  transform: translateX(-130%);
}

.end-moments span:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
  box-shadow: 0 0 16px rgba(185, 246, 255, 0.18);
}

.end-moments span.is-selected {
  border-color: rgba(185, 246, 255, 0.66);
  background: rgba(185, 246, 255, 0.12);
  color: #f8fdff;
  box-shadow: 0 0 18px rgba(185, 246, 255, 0.2), inset 0 0 14px rgba(185, 246, 255, 0.08);
}

.end-moments span.is-selected::after {
  animation: end-moment-shine 680ms ease-out both;
}

.end-moments span:nth-child(2) {
  animation-delay: 70ms;
}

.end-moments span:nth-child(3) {
  animation-delay: 140ms;
}

.end-moments.is-extracted span:first-child,
.end-moments.is-new-best span:last-child {
  border-color: rgba(141, 255, 177, 0.52);
  background: rgba(141, 255, 177, 0.11);
  color: #8dffb1;
}

.end-moments span.is-pilot-secured {
  border-color: rgba(141, 255, 177, 0.72);
  background: linear-gradient(135deg, rgba(141, 255, 177, 0.19), rgba(242, 203, 87, 0.12));
  color: #eaffef;
  box-shadow: 0 0 18px rgba(141, 255, 177, 0.2), inset 0 0 12px rgba(242, 203, 87, 0.08);
}

.end-moments span.is-pilot-secured::after {
  animation: end-moment-shine 760ms ease-out 160ms both;
}

.end-card .end-pilot-voice {
  margin-top: -2px;
  padding: 6px 9px;
  border: 1px solid rgba(141, 255, 177, 0.26);
  border-radius: 8px;
  background: rgba(141, 255, 177, 0.06);
  color: rgba(232, 255, 240, 0.94);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.25;
  text-align: left;
  text-transform: uppercase;
}

.end-card .end-pilot-voice.is-active {
  animation: pilot-secured-voice-pulse 920ms ease-out both;
}

.end-card .end-secured-route {
  display: grid;
  grid-template-columns: auto minmax(54px, 1fr) auto auto;
  align-items: center;
  gap: 7px;
  margin-top: -3px;
  padding: 5px 8px;
  border: 1px solid rgba(141, 255, 177, 0.22);
  border-radius: 999px;
  background: rgba(5, 20, 20, 0.42);
  color: rgba(232, 255, 240, 0.86);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
}

.end-card .end-secured-route em {
  --route-grade-bg: rgba(242, 203, 87, 0.07);
  --route-grade-border: rgba(242, 203, 87, 0.34);
  --route-grade-border-soft: rgba(242, 203, 87, 0.2);
  --route-grade-border-peak: rgba(255, 241, 166, 0.82);
  --route-grade-color: #fff1a6;
  --route-grade-glow: rgba(242, 203, 87, 0.34);
  --route-grade-glow-soft: rgba(242, 203, 87, 0.1);
  --route-grade-inset: rgba(255, 241, 166, 0.14);
  --route-grade-pip: #fff1a6;
  position: relative;
  display: inline-block;
  overflow: hidden;
  padding: 3px 6px 3px 15px;
  border: 1px solid var(--route-grade-border);
  border-radius: 999px;
  background: var(--route-grade-bg);
  color: var(--route-grade-color);
  font-style: normal;
  white-space: nowrap;
}

.end-card .end-secured-route em::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 6px;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: var(--route-grade-pip);
  box-shadow: 0 0 8px var(--route-grade-glow);
  transform: translateY(-50%);
}

.end-card .end-secured-route em::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(105deg, transparent 18%, rgba(255, 255, 255, 0.34) 45%, transparent 72%);
  opacity: 0;
  transform: translateX(-130%);
}

.end-card .end-secured-route em.is-route-clean {
  --route-grade-bg: rgba(141, 255, 177, 0.085);
  --route-grade-border: rgba(141, 255, 177, 0.42);
  --route-grade-border-soft: rgba(141, 255, 177, 0.22);
  --route-grade-border-peak: rgba(201, 255, 221, 0.84);
  --route-grade-color: #d9ffe6;
  --route-grade-glow: rgba(141, 255, 177, 0.28);
  --route-grade-glow-soft: rgba(141, 255, 177, 0.12);
  --route-grade-inset: rgba(201, 255, 221, 0.16);
  --route-grade-pip: #8dffb1;
}

.end-card .end-secured-route em.is-route-recovered {
  --route-grade-bg: rgba(242, 203, 87, 0.11);
  --route-grade-border: rgba(242, 203, 87, 0.5);
  --route-grade-border-soft: rgba(242, 203, 87, 0.26);
  --route-grade-border-peak: rgba(255, 226, 128, 0.9);
  --route-grade-color: #ffe08d;
  --route-grade-glow: rgba(242, 203, 87, 0.36);
  --route-grade-glow-soft: rgba(242, 203, 87, 0.14);
  --route-grade-inset: rgba(255, 226, 128, 0.18);
  --route-grade-pip: #f2cb57;
}

.end-card .end-secured-route em[data-pad-status="fallback"] {
  --route-grade-border-soft: rgba(185, 246, 255, 0.34);
  --route-grade-glow: rgba(185, 246, 255, 0.24);
  --route-grade-pip: #b9f6ff;
}

.end-card .end-secured-route em[data-pad-status="off"],
.end-card .end-secured-route em[data-pad-status="failed"] {
  --route-grade-border-soft: rgba(255, 126, 126, 0.32);
  --route-grade-glow: rgba(255, 126, 126, 0.18);
  --route-grade-pip: #ffb0a6;
}

.end-card .end-secured-route.is-active em {
  animation: end-route-grade-pulse 820ms ease-out 220ms both;
}

.end-card .end-secured-route.is-active em::after {
  animation: end-route-grade-sheen 700ms ease-out 330ms both;
}

.end-card .end-secured-route.is-active em::before {
  animation: end-route-grade-pip-stamp 620ms ease-out 230ms both;
}

.end-card .end-secured-route i {
  position: relative;
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(141, 255, 177, 0.18), rgba(242, 203, 87, 0.6), rgba(141, 255, 177, 0.26));
}

.end-card .end-secured-route i::after {
  content: "";
  position: absolute;
  inset: -1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.82), transparent);
  transform: translateX(-120%);
}

.end-card .end-secured-route.is-active i::after {
  animation: secured-route-trace 980ms ease-out 120ms both;
}

.end-moments.is-continued span:first-child {
  border-color: rgba(242, 203, 87, 0.56);
  background: rgba(242, 203, 87, 0.14);
  color: var(--gold);
}

@keyframes end-moment-shine {
  0% {
    opacity: 0;
    transform: translateX(-130%);
  }

  24% {
    opacity: 0.9;
  }

  100% {
    opacity: 0;
    transform: translateX(130%);
  }
}

@keyframes pilot-secured-voice-pulse {
  0% {
    border-color: rgba(141, 255, 177, 0.14);
    box-shadow: 0 0 0 rgba(141, 255, 177, 0);
    transform: translateY(2px);
  }

  38% {
    border-color: rgba(141, 255, 177, 0.62);
    box-shadow: 0 0 18px rgba(141, 255, 177, 0.18);
    transform: translateY(0);
  }

  100% {
    border-color: rgba(141, 255, 177, 0.26);
    box-shadow: 0 0 0 rgba(141, 255, 177, 0);
    transform: translateY(0);
  }
}

@keyframes secured-route-trace {
  0% {
    opacity: 0;
    transform: translateX(-120%);
  }

  28% {
    opacity: 0.92;
  }

  100% {
    opacity: 0;
    transform: translateX(120%);
  }
}

@keyframes end-route-grade-pulse {
  0% {
    border-color: var(--route-grade-border-soft);
    box-shadow: 0 0 0 rgba(242, 203, 87, 0);
    filter: brightness(0.92);
    transform: scale(0.94);
  }

  42% {
    border-color: var(--route-grade-border-peak);
    box-shadow: 0 0 18px var(--route-grade-glow), inset 0 0 10px var(--route-grade-inset);
    filter: brightness(1.24);
    transform: scale(1.08);
  }

  100% {
    border-color: var(--route-grade-border);
    box-shadow: 0 0 8px var(--route-grade-glow-soft);
    filter: brightness(1);
    transform: scale(1);
  }
}

@keyframes end-route-grade-sheen {
  0% {
    opacity: 0;
    transform: translateX(-130%);
  }

  35% {
    opacity: 0.82;
  }

  100% {
    opacity: 0;
    transform: translateX(130%);
  }
}

@keyframes end-route-grade-pip-stamp {
  0% {
    box-shadow: 0 0 0 var(--route-grade-glow);
    transform: translateY(-50%) scale(0.82);
  }

  36% {
    box-shadow: 0 0 14px var(--route-grade-glow), 0 0 0 5px rgba(185, 246, 255, 0.08);
    transform: translateY(-50%) scale(1.35);
  }

  100% {
    box-shadow: 0 0 8px var(--route-grade-glow);
    transform: translateY(-50%) scale(1);
  }
}

.end-card .end-moment-detail {
  margin-top: -2px;
  padding: 7px 9px;
  border: 1px solid rgba(185, 246, 255, 0.16);
  border-radius: 8px;
  background: rgba(185, 246, 255, 0.045);
  color: rgba(185, 246, 255, 0.82);
  font-size: 11px;
  line-height: 1.25;
  text-align: left;
}

.end-breakdown {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 2px;
}

.end-breakdown span {
  position: relative;
  display: grid;
  gap: 2px;
  justify-self: stretch;
  overflow: hidden;
  padding: 7px 8px;
  border: 1px solid rgba(244, 247, 248, 0.12);
  border-radius: 8px;
  background: rgba(244, 247, 248, 0.055);
  cursor: help;
  box-shadow: 0 0 0 rgba(185, 246, 255, 0);
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
  animation: end-medal-pop 520ms ease-out both;
}

.end-breakdown span::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  background: linear-gradient(110deg, transparent 0%, rgba(255, 255, 255, 0.2) 45%, transparent 74%);
  opacity: 0;
  pointer-events: none;
  transform: translateX(-130%);
}

.end-breakdown span:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
  box-shadow: 0 0 16px rgba(185, 246, 255, 0.18);
}

.end-breakdown span.is-selected {
  border-color: rgba(185, 246, 255, 0.56);
  background: rgba(185, 246, 255, 0.11);
  box-shadow: 0 0 18px rgba(185, 246, 255, 0.16), inset 0 0 14px rgba(185, 246, 255, 0.07);
}

.end-breakdown span.is-selected::after {
  animation: end-moment-shine 680ms ease-out both;
}

.end-breakdown span:nth-child(2),
.end-breakdown span:nth-child(5) {
  animation-delay: 45ms;
}

.end-breakdown span:nth-child(3),
.end-breakdown span:nth-child(6) {
  animation-delay: 90ms;
}

.end-breakdown small {
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.end-breakdown strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.end-card .end-score-formula {
  margin-top: -1px;
  padding: 7px 9px;
  border: 1px solid rgba(242, 203, 87, 0.18);
  border-radius: 8px;
  background: rgba(242, 203, 87, 0.055);
  color: rgba(255, 241, 166, 0.86);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.25;
  text-align: left;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.end-card .end-run-coach {
  margin-top: -2px;
  padding-top: 7px;
  border-top: 1px solid rgba(185, 246, 255, 0.14);
  display: grid;
  gap: 6px;
}

.end-card .end-score-debrief,
.end-card .end-next-tip,
.end-card .end-loadout-tip {
  margin: 0;
  padding: 0 0 0 9px;
  border-left: 3px solid rgba(185, 246, 255, 0.52);
  color: rgba(244, 247, 248, 0.88);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.28;
  text-align: left;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.end-card .end-next-tip {
  border-left-color: rgba(141, 255, 177, 0.56);
  color: rgba(196, 255, 214, 0.9);
}

.end-card .end-score-debrief.is-route-clean {
  border-left-color: rgba(141, 255, 177, 0.76);
  color: rgba(225, 255, 235, 0.94);
}

.end-card .end-score-debrief.is-route-recovered {
  border-left-color: rgba(242, 203, 87, 0.74);
  color: rgba(255, 241, 166, 0.92);
}

.end-card .end-loadout-tip {
  border-left-color: rgba(242, 203, 87, 0.58);
  color: rgba(255, 241, 166, 0.88);
}

.end-card .end-loadout-chips {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.end-card .end-loadout-chips span {
  position: relative;
  min-height: 42px;
  padding: 6px 7px;
  border: 1px solid rgba(242, 203, 87, 0.18);
  border-radius: 7px;
  background: rgba(242, 203, 87, 0.052);
  display: grid;
  align-content: center;
  gap: 2px;
  cursor: help;
  text-align: left;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
  overflow: hidden;
}

.end-card .end-loadout-chips span::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 0%, rgba(242, 203, 87, 0.13) 42%, transparent 74%);
  opacity: 0;
  pointer-events: none;
}

.end-card .end-loadout-chips span:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}

.end-card .end-loadout-chips span.is-selected {
  border-color: rgba(255, 241, 166, 0.58);
  box-shadow: 0 0 16px rgba(242, 203, 87, 0.18);
  transform: translateY(-1px);
}

.end-card .end-loadout-chips span.is-selected::after {
  animation: end-moment-shine 620ms ease-out both;
}

.end-card .end-run-coach.is-kit-preview .end-loadout-tip {
  border-left-color: rgba(185, 246, 255, 0.66);
  color: rgba(185, 246, 255, 0.94);
}

.end-card .end-loadout-chips.is-kit-preview span {
  border-color: rgba(185, 246, 255, 0.38);
  background: rgba(185, 246, 255, 0.075);
  box-shadow: 0 0 14px rgba(185, 246, 255, 0.12);
}

.end-card .end-loadout-chips.is-kit-preview span::after {
  animation: end-moment-shine 760ms ease-out both;
}

.end-card .end-run-coach.is-kit-committed .end-loadout-tip {
  border-left-color: rgba(141, 255, 177, 0.72);
  color: rgba(214, 255, 226, 0.96);
}

.end-card .end-loadout-chips.is-kit-committed span {
  border-color: rgba(141, 255, 177, 0.42);
  background: rgba(141, 255, 177, 0.075);
  box-shadow: 0 0 16px rgba(141, 255, 177, 0.15);
}

.end-card .end-loadout-chips.is-kit-committed span::after {
  animation: end-kit-commit-flash 860ms ease-out both;
}

.end-card .end-loadout-chips small,
.end-card .end-loadout-chips strong {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.end-card .end-loadout-chips small {
  color: rgba(185, 246, 255, 0.72);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.end-card .end-loadout-chips strong {
  color: rgba(255, 241, 166, 0.94);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.15;
  text-transform: uppercase;
}

.end-card .end-kit-picker {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.end-card .end-kit-picker button {
  position: relative;
  display: grid;
  gap: 2px;
  overflow: hidden;
  min-height: 44px;
  padding: 7px 8px;
  border: 1px solid rgba(185, 246, 255, 0.2);
  border-radius: 7px;
  background: rgba(185, 246, 255, 0.052);
  color: rgba(244, 247, 248, 0.9);
  cursor: pointer;
  text-align: left;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.end-card .end-kit-picker button::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 0%, rgba(255, 241, 166, 0.16) 42%, transparent 74%);
  opacity: 0;
  pointer-events: none;
}

.end-card .end-kit-picker button:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}

.end-card .end-kit-picker button:hover {
  border-color: rgba(185, 246, 255, 0.42);
  background: rgba(185, 246, 255, 0.085);
}

.end-card .end-kit-picker button.is-selected {
  border-color: rgba(255, 241, 166, 0.64);
  background: rgba(242, 203, 87, 0.11);
  box-shadow: 0 0 17px rgba(242, 203, 87, 0.18), inset 0 0 14px rgba(242, 203, 87, 0.07);
  transform: translateY(-1px);
}

.end-card .end-kit-picker button.is-selected::after {
  animation: end-moment-shine 620ms ease-out both;
}

.end-card .end-kit-picker button.is-committed {
  border-color: rgba(141, 255, 177, 0.74);
  background: rgba(141, 255, 177, 0.12);
  box-shadow: 0 0 22px rgba(141, 255, 177, 0.2), inset 0 0 16px rgba(141, 255, 177, 0.08);
  transform: translateY(-2px) scale(1.01);
}

.end-card .end-kit-picker button.is-committed::after {
  animation: end-kit-commit-flash 860ms ease-out both;
}

.end-card .end-kit-picker button.is-previewed:not(.is-selected) {
  border-color: rgba(185, 246, 255, 0.58);
  background: rgba(185, 246, 255, 0.1);
  box-shadow: 0 0 16px rgba(185, 246, 255, 0.16), inset 0 0 12px rgba(185, 246, 255, 0.06);
  transform: translateY(-1px);
}

.end-card .end-kit-picker button.is-previewed::after {
  animation: end-moment-shine 760ms ease-out both;
}

.end-card .end-kit-picker strong,
.end-card .end-kit-picker small {
  display: block;
  min-width: 0;
  overflow: hidden;
  letter-spacing: 0;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.end-card .end-kit-picker strong {
  color: rgba(244, 247, 248, 0.94);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.1;
}

.end-card .end-kit-picker small {
  color: rgba(185, 246, 255, 0.76);
  font-size: 8px;
  font-weight: 900;
  line-height: 1.15;
  overflow-wrap: anywhere;
  text-overflow: clip;
  white-space: normal;
}

.end-card .end-kit-picker button.is-selected small {
  color: rgba(255, 241, 166, 0.95);
}

@keyframes end-kit-commit-flash {
  0% {
    opacity: 0;
    transform: translateX(-110%);
  }
  26% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translateX(110%);
  }
}

.end-card em {
  color: var(--gold);
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}

.end-card .end-best-delta {
  margin-top: -3px;
  color: rgba(185, 246, 255, 0.82);
  font-size: 11px;
}

.end-card .end-best-delta.is-ahead {
  color: #8dffb1;
}

.end-card .end-best-delta.is-matched {
  color: var(--gold);
}

.end-card .end-best-delta.is-short {
  color: rgba(167, 180, 184, 0.9);
}

.end-best-meter {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  overflow: hidden;
  min-height: 34px;
  padding: 7px 9px 8px;
  border: 1px solid rgba(185, 246, 255, 0.2);
  border-radius: 8px;
  background: rgba(244, 247, 248, 0.055);
  text-align: left;
}

.end-best-meter span,
.end-best-meter b {
  position: relative;
  z-index: 1;
  overflow: hidden;
  font-size: 10px;
  font-weight: 900;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.end-best-meter span {
  color: rgba(185, 246, 255, 0.82);
}

.end-best-meter b {
  color: var(--gold);
}

.end-best-meter i {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 4px;
  width: 4%;
  border-radius: 0 999px 999px 0;
  background: linear-gradient(90deg, rgba(185, 246, 255, 0.72), rgba(242, 203, 87, 0.94));
  box-shadow: 0 0 14px rgba(242, 203, 87, 0.18);
  transition: width 520ms ease-out;
}

.end-best-meter.is-new-best {
  border-color: rgba(141, 255, 177, 0.5);
  background: rgba(141, 255, 177, 0.09);
}

.end-best-meter.is-new-best b,
.end-best-meter.is-matched b,
.end-best-meter.is-first b {
  color: #8dffb1;
}

.end-best-meter.is-new-best i,
.end-best-meter.is-first i {
  background: linear-gradient(90deg, rgba(141, 255, 177, 0.74), rgba(255, 241, 166, 0.96));
}

.share-code {
  display: block;
  overflow-wrap: anywhere;
  padding: 9px 10px;
  border: 1px solid rgba(185, 246, 255, 0.28);
  border-radius: 8px;
  background: rgba(185, 246, 255, 0.07);
  color: var(--gold);
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.3;
  user-select: text;
}

.feedback-notes,
.feedback-tester {
  display: grid;
  gap: 5px;
  text-align: left;
}

.feedback-notes small,
.feedback-tester small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
}

.feedback-tester input,
.feedback-notes textarea {
  width: 100%;
  border: 1px solid rgba(244, 247, 248, 0.18);
  border-radius: 8px;
  background: rgba(244, 247, 248, 0.08);
  color: var(--ink);
  font: 800 12px/1.35 Inter, "Segoe UI", Arial, sans-serif;
  padding: 8px 10px;
}

.feedback-notes textarea {
  min-height: 58px;
  resize: vertical;
}

.feedback-checklist {
  margin: -2px 0 0;
  color: rgba(244, 247, 248, 0.72);
  font-size: 10px;
  font-weight: 850;
  line-height: 1.35;
  text-transform: uppercase;
}

.feedback-checklist strong {
  color: #b9f6ff;
}

.feedback-tags {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
}

.feedback-tags button {
  min-height: 26px;
  padding: 0 9px;
  border: 1px solid rgba(185, 246, 255, 0.28);
  border-radius: 8px;
  background: rgba(185, 246, 255, 0.08);
  color: rgba(185, 246, 255, 0.88);
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
}

.feedback-tags button.is-selected {
  border-color: rgba(141, 255, 177, 0.58);
  background: rgba(141, 255, 177, 0.2);
  color: #8dffb1;
}

.feedback-tester input::placeholder,
.feedback-notes textarea::placeholder {
  color: rgba(167, 180, 184, 0.78);
}

.share-actions,
.end-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}

.end-kit-armed {
  position: relative;
  display: grid;
  gap: 2px;
  overflow: hidden;
  width: min(100%, 420px);
  margin: 0 auto -2px;
  padding: 7px 10px;
  border: 1px solid rgba(141, 255, 177, 0.28);
  border-radius: 7px;
  background: linear-gradient(90deg, rgba(141, 255, 177, 0.08), rgba(185, 246, 255, 0.055));
  box-shadow: inset 0 0 18px rgba(141, 255, 177, 0.045);
  text-align: left;
}

.end-kit-armed::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 0%, rgba(141, 255, 177, 0.18) 42%, transparent 74%);
  opacity: 0;
  pointer-events: none;
}

.end-kit-armed.is-committed {
  border-color: rgba(141, 255, 177, 0.64);
  box-shadow: 0 0 20px rgba(141, 255, 177, 0.16), inset 0 0 18px rgba(141, 255, 177, 0.08);
}

.end-kit-armed.is-committed::after {
  animation: end-kit-commit-flash 860ms ease-out both;
}

.end-kit-armed small,
.end-kit-armed strong {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  letter-spacing: 0;
  text-transform: uppercase;
}

.end-kit-armed small {
  color: rgba(141, 255, 177, 0.9);
  font-size: 8px;
  font-weight: 950;
}

.end-kit-armed strong {
  color: rgba(255, 241, 166, 0.96);
  font-size: 10px;
  font-weight: 950;
  line-height: 1.18;
}

.end-kit-action-hint {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  width: min(100%, 420px);
  margin: -4px auto 0;
}

.end-kit-action-hint span {
  min-width: 0;
  padding: 6px 7px;
  border: 1px solid rgba(185, 246, 255, 0.18);
  border-radius: 7px;
  background: rgba(8, 21, 26, 0.42);
  color: rgba(210, 227, 231, 0.82);
  font-size: 8px;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: 0;
  overflow-wrap: anywhere;
  text-align: left;
  text-transform: uppercase;
}

.end-kit-action-hint span:first-child {
  border-color: rgba(242, 203, 87, 0.32);
  color: rgba(255, 241, 166, 0.9);
}

.end-kit-action-hint.is-run-again {
  grid-template-columns: 1fr;
}

.end-kit-action-hint.is-run-again span:first-child {
  border-color: rgba(141, 255, 177, 0.36);
  color: rgba(214, 255, 226, 0.92);
}

.end-kit-action-hint.is-run-again span:last-child {
  border-color: rgba(185, 246, 255, 0.16);
  color: rgba(185, 246, 255, 0.78);
}

.end-recovery-pressure {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px 10px;
  width: min(100%, 420px);
  margin: -2px auto 2px;
  padding: 6px 9px;
  border: 1px solid rgba(242, 203, 87, 0.25);
  border-radius: 7px;
  background: linear-gradient(90deg, rgba(242, 203, 87, 0.105), rgba(255, 120, 74, 0.055));
  box-shadow: inset 0 0 18px rgba(242, 203, 87, 0.045);
  text-align: left;
}

.end-recovery-pressure span,
.end-recovery-pressure strong,
.end-recovery-pressure small {
  min-width: 0;
  letter-spacing: 0;
  overflow-wrap: anywhere;
  text-transform: uppercase;
}

.end-recovery-pressure span {
  color: rgba(255, 241, 166, 0.88);
  font-size: 8px;
  font-weight: 950;
}

.end-recovery-pressure strong {
  justify-self: end;
  color: rgba(255, 241, 166, 0.98);
  font-size: 13px;
  font-weight: 950;
  line-height: 1;
  text-shadow: 0 0 12px rgba(242, 203, 87, 0.3);
}

.end-recovery-pressure small {
  grid-column: 1 / -1;
  color: rgba(210, 227, 231, 0.75);
  font-size: 8px;
  font-weight: 850;
  line-height: 1.18;
}

.end-recovery-pressure.is-urgent {
  border-color: rgba(255, 120, 74, 0.58);
  background: linear-gradient(90deg, rgba(255, 120, 74, 0.17), rgba(242, 203, 87, 0.08));
  box-shadow: 0 0 18px rgba(255, 120, 74, 0.12), inset 0 0 18px rgba(255, 120, 74, 0.075);
}

.end-recovery-pressure.is-urgent strong {
  color: rgba(255, 188, 132, 0.98);
}

.end-recovery-pressure.is-holding {
  border-color: rgba(185, 246, 255, 0.36);
  background: linear-gradient(90deg, rgba(185, 246, 255, 0.08), rgba(141, 255, 177, 0.055));
  box-shadow: 0 0 16px rgba(185, 246, 255, 0.1), inset 0 0 18px rgba(141, 255, 177, 0.06);
  animation: recovery-hold-breathe 2.4s ease-in-out infinite;
}

.end-recovery-pressure.is-holding span,
.end-recovery-pressure.is-holding strong {
  color: rgba(214, 255, 226, 0.96);
}

.end-recovery-pressure.is-path-continue,
.end-recovery-pressure.is-path-restart {
  animation: comeback-path-flash 620ms ease-out both;
}

.end-recovery-pressure.is-path-continue {
  border-color: rgba(242, 203, 87, 0.68);
  background: linear-gradient(90deg, rgba(242, 203, 87, 0.18), rgba(141, 255, 177, 0.08));
}

.end-recovery-pressure.is-path-restart {
  border-color: rgba(185, 246, 255, 0.62);
  background: linear-gradient(90deg, rgba(185, 246, 255, 0.15), rgba(141, 255, 177, 0.07));
}

.end-recovery-pressure.is-run-again {
  border-color: rgba(141, 255, 177, 0.32);
  background: linear-gradient(90deg, rgba(141, 255, 177, 0.1), rgba(185, 246, 255, 0.05));
}

.end-recovery-pressure.is-run-again strong {
  color: rgba(214, 255, 226, 0.96);
}

@keyframes recovery-hold-breathe {
  0%, 100% {
    box-shadow: 0 0 12px rgba(185, 246, 255, 0.08), inset 0 0 18px rgba(141, 255, 177, 0.05);
  }
  50% {
    box-shadow: 0 0 22px rgba(141, 255, 177, 0.14), inset 0 0 22px rgba(185, 246, 255, 0.08);
  }
}

.end-actions .share-copy.is-path-selected {
  box-shadow: 0 0 20px rgba(242, 203, 87, 0.28);
  transform: translateY(-1px);
}

.end-actions .share-copy:not(.primary-action).is-path-selected {
  border-color: rgba(185, 246, 255, 0.5);
  box-shadow: 0 0 18px rgba(185, 246, 255, 0.2);
}

.end-actions .share-copy.is-clean-extract-action {
  border-color: rgba(141, 255, 177, 0.54);
  background: linear-gradient(90deg, rgba(141, 255, 177, 0.96), rgba(185, 246, 255, 0.86));
  color: #071114;
  box-shadow: 0 0 20px rgba(141, 255, 177, 0.24), inset 0 0 12px rgba(255, 255, 255, 0.18);
  animation: clean-extraction-action-ready 900ms ease-out 160ms both;
}

@keyframes clean-extraction-action-ready {
  0% {
    filter: brightness(0.96);
    transform: translateY(1px) scale(0.98);
  }

  48% {
    filter: brightness(1.12);
    transform: translateY(-1px) scale(1.035);
  }

  100% {
    filter: brightness(1);
    transform: translateY(0) scale(1);
  }
}

@keyframes comeback-path-flash {
  0% {
    filter: brightness(1.28);
    transform: scale(1.012);
  }
  100% {
    filter: brightness(1);
    transform: scale(1);
  }
}

.end-actions .share-copy {
  min-width: 150px;
}

.end-actions .primary-action {
  background: var(--gold);
  color: #151515;
}

.end-actions .hidden {
  display: none;
}

.feedback-queue-status {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  align-items: center;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
}

.feedback-queue-status span {
  color: #b9f6ff;
  font-size: 11px;
  font-weight: 900;
}

.feedback-queue-status .share-copy {
  min-height: 28px;
  border-color: rgba(185, 246, 255, 0.34);
  background: rgba(185, 246, 255, 0.08);
  color: #b9f6ff;
}

.feedback-queue-status .share-copy:disabled {
  border-color: rgba(167, 180, 184, 0.2);
  background: rgba(167, 180, 184, 0.07);
  color: rgba(167, 180, 184, 0.64);
  cursor: not-allowed;
}

.feedback-pending-status {
  margin: -4px 0 0;
  color: rgba(185, 246, 255, 0.78);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.3;
  text-transform: uppercase;
}

.feedback-pending-status.is-alert {
  color: #ffd36d;
  text-shadow: 0 0 10px rgba(255, 211, 109, 0.25);
}

.feedback-pending-status.is-clear {
  color: rgba(141, 255, 177, 0.82);
}

.feedback-handoff-time {
  margin: -5px 0 0;
  color: rgba(167, 180, 184, 0.82);
  font-size: 10px;
  font-weight: 850;
  line-height: 1.3;
  text-transform: uppercase;
}

.feedback-helper-note {
  margin: -2px 0 0;
  color: rgba(185, 246, 255, 0.78);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.35;
}

.share-copy {
  display: grid;
  justify-self: center;
  min-height: 34px;
  place-items: center;
  padding: 0 12px;
  border: 1px solid rgba(242, 203, 87, 0.48);
  border-radius: 8px;
  background: rgba(242, 203, 87, 0.16);
  color: var(--gold);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  text-decoration: none;
  cursor: pointer;
}

.share-copy:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 3px;
}

@media (max-width: 720px) {
  .menu-card,
  .help-grid,
  .setting-row,
  .settings-controls-head,
  .controls-filter,
  .control-row {
    grid-template-columns: 1fr;
  }

  .best-score-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .end-highlights {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .end-moments {
    grid-template-columns: 1fr;
  }

  .hud-card {
    min-width: 72px;
  }

  .hud-card.flight-card {
    min-width: 188px;
  }

  .hud-card.boss-threat {
    min-width: 154px;
  }

  .hud-card.boss-phase {
    min-width: 148px;
  }

  .boss-compass-cue {
    top: calc(50% - 50px);
    min-width: 102px;
    font-size: 10px;
  }

  #crosshair.is-boss-air-slice,
  #crosshair.is-boss-air-slice-dodge-read {
    width: 20px;
    height: 20px;
  }

  #crosshair.is-boss-air-slice::before,
  #crosshair.is-boss-air-slice-dodge-read::before {
    left: 9px;
    height: 20px;
  }

  #crosshair.is-boss-air-slice::after,
  #crosshair.is-boss-air-slice-dodge-read::after {
    top: 9px;
    width: 20px;
  }

  #crosshair.is-boss-air-slice,
  #crosshair.is-boss-damage-warning.is-boss-air-slice {
    filter:
      drop-shadow(0 0 var(--boss-air-slice-reticle-glow-size, 13px) rgba(var(--boss-air-slice-rgb, 217, 165, 255), 0.82))
      drop-shadow(0 0 var(--boss-air-slice-reticle-beat-glow-size, 24px) rgba(var(--boss-air-slice-hot-rgb, 96, 210, 255), 0.34));
  }

  #crosshair.is-boss-air-slice-dodge-read,
  #crosshair.is-boss-damage-warning.is-boss-air-slice-dodge-read {
    filter:
      drop-shadow(0 0 13px rgba(var(--boss-air-slice-hot-rgb, 96, 210, 255), 0.74))
      drop-shadow(0 0 27px rgba(var(--boss-air-slice-rgb, 217, 165, 255), 0.34));
  }

  #crosshair.is-boss-air-slice-dodge-read::before,
  #crosshair.is-boss-air-slice-dodge-read::after,
  #crosshair.is-boss-damage-warning.is-boss-air-slice-dodge-read::before,
  #crosshair.is-boss-damage-warning.is-boss-air-slice-dodge-read::after {
    box-shadow:
      var(--crosshair-glow, 0 0 8px rgba(185, 246, 255, 0.42)),
      0 0 var(--boss-air-slice-dodge-glow-size, 16px) rgba(var(--boss-air-slice-hot-rgb, 96, 210, 255), var(--boss-air-slice-dodge-alpha, 0)),
      0 0 var(--boss-air-slice-dodge-soft-glow-size, 30px) rgba(var(--boss-air-slice-rgb, 217, 165, 255), var(--boss-air-slice-dodge-soft-alpha, 0));
  }

  .boss-break-flash {
    top: calc(50% - 112px);
    min-width: 194px;
    padding-inline: 12px;
  }

  .boss-break-flash b {
    font-size: 15px;
  }

  .boss-finisher-flash {
    top: calc(50% + 58px);
    min-width: 166px;
    padding-inline: 11px;
  }

  .boss-finisher-flash b {
    font-size: 13px;
  }

  .perf-toggle {
    right: 10px;
    bottom: 10px;
  }

  #perf-snapshot {
    left: 10px;
    right: 10px;
    bottom: 56px;
    width: auto;
  }

  #perf-snapshot dl {
    grid-template-columns: 1fr;
  }
}

@media (max-height: 560px) {
  .boss-compass-cue {
    top: calc(50% - 40px);
    min-width: 96px;
    height: 22px;
    gap: 6px;
    padding: 0 9px;
    font-size: 10px;
  }

  .boss-compass-cue i {
    border-right-width: 4px;
    border-bottom-width: 8px;
    border-left-width: 4px;
  }

  .boss-break-flash {
    --boss-break-line: 24px;
    --boss-break-glow: 14px;
    --boss-break-glow-wide: 22px;
    top: calc(50% - 92px);
    min-width: 190px;
    gap: 4px;
    padding: 7px 12px 8px;
  }

  .boss-break-flash b {
    font-size: 15px;
  }

  .boss-break-flash span {
    font-size: 9px;
  }

  .boss-finisher-flash {
    --boss-finisher-line: 18px;
    --boss-finisher-glow: 14px;
    --boss-finisher-glow-wide: 24px;
    top: calc(50% + 48px);
    min-width: 166px;
    padding: 6px 11px 7px;
  }

  .boss-finisher-flash b {
    font-size: 13px;
  }
}