/* V1.27Beta-duel-mobile-layout1: rebuild phone 1v1 battle spacing without changing action button art. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle.battle:not([hidden])),
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app),
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) > .arena {
    width: 100vw !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    overflow: hidden !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-edge: max(6px, env(safe-area-inset-left));
    --duel-mobile-edge-r: max(6px, env(safe-area-inset-right));
    --duel-mobile-bottom: max(6px, env(safe-area-inset-bottom));
    --duel-mobile-bottom-row: clamp(38px, 10.6vw, 44px);
    --duel-mobile-action-gap: clamp(4px, 1.35vw, 6px);
    --duel-mobile-action-h: clamp(46px, calc((100vw - 24px) / 3 / 2.5006), 92px);
    --duel-mobile-action-bottom: calc(var(--duel-mobile-bottom) + var(--duel-mobile-bottom-row) + 8px);
    --duel-mobile-stage-bottom: calc(var(--duel-mobile-action-bottom) + var(--duel-mobile-action-h) + 10px);
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 252, 0.06), rgba(215, 232, 230, 0.08)),
      var(--battle-wallpaper-art, var(--battle-visible-surface)) center center / cover no-repeat,
      #eaf7f4 !important;
    box-shadow: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > * {
    box-sizing: border-box !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters {
    position: absolute !important;
    left: var(--duel-mobile-edge) !important;
    right: var(--duel-mobile-edge-r) !important;
    top: max(7px, env(safe-area-inset-top)) !important;
    bottom: var(--duel-mobile-stage-bottom) !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: stretch !important;
    justify-items: stretch !important;
    gap: clamp(4px, 1.3vh, 7px) !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: clamp(4px, 1.1vw, 6px) !important;
    display: grid !important;
    align-items: stretch !important;
    gap: clamp(5px, 1.45vw, 8px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(82, 132, 142, 0.24) !important;
    border-radius: 9px !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.05)),
      rgba(238, 250, 247, 0.22) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.34),
      0 8px 18px rgba(32, 58, 64, 0.12) !important;
    transform: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .you-combatant.you-combatant {
    grid-template-columns: minmax(88px, 0.34fr) minmax(0, 0.66fr) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .opponent-combatant.opponent-combatant {
    grid-template-columns: minmax(0, 0.66fr) minmax(88px, 0.34fr) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant::before,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant::after,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters::before,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters::after {
    content: none !important;
    display: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .versus.versus {
    width: auto !important;
    height: 18px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: rgba(33, 70, 76, 0.74) !important;
    -webkit-text-fill-color: rgba(33, 70, 76, 0.74) !important;
    font-size: 12px !important;
    line-height: 1 !important;
    transform: none !important;
    filter: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .versus.versus::before,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .versus.versus::after {
    content: none !important;
    display: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter.fighter,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    transform: none !important;
    filter: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .you-panel.you-panel {
    order: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #youCard#youCard {
    order: 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #opponentCard#opponentCard {
    order: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .opponent-panel.opponent-panel {
    order: 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel {
    padding: clamp(4px, 1.05vw, 6px) !important;
    display: grid !important;
    grid-template-rows: minmax(14px, auto) minmax(16px, auto) minmax(24px, auto) minmax(19px, auto) minmax(31px, 1fr) minmax(16px, auto) !important;
    align-content: stretch !important;
    gap: 3px !important;
    overflow: hidden !important;
    border: 1px solid rgba(76, 114, 122, 0.24) !important;
    border-radius: 8px !important;
    background:
      linear-gradient(180deg, rgba(21, 45, 52, 0.76), rgba(8, 22, 28, 0.66)),
      rgba(7, 18, 22, 0.62) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.72),
      0 5px 13px rgba(31, 56, 60, 0.12) !important;
    color: #f5fbff !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .status-bar,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .equipment-slots {
    min-height: 0 !important;
    height: auto !important;
    padding: 1px 2px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 2px !important;
    overflow: hidden !important;
    border-radius: 5px !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .equipment-slots {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .meter-row {
    min-height: 0 !important;
    height: auto !important;
    padding: 2px 4px !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    gap: 3px !important;
    align-items: center !important;
    overflow: hidden !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .stat-label {
    gap: 2px !important;
    font-size: 9px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .stat-label-icon {
    width: 13px !important;
    height: 13px !important;
    flex-basis: 13px !important;
    border-radius: 4px !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .meter {
    height: 6px !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .meter-row > b {
    min-width: 18px !important;
    font-size: 11px !important;
    line-height: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .energy,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .fatigue,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .laziness {
    min-height: 0 !important;
    height: auto !important;
    padding: 2px 4px !important;
    grid-template-columns: minmax(34px, auto) minmax(0, 1fr) !important;
    gap: 2px 3px !important;
    overflow: hidden !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .fatigue-row {
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 3px !important;
    overflow: hidden !important;
    background: transparent !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .stat-marks {
    --stat-mark-size: 8px !important;
    grid-auto-rows: 8px !important;
    gap: 1px 2px !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .status-token {
    max-width: 100% !important;
    height: 14px !important;
    min-height: 0 !important;
    padding: 0 4px 0 1px !important;
    gap: 2px !important;
    border-radius: 999px !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .status-token i {
    width: 12px !important;
    height: 12px !important;
    border-radius: 4px !important;
    font-size: 8px !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .status-token b,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .status-token em {
    font-size: 8px !important;
    line-height: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .equipment-slot {
    min-width: 0 !important;
    min-height: 0 !important;
    height: 14px !important;
    border-radius: 4px !important;
    font-size: 9px !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel .choice.choice {
    min-height: 0 !important;
    height: 16px !important;
    margin: 0 !important;
    padding: 2px 4px !important;
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;
    font-size: 9px !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter.fighter {
    padding: clamp(4px, 1.1vw, 6px) !important;
    display: grid !important;
    grid-template-rows: 22px minmax(0, 1fr) !important;
    gap: 4px !important;
    overflow: hidden !important;
    border: 1px solid rgba(82, 132, 142, 0.34) !important;
    border-radius: 9px !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.05)),
      rgba(7, 18, 22, 0.28) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.22),
      0 6px 16px rgba(22, 46, 52, 0.16) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter.fighter::before,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter.fighter::after {
    content: none !important;
    display: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-head.fighter-head {
    min-height: 0 !important;
    height: 22px !important;
    padding: 2px 6px !important;
    align-items: center !important;
    gap: 5px !important;
    overflow: hidden !important;
    border-radius: 6px !important;
    font-size: 10px !important;
    line-height: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-head.fighter-head strong,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-side.fighter-side {
    min-width: 0 !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    font-size: 11px !important;
    line-height: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .character-face.character-face {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-rows: minmax(0, 1fr) minmax(33px, auto) !important;
    gap: 0 !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    transform: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .avatar.avatar {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    border-radius: 8px 8px 0 0 !important;
    background-size: var(--art-size, contain), cover, cover !important;
    background-position: var(--art-position, center bottom), center center, center center !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .avatar-right.avatar-right {
    transform: scaleX(-1) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .role-card.role-card {
    min-height: 33px !important;
    max-height: 48px !important;
    padding: 4px 6px !important;
    overflow: hidden !important;
    border-radius: 0 0 8px 8px !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .role-card.role-card > span {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    font-size: 9px !important;
    line-height: 1.16 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards.cards.cards {
    position: fixed !important;
    left: var(--duel-mobile-edge) !important;
    right: var(--duel-mobile-edge-r) !important;
    top: auto !important;
    bottom: var(--duel-mobile-action-bottom) !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: var(--duel-mobile-action-h) !important;
    min-height: var(--duel-mobile-action-h) !important;
    max-height: var(--duel-mobile-action-h) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: center !important;
    justify-items: stretch !important;
    gap: var(--duel-mobile-action-gap) !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    z-index: 1320 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards.cards.cards > .action-card.action-card {
    position: relative !important;
    align-self: center !important;
    justify-self: stretch !important;
    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;
    aspect-ratio: 1983 / 793 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    background-position: center center !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    box-shadow: none !important;
    clip-path: none !important;
    transform: none !important;
    filter: drop-shadow(0 5px 9px rgba(28, 48, 52, 0.22)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards.cards.cards > .action-card.attack {
    background-image: var(--action-attack-panel-art, var(--action-art)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards.cards.cards > .action-card.defend {
    background-image: var(--action-defend-panel-art, var(--action-art)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards.cards.cards > .action-card.charge {
    background-image: var(--action-charge-panel-art, var(--action-art)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards.cards.cards > .action-card.action-card span {
    font-size: clamp(12px, 3.6vw, 16px) !important;
    line-height: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .battle-libraries.battle-libraries {
    position: fixed !important;
    left: max(6px, env(safe-area-inset-left)) !important;
    right: auto !important;
    top: auto !important;
    bottom: var(--duel-mobile-bottom) !important;
    width: calc(100vw - 182px - max(6px, env(safe-area-inset-left)) - max(6px, env(safe-area-inset-right))) !important;
    max-width: 210px !important;
    min-width: 0 !important;
    height: var(--duel-mobile-bottom-row) !important;
    min-height: var(--duel-mobile-bottom-row) !important;
    max-height: var(--duel-mobile-bottom-row) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 5px !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    z-index: 1400 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .battle-libraries.battle-libraries > .library-action.library-action {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 4px !important;
    border-radius: 7px !important;
    font-size: clamp(10px, 2.85vw, 12px) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle.battle:not([hidden])) > :is(.language-toggle.language-toggle, .music-toggle.music-toggle, button#battleWallpaperToggle#battleWallpaperToggle.battle-wallpaper-toggle) {
    --battle-mini-control: clamp(40px, 10.6vw, 44px);
    --battle-mini-gap: 6px;
    position: fixed !important;
    left: auto !important;
    top: auto !important;
    bottom: max(6px, env(safe-area-inset-bottom)) !important;
    width: var(--battle-mini-control) !important;
    height: var(--battle-mini-control) !important;
    min-width: var(--battle-mini-control) !important;
    min-height: var(--battle-mini-control) !important;
    max-width: var(--battle-mini-control) !important;
    max-height: var(--battle-mini-control) !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: 0 !important;
    overflow: visible !important;
    transform: none !important;
    z-index: 1410 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle.battle:not([hidden])) > .language-toggle.language-toggle {
    right: max(6px, env(safe-area-inset-right)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle.battle:not([hidden])) > .music-toggle.music-toggle {
    right: calc(max(6px, env(safe-area-inset-right)) + var(--battle-mini-control) + var(--battle-mini-gap)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle.battle:not([hidden])) > button#battleWallpaperToggle#battleWallpaperToggle.battle-wallpaper-toggle {
    right: calc(max(6px, env(safe-area-inset-right)) + (var(--battle-mini-control) + var(--battle-mini-gap)) * 2) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle.battle:not([hidden])) > :is(.language-toggle.language-toggle, .music-toggle.music-toggle) img,
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle.battle:not([hidden])) > button#battleWallpaperToggle#battleWallpaperToggle.battle-wallpaper-toggle span {
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
    border-radius: 50% !important;
    background-color: transparent !important;
    box-shadow: none !important;
    object-fit: contain !important;
    filter:
      drop-shadow(0 3px 8px rgba(20, 37, 40, 0.32))
      drop-shadow(0 0 10px rgba(77, 184, 191, 0.18)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .utility.utility {
    position: fixed !important;
    left: max(6px, env(safe-area-inset-left)) !important;
    top: max(6px, env(safe-area-inset-top)) !important;
    right: auto !important;
    bottom: auto !important;
    width: auto !important;
    max-width: calc(100vw - 12px) !important;
    height: 27px !important;
    min-height: 27px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    gap: 5px !important;
    z-index: 1420 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .utility.utility > button {
    min-width: 52px !important;
    min-height: 27px !important;
    height: 27px !important;
    padding: 0 7px !important;
    font-size: 10px !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #sidePanel#sidePanel.side:not([hidden]) {
    display: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #battleLogToggle#battleLogToggle.battle-log-toggle:not([hidden]) {
    display: none !important;
  }
}

@media (max-width: 390px) {
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-action-h: clamp(42px, calc((100vw - 22px) / 3 / 2.5006), 52px);
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .you-combatant.you-combatant,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .opponent-combatant.opponent-combatant {
    grid-template-columns: minmax(82px, 0.35fr) minmax(0, 0.65fr) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .opponent-combatant.opponent-combatant {
    grid-template-columns: minmax(0, 0.65fr) minmax(82px, 0.35fr) !important;
  }
}

@media (max-width: 720px) and (max-height: 520px) {
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-bottom-row: 36px;
    --duel-mobile-action-h: clamp(38px, calc((min(460px, 100vw - 16px) - 12px) / 3 / 2.5006), 58px);
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards.cards.cards {
    left: 50% !important;
    right: auto !important;
    width: min(460px, calc(100vw - 16px)) !important;
    transform: translateX(-50%) !important;
  }
}

/* V1.27Beta-duel-mobile-layout1-lock: outrank legacy :has() phone rules for 1v1 only. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) {
    position: fixed !important;
    inset: 0 !important;
    display: block !important;
    grid-template-rows: none !important;
    grid-template-columns: none !important;
    gap: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) .fighters.fighters {
    position: absolute !important;
    left: max(6px, env(safe-area-inset-left)) !important;
    right: max(6px, env(safe-area-inset-right)) !important;
    top: max(7px, env(safe-area-inset-top)) !important;
    bottom: var(--duel-mobile-stage-bottom) !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr) !important;
    align-content: stretch !important;
    gap: clamp(5px, 1.4vh, 8px) !important;
    overflow: hidden !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) .versus.versus {
    display: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) .combatant.combatant {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: clamp(4px, 1.1vw, 6px) !important;
    display: grid !important;
    align-items: stretch !important;
    gap: clamp(5px, 1.45vw, 8px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(82, 132, 142, 0.24) !important;
    border-radius: 9px !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.05)),
      rgba(238, 250, 247, 0.22) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.34),
      0 8px 18px rgba(32, 58, 64, 0.12) !important;
    transform: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) .you-combatant.you-combatant {
    grid-template-columns: minmax(0, 0.66fr) minmax(88px, 0.34fr) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) .opponent-combatant.opponent-combatant {
    grid-template-columns: minmax(88px, 0.34fr) minmax(0, 0.66fr) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) #youCard#youCard {
    order: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) .you-panel.you-panel {
    order: 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) .opponent-panel.opponent-panel {
    order: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) #opponentCard#opponentCard {
    order: 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) #cards#cards#cards.cards.cards {
    position: fixed !important;
    left: max(6px, env(safe-area-inset-left)) !important;
    right: max(6px, env(safe-area-inset-right)) !important;
    top: auto !important;
    bottom: var(--duel-mobile-action-bottom) !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    inline-size: auto !important;
    height: var(--duel-mobile-action-h) !important;
    min-height: var(--duel-mobile-action-h) !important;
    max-height: var(--duel-mobile-action-h) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: center !important;
    justify-items: stretch !important;
    gap: var(--duel-mobile-action-gap) !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    z-index: 1320 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) #cards#cards#cards.cards.cards > button.action-card.action-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 1983 / 793 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    display: block !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    box-shadow: none !important;
    clip-path: none !important;
    transform: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden]) > .battle-libraries.battle-libraries {
    position: fixed !important;
    left: max(6px, env(safe-area-inset-left)) !important;
    right: auto !important;
    top: auto !important;
    bottom: max(6px, env(safe-area-inset-bottom)) !important;
    width: calc(100vw - 182px - max(6px, env(safe-area-inset-left)) - max(6px, env(safe-area-inset-right))) !important;
    max-width: 210px !important;
    min-width: 0 !important;
    height: var(--duel-mobile-bottom-row) !important;
    min-height: var(--duel-mobile-bottom-row) !important;
    max-height: var(--duel-mobile-bottom-row) !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 1400 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > :is(.language-toggle.language-toggle, .music-toggle.music-toggle, button#battleWallpaperToggle#battleWallpaperToggle.battle-wallpaper-toggle) {
    --battle-mini-control: clamp(40px, 10.6vw, 44px);
    --battle-mini-gap: 6px;
    position: fixed !important;
    top: auto !important;
    bottom: max(6px, env(safe-area-inset-bottom)) !important;
    width: var(--battle-mini-control) !important;
    height: var(--battle-mini-control) !important;
    min-width: var(--battle-mini-control) !important;
    min-height: var(--battle-mini-control) !important;
    max-width: var(--battle-mini-control) !important;
    max-height: var(--battle-mini-control) !important;
    padding: 0 !important;
    display: grid !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    z-index: 1410 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > .language-toggle.language-toggle {
    right: max(6px, env(safe-area-inset-right)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > .music-toggle.music-toggle {
    right: calc(max(6px, env(safe-area-inset-right)) + var(--battle-mini-control) + var(--battle-mini-gap)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > button#battleWallpaperToggle#battleWallpaperToggle.battle-wallpaper-toggle {
    right: calc(max(6px, env(safe-area-inset-right)) + (var(--battle-mini-control) + var(--battle-mini-gap)) * 2) !important;
  }
}

/* V1.27Beta-duel-mobile-layout1-hardlock: beat repeated-id legacy controls. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) #cards#cards#cards#cards.cards.cards {
    position: fixed !important;
    left: 6px !important;
    right: auto !important;
    top: auto !important;
    bottom: var(--duel-mobile-action-bottom) !important;
    width: calc(100vw - 12px) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 12px) !important;
    inline-size: calc(100vw - 12px) !important;
    height: var(--duel-mobile-action-h) !important;
    min-height: var(--duel-mobile-action-h) !important;
    max-height: var(--duel-mobile-action-h) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: center !important;
    justify-items: stretch !important;
    gap: var(--duel-mobile-action-gap) !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    z-index: 1320 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) #cards#cards#cards#cards.cards.cards > button.action-card.action-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 1983 / 793 !important;
    padding: 0 !important;
    display: block !important;
    background-size: contain !important;
    transform: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > button#battleWallpaperToggle#battleWallpaperToggle#battleWallpaperToggle#battleWallpaperToggle.battle-wallpaper-toggle.battle-wallpaper-toggle.battle-wallpaper-toggle,
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > button#musicToggle#musicToggle.music-toggle.music-toggle,
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > button#languageToggle#languageToggle.language-toggle.language-toggle {
    --battle-mini-control: clamp(40px, 10.6vw, 44px);
    --battle-mini-gap: 6px;
    position: fixed !important;
    top: auto !important;
    bottom: max(6px, env(safe-area-inset-bottom)) !important;
    width: var(--battle-mini-control) !important;
    height: var(--battle-mini-control) !important;
    min-width: var(--battle-mini-control) !important;
    min-height: var(--battle-mini-control) !important;
    max-width: var(--battle-mini-control) !important;
    max-height: var(--battle-mini-control) !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    z-index: 1410 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > button#languageToggle#languageToggle.language-toggle.language-toggle {
    right: max(6px, env(safe-area-inset-right)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > button#musicToggle#musicToggle.music-toggle.music-toggle {
    right: calc(max(6px, env(safe-area-inset-right)) + var(--battle-mini-control) + var(--battle-mini-gap)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > button#battleWallpaperToggle#battleWallpaperToggle#battleWallpaperToggle#battleWallpaperToggle.battle-wallpaper-toggle.battle-wallpaper-toggle.battle-wallpaper-toggle {
    right: calc(max(6px, env(safe-area-inset-right)) + (var(--battle-mini-control) + var(--battle-mini-gap)) * 2) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) .fighters.fighters {
    top: calc(max(7px, env(safe-area-inset-top)) + 38px) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) > .utility.utility {
    position: fixed !important;
    left: max(7px, env(safe-area-inset-left)) !important;
    right: auto !important;
    top: max(7px, env(safe-area-inset-top)) !important;
    bottom: auto !important;
    width: auto !important;
    max-width: calc(100vw - 14px) !important;
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    z-index: 1420 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) > .utility.utility > button {
    width: auto !important;
    min-width: 54px !important;
    max-width: 86px !important;
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    padding: 0 8px !important;
    border-radius: 8px !important;
    font-size: 10px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    transform: none !important;
  }
}

/* V1.27Beta-duel-mobile-layout2: final phone hardlock against fixed desktop fighter widths. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) {
    --fighter-card-w: minmax(0, 1fr) !important;
    --fighter-panel-w: minmax(0, 1fr) !important;
    --combatant-pad: clamp(4px, 1.1vw, 6px) !important;
    --fighter-inner-gap: clamp(5px, 1.45vw, 8px) !important;
    overflow: hidden !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])),
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app),
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) > .arena {
    box-sizing: border-box !important;
    width: 100vw !important;
    min-width: 0 !important;
    max-width: 100vw !important;
    inline-size: 100vw !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) .fighters.fighters {
    left: var(--duel-mobile-edge) !important;
    right: auto !important;
    top: calc(max(7px, env(safe-area-inset-top)) + 36px) !important;
    bottom: var(--duel-mobile-stage-bottom) !important;
    width: calc(100vw - var(--duel-mobile-edge) - var(--duel-mobile-edge-r)) !important;
    min-width: 0 !important;
    max-width: calc(100vw - var(--duel-mobile-edge) - var(--duel-mobile-edge-r)) !important;
    inline-size: calc(100vw - var(--duel-mobile-edge) - var(--duel-mobile-edge-r)) !important;
    overflow: hidden !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) .combatant.combatant {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    padding: var(--combatant-pad) !important;
    gap: var(--fighter-inner-gap) !important;
    overflow: hidden !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) .you-combatant.you-combatant {
    grid-template-columns: minmax(0, 1.08fr) minmax(84px, 0.72fr) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) .opponent-combatant.opponent-combatant {
    grid-template-columns: minmax(84px, 0.72fr) minmax(0, 1.08fr) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) .combatant.combatant > .fighter.fighter,
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) .combatant.combatant > .fighter-panel.fighter-panel {
    box-sizing: border-box !important;
    position: relative !important;
    inset: auto !important;
    justify-self: stretch !important;
    align-self: stretch !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    transform: none !important;
    overflow: hidden !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) .combatant.combatant > .fighter.fighter {
    padding: clamp(4px, 1.1vw, 6px) !important;
    display: grid !important;
    grid-template-rows: 22px minmax(0, 1fr) !important;
    gap: 4px !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]) .combatant.combatant > .fighter-panel.fighter-panel {
    padding: clamp(4px, 1.05vw, 6px) !important;
    gap: 3px !important;
    grid-template-rows: minmax(14px, auto) minmax(16px, auto) minmax(24px, auto) minmax(19px, auto) minmax(31px, 1fr) minmax(16px, auto) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app),
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) > .arena,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    width: 100vw !important;
    min-width: 0 !important;
    max-width: 100vw !important;
    inline-size: 100vw !important;
    overflow: hidden !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters.fighters {
    left: var(--duel-mobile-edge) !important;
    right: auto !important;
    width: calc(100vw - var(--duel-mobile-edge) - var(--duel-mobile-edge-r)) !important;
    min-width: 0 !important;
    max-width: calc(100vw - var(--duel-mobile-edge) - var(--duel-mobile-edge-r)) !important;
    inline-size: calc(100vw - var(--duel-mobile-edge) - var(--duel-mobile-edge-r)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant > .fighter.fighter.fighter,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant > .fighter-panel.fighter-panel.fighter-panel {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}

/* V1.27Beta-duel-mobile-layout3: final phone 1v1 rebuild. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) {
    width: 100vw !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
    background:
      linear-gradient(180deg, rgba(246, 255, 253, 0.08), rgba(225, 244, 241, 0.06)),
      var(--battle-wallpaper-art, var(--battle-visible-surface)) center center / cover no-repeat fixed,
      #e8f5f2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app),
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) > .arena {
    width: 100vw !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background:
      linear-gradient(180deg, rgba(246, 255, 253, 0.08), rgba(225, 244, 241, 0.06)),
      var(--battle-wallpaper-art, var(--battle-visible-surface)) center center / cover no-repeat fixed,
      #e8f5f2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-edge: max(8px, env(safe-area-inset-left));
    --duel-mobile-edge-r: max(8px, env(safe-area-inset-right));
    --duel-mobile-bottom: max(8px, env(safe-area-inset-bottom));
    --duel-mobile-bottom-row: clamp(40px, 10.6vw, 44px);
    --duel-mobile-action-gap: clamp(5px, 1.5vw, 7px);
    --duel-mobile-action-h: clamp(48px, calc((100vw - 28px) / 3 / 2.5006), 62px);
    --duel-mobile-action-bottom: calc(var(--duel-mobile-bottom) + var(--duel-mobile-bottom-row) + 11px);
    --duel-mobile-stage-bottom: calc(var(--duel-mobile-action-bottom) + var(--duel-mobile-action-h) + 13px);
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(219, 241, 239, 0.04)),
      var(--battle-wallpaper-art, var(--battle-visible-surface)) center center / cover no-repeat,
      #e8f5f2 !important;
    box-shadow: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle)::before,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle)::after {
    display: none !important;
    content: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters.fighters {
    position: absolute !important;
    left: var(--duel-mobile-edge) !important;
    right: var(--duel-mobile-edge-r) !important;
    top: calc(max(8px, env(safe-area-inset-top)) + 30px) !important;
    bottom: var(--duel-mobile-stage-bottom) !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) 16px minmax(0, 1fr) !important;
    gap: clamp(4px, 1vh, 7px) !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: clamp(4px, 1.1vw, 6px) !important;
    display: grid !important;
    align-items: stretch !important;
    gap: clamp(5px, 1.45vw, 8px) !important;
    overflow: visible !important;
    border: 1px solid rgba(234, 251, 255, 0.26) !important;
    border-radius: 8px !important;
    background: rgba(13, 31, 36, 0.16) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.24),
      0 8px 18px rgba(12, 30, 36, 0.12) !important;
    transform: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant::before,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant::after,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters.fighters::before,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters.fighters::after {
    display: none !important;
    content: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .you-combatant.you-combatant.you-combatant {
    grid-template-columns: minmax(0, 1fr) clamp(84px, 28vw, 116px) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .opponent-combatant.opponent-combatant.opponent-combatant {
    grid-template-columns: clamp(84px, 28vw, 116px) minmax(0, 1fr) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant > .fighter.fighter.fighter,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant > .fighter-panel.fighter-panel.fighter-panel {
    box-sizing: border-box !important;
    position: relative !important;
    inset: auto !important;
    justify-self: stretch !important;
    align-self: stretch !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    transform: none !important;
    overflow: hidden !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel {
    padding: 4px !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: minmax(15px, auto) minmax(16px, auto) minmax(23px, auto) minmax(24px, auto) minmax(16px, auto) !important;
    align-content: start !important;
    align-items: stretch !important;
    gap: 3px !important;
    border: 1px solid rgba(216, 244, 248, 0.34) !important;
    border-radius: 8px !important;
    background:
      linear-gradient(180deg, rgba(16, 38, 45, 0.72), rgba(8, 21, 26, 0.58)),
      rgba(7, 18, 22, 0.46) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.22),
      0 5px 13px rgba(8, 22, 28, 0.12) !important;
    color: #f5fbff !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel > :is(.status-bar, .equipment-slots, .meter-row, .choice) {
    grid-column: 1 / -1 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel > .energy.energy {
    grid-column: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel > .fatigue-row.fatigue-row {
    display: contents !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel .fatigue.fatigue {
    grid-column: 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel .laziness.laziness {
    grid-column: 3 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel :is(.status-bar, .equipment-slots) {
    height: 16px !important;
    min-height: 16px !important;
    max-height: 16px !important;
    padding: 1px 2px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 2px !important;
    overflow: hidden !important;
    border: 1px solid rgba(208, 238, 244, 0.2) !important;
    border-radius: 5px !important;
    background: rgba(235, 250, 255, 0.13) !important;
    box-shadow: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel .equipment-slots.equipment-slots {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel .meter-row.meter-row {
    height: 23px !important;
    min-height: 23px !important;
    max-height: 23px !important;
    padding: 2px 4px !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 4px !important;
    overflow: hidden !important;
    border: 1px solid rgba(208, 238, 244, 0.22) !important;
    border-radius: 6px !important;
    background: rgba(235, 250, 255, 0.14) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel :is(.energy, .fatigue, .laziness) {
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    min-width: 0 !important;
    padding: 2px 4px !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 3px !important;
    overflow: hidden !important;
    border: 1px solid rgba(208, 238, 244, 0.22) !important;
    border-radius: 6px !important;
    background: rgba(235, 250, 255, 0.14) !important;
    box-shadow: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel :is(.stat-label, .stat-value, .meter-row > b, .choice, .status-token, .equipment-slot) {
    color: #f7fcff !important;
    -webkit-text-fill-color: #f7fcff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.58) !important;
    letter-spacing: 0 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel :is(.energy, .fatigue, .laziness) .stat-label {
    font-size: 0 !important;
    gap: 0 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel .stat-label-icon {
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    flex-basis: 14px !important;
    border-radius: 4px !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel :is(.energy, .fatigue, .laziness) .stat-marks {
    display: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel .stat-value {
    min-width: 0 !important;
    justify-self: end !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel .meter-row .stat-label {
    font-size: 9px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel .meter {
    height: 6px !important;
    min-height: 6px !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel .meter-row > b {
    min-width: 18px !important;
    font-size: 11px !important;
    line-height: 1 !important;
    text-align: right !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel .choice.choice {
    height: 16px !important;
    min-height: 16px !important;
    max-height: 16px !important;
    padding: 2px 4px !important;
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;
    border: 1px solid rgba(208, 238, 244, 0.2) !important;
    border-radius: 5px !important;
    background: rgba(235, 250, 255, 0.12) !important;
    font-size: 9px !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter.fighter.fighter {
    padding: 4px !important;
    display: grid !important;
    grid-template-rows: 20px minmax(0, 1fr) !important;
    gap: 3px !important;
    border: 1px solid rgba(216, 244, 248, 0.32) !important;
    border-radius: 8px !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.03)),
      rgba(7, 18, 22, 0.20) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.2),
      0 6px 16px rgba(12, 30, 36, 0.14) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-head.fighter-head {
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    padding: 2px 5px !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    overflow: hidden !important;
    border: 1px solid rgba(216, 244, 248, 0.2) !important;
    border-radius: 5px !important;
    background: rgba(8, 22, 28, 0.36) !important;
    box-shadow: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-head.fighter-head :is(strong, .fighter-side) {
    min-width: 0 !important;
    overflow: hidden !important;
    color: #f7fcff !important;
    -webkit-text-fill-color: #f7fcff !important;
    font-size: 10px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.58) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .character-face.character-face {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-rows: minmax(0, 1fr) 24px !important;
    gap: 0 !important;
    overflow: hidden !important;
    border: 1px solid rgba(216, 244, 248, 0.18) !important;
    border-radius: 7px !important;
    background: rgba(8, 22, 28, 0.2) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .avatar.avatar.avatar {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    border: 0 !important;
    border-radius: 7px 7px 0 0 !important;
    background-size: auto 96%, cover, cover !important;
    background-position: center bottom, center center, center center !important;
    box-shadow: inset 0 0 24px rgba(255, 255, 255, 0.05) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .avatar-right.avatar-right {
    transform: scaleX(-1) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .role-card.role-card.role-card {
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    padding: 2px 4px !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 0 7px 7px !important;
    background: rgba(8, 22, 28, 0.66) !important;
    box-shadow: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .role-card.role-card.role-card > b {
    min-width: 0 !important;
    overflow: hidden !important;
    color: #f7fcff !important;
    -webkit-text-fill-color: #f7fcff !important;
    font-size: 9px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.66) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .role-card.role-card.role-card > span {
    display: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .versus.versus.versus {
    width: 100% !important;
    height: 16px !important;
    min-height: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: rgba(246, 252, 255, 0.82) !important;
    -webkit-text-fill-color: rgba(246, 252, 255, 0.82) !important;
    font-size: 11px !important;
    line-height: 1 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.48) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards.cards.cards {
    position: fixed !important;
    left: var(--duel-mobile-edge) !important;
    right: var(--duel-mobile-edge-r) !important;
    top: auto !important;
    bottom: var(--duel-mobile-action-bottom) !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: var(--duel-mobile-action-h) !important;
    min-height: var(--duel-mobile-action-h) !important;
    max-height: var(--duel-mobile-action-h) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: center !important;
    justify-items: stretch !important;
    gap: var(--duel-mobile-action-gap) !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    z-index: 1320 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards.cards.cards > button.action-card.action-card {
    position: relative !important;
    align-self: center !important;
    justify-self: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 1983 / 793 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    background-size: contain !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    box-shadow: none !important;
    transform: none !important;
    clip-path: none !important;
    overflow: visible !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .battle-libraries.battle-libraries.battle-libraries {
    position: fixed !important;
    left: var(--duel-mobile-edge) !important;
    right: auto !important;
    top: auto !important;
    bottom: var(--duel-mobile-bottom) !important;
    width: min(196px, calc(100vw - 178px - var(--duel-mobile-edge) - var(--duel-mobile-edge-r))) !important;
    min-width: 0 !important;
    max-width: 196px !important;
    height: var(--duel-mobile-bottom-row) !important;
    min-height: var(--duel-mobile-bottom-row) !important;
    max-height: var(--duel-mobile-bottom-row) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 5px !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    z-index: 1400 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .battle-libraries.battle-libraries.battle-libraries > .library-action.library-action {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 5px !important;
    border-radius: 7px !important;
    font-size: clamp(10px, 2.7vw, 12px) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > :is(.language-toggle.language-toggle, .music-toggle.music-toggle, button#battleWallpaperToggle#battleWallpaperToggle.battle-wallpaper-toggle) {
    --battle-mini-control: clamp(40px, 10.6vw, 44px);
    --battle-mini-gap: 6px;
    position: fixed !important;
    left: auto !important;
    top: auto !important;
    bottom: var(--duel-mobile-bottom, max(8px, env(safe-area-inset-bottom))) !important;
    width: var(--battle-mini-control) !important;
    height: var(--battle-mini-control) !important;
    min-width: var(--battle-mini-control) !important;
    min-height: var(--battle-mini-control) !important;
    max-width: var(--battle-mini-control) !important;
    max-height: var(--battle-mini-control) !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: 0 !important;
    overflow: visible !important;
    transform: none !important;
    pointer-events: auto !important;
    z-index: 1425 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > .language-toggle.language-toggle {
    right: var(--duel-mobile-edge-r, max(8px, env(safe-area-inset-right))) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > .music-toggle.music-toggle {
    right: calc(var(--duel-mobile-edge-r, max(8px, env(safe-area-inset-right))) + var(--battle-mini-control) + var(--battle-mini-gap)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > button#battleWallpaperToggle#battleWallpaperToggle.battle-wallpaper-toggle {
    right: calc(var(--duel-mobile-edge-r, max(8px, env(safe-area-inset-right))) + (var(--battle-mini-control) + var(--battle-mini-gap)) * 2) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle.battle:not([hidden])) > button#battleWallpaperToggle#battleWallpaperToggle.battle-wallpaper-toggle span {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: url("assets/ui/battle-wallpaper-toggle-icon-gpt2.png?v=V1.27Beta-mobile-duel-rebuild2") center / contain no-repeat !important;
    box-shadow: none !important;
    filter:
      drop-shadow(0 3px 8px rgba(20, 37, 40, 0.32))
      drop-shadow(0 0 10px rgba(77, 184, 191, 0.16)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #sidePanel#sidePanel.side:not([hidden]),
  html body:not(.maintenance-mode).battle-controls-active #battleLogToggle#battleLogToggle.battle-log-toggle:not([hidden]) {
    display: none !important;
  }
}

@media (max-width: 390px) {
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-action-h: clamp(46px, calc((100vw - 24px) / 3 / 2.5006), 54px);
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .you-combatant.you-combatant.you-combatant {
    grid-template-columns: minmax(0, 1fr) clamp(80px, 27vw, 104px) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .opponent-combatant.opponent-combatant.opponent-combatant {
    grid-template-columns: clamp(80px, 27vw, 104px) minmax(0, 1fr) !important;
  }
}

/* V1.27Beta-duel-mobile-layout3-order: lock card/panel placement after legacy order rules. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters.fighters,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant {
    overflow: hidden !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .you-panel.you-panel.you-panel {
    order: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #youCard#youCard#youCard {
    order: 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #opponentCard#opponentCard#opponentCard {
    order: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .opponent-panel.opponent-panel.opponent-panel {
    order: 2 !important;
  }
}

/* V1.27Beta-duel-mobile-layout3-specificity: beat older :has() mobile duel rules. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) {
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(219, 241, 239, 0.04)),
      var(--battle-wallpaper-art, var(--battle-visible-surface)) center center / cover no-repeat,
      #e8f5f2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .fighters.fighters.fighters.fighters {
    grid-template-rows: clamp(190px, 31dvh, 242px) 16px clamp(190px, 31dvh, 242px) !important;
    align-content: start !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .you-combatant.you-combatant.you-combatant.you-combatant {
    grid-template-columns: minmax(0, 1fr) clamp(84px, 28vw, 116px) !important;
    grid-row: 3 !important;
    grid-column: 1 !important;
    grid-area: 3 / 1 / 4 / 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant {
    grid-template-columns: clamp(84px, 28vw, 116px) minmax(0, 1fr) !important;
    grid-row: 1 !important;
    grid-column: 1 !important;
    grid-area: 1 / 1 / 2 / 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .versus.versus.versus.versus {
    grid-row: 2 !important;
    grid-column: 1 !important;
    grid-area: 2 / 1 / 3 / 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .you-panel.you-panel.you-panel.you-panel {
    order: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) #youCard#youCard#youCard#youCard {
    order: 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) #opponentCard#opponentCard#opponentCard#opponentCard {
    order: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .opponent-panel.opponent-panel.opponent-panel.opponent-panel {
    order: 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .combatant.combatant.combatant.combatant {
    grid-template-rows: minmax(0, 1fr) !important;
    align-items: stretch !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .you-panel.you-panel.you-panel.you-panel {
    grid-column: 1 !important;
    grid-row: 1 !important;
    grid-area: 1 / 1 / 2 / 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) #youCard#youCard#youCard#youCard {
    grid-column: 2 !important;
    grid-row: 1 !important;
    grid-area: 1 / 2 / 2 / 3 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) #opponentCard#opponentCard#opponentCard#opponentCard {
    grid-column: 1 !important;
    grid-row: 1 !important;
    grid-area: 1 / 1 / 2 / 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .opponent-panel.opponent-panel.opponent-panel.opponent-panel {
    grid-column: 2 !important;
    grid-row: 1 !important;
    grid-area: 1 / 2 / 2 / 3 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .combatant.combatant.combatant.combatant > :is(.fighter.fighter, .fighter-panel.fighter-panel) {
    align-self: stretch !important;
    height: 100% !important;
    max-height: 100% !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .avatar.avatar.avatar.avatar {
    background-size: contain, cover, cover !important;
    background-position: center center, center center, center center !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .avatar-right.avatar-right.avatar-right {
    transform: scaleX(-1) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) #cards#cards#cards#cards#cards.cards.cards {
    bottom: var(--duel-mobile-action-bottom) !important;
    height: var(--duel-mobile-action-h) !important;
    min-height: var(--duel-mobile-action-h) !important;
    max-height: var(--duel-mobile-action-h) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) > .battle-libraries.battle-libraries.battle-libraries.battle-libraries {
    bottom: var(--duel-mobile-bottom) !important;
    height: var(--duel-mobile-bottom-row) !important;
    min-height: var(--duel-mobile-bottom-row) !important;
    max-height: var(--duel-mobile-bottom-row) !important;
  }
}

@media (max-width: 390px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .you-combatant.you-combatant.you-combatant.you-combatant {
    grid-template-columns: minmax(0, 1fr) clamp(80px, 27vw, 104px) !important;
    grid-row: 3 !important;
    grid-area: 3 / 1 / 4 / 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]) .opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant {
    grid-template-columns: clamp(80px, 27vw, 104px) minmax(0, 1fr) !important;
    grid-row: 1 !important;
    grid-area: 1 / 1 / 2 / 2 !important;
  }
}

/* V1.27Beta-duel-mobile-layout6-status-left1: phone 1v1 status rows must start from the left edge. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel.fighter-panel {
    justify-items: stretch !important;
    text-align: left !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel.fighter-panel > :is(.status-bar, .equipment-slots, .meter-row, .choice) {
    justify-self: stretch !important;
    text-align: left !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel.fighter-panel .status-bar.status-bar {
    justify-content: flex-start !important;
    justify-items: start !important;
    text-align: left !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel.fighter-panel .status-bar.status-bar > * {
    flex: 0 0 auto !important;
    justify-self: start !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel.fighter-panel :is(.energy, .fatigue, .laziness) {
    justify-items: start !important;
    text-align: left !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel.fighter-panel :is(.energy, .fatigue, .laziness) :is(.stat-label, .stat-value) {
    justify-self: start !important;
    text-align: left !important;
  }
}

/* V1.27Beta-desire-portrait-near1: phone 1v1 Desire portrait is slightly closer. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .avatar.avatar.avatar.avatar[data-character="Desire"] {
    background-size: auto 108%, cover, cover !important;
    background-position: center bottom, center center, center center !important;
    background-repeat: no-repeat !important;
  }
}

/* V1.27Beta-battle-art-ui1: mobile 1v1 battle frame/status/action polish. */
html body:not(.maintenance-mode) #appRoot.app.battle-app #battle.battle:not([hidden]),
html body:not(.maintenance-mode) #appRoot.app.duel-battle-app #battle.battle:not([hidden]) {
  --battle-stage-art: var(--battle-wallpaper-art, var(--battle-visible-surface)) !important;
}

@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-edge: max(8px, env(safe-area-inset-left)) !important;
    --duel-mobile-edge-r: max(8px, env(safe-area-inset-right)) !important;
    --duel-mobile-bottom: max(8px, env(safe-area-inset-bottom)) !important;
    --duel-mobile-bottom-row: clamp(40px, 10.8vw, 46px) !important;
    --duel-mobile-action-gap: clamp(4px, 1.2vw, 6px) !important;
    --duel-mobile-action-h: clamp(64px, 17.8vw, 82px) !important;
    --duel-mobile-action-bottom: calc(var(--duel-mobile-bottom) + var(--duel-mobile-bottom-row) + 9px) !important;
    --duel-mobile-stage-bottom: calc(var(--duel-mobile-action-bottom) + var(--duel-mobile-action-h) + 12px) !important;
    background:
      linear-gradient(180deg, rgba(5, 12, 18, 0.04), rgba(5, 10, 16, 0.18) 58%, rgba(3, 7, 12, 0.28)),
      var(--battle-wallpaper-art, var(--battle-stage-art, var(--battle-visible-surface))) center center / cover no-repeat,
      #07121a !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])),
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app),
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) > .arena {
    background:
      linear-gradient(180deg, rgba(5, 12, 18, 0.04), rgba(5, 10, 16, 0.18) 58%, rgba(3, 7, 12, 0.28)),
      var(--battle-wallpaper-art, var(--battle-stage-art, var(--battle-visible-surface))) center center / cover no-repeat fixed,
      #07121a !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters.fighters.fighters.fighters {
    top: calc(max(7px, env(safe-area-inset-top)) + 34px) !important;
    bottom: var(--duel-mobile-stage-bottom) !important;
    gap: clamp(6px, 1.45vh, 10px) !important;
    overflow: visible !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant.combatant.combatant {
    padding: clamp(8px, 2vw, 11px) !important;
    gap: clamp(6px, 1.55vw, 9px) !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: transparent !important;
    box-shadow: none !important;
    isolation: isolate !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant.combatant.combatant::before {
    content: "" !important;
    position: absolute !important;
    inset: 5px !important;
    display: block !important;
    border: 1px solid rgba(216, 237, 249, 0.34) !important;
    border-radius: 12px !important;
    background:
      radial-gradient(ellipse at 14% 12%, rgba(124, 216, 255, 0.18), transparent 34%),
      radial-gradient(ellipse at 90% 86%, rgba(231, 194, 99, 0.14), transparent 36%),
      linear-gradient(180deg, rgba(9, 22, 34, 0.72), rgba(5, 13, 23, 0.6)) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.18),
      inset 0 0 22px rgba(75, 167, 203, 0.12),
      0 10px 24px rgba(0, 0, 0, 0.22) !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant.combatant.combatant::after {
    content: "" !important;
    position: absolute !important;
    inset: -2px !important;
    display: block !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: url("assets/ui/arcane-combatant-frame-slim-gpt2.png?v=V1.27Beta-battle-art-ui1") center center / 100% 100% no-repeat !important;
    box-shadow: none !important;
    opacity: 0.98 !important;
    pointer-events: none !important;
    z-index: 4 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant.combatant.combatant > :is(.fighter.fighter, .fighter-panel.fighter-panel) {
    position: relative !important;
    z-index: 2 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel.fighter-panel {
    padding: clamp(7px, 1.8vw, 10px) !important;
    gap: clamp(3px, 0.85vw, 5px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(191, 226, 245, 0.28) !important;
    border-radius: 10px !important;
    background:
      linear-gradient(90deg, rgba(143, 210, 244, 0.18), transparent 12%, transparent 88%, rgba(231, 198, 106, 0.14)),
      linear-gradient(180deg, rgba(8, 19, 30, 0.72), rgba(5, 12, 22, 0.64)) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.14),
      inset 0 0 18px rgba(82, 183, 232, 0.1) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel.fighter-panel > :is(.status-bar, .equipment-slots, .meter-row, .choice) {
    justify-self: stretch !important;
    border: 1px solid rgba(200, 228, 244, 0.22) !important;
    border-radius: 8px !important;
    background:
      linear-gradient(90deg, rgba(230, 196, 102, 0.13), transparent 18%),
      linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.025)),
      rgba(2, 8, 16, 0.38) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.12),
      0 3px 8px rgba(0, 0, 0, 0.14) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel.fighter-panel .status-bar.status-bar {
    min-height: 20px !important;
    padding: 2px 5px !important;
    gap: 4px !important;
    align-items: center !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel.fighter-panel .status-token.status-token {
    min-height: 17px !important;
    padding: 1px 4px !important;
    border: 1px solid rgba(195, 225, 240, 0.24) !important;
    border-radius: 6px !important;
    background: rgba(5, 14, 24, 0.36) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel.fighter-panel :is(.energy, .fatigue, .laziness) {
    min-height: 19px !important;
    padding: 2px 6px !important;
    border: 1px solid rgba(200, 228, 244, 0.2) !important;
    border-radius: 7px !important;
    background:
      linear-gradient(90deg, rgba(91, 188, 235, 0.16), transparent 18%),
      rgba(3, 10, 18, 0.42) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel.fighter-panel :is(.stat-label, .stat-value, .meter-row > b, .choice) {
    color: #f2f7fb !important;
    -webkit-text-fill-color: currentColor !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.72) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter.fighter.fighter.fighter {
    padding: clamp(7px, 1.8vw, 10px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(191, 226, 245, 0.24) !important;
    border-radius: 10px !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.03)),
      rgba(4, 12, 21, 0.46) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .avatar.avatar.avatar.avatar {
    border: 1px solid rgba(219, 237, 249, 0.22) !important;
    box-shadow:
      inset 0 -32px 36px rgba(0, 0, 0, 0.28),
      inset 0 0 22px rgba(75, 169, 214, 0.12) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .role-card.role-card.role-card {
    border: 1px solid rgba(215, 235, 246, 0.2) !important;
    background:
      linear-gradient(90deg, rgba(229, 196, 100, 0.18), transparent 24%),
      linear-gradient(180deg, rgba(5, 12, 20, 0.62), rgba(3, 8, 15, 0.74)) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards.cards.cards {
    bottom: var(--duel-mobile-action-bottom) !important;
    height: var(--duel-mobile-action-h) !important;
    min-height: var(--duel-mobile-action-h) !important;
    max-height: var(--duel-mobile-action-h) !important;
    gap: var(--duel-mobile-action-gap) !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards.cards.cards::before,
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards.cards.cards::after,
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards.cards.cards > .action-card.action-card::before,
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards.cards.cards > .action-card.action-card::after,
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards.cards.cards > .action-card.action-card .action-icon {
    content: none !important;
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
    filter: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards.cards.cards > .action-card.action-card {
    height: var(--duel-mobile-action-h) !important;
    min-height: var(--duel-mobile-action-h) !important;
    max-height: var(--duel-mobile-action-h) !important;
    aspect-ratio: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    background-position: center center !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    box-shadow: none !important;
    filter:
      drop-shadow(0 7px 11px rgba(0, 0, 0, 0.34))
      drop-shadow(0 0 8px rgba(91, 181, 226, 0.14)) !important;
    clip-path: none !important;
    overflow: visible !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards.cards.cards > .action-card.attack {
    background-image: var(--action-attack-panel-art, var(--action-art)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards.cards.cards > .action-card.defend {
    background-image: var(--action-defend-panel-art, var(--action-art)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards.cards.cards > .action-card.charge {
    background-image: var(--action-charge-panel-art, var(--action-art)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards.cards.cards > .action-card.action-card span {
    bottom: 14% !important;
    font-size: clamp(15px, 4.25vw, 19px) !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
    color: #fbfdff !important;
    -webkit-text-fill-color: currentColor !important;
    text-shadow:
      0 2px 4px rgba(0, 0, 0, 0.92),
      0 0 10px rgba(0, 0, 0, 0.56) !important;
  }
}

@media (max-width: 390px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-action-h: clamp(62px, 17.4vw, 70px) !important;
  }
}

/* V1.27Beta-battle-art-ui2: keep both fighter card and status panel inside phone width. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-fighter-card-w: clamp(86px, 23.5vw, 110px) !important;
    --duel-mobile-combatant-w: calc(100vw - var(--duel-mobile-edge) - var(--duel-mobile-edge-r)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters.fighters.fighters.fighters.fighters {
    left: var(--duel-mobile-edge) !important;
    right: auto !important;
    width: var(--duel-mobile-combatant-w) !important;
    max-width: var(--duel-mobile-combatant-w) !important;
    inline-size: var(--duel-mobile-combatant-w) !important;
    justify-items: start !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant.combatant.combatant.combatant {
    box-sizing: border-box !important;
    justify-self: start !important;
    width: var(--duel-mobile-combatant-w) !important;
    max-width: var(--duel-mobile-combatant-w) !important;
    inline-size: var(--duel-mobile-combatant-w) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .you-combatant.you-combatant.you-combatant.you-combatant.you-combatant {
    grid-template-columns: minmax(0, 1fr) var(--duel-mobile-fighter-card-w) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant {
    grid-template-columns: var(--duel-mobile-fighter-card-w) minmax(0, 1fr) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant.combatant.combatant.combatant > :is(.fighter.fighter, .fighter-panel.fighter-panel) {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant.combatant.combatant.combatant::after {
    inset: -4px !important;
    filter:
      drop-shadow(0 0 7px rgba(120, 206, 246, 0.18))
      drop-shadow(0 7px 15px rgba(0, 0, 0, 0.18)) !important;
  }
}

@media (max-width: 390px) {
  html body:not(.maintenance-mode).battle-controls-active:has(#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden])) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-fighter-card-w: clamp(80px, 22.5vw, 94px) !important;
  }
}

/* V1.27Beta-battle-art-ui3: direct phone battle selector, no :has() dependency. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-fighter-card-w: clamp(86px, 23.5vw, 110px) !important;
    --duel-mobile-combatant-w: calc(100vw - var(--duel-mobile-edge) - var(--duel-mobile-edge-r)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters.fighters.fighters.fighters.fighters.fighters {
    left: var(--duel-mobile-edge) !important;
    right: auto !important;
    width: var(--duel-mobile-combatant-w) !important;
    max-width: var(--duel-mobile-combatant-w) !important;
    inline-size: var(--duel-mobile-combatant-w) !important;
    justify-items: start !important;
    overflow: visible !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant.combatant.combatant.combatant.combatant {
    box-sizing: border-box !important;
    justify-self: start !important;
    width: var(--duel-mobile-combatant-w) !important;
    max-width: var(--duel-mobile-combatant-w) !important;
    inline-size: var(--duel-mobile-combatant-w) !important;
    min-width: 0 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .you-combatant.you-combatant.you-combatant.you-combatant.you-combatant.you-combatant {
    grid-template-columns: minmax(0, 1fr) var(--duel-mobile-fighter-card-w) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant {
    grid-template-columns: var(--duel-mobile-fighter-card-w) minmax(0, 1fr) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant.combatant.combatant.combatant.combatant > :is(.fighter.fighter, .fighter-panel.fighter-panel) {
    min-width: 0 !important;
    max-width: 100% !important;
  }
}

@media (max-width: 390px) {
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-fighter-card-w: clamp(80px, 22.5vw, 94px) !important;
  }
}

/* V1.27Beta-battle-art-ui4: outrank legacy repeated-id phone combatant rules. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-fighter-card-w: clamp(86px, 23.5vw, 110px) !important;
    --duel-mobile-combatant-w: calc(100vw - var(--duel-mobile-edge) - var(--duel-mobile-edge-r)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters.fighters.fighters.fighters.fighters.fighters.fighters {
    left: var(--duel-mobile-edge) !important;
    right: auto !important;
    width: var(--duel-mobile-combatant-w) !important;
    max-width: var(--duel-mobile-combatant-w) !important;
    inline-size: var(--duel-mobile-combatant-w) !important;
    justify-items: start !important;
    overflow: visible !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant.combatant.combatant.combatant.combatant.combatant {
    box-sizing: border-box !important;
    justify-self: start !important;
    width: var(--duel-mobile-combatant-w) !important;
    max-width: var(--duel-mobile-combatant-w) !important;
    inline-size: var(--duel-mobile-combatant-w) !important;
    min-width: 0 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .you-combatant.you-combatant.you-combatant.you-combatant.you-combatant.you-combatant.you-combatant {
    grid-template-columns: minmax(0, 1fr) var(--duel-mobile-fighter-card-w) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant {
    grid-template-columns: var(--duel-mobile-fighter-card-w) minmax(0, 1fr) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #youCard#youCard#youCard#youCard,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #opponentCard#opponentCard#opponentCard#opponentCard {
    width: var(--duel-mobile-fighter-card-w) !important;
    max-width: var(--duel-mobile-fighter-card-w) !important;
    min-width: 0 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .you-panel.you-panel.you-panel.you-panel,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .opponent-panel.opponent-panel.opponent-panel.opponent-panel {
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
}

@media (max-width: 390px) {
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-fighter-card-w: clamp(80px, 22.5vw, 94px) !important;
  }
}

/* V1.28Beta-mobile-battle-readable1: final phone 1v1 pass for visible actions, compact libraries, readable prompts, and clear VS. */
@media (max-width: 720px) {
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-edge: max(6px, env(safe-area-inset-left)) !important;
    --duel-mobile-edge-r: max(6px, env(safe-area-inset-right)) !important;
    --duel-mobile-bottom: max(6px, env(safe-area-inset-bottom)) !important;
    --duel-mobile-bottom-row: clamp(38px, 10.2vw, 42px) !important;
    --duel-mobile-action-gap: clamp(4px, 1.2vw, 5px) !important;
    --duel-mobile-action-h: clamp(46px, calc(((100vw - var(--duel-mobile-edge) - var(--duel-mobile-edge-r) - var(--duel-mobile-action-gap) * 2) / 3) * 793 / 1983), 58px) !important;
    --duel-mobile-action-bottom: calc(var(--duel-mobile-bottom) + var(--duel-mobile-bottom-row) + 10px) !important;
    --duel-mobile-stage-top: calc(max(8px, env(safe-area-inset-top)) + 36px) !important;
    --duel-mobile-stage-bottom: calc(var(--duel-mobile-action-bottom) + var(--duel-mobile-action-h) + 8px) !important;
    --duel-mobile-fighter-card-w: clamp(108px, 30.5vw, 132px) !important;
    --duel-mobile-combatant-w: calc(100vw - var(--duel-mobile-edge) - var(--duel-mobile-edge-r)) !important;
    background:
      linear-gradient(180deg, rgba(3, 8, 13, 0.06), rgba(3, 8, 13, 0.12)),
      var(--battle-wallpaper-art, var(--battle-visible-surface)) center center / cover no-repeat,
      #dcebed !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighters.fighters.fighters.fighters.fighters.fighters.fighters.fighters.fighters {
    position: absolute !important;
    left: var(--duel-mobile-edge) !important;
    right: var(--duel-mobile-edge-r) !important;
    top: var(--duel-mobile-stage-top) !important;
    bottom: var(--duel-mobile-stage-bottom) !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) clamp(22px, 5.6vw, 30px) minmax(0, 1fr) !important;
    align-items: stretch !important;
    justify-items: stretch !important;
    gap: clamp(5px, 1.2vh, 8px) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .combatant.combatant.combatant.combatant.combatant.combatant.combatant.combatant.combatant {
    width: var(--duel-mobile-combatant-w) !important;
    max-width: var(--duel-mobile-combatant-w) !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: clamp(5px, 1.25vw, 7px) !important;
    gap: clamp(5px, 1.35vw, 8px) !important;
    align-items: stretch !important;
    overflow: hidden !important;
    border-radius: 10px !important;
    border: 1px solid rgba(223, 238, 238, 0.3) !important;
    background:
      linear-gradient(180deg, rgba(10, 18, 24, 0.46), rgba(4, 10, 16, 0.36)) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.16),
      0 8px 18px rgba(0, 0, 0, 0.16) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .you-combatant.you-combatant.you-combatant.you-combatant.you-combatant.you-combatant.you-combatant.you-combatant {
    grid-template-columns: minmax(0, 1fr) var(--duel-mobile-fighter-card-w) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant.opponent-combatant {
    grid-template-columns: var(--duel-mobile-fighter-card-w) minmax(0, 1fr) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #youCard#youCard#youCard#youCard#youCard,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #opponentCard#opponentCard#opponentCard#opponentCard#opponentCard {
    width: var(--duel-mobile-fighter-card-w) !important;
    min-width: var(--duel-mobile-fighter-card-w) !important;
    max-width: var(--duel-mobile-fighter-card-w) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter.fighter.fighter,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .fighter-panel.fighter-panel.fighter-panel {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) .versus.versus.versus {
    width: auto !important;
    min-width: 0 !important;
    height: clamp(22px, 5.6vw, 30px) !important;
    min-height: clamp(22px, 5.6vw, 30px) !important;
    display: grid !important;
    place-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    color: rgba(255, 255, 255, 0.96) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.96) !important;
    font-size: clamp(18px, 5vw, 24px) !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
    line-height: 1 !important;
    text-shadow:
      0 2px 5px rgba(0, 0, 0, 0.78),
      0 0 12px rgba(120, 214, 255, 0.42) !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    z-index: 5 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards#cards#cards.cards.cards {
    position: fixed !important;
    left: var(--duel-mobile-edge) !important;
    right: var(--duel-mobile-edge-r) !important;
    top: auto !important;
    bottom: var(--duel-mobile-action-bottom) !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: var(--duel-mobile-action-gap) !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    z-index: 1600 !important;
    pointer-events: auto !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards#cards#cards.cards.cards > .action-card.action-card.action-card {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 1983 / 793 !important;
    background-size: 100% 100% !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    filter:
      drop-shadow(0 6px 10px rgba(0, 0, 0, 0.38))
      drop-shadow(0 0 8px rgba(120, 214, 255, 0.18)) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) #cards#cards#cards#cards#cards#cards#cards#cards.cards.cards > .action-card.action-card.action-card span {
    position: absolute !important;
    left: 35% !important;
    top: 21.5% !important;
    width: 61% !important;
    height: 50% !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 3% !important;
    color: #fbfdff !important;
    -webkit-text-fill-color: #fbfdff !important;
    font-size: clamp(12px, 3.55vw, 16px) !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-shadow:
      0 2px 4px rgba(0, 0, 0, 0.9),
      0 0 9px rgba(255, 255, 255, 0.22) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .battle-libraries.battle-libraries.battle-libraries {
    position: fixed !important;
    left: var(--duel-mobile-edge) !important;
    right: auto !important;
    top: auto !important;
    bottom: var(--duel-mobile-bottom) !important;
    width: min(172px, calc(100vw - 156px)) !important;
    min-width: 154px !important;
    max-width: 172px !important;
    height: var(--duel-mobile-bottom-row) !important;
    min-height: var(--duel-mobile-bottom-row) !important;
    max-height: var(--duel-mobile-bottom-row) !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 3px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    z-index: 1500 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .battle-libraries.battle-libraries.battle-libraries > .library-action.library-action.library-action {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 7px !important;
    border: 1px solid rgba(255, 246, 208, 0.3) !important;
    background-color: rgba(7, 11, 16, 0.78) !important;
    background-position: center center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    box-shadow:
      0 7px 14px rgba(0, 0, 0, 0.28),
      inset 0 0 0 1px rgba(255, 255, 255, 0.06) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .battle-libraries.battle-libraries.battle-libraries > .opportunity-library-action.library-action {
    background:
      linear-gradient(180deg, rgba(2, 5, 8, 0.02), rgba(2, 5, 8, 0.74)),
      url("assets/ui/battle-library-opportunity-icon-crop-v1.png?v=V1.28Beta-mobile-battle-readable1") center center / cover no-repeat !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .battle-libraries.battle-libraries.battle-libraries > .artifact-library-action.library-action {
    background:
      linear-gradient(180deg, rgba(2, 5, 8, 0.02), rgba(2, 5, 8, 0.74)),
      url("assets/ui/battle-library-artifact-icon-crop-v1.png?v=V1.28Beta-mobile-battle-readable1") center center / cover no-repeat !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .battle-libraries.battle-libraries.battle-libraries > .library-action.library-action.library-action > span {
    position: absolute !important;
    left: 4px !important;
    right: 4px !important;
    bottom: 3px !important;
    display: block !important;
    padding: 0 !important;
    color: #fff7d6 !important;
    -webkit-text-fill-color: #fff7d6 !important;
    font-size: clamp(9px, 2.55vw, 11px) !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.95) !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .utility.utility.utility {
    position: fixed !important;
    left: var(--duel-mobile-edge) !important;
    top: max(8px, env(safe-area-inset-top)) !important;
    right: auto !important;
    bottom: auto !important;
    width: auto !important;
    height: 28px !important;
    min-height: 28px !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    z-index: 1700 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .utility.utility.utility > button {
    height: 28px !important;
    min-height: 28px !important;
    width: auto !important;
    min-width: 54px !important;
    padding: 0 8px !important;
    overflow: hidden !important;
    clip-path: none !important;
    border-radius: 7px !important;
    font-size: 10px !important;
    line-height: 1 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .utility.utility.utility::before,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .utility.utility.utility::after,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .utility.utility.utility > button::before,
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) > .utility.utility.utility > button::after {
    content: none !important;
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active .toast.toast:not([hidden]) {
    top: calc(max(8px, env(safe-area-inset-top)) + 40px) !important;
    bottom: auto !important;
    width: auto !important;
    max-width: calc(100vw - 18px) !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 9px 12px !important;
    white-space: normal !important;
    overflow: visible !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    line-height: 1.25 !important;
    text-align: center !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #controlBanner.control-banner:not([hidden]) {
    top: calc(max(8px, env(safe-area-inset-top)) + 42px) !important;
    width: min(360px, calc(100vw - 18px)) !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    padding: 10px 12px !important;
    overflow: visible !important;
    line-height: 1.24 !important;
  }

  html body:not(.maintenance-mode).battle-controls-active #controlBanner.control-banner span,
  html body:not(.maintenance-mode).battle-controls-active #controlBanner.control-banner strong {
    white-space: normal !important;
    overflow: visible !important;
    line-height: 1.24 !important;
  }
}

@media (max-width: 390px) {
  html body:not(.maintenance-mode).battle-controls-active #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.battle-app.duel-battle-app:not(.team-battle-app):not(.identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]):not(.team-mode):not(.identity-battle) {
    --duel-mobile-fighter-card-w: clamp(102px, 29vw, 118px) !important;
    --duel-mobile-action-h: clamp(44px, calc(((100vw - var(--duel-mobile-edge) - var(--duel-mobile-edge-r) - var(--duel-mobile-action-gap) * 2) / 3) * 793 / 1983), 54px) !important;
  }
}