#match-report:has(#stats-mode-tabs:not([hidden])) {
  padding-block: clamp(10px, 1.8vh, 18px);
  gap: clamp(8px, 1.4vh, 14px);
}
#match-report:has(#stats-mode-tabs:not([hidden])) .report-scoreboard {
  padding-bottom: 12px;
}
#match-report:has(#stats-mode-tabs:not([hidden])) .report-score {
  gap: 12px;
}
#match-report:has(#stats-mode-tabs:not([hidden])) .stats-mode-tabs button {
  padding-block: 7px;
}
#match-report:has(#stats-mode-tabs:not([hidden]))
  :is(.report-player, .report-center) {
  padding: clamp(10px, 1.6vh, 16px);
}
#match-report:has(#stats-mode-tabs:not([hidden]))
  :is(.panel-heading, .report-center-heading) {
  padding-bottom: 8px;
}
#match-report:has(#stats-mode-tabs:not([hidden])) .panel-heading {
  margin-bottom: 6px;
}
#match-report:has(#stats-mode-tabs:not([hidden])) .report-stat-row {
  padding-block: clamp(4px, 0.8vh, 10px);
}
#match-report:has(#stats-mode-tabs:not([hidden])) #report-description {
  margin-block: 10px;
}
#match-report:has(#stats-mode-tabs:not([hidden])) .empty-record {
  padding-block: 20px;
}
#match-report:has(#stats-mode-tabs:not([hidden])) .report-actions button {
  padding-block: 10px;
}
@media (min-width: 601px) {
  #match-report:has(#stats-mode-tabs:not([hidden])) > :not(.report-columns) {
    flex-shrink: 0;
  }
  #match-report:has(#stats-mode-tabs:not([hidden])) .report-columns {
    min-height: min-content;
    max-height: none;
  }
}
#cod-lobby[data-layout="compact"] {
  position: fixed;
  height: 100dvh;
  overflow: hidden;
  padding: clamp(12px, 2.4vh, 26px) 5vw;
  gap: clamp(8px, 1.8vh, 18px);
}
#cod-lobby[data-layout="compact"] :is(#lobby-briefing-view, .lobby-page) {
  flex: 1 1 0;
  min-height: 0;
  flex-direction: column;
  justify-content: flex-start;
  gap: clamp(10px, 2vh, 20px);
  margin: 0 auto;
}
#cod-lobby[data-layout="compact"] .setup-heading {
  flex: 0 0 auto;
}
#cod-lobby[data-layout="compact"] .setup-grid {
  flex: 1 1 0;
  min-height: 0;
  grid-template-rows: minmax(0, 1fr);
  gap: 24px;
}
#cod-lobby[data-layout="compact"] :is(.setup-panel, .setup-poster) {
  min-height: 0;
  min-width: 0;
  padding: clamp(14px, 2.6vh, 28px);
}
#cod-lobby[data-layout="compact"] .setup-panel {
  gap: clamp(8px, 1.6vh, 16px);
}
#cod-lobby[data-layout="compact"] .panel-heading {
  flex-shrink: 0;
  padding-bottom: 10px;
}
#cod-lobby[data-layout="compact"] .setup-rule-strip {
  flex-shrink: 0;
  margin-top: 0;
}
#cod-lobby[data-layout="compact"] .rally-race-format {
  margin: 0;
  gap: 10px;
}
#cod-lobby[data-layout="compact"] button:focus-visible {
  outline: 2px solid var(--rally-sky);
  outline-offset: 3px;
}
#cod-lobby[data-layout="compact"] :is(#info-controls, #info-rules) {
  flex: 1 1 0;
  min-height: 0;
  max-height: none;
  overflow-y: auto;
}
#cod-lobby[data-layout="compact"] :is(#info-controls, #info-rules)[hidden] {
  display: none;
}
#cod-lobby[data-layout="compact"] .arena-footer {
  flex-shrink: 0;
}
#cod-lobby[data-layout="compact"] #lobby-hero-view {
  flex: 1 1 0;
  margin: 0 auto;
  justify-content: center;
}
#cod-lobby[data-layout="compact"] .arena-grid {
  min-height: 0;
  grid-template-rows: minmax(100px, 2fr) minmax(55px, 1fr) minmax(55px, 1fr);
  flex: 1;
  max-height: 520px;
}
@media (max-width: 900px) {
  #cod-lobby[data-layout="compact"] .bp-mode-card strong {
    font-size: 23px;
  }
  #cod-lobby[data-layout="compact"] .match-length-buttons button {
    font-size: 15px;
  }
}
#cod-lobby[data-layout="compact"] .settings-panel > * {
  flex-shrink: 0;
}
#cod-lobby[data-layout="compact"] .settings-panel .setup-rule-strip {
  margin-top: auto;
}
@media (max-height: 740px) {
  #cod-lobby[data-layout="compact"] .settings-panel {
    gap: 8px;
  }
  #cod-lobby[data-layout="compact"] .settings-panel .performance-setting {
    padding: 8px 0;
  }
  #cod-lobby[data-layout="compact"]
    .settings-panel
    .quality-cards
    .bp-gfx-card {
    padding: 8px 6px;
  }
  #cod-lobby[data-layout="compact"] .settings-panel .audio-settings {
    grid-template-columns: 1fr 1fr;
  }
  #cod-lobby[data-layout="compact"] .settings-panel .audio-settings button {
    padding: 8px 6px;
  }
}
@media (max-height: 520px) and (min-width: 601px) {
  #cod-lobby[data-layout="compact"] .settings-panel {
    gap: 5px;
  }
  #cod-lobby[data-layout="compact"] .settings-panel .performance-setting {
    padding: 5px 0;
  }
  #cod-lobby[data-layout="compact"]
    .settings-panel
    .quality-cards
    .bp-gfx-card {
    padding: 6px 4px;
  }
  #cod-lobby[data-layout="compact"] .settings-panel .audio-settings button {
    padding: 5px 4px;
  }
}
@media (max-width: 600px) {
  #cod-lobby[data-layout="compact"] {
    padding: max(12px, env(safe-area-inset-top)) 18px
      max(10px, env(safe-area-inset-bottom));
    gap: 10px;
  }
  #cod-lobby[data-layout="compact"] .setup-heading {
    display: flex;
    align-items: center;
    gap: 12px;
  }
  #cod-lobby[data-layout="compact"] .setup-heading .text-button {
    margin: 0;
    font-size: 8px;
    max-width: 85px;
  }
  #cod-lobby[data-layout="compact"] .setup-heading h1 {
    font-size: 25px;
  }
  #cod-lobby[data-layout="compact"] .setup-heading .eyebrow {
    font-size: 8px;
  }
  #cod-lobby[data-layout="compact"] .setup-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) auto;
    gap: 12px;
  }
  #cod-lobby[data-layout="compact"] :is(.setup-panel, .setup-poster) {
    padding: 12px;
  }
  #cod-lobby[data-layout="compact"] .setup-panel {
    gap: 8px;
  }
  #cod-lobby[data-layout="compact"] .setup-panel > .setup-rule-strip {
    display: none;
  }
  #cod-lobby[data-layout="compact"] .opponent-icon {
    font-size: 26px;
  }
  #cod-lobby[data-layout="compact"] .bp-mode-card {
    padding: 12px 10px;
    gap: 5px;
  }
  #cod-lobby[data-layout="compact"] .bp-mode-card small {
    font-size: 9px;
  }
  #cod-lobby[data-layout="compact"] .selection-marker {
    margin-top: 3px;
  }
  #cod-lobby[data-layout="compact"] .setup-poster .poster-top,
  #cod-lobby[data-layout="compact"] .setup-poster .poster-copy h2,
  #cod-lobby[data-layout="compact"] .setup-poster .poster-copy p {
    display: none;
  }
  #cod-lobby[data-layout="compact"] .poster-copy > small {
    margin-top: 8px;
    font-size: 7px;
    letter-spacing: 1px;
  }
  #cod-lobby[data-layout="compact"] .bp-deploy-btn {
    padding: 11px 14px;
    font-size: 20px;
  }
  #cod-lobby[data-layout="compact"] .finish-cards {
    margin-top: 0;
  }
  #cod-lobby[data-layout="compact"] .finish-cards .bp-swatch-item {
    padding: 6px 2px;
  }
  #cod-lobby[data-layout="compact"] .finish-color {
    width: 24px;
    height: 24px;
    margin-bottom: 5px;
  }
  #cod-lobby[data-layout="compact"] .info-poster {
    display: none;
  }
  #cod-lobby[data-layout="compact"] #lobby-info-view .setup-grid {
    grid-template-rows: minmax(0, 1fr);
  }
  #cod-lobby[data-layout="compact"] .arena-grid {
    grid-template-rows: minmax(130px, 2fr) repeat(3, minmax(60px, 1fr));
  }
  #cod-lobby[data-layout="compact"] .arena-tile {
    padding: 12px;
  }
  #cod-lobby[data-layout="compact"] .hero-tile-copy strong {
    font-size: 48px;
  }
  #cod-lobby[data-layout="compact"] .hero-tile-copy > span {
    padding: 8px 0;
  }
  #cod-lobby[data-layout="compact"] .arena-tile strong {
    font-size: 25px;
  }
  #cod-lobby[data-layout="compact"] .info-control-row strong {
    font-size: 13px;
  }
}
@media (max-height: 740px) {
  #cod-lobby[data-layout="compact"] .bp-mode-card {
    padding: 10px;
  }
  #cod-lobby[data-layout="compact"] .opponent-icon {
    font-size: 26px;
  }
  #cod-lobby[data-layout="compact"] .poster-copy h2 {
    font-size: 32px;
  }
  #cod-lobby[data-layout="compact"] .poster-copy p {
    margin: 8px 0;
  }
  #cod-lobby[data-layout="compact"] .rally-race-format {
    gap: 6px;
  }
}
@media (max-height: 520px) and (min-width: 601px) {
  #cod-lobby[data-layout="compact"] {
    gap: 6px;
    padding: 10px 4vw;
  }
  #cod-lobby[data-layout="compact"] .setup-heading .eyebrow {
    display: none;
  }
  #cod-lobby[data-layout="compact"] .setup-heading h1 {
    font-size: 24px;
  }
  #cod-lobby[data-layout="compact"] .setup-panel {
    gap: 6px;
    padding: 10px;
  }
  #cod-lobby[data-layout="compact"] .setup-panel > .setup-rule-strip {
    display: none;
  }
  #cod-lobby[data-layout="compact"] .poster-copy h2 {
    font-size: 26px;
  }
}
@media (max-height: 520px) and (min-width: 601px) {
  #cod-lobby[data-layout="compact"] .bp-header-strip {
    position: absolute;
    top: 10px;
    left: 4vw;
    width: 92vw;
    pointer-events: none;
  }
  #cod-lobby[data-layout="compact"] .bp-header-strip button {
    pointer-events: auto;
  }
  #cod-lobby[data-layout="compact"] .arena-tabs {
    align-self: center;
  }
  #cod-lobby[data-layout="compact"] .brand-word {
    font-size: 12px;
  }
  #cod-lobby[data-layout="compact"] .brand-word b {
    font-size: 16px;
  }
  #cod-lobby[data-layout="compact"] .bp-brand-dock {
    gap: 6px;
  }
  #cod-lobby[data-layout="compact"] .brand-ball {
    width: 28px;
    height: 28px;
    font-size: 18px;
  }
  #cod-lobby[data-layout="compact"] .bp-header-icon-btn {
    padding: 5px;
    font-size: 7px;
  }
  #cod-lobby[data-layout="compact"] .bp-header-icon-btn svg {
    width: 12px;
    height: 12px;
  }
  #cod-lobby[data-layout="compact"] .arena-tabs button {
    padding: 7px 12px;
    font-size: 14px;
  }
  #cod-lobby[data-layout="compact"] :is(.bp-quick-dock, .bp-brand-dock) {
    max-width: 180px;
  }
  #cod-lobby[data-layout="compact"] .setup-heading {
    display: none;
  }
  #cod-lobby[data-layout="compact"] .setup-grid {
    gap: 14px;
  }
  #cod-lobby[data-layout="compact"] .opponent-icon,
  #cod-lobby[data-layout="compact"] .selection-marker {
    display: none;
  }
  #cod-lobby[data-layout="compact"] .bp-mode-card {
    gap: 3px;
    padding: 8px;
  }
  #cod-lobby[data-layout="compact"] .match-length-buttons button {
    padding: 8px 4px;
  }
  #cod-lobby[data-layout="compact"] .difficulty-row {
    margin-top: 5px;
  }
  #cod-lobby[data-layout="compact"] .bp-diff-pill {
    padding: 6px;
  }
  #cod-lobby[data-layout="compact"] .info-tabs button {
    padding: 6px;
    font-size: 14px;
  }
  #cod-lobby[data-layout="compact"] .quality-cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  #cod-lobby[data-layout="compact"] .setup-panel .audio-settings {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 600px) and (max-height: 640px) {
  #cod-lobby[data-layout="compact"] .setup-heading {
    display: none;
  }
  #cod-lobby[data-layout="compact"] .setup-poster {
    padding: 8px;
  }
  #cod-lobby[data-layout="compact"] .bp-deploy-btn {
    padding: 8px 12px;
  }
  #cod-lobby[data-layout="compact"] .poster-copy > small {
    margin-top: 5px;
  }
}
#cod-lobby .match-length-buttons {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
#cod-lobby .match-length-buttons button {
  border: 1px solid #d4b79a;
  border-radius: 0;
  background: #f3e2c8;
  color: var(--rally-ink);
  box-shadow: none;
  font:
    800 17px/1.15 "Barlow Condensed",
    sans-serif;
  letter-spacing: 0.5px;
  padding: 15px 8px;
  cursor: pointer;
  transition:
    background 0.18s,
    color 0.18s;
}
#cod-lobby .match-length-buttons small {
  display: block;
  font:
    700 8px/1.5 "Space Grotesk",
    sans-serif;
  margin-top: 6px;
}
#cod-lobby .match-length-buttons button.active,
#cod-lobby .match-length-buttons button:hover {
  background: var(--rally-orange);
  border-color: var(--rally-orange);
  color: var(--rally-cream);
}
#cod-lobby button:focus-visible {
  outline: 2px solid var(--rally-sky);
  outline-offset: 3px;
}
#cod-lobby[data-layout="classic"] #lobby-briefing-view {
  flex-direction: column;
  min-height: min-content;
}
#cod-lobby[data-layout="classic"] .lobby-page {
  min-height: min-content;
}
#cod-lobby[data-layout="classic"] .rally-race-format {
  margin: 18px 0;
}
@media (max-width: 900px) {
  #cod-lobby .match-length-buttons button {
    font-size: 15px;
    padding: 12px 6px;
  }
}
@media (max-width: 600px) {
  #cod-lobby .match-length-buttons {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-height: 600px) and (min-width: 601px) {
  #cod-lobby .match-length-buttons button {
    font-size: 15px;
    padding: 10px 6px;
  }
}