/* Desktop lobby only. Navigation, identities and phone layout retain their existing styles. */
/* The shared navigation keeps the return action available outside the lobby. */
body.view-lobby-view #nav-lobby-return { display: none !important; }

@media (min-width: 1000px) {
  body.view-lobby-view #lobby-view > .lobby-main {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    align-items: stretch;
  }
  body.view-lobby-view #lobby-view > .lobby-main > :is(
    .lobby-handicap-panel, .mobile-lobby-modules, .lobby-lower-grid, .lobby-filing-footer
  ) {
    grid-column: 1 / -1;
  }
  body.view-lobby-view #lobby-view > .lobby-main > .lobby-lower-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: auto;
    min-height: 0;
    gap: 14px;
    align-items: stretch;
  }
  body.view-lobby-view #lobby-view > .lobby-main > .featured-kifu-card {
    grid-column: 1;
    min-width: 0;
  }
  body.view-lobby-view #lobby-view > .lobby-main > .lobby-chat-panel {
    grid-column: 2;
    display: flex;
    flex-direction: column;
    min-width: 0;
  }
  body.view-lobby-view .lobby-lower-grid .lobby-card-head {
    flex-wrap: wrap;
  }
  body.view-lobby-view .lobby-lower-grid .leaderboard-tabs {
    flex-wrap: wrap;
  }
  body.view-lobby-view .lobby-lower-grid #leaderboard-list {
    max-height: 220px;
    overflow-y: auto;
  }
  body.view-lobby-view .lobby-lower-grid .live-games-list {
    max-height: 240px;
    min-width: 0;
  }
  body.view-lobby-view .lobby-lower-grid .live-game-row {
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 6px;
  }
  body.view-lobby-view .featured-kifu-card #featured-kifu-list {
    max-height: 260px;
    overflow-y: auto;
    min-width: 0;
  }
  body.view-lobby-view .featured-kifu-card .featured-kifu-row {
    grid-template-columns: 42px minmax(0, 1fr);
  }
  body.view-lobby-view .featured-kifu-card .featured-kifu-row :is(strong, em) {
    overflow-wrap: anywhere;
  }
  body.view-lobby-view #lobby-view > .lobby-main > .lobby-chat-panel .chat-box {
    flex: 1;
    height: auto;
    min-height: 86px;
    max-height: 260px;
    overflow-y: auto;
  }
  body.view-lobby-view #lobby-view > .lobby-main > .lobby-chat-panel .chat-input-row {
    flex: 0 0 auto;
  }
  body.view-lobby-view #lobby-view > .lobby-main > .lobby-chat-panel .chat-input {
    flex: 1;
    min-width: 0;
  }
}

/* Dark desktop artwork must determine its own height, rather than be cropped by
   the old fixed-height two-row challenge-card grid. Phone and other themes keep
   their existing sizing. */
@media (min-width: 621px) {
  html[data-theme="dark"] body.view-lobby-view .handicap-grade-card {
    display: block;
    width: 100%;
    height: auto;
    min-width: 0;
    min-height: 0;
    aspect-ratio: 474 / 253;
    padding: 0;
  }
  html[data-theme="dark"] body.view-lobby-view .handicap-grade-card > :is(
    .handicap-card-art, .handicap-rules-card-art
  ) {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    object-fit: contain;
  }
}