/* v2.81: battle card typography, persistent map backdrop and mobile low-power rendering. */

/* Battle card name and description use the same type size.
   The name receives the requested warm yellow hierarchy. */
.battle-screen.battle-visual-upgraded .fighter-card-visual .revealed-card-copy b {
  color: #e9c66f !important;
}

.battle-screen.battle-visual-upgraded .fighter-card-visual .revealed-card-description-v280 {
  display: block !important;
  width: 100%;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  color: rgba(241, 232, 213, .84) !important;
  font-size: 15px !important;
  line-height: 1.34 !important;
  font-weight: 600;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
}

/* Keep the decoded campaign backdrop as a persistent DOM layer across root rerenders.
   This prevents a blank map frame while AI-turn UI is rebuilt. */
#campaign-map .mapbox {
  position: relative;
}

#campaign-map .mapbox.map-static-backdrop-host-v281 {
  background-image: none !important;
}

#campaign-map .map-static-backdrop-v281 {
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  contain: paint;
  pointer-events: none;
}

#campaign-map .mapbox.map-static-backdrop-host-v281::before {
  z-index: 1;
}

#campaign-map .mapbox.map-static-backdrop-host-v281 .territory-glow {
  z-index: 1;
}

/* AI/busy turn map state should not create extra transition/filter compositing work. */
#app.low-power-turn-v281 #campaign-map .mapbox,
#app.low-power-turn-v281 #campaign-map .node,
#app.low-power-turn-v281 #campaign-map .city-node-icon,
#app.low-power-turn-v281 #campaign-map .node-halo,
#app.low-power-turn-v281 #campaign-map .city-castle-shell {
  transition: none !important;
}

@media (max-width: 760px) {
  .battle-screen.battle-visual-upgraded .fighter-card-visual .revealed-card-copy b,
  .battle-screen.battle-visual-upgraded .fighter-card-visual .revealed-card-description-v280 {
    font-size: 11px !important;
  }

  .battle-screen.battle-visual-upgraded .fighter-card-visual .revealed-card-description-v280 {
    line-height: 1.34 !important;
  }
}

@media (hover: none), (pointer: coarse) {
  /* Blur-backed sticky surfaces are expensive on mobile Safari during scroll/repaint. */
  .top,
  .battle-card-draft .card-draft-footer,
  .battle-screen.battle-visual-upgraded .battle-buttons {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  /* During automated turns, keep the map readable but remove GPU-heavy decoration. */
  #app.low-power-turn-v281 #campaign-map .territory-glow {
    display: none !important;
  }

  #app.low-power-turn-v281 #campaign-map .city-node-icon {
    filter: none !important;
  }

  #app.low-power-turn-v281 #campaign-map .node-halo {
    box-shadow: none !important;
  }

  /* Preserve the fire cue as a static gradient instead of a continuous GPU animation. */
  .battle-screen.battle-visual-upgraded .visual-fire-active .fighter-visual-slot::after {
    animation: none !important;
    filter: none !important;
    mix-blend-mode: screen !important;
    opacity: .76;
  }
  .battle-screen.battle-visual-upgraded .visual-fire-active .fighter-visual-slot::before,
  #campaign-map .storm-ring i,
  #campaign-map .storm-ring::after {
    animation: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #campaign-map .map-static-backdrop-v281,
  #app.low-power-turn-v281 #campaign-map * {
    animation: none !important;
    transition: none !important;
  }
}