/* Desktop chart tool is the existing phone document in a bounded, unscaled viewport.
   Phones/tablets never receive this class. The outside has no scrolling owner. */
html.chart-desktop-host, html.chart-desktop-host body#chart-desktop-host {
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100dvh !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--chart-desktop-background, #000) var(--chart-desktop-image, none) center / cover !important;
  color-scheme: normal;
}
body.chart-desktop-host { visibility: visible !important; }
body.chart-desktop-host::before, body.chart-desktop-host::after { content: none !important; }
#chart-desktop-viewport {
  --chart-phone-width: min(393px, 100vw);
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: var(--chart-phone-width);
  height: min(740px, 100dvh);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

/* All desktop views share the same centered 393 × 740 frame.
   The original library list and chart body remain the scrolling owners. */
/* Desktop's embedded phone has a tall viewport: lift the birth wheel above its bottom edge.
   Native phone/tablet documents never receive chart-desktop-content. */
html.chart-desktop-content .wp-root {
  box-sizing: border-box;
  padding-bottom: min(12dvh, 112px);
}
html.chart-desktop-content .wp-sheet {
  border-bottom: 1px solid var(--line2);
  border-radius: 16px;
}
@media(max-height:540px) {
  html.chart-desktop-content .wp-root { padding-bottom: 12px; }
}