/* V1.27Beta-duel-desktop-frame-space4: 1v1 desktop keeps portraits separated, full-figure crops, and higher action glyphs. */
@media (min-width: 900px) {
  html body:not(.maintenance-mode) #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,
  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 {
    --fighter-panel-w: clamp(128px, 8.2vw, 158px) !important;
    --fighter-card-w: clamp(330px, 23.2vw, 410px) !important;
    --fighter-card-h: clamp(548px, 72vh, 674px) !important;
    --fighter-inner-gap: clamp(13px, 1vw, 18px) !important;
    --combatant-pad: clamp(10px, 1vw, 16px) !important;
    --fighter-gap: clamp(54px, 5.2vw, 96px) !important;
    --versus-size: clamp(48px, 4.8vw, 62px) !important;
    --combatant-w: calc(var(--fighter-panel-w) + var(--fighter-card-w) + var(--fighter-inner-gap) + var(--combatant-pad) * 2) !important;
    --duel-stage-width: min(1500px, calc(100vw - 300px));
    width: var(--duel-stage-width) !important;
    max-width: var(--duel-stage-width) !important;
    margin-left: max(32px, calc((100vw - 300px - var(--duel-stage-width)) / 2)) !important;
    margin-right: auto !important;
    grid-template-columns:
      minmax(0, var(--combatant-w))
      var(--versus-size)
      minmax(0, var(--combatant-w)) !important;
    gap: var(--fighter-gap) !important;
    justify-content: center !important;
  }

  html body:not(.maintenance-mode) #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) .you-combatant.you-combatant {
    grid-template-columns: var(--fighter-panel-w) var(--fighter-card-w) !important;
  }

  html body:not(.maintenance-mode) #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,
  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: var(--fighter-card-w) var(--fighter-panel-w) !important;
  }

  html body:not(.maintenance-mode) #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,
  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 {
    width: var(--fighter-panel-w) !important;
    min-width: var(--fighter-panel-w) !important;
    max-width: var(--fighter-panel-w) !important;
  }

  html body:not(.maintenance-mode) #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.fighter {
    width: var(--fighter-card-w) !important;
    min-width: var(--fighter-card-w) !important;
    max-width: var(--fighter-card-w) !important;
    padding-top: clamp(12px, 1.45vh, 18px) !important;
  }

  html body:not(.maintenance-mode) #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,
  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 {
    transform: translateY(clamp(5px, 0.75vh, 9px)) !important;
  }

  html body:not(.maintenance-mode) #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,
  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 {
    background-size: var(--duel-portrait-size, contain), cover, cover !important;
    background-position: var(--duel-portrait-position, center bottom), center center, center center !important;
    background-repeat: no-repeat !important;
  }

  html body:not(.maintenance-mode) #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[data-character="Saoge"],
  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[data-character="Saoge"] {
    --duel-portrait-size: auto 96%;
    --duel-portrait-position: center bottom;
  }

  html body:not(.maintenance-mode) #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 .action-icon.action-icon,
  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 .action-icon.action-icon {
    top: 43.5% !important;
    transform: translateY(-50%) !important;
  }
}

/* V1.27Beta-desire-portrait-near1: Desire battle portrait is slightly closer without changing the card frame. */
@media (min-width: 900px) {
  html body:not(.maintenance-mode) #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[data-character="Desire"],
  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[data-character="Desire"] {
    --duel-portrait-size: auto 108% !important;
    --duel-portrait-position: center bottom !important;
    background-size: var(--duel-portrait-size), cover, cover !important;
    background-position: var(--duel-portrait-position), center center, center center !important;
  }
}

/* V1.27Beta-desktop-status-panel-polish1: widen and refine the desktop duel character/status area. */
@media (min-width: 1180px) {
  html body:not(.maintenance-mode) #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,
  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 {
    --fighter-panel-w: clamp(208px, 12.5vw, 250px) !important;
    --fighter-card-w: clamp(300px, 22vw, 430px) !important;
    --fighter-card-h: clamp(560px, 72vh, 700px) !important;
    --fighter-inner-gap: clamp(13px, 1vw, 18px) !important;
    --combatant-pad: clamp(10px, 0.9vw, 15px) !important;
    --fighter-gap: clamp(34px, 3.4vw, 66px) !important;
    --versus-size: clamp(48px, 4vw, 60px) !important;
    --combatant-w: calc(var(--fighter-panel-w) + var(--fighter-card-w) + var(--fighter-inner-gap) + var(--combatant-pad) * 2) !important;
    --duel-stage-width: min(1680px, calc(100vw - 240px)) !important;
    width: var(--duel-stage-width) !important;
    max-width: var(--duel-stage-width) !important;
    margin-left: max(24px, calc((100vw - 240px - var(--duel-stage-width)) / 2)) !important;
    grid-template-columns:
      minmax(0, var(--combatant-w))
      var(--versus-size)
      minmax(0, var(--combatant-w)) !important;
    gap: var(--fighter-gap) !important;
  }

  html body:not(.maintenance-mode) #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,
  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 {
    display: grid !important;
    grid-template-rows: auto auto auto auto auto minmax(34px, 1fr) !important;
    gap: clamp(8px, 0.78vw, 12px) !important;
    padding: clamp(10px, 0.95vw, 14px) !important;
    overflow: visible !important;
    border-color: rgba(214, 232, 242, 0.78) !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(218, 236, 248, 0.42) 46%, rgba(189, 224, 239, 0.22)),
      linear-gradient(135deg, rgba(255, 255, 255, 0.46), rgba(120, 205, 224, 0.2) 48%, rgba(235, 207, 142, 0.16)),
      rgba(238, 248, 250, 0.54) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.9),
      inset 0 0 0 1px rgba(255, 255, 255, 0.32),
      inset 0 -24px 42px rgba(39, 104, 132, 0.08),
      0 16px 34px rgba(15, 52, 72, 0.18),
      0 0 24px color-mix(in srgb, var(--fighter-accent) 16%, transparent) !important;
    backdrop-filter: blur(10px) saturate(1.08) !important;
  }

  html body:not(.maintenance-mode) #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::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) .fighter-panel.fighter-panel::after {
    content: "" !important;
    position: absolute !important;
    inset: 7px !important;
    z-index: 0 !important;
    pointer-events: none !important;
    border: 1px solid rgba(255, 255, 255, 0.34) !important;
    border-radius: 6px !important;
    background:
      linear-gradient(90deg, rgba(119, 211, 255, 0.12), transparent 44%, rgba(236, 210, 138, 0.12)),
      radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.28), transparent 42%) !important;
    opacity: 0.9 !important;
  }

  html body:not(.maintenance-mode) #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 > *,
  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;
    z-index: 1 !important;
  }

  html body:not(.maintenance-mode) #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.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 .status-bar.status-bar {
    min-height: 46px !important;
    max-height: 124px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    align-content: flex-start !important;
    gap: 7px !important;
    padding: 8px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border-color: rgba(214, 232, 242, 0.7) !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(218, 236, 248, 0.38)),
      rgba(238, 248, 250, 0.46) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.82),
      inset 0 -14px 24px rgba(47, 114, 142, 0.06),
      0 8px 18px rgba(10, 40, 58, 0.1) !important;
    scrollbar-width: thin !important;
  }

  html body:not(.maintenance-mode) #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.status-token,
  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.status-token {
    flex: 1 1 calc(50% - 7px) !important;
    min-width: 72px !important;
    max-width: 100% !important;
    height: 34px !important;
    padding: 3px 10px 3px 4px !important;
    border-radius: 8px !important;
    border-color: rgba(199, 222, 236, 0.76) !important;
    color: #18344d !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(218, 236, 248, 0.5)),
      rgba(238, 248, 250, 0.54) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.9),
      0 7px 14px rgba(8, 32, 54, 0.1) !important;
  }

  html body:not(.maintenance-mode) #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.status-token i,
  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.status-token i {
    width: 26px !important;
    height: 26px !important;
    flex-basis: 26px !important;
    border-radius: 7px !important;
    border-color: rgba(118, 169, 192, 0.54) !important;
    background: rgba(244, 250, 252, 0.82) !important;
  }

  html body:not(.maintenance-mode) #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.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.status-token b {
    color: #18344d !important;
    font-size: clamp(11px, 0.72vw, 12px) !important;
    line-height: 1.05 !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.76) !important;
  }

  html body:not(.maintenance-mode) #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.equipment-slots,
  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.equipment-slots {
    min-height: 74px !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    padding: 8px !important;
    border-color: rgba(214, 232, 242, 0.74) !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(218, 236, 248, 0.36)),
      rgba(238, 248, 250, 0.42) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.82),
      inset 0 -16px 28px rgba(47, 114, 142, 0.07),
      0 8px 18px rgba(10, 40, 58, 0.1) !important;
  }

  html body:not(.maintenance-mode) #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.equipment-slot,
  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.equipment-slot {
    min-height: clamp(50px, 3.8vw, 62px) !important;
    aspect-ratio: 1.05 / 1 !important;
    border-radius: 8px !important;
    border-color: rgba(133, 176, 198, 0.58) !important;
    background:
      radial-gradient(circle at 50% 32%, rgba(255, 255, 255, 0.7), transparent 44%),
      linear-gradient(180deg, rgba(238, 248, 250, 0.8), rgba(191, 224, 239, 0.46)),
      rgba(238, 248, 250, 0.42) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.86),
      inset 0 -12px 22px rgba(30, 86, 116, 0.1),
      0 7px 15px rgba(8, 32, 54, 0.1) !important;
  }

  html body:not(.maintenance-mode) #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.filled,
  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.filled {
    background:
      linear-gradient(180deg, transparent 38%, rgba(9, 21, 31, 0.62)),
      radial-gradient(circle at 50% 28%, rgba(255, 255, 255, 0.46), transparent 58%),
      var(--equipment-art, none) center / contain no-repeat,
      linear-gradient(180deg, rgba(238, 248, 250, 0.82), rgba(177, 216, 236, 0.48)) !important;
  }

  html body:not(.maintenance-mode) #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 :is(.meter-row, .energy, .fatigue, .laziness, .choice),
  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 :is(.meter-row, .energy, .fatigue, .laziness, .choice) {
    border-color: rgba(214, 232, 242, 0.68) !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.68), rgba(218, 236, 248, 0.34)),
      rgba(238, 248, 250, 0.36) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.78),
      0 6px 14px rgba(8, 32, 54, 0.08) !important;
  }

  html body:not(.maintenance-mode) #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.fatigue-row,
  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.fatigue-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  html body:not(.maintenance-mode) #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 :is(.energy, .fatigue, .laziness),
  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 :is(.energy, .fatigue, .laziness) {
    min-height: 38px !important;
    grid-template-columns: minmax(54px, auto) minmax(0, 1fr) !important;
    gap: 5px 8px !important;
    padding: 7px 8px !important;
  }

  html body:not(.maintenance-mode) #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 :is(.stat-label, .choice, .meter-row > 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 :is(.stat-label, .choice, .meter-row > b) {
    color: #18344d !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) !important;
  }

  html body:not(.maintenance-mode) #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.fighter {
    border-color: rgba(214, 232, 242, 0.74) !important;
    background:
      radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.5), transparent 38%),
      linear-gradient(180deg, rgba(255, 255, 255, 0.44), rgba(214, 233, 248, 0.2)),
      rgba(238, 248, 250, 0.24) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.76),
      inset 0 0 0 1px rgba(255, 255, 255, 0.22),
      0 20px 40px rgba(8, 32, 54, 0.17),
      0 0 26px color-mix(in srgb, var(--fighter-accent) 13%, transparent) !important;
  }

  html body:not(.maintenance-mode) #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,
  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: 48px !important;
    padding: 8px 12px !important;
    border-color: rgba(214, 232, 242, 0.72) !important;
    background:
      linear-gradient(90deg, rgba(255, 255, 255, 0.84), rgba(214, 233, 248, 0.44) 54%, rgba(236, 210, 138, 0.18)),
      rgba(238, 248, 250, 0.52) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.88),
      0 8px 16px rgba(8, 32, 54, 0.1) !important;
  }

  html body:not(.maintenance-mode) #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 :is(strong, span, .fighter-side),
  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 :is(strong, span, .fighter-side) {
    color: #18344d !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.72) !important;
  }

  html body:not(.maintenance-mode) #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,
  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 {
    border-color: rgba(214, 232, 242, 0.74) !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.28), rgba(214, 233, 248, 0.12)),
      rgba(238, 248, 250, 0.16) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.22),
      0 16px 32px rgba(8, 32, 54, 0.14) !important;
  }

  html body:not(.maintenance-mode) #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,
  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 {
    border-color: rgba(214, 232, 242, 0.78) !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(214, 233, 248, 0.48)),
      rgba(238, 248, 250, 0.6) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.9),
      0 10px 18px rgba(8, 32, 54, 0.12) !important;
  }

  html body:not(.maintenance-mode) #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 :is(b, span, .skill-label, .inline-skill-name, .inline-skill-action, .passive-skill-label, .skill-inline-text),
  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 :is(b, span, .skill-label, .inline-skill-name, .inline-skill-action, .passive-skill-label, .skill-inline-text) {
    color: #18344d !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.74) !important;
  }
}
