html,
body,
#app {
  margin: 0;
  min-height: 100%;
  background: #050402;
  color-scheme: dark;
}

body {
  display: block;
  overflow-x: hidden;
}

#app {
  width: 100%;
  max-width: 390px;
  margin-inline: auto;
  min-height: 100vh;
}

.site-icp-footer {
  width: min(100%, 390px);
  margin-inline: auto;
}

.app-view {
  width: 100%;
  min-height: 100vh;
  background: #050402;
}

.app-view[hidden] {
  display: none !important;
}

#home-view,
#game-detail-view,
#reviews-shell-view {
  justify-content: center;
}

#home-view:not([hidden]),
#game-detail-view:not([hidden]),
#reviews-shell-view:not([hidden]) {
  display: flex;
}

#game-detail-view,
#reviews-shell-view {
  align-items: flex-start;
}

#game-detail-view .delta-page,
#reviews-shell-view .reviews-page {
  flex: 0 0 min(100%, 390px);
}

@media (min-width: 391px) {
  #reviews-shell-view .reviews-page {
    flex-basis: 390px;
  }
}

@media (max-width: 350px) {
  .delta-page:not([data-game="king"]) .delta-header { gap: 5px; }
  .delta-page:not([data-game="king"]) .delta-logo { flex-basis: 32px; width: 32px; height: 32px; }
  .delta-page:not([data-game="king"]) .delta-brand { flex-basis: 100px; width: 100px; }
  .delta-page:not([data-game="king"]) .delta-title-capsule { width: 114px; }
}