/* * V1.312 — phone multiplayer battlefield. * * This layer intentionally carries more selector weight than the legacy phone * seat-ring/list locks. Critical state stays on the battlefield; long-form * player information and the battle log use explicit drawers. */ /* The expanded roster dossier belongs to the compact multiplayer drawer only. */ #playerInspectDetails.player-inspect-details { display: none; } @media (max-width: 720px), (orientation: landscape) and (max-height: 520px) and (max-width: 960px) { html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]):has( #appRoot.app:is(.team-battle-app, .identity-battle-app) #battle.battle:not([hidden]) ) { --mtb-edge: clamp(4px, 1.5vw, 8px); --mtb-gap: clamp(3px, 1vw, 5px); --mtb-command-h: 52px; --mtb-action-h: 56px; --mtb-aux-h: 44px; --mtb-safe-top: max(4px, env(safe-area-inset-top)); --mtb-safe-bottom: max(4px, env(safe-area-inset-bottom)); --mtb-board-top: calc(var(--mtb-safe-top) + var(--mtb-command-h) + 4px); --mtb-action-bottom: calc(var(--mtb-safe-bottom) + var(--mtb-aux-h) + 4px); --mtb-board-bottom: calc(var(--mtb-action-bottom) + var(--mtb-action-h) + 4px); --mtb-library-w: clamp(116px, 38vw, 164px); overflow: hidden !important; overscroll-behavior: none !important; } /* Own the complete phone stage instead of inheriting the old scrolling list. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) { position: fixed !important; inset: 0 !important; width: 100vw !important; min-width: 100vw !important; max-width: 100vw !important; height: 100vh !important; height: 100dvh !important; min-height: 100dvh !important; max-height: 100dvh !important; margin: 0 !important; padding: 0 !important; display: block !important; overflow: hidden !important; isolation: isolate !important; } /* Top turn/command HUD. Corner buttons live inside its protected gutters. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) #battleCommandState#battleCommandState#battleCommandState.battle-command-state { position: fixed !important; z-index: 2000 !important; inset: var(--mtb-safe-top) var(--mtb-edge) auto var(--mtb-edge) !important; width: auto !important; min-width: 0 !important; max-width: none !important; height: var(--mtb-command-h) !important; min-height: var(--mtb-command-h) !important; max-height: var(--mtb-command-h) !important; margin: 0 !important; padding: 4px 52px 5px !important; box-sizing: border-box !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; grid-template-rows: 20px 14px 3px !important; grid-template-areas: "copy status" "detail detail" "progress progress" !important; gap: 3px 5px !important; border: 1px solid rgba(146, 217, 229, 0.46) !important; border-radius: 12px !important; background: linear-gradient(90deg, color-mix(in srgb, var(--battle-state-color, #9bdff3) 12%, transparent), transparent 46%), rgba(5, 14, 24, 0.94) !important; box-shadow: 0 7px 18px rgba(0, 0, 0, 0.34), inset 0 1px rgba(255, 255, 255, 0.08) !important; overflow: hidden !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState .battle-command-state-emblem { display: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState .battle-command-state-copy { grid-area: copy !important; min-width: 0 !important; display: flex !important; align-items: baseline !important; gap: 5px !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState .battle-command-state-copy small { flex: 0 0 auto !important; font-size: 8px !important; line-height: 1 !important; letter-spacing: 0.04em !important; white-space: nowrap !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState .battle-command-state-copy strong { min-width: 0 !important; font-size: clamp(11px, 3.25vw, 14px) !important; line-height: 1.05 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState > em { grid-area: detail !important; min-width: 0 !important; margin: 0 !important; color: rgba(231, 244, 249, 0.82) !important; font-size: 9px !important; line-height: 1.1 !important; text-align: left !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState .battle-command-state-progress { grid-area: progress !important; align-self: end !important; gap: 3px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState :is(.battle-command-state-latency, .battle-command-state-readiness, .battle-command-state-receipt):not([hidden]) { grid-area: status !important; position: static !important; inset: auto !important; min-width: 0 !important; max-width: 78px !important; min-height: 18px !important; max-height: 20px !important; margin: 0 !important; padding: 2px 4px !important; align-self: center !important; justify-self: end !important; font-size: 8px !important; line-height: 1 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState .battle-command-state-readiness > span { gap: 2px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState .battle-command-state-readiness i { width: 6px !important; height: 6px !important; } /* The entire board is a stable, non-scrolling viewport between both HUDs. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board:not([hidden]) { position: fixed !important; z-index: 20 !important; inset: var(--mtb-board-top) var(--mtb-edge) var(--mtb-board-bottom) var(--mtb-edge) !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: block !important; overflow: hidden !important; overscroll-behavior: none !important; background: transparent !important; border: 0 !important; box-shadow: none !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring { position: relative !important; inset: auto !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: 0 !important; display: grid !important; grid-template-columns: repeat(var(--team-columns, 3), minmax(0, 1fr)) !important; grid-template-rows: repeat(2, minmax(0, 1fr)) !important; grid-auto-flow: row !important; grid-auto-rows: minmax(0, 1fr) !important; gap: var(--mtb-gap) !important; overflow: hidden !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; transform: none !important; } /* Identity is deliberately dense, but every one of ten public summaries fits. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; grid-template-rows: repeat(5, minmax(0, 1fr)) !important; grid-auto-rows: minmax(0, 1fr) !important; gap: clamp(2px, 0.75vw, 4px) !important; } /* Remove the old oval/ring entirely; the DOM order now defines enemy/ally rows. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing::before, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing::after, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-ring-core, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-ring-core::before, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-ring-core::after { content: none !important; display: none !important; background: none !important; border: 0 !important; box-shadow: none !important; } /* Shared summary-card reset. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter.seat-fighter { position: relative !important; inset: auto !important; place-self: stretch !important; width: 100% !important; min-width: 0 !important; max-width: none !important; height: 100% !important; min-height: 0 !important; max-height: none !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; display: block !important; border: 1px solid rgba(170, 204, 216, 0.38) !important; border-radius: clamp(7px, 2.4vw, 11px) !important; background: rgba(5, 14, 23, 0.9) !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.045) !important; overflow: hidden !important; transform: none !important; isolation: isolate !important; } /* One semantic primary button owns whole-card select/inspect without stealing the independent detail and self-skill controls above it. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter.seat-fighter > .team-card-primary-action.team-card-primary-action:not([hidden]) { position: absolute !important; z-index: 2 !important; inset: 0 !important; width: 100% !important; min-width: 44px !important; max-width: none !important; height: 100% !important; min-height: 44px !important; max-height: none !important; margin: 0 !important; padding: 0 !important; display: block !important; border: 0 !important; border-radius: inherit !important; background: transparent !important; color: transparent !important; box-shadow: none !important; opacity: 1 !important; appearance: none !important; cursor: pointer !important; pointer-events: auto !important; touch-action: manipulation !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter.seat-fighter > .team-card-primary-action.team-card-primary-action:focus-visible { outline: 3px solid #fff0a8 !important; outline-offset: -4px !important; box-shadow: inset 0 0 0 2px rgba(35, 12, 3, 0.72) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter.seat-fighter > :is(.team-art, .team-relation-badge, .team-landmark, .team-card-inscription), html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter.seat-fighter .team-info :not(.team-inspect-action) { pointer-events: none !important; } /* Relation belongs to the portrait, not the already crowded name line. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter.seat-fighter > .team-relation-badge.team-relation-badge { position: absolute !important; z-index: 7 !important; top: 3px !important; left: 3px !important; right: auto !important; bottom: auto !important; width: auto !important; min-width: 20px !important; max-width: 38px !important; height: 18px !important; min-height: 18px !important; max-height: 18px !important; margin: 0 !important; padding: 2px 5px !important; box-sizing: border-box !important; display: inline-grid !important; place-items: center !important; border: 1px solid rgba(220, 239, 246, 0.6) !important; border-radius: 999px !important; background: rgba(6, 15, 23, 0.92) !important; color: #f1f8fb !important; -webkit-text-fill-color: #f1f8fb !important; font-size: 7px !important; font-style: normal !important; font-weight: 950 !important; line-height: 1 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; box-shadow: 0 2px 7px rgba(0, 0, 0, 0.46) !important; pointer-events: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter[data-relation="enemy"] > .team-relation-badge.team-relation-badge { border-color: rgba(255, 139, 123, 0.9) !important; background: rgba(104, 27, 30, 0.94) !important; color: #ffeae5 !important; -webkit-text-fill-color: #ffeae5 !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter[data-relation="ally"] > .team-relation-badge.team-relation-badge { border-color: rgba(102, 221, 237, 0.86) !important; background: rgba(16, 71, 87, 0.94) !important; color: #e1fbff !important; -webkit-text-fill-color: #e1fbff !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter[data-relation="self"] > .team-relation-badge.team-relation-badge { border-color: rgba(255, 229, 139, 0.96) !important; background: rgba(93, 65, 15, 0.96) !important; color: #fff7d7 !important; -webkit-text-fill-color: #fff7d7 !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter[data-relation="enemy"] { border-color: rgba(239, 107, 91, 0.64) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter[data-relation="ally"] { border-color: rgba(77, 191, 211, 0.6) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter[data-relation="self"] { border-color: rgba(255, 222, 119, 0.9) !important; box-shadow: 0 0 0 1px rgba(255, 222, 119, 0.26), 0 0 15px rgba(255, 208, 88, 0.16) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter:is(.target-candidate, .targetable) { outline: 2px solid #77e6ff !important; outline-offset: -3px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter.selected-target { outline-color: #ffe37c !important; box-shadow: 0 0 0 2px rgba(255, 227, 124, 0.44), 0 0 18px rgba(255, 207, 74, 0.36) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter.down { opacity: 0.68 !important; filter: grayscale(0.52) saturate(0.68) !important; } /* 2v2/3v3 use two fixed rows and vertically composed summary cards. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="teams"] > .seat-fighter .team-art.team-art { position: absolute !important; z-index: 0 !important; inset: 0 0 92px !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: auto !important; min-height: 0 !important; max-height: none !important; border-radius: inherit !important; background-size: cover !important; background-position: var(--portrait-pos-x, center) var(--portrait-pos-y, 22%) !important; background-repeat: no-repeat !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="teams"] > .seat-fighter .team-info.team-info { position: absolute !important; z-index: 3 !important; inset: 0 !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: 3px !important; box-sizing: border-box !important; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: 24px minmax(28px, 1fr) 30px 18px 18px 18px !important; grid-template-areas: "header" "." "vitals" "statuses" "equipment" "choice" !important; gap: 2px !important; background: linear-gradient(180deg, rgba(3, 10, 16, 0.7) 0 24px, transparent 25% 50%, rgba(3, 9, 15, 0.2) 54%, rgba(3, 10, 17, 0.96) 72%) !important; overflow: hidden !important; pointer-events: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-info > header { grid-area: header !important; position: relative !important; inset: auto !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 24px !important; min-height: 24px !important; max-height: 24px !important; margin: 0 !important; padding: 1px 43px 1px 2px !important; box-sizing: border-box !important; display: grid !important; grid-template-rows: 12px 9px !important; gap: 0 !important; overflow: visible !important; pointer-events: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-info > header strong, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-info > header small { min-width: 0 !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; color: #f8fbff !important; -webkit-text-fill-color: #f8fbff !important; font-size: clamp(8px, 2.5vw, 11px) !important; font-weight: 900 !important; line-height: 1 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.92) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-info > header small { color: rgba(226, 239, 246, 0.8) !important; -webkit-text-fill-color: rgba(226, 239, 246, 0.8) !important; font-size: clamp(6.5px, 1.85vw, 8px) !important; } /* Dedicated, always discoverable 44px detail target. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-inspect-action.team-inspect-action { position: absolute !important; z-index: 12 !important; top: -3px !important; right: -3px !important; width: 44px !important; min-width: 44px !important; max-width: 44px !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; margin: 0 !important; padding: 0 2px !important; display: grid !important; place-items: start center !important; border: 0 !important; border-radius: 0 8px 0 18px !important; background: linear-gradient(145deg, rgba(15, 35, 48, 0.95), rgba(8, 18, 28, 0.35) 62%, transparent 63%) !important; color: #dbf7ff !important; -webkit-text-fill-color: #dbf7ff !important; font-size: 7px !important; font-weight: 900 !important; line-height: 16px !important; pointer-events: auto !important; touch-action: manipulation !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-coin-counter.team-coin-counter { position: absolute !important; z-index: 6 !important; left: 2px !important; top: 25px !important; width: auto !important; min-width: 20px !important; max-width: 36px !important; height: 15px !important; min-height: 15px !important; padding: 1px 3px !important; display: inline-grid !important; place-items: center !important; border-radius: 999px !important; font-size: 7px !important; line-height: 1 !important; pointer-events: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-mini-bars.team-mini-bars { grid-area: vitals !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 30px !important; min-height: 30px !important; max-height: 30px !important; margin: 0 !important; padding: 1px !important; display: grid !important; grid-template-rows: 13px 14px !important; gap: 1px !important; border-radius: 5px !important; background: rgba(3, 10, 16, 0.72) !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-mini-row.hp-mini { width: 100% !important; min-width: 0 !important; height: 13px !important; min-height: 13px !important; padding: 0 2px !important; display: grid !important; grid-template-columns: 18px minmax(0, 1fr) 18px !important; align-items: center !important; gap: 2px !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-mini-row.hp-mini :is(span, em) { display: block !important; margin: 0 !important; padding: 0 !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font-size: 7px !important; font-style: normal !important; font-weight: 900 !important; line-height: 1 !important; white-space: nowrap !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-mini-meter.team-mini-meter { display: block !important; width: 100% !important; min-width: 0 !important; height: 6px !important; min-height: 6px !important; border-radius: 999px !important; background: rgba(255, 255, 255, 0.13) !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-stat-stack.team-stat-stack { width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 14px !important; min-height: 14px !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 2px !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-stat.team-stat { width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 14px !important; min-height: 14px !important; max-height: 14px !important; padding: 1px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 1px !important; border-radius: 3px !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-stat .stat-label, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-stat .stat-value { display: block !important; min-width: 0 !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; font-size: clamp(5.5px, 1.65vw, 7px) !important; line-height: 1 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: clip !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-stat .stat-label-icon { display: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-status-bar.team-status-bar { grid-area: statuses !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 18px !important; min-height: 18px !important; max-height: 18px !important; margin: 0 !important; padding: 1px !important; display: flex !important; flex-wrap: nowrap !important; align-items: stretch !important; gap: 2px !important; overflow: hidden !important; pointer-events: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-status-bar .status-token { flex: 1 1 0 !important; width: auto !important; min-width: 0 !important; max-width: 100% !important; height: 16px !important; min-height: 16px !important; max-height: 16px !important; margin: 0 !important; padding: 1px 2px !important; gap: 1px !important; border-radius: 4px !important; font-size: 6.5px !important; line-height: 1 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; pointer-events: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-status-bar .status-token i { width: 10px !important; min-width: 10px !important; height: 10px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-equipment.team-equipment { grid-area: equipment !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 18px !important; min-height: 18px !important; max-height: 18px !important; margin: 0 !important; padding: 1px !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 2px !important; overflow: hidden !important; pointer-events: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-equipment .equipment-slot { width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 16px !important; min-height: 16px !important; max-height: 16px !important; margin: 0 !important; padding: 0 !important; border-radius: 3px !important; background-image: var(--equipment-art) !important; background-size: cover !important; background-position: center !important; font-size: 7px !important; line-height: 1 !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-equipment .equipment-cd { font-size: 6px !important; line-height: 1 !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-choice.team-choice { grid-area: choice !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 18px !important; min-height: 18px !important; max-height: 18px !important; margin: 0 !important; padding: 2px 3px !important; display: block !important; border-radius: 4px !important; background: rgba(10, 21, 30, 0.9) !important; color: #eaf8ff !important; -webkit-text-fill-color: #eaf8ff !important; font-size: clamp(6.5px, 1.85vw, 8px) !important; font-weight: 850 !important; line-height: 14px !important; text-align: center !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-card-inscription { display: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-landmark.team-landmark { position: absolute !important; z-index: 7 !important; top: 27px !important; right: 3px !important; width: 28px !important; min-width: 28px !important; max-width: 28px !important; height: 28px !important; min-height: 28px !important; max-height: 28px !important; margin: 0 !important; padding: 0 !important; border-radius: 6px !important; overflow: hidden !important; pointer-events: none !important; } /* Skill remains a real 44px target; its state is a separate glanceable badge. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="teams"] > .seat-fighter .team-skill.team-skill { position: absolute !important; z-index: 8 !important; inset: auto 3px 90px 3px !important; width: auto !important; min-width: 0 !important; max-width: none !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; pointer-events: auto !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-skill-label.team-skill-label, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-skill-label :is(.inline-skill-action, .inline-skill-name, .passive-skill-label) { width: 100% !important; min-width: 44px !important; max-width: 100% !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; margin: 0 !important; padding: 3px 30px 3px 5px !important; box-sizing: border-box !important; display: flex !important; align-items: center !important; justify-content: center !important; border-radius: 7px !important; font-size: clamp(7px, 2.15vw, 10px) !important; line-height: 1 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; touch-action: manipulation !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-skill-state.team-skill-state { position: absolute !important; z-index: 4 !important; top: 3px !important; right: 3px !important; width: auto !important; min-width: 24px !important; max-width: 42px !important; height: 18px !important; min-height: 18px !important; max-height: 18px !important; margin: 0 !important; padding: 2px 4px !important; display: inline-grid !important; place-items: center !important; border: 1px solid rgba(210, 231, 239, 0.34) !important; border-radius: 999px !important; background: rgba(6, 15, 23, 0.9) !important; color: #d9e8ee !important; -webkit-text-fill-color: #d9e8ee !important; font-size: 6.5px !important; font-weight: 950 !important; line-height: 1 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; pointer-events: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) .team-skill-state[data-state="ready"] { border-color: rgba(99, 235, 167, 0.78) !important; background: rgba(17, 91, 61, 0.9) !important; color: #dffff0 !important; -webkit-text-fill-color: #dffff0 !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) .team-skill-state[data-state="cooldown"] { border-color: rgba(108, 181, 237, 0.64) !important; background: rgba(19, 55, 91, 0.92) !important; color: #dff2ff !important; -webkit-text-fill-color: #dff2ff !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) .team-skill-state[data-state="locked"] { border-color: rgba(239, 113, 103, 0.72) !important; background: rgba(93, 26, 31, 0.92) !important; color: #ffe5e1 !important; -webkit-text-fill-color: #ffe5e1 !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) .team-skill-state:is([data-state="passive"], [data-state="used"]) { border-color: rgba(191, 163, 232, 0.6) !important; background: rgba(52, 38, 76, 0.9) !important; color: #efe5ff !important; -webkit-text-fill-color: #efe5ff !important; } /* Ten-player identity cards are compact horizontal rows. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-art.team-art { position: absolute !important; z-index: 0 !important; inset: 0 auto 0 0 !important; width: clamp(38px, 13vw, 54px) !important; min-width: clamp(38px, 13vw, 54px) !important; max-width: clamp(38px, 13vw, 54px) !important; height: 100% !important; min-height: 0 !important; max-height: 100% !important; border-radius: inherit !important; background-size: cover !important; background-position: center 20% !important; background-repeat: no-repeat !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-info.team-info { --identity-art-w: clamp(38px, 13vw, 54px); position: absolute !important; z-index: 3 !important; inset: 0 0 0 var(--identity-art-w) !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; padding: 2px !important; box-sizing: border-box !important; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: 20px minmax(25px, 1fr) 17px 15px 15px !important; grid-template-areas: "header" "vitals" "statuses" "equipment" "choice" !important; gap: 1px !important; background: linear-gradient(90deg, rgba(3, 10, 16, 0.18), rgba(3, 10, 16, 0.96) 22%) !important; overflow: hidden !important; pointer-events: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-info > header { height: 20px !important; min-height: 20px !important; max-height: 20px !important; padding: 1px 42px 1px 2px !important; display: flex !important; align-items: center !important; gap: 3px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-info > header :is(strong, small) { flex: 1 1 auto !important; font-size: clamp(6.5px, 2vw, 9px) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-info > header small { flex: 0 1 44% !important; font-size: clamp(5.5px, 1.6vw, 7px) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-coin-counter.team-coin-counter { display: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-mini-bars.team-mini-bars { height: 100% !important; min-height: 25px !important; max-height: none !important; grid-template-rows: minmax(11px, 1fr) minmax(12px, 1fr) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-status-bar.team-status-bar { height: 17px !important; min-height: 17px !important; max-height: 17px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-equipment.team-equipment, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-choice.team-choice { height: 15px !important; min-height: 15px !important; max-height: 15px !important; line-height: 11px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-equipment.team-equipment { box-sizing: border-box !important; padding-right: 19px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-equipment .equipment-slot { height: 13px !important; min-height: 13px !important; max-height: 13px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-landmark.team-landmark { top: auto !important; bottom: 17px !important; left: auto !important; right: 3px !important; width: 15px !important; min-width: 15px !important; max-width: 15px !important; height: 15px !important; min-height: 15px !important; max-height: 15px !important; border-radius: 3px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-skill.team-skill { position: absolute !important; z-index: 9 !important; inset: 2px 45px auto auto !important; width: auto !important; min-width: 0 !important; max-width: 52px !important; height: 18px !important; min-height: 18px !important; max-height: 18px !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; pointer-events: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter:not(.self-seat) .team-skill-label.team-skill-label { display: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-skill-state.team-skill-state { position: static !important; min-width: 26px !important; max-width: 52px !important; height: 18px !important; min-height: 18px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter.self-seat .team-skill.team-skill { inset: auto auto 1px 1px !important; width: 44px !important; min-width: 44px !important; max-width: 44px !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; pointer-events: auto !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter.self-seat .team-skill-label.team-skill-label, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter.self-seat .team-skill-label :is(.inline-skill-action, .inline-skill-name, .passive-skill-label) { display: grid !important; width: 44px !important; min-width: 44px !important; max-width: 44px !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; padding: 2px !important; place-items: center !important; font-size: 0 !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter.self-seat .team-skill-state.team-skill-state { position: absolute !important; inset: auto 1px 1px auto !important; min-width: 24px !important; } /* Bottom command deck: 56px main actions + 44px utility row, never overlapping. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) #cards#cards#cards#cards#cards#cards.cards.cards { position: fixed !important; z-index: 1800 !important; inset: auto var(--mtb-edge) var(--mtb-action-bottom) var(--mtb-edge) !important; width: auto !important; min-width: 0 !important; max-width: none !important; height: var(--mtb-action-h) !important; min-height: var(--mtb-action-h) !important; max-height: var(--mtb-action-h) !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; grid-template-rows: var(--mtb-action-h) !important; gap: var(--mtb-gap) !important; background: transparent !important; border: 0 !important; box-shadow: none !important; overflow: visible !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) #cards#cards#cards#cards#cards#cards.cards.cards > button.action-card.action-card { position: relative !important; width: 100% !important; min-width: 44px !important; max-width: 100% !important; height: var(--mtb-action-h) !important; min-height: 44px !important; max-height: var(--mtb-action-h) !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; display: block !important; background-position: center !important; background-size: 100% 100% !important; background-repeat: no-repeat !important; overflow: hidden !important; transform: none !important; touch-action: manipulation !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #cards#cards#cards#cards#cards#cards.cards.cards > button.action-card.action-card > span { font-size: clamp(11px, 3.4vw, 15px) !important; white-space: nowrap !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) > .battle-libraries.battle-libraries { position: fixed !important; z-index: 1850 !important; inset: auto auto var(--mtb-safe-bottom) var(--mtb-edge) !important; width: var(--mtb-library-w) !important; min-width: var(--mtb-library-w) !important; max-width: var(--mtb-library-w) !important; height: var(--mtb-aux-h) !important; min-height: var(--mtb-aux-h) !important; max-height: var(--mtb-aux-h) !important; margin: 0 !important; padding: 0 !important; display: grid !important; grid-template-columns: repeat(2, minmax(44px, 1fr)) !important; grid-template-rows: var(--mtb-aux-h) !important; gap: 3px !important; background: transparent !important; border: 0 !important; box-shadow: none !important; overflow: visible !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) > .battle-libraries.battle-libraries > button.library-action.library-action { position: relative !important; width: 100% !important; min-width: 44px !important; max-width: 100% !important; height: var(--mtb-aux-h) !important; min-height: 44px !important; max-height: var(--mtb-aux-h) !important; margin: 0 !important; padding: 0 !important; border-radius: 7px !important; background-position: center !important; background-size: cover !important; overflow: hidden !important; touch-action: manipulation !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) > .battle-libraries.battle-libraries > button.library-action.library-action > span { left: 2px !important; right: 2px !important; bottom: 2px !important; max-width: calc(100% - 4px) !important; padding: 1px 2px !important; font-size: clamp(6.5px, 2vw, 8.5px) !important; line-height: 1 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } /* Utility wrapper must not create another competing layout row. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) > .utility.utility { position: static !important; inset: auto !important; width: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important; display: contents !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) > .utility.utility > #showRulesBattle { position: fixed !important; z-index: 1900 !important; left: calc(var(--mtb-edge) + var(--mtb-library-w) + 4px) !important; right: auto !important; top: auto !important; bottom: var(--mtb-safe-bottom) !important; width: clamp(48px, 16vw, 70px) !important; min-width: 44px !important; max-width: 70px !important; height: var(--mtb-aux-h) !important; min-height: 44px !important; max-height: var(--mtb-aux-h) !important; margin: 0 !important; padding: 0 4px !important; display: grid !important; place-items: center !important; border-radius: 8px !important; font-size: clamp(8px, 2.4vw, 10px) !important; line-height: 1 !important; touch-action: manipulation !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) > .utility.utility > #leaveRoom { position: fixed !important; z-index: 2100 !important; left: var(--mtb-edge) !important; right: auto !important; top: var(--mtb-safe-top) !important; bottom: auto !important; width: 46px !important; min-width: 44px !important; max-width: 46px !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; margin: 0 !important; padding: 0 3px !important; display: grid !important; place-items: center !important; border-radius: 9px !important; font-size: 8px !important; line-height: 1.05 !important; touch-action: manipulation !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) > .utility.utility > #rematch[hidden] { display: none !important; } /* Battle report is always reachable; its panel becomes a proper bottom drawer. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleLogToggle#battleLogToggle#battleLogToggle#battleLogToggle.battle-log-toggle:not([hidden]) { position: fixed !important; z-index: 2100 !important; right: var(--mtb-edge) !important; left: auto !important; top: var(--mtb-safe-top) !important; bottom: auto !important; width: 46px !important; min-width: 44px !important; max-width: 46px !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; margin: 0 !important; padding: 0 2px !important; display: grid !important; place-items: center !important; border-radius: 9px !important; background: rgba(8, 24, 36, 0.94) !important; border: 1px solid rgba(124, 208, 225, 0.55) !important; color: transparent !important; -webkit-text-fill-color: transparent !important; font-size: 0 !important; box-shadow: 0 5px 13px rgba(0, 0, 0, 0.28) !important; transform: none !important; touch-action: manipulation !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleLogToggle#battleLogToggle#battleLogToggle#battleLogToggle.battle-log-toggle:not([hidden])::before { content: "关闭" !important; color: #e5f8ff !important; -webkit-text-fill-color: #e5f8ff !important; font-size: 9px !important; font-weight: 900 !important; line-height: 1 !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]).battle-log-collapsed #battleLogToggle#battleLogToggle#battleLogToggle#battleLogToggle.battle-log-toggle:not([hidden])::before { content: "战报" !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden]) { position: fixed !important; z-index: 2600 !important; inset: auto 0 0 0 !important; width: 100vw !important; min-width: 0 !important; max-width: 100vw !important; height: min(62dvh, 520px) !important; min-height: min(280px, 48dvh) !important; max-height: 72dvh !important; margin: 0 !important; padding: 14px 10px max(10px, env(safe-area-inset-bottom)) !important; box-sizing: border-box !important; display: block !important; border: 1px solid rgba(136, 206, 220, 0.48) !important; border-bottom: 0 !important; border-radius: 18px 18px 0 0 !important; background: rgba(5, 14, 23, 0.98) !important; box-shadow: 0 -18px 48px rgba(0, 0, 0, 0.48) !important; opacity: 1 !important; visibility: visible !important; overflow: hidden !important; transform: translateY(0) !important; transition: transform 190ms ease, opacity 160ms ease !important; pointer-events: auto !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]).battle-log-collapsed #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden]) { display: block !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transform: translateY(calc(100% + 18px)) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden])::before { content: "" !important; position: absolute !important; z-index: 3 !important; top: 6px !important; left: 50% !important; width: 42px !important; height: 4px !important; border-radius: 999px !important; background: rgba(181, 222, 231, 0.55) !important; transform: translateX(-50%) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden]) > section:first-child { width: 100% !important; height: 100% !important; min-height: 0 !important; margin: 0 !important; padding: 4px 0 0 !important; display: grid !important; grid-template-rows: auto minmax(0, 1fr) !important; gap: 6px !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden]) .battle-status, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden]) > section.rules { display: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden]) h2 { margin: 0 !important; padding: 0 4px !important; font-size: 14px !important; line-height: 24px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden]) #log.log { width: 100% !important; min-height: 0 !important; max-height: none !important; margin: 0 !important; padding: 6px !important; overflow-x: hidden !important; overflow-y: auto !important; overscroll-behavior: contain !important; -webkit-overflow-scrolling: touch !important; } /* Player details reuse the existing inspect dialog as a bottom sheet. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #skillInspectDialog#skillInspectDialog.rules-dialog.skill-inspect-dialog:not([hidden]) { position: fixed !important; z-index: 3000 !important; inset: 0 !important; width: 100vw !important; height: 100vh !important; height: 100dvh !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; display: grid !important; align-items: end !important; justify-items: center !important; background: rgba(0, 5, 10, 0.62) !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #skillInspectDialog#skillInspectDialog.rules-dialog.skill-inspect-dialog[hidden] { display: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #skillInspectDialog#skillInspectDialog #skillInspectBox#skillInspectBox.skill-inspect-box { position: relative !important; inset: auto !important; width: min(100vw, 720px) !important; min-width: 0 !important; max-width: 100vw !important; height: auto !important; min-height: min(420px, 58dvh) !important; max-height: 86dvh !important; margin: 0 !important; padding: 14px 10px max(12px, env(safe-area-inset-bottom)) !important; box-sizing: border-box !important; display: grid !important; grid-template-columns: minmax(86px, 30vw) minmax(0, 1fr) !important; grid-template-rows: auto auto !important; grid-template-areas: "art copy" "details details" !important; gap: 10px !important; border: 1px solid rgba(147, 215, 225, 0.52) !important; border-bottom: 0 !important; border-radius: 20px 20px 0 0 !important; background: rgba(7, 17, 27, 0.985) !important; box-shadow: 0 -22px 60px rgba(0, 0, 0, 0.54) !important; overflow-x: hidden !important; overflow-y: auto !important; overscroll-behavior: contain !important; -webkit-overflow-scrolling: touch !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #skillInspectBox#skillInspectBox > #skillInspectArt.preview-art { grid-area: art !important; width: 100% !important; min-width: 0 !important; height: clamp(126px, 29dvh, 230px) !important; min-height: 126px !important; max-height: 230px !important; margin: 0 !important; border-radius: 12px !important; background-size: cover !important; background-position: center 20% !important; overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #skillInspectBox#skillInspectBox > .preview-copy { grid-area: copy !important; min-width: 0 !important; margin: 0 !important; padding: 34px 2px 0 !important; display: grid !important; align-content: start !important; gap: 6px !important; overflow: visible !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #skillInspectBox#skillInspectBox > .preview-copy :is(h2, .preview-title, #skillInspectTitle, #skillInspectDescription) { max-width: 100% !important; white-space: normal !important; overflow-wrap: anywhere !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #skillInspectBox#skillInspectBox > #closeSkillInspect.skill-inspect-close { position: absolute !important; z-index: 10 !important; top: 8px !important; right: 8px !important; width: 52px !important; min-width: 44px !important; height: 44px !important; min-height: 44px !important; margin: 0 !important; padding: 0 5px !important; display: grid !important; place-items: center !important; border-radius: 9px !important; font-size: 10px !important; line-height: 1 !important; touch-action: manipulation !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #skillInspectBox#skillInspectBox > #playerInspectDetails.player-inspect-details { grid-area: details !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 7px !important; overflow: visible !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-vitals { grid-column: 1 / -1 !important; width: 100% !important; min-width: 0 !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 4px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-metric { min-width: 0 !important; min-height: 40px !important; padding: 5px !important; display: grid !important; place-items: center !important; gap: 2px !important; border: 1px solid rgba(148, 198, 211, 0.25) !important; border-radius: 8px !important; background: rgba(18, 36, 48, 0.72) !important; text-align: center !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-metric :is(small, b) { min-width: 0 !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; font-size: 9px !important; line-height: 1 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-section { min-width: 0 !important; margin: 0 !important; padding: 7px !important; border: 1px solid rgba(145, 194, 207, 0.22) !important; border-radius: 10px !important; background: rgba(11, 27, 39, 0.76) !important; overflow: visible !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-section :is(h3, p) { margin: 0 0 5px !important; font-size: 10px !important; line-height: 1.25 !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-card-list { width: 100% !important; min-width: 0 !important; margin: 7px 0 0 !important; padding: 0 !important; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 5px !important; color: rgba(232, 244, 249, 0.9) !important; overflow: visible !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-card-list > article { width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 7px 8px !important; box-sizing: border-box !important; display: grid !important; gap: 3px !important; border: 1px solid rgba(144, 196, 211, 0.22) !important; border-radius: 8px !important; background: rgba(4, 14, 23, 0.76) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-card-list > article > strong, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-card-list > article > p, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-card-list > .player-inspect-empty { min-width: 0 !important; max-width: 100% !important; margin: 0 !important; color: #eef9fd !important; -webkit-text-fill-color: #eef9fd !important; font-size: 10px !important; line-height: 1.38 !important; white-space: normal !important; overflow-wrap: anywhere !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-card-list > article > p, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-card-list > .player-inspect-empty { color: rgba(216, 234, 241, 0.78) !important; -webkit-text-fill-color: rgba(216, 234, 241, 0.78) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-statuses { width: 100% !important; min-width: 0 !important; max-height: none !important; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 4px !important; overflow: visible !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-statuses .status-token, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-equipment .equipment-slot, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails #playerInspectLandmark.player-inspect-landmark { min-width: 44px !important; min-height: 44px !important; touch-action: manipulation !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-equipment { width: 100% !important; min-width: 0 !important; display: grid !important; grid-template-columns: repeat(3, minmax(44px, 1fr)) !important; gap: 5px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails #playerInspectLandmark.player-inspect-landmark { width: 100% !important; max-width: 100% !important; height: auto !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-landmark-copy.player-inspect-landmark-copy { width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 7px 0 0 !important; padding: 7px 8px !important; box-sizing: border-box !important; border: 1px solid rgba(144, 196, 211, 0.2) !important; border-radius: 8px !important; background: rgba(4, 14, 23, 0.72) !important; color: rgba(228, 242, 247, 0.9) !important; -webkit-text-fill-color: rgba(228, 242, 247, 0.9) !important; font-size: 10px !important; line-height: 1.42 !important; white-space: normal !important; overflow-wrap: anywhere !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-landmark-use.player-inspect-landmark-use:not([hidden]) { width: 100% !important; min-width: 44px !important; max-width: 100% !important; height: auto !important; min-height: 44px !important; margin: 7px 0 0 !important; padding: 8px 10px !important; display: grid !important; place-items: center !important; border: 1px solid rgba(255, 221, 116, 0.58) !important; border-radius: 9px !important; background: linear-gradient(180deg, rgba(104, 77, 25, 0.94), rgba(60, 41, 13, 0.96)) !important; color: #fff5cf !important; -webkit-text-fill-color: #fff5cf !important; font-size: 11px !important; font-weight: 900 !important; line-height: 1.2 !important; text-align: center !important; white-space: normal !important; overflow-wrap: anywhere !important; touch-action: manipulation !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-landmark-use.player-inspect-landmark-use:disabled { border-color: rgba(151, 170, 180, 0.28) !important; background: rgba(43, 53, 61, 0.84) !important; color: rgba(222, 231, 235, 0.58) !important; -webkit-text-fill-color: rgba(222, 231, 235, 0.58) !important; opacity: 1 !important; } /* Keep the settings affordance inside the auxiliary row's reserved right edge. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) > #settingsToggle#settingsToggle.settings-toggle { z-index: 1950 !important; right: var(--mtb-edge) !important; bottom: var(--mtb-safe-bottom) !important; width: 46px !important; min-width: 46px !important; max-width: 46px !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; } } /* Narrow phones retain labels, but spend every spare pixel on state rather than chrome. */ @media (max-width: 359px) { html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]):has( #appRoot.app:is(.team-battle-app, .identity-battle-app) #battle.battle:not([hidden]) ) { --mtb-edge: 3px; --mtb-gap: 2px; --mtb-library-w: 118px; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState.battle-command-state { padding-inline: 49px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState .battle-command-state-copy small, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState .battle-command-state-readiness > b { display: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="teams"] > .seat-fighter .team-info.team-info { padding: 2px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-stat .stat-label, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing > .seat-fighter .team-stat .stat-value { font-size: 5.5px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #skillInspectBox#skillInspectBox > #playerInspectDetails.player-inspect-details, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #playerInspectDetails#playerInspectDetails .player-inspect-vitals { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } /* Very short portrait devices keep all ten identity rows by tightening, never scrolling. */ @media (max-width: 720px) and (max-height: 680px) and (orientation: portrait) { html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-info.team-info { grid-template-rows: 17px minmax(20px, 1fr) 12px 11px 12px !important; padding: 1px !important; gap: 0 !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-info > header { height: 17px !important; min-height: 17px !important; max-height: 17px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-status-bar.team-status-bar { height: 12px !important; min-height: 12px !important; max-height: 12px !important; padding: 0 !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-status-bar .status-token { height: 12px !important; min-height: 12px !important; max-height: 12px !important; padding: 0 1px !important; font-size: 5.5px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-equipment.team-equipment, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-equipment .equipment-slot { height: 11px !important; min-height: 11px !important; max-height: 11px !important; padding: 0 !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="identity"] > .seat-fighter .team-choice.team-choice { height: 12px !important; min-height: 12px !important; max-height: 12px !important; padding: 0 1px !important; font-size: 5.8px !important; line-height: 12px !important; } } /* Phone landscape: keep both team rows; rotate identity into five columns by two rows. */ @media (orientation: landscape) and (max-height: 520px) and (max-width: 960px) { html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]):has( #appRoot.app:is(.team-battle-app, .identity-battle-app) #battle.battle:not([hidden]) ) { --mtb-command-h: 44px; --mtb-action-h: 48px; --mtb-board-top: calc(var(--mtb-safe-top) + 48px); --mtb-action-bottom: calc(var(--mtb-safe-bottom) + 48px); --mtb-board-bottom: calc(var(--mtb-action-bottom) + 52px); --mtb-library-w: clamp(124px, 25vw, 190px); } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState.battle-command-state { height: 44px !important; min-height: 44px !important; max-height: 44px !important; grid-template-rows: 18px 12px 3px !important; padding-block: 3px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleCommandState#battleCommandState#battleCommandState .battle-command-state-copy small { display: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; grid-template-rows: repeat(2, minmax(0, 1fr)) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="teams"] > .seat-fighter .team-art.team-art { inset: 0 auto 0 0 !important; width: 36% !important; min-width: 36% !important; max-width: 36% !important; height: 100% !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="teams"] > .seat-fighter .team-info.team-info { inset: 0 0 0 36% !important; width: auto !important; height: 100% !important; grid-template-rows: 20px minmax(10px, 1fr) 28px 17px 15px 16px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing[data-layout="teams"] > .seat-fighter .team-skill.team-skill { inset: auto auto 2px 2px !important; width: calc(36% - 4px) !important; min-width: 44px !important; max-width: calc(36% - 4px) !important; height: 44px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) #cards#cards#cards#cards#cards#cards.cards.cards, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle.battle:not([hidden]) #cards#cards#cards#cards#cards#cards.cards.cards > button.action-card.action-card { height: 48px !important; min-height: 44px !important; max-height: 48px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden]) { inset: 0 0 0 auto !important; width: min(70vw, 430px) !important; min-width: min(320px, 70vw) !important; max-width: 70vw !important; height: 100dvh !important; min-height: 100dvh !important; max-height: 100dvh !important; border-radius: 16px 0 0 16px !important; transform: translateX(0) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]).battle-log-collapsed #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden]) { transform: translateX(calc(100% + 18px)) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #skillInspectDialog#skillInspectDialog #skillInspectBox#skillInspectBox.skill-inspect-box { max-height: 94dvh !important; grid-template-columns: 122px minmax(0, 1fr) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #skillInspectBox#skillInspectBox > #skillInspectArt.preview-art { height: min(58dvh, 224px) !important; } } /* The legacy identity arena injects a decorative core and two oversized ring pseudo-elements. They are presentation-only and must not create a hidden scroll area around the mobile seat grid. */ @media (max-width: 720px), (orientation: landscape) and (max-height: 520px) and (max-width: 960px) { html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring::before, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring::after { content: none !important; display: none !important; position: static !important; inset: auto !important; width: 0 !important; height: 0 !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring > .seat-ring-core.seat-ring-core { display: none !important; position: static !important; inset: auto !important; width: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important; transform: none !important; pointer-events: none !important; } } /* Last-mile overflow and intrinsic-size guards discovered by real-device QA. */ @media (max-width: 720px), (orientation: landscape) and (max-height: 520px) and (max-width: 960px) { html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #cards#cards#cards#cards#cards#cards#cards#cards.cards.cards { inline-size: calc(100vw - (var(--mtb-edge) * 2)) !important; width: calc(100vw - (var(--mtb-edge) * 2)) !important; min-width: 0 !important; max-width: calc(100vw - (var(--mtb-edge) * 2)) !important; aspect-ratio: auto !important; place-self: auto stretch !important; justify-self: stretch !important; align-self: auto !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #cards#cards#cards#cards#cards#cards#cards#cards.cards.cards > button.action-card.action-card { inline-size: 100% !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; aspect-ratio: auto !important; place-self: stretch !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] > .seat-fighter.seat-fighter .team-info > header :is(strong, .player-name-text) { font-size: clamp(7.5px, 2.2vw, 9px) !important; line-height: 1 !important; } /* Xiaocai's desktop ten-token rail becomes one compact numeric summary. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring > .seat-fighter.seat-fighter:has(> .xiaocai-fel-rail) { overflow: hidden !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring > .seat-fighter.seat-fighter > .xiaocai-fel-rail.xiaocai-fel-rail { position: absolute !important; z-index: 10 !important; inset: auto 48px 2px auto !important; left: auto !important; right: 48px !important; top: auto !important; bottom: 2px !important; width: 36px !important; min-width: 36px !important; max-width: 36px !important; height: 15px !important; min-height: 15px !important; max-height: 15px !important; margin: 0 !important; padding: 1px 3px !important; box-sizing: border-box !important; display: grid !important; place-items: center !important; gap: 0 !important; border: 1px solid rgba(145, 235, 168, 0.52) !important; border-radius: 999px !important; background: rgba(7, 39, 31, 0.9) !important; box-shadow: none !important; overflow: hidden !important; opacity: 1 !important; visibility: visible !important; translate: none !important; transform: none !important; pointer-events: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring > .seat-fighter.seat-fighter > .xiaocai-fel-rail.xiaocai-fel-rail > :is(.xiaocai-fel-label, .xiaocai-fel-stack) { display: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring > .seat-fighter.seat-fighter > .xiaocai-fel-rail.xiaocai-fel-rail > .xiaocai-fel-value.xiaocai-fel-value { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: auto !important; min-height: 0 !important; max-height: 13px !important; margin: 0 !important; color: #eaffb6 !important; -webkit-text-fill-color: #eaffb6 !important; font-size: 7.5px !important; font-weight: 950 !important; line-height: 1 !important; text-align: center !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: clip !important; } } @media (prefers-reduced-motion: reduce) { html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel.side, html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #skillInspectDialog#skillInspectDialog .skill-inspect-box { animation: none !important; transition: none !important; } } /* * Final geometry lock. Several historical multiplayer layers carry four-ID * selectors plus !important, so every critical phone geometry rule below owns * the full app > battle > board > ring chain. Keep this block last. */ @media (max-width: 720px), (orientation: landscape) and (max-height: 520px) and (max-width: 960px) { html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]):has( #appRoot.app:is(.team-battle-app, .identity-battle-app) #battle.battle:not([hidden]) ) { width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 100% !important; min-height: 100dvh !important; max-height: 100dvh !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; translate: none !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) { position: fixed !important; inset: 0 !important; width: 100vw !important; min-width: 100vw !important; max-width: 100vw !important; height: 100vh !important; height: 100dvh !important; min-height: 100dvh !important; max-height: 100dvh !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; translate: none !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) { position: fixed !important; inset: 0 !important; width: 100vw !important; min-width: 100vw !important; max-width: 100vw !important; height: 100vh !important; height: 100dvh !important; min-height: 100dvh !important; max-height: 100dvh !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; translate: none !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board:not([hidden]) { position: fixed !important; z-index: 20 !important; inset: var(--mtb-board-top) var(--mtb-edge) var(--mtb-board-bottom) var(--mtb-edge) !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: block !important; overflow: hidden !important; translate: none !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring { position: relative !important; inset: auto !important; left: auto !important; right: auto !important; top: auto !important; bottom: auto !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: 0 !important; box-sizing: border-box !important; display: grid !important; grid-auto-flow: row !important; grid-auto-rows: minmax(0, 1fr) !important; gap: var(--mtb-gap) !important; overflow: hidden !important; contain: layout paint !important; translate: none !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.team-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="teams"] { grid-template-columns: repeat(var(--team-columns, 3), minmax(0, 1fr)) !important; grid-template-rows: repeat(2, minmax(0, 1fr)) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; grid-template-rows: repeat(5, minmax(0, 1fr)) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring > .seat-fighter.seat-fighter { position: relative !important; inset: auto !important; left: auto !important; right: auto !important; top: auto !important; bottom: auto !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: 0 !important; box-sizing: border-box !important; display: block !important; grid-area: auto !important; grid-column: auto !important; grid-row: auto !important; place-self: stretch !important; align-self: stretch !important; justify-self: stretch !important; aspect-ratio: auto !important; overflow: hidden !important; translate: none !important; transform: none !important; } /* Reassert the portrait team card composition after the legacy list card. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.team-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="teams"] > .seat-fighter.seat-fighter > .team-art.team-art { position: absolute !important; z-index: 0 !important; inset: 0 0 92px !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: auto !important; min-height: 0 !important; max-height: none !important; border-radius: inherit !important; overflow: hidden !important; translate: none !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.team-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="teams"] > .seat-fighter.seat-fighter > .team-info.team-info { position: absolute !important; z-index: 3 !important; inset: 0 !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: 3px !important; box-sizing: border-box !important; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: 24px minmax(28px, 1fr) 30px 18px 18px 18px !important; grid-template-areas: "header" "." "vitals" "statuses" "equipment" "choice" !important; gap: 2px !important; overflow: hidden !important; translate: none !important; transform: none !important; } /* Identity must be ten equal summaries, never remnants of the oval seats. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] > .seat-fighter.seat-fighter > .team-art.team-art { position: absolute !important; z-index: 0 !important; inset: 0 auto 0 0 !important; left: 0 !important; right: auto !important; top: 0 !important; bottom: 0 !important; width: clamp(38px, 13vw, 54px) !important; min-width: clamp(38px, 13vw, 54px) !important; max-width: clamp(38px, 13vw, 54px) !important; height: 100% !important; min-height: 0 !important; max-height: 100% !important; border-radius: inherit !important; background-size: cover !important; overflow: hidden !important; translate: none !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] > .seat-fighter.seat-fighter > .team-info.team-info { --identity-art-w: clamp(38px, 13vw, 54px); position: absolute !important; z-index: 3 !important; inset: 0 0 0 var(--identity-art-w) !important; left: var(--identity-art-w) !important; right: 0 !important; top: 0 !important; bottom: 0 !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; padding: 2px !important; box-sizing: border-box !important; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: 20px minmax(25px, 1fr) 17px 15px 15px !important; grid-template-areas: "header" "vitals" "statuses" "equipment" "choice" !important; gap: 1px !important; overflow: hidden !important; translate: none !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] > .seat-fighter.seat-fighter > .identity-role-badge.identity-role-badge.compact { --identity-badge-size: 20px !important; position: absolute !important; z-index: 8 !important; inset: 23px auto auto 2px !important; left: 2px !important; right: auto !important; top: 23px !important; bottom: auto !important; width: 20px !important; min-width: 20px !important; max-width: 20px !important; height: 20px !important; min-height: 20px !important; max-height: 20px !important; margin: 0 !important; padding: 0 !important; display: grid !important; grid-template-columns: 20px !important; place-items: center !important; border: 0 !important; background: transparent !important; overflow: hidden !important; translate: none !important; transform: none !important; pointer-events: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] > .seat-fighter.seat-fighter > .identity-role-badge.identity-role-badge.compact::before { width: 20px !important; height: 20px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] > .seat-fighter.seat-fighter > .identity-role-badge.identity-role-badge.compact > span { display: none !important; } /* Full-width three-command dock in team modes too. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #cards#cards#cards#cards#cards#cards#cards#cards.cards.cards { position: fixed !important; z-index: 1800 !important; inset: auto var(--mtb-edge) var(--mtb-action-bottom) var(--mtb-edge) !important; left: var(--mtb-edge) !important; right: var(--mtb-edge) !important; top: auto !important; bottom: var(--mtb-action-bottom) !important; width: auto !important; min-width: 0 !important; max-width: none !important; height: var(--mtb-action-h) !important; min-height: 44px !important; max-height: var(--mtb-action-h) !important; margin: 0 !important; padding: 0 !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: var(--mtb-gap) !important; overflow: visible !important; scale: 1 !important; translate: none !important; transform: none !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #cards#cards#cards#cards#cards#cards#cards#cards.cards.cards > button.action-card.action-card { position: relative !important; inset: auto !important; width: 100% !important; min-width: 44px !important; max-width: 100% !important; height: var(--mtb-action-h) !important; min-height: 44px !important; max-height: var(--mtb-action-h) !important; margin: 0 !important; scale: 1 !important; translate: none !important; transform: none !important; } /* Names and exact resources remain legible at three narrow columns. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.team-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="teams"] > .seat-fighter.seat-fighter .team-info > header strong { font-size: clamp(9px, 2.7vw, 12px) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.team-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="teams"] > .seat-fighter.seat-fighter .team-mini-row.hp-mini :is(span, em), html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.team-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="teams"] > .seat-fighter.seat-fighter .team-stat :is(.stat-label, .stat-value) { font-size: clamp(7px, 2vw, 9px) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.team-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="teams"] > .seat-fighter.seat-fighter .team-status-bar .status-token { font-size: clamp(6.5px, 1.9vw, 8px) !important; } /* The close affordance must stay above the open report drawer. */ html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #battleLogToggle#battleLogToggle#battleLogToggle#battleLogToggle#battleLogToggle#battleLogToggle.battle-log-toggle:not([hidden]) { z-index: 2701 !important; translate: none !important; transform: none !important; } } @media (orientation: landscape) and (max-height: 520px) and (max-width: 960px) { html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; grid-template-rows: repeat(2, minmax(0, 1fr)) !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.team-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="teams"] > .seat-fighter.seat-fighter > .team-art.team-art { inset: 0 auto 0 0 !important; width: 36% !important; min-width: 36% !important; max-width: 36% !important; height: 100% !important; max-height: 100% !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.team-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="teams"] > .seat-fighter.seat-fighter > .team-info.team-info { inset: 0 0 0 36% !important; left: 36% !important; right: 0 !important; top: 0 !important; bottom: 0 !important; width: auto !important; height: 100% !important; padding: 3px !important; grid-template-rows: 20px 28px 17px 15px 16px !important; grid-template-areas: "header" "vitals" "statuses" "equipment" "choice" !important; gap: 2px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] > .seat-fighter.seat-fighter > .team-info.team-info { grid-template-rows: 17px 22px 12px 10px 11px !important; gap: 1px !important; padding: 2px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] > .seat-fighter.seat-fighter .team-mini-bars.team-mini-bars { height: 22px !important; min-height: 0 !important; max-height: 22px !important; grid-template-rows: 10px 11px !important; gap: 1px !important; padding: 0 !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] > .seat-fighter.seat-fighter :is(.team-mini-row.hp-mini, .team-stat-stack.team-stat-stack, .team-stat.team-stat) { height: auto !important; min-height: 0 !important; max-height: 11px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] > .seat-fighter.seat-fighter :is(.team-status-bar.team-status-bar, .team-status-bar .status-token) { height: 12px !important; min-height: 0 !important; max-height: 12px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] > .seat-fighter.seat-fighter :is(.team-equipment.team-equipment, .team-equipment .equipment-slot) { height: 10px !important; min-height: 0 !important; max-height: 10px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app.identity-battle-app #battle#battle#battle#battle#battle#battle#battle#battle.battle.identity-battle:not([hidden]) #teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard#teamBoard.team-board #seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing#seatRing.seat-ring[data-layout="identity"] > .seat-fighter.seat-fighter .team-choice.team-choice { height: 11px !important; min-height: 0 !important; max-height: 11px !important; padding: 0 1px !important; line-height: 11px !important; } html body:not(.maintenance-mode).battle-controls-active:is([data-battle-load="team"], [data-battle-load="crowded"]) #appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot#appRoot.app:is(.team-battle-app, .identity-battle-app) #sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel#sidePanel.side:not([hidden]) h2 { padding-right: 58px !important; } }