/* Native insets are the original baseline. Only the JS rollback switch adds 20px.
 * Backgrounds may bleed to the screen edge; interactive surfaces use --safe-top. */
:root {
  --ws-native-safe-top: env(safe-area-inset-top, 0px);
  --ws-native-safe-bottom: env(safe-area-inset-bottom, 0px);
  --ws-ios-top-extra: 0px;
  --ws-safe-top: calc(var(--ws-native-safe-top) + var(--ws-ios-top-extra));
  --safe-top: var(--ws-safe-top);
  --safe-bottom: var(--ws-native-safe-bottom);
}
@media screen {
  :root[data-ws-safe-zone] .app-menu {
    top: var(--safe-top);
    padding-top: 18px;
  }
  /* Legacy utility close-button centering outranks the Party Planner header. */
  :root[data-ws-safe-zone] section.drawer.menu-utility-drawer > .drawer-head > .party-planner-drawer-close {
    top: calc(var(--safe-top) + 42px) !important;
  }
  /* Native dialogs inherit this automatically, including dynamically created ones.
   * Full-screen viewers keep edge-to-edge backdrops and protect their own toolbar. */
  :root[data-ws-safe-zone] dialog:not(.count-pdf-viewer):not([data-ws-safe-surface="fullscreen"]) {
    box-sizing: border-box;
    top: var(--safe-top);
    bottom: var(--safe-bottom);
    margin-block: auto;
    max-height: calc(100dvh - var(--safe-top) - var(--safe-bottom) - 24px) !important;
    overflow: auto;
  }
  :root[data-ws-safe-zone] dialog.filter-drawer { margin-bottom: 0; }
  :root[data-ws-safe-zone] :is(.fe-modal, .editor-layer, .ws-safe-modal) {
    box-sizing: border-box;
    padding-top: calc(var(--safe-top) + 20px);
    padding-bottom: calc(var(--safe-bottom) + 20px);
  }
  :root[data-ws-safe-zone] :is(.fe-dialog, .editor-sheet, .ws-safe-modal > .ws-safe-sheet) {
    max-height: calc(100dvh - var(--safe-top) - var(--safe-bottom) - 40px);
  }
  :root[data-ws-safe-zone] .ledger-sheet {
    max-height: min(82dvh, calc(100dvh - var(--safe-top)));
  }
  /* Ordinary bottom sheets preserve their existing size until it crosses the safe line. */
  :root[data-ws-safe-zone] section.drawer:not(.menu-utility-drawer):not(.unified-filter-drawer) {
    max-height: min(86dvh, 770px, calc(100dvh - var(--safe-top))) !important;
  }
  :root[data-ws-safe-zone] section.unified-filter-drawer {
    top: max(86px, var(--safe-top)) !important;
  }
  :root[data-ws-safe-zone] .studio-header {
    height: auto;
    min-height: calc(66px + var(--safe-top));
    padding-top: var(--safe-top);
  }
  /* Opt-in for future full-screen headers; use a base padding token to avoid duplication. */
  .ws-safe-header { padding-top: calc(var(--ws-header-padding, 0px) + var(--safe-top)); }
}
@media print {
  :root { --ws-ios-top-extra: 0px !important; }
}