/* Responsive presentation overrides; no data, permissions or workflow changes. */
body.desktop-interface { min-width: 0; }
.desktop-interface #appMain { min-width: 0; max-width: none; }
.desktop-interface :is(.tool-view,.tool-body,.tool-shell,.overview-home,.home-menu) { min-width: 0; width: 100%; max-width: none; }
.desktop-interface :is(.roi-simple,.roi-plan-console,.pms-page) { width: 100%; max-width: none; margin-inline: 0; }
.desktop-interface :is(.table-scroll,.table-wrap,.ss-table-scroll,.roi-table-wrap,.pms-table-wrap,.fr-table-wrap,.ed-table-scroll) { min-width: 0; max-width: 100%; overflow: auto; }
/* Seven-shop CSS is loaded dynamically. Extra scope keeps this rule effective. */
.desktop-interface #overviewHome .ss-table { width: 100%; min-width: 1500px; }
.desktop-interface :is(.shops-layout,.shops-grid2,.ow-compose-layout,.video-workbench-grid,.ov-columns,.metric-grid,.fr-summary) > * { min-width: 0; }
.desktop-interface :is(.filters,.tool-query,.top-actions) { flex-wrap: wrap; }
.desktop-interface :is(.filters,.tool-query) > * { max-width: 100%; }
.desktop-interface :is(.filters,.tool-query) :is(input,select) { max-width: 100%; }
.desktop-interface .login-view { grid-template-columns: minmax(0,1fr); }
.desktop-interface .login-card { width: 430px; max-width: 100%; min-width: 0; }
.desktop-interface .login-card input { min-width: 0; }
.desktop-interface .date-popover { width: min(700px,calc(100vw - 48px)); }
.desktop-interface .date-calendars { min-width: 0; }
.desktop-interface .date-calendars > * { min-width: 0; }
.desktop-interface .cs-studio :is(.mc-workspace,.video-records) { width: 100%; max-width: none; }
.desktop-interface .cs-panel { animation-name: responsive-panel-in; }
@keyframes responsive-panel-in { from { opacity: 0; } to { opacity: 1; } }
/* Data-heavy dialogs use the available screen; short confirmations stay compact. */
.desktop-interface :is(dialog.air-dialog,dialog.sat-dialog,#rosterDialog,#accountDialog,#auditDialog,#accessPolicyDialog) { width: calc(100vw - 48px); max-width: none; }
.desktop-interface dialog.air-dialog .air-layout { grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); }
.desktop-interface dialog.sat-dialog .sat-grid { grid-template-columns: repeat(auto-fill,minmax(min(100%,190px),1fr)); }
#responsiveNavBackdrop { display: none; }

@media (max-width: 1279px) {
  .desktop-interface .date-popover { position: fixed; top: min(160px,20dvh); left: max(20px,var(--ui-sidebar)); right: 20px; width: auto; max-height: calc(80dvh - 20px); overflow: auto; }
  .desktop-interface :is(.shops-layout,.ow-compose-layout) { grid-template-columns: minmax(0,1fr); }
  .desktop-interface .ow-compose-side { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .desktop-interface #overviewHome .ss-stores { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .desktop-interface #overviewHome .ss-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px 0; }
  .desktop-interface #overviewHome .ss-metrics > div { padding-inline: 14px; border-right: 0; }
}

@media (max-width: 1023px) {
  .desktop-interface { --ui-space: 20px; --ui-sidebar: 0px; }
  .desktop-interface :is(#appMain,#appTopbar,#viewTabs) { margin-left: 0; }
  .desktop-interface .desktop-sidebar { width: min(280px,86vw); z-index: 71; box-shadow: 12px 0 40px #16162220; }
  .desktop-interface.desktop-signed-in:not(.desktop-sidebar-collapsed) #responsiveNavBackdrop:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 70; width: 100%; height: 100%; margin: 0; border: 0; border-radius: 0; background: #16162255; padding: 0; }
  .desktop-interface :is(.ov-columns,.video-workbench-grid) { grid-template-columns: minmax(0,1fr); }
  .desktop-interface .pms-query { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .desktop-interface .pms-query > button { justify-self: stretch; }
  .desktop-interface .ov-kpis { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .desktop-interface .ov-kpi, .desktop-interface .ov-kpi:nth-child(-n+4) { grid-column: auto; }
  .desktop-interface .date-popover { position: fixed; top: min(160px,20dvh); left: 20px; right: 20px; width: auto; max-height: calc(80dvh - 20px); overflow: auto; }
  .desktop-interface dialog.air-dialog .air-layout { grid-template-columns: minmax(0,1fr); }
}

@media (max-width: 767px) {
  .desktop-interface { --ui-space: 16px; }
  .desktop-interface #appMain { padding-block: 20px 36px; }
  .desktop-interface :is(.menu-hero,.desktop-directory-toolbar,.tool-head-row,.ov-hero,.fr-head,.pmr-running-job) { flex-wrap: wrap; gap: 12px; }
  .desktop-interface .desktop-directory-search { width: 100%; }
  .desktop-interface .desktop-weather .weather-strip { width: min(330px,100%); }
  .desktop-interface .menu-hero h2 { font-size: 24px; }
  .desktop-interface :is(.ws-grid,.metric-grid,.fr-summary,.video-cost-summary,.vr-filters,.vr-identity) { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .desktop-interface :is(.shops-grid2,.ow-compose-side,.ow-extra-grid,.roi-scope-controls) { grid-template-columns: minmax(0,1fr); }
  .desktop-interface .roi-query-fields, .desktop-interface .roi-query-fields.roi-all-scope { grid-template-columns: minmax(0,1fr); }
  .desktop-interface .roi-query-fields > *, .desktop-interface .roi-scope-controls > * { grid-column: auto; }
  .desktop-interface .roi-query-fields button { justify-self: stretch; }
  .desktop-interface .ow-compose-layout { padding: 16px; gap: 18px; }
  .desktop-interface .ow-compose-footer { padding: 14px 16px; flex-wrap: wrap; }
  .desktop-interface .filter-panel { padding: 16px; }
  .desktop-interface .tool-query label { min-width: 0; flex: 1 1 180px; }
  .desktop-interface :is(.tool-query,.filters) :is(#topFilterInput,#productInput) { width: 100%; }
  .desktop-interface .oi-toolbar > input[type=search] { min-width: 0; width: 100%; }
  .desktop-interface .audit-toolbar input { min-width: 0; }
  .desktop-interface .fr-head > .tool-sub { min-width: 0; }
  .desktop-interface .date-popover { display: grid; grid-template-columns: minmax(0,1fr); left: 12px; right: 12px; }
  .desktop-interface .date-presets { display: flex; flex-wrap: wrap; padding: 8px; gap: 4px; }
  .desktop-interface .date-presets button { width: auto; flex: 1 1 74px; text-align: center; }
  .desktop-interface .date-calendars { grid-template-columns: minmax(0,1fr); }
  .desktop-interface .date-footer { flex-wrap: wrap; }
  .desktop-interface .date-actions { flex-wrap: wrap; }
  .desktop-interface .login-view { padding: 24px 16px; }
  .desktop-interface .login-card { padding: 28px 24px; }
  .desktop-interface dialog { width: calc(100vw - 24px); max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); }
  .desktop-interface :is(dialog.air-dialog,dialog.sat-dialog,#rosterDialog,#accountDialog,#auditDialog,#accessPolicyDialog) { width: calc(100vw - 24px); max-width: calc(100vw - 24px); }
  .desktop-interface dialog .roster-dialog { width: 100%; min-width: 0; }
  .desktop-interface #overviewHome .ss-stores { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .desktop-interface #overviewHome .ss-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .desktop-interface #overviewHome .ss-intro { align-items: flex-start; flex-direction: column; }
  .desktop-interface #overviewHome .ss-live-indicator { text-align: left; }
  .desktop-interface #overviewHome .ss-controls :is(label,input,select) { max-width: 100%; min-width: 0; }
  .desktop-interface #overviewHome .ss-actions { width: 100%; }
  .desktop-interface #overviewHome .ss-search { flex: 1 1 200px; }
  .desktop-interface #overviewHome .ss-search input { width: 100%; }
}

@media (max-width: 599px) {
  .desktop-interface { --ui-topbar: 100px; --ui-tabs: 44px; --ui-space: 12px; }
  .desktop-interface #appTopbar { align-items: stretch; flex-direction: column; flex-wrap: nowrap; justify-content: center; gap: 6px; padding-block: 8px; }
  .desktop-interface .desktop-location { gap: 8px; }
  .desktop-interface .desktop-location h1 { overflow: hidden; text-overflow: ellipsis; }
  .desktop-interface .top-actions { flex: 0 0 auto; justify-content: flex-end; flex-wrap: nowrap; min-width: 0; }
  .desktop-interface .user-chip { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: 0; padding: 0; }
  .desktop-interface #desktopPreviewBadge { display: none; }
  .desktop-interface :is(.ws-grid,.pms-query,.pms-statuses,.pms-plans,.oi-thresholds,.account-form,.video-form,.video-reference-upload,.video-library-review,.video-job-filters) { grid-template-columns: minmax(0,1fr); }
  .desktop-interface :is(.ov-kpis,.metric-grid,.video-cost-summary,.fr-summary) { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .desktop-interface .video-form > *, .desktop-interface .pms-query > * { min-width: 0; grid-column: auto; }
  .desktop-interface .video-form .video-check { grid-template-columns: auto minmax(0,1fr); }
  .desktop-interface .pms-card { padding: 16px; }
  .desktop-interface .pms-submit { flex-direction: column; align-items: stretch; gap: 8px; }
  .desktop-interface :is(.table-footer,.plan-pager,.section-heading) { flex-wrap: wrap; gap: 8px; padding: 12px; }
  .desktop-interface :is(dialog.air-dialog,dialog.sat-dialog) { padding: 12px; }
  .desktop-interface dialog.sat-dialog .sat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .desktop-interface #overviewHome .ss-table-heading { align-items: flex-start; flex-direction: column; }
  .desktop-interface #overviewHome .ss-metrics strong { font-size: 22px; }
  .desktop-interface .cs-studio .cs-topbar { height: auto; min-height: 64px; padding: 12px; flex-wrap: wrap; }
}