/*
 * Optional battle-display treatment. The data-crt attribute on #app is the
 * feature switch: use "subtle" (default), "reduced", or remove it to disable
 * the effect. Keeping this layer separate prevents it from affecting layout or
 * gameplay and makes the entire treatment a one-link rollback.
 */

.battle-crt-overlay {
  display: none;
}

#app[data-crt="subtle"] {
  --battle-crt-scanline-opacity: 0.045;
  --battle-crt-vignette-opacity: 0.1;
  --battle-crt-glow-opacity: 0.12;
  --battle-crt-glow-radius: 5px;
}

#app[data-crt="reduced"] {
  --battle-crt-scanline-opacity: 0.035;
  --battle-crt-vignette-opacity: 0.06;
  --battle-crt-glow-opacity: 0.07;
  --battle-crt-glow-radius: 4px;
}

.is-battle-screen:not(.is-dev-art-board) #app[data-crt] .battle-crt-overlay {
  position: absolute;
  z-index: 35;
  inset: 0;
  display: block;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(
      ellipse at center,
      transparent 54%,
      rgb(0 12 15 / calc(var(--battle-crt-vignette-opacity) * 0.35)) 78%,
      rgb(0 5 8 / var(--battle-crt-vignette-opacity)) 100%
    );
  box-shadow: inset 0 0 70px rgb(59 190 187 / calc(var(--battle-crt-vignette-opacity) * 0.18));
}

.is-battle-screen #app[data-crt] .battle-crt-overlay::before,
.is-battle-screen #app[data-crt] .battle-crt-overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.is-battle-screen #app[data-crt] .battle-crt-overlay::before {
  display: none;
  opacity: var(--battle-crt-scanline-opacity);
  background: repeating-linear-gradient(
    0deg,
    rgb(0 7 9 / 0.82) 0,
    rgb(0 7 9 / 0.82) 1px,
    rgb(137 232 221 / 0.1) 1px,
    rgb(137 232 221 / 0.1) 2px,
    transparent 2px,
    transparent 4px
  );
  mix-blend-mode: soft-light;
}

.is-battle-screen #app[data-crt] .battle-crt-overlay::after {
  display: none;
}

.is-battle-screen #app[data-crt] :is(
  .hud__label,
  .hud__val,
  .enemy-strength-hud__label,
  .enemy-strength-hud__core,
  .enemy-turn-hud,
  .hud-identity-card__copy
) {
  text-shadow: 0 0 var(--battle-crt-glow-radius) rgb(119 241 225 / var(--battle-crt-glow-opacity));
}

@media (prefers-reduced-motion: reduce) {
  .is-battle-screen #app[data-crt] .battle-crt-overlay::after {
    display: none;
    animation: none;
  }
}

@media (prefers-contrast: more), (forced-colors: active) {
  .is-battle-screen #app[data-crt] .battle-crt-overlay {
    display: none;
  }

  .is-battle-screen #app[data-crt] :is(
    .hud__label,
    .hud__val,
    .enemy-strength-hud__label,
    .enemy-strength-hud__core,
    .enemy-turn-hud,
    .hud-identity-card__copy
  ) {
    text-shadow: none;
  }
}