html.playbox-settings-handoff,
html.playbox-settings-handoff body {
  background: #121717 !important;
}

html.playbox-settings-handoff body {
  visibility: hidden;
}

html.playbox-settings-embedded,
html.playbox-settings-embedded body {
  width: 100%;
  min-height: 100%;
  background: transparent;
}

/* The persistent shell owns one backdrop for every settings route. Removing
   page-owned artwork prevents a visible background cut during navigation. */
html.playbox-settings-embedded body::before,
html.playbox-settings-embedded .bg-room-layer,
html.playbox-settings-embedded .vignette-layer {
  display: none !important;
}

html.playbox-settings-embedded .tv-settings-viewport,
html.playbox-settings-embedded .detail-app,
html.playbox-settings-embedded .settings-main,
html.playbox-settings-embedded .detail-main {
  background: transparent !important;
}

html.playbox-settings-embedded .detail-header,
html.playbox-settings-embedded .settings-header {
  display: none !important;
}

html.playbox-settings-embedded .detail-app {
  min-height: 100vh;
  min-height: 100dvh;
}

html.playbox-settings-embedded .detail-main {
  padding-top: clamp(18px, 3vh, 32px);
}

html.playbox-settings-embedded .tv-settings-viewport {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  min-height: 0;
}

html.playbox-settings-embedded .settings-main {
  top: 0 !important;
  height: 100vh !important;
  height: 100dvh !important;
  padding-top: clamp(18px, 3vh, 32px);
}

@media (max-width: 700px) {
  html.playbox-settings-embedded .settings-main {
    overflow-y: auto;
    padding-top: 10px;
  }

  html.playbox-settings-embedded .detail-main {
    padding-top: 12px;
  }
}