@import "./styles-foundation.css";
@import "./styles-game-classic.css";
@import "./styles-popups.css";
@import "./styles-auth-faction.css";
@import "./styles-game-redesign.css";
@import "./styles-building-modals.css?v=building-special-actions-20260730-1";
@import "./styles-alliance.css";
@import "./styles-city-events.css";
@import "./styles-bounty.css?v=bounty-align-20260804-1";
@import "./styles-boost.css";
@import "./styles-onboarding.css";
@import "./styles-district.css?v=spy-intel-overlay-20260805-1";
@import "./styles-action-results.css";
@import "./styles-mobile-fixes.css";
@import "./styles-static-hover.css";
@import "./styles-market.css";

html body .buildings-popup__type-btn.is-locked,
html body .buildings-popup__type-btn.is-locked:hover,
html body .buildings-popup__type-btn:disabled {
  cursor: not-allowed !important;
  transform: none !important;
  border-color: rgba(148, 163, 184, 0.18) !important;
  background:
    linear-gradient(135deg, rgba(31, 41, 55, 0.72), rgba(15, 23, 42, 0.86)),
    rgba(15, 23, 42, 0.82) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025) !important;
  color: #94a3b8 !important;
  opacity: 0.6 !important;
  filter: grayscale(0.85) !important;
}

html body .buildings-popup__type-btn.is-locked::before,
html body .buildings-popup__type-btn:disabled::before {
  opacity: 0.18 !important;
}

html body .buildings-popup__type-btn.is-locked .buildings-popup__type-label,
html body .buildings-popup__type-btn.is-locked .buildings-popup__type-meta,
html body .buildings-popup__type-btn:disabled .buildings-popup__type-label,
html body .buildings-popup__type-btn:disabled .buildings-popup__type-meta {
  color: #a8b3c2 !important;
  text-shadow: none !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__mobile-type-caption {
  display: none !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content > .modal__header > h3 {
  display: none !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__detail-title {
  display: none !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-active,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-active:hover,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.buildings-popup__building--interactive:hover {
  border-style: solid !important;
  border-color: color-mix(in srgb, var(--buildings-type-border-hover, rgba(250, 204, 21, 0.72)) 78%, rgba(255, 255, 255, 0.2)) !important;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--buildings-type-glow, rgba(250, 204, 21, 0.2)) 48%, transparent), transparent 48%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.012)),
    rgba(5, 10, 18, 0.92) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.045),
    inset 0 0 18px color-mix(in srgb, var(--buildings-type-glow, rgba(250, 204, 21, 0.16)) 42%, transparent),
    0 0 18px color-mix(in srgb, var(--buildings-type-glow, rgba(250, 204, 21, 0.18)) 72%, transparent) !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type:hover,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type:focus-visible {
  border-style: solid !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-apartment-full,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-apartment-full:hover,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-apartment-full:focus-visible,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-clinic-stabilization-ready,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-clinic-stabilization-ready:hover,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-clinic-stabilization-ready:focus-visible,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-school-full,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-school-full:hover,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-school-full:focus-visible,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-convenience-store-full,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-convenience-store-full:hover,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-convenience-store-full:focus-visible {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  border-color: var(--buildings-type-border-hover, rgba(34, 211, 238, 0.72)) !important;
  background:
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)) 34%, transparent), transparent 62%),
    linear-gradient(180deg, color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.2)) 74%, rgba(255, 255, 255, 0.006)), rgba(255, 255, 255, 0.006)),
    linear-gradient(90deg, color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.18)) 100%, transparent), rgba(2, 6, 13, 0.98)) !important;
  box-shadow:
    inset 2px 0 0 var(--buildings-type-border-hover, rgba(34, 211, 238, 0.72)),
    inset 0 0 18px color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.3)) 86%, transparent),
    inset 0 0 0 1px color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.72)) 28%, transparent),
    0 0 18px color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.28)) 100%, transparent),
    0 8px 18px rgba(0, 0, 0, 0.24) !important;
  animation: buildings-apartment-full-pulse 2.4s ease-in-out infinite !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-apartment-full > *,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-clinic-stabilization-ready > *,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-school-full > *,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-convenience-store-full > * {
  position: relative !important;
  z-index: 2 !important;
}

html body.game-body .building-action-status__item--rumor-inbox {
  --street-news-action-rgb: 53, 242, 193;
  position: relative;
  min-height: 42px !important;
  overflow: hidden;
  border-color: rgba(53, 242, 193, 0.48) !important;
  border-radius: 5px 13px 5px 13px !important;
  background:
    linear-gradient(100deg, rgba(53, 242, 193, 0.18), transparent 54%),
    linear-gradient(135deg, transparent 70%, rgba(244, 114, 182, 0.12)),
    rgba(3, 13, 20, 0.94) !important;
  box-shadow:
    inset 3px 0 0 rgba(53, 242, 193, 0.86),
    inset 0 0 18px rgba(53, 242, 193, 0.06),
    0 0 14px rgba(53, 242, 193, 0.14),
    0 0 22px rgba(244, 114, 182, 0.06) !important;
}

html body.game-body .building-action-status__item--rumor-inbox::after {
  content: "STREET WIRE";
  position: absolute;
  right: 7px;
  bottom: 2px;
  color: rgba(53, 242, 193, 0.18);
  font-size: 0.42rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  pointer-events: none;
}

html body.game-body .building-action-status__item--rumor-inbox:hover,
html body.game-body .building-action-status__item--rumor-inbox:focus-visible {
  transform: translateX(2px);
  border-color: rgba(53, 242, 193, 0.78) !important;
  background:
    linear-gradient(100deg, rgba(53, 242, 193, 0.25), transparent 58%),
    linear-gradient(135deg, transparent 68%, rgba(244, 114, 182, 0.18)),
    rgba(3, 16, 23, 0.98) !important;
  box-shadow:
    inset 4px 0 0 rgb(53, 242, 193),
    0 0 18px rgba(53, 242, 193, 0.25),
    0 0 28px rgba(244, 114, 182, 0.1) !important;
}

html body.game-body .building-action-status__item--rumor-inbox .building-action-status__item-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  gap: 8px !important;
  align-items: center !important;
}

html body.game-body .building-action-status__item--rumor-inbox .building-action-status__item-title {
  color: #dffff7 !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  text-shadow: 0 0 12px rgba(53, 242, 193, 0.4) !important;
}

html body.game-body .building-action-status__rumor-count {
  display: inline-grid;
  place-items: center;
  min-width: 25px;
  min-height: 21px;
  padding: 1px 6px;
  border: 1px solid rgba(244, 114, 182, 0.68);
  border-radius: 4px 10px 4px 10px;
  background: rgba(244, 114, 182, 0.16);
  color: #ffe5f3;
  font-size: 0.62rem;
  font-weight: 900;
  box-shadow:
    inset 0 0 10px rgba(244, 114, 182, 0.08),
    0 0 10px rgba(244, 114, 182, 0.18);
}

html body.game-body .building-action-status__rumor-open {
  color: rgba(53, 242, 193, 0.7);
  font-size: 0.46rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  white-space: nowrap;
}

@media (max-width: 420px) {
  html body.game-body .building-action-status__rumor-open {
    display: none;
  }
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-convenience-store-full {
  --buildings-type-border-hover: rgba(134, 239, 172, 0.94);
  --buildings-type-glow: rgba(34, 197, 94, 0.34);
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-apartment-full > span:first-child,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-apartment-full > span:nth-child(2),
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-clinic-stabilization-ready > span:first-child,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-clinic-stabilization-ready > span:nth-child(2),
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-school-full > span:first-child,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-school-full > span:nth-child(2),
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-convenience-store-full > span:first-child,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-convenience-store-full > span:nth-child(2) {
  color: #ffffff !important;
  text-shadow:
    0 0 8px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)),
    0 0 18px var(--buildings-type-glow, rgba(34, 211, 238, 0.32)) !important;
  animation: buildings-apartment-full-text-blink 2.4s ease-in-out infinite !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-apartment-full::before,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-clinic-stabilization-ready::before,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-school-full::before,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-convenience-store-full::before {
  background: var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)) !important;
  box-shadow:
    0 0 12px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)),
    0 0 24px var(--buildings-type-glow, rgba(34, 211, 238, 0.32)) !important;
  z-index: 3 !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-apartment-full::after,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-clinic-stabilization-ready::after,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-school-full::after,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-convenience-store-full::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 50% 18%, color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.8)) 58%, transparent), transparent 58%),
    linear-gradient(180deg, color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.4)) 70%, transparent), transparent),
    color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.28)) 48%, transparent) !important;
  border-radius: inherit !important;
  box-shadow:
    inset 0 0 20px color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)) 38%, transparent),
    inset 0 0 0 1px color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)) 28%, transparent);
  opacity: 0.08;
  animation: buildings-apartment-full-cell-blink 2.4s ease-in-out infinite !important;
}

@keyframes buildings-apartment-full-pulse {
  0%,
  100% {
    border-color: color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.72)) 54%, transparent);
    background:
      radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)) 18%, transparent), transparent 62%),
      linear-gradient(180deg, color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.2)) 44%, rgba(255, 255, 255, 0.006)), rgba(255, 255, 255, 0.006)),
      linear-gradient(90deg, color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.18)) 62%, transparent), rgba(2, 6, 13, 0.98));
    box-shadow:
      inset 2px 0 0 color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.72)) 58%, transparent),
      inset 0 0 8px color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.22)) 42%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.72)) 10%, transparent),
      0 0 8px color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.22)) 48%, transparent),
      0 8px 18px rgba(0, 0, 0, 0.24);
  }

  50% {
    border-color: var(--buildings-type-border-hover, rgba(34, 211, 238, 0.9));
    background:
      radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)) 58%, transparent), transparent 68%),
      linear-gradient(180deg, color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.2)) 100%, rgba(255, 255, 255, 0.012)), rgba(255, 255, 255, 0.012)),
      linear-gradient(90deg, color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.18)) 100%, transparent), rgba(2, 6, 13, 0.98));
    box-shadow:
      inset 2px 0 0 var(--buildings-type-border-hover, rgba(34, 211, 238, 0.9)),
      inset 0 0 26px color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.48)) 100%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.9)) 38%, transparent),
      0 0 28px color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.48)) 100%, transparent),
      0 8px 18px rgba(0, 0, 0, 0.24);
  }
}

@keyframes buildings-apartment-full-cell-blink {
  0%,
  100% {
    opacity: 0.08;
    box-shadow:
      inset 0 0 10px color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)) 22%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)) 18%, transparent);
  }

  50% {
    opacity: 0.72;
    box-shadow:
      inset 0 0 34px color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)) 64%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)) 52%, transparent),
      0 0 26px color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.4)) 100%, transparent);
  }
}

@keyframes buildings-apartment-full-text-blink {
  0%,
  100% {
    opacity: 0.82;
    text-shadow:
      0 0 4px color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)) 55%, transparent),
      0 0 10px color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.32)) 60%, transparent);
  }

  50% {
    opacity: 1;
    text-shadow:
      0 0 10px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)),
      0 0 24px var(--buildings-type-glow, rgba(34, 211, 238, 0.32)),
      0 0 34px var(--buildings-type-glow, rgba(34, 211, 238, 0.26));
  }
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building-grid--names {
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)) !important;
  gap: 6px !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--name,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--name.buildings-popup__building--interactive,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--name.buildings-popup__building--interactive:hover,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--name.buildings-popup__building--interactive:focus-visible {
  min-height: 34px !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-style: solid !important;
  border-radius: 9px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.006)),
    linear-gradient(90deg, rgba(15, 23, 42, 0.94), rgba(2, 6, 13, 0.98)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.018),
    0 8px 18px rgba(0, 0, 0, 0.24) !important;
  color: #e5edf7 !important;
  transform: none !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--name.buildings-popup__building--interactive:hover,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--name.buildings-popup__building--interactive:focus-visible {
  border-color: rgba(103, 232, 249, 0.42) !important;
  background:
    linear-gradient(180deg, rgba(103, 232, 249, 0.075), rgba(255, 255, 255, 0.008)),
    linear-gradient(90deg, rgba(10, 18, 30, 0.98), rgba(2, 5, 12, 0.99)) !important;
  box-shadow:
    inset 2px 0 0 rgba(103, 232, 249, 0.72),
    inset 0 0 0 1px rgba(255, 255, 255, 0.025),
    0 0 12px rgba(34, 211, 238, 0.16),
    0 8px 18px rgba(0, 0, 0, 0.28) !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--name > span:only-child {
  color: #eef7ff !important;
  font-size: 11.5px !important;
  font-weight: 760 !important;
  letter-spacing: 0.015em !important;
  line-height: 1.12 !important;
  text-shadow: 0 0 10px rgba(15, 23, 42, 0.86) !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--name.buildings-popup__building--locked,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--name.buildings-popup__building--locked:disabled {
  border-color: rgba(100, 116, 139, 0.14) !important;
  background:
    linear-gradient(180deg, rgba(30, 41, 59, 0.32), rgba(2, 6, 13, 0.92)),
    rgba(2, 6, 13, 0.92) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.012) !important;
  color: #8794a6 !important;
}

@media (min-width: 781px) {
  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content {
    position: absolute !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content > .modal__header {
    position: absolute !important;
    z-index: 8 !important;
    top: 40px !important;
    right: 44px !important;
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    pointer-events: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content > .modal__body {
    padding-top: 0 !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__detail-card {
    padding-right: 54px !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__types.buildings-modal__types {
    height: var(--buildings-modal-panel-height) !important;
    align-content: stretch !important;
    grid-auto-rows: minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn {
    position: relative !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    min-height: 0 !important;
    padding: 10px 12px 10px 54px !important;
    overflow: hidden !important;
    border-color: color-mix(in srgb, var(--buildings-type-border, rgba(34, 211, 238, 0.42)) 66%, rgba(255, 255, 255, 0.12)) !important;
    background:
      radial-gradient(circle at 18% 18%, color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.2)) 72%, transparent), transparent 42%),
      linear-gradient(135deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.012) 48%, rgba(255, 255, 255, 0.04)),
      linear-gradient(180deg, color-mix(in srgb, var(--buildings-type-bg-a, rgba(8, 14, 26, 0.92)) 86%, transparent), color-mix(in srgb, var(--buildings-type-bg-b, rgba(2, 6, 13, 0.95)) 92%, transparent)) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.045),
      inset 0 0 22px color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.14)) 42%, transparent),
      0 10px 24px rgba(0, 0, 0, 0.28) !important;
    backdrop-filter: blur(10px) saturate(1.16) !important;
    -webkit-backdrop-filter: blur(10px) saturate(1.16) !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn::after {
    content: "" !important;
    position: absolute !important;
    inset: 1px !important;
    border-radius: inherit !important;
    background:
      linear-gradient(120deg, rgba(255, 255, 255, 0.16), transparent 24%, transparent 74%, color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.16)) 54%, transparent)) !important;
    opacity: 0.54 !important;
    pointer-events: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn::before {
    position: absolute !important;
    left: -10px !important;
    top: 52% !important;
    display: grid !important;
    width: 76px !important;
    height: 76px !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: color-mix(in srgb, var(--buildings-type-text, #e6fbff) 88%, #ffffff) !important;
    font-size: 58px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    opacity: 0.26 !important;
    filter: saturate(1.9) brightness(1.42) drop-shadow(0 0 10px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.72))) !important;
    text-shadow:
      0 0 4px color-mix(in srgb, var(--buildings-type-text, #e6fbff) 94%, #ffffff),
      0 0 12px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.92)),
      0 0 26px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.78)),
      0 0 48px var(--buildings-type-glow, rgba(34, 211, 238, 0.62)),
      0 0 76px var(--buildings-type-glow, rgba(34, 211, 238, 0.42)) !important;
    transform: translateY(-50%) rotate(-8deg) !important;
    pointer-events: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn.is-active::before {
    opacity: 0.44 !important;
    transform: translateY(-50%) rotate(-5deg) scale(1.06) !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--resident::before,
  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--residential::before {
    content: "⌂" !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--park::before {
    content: "♧" !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--economy::before,
  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--commercial::before {
    content: "€" !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--industrial::before {
    content: "⚙" !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--downtown::before {
    content: "★" !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-label {
    position: relative !important;
    z-index: 1 !important;
    display: inline-block !important;
    min-width: 0 !important;
    color: var(--buildings-type-text, #e6fbff) !important;
    font-size: 1rem !important;
    font-weight: 860 !important;
    line-height: 1.05 !important;
    text-align: left !important;
    text-shadow:
      0 0 10px var(--buildings-type-glow, rgba(34, 211, 238, 0.34)),
      0 0 18px var(--buildings-type-glow, rgba(34, 211, 238, 0.22)) !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn.is-active .buildings-popup__type-label {
    font-size: 1.08rem !important;
    color: color-mix(in srgb, var(--buildings-type-text, #e6fbff) 82%, #ffffff) !important;
    text-shadow:
      0 0 12px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.7)),
      0 0 24px var(--buildings-type-glow, rgba(34, 211, 238, 0.38)),
      0 0 34px var(--buildings-type-glow, rgba(34, 211, 238, 0.22)) !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-meta {
    position: relative !important;
    z-index: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 20px !important;
    color: rgba(226, 232, 240, 0.68) !important;
    font-size: 0.68rem !important;
    font-weight: 760 !important;
    letter-spacing: 0.02em !important;
    line-height: 1 !important;
    text-shadow: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) button#buildings-modal-close.modal__close {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    place-items: center !important;
    width: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(103, 232, 249, 0.58) !important;
    border-radius: 7px !important;
    background:
      radial-gradient(circle at 50% 35%, rgba(103, 232, 249, 0.22), transparent 56%),
      linear-gradient(180deg, rgba(8, 18, 30, 0.92), rgba(2, 6, 16, 0.96)) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.055),
      0 0 12px rgba(34, 211, 238, 0.38),
      0 0 22px rgba(244, 114, 182, 0.12) !important;
    color: #e6fbff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-shadow:
      0 0 8px rgba(103, 232, 249, 0.86),
      0 0 16px rgba(244, 114, 182, 0.22) !important;
    transform: none !important;
    pointer-events: auto !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) button#buildings-modal-close.modal__close::before {
    content: none !important;
    display: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) button#buildings-modal-close.modal__close::after {
    content: none !important;
    display: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) button#buildings-modal-close.modal__close:hover,
  html body #buildings-modal.buildings-popup-shell:not([hidden]) button#buildings-modal-close.modal__close:focus-visible {
    border-color: rgba(165, 243, 252, 0.92) !important;
    color: #ffffff !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.08),
      inset 0 0 12px rgba(103, 232, 249, 0.13),
      0 0 15px rgba(34, 211, 238, 0.62),
      0 0 26px rgba(244, 114, 182, 0.18) !important;
  }
}

/* Final loaded override: custom building photo cards must stay visible under glass UI. */
html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] {
  position: relative !important;
  overflow: hidden !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.004) 24%, rgba(2, 6, 14, 0.12) 100%),
    linear-gradient(135deg, rgba(var(--building-window-accent-rgb), 0.04), rgba(2, 6, 14, 0.08) 38%, rgba(var(--building-window-danger-rgb), 0.024) 100%),
    var(--building-detail-background-image) center/cover,
    rgba(4, 8, 16, 0.46) !important;
}

html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: block !important;
  border-radius: inherit !important;
  background: var(--building-detail-background-image) center/cover no-repeat !important;
  opacity: 0.78 !important;
  pointer-events: none !important;
}

html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::before {
  z-index: 1 !important;
  opacity: 0.16 !important;
  background:
    linear-gradient(180deg, rgba(2, 6, 14, 0.035), transparent 34%, rgba(2, 6, 14, 0.08)),
    linear-gradient(90deg, transparent 0 10%, rgba(var(--building-window-accent-rgb), 0.14) 20%, rgba(var(--building-window-secondary-rgb), 0.08) 50%, rgba(var(--building-window-accent-rgb), 0.12) 80%, transparent 90%) !important;
}

html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] > * {
  position: relative !important;
  z-index: 2 !important;
}

html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .modal__header,
html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel,
html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel--merged,
html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__section,
html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-mechanic-row,
html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-info-card,
html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__effects,
html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.002)),
    rgba(3, 8, 16, 0.14) !important;
  backdrop-filter: blur(1px) saturate(1.02) !important;
  -webkit-backdrop-filter: blur(1px) saturate(1.02) !important;
}

html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__section::before,
html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-info-card::before {
  opacity: 0.05 !important;
}

html body.game-body .district-building-detail-card .building-detail-info-text,
html body.game-body .district-building-detail-shell.is-building-detail-single-panel .district-building-detail-panel--merged > .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.004)),
    rgba(2, 6, 14, 0.52) !important;
  border-color: rgba(var(--building-window-accent-rgb), 0.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 8px 18px rgba(0, 0, 0, 0.2) !important;
}

html body.game-body .district-building-detail-card [data-district-building-detail-action-section] > h5 {
  color: #facc15 !important;
  text-shadow:
    0 0 10px rgba(250, 204, 21, 0.16),
    0 0 18px rgba(234, 179, 8, 0.1) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="clinic"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-panel--merged {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding-bottom: 0 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-panel--merged {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding-bottom: 0 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="clinic"].is-building-detail-single-panel .district-building-detail-panel--merged [data-district-building-detail-action-section] ~ * {
  display: none !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"].is-building-detail-single-panel .district-building-detail-panel--merged [data-district-building-detail-action-section],
html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"].is-building-detail-single-panel .district-building-detail-panel--merged [data-district-building-detail-action-section] ~ * {
  display: none !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="clinic"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-panel[data-district-building-detail-panel="info"],
html body.game-body .district-building-detail-shell[data-building-mechanics-type="clinic"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-info-card {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-panel[data-district-building-detail-panel="info"],
html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-info-card {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

@media (min-width: 721px) {
  html body.game-body .district-building-detail-card [data-district-building-detail-action-section] {
    margin-top: 58px !important;
  }

  html body.game-body .district-building-detail-card [data-district-building-detail-action-section] > h5 {
    margin-bottom: 15px !important;
  }
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="school"] .district-building-detail-card [data-district-building-detail-action-section] {
  margin-top: 34px !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="school"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
  color: #facc15 !important;
  text-shadow:
    0 0 10px rgba(250, 204, 21, 0.16),
    0 0 18px rgba(234, 179, 8, 0.1) !important;
}

@media (min-width: 721px) {
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="school"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
    margin-bottom: 56px !important;
  }
}

@media (max-width: 720px) {
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="school"] .district-building-detail-card [data-district-building-detail-action-section] {
    margin-top: 10px !important;
  }
}

/* Restaurant card lock: keep the approved visual treatment stable for this building. */
html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.004) 24%, rgba(2, 6, 14, 0.12) 100%),
    linear-gradient(135deg, rgba(var(--building-window-accent-rgb), 0.04), rgba(2, 6, 14, 0.08) 38%, rgba(var(--building-window-danger-rgb), 0.024) 100%),
    var(--building-detail-background-image) center/cover,
    rgba(4, 8, 16, 0.46) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::after {
  opacity: 0.78 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::before {
  opacity: 0.16 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .modal__header,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel--merged,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__section,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-mechanic-row,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-info-card,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__effects,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.002)),
    rgba(3, 8, 16, 0.14) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card .building-detail-info-text,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"].is-building-detail-single-panel .district-building-detail-panel--merged > .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.004)),
    rgba(2, 6, 14, 0.52) !important;
  border-color: rgba(var(--building-window-accent-rgb), 0.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 8px 18px rgba(0, 0, 0, 0.2) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
  color: #facc15 !important;
  text-shadow:
    0 0 10px rgba(250, 204, 21, 0.16),
    0 0 18px rgba(234, 179, 8, 0.1) !important;
}

@media (min-width: 721px) {
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card [data-district-building-detail-action-section] {
    margin-top: 82px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
    margin-bottom: 15px !important;
  }
}

/* Phone bounty shortcut: compact button with an unmistakable neon target. */
html body.game-body .map-phase-toolbar .map-bounty-shortcut--phase svg {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  overflow: visible !important;
  fill: none !important;
  stroke: #ff9aaa !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter:
    drop-shadow(0 0 2px rgba(255, 255, 255, 0.95))
    drop-shadow(0 0 5px rgba(255, 55, 92, 0.98))
    drop-shadow(0 0 9px rgba(255, 35, 75, 0.72)) !important;
}

@media (max-width: 720px) {
  html body.game-body .map-phase-toolbar .map-bounty-shortcut--phase {
    flex: 0 0 20px !important;
    width: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    padding: 0 !important;
    border-radius: 6px !important;
  }

  html body.game-body .map-phase-toolbar .map-bounty-shortcut--phase svg {
    flex: 0 0 12px !important;
    width: 12px !important;
    min-width: 12px !important;
    height: 12px !important;
    min-height: 12px !important;
  }
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-production-slot-full,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-production-slot-full:hover,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-production-slot-full:focus-visible {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  border-color: color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.72)) 74%, transparent) !important;
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.72)) 28%, transparent),
    0 0 14px color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.28)) 82%, transparent),
    0 8px 18px rgba(0, 0, 0, 0.22) !important;
  animation: buildings-apartment-full-pulse 2.8s ease-in-out infinite !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__building--type.is-production-slot-full > * {
  position: relative !important;
  z-index: 2 !important;
  text-shadow:
    0 0 8px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.74)),
    0 0 16px var(--buildings-type-glow, rgba(34, 211, 238, 0.32)) !important;
}

/* Casino card lock: keep the approved visual treatment stable for this building. */
html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.004) 24%, rgba(2, 6, 14, 0.12) 100%),
    linear-gradient(135deg, rgba(var(--building-window-accent-rgb), 0.04), rgba(2, 6, 14, 0.08) 38%, rgba(var(--building-window-danger-rgb), 0.024) 100%),
    var(--building-detail-background-image) center/cover,
    rgba(4, 8, 16, 0.46) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::after {
  opacity: 0.78 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::before {
  opacity: 0.16 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .modal__header,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel--merged,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__section,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-mechanic-row,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-info-card,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__effects,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.002)),
    rgba(3, 8, 16, 0.14) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card .building-detail-info-text,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"].is-building-detail-single-panel .district-building-detail-panel--merged > .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.004)),
    rgba(2, 6, 14, 0.52) !important;
  border-color: rgba(var(--building-window-accent-rgb), 0.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 8px 18px rgba(0, 0, 0, 0.2) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
  color: #facc15 !important;
  text-shadow:
    0 0 10px rgba(250, 204, 21, 0.16),
    0 0 18px rgba(234, 179, 8, 0.1) !important;
}

@media (min-width: 721px) {
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="casino"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
    margin-bottom: 15px !important;
  }
}

/* Auto salon card lock: keep the approved visual treatment stable for this building. */
html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.004) 24%, rgba(2, 6, 14, 0.12) 100%),
    linear-gradient(135deg, rgba(var(--building-window-accent-rgb), 0.04), rgba(2, 6, 14, 0.08) 38%, rgba(var(--building-window-danger-rgb), 0.024) 100%),
    var(--building-detail-background-image) center/cover,
    rgba(4, 8, 16, 0.46) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::after {
  opacity: 0.78 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::before {
  opacity: 0.16 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .modal__header,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel--merged,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__section,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-mechanic-row,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-info-card,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__effects,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.002)),
    rgba(3, 8, 16, 0.14) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card .building-detail-info-text,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"].is-building-detail-single-panel .district-building-detail-panel--merged > .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.004)),
    rgba(2, 6, 14, 0.52) !important;
  border-color: rgba(var(--building-window-accent-rgb), 0.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 8px 18px rgba(0, 0, 0, 0.2) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
  color: #facc15 !important;
  text-shadow:
    0 0 10px rgba(250, 204, 21, 0.16),
    0 0 18px rgba(234, 179, 8, 0.1) !important;
}

@media (min-width: 721px) {
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="auto-salon"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
    margin-bottom: 15px !important;
  }
}

/* Shopping mall card lock: keep the approved visual treatment stable for this building. */
html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.004) 24%, rgba(2, 6, 14, 0.12) 100%),
    linear-gradient(135deg, rgba(var(--building-window-accent-rgb), 0.04), rgba(2, 6, 14, 0.08) 38%, rgba(var(--building-window-danger-rgb), 0.024) 100%),
    var(--building-detail-background-image) center/cover,
    rgba(4, 8, 16, 0.46) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::after {
  opacity: 0.78 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::before {
  opacity: 0.16 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .modal__header,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel--merged,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__section,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-mechanic-row,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-info-card,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__effects,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.002)),
    rgba(3, 8, 16, 0.14) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card .building-detail-info-text,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"].is-building-detail-single-panel .district-building-detail-panel--merged > .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.004)),
    rgba(2, 6, 14, 0.52) !important;
  border-color: rgba(var(--building-window-accent-rgb), 0.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 8px 18px rgba(0, 0, 0, 0.2) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
  color: #facc15 !important;
  text-shadow:
    0 0 10px rgba(250, 204, 21, 0.16),
    0 0 18px rgba(234, 179, 8, 0.1) !important;
}

@media (min-width: 721px) {
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="retail"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
    margin-bottom: 15px !important;
  }
}

/* Arcade card lock: keep the approved visual treatment stable for this building. */
html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.004) 24%, rgba(2, 6, 14, 0.12) 100%),
    linear-gradient(135deg, rgba(var(--building-window-accent-rgb), 0.04), rgba(2, 6, 14, 0.08) 38%, rgba(var(--building-window-danger-rgb), 0.024) 100%),
    var(--building-detail-background-image) center/cover,
    rgba(4, 8, 16, 0.46) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::after {
  opacity: 0.78 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::before {
  opacity: 0.16 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .modal__header,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel--merged,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__section,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-mechanic-row,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-info-card,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__effects,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.002)),
    rgba(3, 8, 16, 0.14) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card .building-detail-info-text,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"].is-building-detail-single-panel .district-building-detail-panel--merged > .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.004)),
    rgba(2, 6, 14, 0.52) !important;
  border-color: rgba(var(--building-window-accent-rgb), 0.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 8px 18px rgba(0, 0, 0, 0.2) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
  color: #facc15 !important;
  text-shadow:
    0 0 10px rgba(250, 204, 21, 0.16),
    0 0 18px rgba(234, 179, 8, 0.1) !important;
}

@media (min-width: 721px) {
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
    margin-bottom: 15px !important;
  }
}

/* Recruitment center card lock: keep the approved visual treatment stable for this building. */
html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.004) 24%, rgba(2, 6, 14, 0.12) 100%),
    linear-gradient(135deg, rgba(var(--building-window-accent-rgb), 0.04), rgba(2, 6, 14, 0.08) 38%, rgba(var(--building-window-danger-rgb), 0.024) 100%),
    var(--building-detail-background-image) center/cover,
    rgba(4, 8, 16, 0.46) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::after {
  opacity: 0.78 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::before {
  opacity: 0.16 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .modal__header,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel--merged,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__section,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-mechanic-row,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-info-card,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__effects,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.002)),
    rgba(3, 8, 16, 0.14) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card .building-detail-info-text,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"].is-building-detail-single-panel .district-building-detail-panel--merged > .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.004)),
    rgba(2, 6, 14, 0.52) !important;
  border-color: rgba(var(--building-window-accent-rgb), 0.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 8px 18px rgba(0, 0, 0, 0.2) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
  color: #facc15 !important;
  text-shadow:
    0 0 10px rgba(250, 204, 21, 0.16),
    0 0 18px rgba(234, 179, 8, 0.1) !important;
}

@media (min-width: 721px) {
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
    margin-bottom: 15px !important;
  }
}

/* Garage card lock: keep the approved visual treatment stable for this building. */
html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.004) 24%, rgba(2, 6, 14, 0.12) 100%),
    linear-gradient(135deg, rgba(var(--building-window-accent-rgb), 0.04), rgba(2, 6, 14, 0.08) 38%, rgba(var(--building-window-danger-rgb), 0.024) 100%),
    var(--building-detail-background-image) center/cover,
    rgba(4, 8, 16, 0.46) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::after {
  opacity: 0.78 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"]::before {
  opacity: 0.16 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .modal__header,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-panel--merged,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__section,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-mechanic-row,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .district-building-detail-info-card,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__effects,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.002)),
    rgba(3, 8, 16, 0.14) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card .building-detail-info-text,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"].is-building-detail-single-panel .district-building-detail-panel--merged > .building-detail-info-text {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.004)),
    rgba(2, 6, 14, 0.52) !important;
  border-color: rgba(var(--building-window-accent-rgb), 0.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 8px 18px rgba(0, 0, 0, 0.2) !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
  color: #facc15 !important;
  text-shadow:
    0 0 10px rgba(250, 204, 21, 0.16),
    0 0 18px rgba(234, 179, 8, 0.1) !important;
}

@media (min-width: 721px) {
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="garage"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
    margin-bottom: 15px !important;
  }
}

@media (min-width: 721px) {
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="exchange"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
    margin-bottom: 44px !important;
  }
}

@media (min-width: 721px) {
  html body.game-body .district-building-detail-card.building-detail-modal__content {
    display: flex !important;
    flex-direction: column !important;
    max-height: calc(100dvh - 32px) !important;
    overflow: hidden !important;
  }

  html body.game-body .district-building-detail-card .modal__header {
    flex: 0 0 auto !important;
    min-height: 44px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  html body.game-body .district-building-detail-card .district-building-detail-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    gap: 6px !important;
    padding: 9px !important;
    overflow: visible !important;
  }

  html body.game-body .district-building-detail-shell.is-building-detail-single-panel .district-building-detail-card .district-building-detail-body {
    grid-template-rows: minmax(0, 1fr) !important;
  }

  html body.game-body .district-building-detail-card .district-building-detail-panel,
  html body.game-body .district-building-detail-shell.is-building-detail-single-panel .district-building-detail-panel--merged {
    min-height: 0 !important;
    gap: 6px !important;
    padding: 8px !important;
    overflow: visible !important;
  }

  html body.game-body .district-building-detail-shell.is-building-detail-single-panel .district-building-detail-card .district-building-detail-panel {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="power-plant"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-body {
    flex: 0 0 auto !important;
    grid-template-rows: auto !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="power-plant"].is-building-detail-single-panel .district-building-detail-card.building-detail-modal__content {
    height: auto !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="power-plant"] .district-building-detail-card .building-info-card__effects {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    row-gap: 8px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="power-plant"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-panel--merged {
    flex: 0 0 auto !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="strip-club"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-body {
    flex: 0 0 auto !important;
    grid-template-rows: auto !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="strip-club"].is-building-detail-single-panel .district-building-detail-card.building-detail-modal__content {
    height: auto !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="strip-club"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-panel--merged {
    flex: 0 0 auto !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-body {
    flex: 0 0 auto !important;
    grid-template-rows: auto !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"].is-building-detail-single-panel .district-building-detail-card.building-detail-modal__content {
    height: auto !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-panel--merged {
    flex: 0 0 auto !important;
  }

  html body.game-body .district-building-detail-card .building-info-card__section,
  html body.game-body .district-building-detail-card .building-info-card__effects {
    gap: 5px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 7px !important;
    min-height: 0 !important;
  }

  html body.game-body .district-building-detail-card [data-district-building-detail-action-section] {
    order: 150 !important;
    width: 100% !important;
    margin-top: auto !important;
    padding-top: 52px !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  html body.game-body .district-building-detail-card .building-info-card__section > h5,
  html body.game-body .district-building-detail-card [data-district-building-detail-effects-section] > h5,
  html body.game-body .district-building-detail-card [data-district-building-detail-action-section] > h5 {
    margin-top: 0 !important;
    margin-bottom: 4px !important;
    padding: 0 !important;
    line-height: 1 !important;
  }

  html body.game-body .district-building-detail-card [data-district-building-detail-effects-section],
  html body.game-body .district-building-detail-card [data-district-building-detail-action-section],
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="school"] .district-building-detail-card [data-district-building-detail-action-section] {
    margin-top: 0 !important;
  }

  html body.game-body .district-building-detail-card [data-district-building-detail-effects-section],
  html body.game-body .district-building-detail-card .building-info-card__effects,
  html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] [data-district-building-detail-effects-section],
  html body.game-body .district-building-detail-card.building-detail-modal__content[data-building-has-custom-background="true"] .building-info-card__effects {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html body.game-body .district-building-detail-card [data-district-building-detail-effects-section]::before {
    content: none !important;
    display: none !important;
  }

  html body.game-body .district-building-detail-card .district-building-detail-mechanics,
  html body.game-body .district-building-detail-card .building-info-card__effects,
  html body.game-body .district-building-detail-card .district-building-detail-actions {
    gap: 6px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card .building-info-card__effects {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: center !important;
    justify-content: center !important;
    row-gap: 12px !important;
    column-gap: 8px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card .district-building-detail-effect-cell {
    grid-column: 1 / -1 !important;
    width: auto !important;
    max-width: min(100%, 320px) !important;
    justify-self: center !important;
    justify-content: center !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card .district-building-detail-effect-cell[data-effect-tone="clean"],
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card .district-building-detail-effect-cell[data-effect-tone="heat"],
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="restaurant"] .district-building-detail-card .district-building-detail-effect-cell[data-effect-tone="influence"] {
    grid-column: auto !important;
    max-width: 100% !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card [data-district-building-detail-effects-section] {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    min-height: clamp(390px, 60vh, 640px) !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card .building-info-card__effects {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-evenly !important;
    gap: 34px !important;
    row-gap: 34px !important;
    width: 100% !important;
    min-height: clamp(340px, 52vh, 560px) !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="recruitment-center"] .district-building-detail-card .district-building-detail-effect-cell {
    width: auto !important;
    max-width: min(100%, 320px) !important;
    align-self: center !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="clinic"] .district-building-detail-card .building-info-card__effects {
    row-gap: 28px !important;
    column-gap: 0 !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="apartment-block"] .district-building-detail-card .building-info-card__effects {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    row-gap: 18px !important;
    column-gap: 0 !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="apartment-block"] .district-building-detail-card .district-building-detail-effect-cell {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: min(100%, 280px) !important;
    align-self: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="clinic"] .district-building-detail-mechanics {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
    row-gap: 18px !important;
    column-gap: 0 !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="clinic"] .district-building-detail-mechanic-row {
    width: auto !important;
    max-width: min(100%, 280px) !important;
    justify-content: center !important;
    border-radius: 999px !important;
  }

  html body.game-body .district-building-detail-shell.is-building-detail-single-panel .district-building-detail-card .district-building-detail-panel--merged {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 8px 8px 0 !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="clinic"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-panel--merged {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 8px 8px 0 !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="clinic"].is-building-detail-single-panel .district-building-detail-card [data-district-building-detail-action-section] {
    margin-bottom: 0 !important;
    padding-top: 20px !important;
    padding-bottom: 0 !important;
  }

  html body.game-body .district-building-detail-shell.is-building-detail-single-panel .district-building-detail-card [data-district-building-detail-action-section] {
    border-bottom: 0 !important;
  }

  html body.game-body .district-building-detail-card .district-building-detail-mechanic-row,
  html body.game-body .district-building-detail-card .district-building-detail-effect-cell {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }

  html body.game-body .district-building-detail-actions .building-info-action-row {
    min-height: 50px !important;
    gap: 3px !important;
    padding: 6px 8px 21px !important;
  }

  html body.game-body .district-building-detail-actions .building-info-action-row__title {
    font-size: 0.74rem !important;
    line-height: 1.05 !important;
  }

  html body.game-body .district-building-detail-actions .building-info-action-row__desc,
  html body.game-body .district-building-detail-actions .building-info-action-row__cooldown {
    font-size: 0.58rem !important;
    line-height: 1.05 !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] [data-district-building-detail-action-section] {
    gap: 0 !important;
    margin-top: 8px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-card [data-district-building-detail-action-section] > h5 {
    margin-bottom: 15px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-actions {
    margin-top: 0 !important;
    gap: 5px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-mechanics {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .building-info-card__effects {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 5px 6px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-mechanic-row,
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-effect-cell {
    width: fit-content !important;
    max-width: 100% !important;
    border-radius: 999px !important;
    padding: 8px 12px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-mechanic-row strong,
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-effect-cell strong {
    font-size: 0.84rem !important;
    line-height: 1.14 !important;
    text-align: center !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="arcade"] .district-building-detail-effect-cell strong {
    white-space: nowrap !important;
  }
}

@media (max-width: 780px), (max-width: 900px) and (hover: none) and (pointer: coarse), (max-width: 900px) and (any-hover: none), (max-width: 900px) and (any-pointer: coarse) {
  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content > .modal__header {
    position: absolute !important;
    z-index: 9 !important;
    top: 8px !important;
    right: 4px !important;
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    pointer-events: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) button#buildings-modal-close.modal__close {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    place-items: center !important;
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: rgb(var(--mobile-building-scroll-rgb, 34, 211, 238)) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-shadow: 0 0 10px rgba(103, 232, 249, 0.88) !important;
    transform: none !important;
    pointer-events: auto !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) button#buildings-modal-close.modal__close::before,
  html body #buildings-modal.buildings-popup-shell:not([hidden]) button#buildings-modal-close.modal__close::after {
    content: none !important;
    display: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content > .modal__body {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    min-height: 0 !important;
    overflow: hidden !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content > .modal__body::-webkit-scrollbar,
  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content > .modal__body::-webkit-scrollbar-track,
  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content > .modal__body::-webkit-scrollbar-thumb {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__layout.buildings-modal__layout {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__types.buildings-modal__types {
    flex: 0 0 auto !important;
    max-height: min(30svh, 180px) !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 7px !important;
    overflow-y: auto !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn {
    position: relative !important;
    display: grid !important;
    min-width: 0 !important;
    min-height: 70px !important;
    padding: 8px 6px !important;
    place-items: center !important;
    overflow: hidden !important;
    border: 1px solid color-mix(in srgb, var(--buildings-type-border, rgba(34, 211, 238, 0.42)) 62%, rgba(255, 255, 255, 0.1)) !important;
    border-radius: 13px !important;
    background:
      radial-gradient(circle at 50% 22%, color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.22)) 72%, transparent), transparent 48%),
      linear-gradient(135deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.012) 52%, rgba(255, 255, 255, 0.035)),
      rgba(3, 8, 17, 0.72) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.04),
      inset 0 0 18px color-mix(in srgb, var(--buildings-type-glow, rgba(34, 211, 238, 0.14)) 48%, transparent),
      0 8px 18px rgba(0, 0, 0, 0.28) !important;
    backdrop-filter: blur(10px) saturate(1.18) !important;
    -webkit-backdrop-filter: blur(10px) saturate(1.18) !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn::before {
    position: absolute !important;
    inset: 50% auto auto 50% !important;
    display: block !important;
    color: color-mix(in srgb, var(--buildings-type-text, #e6fbff) 88%, #ffffff) !important;
    font-size: 31px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    opacity: 0.9 !important;
    filter: saturate(1.9) brightness(1.3) drop-shadow(0 0 8px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.72))) !important;
    text-shadow:
      0 0 7px color-mix(in srgb, var(--buildings-type-text, #e6fbff) 86%, #ffffff),
      0 0 15px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.86)),
      0 0 28px var(--buildings-type-glow, rgba(34, 211, 238, 0.58)) !important;
    transform: translate(-50%, -56%) !important;
    pointer-events: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--resident::before,
  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--residential::before {
    content: "⌂" !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--park::before {
    content: "♧" !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--economy::before,
  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--commercial::before {
    content: "€" !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--industrial::before {
    content: "⚙" !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn--downtown::before {
    content: "★" !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-label {
    display: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-meta {
    position: absolute !important;
    right: 4px !important;
    bottom: 3px !important;
    z-index: 1 !important;
    display: inline-flex !important;
    min-width: 15px !important;
    min-height: 15px !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid color-mix(in srgb, var(--buildings-type-border-hover, rgba(34, 211, 238, 0.72)) 52%, transparent) !important;
    border-radius: 999px !important;
    background: rgba(2, 6, 13, 0.72) !important;
    color: color-mix(in srgb, var(--buildings-type-text, #e6fbff) 84%, #ffffff) !important;
    font-size: 0.56rem !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-shadow:
      0 0 8px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.82)),
      0 0 15px var(--buildings-type-glow, rgba(34, 211, 238, 0.46)) !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-meta[data-mobile-count] {
    font-size: 0 !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-meta[data-mobile-count]::after {
    content: attr(data-mobile-count) !important;
    font-size: 0.62rem !important;
    line-height: 1 !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__mobile-type-caption {
    grid-column: 1 / -1 !important;
    display: block !important;
    min-height: 15px !important;
    margin: 6px 2px 1px !important;
    color: color-mix(in srgb, var(--mobile-building-scroll-rgb, 34, 211, 238) 78%, #ffffff) !important;
    font-size: 0.62rem !important;
    font-weight: 850 !important;
    line-height: 1.15 !important;
    letter-spacing: 0.06em !important;
    text-align: center !important;
    text-transform: uppercase !important;
    text-shadow:
      0 0 8px rgba(var(--mobile-building-scroll-rgb, 34, 211, 238), 0.72),
      0 0 16px rgba(var(--mobile-building-scroll-soft-rgb, 8, 145, 178), 0.38) !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__types.buildings-modal__types::-webkit-scrollbar,
  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__types.buildings-modal__types::-webkit-scrollbar-track,
  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__types.buildings-modal__types::-webkit-scrollbar-thumb {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__detail.buildings-modal__detail {
    flex: 1 1 auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: thin !important;
    scrollbar-color:
      rgba(var(--mobile-building-scroll-rgb, 34, 211, 238), 0.92)
      rgba(2, 8, 18, 0.82) !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__detail-card {
    flex: 0 0 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__detail.buildings-modal__detail::-webkit-scrollbar {
    width: 8px !important;
    height: 8px !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__detail.buildings-modal__detail::-webkit-scrollbar-track {
    border: 1px solid rgba(var(--mobile-building-scroll-rgb, 34, 211, 238), 0.16) !important;
    border-radius: 999px !important;
    background:
      linear-gradient(180deg, rgba(2, 8, 18, 0.94), rgba(8, 14, 26, 0.78)),
      repeating-linear-gradient(180deg, rgba(var(--mobile-building-scroll-rgb, 34, 211, 238), 0.12) 0 1px, transparent 1px 5px) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.035),
      inset 0 0 14px rgba(var(--mobile-building-scroll-soft-rgb, 8, 145, 178), 0.12) !important;
  }

  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__detail.buildings-modal__detail::-webkit-scrollbar-thumb {
    border: 1px solid rgba(2, 8, 18, 0.76) !important;
    border-radius: 999px !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(var(--mobile-building-scroll-rgb, 34, 211, 238), 0.96) 34%, rgba(var(--mobile-building-scroll-soft-rgb, 8, 145, 178), 0.88)) !important;
    box-shadow:
      0 0 12px rgba(var(--mobile-building-scroll-rgb, 34, 211, 238), 0.42),
      inset 0 0 0 1px rgba(255, 255, 255, 0.16) !important;
  }
}

html body.game-body #buildings-modal .buildings-popup-card.buildings-modal__content {
  background:
    var(
      --buildings-popup-background-stack,
      linear-gradient(rgba(3, 7, 18, 0.5), rgba(3, 7, 18, 0.66)),
      url("../../img/index.png")
    ) !important;
  background-size: cover, cover !important;
  background-position: center, center !important;
  background-repeat: no-repeat, no-repeat !important;
}

/* Final market popup polish: compact header, darker modes, and desktop black-market columns. */
html body .market-popup-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-height: 30px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
}

html body .market-popup-heading > .market-popup-title {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: #f8fdff !important;
  font-size: clamp(1.18rem, 2vw, 1.52rem) !important;
  line-height: 1.08 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  overflow-wrap: anywhere !important;
  text-shadow:
    0 0 14px rgba(34, 211, 238, 0.72),
    0 0 28px rgba(244, 114, 182, 0.24) !important;
}

html body .market-popup-heading > .market-popup-close {
  position: relative !important;
  inset: auto !important;
  display: grid !important;
  flex: 0 0 26px !important;
  width: 26px !important;
  min-width: 26px !important;
  max-width: 26px !important;
  height: 26px !important;
  min-height: 26px !important;
  max-height: 26px !important;
  margin: 0 !important;
  padding: 0 !important;
  place-items: center !important;
  border: 1px solid rgba(103, 232, 249, 0.54) !important;
  border-radius: 8px !important;
  background:
    radial-gradient(circle at 50% 35%, rgba(103, 232, 249, 0.24), transparent 54%),
    rgba(3, 10, 20, 0.7) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.05),
    0 0 13px rgba(34, 211, 238, 0.34) !important;
  color: #dffbff !important;
  font-size: 0 !important;
  line-height: 1 !important;
  transform: none !important;
}

html body .market-popup-heading > .market-popup-close::before {
  content: "×" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  color: currentColor !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-shadow:
    0 0 8px rgba(103, 232, 249, 0.78),
    0 0 14px rgba(244, 114, 182, 0.24) !important;
  transform: translate(-50%, -53%) !important;
}

html body .market-popup-heading > .market-popup-close::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body .market-popup-shell[data-market-popup] .market-popup-heading > .market-popup-close {
    flex: 0 0 24px !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    border-radius: 7px !important;
    border-color: rgba(103, 232, 249, 0.68) !important;
    background:
      radial-gradient(circle at 50% 34%, rgba(103, 232, 249, 0.25), transparent 54%),
      linear-gradient(135deg, rgba(34, 211, 238, 0.18), rgba(244, 114, 182, 0.14)),
      rgba(3, 10, 20, 0.82) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.055),
      0 0 10px rgba(34, 211, 238, 0.3),
      0 0 16px rgba(244, 114, 182, 0.12) !important;
  }

  html body .market-popup-shell[data-market-popup] .market-popup-heading > .market-popup-close::before {
    font-size: 16px !important;
    font-weight: 600 !important;
    transform: translate(-50%, -54%) !important;
    text-shadow:
      0 0 8px rgba(103, 232, 249, 0.82),
      0 0 14px rgba(244, 114, 182, 0.28) !important;
  }
}

html body .market-popup-shell[data-market-mode="black-market"] .market-popup-card {
  border-color: rgba(244, 114, 182, 0.68) !important;
  background:
    linear-gradient(180deg, rgba(2, 4, 10, 0.9), rgba(2, 3, 8, 0.97)),
    radial-gradient(circle at 16% 0%, rgba(244, 114, 182, 0.22), transparent 42%),
    radial-gradient(circle at 86% 8%, rgba(34, 211, 238, 0.12), transparent 34%),
    rgba(1, 2, 7, 0.96) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.035),
    inset 0 0 48px rgba(244, 114, 182, 0.08),
    0 26px 72px rgba(0, 0, 0, 0.72),
    0 0 42px rgba(244, 114, 182, 0.28) !important;
}

html body .market-popup-shell[data-market-mode="black-market"] .market-popup-title {
  color: #ffe8f4 !important;
  text-shadow:
    0 0 14px rgba(244, 114, 182, 0.82),
    0 0 30px rgba(34, 211, 238, 0.18) !important;
}

html body .market-popup-shell[data-market-mode="black-market"] .market-popup-row[data-resource-color] {
  --market-row-resource-rgb: var(--resource-accent-rgb, 103, 232, 249);
  border-color: rgba(var(--market-row-resource-rgb), 0.28) !important;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.92), rgba(var(--market-row-resource-rgb), 0.08) 42%, rgba(0, 0, 0, 0.9)),
    rgba(1, 2, 7, 0.94) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.045),
    inset 0 0 22px rgba(0, 0, 0, 0.5),
    0 12px 26px rgba(0, 0, 0, 0.32),
    0 0 16px rgba(var(--market-row-resource-rgb), 0.08) !important;
}

html body .market-popup-shell[data-market-mode="black-market"] .market-popup-row[data-resource-color]::before {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.96), rgba(var(--market-row-resource-rgb), 0.94), rgba(0, 0, 0, 0.96)) !important;
  box-shadow:
    0 0 12px rgba(var(--market-row-resource-rgb), 0.42),
    0 0 18px rgba(0, 0, 0, 0.7) !important;
}

html body .market-popup-shell[data-market-mode="black-market"] .market-popup-row[data-resource-color] .market-popup-row__stock::after {
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.96), rgba(var(--market-row-resource-rgb), 0.9)) !important;
  box-shadow: 0 0 12px rgba(var(--market-row-resource-rgb), 0.36) !important;
}

html body .market-popup-shell[data-market-mode="black-market"] .market-popup-row[data-resource-color] .market-popup-row__trade {
  border-color: rgba(var(--market-row-resource-rgb), 0.2) !important;
  background:
    linear-gradient(180deg, rgba(var(--market-row-resource-rgb), 0.055), rgba(0, 0, 0, 0.16)),
    rgba(1, 2, 7, 0.74) !important;
}

html body .market-popup-shell[data-market-mode="black-market"] .market-popup-row[data-resource-color] .market-popup-row__name {
  text-shadow:
    0 0 12px rgba(var(--market-row-resource-rgb), 0.34),
    0 0 18px rgba(0, 0, 0, 0.9) !important;
}

@media (min-width: 721px) {
  html body .market-popup-shell[data-market-mode="black-market"] .market-popup-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
  }

  html body .market-popup-shell[data-market-mode="black-market"] .market-popup-row {
    grid-template-columns: minmax(0, 1fr) !important;
    align-content: space-between !important;
    min-width: 0 !important;
  }

  html body .market-popup-shell[data-market-mode="black-market"] .market-popup-row__trade {
    grid-template-columns: minmax(72px, 0.7fr) minmax(0, 1fr) !important;
    min-width: 0 !important;
  }

  html body .market-popup-shell[data-market-mode="black-market"] .market-popup-row__actions {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }

  html body .market-popup-shell[data-market-mode="black-market"] .market-popup-row__actions[data-market-dual-buy="true"] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 5px !important;
  }

  html body .market-popup-shell[data-market-mode="black-market"] .market-popup-row__actions[data-market-dual-buy="true"] > .button {
    min-height: 32px !important;
    padding: 5px 6px !important;
    font-size: 0.62rem !important;
  }

  html body .market-popup-shell[data-market-mode="black-market"] .market-popup-row__buy[data-market-desktop-label] {
    font-size: 0 !important;
  }

  html body .market-popup-shell[data-market-mode="black-market"] .market-popup-row__buy[data-market-desktop-label]::after {
    content: attr(data-market-desktop-label);
    font-size: 0.62rem;
  }
}

/* Final loaded rule: mobile settings must render as a solid, opaque panel. */
@media (max-width: 720px), (hover: none) and (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body #settings-modal:not(.hidden),
  html body.mobile-settings-modal-open #settings-modal {
    background: #01040b !important;
    background-color: #01040b !important;
    background-image: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 9999 !important;
  }

  html body.mobile-settings-modal-open .game-shell {
    visibility: visible !important;
    pointer-events: auto !important;
  }

  html body #settings-modal:not(.hidden) > #settings-modal-backdrop.modal__backdrop,
  html body.mobile-settings-modal-open #settings-modal > #settings-modal-backdrop.modal__backdrop {
    background: #01040b !important;
    background-color: #01040b !important;
    background-image: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    animation: none !important;
    pointer-events: auto !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html body #settings-modal:not(.hidden) .modal__content.settings-modal__content,
  html body.mobile-settings-modal-open #settings-modal .modal__content.settings-modal__content {
    background: #030814 !important;
    background-color: #030814 !important;
    background-image: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    animation: none !important;
    pointer-events: auto !important;
    border: 1px solid rgba(103, 232, 249, 0.78) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.06),
      inset 0 0 34px rgba(34, 211, 238, 0.12),
      0 24px 58px rgba(0, 0, 0, 0.82),
      0 0 34px rgba(34, 211, 238, 0.3) !important;
    mix-blend-mode: normal !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html body #settings-modal:not(.hidden) .modal__content.settings-modal__content::after,
  html body.mobile-settings-modal-open #settings-modal .modal__content.settings-modal__content::after {
    background: none !important;
    opacity: 0 !important;
  }

  html body #settings-modal:not(.hidden) .settings-modal__content > .modal__header,
  html body.mobile-settings-modal-open #settings-modal .settings-modal__content > .modal__header {
    background: #061123 !important;
    background-color: #061123 !important;
    background-image: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    animation: none !important;
  }

  html body #settings-modal:not(.hidden) .settings-modal__body,
  html body.mobile-settings-modal-open #settings-modal .settings-modal__body {
    background: #020610 !important;
    background-color: #020610 !important;
    background-image: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    animation: none !important;
  }

  html body #settings-modal:not(.hidden) .settings-modal__row,
  html body.mobile-settings-modal-open #settings-modal .settings-modal__row {
    background: #071426 !important;
    background-color: #071426 !important;
    background-image: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    animation: none !important;
    border-color: rgba(103, 232, 249, 0.38) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html body #settings-modal:not(.hidden) .settings-modal__actions,
  html body.mobile-settings-modal-open #settings-modal .settings-modal__actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  html body #settings-modal:not(.hidden) .settings-modal__select select,
  html body.mobile-settings-modal-open #settings-modal .settings-modal__select select {
    background: #030812 !important;
    background-color: #030812 !important;
    background-image: none !important;
    width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #e6fbff !important;
  }

  html body #settings-modal:not(.hidden) *,
  html body.mobile-settings-modal-open #settings-modal * {
    visibility: visible !important;
  }
}

/* Final loaded override: make the Očista command visibly blink after imported CSS is cached. */
html body.game-body .city-status-ai-button {
  --purge-button-carmine: 196, 18, 48;
  --purge-button-carmine-hot: 255, 45, 96;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 100% !important;
  height: 100% !important;
  padding: 0 6px !important;
  border-radius: inherit !important;
  border-color: rgba(var(--purge-button-carmine-hot), 0.46) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.012)),
    linear-gradient(135deg, rgba(var(--purge-button-carmine), 0.34), rgba(var(--purge-button-carmine-hot), 0.18)),
    rgba(38, 5, 13, 0.58) !important;
  color: #fff2f5 !important;
  animation: cityStatusAiButtonBlink 4.8s ease-in-out infinite !important;
  will-change: border-color, background-color, box-shadow, color, filter;
}

html body.game-body .city-status-bar .city-status-pill--action {
  --city-status-accent: 255, 45, 96;
  --city-status-accent-alt: 196, 18, 48;
  display: block !important;
  height: 18px !important;
  padding: 0 !important;
  border-radius: 9px !important;
  border-color: rgba(255, 64, 112, 0.34) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.012)),
    linear-gradient(135deg, rgba(196, 18, 48, 0.28), rgba(255, 45, 96, 0.12)),
    rgba(38, 5, 13, 0.42) !important;
  overflow: hidden !important;
}

html body.game-body .city-status-bar .city-status-pill--action .city-status-pill__label {
  display: none !important;
}

html body.game-body #game-command-bar-mount {
  height: 20px !important;
  margin-top: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: visible !important;
  transform: translateY(0) !important;
}

html body.game-body #game-command-bar-mount .city-status-bar {
  height: 20px !important;
  align-items: center !important;
}

html body.game-body .city-status-bar .city-status-pill:first-child {
  display: grid !important;
  place-items: center !important;
  padding: 0 4px !important;
}

html body.game-body .city-status-bar .city-status-pill:first-child .city-status-pill__label {
  position: absolute !important;
  left: 4px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  text-align: left !important;
}

html body.game-body .city-status-bar .city-status-pill:first-child .city-status-pill__label::after {
  content: "Čas" !important;
  display: inline-block !important;
  color: rgba(var(--city-status-accent), 0.92) !important;
  font-size: 0.36rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.05em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

html body.game-body .city-status-bar .city-status-pill:first-child .city-status-pill__value {
  justify-self: center !important;
  width: auto !important;
  font-size: 0.68rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

html body.game-body .city-status-bar .city-status-pill:nth-child(4) {
  display: grid !important;
  place-items: center !important;
  padding: 0 4px !important;
}

html body.game-body .city-status-bar .city-status-pill:nth-child(4) .city-status-pill__label {
  position: absolute !important;
  left: 4px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  text-align: left !important;
}

html body.game-body .city-status-bar .city-status-pill:nth-child(4) .city-status-pill__label::after {
  content: "Hráči" !important;
  display: inline-block !important;
  color: rgba(var(--city-status-accent), 0.92) !important;
  font-size: 0.36rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.04em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

html body.game-body .city-status-bar .city-status-pill:nth-child(4) .city-status-pill__value {
  justify-self: center !important;
  width: auto !important;
  font-size: 0.66rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

@media (max-width: 780px), (hover: none) and (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body #game-command-bar-mount,
  html body.game-body #game-command-bar-mount .city-status-bar {
    height: 16px !important;
  }

  html body.game-body #game-command-bar-mount .city-status-pill,
  html body.game-body #game-command-bar-mount .city-status-pill--action {
    height: 15px !important;
    min-height: 0 !important;
    border-radius: 7px !important;
  }

  html body.game-body #game-command-bar-mount .city-status-ai-button {
    height: 100% !important;
    min-height: 100% !important;
    border-radius: 7px !important;
    font-size: 0.36rem !important;
  }

  html body.game-body #game-command-bar-mount .city-status-pill__value {
    font-size: 0.42rem !important;
  }
}

@keyframes cityStatusAiButtonBlink {
  0%, 100% {
    border-color: rgba(var(--purge-button-carmine), 0.54);
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.01)),
      linear-gradient(135deg, rgba(var(--purge-button-carmine), 0.32), rgba(148, 10, 32, 0.16)),
      rgba(34, 5, 12, 0.58);
    color: #ffdce6;
    text-shadow: 0 0 7px rgba(var(--purge-button-carmine), 0.34);
    box-shadow:
      0 0 8px rgba(var(--purge-button-carmine), 0.24),
      inset 0 0 0 1px rgba(255, 255, 255, 0.04);
    filter: brightness(0.96) saturate(1.08);
  }
  48%, 58% {
    border-color: rgba(var(--purge-button-carmine-hot), 0.96);
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.014)),
      linear-gradient(135deg, rgba(var(--purge-button-carmine-hot), 0.4), rgba(var(--purge-button-carmine), 0.24)),
      rgba(48, 6, 16, 0.66);
    color: #ffffff;
    text-shadow:
      0 0 8px rgba(255, 255, 255, 0.78),
      0 0 16px rgba(var(--purge-button-carmine-hot), 0.78);
    box-shadow:
      0 0 16px rgba(var(--purge-button-carmine-hot), 0.58),
      0 0 30px rgba(var(--purge-button-carmine), 0.34),
      inset 0 0 0 1px rgba(255, 255, 255, 0.08);
    filter: brightness(1.2) saturate(1.22);
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.game-body .city-status-ai-button {
    animation: none !important;
  }
}

@media (min-width: 781px) {
  html body.game-body #game-rail-left.sidebar-shell.game-rail,
  html body.game-body #game-rail-right.sidebar-shell.game-rail {
    box-sizing: border-box !important;
    align-self: start !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 8px !important;
    border: 1px solid rgba(148, 163, 184, 0.08) !important;
    border-radius: 18px !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.024), rgba(255, 255, 255, 0.004)),
      rgba(2, 6, 13, 0.24) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.012),
      0 14px 34px rgba(0, 0, 0, 0.12) !important;
    backdrop-filter: blur(9px) saturate(1.04) !important;
    -webkit-backdrop-filter: blur(9px) saturate(1.04) !important;
  }

  html body.game-body #game-left-nav {
    padding-top: 0 !important;
  }
}

/* Final loaded building-card overrides: keep warehouse mobile layout and industrial close color stable. */
html body.game-body .district-building-detail-shell[data-building-district-type="industrial"] .district-building-detail-card .modal__close,
html body.game-body .district-building-detail-shell[data-building-district-type="industry"] .district-building-detail-card .modal__close,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="warehouse"] .district-building-detail-card .modal__close {
  color: #ffffff !important;
  text-shadow:
    0 0 8px rgba(255, 255, 255, 0.48),
    0 0 14px rgba(226, 232, 240, 0.28) !important;
}

html body.game-body .district-building-detail-shell[data-building-district-type="industrial"] .district-building-detail-card .modal__close:hover,
html body.game-body .district-building-detail-shell[data-building-district-type="industrial"] .district-building-detail-card .modal__close:focus-visible,
html body.game-body .district-building-detail-shell[data-building-district-type="industry"] .district-building-detail-card .modal__close:hover,
html body.game-body .district-building-detail-shell[data-building-district-type="industry"] .district-building-detail-card .modal__close:focus-visible,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="warehouse"] .district-building-detail-card .modal__close:hover,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="warehouse"] .district-building-detail-card .modal__close:focus-visible {
  color: #ffffff !important;
}

html body.game-body .district-building-detail-shell[data-building-district-type="industrial"] .district-building-detail-card .modal__close::before,
html body.game-body .district-building-detail-shell[data-building-district-type="industry"] .district-building-detail-card .modal__close::before,
html body.game-body .district-building-detail-shell[data-building-mechanics-type="warehouse"] .district-building-detail-card .modal__close::before {
  color: #ffffff !important;
  text-shadow:
    0 0 8px rgba(255, 255, 255, 0.62),
    0 0 14px rgba(226, 232, 240, 0.34) !important;
  filter: none !important;
}

@media (max-width: 720px) {
  html body.game-body .district-building-detail-shell[data-building-mechanics-type="power-plant"].is-building-detail-single-panel .district-building-detail-card .district-building-detail-panel--merged {
    gap: 4px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="power-plant"] .district-building-detail-card .building-info-card__section {
    gap: 3px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="power-plant"] .district-building-detail-card [data-district-building-detail-effects-section] {
    margin-top: 0 !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="power-plant"] .district-building-detail-card [data-district-building-detail-effects-section] > h5 {
    margin-bottom: 3px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="power-plant"] .district-building-detail-card .building-info-card__effects {
    margin-top: 0 !important;
    gap: 5px !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="warehouse"] .district-building-detail-mechanics {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    justify-items: stretch !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="warehouse"] .district-building-detail-mechanic-row {
    width: 100% !important;
    min-width: 0 !important;
    padding: 8px 6px !important;
  }

  html body.game-body .district-building-detail-shell[data-building-mechanics-type="warehouse"] .district-building-detail-mechanic-row strong {
    min-width: 0 !important;
    font-size: 0.68rem !important;
    line-height: 1.12 !important;
    overflow-wrap: anywhere !important;
  }
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="warehouse"] .district-building-detail-card .building-info-card__effects {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  row-gap: 20px !important;
  column-gap: 0 !important;
}

html body.game-body .district-building-detail-shell[data-building-mechanics-type="warehouse"] .district-building-detail-card .district-building-detail-effect-cell {
  width: 100% !important;
  align-self: stretch !important;
}

/* Final loaded override: desktop street news shows four compact rows, then scrolls. */
@media (min-width: 721px) {
  html body.game-body .building-action-status__feed {
    --street-news-row-height: 38px;
    --street-news-row-gap: 8px;
    display: grid !important;
    grid-auto-rows: max-content !important;
    gap: var(--street-news-row-gap) !important;
    align-content: start !important;
    align-items: start !important;
    max-height: calc((var(--street-news-row-height) * 4) + (var(--street-news-row-gap) * 3)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain !important;
    padding-right: 8px !important;
    scrollbar-gutter: stable !important;
  }

  html body.game-body .building-action-status__item {
    min-height: var(--street-news-row-height) !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    align-self: start !important;
  }

  html body.game-body .building-action-status__item-summary,
  html body.game-body .building-action-status__item-meta {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    white-space: normal !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere !important;
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
  }

  html body.game-body .building-action-status__item--clickable {
    min-height: 38px !important;
    padding-block: 8px !important;
    gap: 0 !important;
  }

  html body.game-body .building-action-status__item--clickable .building-action-status__item-title {
    font-size: 0.62rem !important;
    line-height: 1.18 !important;
  }

  html body.game-body .building-action-status__item--clickable .building-action-status__item-summary,
  html body.game-body .building-action-status__item--clickable .building-action-status__item-meta {
    display: none !important;
  }
}

@media (max-width: 720px), (hover: none) and (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body .building-action-status__feed {
    --street-news-row-height: 38px;
    --street-news-row-gap: 7px;
    display: grid !important;
    grid-auto-rows: max-content !important;
    gap: var(--street-news-row-gap) !important;
    align-content: start !important;
    align-items: start !important;
    max-height: calc((var(--street-news-row-height) * 6) + (var(--street-news-row-gap) * 5)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain !important;
    padding-right: 0 !important;
    scrollbar-gutter: auto !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    -webkit-overflow-scrolling: touch !important;
  }

  html body.game-body .building-action-status__feed::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
  }
}

html body.game-body .building-action-status__item--clickable {
  --street-news-action-rgb: 103, 232, 249;
  border-color: rgba(var(--street-news-action-rgb), 0.2) !important;
  background: rgba(var(--street-news-action-rgb), 0.1) !important;
  box-shadow: inset 0 0 0 1px rgba(var(--street-news-action-rgb), 0.05) !important;
}

html body.game-body .building-action-status__item--clickable::before {
  background: rgb(var(--street-news-action-rgb)) !important;
  box-shadow: none !important;
}

html body.game-body .building-action-status__item--clickable .building-action-status__item-title {
  color: color-mix(in srgb, rgb(var(--street-news-action-rgb)) 24%, #f8fafc) !important;
  text-shadow: none !important;
}

html body.game-body .building-action-status__item--clickable:hover,
html body.game-body .building-action-status__item--clickable:focus-visible {
  border-color: rgba(var(--street-news-action-rgb), 0.32) !important;
  background: rgba(var(--street-news-action-rgb), 0.14) !important;
  box-shadow: inset 0 0 0 1px rgba(var(--street-news-action-rgb), 0.08) !important;
}

html body.game-body .building-action-status__item--cooldown {
  min-height: 30px !important;
  padding: 6px 10px 6px 14px !important;
  gap: 0 !important;
}

html body.game-body .building-action-status__item--cooldown .building-action-status__item-head {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  min-width: 0 !important;
  width: 100% !important;
}

html body.game-body .building-action-status__item--cooldown .building-action-status__item-title {
  flex: 0 0 auto !important;
  min-width: 0 !important;
  padding: 2px 6px !important;
  border: 1px solid rgba(var(--street-news-action-rgb, 103, 232, 249), 0.22) !important;
  border-radius: 999px !important;
  color: rgba(226, 246, 255, 0.78) !important;
  font-size: 0.5rem !important;
  line-height: 1.05 !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
  background: rgba(var(--street-news-action-rgb, 103, 232, 249), 0.08) !important;
  white-space: nowrap !important;
}

html body.game-body .building-action-status__item-inline-summary,
html body.game-body .building-action-status__item-inline-meta {
  display: inline-flex !important;
  align-items: center !important;
  min-width: 0 !important;
  color: rgba(238, 246, 252, 0.9) !important;
  font-size: 0.64rem !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body.game-body .building-action-status__item-inline-summary {
  flex: 1 1 auto !important;
}

html body.game-body .building-action-status__item-inline-meta {
  flex: 0 0 auto !important;
  color: rgba(176, 190, 206, 0.78) !important;
  font-size: 0.56rem !important;
}

html body.game-body .building-action-status__item--cooldown .building-action-status__item-controls {
  margin-left: auto !important;
}

html body.game-body .building-action-status__item--cooldown .building-action-status__item-summary,
html body.game-body .building-action-status__item--cooldown .building-action-status__item-meta {
  display: none !important;
}

@media (min-width: 721px) {
  html body.game-body .building-action-status__item--cooldown {
    min-height: 38px !important;
    padding: 7px 10px 7px 14px !important;
  }

  html body.game-body .building-action-status__item--cooldown .building-action-status__item-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) max-content;
    grid-template-areas:
      "title controls"
      "summary meta";
    column-gap: 10px !important;
    row-gap: 3px !important;
    align-items: center !important;
  }

  html body.game-body .building-action-status__item--cooldown .building-action-status__item-title {
    grid-area: title;
    justify-self: start;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    font-size: 0.54rem !important;
    line-height: 1.05 !important;
  }

  html body.game-body .building-action-status__item--cooldown .building-action-status__item-inline-summary {
    grid-area: summary;
    min-width: 0 !important;
    font-size: 0.68rem !important;
  }

  html body.game-body .building-action-status__item--cooldown .building-action-status__item-inline-meta {
    grid-area: meta;
    justify-self: end !important;
    max-width: 100% !important;
    font-size: 0.58rem !important;
    text-align: right !important;
  }

  html body.game-body .building-action-status__item--cooldown .building-action-status__item-controls {
    grid-area: controls;
  }
}

html body.game-body .building-action-status__item--kind-police {
  --street-news-action-rgb: 59, 130, 246;
}

html body.game-body .building-action-status__item--kind-attack,
html body.game-body .building-action-status__item--kind-attack-warning {
  --street-news-action-rgb: 239, 68, 68;
}

html body.game-body .building-action-status__item--kind-raid {
  --street-news-action-rgb: 245, 158, 11;
}

html body.game-body .building-action-status__item--kind-spy,
html body.game-body .building-action-status__item--kind-spy-alert {
  --street-news-action-rgb: 34, 211, 238;
}

html body.game-body .building-action-status__item--kind-occupy {
  --street-news-action-rgb: 34, 197, 94;
}

html body.game-body .building-action-status__item--kind-market {
  --street-news-action-rgb: 250, 204, 21;
}

html body.game-body .building-action-status__item--kind-elimination {
  --street-news-action-rgb: 168, 85, 247;
}

/* Final loaded override: mobile player profile info uses two compact columns. */
@media (max-width: 720px) {
  html body.game-body .player-popup-body {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    align-content: start !important;
  }

  html body.game-body .player-popup-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 3px !important;
    min-width: 0 !important;
    min-height: 48px !important;
    padding: 7px 8px !important;
  }

  html body.game-body .player-popup-row span,
  html body.game-body .player-popup-row strong {
    max-width: 100% !important;
    width: 100% !important;
    text-align: left !important;
    white-space: normal !important;
  }

  html body.game-body .player-popup-row span {
    font-size: 9.5px !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    color: rgba(186, 230, 253, 0.78) !important;
  }

  html body.game-body .player-popup-row strong {
    font-size: 12px !important;
    line-height: 1.15 !important;
    overflow-wrap: anywhere !important;
  }
}

/* Final loaded parity pass: district action buttons keep desktop colors on phones. */
@media (max-width: 720px), (hover: none) and (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body .district-popup-action[data-district-action-id] {
    border-color: rgba(var(--district-action-rgb), 0.34) !important;
    background:
      linear-gradient(135deg, rgba(var(--district-action-rgb), 0.17), rgba(var(--district-action-secondary-rgb), 0.08) 46%, rgba(6, 10, 18, 0.66)),
      rgba(6, 10, 18, 0.44) !important;
    color: var(--district-action-text) !important;
    text-shadow: 0 0 8px rgba(var(--district-action-rgb), 0.24) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.1),
      0 8px 18px rgba(2, 6, 23, 0.22),
      0 0 14px rgba(var(--district-action-rgb), 0.11) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id]::before {
    inset: 0 !important;
    width: auto !important;
    border-radius: inherit !important;
    background:
      linear-gradient(90deg, rgba(255, 255, 255, 0.13), transparent 30%, transparent 78%, rgba(var(--district-action-rgb), 0.12)),
      repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.045) 0 1px, transparent 1px 8px) !important;
    opacity: 0.26 !important;
  }

  html body.game-body .district-popup-action[data-district-action-id]::after {
    inset: 0 auto 0 0 !important;
    width: 2px !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgb(var(--district-action-rgb)), rgb(var(--district-action-secondary-rgb))) !important;
    box-shadow: 0 0 12px rgba(var(--district-action-rgb), 0.62) !important;
    opacity: 1 !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="defense"] {
    --district-action-rgb: 96, 165, 250;
    --district-action-secondary-rgb: 34, 211, 238;
    --district-action-text: #eaf5ff;
  }

  html body.game-body .district-popup-action[data-district-action-id="trap"] {
    --district-action-rgb: 45, 212, 191;
    --district-action-secondary-rgb: 34, 197, 94;
    --district-action-text: #eafff8;
  }

  html body.game-body .district-popup-action[data-district-action-id="spy"] {
    --district-action-rgb: 250, 204, 21;
    --district-action-secondary-rgb: 236, 72, 153;
    --district-action-text: #fff9d7;
  }

  html body.game-body .district-popup-action[data-district-action-id="rob"] {
    --district-action-rgb: 34, 211, 238;
    --district-action-secondary-rgb: 168, 85, 247;
    --district-action-text: #e8fdff;
  }

  html body.game-body .district-popup-action[data-district-action-id="heist"] {
    --district-action-rgb: 244, 114, 182;
    --district-action-secondary-rgb: 168, 85, 247;
    --district-action-text: #fff0fa;
  }

  html body.game-body .district-popup-action[data-district-action-id="attack"] {
    --district-action-rgb: 248, 113, 113;
    --district-action-secondary-rgb: 251, 146, 60;
    --district-action-text: #fff1f2;
  }

  html body.game-body .district-popup-action[data-district-action-id="occupy"] {
    --district-action-rgb: 220, 20, 60;
    --district-action-secondary-rgb: 136, 19, 55;
    --district-action-text: #ffe7ee;
  }
}

/* Final interaction guard: overlays behave like app sheets and never leak taps to the map/topbar behind them. */
html body.game-body {
  -webkit-tap-highlight-color: transparent;
}

html body.game-body,
html body.game-body * {
  -webkit-touch-callout: none;
}

@media (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body,
  html body.game-body *:not(input):not(textarea):not(select):not([contenteditable="true"]) {
    -webkit-user-select: none;
    user-select: none;
  }

  html body.game-body button,
  html body.game-body [role="button"],
  html body.game-body .button,
  html body.game-body .district-popup-card,
  html body.game-body .modal__content,
  html body.game-body .storage-popup-card {
    touch-action: manipulation;
  }

  html body.game-modal-scroll-locked .game-resource-strip,
  html body.game-modal-scroll-locked .resource-pill,
  html body.game-modal-scroll-locked .game-toolbar-button,
  html body.game-modal-scroll-locked .game-topbar,
  html body.game-modal-scroll-locked #game-header {
    pointer-events: none !important;
  }

  html body.game-modal-scroll-locked {
    --district-mobile-resource-clearance: 0px;
  }

  html body.game-modal-scroll-locked .district-popup-shell:not([hidden]) {
    z-index: 12000 !important;
    padding-top: var(--district-mobile-resource-clearance, 0px) !important;
  }

  html body.game-modal-scroll-locked .district-popup-shell:not([hidden]) .district-popup-card {
    max-height: calc(
      var(--mobile-locked-vh, 100svh)
      - var(--district-mobile-resource-clearance, 0px)
      - max(8px, env(safe-area-inset-bottom))
    ) !important;
  }
}

html body.game-body .storage-popup-shell[data-storage-popup]:not([hidden]) {
  /* Storage is a priority window and must stay above every action/result modal. */
  z-index: 50000 !important;
  pointer-events: auto !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

html body.game-body .storage-popup-shell[data-storage-popup]:not([hidden]) .storage-popup-backdrop {
  z-index: 50001 !important;
  pointer-events: auto !important;
}

html body.game-body .storage-popup-shell[data-storage-popup]:not([hidden]) .storage-popup-card {
  z-index: 50002 !important;
  pointer-events: auto !important;
}

html body.game-body.game-modal-scroll-locked #game-header,
html body.game-body.game-modal-scroll-locked .game-topbar {
  z-index: 27050 !important;
  pointer-events: auto !important;
}

html body.game-body.game-modal-scroll-locked .game-topbar *,
html body.game-body.game-modal-scroll-locked .game-topbar .game-resource-strip,
html body.game-body.game-modal-scroll-locked .game-topbar .resource-pill,
html body.game-body.game-modal-scroll-locked .game-topbar .game-toolbar-button {
  pointer-events: auto !important;
}

@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body .storage-popup-shell[data-storage-popup]:not([hidden]) {
    padding: max(10px, env(safe-area-inset-top)) 8px max(10px, env(safe-area-inset-bottom)) !important;
  }

  html body.game-body .storage-popup-shell[data-storage-popup]:not([hidden]) .storage-popup-card {
    top: 50% !important;
    left: 50% !important;
    margin: 0 !important;
    max-height: calc(100dvh - max(20px, env(safe-area-inset-top)) - max(20px, env(safe-area-inset-bottom))) !important;
    transform: translate(-50%, -50%) !important;
  }
}

/* Final mobile desktop parity: district action buttons use desktop action skins. */
@media (max-width: 720px), (hover: none) and (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body .district-popup-actions {
    gap: 6px !important;
    padding-top: 6px !important;
    border-top-color: rgba(var(--district-accent-rgb), 0.22) !important;
  }

  html body.game-body .district-popup-action-row {
    min-width: 0 !important;
    display: grid !important;
    gap: 3px !important;
  }

  html body.game-body .district-popup-action[data-district-action-id] {
    width: 100% !important;
    min-height: 46px !important;
    grid-column: auto !important;
    padding: 8px 10px 9px !important;
    overflow: hidden !important;
    border: 1px solid rgba(var(--district-action-rgb), 0.34) !important;
    border-radius: 7px !important;
    background:
      linear-gradient(135deg, rgba(var(--district-action-rgb), 0.17), rgba(var(--district-action-secondary-rgb), 0.08) 46%, rgba(6, 10, 18, 0.66)),
      rgba(6, 10, 18, 0.44) !important;
    color: var(--district-action-text) !important;
    text-align: left !important;
    letter-spacing: 0 !important;
    text-shadow: 0 0 8px rgba(var(--district-action-rgb), 0.24) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.1),
      0 8px 18px rgba(2, 6, 23, 0.22),
      0 0 14px rgba(var(--district-action-rgb), 0.11) !important;
    backdrop-filter: blur(12px) saturate(130%) !important;
    -webkit-backdrop-filter: blur(12px) saturate(130%) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id]::before {
    inset: 0 !important;
    width: auto !important;
    border-radius: inherit !important;
    background:
      linear-gradient(90deg, rgba(255, 255, 255, 0.13), transparent 30%, transparent 78%, rgba(var(--district-action-rgb), 0.12)),
      repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.045) 0 1px, transparent 1px 8px) !important;
    opacity: 0.26 !important;
  }

  html body.game-body .district-popup-action[data-district-action-id]::after {
    inset: 0 auto 0 0 !important;
    width: 2px !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgb(var(--district-action-rgb)), rgb(var(--district-action-secondary-rgb))) !important;
    box-shadow: 0 0 12px rgba(var(--district-action-rgb), 0.62) !important;
    opacity: 1 !important;
  }

  html body.game-body .district-popup-action__label {
    max-width: 100% !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    color: inherit !important;
    font-size: 0.66rem !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
    line-height: 1.08 !important;
  }

  html body.game-body .district-popup-action__sub {
    max-width: 100% !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    color: rgba(236, 248, 255, 0.68) !important;
    font-size: 0.54rem !important;
    letter-spacing: 0 !important;
    line-height: 1.18 !important;
  }

  html body.game-body .district-popup-action--countdown {
    min-height: 46px !important;
    line-height: 1.05 !important;
  }

  html body.game-body .district-popup-action__countdown {
    position: absolute !important;
    right: 7px !important;
    bottom: 5px !important;
    z-index: 2 !important;
    color: #facc15 !important;
    font-size: 0.5rem !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-shadow: 0 0 8px rgba(250, 204, 21, 0.42) !important;
    pointer-events: none !important;
  }

  html body.game-body .district-popup-action--countdown .district-popup-action__label {
    padding-right: 42px !important;
  }

  html body.game-body .district-popup-action--countdown:disabled {
    border-color: rgba(148, 163, 184, 0.3) !important;
    background:
      linear-gradient(135deg, rgba(71, 85, 105, 0.54), rgba(15, 23, 42, 0.7)),
      rgba(15, 23, 42, 0.62) !important;
    color: rgba(226, 232, 240, 0.72) !important;
    opacity: 1 !important;
    filter: saturate(0.48) !important;
    cursor: not-allowed !important;
  }

  html body.game-body .district-popup-action--countdown {
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    padding-bottom: 9px !important;
  }

  html body.game-body .district-popup-action--countdown .district-popup-action__label {
    width: 100% !important;
    padding: 0 8px !important;
    text-align: center !important;
    justify-self: center !important;
    align-self: center !important;
    transform: none !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="defense"] {
    --district-action-rgb: 96, 165, 250;
    --district-action-secondary-rgb: 34, 211, 238;
    --district-action-text: #d9f7ff;
    border-color: rgba(96, 165, 250, 0.42) !important;
    background:
      linear-gradient(180deg, rgba(37, 99, 235, 0.96), rgba(29, 78, 216, 0.76)) !important;
    color: #d9f7ff !important;
    box-shadow:
      0 16px 34px rgba(37, 99, 235, 0.24),
      inset 0 1px 0 rgba(191, 219, 254, 0.26),
      inset 0 0 0 1px rgba(59, 130, 246, 0.14) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="trap"] {
    --district-action-rgb: 45, 212, 191;
    --district-action-secondary-rgb: 34, 197, 94;
    --district-action-text: #d1fae5;
    border-color: rgba(45, 212, 191, 0.34) !important;
    background:
      linear-gradient(180deg, rgba(17, 94, 89, 0.94), rgba(15, 118, 110, 0.74)) !important;
    color: #d1fae5 !important;
    box-shadow:
      0 16px 34px rgba(13, 148, 136, 0.2),
      inset 0 1px 0 rgba(153, 246, 228, 0.18) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="trap"][data-district-trap-state="active"] {
    --district-action-rgb: 148, 163, 184;
    --district-action-secondary-rgb: 71, 85, 105;
    --district-action-text: rgba(226, 232, 240, 0.76);
    border-color: rgba(148, 163, 184, 0.32) !important;
    background:
      linear-gradient(135deg, rgba(71, 85, 105, 0.58), rgba(15, 23, 42, 0.72)),
      rgba(15, 23, 42, 0.66) !important;
    color: rgba(226, 232, 240, 0.76) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.08),
      0 8px 18px rgba(2, 6, 23, 0.18) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="trap"][data-district-trap-state="cooldown"] .district-popup-action__sub {
    color: rgba(167, 243, 208, 0.88) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="spy"] {
    --district-action-rgb: 251, 191, 36;
    --district-action-secondary-rgb: 161, 98, 7;
    --district-action-text: #fff8e1;
    border-color: rgba(251, 191, 36, 0.42) !important;
    background:
      linear-gradient(135deg, rgba(120, 53, 15, 0.96), rgba(161, 98, 7, 0.9)) !important;
    color: #fff8e1 !important;
    box-shadow:
      0 18px 36px rgba(180, 83, 9, 0.24),
      0 0 18px rgba(251, 191, 36, 0.14),
      inset 0 1px 0 rgba(254, 243, 199, 0.14) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="spy"] .district-popup-action__sub {
    color: rgba(255, 243, 173, 0.92) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="spy"][data-district-action-disabled-tone="no-spies"]:disabled {
    --district-action-rgb: 148, 163, 184;
    --district-action-secondary-rgb: 71, 85, 105;
    --district-action-text: rgba(226, 232, 240, 0.76);
    border-color: rgba(148, 163, 184, 0.3) !important;
    background:
      linear-gradient(135deg, rgba(71, 85, 105, 0.54), rgba(15, 23, 42, 0.72)),
      rgba(15, 23, 42, 0.64) !important;
    color: rgba(226, 232, 240, 0.76) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.08),
      0 8px 18px rgba(2, 6, 23, 0.18) !important;
    filter: saturate(0.5) !important;
    opacity: 1 !important;
    cursor: not-allowed !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="spy"][data-district-action-disabled-tone="no-spies"] .district-popup-action__sub {
    color: #f87171 !important;
    font-weight: 900 !important;
    text-shadow: 0 0 8px rgba(248, 113, 113, 0.32) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="rob"] {
    --district-action-rgb: 34, 211, 238;
    --district-action-secondary-rgb: 15, 118, 110;
    --district-action-text: #ecfeff;
    border-color: rgba(34, 211, 238, 0.4) !important;
    background:
      linear-gradient(135deg, rgba(8, 47, 73, 0.96), rgba(15, 118, 110, 0.9)) !important;
    color: #ecfeff !important;
    box-shadow:
      0 18px 36px rgba(8, 145, 178, 0.24),
      0 0 18px rgba(34, 211, 238, 0.14),
      inset 0 1px 0 rgba(207, 250, 254, 0.14) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="heist"] {
    --district-action-rgb: 244, 114, 182;
    --district-action-secondary-rgb: 168, 85, 247;
    --district-action-text: #fff0fa;
    border-color: rgba(244, 114, 182, 0.42) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="attack"] {
    --district-action-rgb: 248, 113, 113;
    --district-action-secondary-rgb: 127, 29, 29;
    --district-action-text: #fff1f2;
    border-color: rgba(248, 113, 113, 0.42) !important;
    background:
      linear-gradient(135deg, rgba(127, 29, 29, 0.96), rgba(24, 24, 27, 0.94)) !important;
    color: #fff1f2 !important;
    box-shadow:
      0 18px 36px rgba(127, 29, 29, 0.3),
      0 0 20px rgba(248, 113, 113, 0.16),
      inset 0 1px 0 rgba(254, 202, 202, 0.12) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="occupy"] {
    --district-action-rgb: 220, 20, 60;
    --district-action-secondary-rgb: 136, 19, 55;
    --district-action-text: #ffe7ee;
    border-color: rgba(220, 20, 60, 0.5) !important;
    background:
      linear-gradient(135deg, rgba(136, 19, 55, 0.96), rgba(64, 8, 24, 0.92)) !important;
    color: #ffe7ee !important;
    box-shadow:
      0 18px 36px rgba(136, 19, 55, 0.28),
      0 0 20px rgba(220, 20, 60, 0.18),
      inset 0 1px 0 rgba(255, 205, 217, 0.14) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="attack"]::before {
    background: linear-gradient(120deg, rgba(254, 202, 202, 0.08), transparent 38%, transparent 72%, rgba(248, 113, 113, 0.12)) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="rob"]::before {
    background: linear-gradient(120deg, rgba(125, 211, 252, 0.14), transparent 36%, transparent 72%, rgba(45, 212, 191, 0.12)) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="spy"]::before {
    background: linear-gradient(120deg, rgba(253, 224, 71, 0.14), transparent 36%, transparent 72%, rgba(251, 191, 36, 0.12)) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="occupy"]::before {
    background: linear-gradient(120deg, rgba(255, 205, 217, 0.12), transparent 36%, transparent 72%, rgba(220, 20, 60, 0.16)) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="defense"]::before {
    background: linear-gradient(120deg, rgba(125, 211, 252, 0.18), transparent 36%, transparent 68%, rgba(191, 219, 254, 0.16)) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id="trap"]::before {
    background: linear-gradient(120deg, rgba(153, 246, 228, 0.16), transparent 36%, transparent 68%, rgba(45, 212, 191, 0.12)) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id].district-popup-action--countdown,
  html body.game-body .district-popup-action[data-district-action-id].district-popup-action--countdown:disabled {
    --district-action-rgb: 148, 163, 184;
    --district-action-secondary-rgb: 71, 85, 105;
    --district-action-text: rgba(226, 232, 240, 0.78);
    border-color: rgba(148, 163, 184, 0.32) !important;
    background:
      linear-gradient(135deg, rgba(71, 85, 105, 0.58), rgba(15, 23, 42, 0.72)),
      rgba(15, 23, 42, 0.66) !important;
    color: rgba(226, 232, 240, 0.78) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.08),
      0 8px 18px rgba(2, 6, 23, 0.18) !important;
    opacity: 1 !important;
    filter: saturate(0.48) !important;
    cursor: not-allowed !important;
  }

  html body.game-body .district-popup-action[data-district-action-id].district-popup-action--countdown::before {
    background:
      linear-gradient(90deg, rgba(255, 255, 255, 0.08), transparent 34%, transparent 76%, rgba(148, 163, 184, 0.12)),
      repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 8px) !important;
  }

  html body.game-body .district-popup-action[data-district-action-id].district-popup-action--countdown::after {
    background: linear-gradient(180deg, rgb(148, 163, 184), rgb(71, 85, 105)) !important;
    box-shadow: 0 0 12px rgba(148, 163, 184, 0.34) !important;
  }
}

/* Final gang profile transparency override. */
html body.game-body #game-gang-panel-mount.gang-profile-panel {
  border-color: rgba(12, 18, 28, 0.72) !important;
  background: rgba(0, 0, 0, 0.18) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.012),
    0 16px 34px rgba(0, 0, 0, 0.22) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body.game-body #game-gang-panel-mount.gang-profile-panel::before,
html body.game-body #game-gang-panel-mount.gang-profile-panel::after {
  opacity: 0.12 !important;
  background: linear-gradient(90deg, transparent, rgba(103, 232, 249, 0.34), transparent) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body.game-body #profile-gang-card.right-panel-card {
  --gang-profile-player-color: #67e8f9;
  border-color: rgba(15, 23, 42, 0.72) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(34, 211, 238, 0.032), transparent 38%),
    radial-gradient(circle at 100% 18%, rgba(250, 204, 21, 0.025), transparent 34%),
    linear-gradient(145deg, rgba(0, 0, 0, 0.72), rgba(3, 5, 10, 0.66) 52%, rgba(0, 0, 0, 0.7)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.014),
    inset 0 0 30px rgba(0, 0, 0, 0.34),
    0 16px 32px rgba(0, 0, 0, 0.34) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body.game-body #profile-gang-card.right-panel-card::before {
  opacity: 0.16 !important;
}

html body.game-body #profile-gang-card.right-panel-card::after {
  opacity: 0.34 !important;
}

html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), transparent),
    rgba(4, 10, 18, 0.28) !important;
  border-color: rgba(103, 232, 249, 0.13) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.012),
    0 6px 14px rgba(0, 0, 0, 0.12) !important;
}

html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--alliance {
  background:
    linear-gradient(90deg, rgba(168, 85, 247, 0.16), transparent 62%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), transparent),
    rgba(13, 8, 28, 0.34) !important;
  border-color: rgba(196, 181, 253, 0.28) !important;
  box-shadow:
    inset 2px 0 0 rgba(168, 85, 247, 0.55),
    inset 0 0 0 1px rgba(255, 255, 255, 0.014),
    0 6px 14px rgba(0, 0, 0, 0.12) !important;
}

html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--districts {
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--gang-profile-player-color, #67e8f9) 22%, transparent), transparent 62%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), transparent),
    color-mix(in srgb, var(--gang-profile-player-color, #67e8f9) 8%, rgba(4, 10, 18, 0.28)) !important;
  border-color: color-mix(in srgb, var(--gang-profile-player-color, #67e8f9) 36%, transparent) !important;
  box-shadow:
    inset 2px 0 0 color-mix(in srgb, var(--gang-profile-player-color, #67e8f9) 62%, transparent),
    inset 0 0 0 1px rgba(255, 255, 255, 0.014),
    0 6px 14px rgba(0, 0, 0, 0.12) !important;
}

html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--wanted {
  background:
    linear-gradient(90deg, rgba(239, 68, 68, 0.17), transparent 62%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), transparent),
    rgba(30, 8, 10, 0.32) !important;
  border-color: rgba(248, 113, 113, 0.3) !important;
  box-shadow:
    inset 2px 0 0 rgba(239, 68, 68, 0.62),
    inset 0 0 0 1px rgba(255, 255, 255, 0.014),
    0 6px 14px rgba(0, 0, 0, 0.12) !important;
}

html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--members {
  background:
    linear-gradient(90deg, rgba(187, 247, 208, 0.22), transparent 62%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), transparent),
    rgba(6, 28, 18, 0.34) !important;
  border-color: rgba(134, 239, 172, 0.36) !important;
  box-shadow:
    inset 2px 0 0 rgba(74, 222, 128, 0.68),
    inset 0 0 0 1px rgba(255, 255, 255, 0.014),
    0 0 16px rgba(74, 222, 128, 0.12),
    0 6px 14px rgba(0, 0, 0, 0.12) !important;
}

html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--faction {
  background:
    linear-gradient(90deg, rgba(250, 204, 21, 0.15), transparent 58%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), transparent),
    linear-gradient(135deg, rgba(2, 6, 13, 0.42), rgba(24, 20, 9, 0.34)) !important;
  border-color: rgba(250, 204, 21, 0.32) !important;
  box-shadow:
    inset 2px 0 0 rgba(250, 204, 21, 0.62),
    inset 0 0 0 1px rgba(255, 255, 255, 0.014),
    0 6px 14px rgba(0, 0, 0, 0.12) !important;
}

html body.game-body #profile-gang-card.right-panel-card .profile-row--alliance .gang-profile-row__label,
html body.game-body #profile-gang-card.right-panel-card .profile-row--alliance > span:last-child {
  color: rgba(233, 213, 255, 0.94) !important;
}

html body.game-body #profile-gang-card.right-panel-card .profile-row--districts > span:last-child {
  color: color-mix(in srgb, var(--gang-profile-player-color, #67e8f9) 72%, #ffffff) !important;
  text-shadow: 0 0 12px color-mix(in srgb, var(--gang-profile-player-color, #67e8f9) 34%, transparent) !important;
}

html body.game-body #profile-gang-card.right-panel-card .profile-row--wanted .gang-profile-row__label,
html body.game-body #profile-gang-card.right-panel-card .profile-row--wanted .profile-heat-panel {
  color: rgba(254, 202, 202, 0.96) !important;
}

html body.game-body #profile-gang-card.right-panel-card .profile-row--members .gang-profile-row__label,
html body.game-body #profile-gang-card.right-panel-card .profile-row--members > span:last-child {
  color: rgba(220, 252, 231, 0.98) !important;
  text-shadow: 0 0 12px rgba(134, 239, 172, 0.32) !important;
}

html body.game-body #profile-gang-card.right-panel-card :is(
  .profile-row--members,
  .profile-row--faction,
  .profile-row--alliance
) {
  border-color: rgba(255, 255, 255, 0.14) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.045), transparent 58%),
    rgba(0, 0, 0, 0.58) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    inset 0 0 16px rgba(0, 0, 0, 0.32),
    0 6px 14px rgba(0, 0, 0, 0.16) !important;
}

html body.game-body #profile-gang-card.right-panel-card :is(
  .profile-row--members,
  .profile-row--faction,
  .profile-row--alliance
) :is(.gang-profile-row__label, span:last-child) {
  color: #ffffff !important;
  text-shadow: none !important;
}

html body.game-body #profile-gang-card.right-panel-card .profile-row--faction .gang-profile-row__label,
html body.game-body #profile-gang-card.right-panel-card .profile-row--faction > span:last-child {
  color: #ffffff !important;
  text-shadow: none !important;
}

html body.game-body #profile-gang-card.right-panel-card [data-gang-members],
html body.game-body #profile-gang-card.right-panel-card [data-gang-districts],
html body.game-body #profile-gang-card.right-panel-card [data-gang-heat] {
  font-size: 0.92rem !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

html body.game-body #profile-gang-card.right-panel-card .gang-profile-stars {
  font-size: 1.22rem !important;
  gap: 6px !important;
  line-height: 1 !important;
}

html body.game-body .wanted-popup-card .wanted-popup-header__title {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

html body.game-body .wanted-popup-card .wanted-popup-meta--header {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body.game-body .wanted-popup-card .wanted-popup-meta--mobile {
  display: none !important;
}

html body.game-body .wanted-popup-card .wanted-popup-meta--header .wanted-popup-row {
  min-height: 24px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  font-size: 0.58rem !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html body.game-body .wanted-popup-card .wanted-popup-meta--header .wanted-popup-row span {
  margin-left: 5px !important;
  font-size: 0.64rem !important;
}

html body.game-body .wanted-popup-card .wanted-popup-title--stars {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

html body.game-body .wanted-popup-card .wanted-popup-title__text {
  min-width: 0 !important;
}

html body.game-body .wanted-popup-card .wanted-popup-stars {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 3px !important;
  color: rgba(251, 191, 36, 0.32) !important;
  font-size: 0.72rem !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

html body.game-body .wanted-popup-card .wanted-popup-stars > span {
  display: inline-flex !important;
  color: rgba(251, 191, 36, 0.32) !important;
  line-height: 1 !important;
  text-shadow: none !important;
}

html body.game-body .wanted-popup-card .wanted-popup-stars > span.is-active {
  color: #fbbf24 !important;
  text-shadow: 0 0 10px rgba(251, 191, 36, 0.34) !important;
  animation: ui-soft-pulse 3.2s ease-in-out infinite !important;
}

html body.game-body .wanted-popup-card .wanted-popup-stars--title {
  font-size: 0.82rem !important;
}

html body.game-body .wanted-popup-card .wanted-popup-stars--level {
  gap: 2px !important;
  font-size: 0.58rem !important;
}

html body.game-body .wanted-popup-card .wanted-popup-hero {
  grid-template-columns: minmax(0, 1fr) !important;
}

@media (max-width: 720px) {
  html body.game-body .wanted-popup-card .wanted-popup-header__title {
    flex-wrap: wrap !important;
    row-gap: 6px !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-meta--header {
    display: none !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-meta--mobile {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }
}

@media (min-width: 721px) {
  html body.game-body .wanted-popup-card .wanted-popup-close {
    top: 3px !important;
    right: -7px !important;
    z-index: 30 !important;
    display: grid !important;
    place-items: center !important;
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 !important;
    border: 1px solid rgba(103, 232, 249, 0.48) !important;
    border-radius: 999px !important;
    background:
      radial-gradient(circle at 30% 24%, rgba(236, 254, 255, 0.22), transparent 38%),
      radial-gradient(circle at 76% 80%, rgba(248, 113, 113, 0.22), transparent 42%),
      linear-gradient(145deg, rgba(5, 13, 24, 0.96), rgba(10, 5, 14, 0.96)) !important;
    color: #e0fbff !important;
    font-size: 0 !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.14),
      inset 0 0 14px rgba(34, 211, 238, 0.12),
      0 0 14px rgba(34, 211, 238, 0.24),
      0 0 20px rgba(248, 113, 113, 0.14),
      0 10px 20px rgba(0, 0, 0, 0.28) !important;
    text-shadow: none !important;
    transform: none !important;
    font-size: 0.86rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-shadow:
      0 0 7px rgba(103, 232, 249, 0.66),
      0 0 10px rgba(248, 113, 113, 0.24) !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-close::before,
  html body.game-body .wanted-popup-card .wanted-popup-close::after {
    content: none !important;
    display: none !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-close:hover,
  html body.game-body .wanted-popup-card .wanted-popup-close:focus-visible {
    border-color: rgba(248, 113, 113, 0.7) !important;
    color: #ffffff !important;
    background:
      radial-gradient(circle at 30% 24%, rgba(236, 254, 255, 0.28), transparent 38%),
      radial-gradient(circle at 76% 80%, rgba(248, 113, 113, 0.32), transparent 42%),
      linear-gradient(145deg, rgba(7, 18, 32, 0.98), rgba(25, 7, 14, 0.98)) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.18),
      inset 0 0 16px rgba(34, 211, 238, 0.16),
      0 0 16px rgba(34, 211, 238, 0.34),
      0 0 24px rgba(248, 113, 113, 0.26),
      0 12px 22px rgba(0, 0, 0, 0.32) !important;
  }

  html body.game-body #profile-gang-card.right-panel-card .gang-profile-stars {
    font-size: 0.96rem !important;
    gap: 4px !important;
  }
}

@media (max-width: 720px), (hover: none) and (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body #profile-gang-card.right-panel-card .gang-profile-stars {
    font-size: 0.78rem !important;
    gap: 3px !important;
    line-height: 1 !important;
  }

  html body.game-body #profile-gang-card.right-panel-card .gang-profile-stars > * {
    font-size: inherit !important;
    line-height: 1 !important;
  }
}

html body.game-body .map-phase-toolbar .map-phase-button[data-border-toggle] {
  min-width: 42px !important;
  border-color: rgba(255, 255, 255, 0.44) !important;
  background: #050505 !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.22) !important;
}

html body.game-body .map-phase-toolbar .map-phase-button[data-game-phase-toggle] {
  display: none !important;
}

html body.game-body .map-phase-toolbar .map-phase-button[data-border-toggle][data-border-color="white"] {
  border-color: rgba(255, 255, 255, 0.48) !important;
  background: #050505 !important;
  color: #ffffff !important;
}

html body.game-body .map-phase-toolbar .map-phase-button[data-border-toggle][data-border-color="black"] {
  border-color: rgba(214, 219, 226, 0.82) !important;
  background: linear-gradient(180deg, #d7dce3 0%, #c3cad3 100%) !important;
  color: #050505 !important;
  text-shadow: none !important;
}

@media (max-width: 840px) {
  html body.game-body .map-stage-shell {
    border-color: rgba(15, 23, 42, 0.72) !important;
    background:
      radial-gradient(circle at 16% 0%, rgba(255, 255, 255, 0.035), transparent 34%),
      radial-gradient(circle at 86% 4%, rgba(34, 211, 238, 0.055), transparent 30%),
      linear-gradient(180deg, rgba(0, 0, 0, 0.74), rgba(2, 6, 23, 0.92)) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.045),
      inset 0 0 22px rgba(0, 0, 0, 0.42),
      0 16px 30px rgba(0, 0, 0, 0.38),
      0 0 18px rgba(0, 0, 0, 0.34) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html body.game-body .mount-point--map {
    border-color: rgba(255, 255, 255, 0.08) !important;
    background:
      linear-gradient(145deg, rgba(0, 0, 0, 0.96), rgba(3, 7, 18, 0.92) 48%, rgba(0, 0, 0, 0.98)) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.035),
      0 14px 28px rgba(0, 0, 0, 0.42),
      0 0 18px rgba(2, 6, 23, 0.34) !important;
  }

  html body.game-body .map-viewport {
    background: rgba(0, 0, 0, 0.96) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.045),
      inset 0 0 24px rgba(0, 0, 0, 0.48),
      0 12px 24px rgba(0, 0, 0, 0.36) !important;
  }

  html body.game-body .map-canvas-shell::before {
    background:
      radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.04), transparent 34%),
      linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.28)),
      repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.012) 0 1px, transparent 1px 4px) !important;
  }
}

html body.game-body .wanted-popup-card .wanted-popup-police-toggle.button,
html body.game-body .wanted-popup-card .wanted-popup-police-toggle {
  border-color: rgba(255, 255, 255, 0.62) !important;
  background:
    radial-gradient(circle at 34% 24%, rgba(255, 255, 255, 0.24), transparent 38%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.12), transparent 42%),
    linear-gradient(135deg, rgba(2, 6, 13, 0.98), rgba(17, 24, 39, 0.96)) !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.16),
    inset 0 0 12px rgba(255, 255, 255, 0.08),
    0 0 12px rgba(255, 255, 255, 0.14),
    0 8px 16px rgba(0, 0, 0, 0.24) !important;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.38) !important;
}

html body.game-body .wanted-popup-card .wanted-popup-police-toggle[aria-expanded="true"] {
  border-color: rgba(255, 255, 255, 0.86) !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.2) 0 14%, transparent 16%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 44%),
    linear-gradient(135deg, rgba(0, 0, 0, 1), rgba(31, 41, 55, 0.98)) !important;
  color: #ffffff !important;
}

/* Final demo modal layer: wanted police help must stay above storage/heat popup cards. */
html body.game-body .wanted-popup-shell:not([hidden]) {
  z-index: 21000 !important;
}

html body.game-body .wanted-popup-shell:not([hidden]) .wanted-popup-card {
  z-index: 21010 !important;
}

html body.game-body .wanted-popup-shell:not([hidden]) > .wanted-popup-police-window,
html body.game-body .wanted-popup-shell:not([hidden]) .wanted-popup-card .wanted-popup-police-window {
  z-index: 21020 !important;
}

html body.game-body #global-chat-card.right-panel-card {
  border-color: rgba(125, 211, 252, 0.12) !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(186, 230, 253, 0.035), transparent 38%),
    rgba(14, 165, 233, 0.012) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.01),
    0 14px 28px rgba(7, 89, 133, 0.045),
    0 0 20px rgba(56, 189, 248, 0.025) !important;
}

@media (min-width: 721px) and (max-width: 840px) {
  html body.game-body #global-chat-card.right-panel-card {
    min-height: 164px;
    height: 164px;
    max-height: 164px;
  }

  html body.game-body #global-chat-card .alliance-chat.server-chat-panel {
    min-height: 100%;
    height: 100%;
    max-height: 100%;
  }
}

@media (min-width: 841px) {
  html body.game-body #global-chat-card.right-panel-card {
    display: flex !important;
    min-height: 276px !important;
    height: clamp(276px, 38vh, 354px) !important;
  }

  html body.game-body #global-chat-card .alliance-chat.server-chat-panel {
    flex: 1 1 auto !important;
    min-height: 100% !important;
    height: 100% !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
  }

  html body.game-body #global-chat-card .alliance-chat__log,
  html body.game-body #global-chat-card .server-chat-panel__feed {
    min-height: 150px !important;
    max-height: none !important;
  }
}

html body.game-body #global-chat-card .alliance-chat.server-chat-panel {
  border-color: rgba(125, 211, 252, 0.14) !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(224, 242, 254, 0.07), transparent 38%),
    radial-gradient(circle at 92% 18%, rgba(125, 211, 252, 0.055), transparent 34%),
    linear-gradient(145deg, rgba(8, 47, 73, 0.22), rgba(14, 116, 144, 0.14) 48%, rgba(7, 89, 133, 0.18)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.014),
    inset 0 0 28px rgba(186, 230, 253, 0.018),
    0 16px 32px rgba(7, 89, 133, 0.07),
    0 0 22px rgba(56, 189, 248, 0.035) !important;
}

html body.game-body #global-chat-card .alliance-chat.server-chat-panel::before {
  opacity: 0.34 !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.11), transparent 34%),
    repeating-linear-gradient(180deg, rgba(224, 242, 254, 0.04) 0 1px, transparent 1px 9px) !important;
}

html body.game-body #global-chat-card .alliance-chat.server-chat-panel::after {
  opacity: 0.58 !important;
  background: linear-gradient(90deg, transparent, rgba(250, 204, 21, 0.42), rgba(226, 232, 240, 0.5), transparent) !important;
  box-shadow: 0 0 14px rgba(250, 204, 21, 0.16) !important;
}

html body.game-body #global-chat-card .alliance-chat__title {
  border-color: rgba(224, 242, 254, 0.34) !important;
  background: rgba(8, 47, 73, 0.48) !important;
  color: rgba(240, 249, 255, 0.94) !important;
  box-shadow:
    inset 0 0 12px rgba(224, 242, 254, 0.055),
    0 0 12px rgba(56, 189, 248, 0.12) !important;
  text-shadow: 0 0 10px rgba(224, 242, 254, 0.14) !important;
}

html body.game-body #global-chat-card .alliance-chat__title::before {
  background: #020617 !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.22),
    0 0 8px rgba(15, 23, 42, 0.56),
    0 0 14px rgba(255, 255, 255, 0.08) !important;
}

html body.game-body #global-chat-card .alliance-chat__log,
html body.game-body #global-chat-card .server-chat-panel__feed {
  scrollbar-color: rgba(15, 23, 42, 0.78) rgba(8, 47, 73, 0.28) !important;
}

html body.game-body #global-chat-card .alliance-chat__log::-webkit-scrollbar-track {
  background: rgba(8, 47, 73, 0.34) !important;
}

html body.game-body #global-chat-card .alliance-chat__log::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.92), rgba(2, 6, 23, 0.72)) !important;
  border-color: rgba(8, 47, 73, 0.42) !important;
  box-shadow: 0 0 10px rgba(15, 23, 42, 0.26) !important;
}

html body.game-body #global-chat-card .alliance-chat__item,
html body.game-body #global-chat-card .server-chat-panel__message {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) !important;
  align-items: start !important;
  column-gap: 5px !important;
  row-gap: 2px !important;
  border-color: rgba(224, 242, 254, 0.18) !important;
  background:
    linear-gradient(90deg, rgba(14, 165, 233, 0.12), transparent 48%),
    rgba(3, 20, 34, 0.94) !important;
  box-shadow:
    inset 2px 0 0 rgba(186, 230, 253, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.045),
    0 8px 16px rgba(2, 6, 23, 0.22) !important;
}

html body.game-body #global-chat-card .server-chat-panel__author {
  --chat-author-color: #020617;
  display: inline !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: color-mix(in srgb, var(--chat-author-color) 64%, #f8fafc) !important;
  box-shadow: none !important;
  text-shadow: 0 0 10px color-mix(in srgb, var(--chat-author-color) 18%, transparent) !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  font-size: 0.72rem !important;
  line-height: 1.38 !important;
  white-space: nowrap !important;
}

html body.game-body #global-chat-card .server-chat-panel__timestamp {
  display: inline-block !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  min-width: 0 !important;
  color: rgba(186, 230, 253, 0.62) !important;
  font-size: 0.53rem !important;
  line-height: 1.25 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  text-shadow: 0 0 8px rgba(56, 189, 248, 0.14) !important;
}

html body.game-body #global-chat-card .server-chat-panel__text {
  display: block !important;
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
  color: rgba(240, 249, 255, 0.86) !important;
  font-size: 0.74rem !important;
  line-height: 1.38 !important;
  overflow-wrap: anywhere !important;
}

html body.game-body #global-chat-card .alliance-chat__input,
html body.game-body #global-chat-card .server-chat-panel__composer {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  border-color: rgba(224, 242, 254, 0.18) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent),
    rgba(8, 47, 73, 0.48) !important;
  box-shadow: inset 0 0 16px rgba(186, 230, 253, 0.055) !important;
}

html body.game-body #global-chat-card .server-chat-panel__composer-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  min-width: 0 !important;
}

html body.game-body #global-chat-card .server-chat-panel__composer-head .alliance-chat__title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-height: 24px !important;
  padding: 0 7px !important;
  justify-content: center !important;
  white-space: nowrap !important;
  font-size: 0.66rem !important;
}

html body.game-body #global-chat-card .server-chat-panel__composer-head .alliance-chat__title::after {
  content: "" !important;
  width: 5px !important;
  height: 5px !important;
  border-radius: 999px !important;
  background: currentColor !important;
  box-shadow: 0 0 10px currentColor !important;
  animation: lobbyDot 1.2s infinite !important;
}

html body.game-body #global-chat-card .server-chat-panel__composer-head .alliance-chat__title::before {
  content: none !important;
  display: none !important;
}

html body.game-body #global-chat-card .server-chat-panel__composer-head .server-chat-panel__send {
  flex: 0 0 auto !important;
  margin-right: 8px !important;
}

@keyframes lobbyDot {
  0%, 100% {
    opacity: 0.42;
    transform: scale(0.82);
  }

  50% {
    opacity: 1;
    transform: scale(1);
  }
}

html body.game-body #global-chat-card .server-chat-panel__input {
  border-color: rgba(224, 242, 254, 0.22) !important;
  background: rgba(8, 47, 73, 0.58) !important;
  color: rgba(240, 249, 255, 0.92) !important;
}

html body.game-body #global-chat-card .server-chat-panel__send {
  border-color: rgba(255, 255, 255, 0.22) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent),
    linear-gradient(135deg, rgba(2, 6, 13, 0.98), rgba(15, 23, 42, 0.96)) !important;
  color: rgba(248, 250, 252, 0.94) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    inset 0 0 14px rgba(255, 255, 255, 0.035),
    0 8px 16px rgba(0, 0, 0, 0.24) !important;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.16) !important;
}

html body.game-body #global-chat-card .server-chat-panel__send:hover,
html body.game-body #global-chat-card .server-chat-panel__send:focus-visible {
  border-color: rgba(255, 255, 255, 0.34) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.11), transparent),
    linear-gradient(135deg, rgba(3, 7, 18, 1), rgba(30, 41, 59, 0.98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.16),
    inset 0 0 16px rgba(255, 255, 255, 0.045),
    0 10px 18px rgba(0, 0, 0, 0.28) !important;
}

html body.game-body #global-chat-card .server-chat-panel__send--arrow {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 0 !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  border-color: rgba(103, 232, 249, 0.7) !important;
  background:
    radial-gradient(circle at 32% 18%, rgba(240, 249, 255, 0.22), transparent 34%),
    linear-gradient(135deg, rgba(14, 165, 233, 0.3), rgba(8, 47, 73, 0.66) 52%, rgba(2, 6, 23, 0.98)) !important;
  color: #67e8f9 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 0 0 18px rgba(34, 211, 238, 0.16),
    0 0 14px rgba(34, 211, 238, 0.32),
    0 0 26px rgba(14, 165, 233, 0.2),
    0 8px 16px rgba(2, 6, 23, 0.34) !important;
  font-size: 0 !important;
  line-height: 1 !important;
}

html body.game-body #global-chat-card .server-chat-panel__send--arrow::before {
  content: "" !important;
  position: absolute !important;
  left: 5px !important;
  top: 50% !important;
  width: 20px !important;
  height: 12px !important;
  border-radius: 999px !important;
  background:
    linear-gradient(90deg, transparent, rgba(103, 232, 249, 0.26), transparent),
    radial-gradient(circle at 82% 50%, rgba(103, 232, 249, 0.32), transparent 46%) !important;
  box-shadow:
    0 0 10px rgba(103, 232, 249, 0.24),
    0 0 18px rgba(34, 211, 238, 0.18) !important;
  transform: translateY(-50%) !important;
}

html body.game-body #global-chat-card .server-chat-panel__send--arrow::after {
  content: none !important;
  display: none !important;
}

html body.game-body #global-chat-card .server-chat-panel__send--arrow span {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  color: #a5f3fc !important;
  font-size: 0.92rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  transform: translateY(-1px) !important;
  text-shadow:
    0 0 6px rgba(165, 243, 252, 0.95),
    0 0 14px rgba(34, 211, 238, 0.7),
    0 0 24px rgba(14, 165, 233, 0.44) !important;
}

html body.game-body #global-chat-card .server-chat-panel__send--arrow:hover,
html body.game-body #global-chat-card .server-chat-panel__send--arrow:focus-visible {
  border-color: rgba(186, 230, 253, 0.9) !important;
  background:
    radial-gradient(circle at 32% 18%, rgba(240, 249, 255, 0.28), transparent 34%),
    linear-gradient(135deg, rgba(34, 211, 238, 0.38), rgba(14, 116, 144, 0.72) 52%, rgba(2, 6, 23, 1)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.26),
    inset 0 0 20px rgba(34, 211, 238, 0.22),
    0 0 18px rgba(103, 232, 249, 0.42),
    0 0 32px rgba(14, 165, 233, 0.26),
    0 10px 18px rgba(2, 6, 23, 0.36) !important;
}

html body.game-body .building-action-status {
  border-color: rgba(15, 23, 42, 0.62) !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(255, 255, 255, 0.026), transparent 36%),
    radial-gradient(circle at 100% 18%, rgba(250, 204, 21, 0.018), transparent 34%),
    linear-gradient(145deg, rgba(0, 0, 0, 0.58), rgba(3, 5, 10, 0.42) 52%, rgba(0, 0, 0, 0.52)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.012),
    inset 0 0 28px rgba(0, 0, 0, 0.24),
    0 14px 28px rgba(0, 0, 0, 0.22) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body.game-body .building-action-status::before,
html body.game-body .building-action-status::after {
  opacity: 0.16 !important;
}

html body.game-body .building-action-status__summary,
html body.game-body .building-action-status__meta,
html body.game-body .building-action-status__empty,
html body.game-body .building-action-status__feed {
  border-color: rgba(255, 255, 255, 0.1) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent),
    rgba(0, 0, 0, 0.72) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.012),
    0 8px 16px rgba(0, 0, 0, 0.14) !important;
}

html body.game-body .building-action-status__item {
  background:
    linear-gradient(90deg, rgba(var(--street-news-action-rgb, 103, 232, 249), 0.08), transparent 48%),
    rgba(3, 5, 10, 0.9) !important;
}

html body.game-body .building-action-status__feed::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.76) !important;
}

/* Final loaded override: main left launchers keep a subtle dark glass tint. */
html body.game-body #city-events-card #city-events-open.panel-action-button,
html body.game-body #city-events-card #city-events-open.panel-action-button:hover,
html body.game-body #city-events-card #city-events-open.panel-action-button:focus-visible {
  background:
    radial-gradient(circle at 0% 0%, rgba(34, 211, 238, 0.08), transparent 34%),
    radial-gradient(circle at 100% 100%, rgba(244, 114, 182, 0.06), transparent 34%),
    rgba(5, 10, 18, 0.34) !important;
  background-color: rgba(5, 10, 18, 0.34) !important;
}

/* Final loaded override: remove the extra dark frame around Budovy and Bazar launchers. */
html body.game-body #buildings-card.feature-card,
html body.game-body #market-card.feature-card {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body.game-body #buildings-card .panel-action-button--feature,
html body.game-body #market-card .panel-action-button--feature {
  border-color: rgba(103, 232, 249, 0.18) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(34, 211, 238, 0.08), transparent 34%),
    radial-gradient(circle at 100% 100%, rgba(244, 114, 182, 0.06), transparent 34%),
    rgba(5, 10, 18, 0.34) !important;
  background-color: rgba(5, 10, 18, 0.34) !important;
  backdrop-filter: blur(8px) saturate(116%) !important;
  -webkit-backdrop-filter: blur(8px) saturate(116%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.035),
    inset 0 0 0 1px rgba(103, 232, 249, 0.08),
    0 8px 18px rgba(2, 6, 23, 0.12),
    0 0 18px rgba(34, 211, 238, 0.06) !important;
}

html body.game-body #buildings-card .panel-action-button--feature:hover,
html body.game-body #buildings-card .panel-action-button--feature:focus-visible,
html body.game-body #market-card .panel-action-button--feature:hover,
html body.game-body #market-card .panel-action-button--feature:focus-visible {
  border-color: rgba(103, 232, 249, 0.34) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(34, 211, 238, 0.1), transparent 34%),
    radial-gradient(circle at 100% 100%, rgba(244, 114, 182, 0.08), transparent 34%),
    rgba(5, 10, 18, 0.42) !important;
  background-color: rgba(5, 10, 18, 0.42) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.045),
    inset 0 0 0 1px rgba(103, 232, 249, 0.12),
    0 10px 20px rgba(2, 6, 23, 0.18),
    0 0 20px rgba(34, 211, 238, 0.1) !important;
}

html body.game-body #buildings-card .panel-action-button--feature:focus-visible,
html body.game-body #market-card .panel-action-button--feature:focus-visible {
  outline: 1px solid rgba(255, 255, 255, 0.2) !important;
  outline-offset: 2px !important;
}

html body.game-body #buildings-card .panel-action-button--feature::before,
html body.game-body #buildings-card .panel-action-button--feature::after,
html body.game-body #market-card .panel-action-button--feature::before,
html body.game-body #market-card .panel-action-button--feature::after {
  content: none !important;
  display: none !important;
}

@media (min-width: 721px) {
  html body.game-body #game-left-nav.panel-action-stack > #city-events-card,
  html body.game-body #game-left-nav.panel-action-stack > #buildings-card,
  html body.game-body #game-left-nav.panel-action-stack > #market-card {
    margin-bottom: 12px !important;
  }

  html body.game-body #game-left-nav.panel-action-stack > #market-card {
    margin-bottom: 18px !important;
  }

  html body.game-body #game-left-nav.panel-action-stack > #building-shortcut-grid {
    position: relative !important;
    padding-top: 24px !important;
  }

  html body.game-body #game-left-nav.panel-action-stack > #building-shortcut-grid::before {
    content: "" !important;
    position: absolute !important;
    left: 10px !important;
    right: 10px !important;
    top: -6px !important;
    height: 1px !important;
    border-radius: 999px !important;
    background: linear-gradient(
      90deg,
      transparent,
      rgba(250, 204, 21, 0.76),
      rgba(226, 232, 240, 0.68),
      transparent
    ) !important;
    box-shadow:
      0 0 8px rgba(250, 204, 21, 0.34),
      0 0 14px rgba(226, 232, 240, 0.18) !important;
    pointer-events: none !important;
  }
}

/* Requested UI polish overrides. */
html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--wanted {
  background:
    linear-gradient(90deg, rgba(248, 250, 252, 0.16), transparent 62%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
    rgba(12, 18, 28, 0.38) !important;
  border-color: rgba(226, 232, 240, 0.34) !important;
  box-shadow:
    inset 2px 0 0 rgba(226, 232, 240, 0.68),
    inset 0 0 0 1px rgba(255, 255, 255, 0.026),
    0 6px 14px rgba(0, 0, 0, 0.12) !important;
}

html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--members {
  background:
    linear-gradient(90deg, rgba(187, 247, 208, 0.22), transparent 62%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
    rgba(6, 28, 18, 0.38) !important;
  border-color: rgba(134, 239, 172, 0.38) !important;
  box-shadow:
    inset 2px 0 0 rgba(74, 222, 128, 0.72),
    inset 0 0 0 1px rgba(255, 255, 255, 0.026),
    0 0 16px rgba(74, 222, 128, 0.14),
    0 6px 14px rgba(0, 0, 0, 0.12) !important;
}

html body.game-body #profile-gang-card.right-panel-card .profile-row--wanted .gang-profile-row__label {
  color: rgba(241, 245, 249, 0.96) !important;
  text-shadow: 0 0 10px rgba(226, 232, 240, 0.14) !important;
}

html body.game-body #profile-gang-card.right-panel-card .profile-row--members .gang-profile-row__label,
html body.game-body #profile-gang-card.right-panel-card .profile-row--members > span:last-child {
  color: rgba(220, 252, 231, 0.98) !important;
  text-shadow: 0 0 12px rgba(134, 239, 172, 0.32) !important;
}

html body.game-body #profile-gang-card.right-panel-card .profile-row--wanted .profile-heat-panel {
  border-color: rgba(248, 113, 113, 0.38) !important;
  background:
    linear-gradient(135deg, rgba(127, 29, 29, 0.88), rgba(24, 24, 27, 0.92)) !important;
  color: #fee2e2 !important;
  box-shadow:
    inset 0 1px 0 rgba(254, 202, 202, 0.14),
    0 0 18px rgba(248, 113, 113, 0.14) !important;
}

html body.game-body #profile-gang-card.right-panel-card .profile-row--wanted .profile-heat-panel:hover,
html body.game-body #profile-gang-card.right-panel-card .profile-row--wanted .profile-heat-panel:focus-visible {
  border-color: rgba(252, 165, 165, 0.62) !important;
  color: #fff1f2 !important;
  box-shadow:
    0 0 10px rgba(248, 113, 113, 0.14),
    inset 0 0 10px rgba(255, 255, 255, 0.04) !important;
}

html body.game-body #attack-confirm-modal-cancel.modal__cancel-btn,
html body.game-body #attack-confirm-modal-cancel.btn--ghost,
html body.game-body #raid-confirm-modal-cancel.modal__cancel-btn,
html body.game-body #raid-confirm-modal-cancel.btn--ghost,
html body.game-body #trap-confirm-modal-cancel.modal__cancel-btn,
html body.game-body #trap-confirm-modal-cancel.btn--ghost,
html body.game-body #spy-confirm-modal-cancel.modal__cancel-btn,
html body.game-body #spy-confirm-modal-cancel.btn--ghost,
html body.game-body #occupy-confirm-modal-cancel.modal__cancel-btn,
html body.game-body #occupy-confirm-modal-cancel.btn--ghost {
  color: #f8fafc !important;
}

@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body #events-modal:not(.hidden) > #events-modal-backdrop.modal__backdrop,
  html body.game-modal-scroll-locked #events-modal:not(.hidden) > #events-modal-backdrop.modal__backdrop {
    position: absolute !important;
    inset: 0 !important;
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0.84)) !important;
    backdrop-filter: blur(5px) saturate(115%) !important;
    -webkit-backdrop-filter: blur(5px) saturate(115%) !important;
    opacity: 1 !important;
  }
}

html body.game-body .elimination-ai-panel.is-open {
  place-items: center !important;
  background: transparent !important;
}

html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__backdrop {
  background: var(--lifecycle-backdrop) !important;
  backdrop-filter: blur(8px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(8px) saturate(125%) !important;
}

html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__card {
  border-radius: 20px !important;
  border-color: var(--lifecycle-card-border) !important;
  background: var(--lifecycle-card-background) !important;
  box-shadow: var(--lifecycle-card-shadow) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__header {
  min-height: 54px !important;
  padding: 9px 12px !important;
  background: rgba(8, 18, 32, 0.72) !important;
  border-bottom: 1px solid var(--lifecycle-header-border) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__eyebrow,
html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__status-chip {
  border-radius: 999px !important;
  border-color: rgba(var(--ai-panel-state), 0.42) !important;
  background: rgba(0, 0, 0, 0.3) !important;
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(var(--ai-panel-state), 0.36) !important;
}

html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__status-chip::before,
html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__status-chip::after {
  content: none !important;
  display: none !important;
}

html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__title {
  color: #f8fafc !important;
  font-size: 23px !important;
  text-shadow: 0 0 18px rgba(226, 232, 240, 0.12) !important;
}

html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__close {
  border: 1px solid rgba(var(--lifecycle-accent-rgb), 0.42) !important;
  border-radius: 10px !important;
  background: rgba(8, 22, 38, 0.92) !important;
  color: #dffbff !important;
  box-shadow: none !important;
}

html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__hero,
html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__section,
html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__metric,
html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__leaderboard-row,
html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__score-row,
html body.game-body .elimination-ai-panel.is-open .elimination-ai-panel__action-chips span {
  border-color: rgba(var(--ai-panel-state), 0.32) !important;
  background:
    linear-gradient(145deg, rgba(var(--ai-panel-state), 0.1), transparent 52%),
    rgba(0, 0, 0, 0.34) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    inset 0 0 20px rgba(0, 0, 0, 0.34),
    0 0 18px rgba(var(--ai-panel-state), 0.12) !important;
}

@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html.game-modal-scroll-locked {
    --mobile-overlay-top-offset: 0px !important;
  }

  html body.game-body.game-modal-scroll-locked #game-header,
  html body.game-body.game-modal-scroll-locked .game-topbar,
  html body.game-body.game-modal-scroll-locked .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed .game-resource-strip {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked .game-topbar,
  html body.game-body.game-modal-scroll-locked .game-topbar * {
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked .game-shell > .modal:not(.hidden):not([hidden]) {
    position: fixed !important;
    inset: 0 !important;
    z-index: 12000 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: var(--mobile-locked-vh, 100svh) !important;
    height: var(--mobile-locked-vh, 100svh) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    contain: layout paint !important;
  }

  html body.game-body.game-modal-scroll-locked .game-shell > .modal:not(.hidden):not([hidden]) > .modal__backdrop {
    position: absolute !important;
    inset: 0 !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.storage-popup-shell[data-storage-popup]:not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(.storage-popup-shell[data-storage-popup]:not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.storage-popup-shell[data-storage-popup]:not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.storage-popup-shell[data-storage-popup]:not([hidden])) .game-resource-strip {
    z-index: 20050 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.storage-popup-shell[data-storage-popup]:not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.storage-popup-shell[data-storage-popup]:not([hidden])) .game-topbar * {
    pointer-events: auto !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.storage-popup-shell[data-storage-popup]:not([hidden])) .storage-popup-shell[data-storage-popup]:not([hidden]) {
    padding-top: var(--mobile-topbar-offset, 72px) !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.storage-popup-shell[data-storage-popup]:not([hidden])) .storage-popup-shell[data-storage-popup]:not([hidden]) .storage-popup-card {
    max-height: calc(var(--mobile-locked-vh, 100dvh) - var(--mobile-topbar-offset, 72px) - max(8px, env(safe-area-inset-bottom))) !important;
  }
}

@media (min-width: 721px) {
  html body.game-body.game-modal-scroll-locked #game-header,
  html body.game-body.game-modal-scroll-locked > .game-topbar,
  html body.game-body.alliance-modal-open #game-header,
  html body.game-body.alliance-modal-open > .game-topbar {
    z-index: 20050 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  html body.game-body.game-modal-scroll-locked .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked .game-topbar .game-toolbar-button,
  html body.game-body.alliance-modal-open .game-topbar .game-resource-strip,
  html body.game-body.alliance-modal-open .game-topbar .resource-pill,
  html body.game-body.alliance-modal-open .game-topbar .game-toolbar-button {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}

@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body.game-modal-scroll-locked .district-popup-shell:not([hidden]) {
    --district-popup-mobile-top-offset: max(22px, calc(env(safe-area-inset-top) + 18px));
    align-items: flex-start !important;
    justify-content: center !important;
    padding-top: var(--district-popup-mobile-top-offset) !important;
  }

  html body.game-body.game-modal-scroll-locked .district-popup-shell:not([hidden]) .district-popup-card {
    max-height: calc(
      var(--mobile-locked-vh, 100dvh)
      - var(--district-popup-mobile-top-offset)
      - max(10px, env(safe-area-inset-bottom))
    ) !important;
  }
}

@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.district-popup-shell:not([hidden])) .game-resource-strip {
    z-index: 20050 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])) .game-topbar * {
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])) .district-popup-shell:not([hidden]) {
    --district-popup-mobile-top-offset: var(--mobile-topbar-offset, 72px);
    --district-popup-mobile-bottom-offset: max(10px, env(safe-area-inset-bottom));
    align-items: flex-start !important;
    justify-content: center !important;
    padding: var(--district-popup-mobile-top-offset) 8px var(--district-popup-mobile-bottom-offset) !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])) .district-popup-shell:not([hidden]) .district-popup-card {
    max-height: calc(
      var(--mobile-locked-vh, 100dvh)
      - var(--district-popup-mobile-top-offset, 72px)
      - var(--district-popup-mobile-bottom-offset, max(10px, env(safe-area-inset-bottom)))
    ) !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not(.robbery-setup-popup-shell):not([hidden])
  )) #game-header,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not(.robbery-setup-popup-shell):not([hidden])
  )) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not(.robbery-setup-popup-shell):not([hidden])
  )) .game-resource-strip {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked :is(
    #attack-confirm-modal,
    #raid-confirm-modal,
    #trap-confirm-modal,
    #spy-confirm-modal,
    #occupy-confirm-modal
  ):not(.hidden):not([hidden]),
  html body.game-body.game-modal-scroll-locked :is(
    .attack-setup-popup-shell,
    .robbery-setup-popup-shell
  ):not([hidden]) {
    z-index: 23000 !important;
  }

  html body.game-body.game-modal-scroll-locked :is(
    #attack-confirm-modal,
    #raid-confirm-modal,
    #trap-confirm-modal,
    #spy-confirm-modal,
    #occupy-confirm-modal
  ):not(.hidden):not([hidden]) .district-action-confirm-popup-card,
  html body.game-body.game-modal-scroll-locked :is(
    .attack-setup-popup-shell,
    .robbery-setup-popup-shell
  ):not([hidden]) .attack-setup-popup-card {
    position: relative !important;
    z-index: 2 !important;
  }
}

/* Final mobile action confirmation layout: keep topbar visible and start cards below it. */
@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden])
  )) #game-header,
  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden])
  )) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden])
  )) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden])
  )) .game-resource-strip {
    z-index: 20050 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden])
  )) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden])
  )) .game-topbar * {
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked :is(
    #attack-confirm-modal,
    #raid-confirm-modal,
    #trap-confirm-modal,
    #spy-confirm-modal,
    #occupy-confirm-modal
  ):not(.hidden):not([hidden]) {
    --action-confirm-mobile-top-offset: var(--mobile-topbar-offset, 72px);
    position: fixed !important;
    inset: 0 !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    width: 100vw !important;
    min-height: var(--mobile-locked-vh, 100svh) !important;
    height: var(--mobile-locked-vh, 100svh) !important;
    padding: var(--action-confirm-mobile-top-offset) 10px max(10px, env(safe-area-inset-bottom)) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  html body.game-body.game-modal-scroll-locked :is(
    #attack-confirm-modal,
    #raid-confirm-modal,
    #trap-confirm-modal,
    #spy-confirm-modal,
    #occupy-confirm-modal
  ):not(.hidden):not([hidden]) .district-action-confirm-popup-card,
  html body.game-body.game-modal-scroll-locked :is(
    #attack-confirm-modal,
    #raid-confirm-modal,
    #trap-confirm-modal,
    #spy-confirm-modal,
    #occupy-confirm-modal
  ):not(.hidden):not([hidden]) .modal__content {
    margin: 0 auto !important;
    max-height: calc(
      var(--mobile-locked-vh, 100dvh)
      - var(--action-confirm-mobile-top-offset, 72px)
      - max(10px, env(safe-area-inset-bottom))
    ) !important;
  }
}

/* Final mobile action modal topbar layer override. */
@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not([hidden]),
    .robbery-setup-popup-shell:not([hidden])
  )) #game-header,
  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not([hidden]),
    .robbery-setup-popup-shell:not([hidden])
  )) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not([hidden]),
    .robbery-setup-popup-shell:not([hidden])
  )) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not([hidden]),
    .robbery-setup-popup-shell:not([hidden])
  )) .game-resource-strip {
    z-index: 24050 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not([hidden]),
    .robbery-setup-popup-shell:not([hidden])
  )) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not([hidden]),
    .robbery-setup-popup-shell:not([hidden])
  )) .game-topbar * {
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not([hidden]),
    .robbery-setup-popup-shell:not([hidden])
  )) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not([hidden]),
    .robbery-setup-popup-shell:not([hidden])
  )) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not([hidden]),
    .robbery-setup-popup-shell:not([hidden])
  )) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden]),
    .attack-setup-popup-shell:not([hidden]),
    .robbery-setup-popup-shell:not([hidden])
  )) .game-resource-strip > * {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }
}

/* Final mobile occupy confirmation resource bar visibility guard. */
@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body.game-modal-scroll-locked:has(#occupy-confirm-modal:not(.hidden):not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#occupy-confirm-modal:not(.hidden):not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.district-popup-shell:not([hidden])):has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip {
    z-index: 24050 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-topbar {
    display: block !important;
  }

  html body.game-body.game-modal-scroll-locked:has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.district-popup-shell:not([hidden])):has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip {
    display: grid !important;
  }

  html body.game-body.game-modal-scroll-locked:has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip > *,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#occupy-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip > * {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }
}

/* Final mobile trap confirmation resource bar visibility guard. */
@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body.game-modal-scroll-locked:has(#trap-confirm-modal:not(.hidden):not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#trap-confirm-modal:not(.hidden):not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.district-popup-shell:not([hidden])):has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip {
    z-index: 24050 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-topbar {
    display: block !important;
  }

  html body.game-body.game-modal-scroll-locked:has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.district-popup-shell:not([hidden])):has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip {
    display: grid !important;
  }

  html body.game-body.game-modal-scroll-locked:has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip > *,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#trap-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip > * {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }
}

/* Final mobile robbery confirmation resource bar visibility guard. */
@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body {
    --robbery-confirm-window-safe-top: calc(var(--mobile-overlay-top-offset, var(--mobile-topbar-offset, 72px)) + 8px);
    --robbery-confirm-window-safe-bottom: max(8px, env(safe-area-inset-bottom));
    --robbery-confirm-window-safe-height: calc(var(--mobile-locked-vh, 100svh) - var(--robbery-confirm-window-safe-top) - var(--robbery-confirm-window-safe-bottom));
  }

  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip {
    z-index: 24050 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar {
    display: block !important;
  }

  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip {
    display: grid !important;
  }

  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip > *,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip > * {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }

  html body #raid-confirm-modal:not(.hidden):not([hidden]),
  html body.game-modal-scroll-locked #raid-confirm-modal:not(.hidden):not([hidden]) {
    position: fixed !important;
    inset: 0 !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    width: 100vw !important;
    height: var(--mobile-locked-vh, 100svh) !important;
    min-height: 0 !important;
    padding: var(--robbery-confirm-window-safe-top) 8px var(--robbery-confirm-window-safe-bottom) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  html body #raid-confirm-modal:not(.hidden):not([hidden]) .modal__content,
  html body.game-modal-scroll-locked #raid-confirm-modal:not(.hidden):not([hidden]) .modal__content {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    width: min(620px, calc(100vw - 28px)) !important;
    max-height: var(--robbery-confirm-window-safe-height) !important;
    margin: 0 auto !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
  }
}

/* Final mobile police raid impact topbar visibility guard. */
@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body.game-modal-scroll-locked:has(#police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-owned-district-raid-alert) #game-header,
  html body.game-body.game-modal-scroll-locked:has(#police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-owned-district-raid-alert) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(#police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-owned-district-raid-alert) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(#police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-owned-district-raid-alert) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.police-raid-impact-detail.is-open) #game-header,
  html body.game-body.game-modal-scroll-locked:has(.police-raid-impact-detail.is-open) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.police-raid-impact-detail.is-open) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.police-raid-impact-detail.is-open) .game-resource-strip {
    z-index: 24050 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(#police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-owned-district-raid-alert) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(#police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-owned-district-raid-alert) .game-topbar *,
  html body.game-body.game-modal-scroll-locked:has(.police-raid-impact-detail.is-open) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.police-raid-impact-detail.is-open) .game-topbar * {
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(#police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-owned-district-raid-alert) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(#police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-owned-district-raid-alert) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(#police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-owned-district-raid-alert) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(#police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-owned-district-raid-alert) .game-resource-strip > *,
  html body.game-body.game-modal-scroll-locked:has(.police-raid-impact-detail.is-open) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.police-raid-impact-detail.is-open) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(.police-raid-impact-detail.is-open) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(.police-raid-impact-detail.is-open) .game-resource-strip > * {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }
}

/* Final loaded action-modal visual guard: atmosphere remains visible and close icons stay intact. */
html body.game-body .attack-setup-popup-card .district-modal-hero__image,
html body.game-body .district-action-confirm-popup-card .district-modal-hero__image {
  display: block !important;
  opacity: 0.92 !important;
  filter: saturate(1.12) brightness(0.86) contrast(1.04) !important;
}

html body.game-body .attack-setup-popup-card .district-modal-hero__scrim,
html body.game-body .district-action-confirm-popup-card .district-modal-hero__scrim {
  background:
    radial-gradient(circle at 88% 12%, rgba(var(--action-glass-accent-rgb, var(--result-accent-rgb, 103, 232, 249)), 0.22), transparent 34%),
    linear-gradient(180deg, rgba(2, 6, 18, 0.02), rgba(2, 6, 18, 0.24) 48%, rgba(2, 6, 18, 0.64)) !important;
}

html body.game-body .robbery-setup-popup-card [data-robbery-setup-atmosphere-label] {
  display: none !important;
}

html body.game-body .attack-setup-popup-card .attack-setup-popup-close,
html body.game-body .district-action-confirm-popup-card .attack-setup-popup-close {
  top: 12px !important;
  right: 12px !important;
  left: auto !important;
  bottom: auto !important;
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  border: 1px solid rgba(165, 243, 252, 0.64) !important;
  background:
    radial-gradient(circle at 32% 28%, rgba(255, 255, 255, 0.18), transparent 42%),
    rgba(4, 12, 22, 0.82) !important;
  color: #e0fbff !important;
  font-size: 0 !important;
  transform: none !important;
  isolation: isolate !important;
}

html body.game-body .attack-setup-popup-card .attack-setup-popup-close::before,
html body.game-body .district-action-confirm-popup-card .attack-setup-popup-close::before,
html body.game-body .attack-setup-popup-card .attack-setup-popup-close::after,
html body.game-body .district-action-confirm-popup-card .attack-setup-popup-close::after {
  content: "" !important;
  position: absolute !important;
  inset: auto !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  display: block !important;
  width: 14px !important;
  height: 2px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: currentColor !important;
  box-shadow: 0 0 8px rgba(165, 243, 252, 0.48) !important;
  opacity: 1 !important;
  pointer-events: none !important;
  transform-origin: center !important;
}

html body.game-body .attack-setup-popup-card .attack-setup-popup-close::before,
html body.game-body .district-action-confirm-popup-card .attack-setup-popup-close::before {
  transform: translate(-50%, -50%) rotate(45deg) !important;
}

html body.game-body .attack-setup-popup-card .attack-setup-popup-close::after,
html body.game-body .district-action-confirm-popup-card .attack-setup-popup-close::after {
  transform: translate(-50%, -50%) rotate(-45deg) !important;
}

/* Final loaded action-specific neon close guard for confirmation cards. */
html body.game-body .attack-setup-popup-card .attack-setup-popup-close,
html body.game-body .district-action-confirm-popup-card .attack-setup-popup-close {
  --action-close-rgb: var(--result-accent-rgb, var(--district-action-rgb, var(--district-accent-rgb, 103, 232, 249)));
  --action-close-secondary-rgb: var(--result-secondary-rgb, var(--district-secondary-rgb, 207, 250, 254));
  top: 9px !important;
  right: 9px !important;
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  border-color: rgba(var(--action-close-rgb), 0.72) !important;
  background:
    radial-gradient(circle at 34% 28%, rgba(var(--action-close-secondary-rgb), 0.34), transparent 38%),
    radial-gradient(circle at 50% 58%, rgba(var(--action-close-rgb), 0.16), transparent 62%),
    rgba(3, 8, 16, 0.74) !important;
  color: rgba(var(--action-close-secondary-rgb), 0.98) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.08),
    inset 0 0 10px rgba(var(--action-close-rgb), 0.16),
    0 0 10px rgba(var(--action-close-rgb), 0.42),
    0 0 18px rgba(var(--action-close-rgb), 0.18),
    0 5px 12px rgba(2, 6, 23, 0.26) !important;
}

html body.game-body .attack-setup-popup-card .attack-setup-popup-close::before,
html body.game-body .district-action-confirm-popup-card .attack-setup-popup-close::before,
html body.game-body .attack-setup-popup-card .attack-setup-popup-close::after,
html body.game-body .district-action-confirm-popup-card .attack-setup-popup-close::after {
  width: 9px !important;
  height: 1.5px !important;
  box-shadow:
    0 0 5px rgba(var(--action-close-rgb), 0.86),
    0 0 10px rgba(var(--action-close-rgb), 0.34) !important;
}

/* Final loaded transparency guard for robbery result and spy confirmation cards. */
html body.game-body #raid-result-modal .spy-result-modal__content {
  background:
    radial-gradient(circle at 16% 10%, rgba(168, 85, 247, 0.15), transparent 34%),
    radial-gradient(circle at 88% 82%, rgba(217, 70, 239, 0.1), transparent 38%),
    linear-gradient(180deg, rgba(25, 14, 43, 0.24), rgba(10, 8, 20, 0.3)),
    rgba(5, 6, 14, 0.2) !important;
  backdrop-filter: blur(24px) saturate(155%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(155%) !important;
}

html body.game-body #spy-confirm-modal .spy-confirm-popup-card {
  display: flex !important;
  flex-direction: column !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
    radial-gradient(circle at 50% 0%, rgba(251, 191, 36, 0.2), transparent 58%),
    linear-gradient(180deg, rgba(180, 83, 9, 0.18), rgba(5, 10, 18, 0.3)),
    rgba(5, 10, 18, 0.34) !important;
  backdrop-filter: blur(24px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(150%) !important;
}

html body.game-body #spy-confirm-modal .spy-confirm-popup-card .district-modal-hero {
  display: block !important;
  flex: 0 0 146px !important;
  min-height: 146px !important;
  overflow: hidden !important;
}

html body.game-body #spy-confirm-modal .spy-confirm-popup-card .district-modal-hero__image {
  display: block !important;
  opacity: 0.94 !important;
}

html body.game-body #spy-confirm-modal .spy-confirm-popup-body {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

html body.game-body #spy-confirm-modal .spy-confirm-popup-body .attack-setup-popup-row {
  justify-content: space-between !important;
  gap: 10px !important;
  text-align: left !important;
  white-space: nowrap !important;
}

html body.game-body #spy-confirm-modal .spy-confirm-popup-body .attack-setup-popup-row span {
  width: auto !important;
  margin-left: auto !important;
  justify-content: flex-end !important;
  text-align: right !important;
  white-space: nowrap !important;
}

/* Final loaded mobile robbery, city events and district popup guard. */
@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body #events-modal:not(.hidden) > #events-modal-backdrop.modal__backdrop,
  html body.game-modal-scroll-locked #events-modal:not(.hidden) > #events-modal-backdrop.modal__backdrop,
  html body.game-body #event-detail-modal:not(.hidden) > #event-detail-modal-backdrop.modal__backdrop,
  html body.game-modal-scroll-locked #event-detail-modal:not(.hidden) > #event-detail-modal-backdrop.modal__backdrop {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    filter: none !important;
    opacity: 1 !important;
  }

  html body.game-body .robbery-setup-popup-card .robbery-setup-popup-row--deployment {
    grid-column: 1 / -1 !important;
  }

  html body.game-body .robbery-setup-popup-card .robbery-setup-popup-row--deployment > span {
    width: auto !important;
    flex: 0 0 auto !important;
    justify-content: flex-end !important;
  }

  html body.game-body .robbery-setup-popup-card .attack-setup-popup-stepper:has([data-robbery-member-input]) {
    width: min(176px, 58vw) !important;
    grid-template-columns: 34px minmax(66px, 1fr) 34px !important;
    gap: 4px !important;
    padding: 3px !important;
    border-radius: 13px !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.006)),
      rgba(2, 3, 6, 0.86) !important;
  }

  html body.game-body .robbery-setup-popup-card .attack-setup-popup-stepper:has([data-robbery-member-input]) .attack-setup-popup-weapon__input {
    min-width: 66px !important;
    height: 32px !important;
    min-height: 32px !important;
    border-radius: 9px !important;
    font-size: 0.78rem !important;
  }

  html body.game-body .robbery-setup-popup-card .attack-setup-popup-stepper:has([data-robbery-member-input]) .attack-setup-popup-stepper__button {
    width: 34px !important;
    height: 32px !important;
    min-height: 32px !important;
    border-radius: 9px !important;
    font-size: 0.78rem !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent),
      rgba(0, 0, 0, 0.9) !important;
    color: #f7fafc !important;
  }

  html body.game-body.game-modal-scroll-locked .district-popup-shell:not([hidden]),
  html body.game-body:not(.game-modal-scroll-locked) .district-popup-shell[data-district-popup]:not([hidden]) {
    --district-popup-mobile-lower-top: clamp(96px, 24svh, 172px);
    --district-popup-mobile-lower-bottom: max(8px, env(safe-area-inset-bottom));
    align-items: flex-start !important;
    padding: var(--district-popup-mobile-lower-top) 8px var(--district-popup-mobile-lower-bottom) !important;
  }

  html body.game-body.game-modal-scroll-locked .district-popup-shell:not([hidden]) .district-popup-card,
  html body.game-body:not(.game-modal-scroll-locked) .district-popup-shell[data-district-popup]:not([hidden]) .district-popup-card {
    max-height: calc(var(--mobile-locked-vh, 100svh) - var(--district-popup-mobile-lower-top) - var(--district-popup-mobile-lower-bottom)) !important;
    margin: 0 auto !important;
  }

  html body.game-body.game-modal-scroll-locked .district-popup-shell[data-overview-enabled="true"]:not([hidden]),
  html body.game-body:not(.game-modal-scroll-locked) .district-popup-shell[data-district-popup][data-overview-enabled="true"]:not([hidden]) {
    --district-popup-overview-top: calc(var(--mobile-topbar-offset, 72px) + 18px);
    --district-popup-overview-bottom: max(8px, env(safe-area-inset-bottom));
    align-items: flex-start !important;
    padding: var(--district-popup-overview-top) 8px var(--district-popup-overview-bottom) !important;
  }

  html body.game-body.game-modal-scroll-locked .district-popup-shell[data-overview-enabled="true"]:not([hidden]) .district-popup-card,
  html body.game-body:not(.game-modal-scroll-locked) .district-popup-shell[data-district-popup][data-overview-enabled="true"]:not([hidden]) .district-popup-card {
    max-height: calc(var(--mobile-locked-vh, 100svh) - var(--district-popup-overview-top) - var(--district-popup-overview-bottom)) !important;
    margin: 0 auto !important;
  }

  html body.game-body .district-popup-card {
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.007) 36%, transparent),
      linear-gradient(135deg, rgba(var(--district-accent-rgb), 0.04), rgba(255, 255, 255, 0.007) 42%, rgba(3, 8, 16, 0.045)),
      rgba(3, 8, 16, 0.11) !important;
  }

  html body.game-body .district-popup-owner-card,
  html body.game-body .district-popup-status,
  html body.game-body .district-popup-summary-card,
  html body.game-body .district-popup-buildings,
  html body.game-body .district-popup-gossip,
  html body.game-body .district-popup-action-section {
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.003)),
      rgba(7, 13, 24, 0.09) !important;
  }
}

/* Final layered popup guard: child windows opened from another popup must always sit above their parent. */
@keyframes mobile-modal-center-pop-in {
  from {
    opacity: 0;
    transform: scale(0.9);
  }

  58% {
    opacity: 1;
    transform: scale(1.018);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes mobile-modal-positioned-top-pop-in {
  from {
    opacity: 0;
    transform: translateX(-50%) scale(0.9);
  }

  58% {
    opacity: 1;
    transform: translateX(-50%) scale(1.018);
  }

  to {
    opacity: 1;
    transform: translateX(-50%) scale(1);
  }
}

/* Market keeps its own centering because the shared popup animation only scales. */
@media (min-width: 721px) {
  html body .market-popup-shell[data-market-popup]:not([hidden]) .market-popup-card {
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    animation: none !important;
    will-change: auto !important;
  }
}

@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body .market-popup-shell[data-market-popup] .market-popup-heading > .market-popup-close::before {
    position: absolute !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    left: 50% !important;
    margin: 0 !important;
    transform: translate(-50%, -50%) !important;
  }
}

@media (min-width: 721px) {
  html body.game-body .wanted-popup-card .wanted-popup-cost-row--mobile {
    display: none !important;
  }
}

/* Keep the player profile and active attack status compact without covering mobile resources. */
html body #police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-district-attack-warning #police-action-result-modal-close {
  top: 9px !important;
  right: 10px !important;
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  padding: 0 !important;
  border-color: rgba(251, 113, 133, 0.72) !important;
  border-radius: 50% !important;
  background: rgba(42, 8, 18, 0.62) !important;
  color: transparent !important;
  box-shadow:
    inset 0 0 8px rgba(251, 113, 133, 0.22),
    0 0 10px rgba(251, 113, 133, 0.5),
    0 0 18px rgba(244, 63, 94, 0.2) !important;
}

html body #police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-district-attack-warning #police-action-result-modal-close::before,
html body #police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-district-attack-warning #police-action-result-modal-close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 1px;
  border-radius: 1px;
  background: #fb7185;
  box-shadow: 0 0 5px rgba(251, 113, 133, 0.92);
}

html body #police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-district-attack-warning #police-action-result-modal-close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

html body #police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-district-attack-warning #police-action-result-modal-close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body #police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-district-attack-warning {
    width: min(520px, calc(100vw - 20px)) !important;
    border-color: rgba(251, 113, 133, 0.56) !important;
    background:
      linear-gradient(145deg, rgba(104, 18, 42, 0.42), rgba(18, 7, 18, 0.58) 58%, rgba(75, 12, 28, 0.44)) !important;
    backdrop-filter: blur(28px) saturate(165%) !important;
    -webkit-backdrop-filter: blur(28px) saturate(165%) !important;
  }

  html body #police-action-result-modal:not(.hidden):not([hidden]) .police-action-result-modal__content.is-district-attack-warning .police-action-result-modal__details {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.player-popup-shell:not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(.player-popup-shell:not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.player-popup-shell:not([hidden])) .game-resource-strip {
    z-index: 24050 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.player-popup-shell:not([hidden])) .game-resource-strip > * {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked .player-popup-shell:not([hidden]) {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    padding: calc(var(--mobile-overlay-top-offset, var(--mobile-topbar-offset, 72px)) + 8px) 8px max(8px, env(safe-area-inset-bottom)) !important;
    box-sizing: border-box !important;
  }

  html body.game-body.game-modal-scroll-locked .player-popup-shell:not([hidden]) .player-popup-card {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: min(520px, 100%) !important;
    max-height: calc(var(--mobile-locked-vh, 100svh) - var(--mobile-overlay-top-offset, var(--mobile-topbar-offset, 72px)) - 16px) !important;
    margin: 0 !important;
    transform: none !important;
  }
}

/* Final Lockdown entry and final ranking. */
.final-lockdown-modal[hidden] {
  display: none !important;
}

.final-lockdown-modal {
  position: fixed;
  z-index: 2147483500;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
}

.final-lockdown-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 6, 12, 0.86);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.final-lockdown-modal__card {
  position: relative;
  width: min(620px, 100%);
  max-height: min(760px, calc(100vh - 48px));
  overflow: auto;
  border: 1px solid rgba(248, 113, 113, 0.7);
  border-radius: 8px;
  padding: 34px;
  background: #0a1018;
  box-shadow: 0 24px 90px rgba(0, 0, 0, 0.72), inset 0 1px 0 rgba(255, 255, 255, 0.07);
  color: #eef6ff;
}

.final-lockdown-modal__card::before {
  position: absolute;
  top: 0;
  right: 28px;
  left: 28px;
  height: 3px;
  content: "";
  background: #f87171;
  box-shadow: 0 0 18px rgba(248, 113, 113, 0.8);
}

.final-lockdown-modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(226, 232, 240, 0.24);
  border-radius: 4px;
  padding: 0;
  background: #121c28;
  color: #f8fafc;
  font-size: 22px;
  line-height: 1;
}

.final-lockdown-modal__close:hover,
.final-lockdown-modal__close:focus-visible {
  border-color: #f87171;
  background: #3b1015;
}

.final-lockdown-modal__eyebrow,
.final-lockdown-modal__section-label {
  display: block;
  color: #fca5a5;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.final-lockdown-modal h2 {
  margin: 8px 44px 10px 0;
  color: #ffffff;
  font-size: 30px;
  line-height: 1.08;
}

.final-lockdown-modal__lead {
  max-width: 540px;
  margin: 0;
  color: #b9c7d8;
  font-size: 15px;
  line-height: 1.55;
}

.final-lockdown-modal__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin: 24px 0;
}

.final-lockdown-modal__stat {
  min-height: 82px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 5px;
  padding: 12px;
  background: #0e1722;
}

.final-lockdown-modal__stat span {
  display: block;
  color: #8ea1b8;
  font-size: 11px;
  font-weight: 700;
}

.final-lockdown-modal__stat strong {
  display: block;
  margin-top: 8px;
  color: #ffffff;
  font-size: 20px;
}

.final-lockdown-modal__ranking {
  border-top: 1px solid rgba(148, 163, 184, 0.2);
  padding-top: 18px;
}

.final-lockdown-modal__ranking ol {
  display: grid;
  gap: 7px;
  margin: 11px 0 0;
  padding: 0;
  list-style: none;
}

.final-lockdown-modal__ranking li {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 4px;
  padding: 0 12px;
  background: #0d1620;
}

.final-lockdown-modal__ranking li span,
.final-lockdown-modal__ranking li em {
  color: #94a3b8;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.final-lockdown-modal__ranking li strong {
  overflow: hidden;
  color: #eaf2fa;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.final-lockdown-modal .is-current-player {
  border-color: rgba(34, 211, 238, 0.65);
  background: #102532;
}

.final-lockdown-modal__confirm {
  width: 100%;
  min-height: 44px;
  margin-top: 22px;
  border: 1px solid #fb7185;
  border-radius: 4px;
  background: #a61b35;
  color: #ffffff;
  font-weight: 800;
}

.final-lockdown-modal__confirm:hover,
.final-lockdown-modal__confirm:focus-visible {
  background: #c92343;
}

.final-lockdown-modal__results-table-wrap {
  overflow-x: auto;
  margin-top: 23px;
  border: 1px solid rgba(148, 163, 184, 0.22);
}

.final-lockdown-modal__results-table {
  width: 100%;
  min-width: 480px;
  border-collapse: collapse;
  text-align: left;
}

.final-lockdown-modal__results-table th,
.final-lockdown-modal__results-table td {
  border-bottom: 1px solid rgba(148, 163, 184, 0.14);
  padding: 12px 14px;
  color: #c7d4e2;
  font-size: 13px;
}

.final-lockdown-modal__results-table th {
  color: #8ea1b8;
  font-size: 11px;
  text-transform: uppercase;
}

.final-lockdown-modal__results-table td:nth-child(1),
.final-lockdown-modal__results-table td:nth-child(3),
.final-lockdown-modal__results-table td:nth-child(4) {
  font-weight: 800;
  white-space: nowrap;
}

.final-lockdown-modal__results-table tr:last-child td {
  border-bottom: 0;
}

@media (max-width: 720px) {
  .final-lockdown-modal {
    align-items: end;
    padding: 10px;
  }

  .final-lockdown-modal__card {
    max-height: calc(100vh - 20px);
    padding: 28px 18px 18px;
  }

  .final-lockdown-modal h2 {
    font-size: 25px;
  }

  .final-lockdown-modal__stats {
    grid-template-columns: 1fr;
  }

  .final-lockdown-modal__stat {
    display: flex;
    min-height: 0;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }

  .final-lockdown-modal__stat strong {
    margin: 0;
  }
}

@media (min-width: 721px) {
  html body.game-body #spy-result-modal .spy-result-modal__content.is-occupy-result .spy-result-modal__details {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

}

html body.game-body :is(
  .district-popup-shell[data-district-popup]:not([hidden]),
  #buildings-modal.buildings-popup-shell:not([hidden]),
  .wanted-popup-shell:not([hidden]),
  .player-popup-shell:not([hidden]),
    .alliance-popup-shell:not([hidden]),
    .market-popup-shell:not([hidden]),
    .storage-popup-shell:not([hidden]),
    #events-modal:not(.hidden):not([hidden]),
    #event-detail-modal:not(.hidden):not([hidden]),
    #bounty-modal:not(.hidden):not([hidden]),
    #bounty-confirm-modal:not(.hidden):not([hidden]),
    #boost-modal:not(.hidden):not([hidden]),
    #faction-actions-modal:not(.hidden):not([hidden]),
    #battle-royale-info-modal:not(.hidden):not([hidden]),
    #alliance-modal:not(.hidden):not([hidden]),
    #alliance-create-modal:not(.hidden):not([hidden]),
    #alliance-leave-modal:not(.hidden):not([hidden]),
    #alliance-ready-confirm-modal:not(.hidden):not([hidden]),
    #alliance-public-action-modal:not(.hidden):not([hidden]),
    #alliance-kick-confirm-modal:not(.hidden):not([hidden]),
    .leaderboard-popup-shell:not([hidden])
) {
  z-index: 22000 !important;
  isolation: isolate !important;
}

html body.game-body :is(
  .attack-setup-popup-shell:not([hidden]),
  .robbery-setup-popup-shell:not([hidden]),
  .defense-setup-popup-shell:not([hidden]),
  .district-building-detail-shell:not([hidden]),
  .armory-popup-shell:not([hidden]),
  .pharmacy-popup-shell:not([hidden]),
  .druglab-popup-shell:not([hidden]),
  .factory-popup-shell:not([hidden])
) {
  z-index: 23500 !important;
  isolation: isolate !important;
}

html body.game-body :is(
  #attack-confirm-modal:not(.hidden):not([hidden]),
  #raid-confirm-modal:not(.hidden):not([hidden]),
  #trap-confirm-modal:not(.hidden):not([hidden]),
  #spy-confirm-modal:not(.hidden):not([hidden]),
  #occupy-confirm-modal:not(.hidden):not([hidden]),
  #spy-result-modal:not(.hidden):not([hidden]),
  #spy-warning-modal:not(.hidden):not([hidden]),
  #raid-result-modal:not(.hidden):not([hidden]),
  #attack-result-modal:not(.hidden):not([hidden]),
  #police-action-result-modal:not(.hidden):not([hidden])
) {
  z-index: 24000 !important;
  isolation: isolate !important;
}

html body.game-body :is(
  #attack-confirm-modal:not(.hidden):not([hidden]),
  #raid-confirm-modal:not(.hidden):not([hidden]),
  #trap-confirm-modal:not(.hidden):not([hidden]),
  #spy-confirm-modal:not(.hidden):not([hidden]),
  #occupy-confirm-modal:not(.hidden):not([hidden])
) > .modal__backdrop {
  z-index: 0 !important;
}

html body.game-body :is(
  #attack-confirm-modal:not(.hidden):not([hidden]),
  #raid-confirm-modal:not(.hidden):not([hidden]),
  #trap-confirm-modal:not(.hidden):not([hidden]),
  #spy-confirm-modal:not(.hidden):not([hidden]),
  #occupy-confirm-modal:not(.hidden):not([hidden])
) > .district-action-confirm-popup-card,
html body.game-body :is(
  #attack-confirm-modal:not(.hidden):not([hidden]),
  #raid-confirm-modal:not(.hidden):not([hidden]),
  #trap-confirm-modal:not(.hidden):not([hidden]),
  #spy-confirm-modal:not(.hidden):not([hidden]),
  #occupy-confirm-modal:not(.hidden):not([hidden])
) > .modal__content {
  position: relative !important;
  z-index: 2 !important;
}

@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body.game-modal-scroll-locked:has(:is(
    #attack-confirm-modal:not(.hidden):not([hidden]),
    #raid-confirm-modal:not(.hidden):not([hidden]),
    #trap-confirm-modal:not(.hidden):not([hidden]),
    #spy-confirm-modal:not(.hidden):not([hidden]),
    #occupy-confirm-modal:not(.hidden):not([hidden])
  )) :is(
    .district-popup-shell[data-district-popup]:not([hidden]),
    .attack-setup-popup-shell:not([hidden]),
    .robbery-setup-popup-shell:not([hidden]),
    .defense-setup-popup-shell:not([hidden]),
    #buildings-modal.buildings-popup-shell:not([hidden])
  ) {
    z-index: 22000 !important;
  }

  html body.game-body.game-modal-scroll-locked:has(:is(
    .attack-setup-popup-shell:not([hidden]),
    .robbery-setup-popup-shell:not([hidden]),
    .defense-setup-popup-shell:not([hidden]),
    .district-building-detail-shell:not([hidden]),
    .armory-popup-shell:not([hidden]),
    .pharmacy-popup-shell:not([hidden]),
    .druglab-popup-shell:not([hidden]),
    .factory-popup-shell:not([hidden]),
    #event-detail-modal:not(.hidden):not([hidden])
  )) .district-popup-shell[data-district-popup]:not([hidden]) {
    z-index: 22000 !important;
  }

  html body.game-body :is(
    .district-popup-shell[data-district-popup]:not([hidden]) .district-popup-card,
    #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card,
    .market-popup-shell:not([hidden]) .market-popup-card,
    .storage-popup-shell[data-storage-popup]:not([hidden]) .storage-popup-card,
    .armory-popup-shell:not([hidden]) .armory-popup-card,
    .pharmacy-popup-shell:not([hidden]) .pharmacy-popup-card,
    .druglab-popup-shell:not([hidden]) .druglab-popup-card,
    .factory-popup-shell:not([hidden]) .factory-popup-card,
    .district-building-detail-shell:not([hidden]) .district-building-detail-card,
    .alliance-popup-shell:not([hidden]) .alliance-popup-card,
    .leaderboard-popup-shell:not([hidden]) .leaderboard-popup-card
  ) {
    transform-origin: center center !important;
    will-change: transform, opacity !important;
    backface-visibility: hidden !important;
    animation: mobile-modal-center-pop-in 220ms var(--motion-modal-ease, cubic-bezier(0.22, 1, 0.36, 1)) both !important;
  }

  html body.game-body :is(
    #events-modal:not(.hidden):not([hidden]) .modal__content,
    #event-detail-modal:not(.hidden):not([hidden]) .modal__content,
    #bounty-modal:not(.hidden):not([hidden]) .modal__content,
    #bounty-confirm-modal:not(.hidden):not([hidden]) .modal__content,
    #faction-actions-modal:not(.hidden):not([hidden]) .modal__content,
    #battle-royale-info-modal:not(.hidden):not([hidden]) .modal__content,
    #alliance-modal:not(.hidden):not([hidden]) .modal__content,
    #alliance-create-modal:not(.hidden):not([hidden]) .modal__content,
    #alliance-leave-modal:not(.hidden):not([hidden]) .modal__content,
    #alliance-ready-confirm-modal:not(.hidden):not([hidden]) .modal__content,
    #alliance-public-action-modal:not(.hidden):not([hidden]) .modal__content,
    #alliance-kick-confirm-modal:not(.hidden):not([hidden]) .modal__content
  ) {
    transform-origin: center center !important;
    will-change: transform, opacity !important;
    backface-visibility: hidden !important;
    animation: mobile-modal-center-pop-in 220ms var(--motion-modal-ease, cubic-bezier(0.22, 1, 0.36, 1)) both !important;
  }

  html body.game-body #boost-modal:not(.hidden):not([hidden]) .modal__content {
    transform-origin: center center !important;
    will-change: transform, opacity !important;
    backface-visibility: hidden !important;
    animation: mobile-modal-positioned-top-pop-in 220ms var(--motion-modal-ease, cubic-bezier(0.22, 1, 0.36, 1)) both !important;
  }

  html body.game-body :is(
    #events-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    #event-detail-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    #bounty-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    #bounty-confirm-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    #boost-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    #faction-actions-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    #battle-royale-info-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    #alliance-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    #alliance-create-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    #alliance-leave-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    #alliance-ready-confirm-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    #alliance-public-action-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    #alliance-kick-confirm-modal:not(.hidden):not([hidden]) > .modal__backdrop,
    .alliance-popup-shell:not([hidden]) .alliance-popup-backdrop,
    .market-popup-shell:not([hidden]) .market-popup-backdrop,
    .leaderboard-popup-shell:not([hidden]) .leaderboard-popup-backdrop,
    .storage-popup-shell[data-storage-popup]:not([hidden]) .storage-popup-backdrop,
    .armory-popup-shell:not([hidden]) .armory-popup-backdrop,
    .pharmacy-popup-shell:not([hidden]) .pharmacy-popup-backdrop,
    .druglab-popup-shell:not([hidden]) .druglab-popup-backdrop,
    .factory-popup-shell:not([hidden]) .factory-popup-backdrop
  ) {
    animation: ui-fade-in var(--motion-modal-fade-duration, 180ms) ease-out both !important;
  }
}

/* Absolute final mobile robbery confirmation placement guard. */
@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body {
    --robbery-setup-window-safe-top-final: calc(max(var(--mobile-overlay-top-offset, 0px), var(--mobile-topbar-offset, 72px)) + 10px);
    --robbery-setup-window-safe-bottom-final: max(8px, env(safe-area-inset-bottom));
    --robbery-setup-window-safe-height-final: calc(var(--mobile-locked-vh, 100svh) - var(--robbery-setup-window-safe-top-final) - var(--robbery-setup-window-safe-bottom-final));
    --robbery-confirm-window-safe-top-final: calc(max(var(--mobile-overlay-top-offset, 0px), var(--mobile-topbar-offset, 72px)) + 10px);
    --robbery-confirm-window-safe-bottom-final: max(8px, env(safe-area-inset-bottom));
    --robbery-confirm-window-safe-height-final: calc(var(--mobile-locked-vh, 100svh) - var(--robbery-confirm-window-safe-top-final) - var(--robbery-confirm-window-safe-bottom-final));
  }

  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) #game-header,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip {
    z-index: 25050 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar {
    display: block !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) > #game-header,
  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) > .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) > #game-header,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) > .game-topbar {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    z-index: 26050 !important;
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) .game-topbar-inner,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-topbar-inner,
  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) .game-topbar-controls,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-topbar-controls {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: stretch !important;
    justify-content: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar-inner,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar-inner,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar-controls,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar-controls {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: stretch !important;
    justify-content: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked.is-mobile-topbar-condensed:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    justify-items: stretch !important;
    justify-content: stretch !important;
    align-items: stretch !important;
    gap: 6px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip > *,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip > *,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip > *,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-topbar .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(#raid-confirm-modal:not(.hidden):not([hidden])) .game-resource-strip > * {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip > .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip > .resource-pill {
    display: flex !important;
  }

  html body.game-body.game-modal-scroll-locked:has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip > .game-toolbar-button,
  html body.game-body.game-modal-scroll-locked:has(.district-popup-shell:not([hidden])):has(.robbery-setup-popup-shell:not([hidden])) .game-resource-strip > .game-toolbar-button {
    display: inline-flex !important;
  }

  html body.game-modal-scroll-locked .robbery-setup-popup-shell:not([hidden]) {
    padding: var(--robbery-setup-window-safe-top-final) 8px var(--robbery-setup-window-safe-bottom-final) !important;
  }

  html body.game-modal-scroll-locked .robbery-setup-popup-shell:not([hidden]) .robbery-setup-popup-card {
    max-height: var(--robbery-setup-window-safe-height-final) !important;
  }

  html body #raid-confirm-modal:not(.hidden):not([hidden]),
  html body.game-modal-scroll-locked #raid-confirm-modal:not(.hidden):not([hidden]) {
    position: fixed !important;
    inset: 0 !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    width: 100vw !important;
    height: var(--mobile-locked-vh, 100svh) !important;
    min-height: 0 !important;
    padding: var(--robbery-confirm-window-safe-top-final) 8px var(--robbery-confirm-window-safe-bottom-final) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  html body #raid-confirm-modal:not(.hidden):not([hidden]) .modal__content,
  html body.game-modal-scroll-locked #raid-confirm-modal:not(.hidden):not([hidden]) .modal__content {
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    width: min(620px, calc(100vw - 28px)) !important;
    max-height: var(--robbery-confirm-window-safe-height-final) !important;
    margin: 0 auto !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
  }
}

/* Final desktop modal topbar content guard. */
@media (min-width: 721px) {
  html.game-modal-scroll-locked body.game-body::before {
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked > .game-topbar,
  html body.game-body.alliance-modal-open > .game-topbar {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    z-index: 26050 !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked > .game-shell,
  html body.game-body.alliance-modal-open > .game-shell {
    margin-top: var(--modal-topbar-reserve, 52px) !important;
  }

  html body.game-body.game-modal-scroll-locked .game-topbar-inner,
  html body.game-body.alliance-modal-open .game-topbar-inner {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked .game-topbar-controls,
  html body.game-body.alliance-modal-open .game-topbar-controls,
  html body.game-body.game-modal-scroll-locked .game-resource-strip,
  html body.game-body.alliance-modal-open .game-resource-strip {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked .game-resource-strip > .resource-pill,
  html body.game-body.alliance-modal-open .game-resource-strip > .resource-pill {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked .game-resource-strip > .game-toolbar-button,
  html body.game-body.alliance-modal-open .game-resource-strip > .game-toolbar-button {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
  }
}

/* Final district building detail hidden-strip guard. */
html body.game-body .district-building-detail-shell [hidden],
html body.game-body .district-building-detail-shell [aria-hidden="true"],
html body.game-body .district-building-detail-shell .district-building-detail-panel.hidden,
html body.game-body .district-building-detail-shell .building-info-card__section:empty,
html body.game-body .district-building-detail-shell .building-info-card__effects:empty,
html body.game-body .district-building-detail-shell .district-building-detail-actions:empty {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

/* Building detail cards preserve their artwork and anchor special actions at the bottom. */
html body.game-body .district-building-detail-shell.has-building-special-actions .district-building-detail-card.building-detail-modal__content {
  height: clamp(480px, 68dvh, 620px) !important;
}

html body.game-body .district-building-detail-shell.has-building-special-actions .district-building-detail-card .district-building-detail-body {
  flex: 1 1 auto !important;
  padding-bottom: 8px !important;
  overflow-y: auto !important;
}

html body.game-body .district-building-detail-shell.has-building-special-actions .district-building-detail-card .district-building-detail-panel,
html body.game-body .district-building-detail-shell.has-building-special-actions.is-building-detail-single-panel .district-building-detail-card .district-building-detail-panel--merged {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  padding-bottom: 0 !important;
}

html body.game-body .district-building-detail-shell.has-building-special-actions .district-building-detail-card [data-district-building-detail-action-section] {
  margin-top: auto !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

html body.game-body .district-building-detail-shell.has-building-special-actions .district-building-detail-card .district-building-detail-actions {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

@media (max-width: 720px) {
  html body.game-body .district-building-detail-shell.has-building-special-actions .district-building-detail-card.building-detail-modal__content {
    height: min(520px, calc(100dvh - var(--mobile-topbar-offset, 188px) - 20px)) !important;
  }
}

/* Final buildings district type icon pulse guard. */
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn.has-building-pulse:not(:disabled) .buildings-popup__type-pulse {
  position: absolute !important;
  z-index: 4 !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: color-mix(in srgb, var(--buildings-type-text, #e6fbff) 92%, #ffffff) !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-shadow:
    0 0 8px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.82)),
    0 0 18px var(--buildings-type-glow, rgba(34, 211, 238, 0.48)),
    0 0 30px var(--buildings-type-glow, rgba(34, 211, 238, 0.28)) !important;
  pointer-events: none !important;
  animation: buildings-zone-icon-pulse 2.2s ease-in-out infinite !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn.has-building-pulse:not(:disabled) .buildings-popup__type-label,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn.has-building-pulse:not(:disabled) .buildings-popup__type-meta {
  z-index: 3 !important;
}

@media (min-width: 781px) {
  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn.has-building-pulse:not(:disabled) .buildings-popup__type-pulse {
    left: -10px !important;
    top: 52% !important;
    width: 76px !important;
    height: 76px !important;
    font-size: 58px !important;
    transform: translateY(-50%) rotate(-8deg) !important;
  }
}

@media (max-width: 780px) {
  html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__type-btn.has-building-pulse:not(:disabled) .buildings-popup__type-pulse {
    left: 50% !important;
    top: 50% !important;
    width: 46px !important;
    height: 46px !important;
    font-size: 31px !important;
    transform: translate(-50%, -56%) !important;
  }
}

@keyframes buildings-zone-icon-pulse {
  0%,
  100% {
    opacity: 0.34;
    filter: saturate(1.4) brightness(1.05);
  }

  50% {
    opacity: 1;
    filter: saturate(2.1) brightness(1.55) drop-shadow(0 0 14px var(--buildings-type-border-hover, rgba(34, 211, 238, 0.86)));
  }
}

/* Keep the mobile resource strip visible while a result modal is open. */
@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body.game-modal-scroll-locked:has(
    #spy-result-modal:not(.hidden):not([hidden]),
    #spy-warning-modal:not(.hidden):not([hidden]),
    #raid-result-modal:not(.hidden):not([hidden]),
    #attack-result-modal:not(.hidden):not([hidden]),
    #police-action-result-modal:not(.hidden):not([hidden])
  ) #game-header,
  html body.game-body.game-modal-scroll-locked:has(
    #spy-result-modal:not(.hidden):not([hidden]),
    #spy-warning-modal:not(.hidden):not([hidden]),
    #raid-result-modal:not(.hidden):not([hidden]),
    #attack-result-modal:not(.hidden):not([hidden]),
    #police-action-result-modal:not(.hidden):not([hidden])
  ) .game-topbar,
  html body.game-body.game-modal-scroll-locked:has(
    #spy-result-modal:not(.hidden):not([hidden]),
    #spy-warning-modal:not(.hidden):not([hidden]),
    #raid-result-modal:not(.hidden):not([hidden]),
    #attack-result-modal:not(.hidden):not([hidden]),
    #police-action-result-modal:not(.hidden):not([hidden])
  ) .game-resource-strip,
  html body.game-body.game-modal-scroll-locked:has(
    #spy-result-modal:not(.hidden):not([hidden]),
    #spy-warning-modal:not(.hidden):not([hidden]),
    #raid-result-modal:not(.hidden):not([hidden]),
    #attack-result-modal:not(.hidden):not([hidden]),
    #police-action-result-modal:not(.hidden):not([hidden])
  ) .game-topbar .resource-pill,
  html body.game-body.game-modal-scroll-locked:has(
    #spy-result-modal:not(.hidden):not([hidden]),
    #spy-warning-modal:not(.hidden):not([hidden]),
    #raid-result-modal:not(.hidden):not([hidden]),
    #attack-result-modal:not(.hidden):not([hidden]),
    #police-action-result-modal:not(.hidden):not([hidden])
  ) .game-topbar .game-toolbar-button {
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(
    #spy-result-modal:not(.hidden):not([hidden]),
    #spy-warning-modal:not(.hidden):not([hidden]),
    #raid-result-modal:not(.hidden):not([hidden]),
    #attack-result-modal:not(.hidden):not([hidden]),
    #police-action-result-modal:not(.hidden):not([hidden])
  ) .game-topbar {
    display: block !important;
    z-index: 24050 !important;
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(
    #spy-result-modal:not(.hidden):not([hidden]),
    #spy-warning-modal:not(.hidden):not([hidden]),
    #raid-result-modal:not(.hidden):not([hidden]),
    #attack-result-modal:not(.hidden):not([hidden]),
    #police-action-result-modal:not(.hidden):not([hidden])
  ) .game-resource-strip {
    display: grid !important;
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(
    #spy-result-modal:not(.hidden):not([hidden]),
    #spy-warning-modal:not(.hidden):not([hidden]),
    #raid-result-modal:not(.hidden):not([hidden]),
    #attack-result-modal:not(.hidden):not([hidden]),
    #police-action-result-modal:not(.hidden):not([hidden])
  ) .game-resource-strip > * {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }

  html body.game-body.game-modal-scroll-locked:has(
    #spy-result-modal:not(.hidden):not([hidden]),
    #spy-warning-modal:not(.hidden):not([hidden]),
    #raid-result-modal:not(.hidden):not([hidden]),
    #attack-result-modal:not(.hidden):not([hidden]),
    #police-action-result-modal:not(.hidden):not([hidden])
  ) :is(#spy-result-modal, #spy-warning-modal, #raid-result-modal, #attack-result-modal, #police-action-result-modal) {
    padding-top: var(--mobile-topbar-offset, 72px) !important;
  }
}

/* Buildings popup: retain the district image without making the card opaque. */
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content {
  isolation: isolate;
  background:
    linear-gradient(180deg, rgba(3, 7, 18, 0.08), rgba(3, 7, 18, 0.2)),
    rgba(3, 7, 18, 0.08) !important;
  box-shadow:
    inset 0 0 0 1px rgba(148, 163, 184, 0.16),
    inset 0 -26px 60px rgba(2, 6, 23, 0.1),
    0 24px 60px rgba(0, 0, 0, 0.38) !important;
  backdrop-filter: blur(1px) saturate(108%);
  -webkit-backdrop-filter: blur(1px) saturate(108%);
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: var(--buildings-popup-background-image, url("../../img/index.png")) center / cover no-repeat;
  opacity: 0.34;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content > .modal__header,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content > .modal__body {
  position: relative;
  z-index: 1;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__detail-card,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__group--types,
html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__group--names {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.008)),
    rgba(15, 23, 42, 0.3) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.025),
    0 8px 24px rgba(0, 0, 0, 0.16) !important;
  backdrop-filter: blur(2px) saturate(108%);
  -webkit-backdrop-filter: blur(2px) saturate(108%);
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__detail:has(> .buildings-popup__detail-card:not([data-building-district-type])) {
  height: auto !important;
  min-height: 0 !important;
  align-self: start !important;
  overflow: visible !important;
}

html body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup__detail-card:not([data-building-district-type]) {
  height: auto !important;
  min-height: 0 !important;
  align-self: start !important;
  padding-bottom: 18px !important;
}

@media (min-width: 721px) {
  html body.game-body .wanted-popup-card .wanted-popup-hero {
    width: min(100%, 460px) !important;
  }
}

html body.game-body .wanted-popup-card .wanted-popup-cost-row--full {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.game-body .wanted-popup-card .wanted-popup-cost-row--full .wanted-popup-cost {
  display: flex !important;
  min-height: 30px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-radius: 999px !important;
  background: rgba(3, 9, 17, 0.62) !important;
  text-align: center !important;
}

html body.game-body .district-popup-action[data-district-action-id="trap"][data-district-trap-state="active"] {
  --district-action-rgb: 34, 197, 94 !important;
  --district-action-secondary-rgb: 16, 185, 129 !important;
  --district-action-text: #dcfce7 !important;
}

/* Desktop leaderboard close control must render a literal cross, not the old plus glyph. */
@media (min-width: 721px) {
  html body .leaderboard-popup-shell:not([hidden]) .leaderboard-popup-close {
    display: grid !important;
    place-items: center !important;
    font-size: 0 !important;
  }

  html body .leaderboard-popup-shell:not([hidden]) .leaderboard-popup-close::before {
    content: "✕" !important;
    position: absolute !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    left: 50% !important;
    inset: auto !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    color: currentColor !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    transform: translate(-50%, -50%) !important;
  }

  html body .leaderboard-popup-shell:not([hidden]) .leaderboard-popup-close::after {
    content: none !important;
    display: none !important;
  }
}

/* Final desktop market placement: touch-capable desktops must not receive mobile scale-only positioning. */
@media (min-width: 721px) {
  html body.game-body .market-popup-shell[data-market-popup]:not([hidden]) .market-popup-card {
    position: absolute !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    left: 50% !important;
    margin: 0 !important;
    transform: translate(-50%, -50%) !important;
    animation: none !important;
    will-change: auto !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="market"] .market-popup-row__trade {
    grid-template-columns: minmax(124px, 0.7fr) minmax(0, 1fr) !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="market"] .market-popup-row__quantity-controls {
    grid-template-columns: 34px minmax(46px, 1fr) 34px !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="market"] .market-popup-row__quantity {
    width: 100% !important;
    min-width: 46px !important;
    padding: 0 4px !important;
    color: #ffffff !important;
    opacity: 1 !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-hero__copy > .wanted-popup-cost-row {
    margin-top: 10px !important;
    padding: 0 !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-hero__copy > .wanted-popup-cost-row .wanted-popup-cost {
    display: flex !important;
    min-height: 28px !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 999px !important;
    background: rgba(3, 9, 17, 0.58) !important;
    text-align: center !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-hero__copy {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    min-height: 192px !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-value {
    position: absolute !important;
    top: 22px !important;
    right: auto !important;
    left: 50% !important;
    margin: 0 !important;
    font-size: 34px !important;
    transform: translateX(-50%) !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-title {
    justify-content: center !important;
    width: 100% !important;
    margin-top: 58px !important;
    padding-right: 0 !important;
    text-align: center !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-copy {
    width: 100% !important;
    text-align: center !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-hero__copy > .wanted-popup-cost-row {
    align-self: stretch !important;
    margin-top: auto !important;
    padding-top: 26px !important;
  }
}

@media (max-width: 720px) {
  html body.game-body .wanted-popup-card .wanted-popup-hero__copy {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-rows: auto auto !important;
    column-gap: 12px !important;
    align-items: center !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-value {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    margin: 0 !important;
    align-self: center !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-title {
    grid-column: 1 !important;
    grid-row: 1 !important;
    margin: 0 !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-copy {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin: 4px 0 0 !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-hero__copy > .wanted-popup-cost-row {
    display: none !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-cost-row--mobile {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 4px !important;
    margin-top: 8px !important;
    padding: 0 !important;
  }
}

/* Final requested overrides for district actions and gang profile rows. */
html body.game-body .district-popup-action[data-district-action-id="occupy"][data-district-action-disabled-tone="robbery"] .district-popup-action__sub {
  color: #f87171 !important;
  font-weight: 900 !important;
  text-shadow: 0 0 8px rgba(248, 113, 113, 0.32) !important;
}

html body.game-body .district-popup-action[data-district-action-id="occupy"][data-district-action-disabled-tone="occupation"]:disabled {
  border-color: rgba(148, 163, 184, 0.3) !important;
  background:
    linear-gradient(135deg, rgba(71, 85, 105, 0.54), rgba(15, 23, 42, 0.72)),
    rgba(15, 23, 42, 0.64) !important;
  color: rgba(226, 232, 240, 0.76) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 8px 18px rgba(2, 6, 23, 0.18) !important;
  filter: saturate(0.5) !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
}

html body.game-body .district-popup-action[data-district-action-id="occupy"][data-district-action-disabled-tone="occupation"] .district-popup-action__sub {
  color: #f87171 !important;
  font-weight: 900 !important;
  text-shadow: 0 0 8px rgba(248, 113, 113, 0.32) !important;
}

html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--members,
html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--faction,
html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--alliance {
  border-color: rgba(255, 255, 255, 0.14) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.045), transparent 58%),
    rgba(0, 0, 0, 0.58) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    inset 0 0 16px rgba(0, 0, 0, 0.32),
    0 6px 14px rgba(0, 0, 0, 0.16) !important;
}

html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--members :is(.gang-profile-row__label, span:last-child),
html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--faction :is(.gang-profile-row__label, span:last-child),
html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--alliance :is(.gang-profile-row__label, span:last-child) {
  color: #ffffff !important;
  text-shadow: none !important;
}

@media (max-width: 560px) {
  html body.game-body .building-special-action-confirm__actions {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
  }

  html body.game-body .building-special-action-confirm__button {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
  }
}

/* Mobile HEAT and alliance modal corrections. */
@media (max-width: 720px), (hover: none), (pointer: coarse), (any-hover: none), (any-pointer: coarse) {
  html body.game-body .wanted-popup-card .wanted-popup-meta--header {
    display: flex !important;
  }

  html body.game-body .wanted-popup-card .wanted-popup-meta--header .wanted-popup-row:first-child,
  html body.game-body .wanted-popup-card .wanted-popup-meta--mobile {
    display: none !important;
  }

  html body.game-modal-scroll-locked #alliance-modal.modal:not(.hidden):not([hidden]) > .modal__backdrop {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(3, 7, 18, 0.78) !important;
    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}

/* Market quantity steppers keep the selected amount readable between − and +. */
html body.game-body .market-popup-row__quantity-controls {
  display: grid !important;
  grid-template-columns: 32px minmax(44px, 1fr) 32px !important;
  align-items: center !important;
  gap: 6px !important;
  width: 100% !important;
}

html body.game-body .market-popup-row__quantity-step {
  display: grid !important;
  place-items: center !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  border: 1px solid rgba(103, 232, 249, 0.34) !important;
  border-radius: 9px !important;
  background: rgba(5, 15, 27, 0.94) !important;
  color: #dffcff !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  box-shadow: inset 0 0 10px rgba(34, 211, 238, 0.08) !important;
}

html body.game-body .market-popup-row__quantity {
  width: 100% !important;
  min-width: 44px !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: rgba(2, 8, 18, 0.96) !important;
  opacity: 1 !important;
  appearance: textfield !important;
  text-align: center !important;
}

html body.game-body .market-popup-row__quantity::-webkit-inner-spin-button,
html body.game-body .market-popup-row__quantity::-webkit-outer-spin-button {
  margin: 0 !important;
  appearance: none !important;
}

@media (max-width: 720px) {
  /* Buildings: transparent black mobile glass, while desktop keeps its current card. */
  html body.game-body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content {
    background:
      radial-gradient(circle at 18% 0%, rgba(148, 163, 184, 0.1), transparent 38%),
      linear-gradient(180deg, rgba(5, 9, 15, 0.86), rgba(0, 0, 0, 0.9)) !important;
    box-shadow:
      inset 0 0 0 1px rgba(203, 213, 225, 0.12),
      inset 0 -28px 70px rgba(0, 0, 0, 0.28),
      0 24px 60px rgba(0, 0, 0, 0.48) !important;
    backdrop-filter: blur(10px) saturate(108%) !important;
    -webkit-backdrop-filter: blur(10px) saturate(108%) !important;
  }

  html body.game-body #buildings-modal.buildings-popup-shell:not([hidden]) .buildings-popup-card.buildings-modal__content::before {
    opacity: 0.1 !important;
  }

  html body.game-body #buildings-modal.buildings-popup-shell:not([hidden]) :is(
    .buildings-popup__detail-card,
    .buildings-popup__group--types,
    .buildings-popup__group--names
  ) {
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent),
      rgba(3, 7, 12, 0.78) !important;
    backdrop-filter: blur(5px) saturate(106%) !important;
    -webkit-backdrop-filter: blur(5px) saturate(106%) !important;
  }

  /* Spy confirmation keeps the mobile resource bar visible above the card. */
  html body.game-body {
    --spy-confirm-window-safe-top: calc(var(--mobile-topbar-offset, 72px) + 8px);
    --spy-confirm-window-safe-bottom: max(8px, env(safe-area-inset-bottom));
    --spy-confirm-window-safe-height: calc(var(--mobile-locked-vh, 100svh) - var(--spy-confirm-window-safe-top) - var(--spy-confirm-window-safe-bottom));
  }

  html body.game-body.game-modal-scroll-locked.game-spy-confirm-open :is(
    #game-header,
    .game-topbar,
    .game-resource-strip
  ) {
    z-index: 24050 !important;
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
    transform: none !important;
  }

  html body.game-body.game-modal-scroll-locked.game-spy-confirm-open .game-topbar {
    display: block !important;
  }

  html body.game-body.game-modal-scroll-locked.game-spy-confirm-open .game-resource-strip > * {
    visibility: visible !important;
    opacity: 1 !important;
  }

  html body.game-body #spy-confirm-modal:not(.hidden):not([hidden]) {
    align-items: flex-start !important;
    padding: var(--spy-confirm-window-safe-top) 8px var(--spy-confirm-window-safe-bottom) !important;
  }

  html body.game-body #spy-confirm-modal:not(.hidden):not([hidden]) .spy-confirm-popup-card {
    max-height: var(--spy-confirm-window-safe-height) !important;
    margin: 0 auto !important;
  }

  /* Four production buildings use the complete phone height from every entry path. */
  html body.game-body :is(
    .armory-popup-shell,
    .pharmacy-popup-shell,
    .druglab-popup-shell,
    .factory-popup-shell,
    .district-building-detail-shell[data-building-mechanics-type="armory"],
    .district-building-detail-shell[data-building-mechanics-type="pharmacy"],
    .district-building-detail-shell[data-building-mechanics-type="drug-lab"],
    .district-building-detail-shell[data-building-mechanics-type="factory"]
  ):not([hidden]) {
    align-items: stretch !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  html body.game-body :is(
    .armory-popup-shell:not([hidden]) .armory-popup-card.building-detail-modal__content,
    .pharmacy-popup-shell:not([hidden]) .pharmacy-popup-card.building-detail-modal__content,
    .druglab-popup-shell:not([hidden]) .druglab-popup-card.building-detail-modal__content,
    .factory-popup-shell:not([hidden]) .factory-popup-card.building-detail-modal__content,
    .district-building-detail-shell[data-building-mechanics-type="armory"]:not([hidden]) .district-building-detail-card.building-detail-modal__content,
    .district-building-detail-shell[data-building-mechanics-type="pharmacy"]:not([hidden]) .district-building-detail-card.building-detail-modal__content,
    .district-building-detail-shell[data-building-mechanics-type="drug-lab"]:not([hidden]) .district-building-detail-card.building-detail-modal__content,
    .district-building-detail-shell[data-building-mechanics-type="factory"]:not([hidden]) .district-building-detail-card.building-detail-modal__content
  ) {
    position: relative !important;
    inset: auto !important;
    width: min(430px, 100vw) !important;
    height: var(--mobile-locked-vh, 100svh) !important;
    max-height: var(--mobile-locked-vh, 100svh) !important;
    margin: 0 auto !important;
    border-radius: 0 !important;
    transform: none !important;
  }

  /* Factory metrics keep each label and value on one compact line. */
  html body.game-body .factory-popup-card.building-detail-modal__content .factory-slot .drug-production-slot__metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  html body.game-body .factory-popup-card.building-detail-modal__content .factory-slot .drug-production-slot__metric:not(.drug-production-slot__metric--supplies) {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 6px !important;
    min-width: 0 !important;
    padding: 7px 8px !important;
    white-space: nowrap !important;
  }

  html body.game-body .factory-popup-card.building-detail-modal__content .factory-slot .drug-production-slot__metric:not(.drug-production-slot__metric--supplies) :is(
    .drug-production-slot__metric-value,
    .drug-production-slot__metric-inline-value
  ) {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    margin-left: auto !important;
    text-align: right !important;
    white-space: nowrap !important;
  }

  html body.game-body .factory-popup-card.building-detail-modal__content .factory-slot .drug-production-slot__metric--supplies {
    grid-column: 1 / -1 !important;
  }

  /* Mobile market header and tabs stay in one compact row. */
  html body.game-body .market-popup-title[data-mobile-title] {
    font-size: 0 !important;
  }

  html body.game-body .market-popup-title[data-mobile-title]::after {
    content: attr(data-mobile-title);
    font-size: 1rem !important;
    line-height: 1.08 !important;
  }

  html body.game-body .market-popup-tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 4px !important;
  }

  html body.game-body .market-popup-tab {
    min-width: 0 !important;
    padding-inline: 4px !important;
    font-size: clamp(7px, 2.15vw, 9px) !important;
    letter-spacing: 0.015em !important;
    white-space: nowrap !important;
  }

  html body.game-body .market-popup-tab[data-market-tab="market"][data-mobile-label] {
    color: #f8fafc !important;
    -webkit-text-fill-color: #f8fafc !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  html body.game-body .market-popup-row__trade {
    grid-template-columns: max-content minmax(0, 1fr) !important;
    grid-template-areas:
      "qty-label total"
      "qty-controls qty-controls"
      "actions actions" !important;
    align-items: center !important;
  }

  html body.game-body .market-popup-row__quantity-wrap {
    display: contents !important;
  }

  html body.game-body .market-popup-row__quantity-wrap > span {
    grid-area: qty-label !important;
    align-self: center !important;
    white-space: nowrap !important;
  }

  html body.game-body .market-popup-row__total {
    grid-area: total !important;
    justify-self: end !important;
    align-self: center !important;
    min-width: 0 !important;
    text-align: right !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  html body.game-body .market-popup-row__quantity-controls {
    grid-area: qty-controls !important;
    grid-template-columns: 38px minmax(56px, 1fr) 38px !important;
    justify-self: stretch !important;
    min-width: 0 !important;
    margin-top: 2px !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }

  html body.game-body .market-popup-row__quantity-step {
    position: relative !important;
    z-index: 2 !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    line-height: 1 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }

  html body.game-body .market-popup-row__quantity {
    position: relative !important;
    z-index: 1 !important;
    width: 100% !important;
    min-width: 56px !important;
    min-height: 38px !important;
    padding: 0 4px !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    line-height: 38px !important;
    text-align: center !important;
    box-sizing: border-box !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    appearance: textfield !important;
    -moz-appearance: textfield !important;
  }

  html body.game-body .market-popup-row__quantity::-webkit-inner-spin-button,
  html body.game-body .market-popup-row__quantity::-webkit-outer-spin-button {
    margin: 0 !important;
    -webkit-appearance: none !important;
  }

  html body.game-body .market-popup-dashboard__chip[data-market-dashboard-tone="stock"] strong,
  html body.game-body .market-popup-dashboard__chip[data-market-dashboard-tone="timer"] strong {
    color: #facc15 !important;
    text-shadow: 0 0 10px rgba(250, 204, 21, 0.28) !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="market"] .market-popup-row__stock::after {
    background: linear-gradient(90deg, #f59e0b, #fde047) !important;
    box-shadow:
      0 0 10px rgba(245, 158, 11, 0.34),
      0 0 16px rgba(253, 224, 71, 0.22) !important;
  }

  /* Mobile action controls must remain above visual layers and respond to one tap. */
  html body.game-body :is(
    .district-popup-shell:not([hidden]) .district-popup-card,
    .attack-setup-popup-shell:not([hidden]) .attack-setup-popup-card,
    .robbery-setup-popup-shell:not([hidden]) .robbery-setup-popup-card,
    .defense-setup-popup-shell:not([hidden]) .defense-setup-popup-card,
    #attack-confirm-modal:not(.hidden):not([hidden]) .district-action-confirm-popup-card,
    #raid-confirm-modal:not(.hidden):not([hidden]) .district-action-confirm-popup-card,
    #trap-confirm-modal:not(.hidden):not([hidden]) .district-action-confirm-popup-card,
    #spy-confirm-modal:not(.hidden):not([hidden]) .district-action-confirm-popup-card,
    #occupy-confirm-modal:not(.hidden):not([hidden]) .district-action-confirm-popup-card
  ) {
    pointer-events: auto !important;
    isolation: isolate !important;
  }

  html body.game-body :is(
    .district-popup-shell:not([hidden]) .district-popup-card,
    .attack-setup-popup-shell:not([hidden]) .attack-setup-popup-card,
    .robbery-setup-popup-shell:not([hidden]) .robbery-setup-popup-card,
    .defense-setup-popup-shell:not([hidden]) .defense-setup-popup-card,
    #attack-confirm-modal:not(.hidden):not([hidden]) .district-action-confirm-popup-card,
    #raid-confirm-modal:not(.hidden):not([hidden]) .district-action-confirm-popup-card,
    #trap-confirm-modal:not(.hidden):not([hidden]) .district-action-confirm-popup-card,
    #spy-confirm-modal:not(.hidden):not([hidden]) .district-action-confirm-popup-card,
    #occupy-confirm-modal:not(.hidden):not([hidden]) .district-action-confirm-popup-card
  ) :is(
    button:not(:disabled):not([data-district-popup-close]):not(.district-atmosphere-window__close):not(.attack-setup-popup-close):not(.modal__close),
    input:not(:disabled),
    select:not(:disabled)
  ) {
    position: relative !important;
    z-index: 3 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }

  /* Gang profile: three game stats side by side, then full-width faction and alliance. */
  html body.game-body #profile-gang-card.right-panel-card {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
    padding: 8px !important;
  }

  html body.game-body #profile-gang-card.right-panel-card .gang-profile-header {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    margin: 0 !important;
    padding: 2px 2px 7px !important;
  }

  html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row {
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 6px !important;
  }

  html body.game-body #profile-gang-card.right-panel-card :is(
    .profile-row--members,
    .profile-row--wanted,
    .profile-row--districts
  ) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto minmax(18px, auto) !important;
    align-content: center !important;
    justify-items: center !important;
    gap: 3px !important;
    min-height: 48px !important;
    padding: 4px 5px !important;
    text-align: center !important;
  }

  html body.game-body #profile-gang-card.right-panel-card .profile-row--members {
    grid-column: 1 !important;
    grid-row: 2 !important;
  }

  html body.game-body #profile-gang-card.right-panel-card .gang-profile-row.profile-row--wanted {
    grid-column: 2 !important;
    grid-row: 2 !important;
    background:
      linear-gradient(90deg, rgba(254, 202, 202, 0.22), transparent 62%),
      linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
      rgba(45, 8, 13, 0.58) !important;
    border-color: rgba(248, 113, 113, 0.44) !important;
    box-shadow:
      inset 2px 0 0 rgba(248, 113, 113, 0.78),
      inset 0 0 0 1px rgba(255, 255, 255, 0.026),
      0 0 16px rgba(248, 113, 113, 0.16),
      0 6px 14px rgba(0, 0, 0, 0.12) !important;
  }

  html body.game-body #profile-gang-card.right-panel-card .profile-row--districts {
    grid-column: 3 !important;
    grid-row: 2 !important;
  }

  html body.game-body #profile-gang-card.right-panel-card .profile-row--faction {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
  }

  html body.game-body #profile-gang-card.right-panel-card .profile-row--alliance {
    grid-column: 1 / -1 !important;
    grid-row: 4 !important;
  }

  html body.game-body #profile-gang-card.right-panel-card :is(
    .profile-row--members,
    .profile-row--wanted,
    .profile-row--districts
  ) :is(.gang-profile-row__label, span:last-child, .profile-heat-panel) {
    min-width: 0 !important;
    justify-self: center !important;
    text-align: center !important;
  }

  html body.game-body #profile-gang-card.right-panel-card :is(
    .profile-row--members,
    .profile-row--wanted,
    .profile-row--districts
  ) .gang-profile-row__label {
    font-size: clamp(6.5px, 1.9vw, 8px) !important;
    letter-spacing: 0.04em !important;
  }

  html body.game-body #profile-gang-card.right-panel-card .profile-row--wanted .profile-heat-panel {
    min-width: 34px !important;
    min-height: 20px !important;
    padding-inline: 6px !important;
  }

  html body.game-body #profile-gang-card.right-panel-card :is(
    .profile-row--faction,
    .profile-row--alliance
  ) {
    grid-template-columns: minmax(74px, 0.7fr) minmax(0, 1fr) !important;
    min-height: 30px !important;
    padding: 6px 8px !important;
  }
}

/* Final rumor inbox and player bazaar sizing. */
html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading {
  align-items: center !important;
  min-height: 52px !important;
  margin: 0 0 12px !important;
  padding: 9px 10px 9px 14px !important;
  border: 1px solid color-mix(in srgb, var(--market-accent) 28%, rgba(148, 163, 184, 0.18)) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(105deg, color-mix(in srgb, var(--market-accent) 10%, transparent), transparent 58%),
    rgba(3, 10, 16, 0.82) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.035),
    inset 3px 0 0 color-mix(in srgb, var(--market-accent) 74%, transparent) !important;
}

html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading__copy {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
}

html body.game-body .market-popup-shell[data-market-popup] .market-popup-eyebrow {
  display: none !important;
}

html body.game-body .market-popup-shell[data-market-popup] .market-popup-title {
  margin: 0 !important;
  font-size: clamp(1.14rem, 2vw, 1.5rem) !important;
  line-height: 1.05 !important;
  letter-spacing: 0.045em !important;
  text-transform: uppercase !important;
}

html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading > .market-popup-close {
  flex-basis: 30px !important;
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
}

html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listings {
  min-width: 0 !important;
  align-content: start !important;
}

html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listings__body {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
  padding-right: 2px !important;
}

html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listings__body[data-market-listings-scrollable="true"] {
  max-height: 226px !important;
  padding-right: 7px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(246, 200, 95, 0.66) rgba(255, 255, 255, 0.04) !important;
}

html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listing {
  gap: 6px !important;
  min-height: 106px !important;
  padding: 8px 10px !important;
}

html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listing__head > strong {
  font-size: 0.82rem !important;
}

html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listing__head > span,
html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listing__meta {
  font-size: 0.63rem !important;
}

html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listing__meta {
  gap: 4px 7px !important;
}

html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listing__meta span {
  padding: 3px 6px !important;
}

html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listing__footer > strong {
  font-size: 0.72rem !important;
}

html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listing__footer .button {
  min-height: 32px !important;
  padding: 6px 11px !important;
  font-size: 0.68rem !important;
}

@media (min-width: 721px) {
  html body.game-body .market-popup-shell[data-market-mode="market"] .market-popup-dashboard {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="market"] .market-popup-dashboard__chip:nth-child(1),
  html body.game-body .market-popup-shell[data-market-mode="market"] .market-popup-dashboard__chip:nth-child(2) {
    grid-column: span 3 !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="market"] .market-popup-dashboard__chip:nth-child(3),
  html body.game-body .market-popup-shell[data-market-mode="market"] .market-popup-dashboard__chip:nth-child(4),
  html body.game-body .market-popup-shell[data-market-mode="market"] .market-popup-dashboard__recent {
    grid-column: span 2 !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-popup-dashboard {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-popup-dashboard__chip:nth-child(1),
  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-popup-dashboard__chip:nth-child(2) {
    grid-column: span 3 !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-popup-dashboard__chip:nth-child(3),
  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-popup-dashboard__chip:nth-child(4),
  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-popup-dashboard__recent {
    grid-column: span 2 !important;
  }
}

@media (max-width: 720px) {
  html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading {
    min-height: 48px !important;
    padding: 7px 8px 7px 11px !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listings__body[data-market-listings-scrollable="true"] {
    max-height: 292px !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-popup-dashboard__recent {
    grid-column: 1 / -1 !important;
  }
}

/* Building backdrops meet the visible topbar without a transparent seam. */
html body.game-body .district-building-detail-shell:not([hidden]) {
  inset: var(--desktop-topbar-offset, 72px) 0 0 !important;
}

@media (max-width: 720px) {
  html body.game-body .district-building-detail-shell:not([hidden]) {
    inset: var(--mobile-overlay-top-offset, var(--mobile-topbar-offset, 72px)) 0 0 !important;
  }
}

/* Phone market: prioritize trading controls and remove duplicated vertical space. */
@media (max-width: 720px) {
  html body.game-body .market-popup-shell[data-market-popup]:not([hidden]) {
    align-items: stretch !important;
    padding: 0 !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-card {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: var(--mobile-locked-vh, 100svh) !important;
    min-height: 0 !important;
    max-height: var(--mobile-locked-vh, 100svh) !important;
    padding: max(8px, env(safe-area-inset-top)) 8px max(8px, env(safe-area-inset-bottom)) !important;
    overflow: hidden !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading {
    flex: 0 0 auto !important;
    min-height: 40px !important;
    margin-bottom: 6px !important;
    padding: 5px 6px 5px 9px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading > .market-popup-close {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-tabs {
    flex: 0 0 auto !important;
    gap: 3px !important;
    margin-bottom: 6px !important;
    padding: 3px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-tab {
    min-height: 36px !important;
    padding-block: 6px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-dashboard {
    flex: 0 0 auto !important;
    gap: 4px !important;
    margin-bottom: 6px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] :is(
    .market-popup-dashboard__chip,
    .market-popup-dashboard__recent
  ) {
    min-height: 42px !important;
    padding: 5px 7px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-dashboard__chip > span,
  html body.game-body .market-popup-shell[data-market-popup] .market-popup-dashboard__recent-title {
    font-size: 0.54rem !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-dashboard__chip > strong {
    font-size: 0.76rem !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-dashboard__recent {
    grid-template-columns: minmax(92px, auto) minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 5px 8px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-dashboard__recent-header {
    align-items: center !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] :is(
    .market-popup-dashboard__recent-entry,
    .market-popup-dashboard__recent-empty
  ) {
    min-width: 0 !important;
    font-size: 0.64rem !important;
    text-align: right !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-copy {
    display: none !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-feedback:not([hidden]):not(:empty) {
    flex: 0 0 auto !important;
    margin-bottom: 6px !important;
    padding: 6px 8px !important;
    font-size: 0.7rem !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-list {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    gap: 6px !important;
    padding: 0 1px 2px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: auto !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row {
    gap: 7px !important;
    padding: 9px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__info {
    gap: 2px 8px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__price {
    display: none !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__facts {
    gap: 4px !important;
    margin-top: 3px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__fact {
    gap: 1px !important;
    padding: 5px 6px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__trade {
    gap: 5px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__quantity-controls {
    margin-top: 0 !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__actions {
    gap: 5px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__actions > .button {
    min-height: 38px !important;
    padding: 6px 7px !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player {
    gap: 8px !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-sell-panel {
    padding: 10px !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-form {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    margin-top: 8px !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-sell-button {
    grid-column: 1 / -1 !important;
    min-height: 38px !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-input {
    min-height: 38px !important;
    padding: 6px 8px !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listings__body[data-market-listings-scrollable="true"] {
    max-height: none !important;
    padding-right: 2px !important;
    overflow: visible !important;
    scrollbar-gutter: auto !important;
  }

  html body.game-body .market-popup-shell[data-market-mode="player-market"] .market-player-listing {
    min-height: 0 !important;
  }
}

/* Phone market: keep quantity steppers and trade actions on one compact row. */
@media (max-width: 720px) {
  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__trade {
    grid-template-columns: minmax(86px, 0.72fr) minmax(0, 1.45fr) !important;
    grid-template-areas:
      "total total"
      "qty-controls actions" !important;
    gap: 4px 5px !important;
    padding: 7px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__quantity-wrap > span {
    display: none !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__total {
    justify-self: stretch !important;
    min-height: 12px !important;
    font-size: 0.58rem !important;
    line-height: 1.1 !important;
    text-align: right !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__quantity-controls {
    grid-template-columns: 26px minmax(32px, 1fr) 26px !important;
    align-self: stretch !important;
    gap: 3px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__quantity-step {
    width: 26px !important;
    min-width: 26px !important;
    height: 32px !important;
    min-height: 32px !important;
    border-radius: 7px !important;
    font-size: 15px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__quantity {
    min-width: 32px !important;
    min-height: 32px !important;
    height: 32px !important;
    padding: 0 2px !important;
    border-radius: 7px !important;
    font-size: 12px !important;
    line-height: 32px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__actions {
    align-self: stretch !important;
    gap: 3px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__actions[data-market-dual-buy="true"] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-row__actions > .button {
    min-height: 32px !important;
    height: 32px !important;
    padding: 3px 4px !important;
    border-radius: 7px !important;
    font-size: clamp(0.52rem, 2.15vw, 0.64rem) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading > .market-popup-close {
    inset: auto !important;
    flex: 0 0 22px !important;
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    padding: 0 !important;
    border-radius: 6px !important;
    line-height: 1 !important;
    rotate: 0deg !important;
    transform: none !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading > .market-popup-close::before {
    top: 50% !important;
    left: 50% !important;
    font-family: Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    rotate: 0deg !important;
    transform: translate(-50%, -50%) !important;
  }
}

/* Phone gameplay windows use nearly the full screen width. */
@media (max-width: 720px) {
  html body.game-body {
    --mobile-game-window-gutter: max(3px, env(safe-area-inset-left), env(safe-area-inset-right));
    --mobile-game-window-width: calc(100vw - var(--mobile-game-window-gutter) - var(--mobile-game-window-gutter));
  }

  html body.game-body.game-modal-scroll-locked :is(
    .modal:not(.game-authority-gate),
    .district-popup-shell,
    .attack-setup-popup-shell,
    .robbery-setup-popup-shell,
    .defense-setup-popup-shell,
    .buildings-popup-shell,
    .wanted-popup-shell,
    .player-popup-shell,
    .alliance-popup-shell,
    .armory-popup-shell,
    .pharmacy-popup-shell,
    .druglab-popup-shell,
    .factory-popup-shell,
    .leaderboard-popup-shell,
    .storage-popup-shell,
    .district-building-detail-shell
  ):not([hidden]):not(.hidden) {
    padding-right: var(--mobile-game-window-gutter) !important;
    padding-left: var(--mobile-game-window-gutter) !important;
  }

  html body.game-body :is(
    .modal:not(.game-authority-gate):not([hidden]):not(.hidden) > .modal__content,
    .district-popup-shell:not([hidden]) .district-popup-card,
    .attack-setup-popup-shell:not([hidden]) .attack-setup-popup-card,
    .robbery-setup-popup-shell:not([hidden]) .robbery-setup-popup-card,
    .defense-setup-popup-shell:not([hidden]) .defense-setup-popup-card,
    .buildings-popup-shell:not([hidden]) .buildings-popup-card,
    .wanted-popup-shell:not([hidden]) .wanted-popup-card,
    .player-popup-shell:not([hidden]) .player-popup-card,
    .alliance-popup-shell:not([hidden]) .alliance-popup-card,
    .armory-popup-shell:not([hidden]) .armory-popup-card,
    .pharmacy-popup-shell:not([hidden]) .pharmacy-popup-card,
    .druglab-popup-shell:not([hidden]) .druglab-popup-card,
    .factory-popup-shell:not([hidden]) .factory-popup-card,
    .leaderboard-popup-shell:not([hidden]) .leaderboard-popup-card,
    .storage-popup-shell:not([hidden]) .storage-popup-card,
    .district-building-detail-shell:not([hidden]) .building-detail-modal__content
  ) {
    width: min(620px, var(--mobile-game-window-width)) !important;
    max-width: var(--mobile-game-window-width) !important;
    box-sizing: border-box !important;
  }
}

/* Final phone market header: one title and one close control. */
@media (max-width: 720px) {
  html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 24px !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 36px !important;
    margin: 0 0 6px !important;
    padding: 5px 7px !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading__copy {
    display: block !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-title[data-mobile-title] {
    display: block !important;
    min-width: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    font-size: clamp(0.88rem, 4vw, 1rem) !important;
    line-height: 1.05 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-title[data-mobile-title]::before,
  html body.game-body .market-popup-shell[data-market-popup] .market-popup-title[data-mobile-title]::after {
    content: none !important;
    display: none !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading > .market-popup-close {
    position: relative !important;
    inset: auto !important;
    display: grid !important;
    grid-column: 2 !important;
    place-items: center !important;
    justify-self: end !important;
    flex: none !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 7px !important;
    color: #dffbff !important;
    font-family: Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-indent: 0 !important;
    rotate: 0deg !important;
    transform: none !important;
  }

  html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading > .market-popup-close::before,
  html body.game-body .market-popup-shell[data-market-popup] .market-popup-heading > .market-popup-close::after {
    content: none !important;
    display: none !important;
  }

  html body.game-body #events-modal:not(.hidden):not([hidden]) > #events-modal-backdrop.modal__backdrop,
  html body.game-modal-scroll-locked #events-modal:not(.hidden):not([hidden]) > #events-modal-backdrop.modal__backdrop,
  html body.game-body #event-detail-modal:not(.hidden):not([hidden]) > #event-detail-modal-backdrop.modal__backdrop,
  html body.game-modal-scroll-locked #event-detail-modal:not(.hidden):not([hidden]) > #event-detail-modal-backdrop.modal__backdrop {
    background: rgba(0, 0, 0, 0.48) !important;
    backdrop-filter: blur(2px) saturate(96%) !important;
    -webkit-backdrop-filter: blur(2px) saturate(96%) !important;
    filter: none !important;
    opacity: 1 !important;
  }

  html body.game-body.game-mobile-close-guard > #game-header,
  html body.game-body.game-mobile-close-guard > #game-root,
  html body.game-body.game-mobile-close-guard .game-topbar,
  html body.game-body.game-mobile-close-guard .game-resource-strip,
  html body.game-body.game-mobile-close-guard .game-resource-strip > * {
    pointer-events: none !important;
  }
}

html body.game-body .market-popup-shell[data-market-mode="black-market"] .market-popup-row__buy {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
}

html body.game-body .market-popup-shell[data-market-mode="black-market"] .market-popup-row__currency-symbol {
  color: #4dff91 !important;
  font-size: 1.08em !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  text-shadow:
    0 0 5px rgba(77, 255, 145, 0.95),
    0 0 12px rgba(34, 197, 94, 0.78),
    0 0 20px rgba(16, 185, 129, 0.42) !important;
}

html body.game-body .market-popup-shell[data-market-mode="black-market"] .market-popup-row__payment-label {
  font-size: inherit !important;
  line-height: 1 !important;
}

@media (max-width: 480px) {
  html body.game-body .map-phase-toolbar .map-bounty-shortcut {
    display: inline-grid !important;
    flex: 0 0 24px !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    padding: 0 !important;
    place-items: center !important;
    overflow: visible !important;
  }

  html body.game-body .map-phase-toolbar .map-bounty-shortcut svg {
    display: block !important;
    flex: 0 0 14px !important;
    width: 14px !important;
    min-width: 14px !important;
    height: 14px !important;
    min-height: 14px !important;
    overflow: visible !important;
    stroke-width: 2.15 !important;
    filter: drop-shadow(0 0 3px rgba(245, 158, 11, 0.78)) !important;
  }
}

/* Absolute final phone guard: spy confirmation keeps the resource topbar visible and interactive. */
@media (max-width: 720px) {
  html.game-spy-confirm-open body.game-body > #game-header,
  html body.game-body.game-spy-confirm-open > #game-header,
  html body.game-body.game-spy-confirm-open > .game-topbar {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    z-index: 26050 !important;
    display: block !important;
    width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  html.game-spy-confirm-open body.game-body #game-header .game-topbar-inner,
  html body.game-body.game-spy-confirm-open #game-header .game-topbar-inner {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  html.game-spy-confirm-open body.game-body #game-header .game-topbar-controls,
  html body.game-body.game-spy-confirm-open #game-header .game-topbar-controls {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  html.game-spy-confirm-open body.game-body #game-header .game-resource-strip,
  html body.game-body.game-spy-confirm-open #game-header .game-resource-strip,
  html.game-spy-confirm-open body.game-body #game-header .game-resource-strip > *,
  html body.game-body.game-spy-confirm-open #game-header .game-resource-strip > * {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  html.game-spy-confirm-open body.game-body #spy-confirm-modal:not(.hidden):not([hidden]),
  html body.game-body.game-spy-confirm-open #spy-confirm-modal:not(.hidden):not([hidden]) {
    align-items: flex-start !important;
    padding-top: calc(var(--mobile-topbar-offset, 72px) + 8px) !important;
  }

  html.game-spy-confirm-open body.game-body #spy-confirm-modal:not(.hidden):not([hidden]) .spy-confirm-popup-card,
  html body.game-body.game-spy-confirm-open #spy-confirm-modal:not(.hidden):not([hidden]) .spy-confirm-popup-card {
    max-height: calc(var(--mobile-locked-vh, 100svh) - var(--mobile-topbar-offset, 72px) - 16px - env(safe-area-inset-bottom)) !important;
    margin: 0 auto !important;
  }
}

/* Absolute final district action guard: every unavailable server action is neutral with a visible reason. */
html body.game-body .district-popup-action[data-district-action-disabled-tone="unavailable"]:disabled {
  --district-action-rgb: 148, 163, 184 !important;
  --district-action-secondary-rgb: 71, 85, 105 !important;
  --district-action-text: rgba(226, 232, 240, 0.76) !important;
  border-color: rgba(148, 163, 184, 0.3) !important;
  background:
    linear-gradient(135deg, rgba(71, 85, 105, 0.54), rgba(15, 23, 42, 0.76)),
    rgba(15, 23, 42, 0.68) !important;
  color: rgba(226, 232, 240, 0.76) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 8px 18px rgba(2, 6, 23, 0.18) !important;
  filter: saturate(0.42) !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
}

html body.game-body .district-popup-action[data-district-action-disabled-tone="unavailable"]:disabled::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.07), transparent 62%) !important;
}

html body.game-body .district-popup-action[data-district-action-disabled-tone="unavailable"] .district-popup-action__sub {
  color: #f87171 !important;
  font-weight: 900 !important;
  text-shadow: 0 0 8px rgba(248, 113, 113, 0.32) !important;
}

/* Absolute final district glass pass: keep the loaded popup airy without weakening loading/error states. */
html body.game-body .district-popup-shell[data-district-popup]:not([hidden]) .district-popup-backdrop {
  background: rgba(2, 6, 10, 0.08) !important;
  backdrop-filter: blur(9px) saturate(112%) !important;
  -webkit-backdrop-filter: blur(9px) saturate(112%) !important;
}

html body.game-body .district-popup-shell[data-district-popup]:not([hidden]) .district-popup-card:not([data-server-loading="true"]):not([data-server-loading="error"]) {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.038), rgba(255, 255, 255, 0.006) 36%, transparent),
    linear-gradient(135deg, rgba(var(--district-accent-rgb), 0.038), rgba(255, 255, 255, 0.006) 42%, rgba(3, 8, 16, 0.028)),
    rgba(3, 8, 16, 0.055) !important;
  backdrop-filter: blur(13px) saturate(132%) !important;
  -webkit-backdrop-filter: blur(13px) saturate(132%) !important;
}

html body.game-body .district-popup-shell[data-district-popup]:not([hidden]) .district-popup-card:not([data-server-loading="true"]):not([data-server-loading="error"])::before {
  opacity: calc(var(--district-owner-avatar-opacity) * 0.5) !important;
  filter: saturate(0.92) brightness(0.88) contrast(1.01) !important;
}

html body.game-body .district-popup-shell[data-district-popup]:not([hidden]) .district-popup-card:not([data-server-loading="true"]):not([data-server-loading="error"])::after {
  background:
    radial-gradient(circle at 14% -18%, rgba(var(--district-accent-rgb), 0.055), transparent 62%),
    linear-gradient(180deg, rgba(2, 6, 18, 0.004), rgba(2, 6, 18, 0.055)) !important;
}

html body.game-body .district-popup-shell[data-district-popup]:not([hidden]) .district-popup-card:not([data-server-loading="true"]):not([data-server-loading="error"]) .district-popup-body {
  background: transparent !important;
}

html body.game-body .district-popup-shell[data-district-popup]:not([hidden]) .district-popup-card:not([data-server-loading="true"]):not([data-server-loading="error"]) :is(
  .district-popup-owner-card,
  .district-popup-status,
  .district-popup-summary-card,
  .district-popup-buildings,
  .district-popup-gossip,
  .district-popup-action-section
) {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.016), rgba(255, 255, 255, 0.002)),
    rgba(7, 13, 24, 0.055) !important;
}

/* Phone district actions: a pair stays side by side; three or more stack vertically. */
@media (max-width: 720px) {
  html body.game-body .district-popup-actions[data-district-action-count="0"],
  html body.game-body .district-popup-actions[data-district-action-count="1"],
  html body.game-body .district-popup-actions:not([data-district-action-count="0"]):not([data-district-action-count="1"]):not([data-district-action-count="2"]) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body.game-body .district-popup-actions[data-district-action-count="2"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body.game-body .district-popup-actions > .district-popup-action-row:not(:has(.district-popup-action)) {
    grid-column: 1 / -1 !important;
  }
}

/* Desktop district controls: keep the overview switch and close control compact. */
@media (min-width: 721px) {
  html body.game-body .district-popup-shell[data-district-popup]:not([hidden]) {
    inset: 0 !important;
  }

  html body.game-body .district-popup-shell[data-district-popup]:not([hidden]) > .district-popup-backdrop {
    position: fixed !important;
    inset: 0 !important;
  }

  html body.game-body .district-popup-shell[data-district-popup]:not([hidden]) > .district-popup-card {
    top: calc(50% + 28px) !important;
  }

  html body.game-body .district-popup-shell[data-district-popup]:not([hidden]) .district-popup-toggle {
    position: absolute !important;
    top: 8px !important;
    right: 38px !important;
    width: auto !important;
    min-width: 68px !important;
    min-height: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    padding: 0 7px !important;
    border-radius: 7px !important;
    font-size: 0.48rem !important;
    line-height: 1 !important;
    letter-spacing: 0.045em !important;
  }

  html body.game-body .district-popup-shell[data-district-popup]:not([hidden]) .district-popup-close {
    top: 8px !important;
    right: 8px !important;
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    padding: 0 !important;
    border-radius: 7px !important;
    font-size: 0.66rem !important;
    line-height: 1 !important;
  }
}

/* Absolute final phone bounty target guard. */
@media (max-width: 720px) {
  html body.game-body .map-phase-toolbar .map-bounty-shortcut.map-bounty-shortcut--phase {
    display: inline-grid !important;
    flex: 0 0 20px !important;
    place-items: center !important;
    width: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    padding: 0 !important;
    overflow: visible !important;
    border-radius: 6px !important;
  }

  html body.game-body .map-phase-toolbar .map-bounty-shortcut.map-bounty-shortcut--phase svg {
    position: relative !important;
    z-index: 2 !important;
    display: block !important;
    flex: 0 0 12px !important;
    width: 12px !important;
    min-width: 12px !important;
    height: 12px !important;
    min-height: 12px !important;
    overflow: visible !important;
    fill: none !important;
    stroke: #ff9aaa !important;
    stroke-width: 2.2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    opacity: 1 !important;
    visibility: visible !important;
    filter:
      drop-shadow(0 0 2px rgba(255, 255, 255, 0.95))
      drop-shadow(0 0 5px rgba(255, 55, 92, 0.98))
      drop-shadow(0 0 9px rgba(255, 35, 75, 0.72)) !important;
  }
}

/* Absolute final close-control reliability guard. */
html body.game-body button:is(
  [aria-label*="Zavřít" i],
  [aria-label*="Close" i],
  .modal__close,
  [class*="__close"],
  [class*="-close"]
):not([class*="backdrop"]) {
  z-index: 2147480 !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
  user-select: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  isolation: isolate !important;
}

html body.game-body button:is(
  [aria-label*="Zavřít" i],
  [aria-label*="Close" i],
  .modal__close,
  [class*="__close"],
  [class*="-close"]
):not([class*="backdrop"])::before,
html body.game-body button:is(
  [aria-label*="Zavřít" i],
  [aria-label*="Close" i],
  .modal__close,
  [class*="__close"],
  [class*="-close"]
):not([class*="backdrop"])::after {
  pointer-events: none !important;
}