/* Final responsive layer: loaded after page styles by Dash. */
.ui-mobile-backdrop { display: none; }
@media (max-width: 1600px) {
  :root { --ui-scale: 1; --sidebar-w: 224px; }
  .content, #page-wrap, #page-content, #page-content > div,
  .row > *, .ui-card, .card, .card-body, .ui-card-body,
  .dash-graph, .nt-card { min-width: 0; }
  .content { padding-left: 16px; padding-right: 16px; }
  .flw-kpi-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .nt-opportunity-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lt-full-flow-layout { grid-template-columns: minmax(0,1fr) !important; }
  .table-responsive, .uw-table-scroll, .txe-heatmap-scroll,
  .nt-table-wrap, .dash-table-container { max-width: 100%; overflow-x: auto; }
}
@media (max-width: 1100px) {
  .lt-heatmap-grid > *, .lt-flow-grid > * { width: 100%; flex: 0 0 100%; }
}
@media (max-width: 992px) {
  :root { --topbar-h: 64px; --gap-after-topbar: 14px; --hamburger-w: 44px; }
  .app-shell .content { margin-left: 0 !important; }
  .app-shell .topbar { left: 0; padding-left: 68px !important; }
  .app-shell .sidebar {
    width: min(86vw,320px); padding: 72px 14px 24px !important;
    background: #0b1015; z-index: 100001;
    transform: translateX(-110%); visibility: hidden;
    overscroll-behavior: contain;
    padding-bottom: max(24px,env(safe-area-inset-bottom)) !important;
  }
  .app-shell.collapsed .sidebar { transform: translateX(0); visibility: visible; }
  .app-shell .hamburger, .app-shell.collapsed .hamburger {
    left: max(12px,env(safe-area-inset-left)) !important; top: 10px;
    width: 44px; height: 44px; z-index: 100002 !important;
  }
  .app-shell.collapsed .ui-mobile-backdrop {
    display: block; position: fixed; inset: 0; z-index: 100000;
    border: 0; background: rgba(0,0,0,.6); touch-action: none;
  }
  body:has(.app-shell.collapsed) { overflow: hidden; }
  .sidebar .nav-link { min-height: 44px; display: flex; align-items: center; font-size: 14px !important; }
  .sidebar .nav-l2-link.nav-link { min-height: 44px; font-size: 14px !important; }
  .topbar-title { min-width: 0; font-size: 18px !important; line-height: 1.2; }
  .topbar-actions { gap: 8px; flex-shrink: 0; }
  .ltfs-topbar { flex-wrap: wrap; }
  .ltfs-slider-row { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 600px) {
  :root { --ui-scale: 1; --ui-font: 14px; --ui-font-sm: 12px; }
  html, body { overflow-x: clip; }
  .app-shell { min-height: 100dvh; }
  .content { padding: calc(var(--topbar-h) + 14px) 12px max(24px,env(safe-area-inset-bottom)) !important; }
  .topbar { padding-right: max(12px,env(safe-area-inset-right)) !important; gap: 8px; }
  .topbar-title { font-size: 15px !important; overflow-wrap: anywhere; }
  .brand-logo { font-size: 20px !important; }
  .watchlist-button { min-height: 44px; padding: 6px; font-size: 12px; }
  .watchlist-menu > .collapse, .watchlist-menu > .collapsing {
    position: fixed; top: var(--topbar-h); left: 8px; right: 8px; width: auto;
  }
  .watchlist-dropdown { max-height: min(70dvh,520px); }
  .watchlist-refresh-button { width: 44px; height: 44px; }
  .ui-card-header { padding: 12px !important; font-size: 14px !important; flex-wrap: wrap; gap: 8px; }
  .ui-card-body, .card-body { padding: 12px !important; }
  .btn, .btn-brand, .nt-page-button, .flw-btn { min-height: 44px; font-size: 14px !important; padding: 10px 12px !important; }
  input:not([type=checkbox]):not([type=radio]), select, textarea,
  .Select-control, .Select-input > input, .Select-placeholder, .Select-value-label {
    font-size: 16px !important;
  }
  .Select-control { min-height: 44px; }
  .form-control, .form-select { min-height: 44px; }
  .row { --bs-gutter-x: 12px; --bs-gutter-y: 12px; }
  #page-content .row > [class*="col-"] { width: 100%; flex: 0 0 100%; }
  .txe-kpi-grid, .txe-kpi-grid-top, .txe-kpi-grid-bottom, .txe-kpi-grid-5,
  .flw-kpi-grid, .nt-kpi-grid, .nt-detail-summary, .econ-grid.econ-grid-6 {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .qmomo-filter-grid, .nt-filters, .nt-opportunity-grid { grid-template-columns: minmax(0,1fr); }
  .nt-hero { margin: 0 0 14px; padding: 20px 12px; }
  .nt-title { font-size: 32px; }
  .lt-layer-toolbar, .flw-table-toolbar, .nt-table-footer { flex-wrap: wrap; }
  .lt-layer-toolbar > div { min-width: 0 !important; max-width: 100%; }
  .ltfs-heatmaps, #lt-full-heatmaps { grid-template-columns: minmax(0,1fr) !important; }
  .ltfs-heatmaps-resizer { height: auto; resize: none; }
  .ltfs-title-wrap { min-width: 0; }
  .dash-graph, .js-plotly-plot { max-height: none !important; min-width: 0; }
  .dash-graph { width: 100% !important; }
  .market-table, .uw-table { font-size: 12px !important; max-width: 100%; }
  .table-responsive .market-table, .uw-table-scroll .uw-table { display: table; }
  .market-table td, .market-table thead th { padding: 10px 8px !important; }
  .nav-tabs { flex-wrap: nowrap; overflow-x: auto; max-width: 100%; }
  .nav-tabs .nav-item { flex-shrink: 0; }
  .nav-tabs .nav-link { min-height: 44px; white-space: nowrap; }
  .modal-dialog { width: calc(100% - 16px) !important; max-width: calc(100% - 16px) !important; margin: 8px auto !important; }
  .modal-content { max-height: calc(100dvh - 16px) !important; }
  .modal-body { overflow-x: auto; }
  .modal-header, .modal-footer { flex-shrink: 0; }
  .btn-close { min-width: 32px; min-height: 32px; }
  .txe-wrap div[style*="min-width: 520px"],
  .txe-wrap div[style*="min-width: 360px"] { min-width: 0 !important; flex-basis: 100% !important; }
}
@media (max-width: 360px) {
  .topbar-actions .brand-logo { display: none; }
  .txe-kpi-grid, .flw-kpi-grid, .nt-kpi-grid { grid-template-columns: minmax(0,1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .app-shell .sidebar, .app-shell .hamburger { transition: none; }
}
