/* V1.313Beta: phone multiplayer keeps one scene surface while preserving all
   card-local, command, targeting and skill animation grammar. The short coarse
   viewport branch covers phones and foldables used in landscape. */
@media (max-width: 760px),
       (orientation: landscape) and (max-height: 560px) and (max-width: 960px) and (pointer: coarse) {
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) {
    background: #07121a !important;
    background-image: none !important;
    background-attachment: scroll !important;
  }

  /* appRoot is the sole painted wallpaper owner. The arena and battle remain
     transparent, avoiding three duplicate fixed full-viewport paints. */
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app:is(.team-battle-app, .identity-battle-app) {
    background: var(--battle-wallpaper-art, var(--battle-visible-surface)) center center / cover no-repeat #07121a !important;
    background-attachment: scroll !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app:is(.team-battle-app, .identity-battle-app) > .arena,
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app:is(.team-battle-app, .identity-battle-app)
  #battle#battle#battle#battle#battle#battle#battle#battle.battle.team-mode:not([hidden]) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    background-attachment: scroll !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  /* Retire only scene-sized decorative planes. Card frames, target reticles,
     command feedback and authored combat effects are deliberately untouched. */
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app:is(.team-battle-app, .identity-battle-app)::before,
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app:is(.team-battle-app, .identity-battle-app)::after,
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app:is(.team-battle-app, .identity-battle-app) > .arena::before,
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app:is(.team-battle-app, .identity-battle-app) > .arena::after,
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app:is(.team-battle-app, .identity-battle-app)
  #battle#battle#battle#battle#battle#battle#battle#battle.battle.team-mode:not([hidden])::before,
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app:is(.team-battle-app, .identity-battle-app)
  #battle#battle#battle#battle#battle#battle#battle#battle.battle.team-mode:not([hidden])::after,
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #teamBoard#teamBoard#teamBoard#teamBoard.team-board::before,
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #teamBoard#teamBoard#teamBoard#teamBoard.team-board::after,
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #seatRing#seatRing#seatRing#seatRing.seat-ring::before,
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #seatRing#seatRing#seatRing#seatRing.seat-ring::after {
    content: none !important;
    display: none !important;
    animation: none !important;
    background: none !important;
    filter: none !important;
    mix-blend-mode: normal !important;
  }

  /* The log is a large fixed pane on phones; retain its opaque treatment but
     remove live sampling of the wallpaper behind it. */
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden]),
  html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"])
  #sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden]) > section {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}
