/* Shared lobby/archive components. This stylesheet is not loaded by the playroom. */
#dice-arcade-lobby {
  --arcade-gap: 14px;
  --arcade-control: 44px;
  --arcade-body-font: var(--dice-font-body);
}
#dice-arcade-lobby .dice-arcade-library-meta {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 12px;
}
#dice-arcade-lobby .dice-arcade-library-meta label { display: flex; align-items: center; gap: 8px; min-width: 0; }
#dice-arcade-lobby .dice-arcade-library-meta [data-arcade-result-count] { margin-right: auto; }
#dice-arcade-lobby .dice-arcade-library-meta select {
  max-width: 190px;
  min-height: 36px;
  padding: 6px 26px 6px 10px;
}
#dice-arcade-lobby #instant-arcade-games { display: flex !important; flex-direction: column !important; }
#dice-arcade-lobby #instant-arcade-games .dice-instant-arcade-shelf__head:not(:where(#instant-arcade-games .dice-instant-arcade-shelf__head, #instant-arcade-games .dice-instant-arcade-shelf__head *)) { flex-shrink: 0; height: auto !important; min-height: 0 !important; margin-bottom: 12px !important; padding: 0 !important; }
#dice-arcade-lobby #instant-arcade-games-grid:not(:where(#instant-arcade-games-grid)) { min-height: 0 !important; align-content: start !important; }
#dice-arcade-lobby #instant-arcade-games::after,
#dice-arcade-lobby #instant-arcade-games-grid:not(:where(#instant-arcade-games-grid))::after { display: none !important; }
#dice-arcade-lobby #instant-arcade-games-grid > article:not(:where(#instant-arcade-games-grid)) {
  filter: none !important;
  pointer-events: auto !important;
}
#dice-arcade-lobby #instant-arcade-games .dice-instant-arcade-library-toggle:not(:where(.dice-design-lobby, .dice-design-lobby *)) {
  position: static !important;
  inset: auto !important;
  float: none;
  transform: none !important;
  margin: 0 !important;
  min-height: 36px !important;
  padding: 6px 14px !important;
}
#dice-arcade-lobby .dice-instant-arcade-player__stat:focus-visible { outline-offset: -3px; }

#dice-arcade-lobby #dice-arcade-detail { padding: 18px !important; gap: var(--arcade-gap) !important; }
#dice-arcade-lobby #dice-arcade-detail[hidden] { display: none !important; }
#dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__header { margin: 0 !important; padding: 0 !important; gap: 10px !important; }
#dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__intro h2 {
  margin: 8px 0 !important;
}
#dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__description p:not(:where(.dice-design-lobby, .dice-design-lobby *)) {
  margin: 0 !important;
}
#dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__layout:not(:where(.dice-design-lobby, .dice-design-lobby *)) { gap: 12px !important; }
#dice-arcade-lobby #dice-arcade-detail :is(.dice-playroom-game-info__layout, .dice-playroom-game-info__panel):not(:where(.dice-design-lobby, .dice-design-lobby *)) { max-height: none !important; align-self: stretch !important; }
#dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__panel:not(:where(.dice-design-lobby, .dice-design-lobby *)) { gap: 10px !important; }
#dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__progress:not(:where(.dice-design-lobby, .dice-design-lobby *)) { display: none !important; }
#dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__stats div:not(:where(.dice-design-lobby, .dice-design-lobby *)) { min-height: 56px !important; padding: 9px 12px !important; }
#dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__how { min-height: 72px !important; padding: 10px !important; }
#dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__prizes h3:not(:where(.dice-design-lobby, .dice-design-lobby *)) { margin: 0 0 8px !important; }
#dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__prize-list button:not(:where(.dice-design-lobby, .dice-design-lobby *)) { min-height: 52px !important; padding: 8px !important; }
#dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__actions:not(:where(.dice-design-lobby, .dice-design-lobby *)) {
  position: static !important;
  align-self: stretch !important;
  margin: 0 !important;
  min-height: var(--arcade-control) !important;
  gap: 10px !important;
}
#dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__actions button:not(:where(.dice-design-lobby, .dice-design-lobby *)) { min-height: var(--arcade-control) !important; }

@media (min-width: 981px) {
  /* Reset legacy two-row placements as well as the desktop column tracks. */
  #dice-arcade-lobby:not(:where(.dice-design-lobby, .dice-design-lobby *, :has(> body.dice-design-lobby))) {
    grid-template-columns: clamp(180px, 14vw, 218px) minmax(0, 1fr) clamp(236px, 19vw, 284px) !important;
    grid-template-rows: minmax(0, 1fr) !important;
  }
  #dice-arcade-lobby > .dice-instant-arcade-sidebar {
    scrollbar-width: thin;
  }
  #dice-arcade-lobby > .dice-instant-arcade-sidebar:not(:where(.dice-design-lobby, .dice-design-lobby *, :has(> body.dice-design-lobby))) {
    grid-area: 1 / 1 !important;
    overflow-y: auto !important;
  }
  #dice-arcade-lobby .dice-instant-arcade-sidebar__nav :is(a, button) {
    grid-template-columns: 20px minmax(0, 1fr) auto !important;
    min-width: 0 !important;
    gap: 8px !important;
    padding-inline: 8px !important;
  }
  #dice-arcade-lobby > .dice-instant-arcade-content:not(:where(.dice-design-lobby, .dice-design-lobby *, :has(> body.dice-design-lobby))) { grid-area: 1 / 2 !important; }
  #dice-arcade-lobby > .dice-instant-arcade-aside {
    scrollbar-width: thin;
  }
  #dice-arcade-lobby > .dice-instant-arcade-aside:not(:where(.dice-design-lobby, .dice-design-lobby *, :has(> body.dice-design-lobby))) {
    grid-area: 1 / 3 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto minmax(160px, 1fr) auto !important;
    gap: var(--arcade-gap) !important;
    overflow-y: auto !important;
  }
  #dice-arcade-lobby .dice-instant-arcade-player {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 16px !important;
    gap: 12px !important;
    overflow-y: auto !important;
    scrollbar-width: thin;
  }
  #dice-arcade-lobby .dice-instant-arcade-player__stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #dice-arcade-lobby .dice-instant-arcade-player__balance { padding-block: 12px !important; }
  #dice-arcade-lobby .dice-arcade-wallet-link { padding-top: 0; }
  #dice-arcade-lobby .dice-instant-arcade-activity { min-height: 0 !important; height: 100% !important; }
  #dice-arcade-lobby .dice-instant-arcade-aside-heading:not(:where(.dice-design-lobby, .dice-design-lobby *, :has(> body.dice-design-lobby))) { flex-shrink: 0; }
  #dice-arcade-lobby .dice-instant-arcade-activity ol {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-y: auto !important;
    scrollbar-width: thin;
  }
  #dice-arcade-lobby .dice-instant-arcade-activity li {
    flex: 0 0 auto !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    gap: 12px !important;
    height: auto !important;
    min-height: 76px !important;
    max-height: none !important;
    padding: 12px 0 !important;
  }
  #dice-arcade-lobby .dice-instant-arcade-activity__prize {
    white-space: normal !important;
    overflow-wrap: anywhere;
    -webkit-line-clamp: unset !important;
    max-height: none !important;
  }
  #dice-arcade-lobby > .dice-instant-arcade-content:not(.has-account-view) {
    scrollbar-width: thin;
    scroll-padding-top: 76px;
  }
  #dice-arcade-lobby > .dice-instant-arcade-content:not(.has-account-view):not(:where(.dice-design-lobby, .dice-design-lobby *, :has(> body.dice-design-lobby))) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 62px minmax(240px, 1fr) minmax(500px, 1fr) !important;
    gap: var(--arcade-gap) !important;
    overflow-y: auto !important;
  }
  #dice-arcade-lobby > .dice-instant-arcade-content.has-continue-playing:not(.has-account-view):not(:where(.dice-design-lobby, .dice-design-lobby *, :has(> body.dice-design-lobby))) {
    grid-template-rows: 62px minmax(240px, 1fr) minmax(716px, 1fr) !important;
  }
  #dice-arcade-lobby:is(.is-library-expanded, .is-info-active) > .dice-instant-arcade-content:not(.has-account-view):not(:where(.dice-design-lobby, .dice-design-lobby *, :has(> body.dice-design-lobby))) {
    grid-template-rows: 62px minmax(0, 1fr) !important;
  }
  #dice-arcade-lobby .dice-instant-arcade-utility .dice-instant-game-nav:not(:where(.dice-design-lobby .dice-instant-game-nav)) {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1.5fr) minmax(0, 1fr) !important;
    min-width: 0 !important;
    width: 100% !important;
    gap: 10px !important;
  }
  #dice-arcade-lobby .dice-instant-arcade-utility {
    container-type: inline-size;
    position: sticky !important;
    top: 0 !important;
    z-index: 30 !important;
  }
  #dice-arcade-lobby .dice-instant-arcade-utility .dice-instant-game-nav > *:not(:where(.dice-design-lobby .dice-instant-game-nav)) {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  #dice-arcade-lobby .dice-instant-arcade-utility :is(.dice-instant-game-credit, .dice-instant-game-player-control, .dice-instant-game-exit) {
    padding-inline: 8px !important;
    gap: 8px !important;
  }
  #dice-arcade-lobby .dice-instant-game-player-control strong { min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; }
  @container (max-width: 800px) {
    #dice-arcade-lobby .dice-instant-arcade-utility .dice-instant-game-nav:not(:where(.dice-design-lobby .dice-instant-game-nav)) {
      grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr) minmax(0, 1.5fr) minmax(0, 1fr) !important;
    }
    #dice-arcade-lobby .dice-instant-game-credit {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) 20px !important;
      grid-template-rows: 12px 22px !important;
      align-content: center !important;
      row-gap: 2px !important;
    }
    #dice-arcade-lobby .dice-instant-game-credit > span { grid-area: 1 / 1 !important; }
    #dice-arcade-lobby .dice-instant-game-credit > strong { grid-area: 2 / 1 !important; }
    #dice-arcade-lobby .dice-instant-game-credit__wallet {
      grid-area: 1 / 2 / 3 / 3 !important;
      width: 20px !important;
      min-width: 20px !important;
      max-width: 20px !important;
    }
  }
  #dice-arcade-lobby .dice-instant-arcade-lobby-stack:not(:where(.dice-design-lobby, .dice-design-lobby *, :has(> body.dice-design-lobby))) {
    max-height: none !important;
    align-self: stretch !important;
    grid-template-rows: minmax(0, 1fr) !important;
    min-height: 0 !important;
    height: 100% !important;
    gap: var(--arcade-gap) !important;
  }
  #dice-arcade-lobby.is-info-active .dice-instant-arcade-lobby-stack { display: none !important; }
  #dice-arcade-lobby .has-continue-playing .dice-instant-arcade-lobby-stack:not(:where(.dice-design-lobby, .dice-design-lobby *, :has(> body.dice-design-lobby))) {
    grid-template-rows: 202px minmax(0, 1fr) !important;
  }
  #dice-arcade-lobby #instant-arcade-jump-back-in {
    height: 202px !important;
    min-height: 202px !important;
    max-height: 202px !important;
    grid-template-rows: 44px 106px !important;
    padding: 18px 24px !important;
    gap: 16px !important;
  }
  #dice-arcade-lobby #instant-arcade-games {
    container-type: inline-size;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    gap: 0 !important;
    padding: 18px 24px !important;
  }
  #dice-arcade-lobby #instant-arcade-games .dice-instant-arcade-shelf__tools {
    display: grid !important;
    grid-template-columns: max-content minmax(0, 1fr) !important;
    grid-template-rows: 44px 44px !important;
    gap: 12px !important;
    height: auto !important;
    min-width: 0 !important;
    overflow: visible !important;
  }
  #dice-arcade-lobby #instant-arcade-games .dice-instant-arcade-lobby-heading { grid-area: 1 / 1 !important; }
  #dice-arcade-lobby #instant-arcade-games .dice-instant-arcade-search {
    grid-area: 1 / 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
  #dice-arcade-lobby #instant-arcade-games .dice-instant-arcade-shelf__filters {
    grid-area: 2 / 1 / 3 / -1 !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 8px !important;
  }
  #dice-arcade-lobby #instant-arcade-games .dice-instant-arcade-shelf__filters button {
    min-width: 0 !important;
    width: 100% !important;
    padding-inline: 8px !important;
  }
  #dice-arcade-lobby #instant-arcade-games-grid:not(:where(#instant-arcade-games-grid)) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  @container (min-width: 650px) {
    #dice-arcade-lobby #instant-arcade-games-grid:not(:where(#instant-arcade-games-grid)) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  }
  @container (min-width: 900px) {
    #dice-arcade-lobby #instant-arcade-games-grid:not(:where(#instant-arcade-games-grid)) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
    #dice-arcade-lobby #instant-arcade-games .dice-instant-arcade-shelf__tools {
      grid-template-columns: max-content minmax(180px, 1fr) minmax(420px, 1.4fr) !important;
      grid-template-rows: 44px !important;
    }
    #dice-arcade-lobby #instant-arcade-games .dice-instant-arcade-shelf__filters { grid-area: 1 / 3 !important; }
  }
  #dice-arcade-lobby #instant-arcade-jump-back-in-rail {
    display: grid !important;
    grid-template-columns: none !important;
    grid-auto-flow: column !important;
    grid-auto-columns: max(260px, calc((100% - 54px) / 4)) !important;
    gap: 18px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: thin;
  }
  #dice-arcade-lobby #instant-arcade-games-grid:not(:where(#instant-arcade-games-grid)) {
    flex: 1 1 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow-y: auto !important;
    scrollbar-width: thin;
    padding: 0 0 4px !important;
  }
  #dice-arcade-lobby:not(.is-library-expanded) #instant-arcade-games-grid > article[data-arcade-visible-index]:not([data-arcade-visible-index="1"]):not([data-arcade-visible-index="2"]):not([data-arcade-visible-index="3"]):not([data-arcade-visible-index="4"]):not(:where(#instant-arcade-games-grid)) { display: none !important; }
  #dice-arcade-lobby #dice-arcade-detail {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }
  #dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__layout:not(:where(.dice-design-lobby, .dice-design-lobby *)) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(110px, 1fr) minmax(340px, 1.25fr) !important;
    min-height: 0 !important;
    height: auto !important;
    overflow-y: auto !important;
  }
  #dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__media:not(:where(.dice-design-lobby, .dice-design-lobby *)) { height: 100% !important; min-height: 0 !important; max-height: none !important; }
  #dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__panel:not(:where(.dice-design-lobby, .dice-design-lobby *)) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto minmax(70px, 1fr) auto !important;
    min-height: 0 !important;
    height: auto !important;
    overflow: visible !important;
  }
  #dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__prizes:not(:where(.dice-design-lobby, .dice-design-lobby *)) { display: flex !important; flex-direction: column !important; min-height: 0 !important; overflow: hidden !important; }
  #dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__prize-list:not(:where(.dice-design-lobby, .dice-design-lobby *)) { flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; align-content: start !important; scrollbar-width: thin; }
  #dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__how { grid-template-columns: 58px minmax(0, 1fr) 180px !important; }
  #dice-arcade-lobby #dice-arcade-detail .dice-arcade-how__head > span { display: none !important; }
  #dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__how > .dice-arcade-guide-visual { height: 56px !important; width: 56px !important; }
  #dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__stats strong:not(:where(.dice-design-lobby, .dice-design-lobby *)) {
    white-space: normal !important;
    overflow-wrap: anywhere;
    text-overflow: clip !important;
  }
}
@media (max-width: 980px) {
  #dice-arcade-lobby .dice-arcade-library-meta select { min-height: 44px; max-width: 170px; }
  #dice-arcade-lobby .dice-arcade-library-meta label > span { display: none; }
  #dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__prize-list button:not(:where(.dice-design-lobby, .dice-design-lobby *)) { min-height: 60px !important; }
  #dice-arcade-lobby #dice-arcade-detail .dice-playroom-game-info__actions:not(:where(.dice-design-lobby, .dice-design-lobby *)) { grid-template-columns: minmax(0, 1fr) !important; }
}
