/* Responsive screen reports. PDF canvases never receive these markers. */
@media screen {
  body.responsive-report-open .shell > .content {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 0 35px;
    min-width: 0;
  }
  .report-canvas-scroll {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
    background: var(--report-canvas, var(--canvas));
    scrollbar-width: thin;
  }
  .report-canvas-scroll[data-report-authoring="false"] {
    overflow-x: clip;
    overflow-y: visible;
  }
  .report-responsive-canvas {
    width: 100%;
    min-width: 0;
    max-width: var(--report-max-width, 1600px);
    margin-inline: auto;
    padding: 25px 26px 35px;
  }
  .report-responsive-canvas[data-report-width="full"] { max-width: none; }
  .report-canvas-scroll[data-report-authoring="true"] > .report-responsive-canvas {
    min-width: var(--report-edit-min-width, 1200px);
  }
  .report-responsive-canvas > [data-report-layout] {
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
  }
  .report-responsive-canvas > .branding-active { min-height: calc(100vh - 145px); }
  .report-responsive-canvas .report-page-content,
  .report-responsive-canvas .styled-report-section,
  .report-responsive-canvas .nested-grid-cell { min-width: 0; }
  .report-responsive-canvas .report-grid {
    display: grid;
    grid-template-columns: repeat(var(--columns, 12), minmax(0, 1fr));
    grid-auto-flow: row dense;
    grid-auto-rows: 32px;
    align-items: stretch;
    min-width: 0;
  }
  .report-responsive-canvas .report-grid > [data-report-widget="true"] {
    min-width: 0;
    min-height: 0;
    height: auto;
    max-height: none;
    grid-column: span var(--width, 6);
    grid-row: span var(--height, 8);
  }
  .report-responsive-canvas .report-grid > [data-report-widget="true"][data-grid-positioned="true"] {
    grid-column: var(--grid-x) / span var(--width) !important;
    grid-row: var(--grid-y) / span var(--height) !important;
  }
  .report-responsive-canvas .section-nested-grid {
    display: grid;
    grid-template-columns: repeat(var(--nested-columns, 12), minmax(0, 1fr));
    align-items: start;
  }
  .report-responsive-canvas .nested-grid-cell {
    grid-column: span var(--cell-span, 12);
  }
  [data-report-layout="read"] .report-grid-empty,
  [data-report-layout="read"] .nested-grid-empty { display: none; }
  [data-report-layout="read"] .report-grid > :is(.type-spacer,.type-grid_spacer)[data-responsive-projected="true"] {
    visibility: hidden;
  }
  .report-responsive-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    padding: 13px 26px;
    border-bottom: 1px solid var(--border);
    background: var(--surface);
  }
  .report-layout-modes {
    display: inline-flex;
    flex: 0 0 auto;
    gap: 3px;
    padding: 3px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: #f8fafc;
  }
  .report-layout-modes button {
    min-height: 32px;
    padding: 6px 11px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    font-size: 12px;
    color: var(--muted);
  }
  .report-layout-modes button[aria-pressed="true"] {
    background: #fff;
    color: var(--primary);
    box-shadow: 0 1px 4px rgb(15 23 42 / 10%);
  }
  .report-responsive-tools p { flex: 1 1 240px; color: var(--muted); font-size: 11px; }
  .report-responsive-tools .btn { flex: 0 0 auto; }
  .report-responsive-canvas .banner-copy { min-width: 0; }
  .report-responsive-canvas .banner-title { flex-wrap: wrap; }
  .report-responsive-canvas .banner-title h1 { overflow-wrap: anywhere; }
  .report-responsive-canvas .report-bottom { flex-wrap: wrap; gap: 6px 16px; }

  /* Collapse page navigation by available report space, not monitor width. */

  [data-report-layout][data-responsive-navigation="compact"] .report-page-layout.has-page-nav { display: block; }
  [data-report-layout][data-responsive-navigation="compact"] .report-page-nav {
    position: static;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px;
    margin: 0 0 20px;
    max-height: none;
  }
  [data-report-layout][data-responsive-navigation="compact"] .report-page-nav-title { width: 100%; margin-bottom: 4px; }
  [data-report-layout][data-responsive-navigation="compact"] .report-page-nav > button {
    width: auto;
    flex: 0 1 auto;
    min-width: 0;
    margin: 0;
    padding: 8px 12px;
  }
  [data-report-layout][data-responsive-navigation="compact"] .report-page-nav > button strong { overflow-wrap: anywhere; }


  [data-report-layout][data-responsive-surface-size="narrow"] > .report-banner { flex-wrap: wrap; align-items: flex-start; }
  [data-report-layout][data-responsive-surface-size="narrow"] > .report-banner .banner-meta { margin-left: 0; width: 100%; }
  [data-report-layout][data-responsive-surface-size="narrow"] .report-grid { column-gap: 15px; }

  /* Precision grids retain usable tracks even in narrow nested areas. */
  .report-responsive-canvas .styled-report-section .report-grid[style*="--columns:16"] { column-gap: 12px; }
  .report-responsive-canvas .styled-report-section .report-grid[style*="--columns:24"] { column-gap: 7px; }
  .report-responsive-canvas .styled-report-section .report-grid[style*="--columns:32"] { column-gap: 4px; }
  .report-responsive-canvas .styled-report-section .report-grid[style*="--columns:48"] { column-gap: 2px; }


  /* The existing phone page picker remains the navigation on phones. */
  @media (max-width: 700px) {
    .report-responsive-canvas [data-report-layout] .report-page-nav { display: none; }
    .report-responsive-canvas [data-report-layout]:has(.mobile-report-page-controls) { padding-bottom: 92px; }
  }
  @media (max-width: 1100px) {
    body.responsive-report-open .sidebar {
      transform: translateX(-100%);
      width: 244px;
      z-index: 1100;
      transition: transform .18s ease;
    }
    body.responsive-report-open .sidebar.open { transform: translateX(0); }
    body.responsive-report-open .shell { margin-left: 0; }
    body.responsive-report-open .topbar .mobile-menu { display: inline-flex; }
    body.responsive-report-open .sidebar-backdrop {
      display: block;
      position: fixed;
      inset: 0;
      z-index: 1090;
      background: rgb(15 23 42 / 35%);
    }
  }
  @media (max-width: 767px) {
    .report-responsive-tools { padding: 10px 16px; }
    .report-responsive-tools p { flex-basis: 100%; order: 3; }
    .report-responsive-canvas { padding: 16px; }
    .report-canvas-scroll[data-report-authoring="true"] .widget-resize { display: block; }
    .report-canvas-scroll[data-report-authoring="true"] .section-nested-grid { display: grid; }
    .report-responsive-canvas .report-grid > [data-report-widget="true"]:not([data-grid-positioned="true"]) {
      grid-column: span var(--width, 6) !important;
      grid-row: span var(--height, 8) !important;
    }
  }

  /* The iframe has the actual requested viewport. Scaling only fits its preview. */
  .modal.report-screen-dialog {
    width: min(1680px, calc(100vw - 24px));
    height: calc(100dvh - 24px);
    max-height: none;
  }
  .report-screen-dialog .modal-body { display: flex; flex-direction: column; min-height: 0; padding: 0; }
  .report-screen-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 10px;
    padding: 12px 18px;
    background: #fff;
    border-bottom: 1px solid var(--border);
  }
  .report-screen-controls label { display: flex; flex-direction: column; gap: 4px; font-size: 11px; }
  .report-screen-controls input { width: 105px; min-height: 34px; }
  .report-screen-controls select { width: 220px; min-height: 34px; }
  .report-screen-status { align-self: center; margin-left: auto; color: var(--muted); font-size: 11px; }
  .report-screen-viewport {
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: 20px;
    background: #e2e8f0;
  }
  .report-screen-frame-wrap {
    position: relative;
    margin-inline: auto;
    background: #fff;
    box-shadow: 0 8px 30px rgb(15 23 42 / 12%);
  }
  .report-screen-frame {
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    border: 0;
    transform-origin: 0 0;
    background: var(--canvas);
  }
  body.report-screen-document { overflow-x: hidden; }
  .report-screen-document .report-canvas-scroll { min-height: 100vh; }
}

@media print {
  .report-responsive-tools, .report-screen-dialog { display: none !important; }
}