/* 系统响应式补强：非全屏窗口也必须完整显示。 */

html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

#appView,
#appView .view,
#appView .main,
#appView .panel,
#appView .module-view,
#appView .detail-main,
#appView .detail-side,
#appView .dossier-body,
#appView .dossier-main,
#appView .dossier-side,
#appView .inbox-grid,
#appView .module-grid,
#appView .handoff-operation-grid,
#appView .handoff-records-grid {
  min-width: 0;
}

#appView .main {
  width: 100%;
}

#appView .dashboard-masthead,
#appView .module-hero,
#appView .clients-hero,
#appView .dossier-hero {
  min-width: 0;
}

#appView .dashboard-masthead-copy,
#appView .hero-copy,
#appView .dossier-titles,
#appView .panel-head > div,
#appView .selected-client-summary {
  min-width: 0;
}

#appView .dashboard-masthead h2,
#appView .module-hero h2,
#appView .clients-hero h2,
#appView .dossier-titles h2,
#appView .panel-head h3 {
  overflow-wrap: anywhere;
}

#appView .table-panel,
#appView .clients-table-scroll,
#appView .inbox-list,
#appView .handoff-list {
  max-width: 100%;
}

/* 中等窗口：缩窄侧栏、减少页面横向留白。 */
@media (max-width: 1499px) and (min-width: 1181px) {
  body {
    --sidebar-w: 260px;
  }

  body.email-nav-wide {
    --sidebar-w: 306px;
  }

  #appView .main {
    padding-left: 24px;
    padding-right: 24px;
  }

  #appView .topbar {
    height: 86px;
  }

  #appView .view {
    padding-top: 20px;
  }
}

/* 较窄窗口：侧栏改为可呼出的抽屉，主内容使用完整宽度。 */
@media (max-width: 1180px) {
  body,
  body.email-nav-wide {
    --sidebar-w: 306px;
  }

  #appView.app-shell {
    display: block;
  }

  #appView .main {
    width: 100%;
    padding: 0 22px 54px;
  }

  #appView .sidebar {
    width: min(306px, 86vw);
    transform: translateX(-100%);
    transition: transform .22s ease;
    box-shadow: 24px 0 70px rgba(3, 12, 22, .38);
  }

  #appView .sidebar.open {
    transform: none;
  }

  #appView .menu-btn {
    display: grid;
    flex: 0 0 38px;
  }

  #appView .topbar {
    min-height: 82px;
    height: auto;
    padding: 14px 0;
    gap: 12px;
  }

  #appView .topbar > div:nth-child(2) {
    min-width: 0;
    margin-right: auto;
  }

  #appView .top-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  #appView #dashboardView .dashboard-workspace,
  #appView #nemeDashboard .neme-dash-grid,
  #appView .handoff-operation-grid,
  #appView .handoff-records-grid,
  #appView #detailView .dossier-body,
  #appView #cpfModuleView .cpf-application-layout,
  #appView #cpfModuleView .appointment-layout,
  #appView .module-grid,
  #appView .inbox-grid,
  #appView .detail-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  #appView #detailView .dossier-body .detail-side {
    grid-row: auto;
  }

  #appView #detailView .dossier-hero {
    grid-template-columns: minmax(0, 1fr);
  }

  #appView #detailView .dossier-hero .detail-actions {
    justify-content: flex-start;
  }
}

/* 窄窗口：所有主要双栏结构提前折叠，避免依赖更小的手机断点。 */
@media (max-width: 900px) {
  #appView .main {
    padding-left: 16px;
    padding-right: 16px;
  }

  #appView #dashboardView .quick-grid.dashboard-actions,
  #appView #dashboardView .quick-grid.dashboard-actions.neme-actions,
  #appView #dashboardView .dashboard-metrics,
  #appView #nemeDashboard .neme-dash-kpis,
  #appView .handoff-stats,
  #appView .form-grid,
  #appView .neme-notify-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #appView #detailView .dossier-hero .detail-actions,
  #appView .module-hero,
  #appView .dashboard-masthead {
    flex-wrap: wrap;
  }

  #appView .module-hero-pickers,
  #appView .neme-hero-actions,
  #appView .poa-hero-tools {
    width: 100%;
  }

  #appView .inbox-toolbar,
  #appView .toolbar,
  #appView .clients-toolbar {
    flex-wrap: wrap;
  }

  #appView .clients-toolbar .search,
  #appView .search {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 620px) {
  #appView .main {
    padding-left: 12px;
    padding-right: 12px;
  }

  #appView #dashboardView .dashboard-metrics,
  #appView #nemeDashboard .neme-dash-kpis,
  #appView .handoff-stats,
  #appView #dashboardView .quick-grid.dashboard-actions,
  #appView #dashboardView .quick-grid.dashboard-actions.neme-actions,
  #appView .form-grid,
  #appView .neme-notify-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  #appView .panel,
  #appView .dash-panel,
  #appView #detailView .dossier-body .panel {
    padding-left: 15px;
    padding-right: 15px;
  }

  #appView .top-actions .date-pill {
    display: none;
  }
}