/* Review beta: shared phone/tablet layout. Financial behavior is unchanged. */
@media (max-width:820px) {
  html { -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-padding-top:164px; }
  html:root body:is(.msp-product,.msp-access,.msp-onboarding) { min-width:0; }
  html:root body .demo-banner { height:44px; padding:0 8px; gap:6px; font-size:12px; }
  html:root body .demo-banner>span { font-size:0; max-width:none; flex-shrink:0; }
  html:root body .demo-banner>span::before { content:'BETA · DEMO'; font:500 11px/1.2 'DM Sans',Arial,sans-serif; }
  html:root body .demo-banner>a { display:none; }
  html:root body .demo-banner>button { min-height:44px; margin:0; padding:0 4px; width:auto; font-size:0; flex-shrink:0; }
  html:root body .demo-banner>button::after { content:'Restablecer'; font:400 12px/1.3 'DM Sans',Arial,sans-serif; }
  html:root body .demo-banner .module-switcher { margin-left:auto; }
  html:root body .demo-banner .module-switcher>summary { min-height:40px; padding:0 8px; font-size:12px; gap:6px; }
  html:root body .demo-banner .module-switcher nav.module-menu { position:fixed; top:50px; right:8px; max-height:calc(100dvh - 64px); }
  html:root body .demo-banner .module-switcher nav.module-menu a { min-height:44px; display:flex; align-items:center; }

  html:root body:is(.msp-app,.msp-financial) { padding-top:44px!important; }
  html:root body:is(.msp-app,.msp-financial) .sidebar { display:none!important; }
  html:root body:is(.msp-app,.msp-financial) .topbar {
    position:fixed!important; top:44px!important; left:0!important; right:0; margin-left:0!important;
    height:56px!important; min-height:56px!important; padding:6px 12px!important;
    display:flex!important; gap:8px!important; align-items:center; z-index:70;
  }
  html:root body:is(.msp-app,.msp-financial) .topbar .top-right { display:flex!important; width:100%; min-width:0; gap:8px!important; align-items:center; }
  html:root body:is(.msp-app,.msp-financial) .topbar .top-right>.user-wrap { display:block!important; }
  html:root body:is(.msp-app,.msp-financial) .topbar :is(.store-wrap,.shell-store) { flex:1; min-width:0; }
  html:root body:is(.msp-app,.msp-financial) .topbar .top-right :is(.store-chip,.shell-store .shell-chip) {
    display:flex!important; width:100%!important; max-width:none!important; min-width:0!important;
    height:44px!important; padding:0 8px!important; font-size:13px!important; gap:6px;
  }
  html:root body:is(.msp-app,.msp-financial) .topbar .top-right>.store-chip { flex:1; }
  html:root body:is(.msp-app,.msp-financial) .topbar :is(#storeName,.shell-name) { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
  html:root body:is(.msp-app,.msp-financial) .topbar .top-right :is(.theme-toggle,.icon-btn,.msp-preview-user-button) { width:44px!important; height:44px!important; min-width:44px!important; flex-shrink:0; }
  html:root body:is(.msp-app,.msp-financial) .main { margin-left:0!important; min-width:0; width:auto!important; padding:74px 16px calc(84px + env(safe-area-inset-bottom))!important; }
  html:root body:is(.msp-app,.msp-financial) .topbar:has(>.global-search,>.search) { height:108px!important; min-height:108px!important; flex-wrap:wrap; align-content:center; }
  html:root body:is(.msp-app,.msp-financial) .topbar>:is(.global-search,.search) { display:block!important; order:2; flex:1 1 100%; width:100%; max-width:none; min-width:0; }
  html:root body:is(.msp-app,.msp-financial):has(.topbar>.global-search,.topbar>.search) .main { padding-top:126px!important; }
  html:root body:is(.msp-app,.msp-financial) .topbar :is(.global-search input,.search input) { height:44px!important; font-size:16px!important; }
  html:root body:is(.msp-app,.msp-financial) .topbar :is(.global-search svg,.search svg) { top:12px!important; }
  html:root body:is(.msp-app,.msp-financial) .topbar :is(.notification-panel,.store-menu,.shell-menu,.msp-preview-user-menu) { position:fixed!important; top:104px!important; right:12px!important; left:auto; width:min(320px,calc(100vw - 24px)); max-width:calc(100vw - 24px); max-height:calc(100dvh - 120px); overflow:auto; }
  html:root body:is(.msp-app,.msp-financial) .topbar :is(.notification-panel,.store-menu,.shell-menu,.msp-preview-user-menu) :is(a,button) { min-height:44px; }
  html:root body .msp-mobile-nav { top:auto!important; height:auto!important; bottom:max(12px,env(safe-area-inset-bottom))!important; }
  html:root body .msp-mobile-nav>summary,html:root body .msp-mobile-nav nav a { min-height:44px; font-size:14px; }

  html:root body.msp-product :is(.main,.workspace-grid,.dashboard-grid,.panel,.table-card,.card,.section,.results,.drawer-body)>* { min-width:0; }
  html:root body.msp-product :is(.page-head,.head) { gap:14px; }
  html:root body.msp-product :is(.page-head h1,.head h1) { font-size:30px!important; line-height:1.2!important; }
  html:root body.msp-product :is(.page-head p,.head p,.section-help,.finance-note,.drawer-sub,#fiscalScenarioHelp,.hint,.notice) { font-size:14px!important; line-height:1.6!important; overflow-wrap:anywhere; }
  html:root body:is(.msp-product,.msp-access,.msp-onboarding) :is(input:not([type=radio]):not([type=checkbox]):not([type=hidden]),select,textarea) { font-size:16px!important; min-height:44px!important; max-width:100%; }
  html:root body.msp-product :is(.field label,.form label,.fiscal-box label,.price-control label) { font-size:14px!important; line-height:1.5; }
  html:root body.msp-product :is(.primary,.secondary,.save,.action-btn,.btn,.button,.tab,.textbtn,.page-btn,.filter-control,.ps-confirm,.ps-cancel,.ps-modal-close,.close,.inline-action,.category-picker>summary) { min-height:44px!important; font-size:14px!important; }
  html:root body.msp-product :is(.page-btn,.close,.ps-modal-close) { min-width:44px; }
  html:root body.msp-product :is(.toolbar,.filters,.tabs,.drawer-actions,.finance-actionbar,.pager-controls) { gap:10px; flex-wrap:wrap; }
  html:root body.msp-product :is(.table-wrap,.finance-table-wrap,.table-card,.scenario-table-wrap) { min-width:0; max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; }
  html:root body.msp-product :is(.data-table,.finance-table) :is(th,td) { font-size:13px!important; }
  html:root body.msp-product .data-table { min-width:1120px!important; }
  html:root body.msp-product .finance-table { min-width:600px; }
  html:root body.msp-product .drawer-backdrop { top:44px; height:calc(100dvh - 44px); }
  html:root body.msp-product :is(.drawer,.drawer.finance-drawer) { width:100%!important; max-width:100%!important; height:100%; border-radius:0!important; padding:20px 16px calc(24px + env(safe-area-inset-bottom)); overflow-y:auto; overscroll-behavior-y:contain; }
  html:root body.msp-product .drawer-head { gap:12px; }
  html:root body.msp-product .ps-dialog { max-width:100%; width:100%; max-height:calc(100dvh - 72px); overflow-y:auto; }
  html:root body.msp-access { padding:64px 16px 28px!important; }
  html:root body.msp-onboarding { padding-top:44px!important; }
  html:root body.msp-onboarding header { min-height:0; padding:20px 16px!important; }
  html:root body.msp-onboarding .wrap { padding:28px 16px 40px!important; }
}
@media (max-width:600px) {
  html:root body.msp-product :is(.workspace-grid,.dashboard-grid,.side-stack,.cost-core-grid,.confirm-grid,.detail-grid,.form-row,.general-grid,.team-grid,.plans) { grid-template-columns:minmax(0,1fr)!important; }
  html:root body.msp-product :is(.selected-product,.panel,.form,.fiscal-box) { min-width:0; }
  html:root body.msp-product .extra-row { grid-template-columns:minmax(0,1fr) 96px 44px; gap:6px; }
  html:root body.msp-product .finance-actionbar { flex-direction:column; align-items:stretch; }
  html:root body.msp-product .drawer-actions>button { flex:1 1 140px; }
  html:root body.msp-product .summary { grid-template-columns:1fr!important; }
  html:root body.msp-product .summary .kpi { padding:16px!important; min-height:96px!important; }
  html:root body.msp-product .summary .kpi-label { font-size:13px!important; min-height:0!important; }
  html:root body.msp-product .summary .kpi-value { font-size:28px!important; }
  html:root body.msp-product .summary :is(.comparison-caption,.kpi-change) { font-size:12px!important; }
  html:root body.msp-financial .pnl-row { font-size:14px!important; }
  html:root body.msp-financial .pnl-row :is(strong,.value) { font-size:14px!important; }
  html:root body.msp-onboarding .step { grid-template-columns:32px minmax(0,1fr); gap:12px; }
  html:root body.msp-onboarding .card { padding:20px 16px!important; }
  html:root body.msp-onboarding h1 { font-size:32px!important; }
  html:root body.msp-product>main:not(.main) { padding:28px 16px; }
  html:root body.msp-product>main:not(.main) header { gap:16px; flex-wrap:wrap; }
  html:root body.msp-product>main:not(.main) .screen p { font-size:14px; }
}

/* Complete mobile pass, loaded after module readability and account/help layouts. */
@media(max-width:820px){
 html:root body.msp-product .app{min-width:0}
 html:root body.msp-product .topbar .top-right{flex-shrink:1;min-width:0}
 html:root body.msp-product:is(.msp-app,.msp-financial) .topbar .top-right .msp-preview-user-button{width:44px!important;min-width:44px!important;max-width:44px!important;height:44px!important}
 html:root body.msp-product:is(.msp-app,.msp-financial) .topbar .top-right .msp-preview-user-menu{position:fixed!important;top:104px!important;right:12px!important;max-height:calc(100dvh - 120px);overflow:auto}
 html:root body.msp-product .main{padding-bottom:calc(188px + env(safe-area-inset-bottom))!important}
 html:root body.msp-product .first-steps-progress{min-width:0!important;max-width:100%}
 html:root body.msp-product .first-steps-head{flex-wrap:wrap}
 html:root body.msp-product :is(.panel,.section){min-width:0;max-width:100%}
 html:root body.msp-product :is(.workspace-grid,.dashboard-grid,.layout){min-width:0;grid-template-columns:minmax(0,1fr)!important}
 html:root body.msp-product :is(.toolbar,.filters) :is(.field,.filter-control){min-width:0;max-width:100%}
 html:root body.msp-financial #filters.filters{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;padding:16px!important}
 html:root body.msp-financial #filters>.hint{grid-column:1/-1;text-align:left!important;justify-self:start!important}
 html:root body.msp-financial #filters :is(.period-field,.field,.account-name,select){width:100%!important;min-width:0!important}
 html:root body.msp-product .period-picker>summary{min-height:44px!important;font-size:15px!important}
 html:root body.msp-product :is(.period-menu,.locality-popover){max-width:100%;min-width:0}
 html:root body.msp-product .main :is(.scenario-table,.finance-table){font-size:14px!important}
 html:root body.msp-product .scenario-table{min-width:460px}
 html:root body.msp-product .scenario-table :is(th,td){font-size:14px!important;line-height:1.5!important}
 html:root body.msp-product :is(.finance-summary,.scenario-grid,.compare-grid){grid-template-columns:repeat(2,minmax(0,1fr))!important;min-width:0}
 html:root body.msp-product .drawer-body{min-width:0}
 html:root body.msp-product :is(.finance-action-bar,.cost-history-footer){display:flex;flex-wrap:wrap;gap:12px}
 html:root body.msp-product .finance-action-bar>button{min-height:44px;font-size:15px;white-space:normal}
 html:root body.msp-product .price-control{display:flex;flex-direction:column;align-items:stretch;gap:12px}
 html:root body.msp-product .price-input{width:100%;min-width:0;min-height:48px}
 html:root body.msp-product .commercial-card{flex-wrap:wrap;gap:12px}
 html:root body.msp-product :is(.select-product,.clear-search){min-width:44px;min-height:44px;font-size:14px}
 html:root body.msp-product .select-product{width:auto;padding:8px 12px}
 html:root body.msp-product :is(.result-row,.selected-product.open){grid-template-columns:44px minmax(0,1fr)!important}
 html:root body.msp-product .result-row .select-product{grid-column:1/-1;justify-self:stretch}
 html:root body.msp-product .result-title{white-space:normal;font-size:15px!important;line-height:1.5}
 html:root body.msp-product .result-meta{font-size:13px!important;line-height:1.5}
 html:root body.msp-product .selected-product .metric{grid-column:1/-1;min-width:0;gap:12px;flex-wrap:wrap}
 html:root body.msp-access :is(.shell,.card,.form){min-width:0;max-width:100%}
 html:root body.msp-access{padding-bottom:calc(180px + env(safe-area-inset-bottom))!important}
 html:root body.msp-access :is(label,.message,.back){font-size:15px!important;line-height:1.6}
 html:root body.msp-access :is(button,.btn){min-height:44px;font-size:16px!important}
 html:root body.msp-onboarding .wrap{padding-bottom:calc(180px + env(safe-area-inset-bottom))!important}
 html:root body .msp-review-feedback:not(.feedback-in-dialog){bottom:max(72px,calc(env(safe-area-inset-bottom) + 60px));right:12px;max-width:calc(100vw - 24px)}
 html:root body .msp-review-dialog{max-height:calc(100dvh - 24px);scroll-padding:16px}
 html:root body .msp-review-feedback.feedback-in-dialog{position:static;padding:12px 0;max-width:100%}
 html:root body .msp-mobile-nav nav{max-height:calc(100dvh - 140px);max-width:calc(100vw - 24px)}
}
@media(max-width:600px){
 html:root body.msp-product :is(.finance-summary,.scenario-grid,.compare-grid,.cards,#flexForm .form){grid-template-columns:minmax(0,1fr)!important}
 html:root body.msp-financial #filters.filters{grid-template-columns:minmax(0,1fr)!important}
 html:root body.msp-financial #pnlListView :is(.pnl-head,.pnl-row){grid-template-columns:minmax(0,1fr) 60px minmax(0,1fr)!important;gap:8px!important;min-width:0;padding:14px 10px!important;align-items:center!important}
 html:root body.msp-financial #pnlListView :is(.pnl-head,.pnl-row)>:first-child{grid-column:1/-1!important;grid-row:auto!important;min-width:0;line-height:1.6}
 html:root body.msp-financial #pnlListView :is(.pnl-head,.pnl-row)>:nth-child(2){grid-column:1!important;grid-row:auto!important;text-align:center!important;white-space:normal;overflow-wrap:anywhere}
 html:root body.msp-financial #pnlListView :is(.pnl-head,.pnl-row)>:nth-child(3){grid-column:2!important;grid-row:auto!important;text-align:center!important;white-space:normal}
 html:root body.msp-financial #pnlListView :is(.pnl-head,.pnl-row)>:nth-child(4){grid-column:3!important;grid-row:auto!important;max-width:100%;text-align:center!important;white-space:normal;overflow-wrap:anywhere}
 html:root body.msp-product .cost-editor .extra-row{grid-template-columns:minmax(0,1fr) 44px!important;gap:8px}
 html:root body.msp-product .cost-editor .extra-row>input:nth-of-type(2){grid-column:1;grid-row:2}
 html:root body.msp-product .cost-editor .extra-row>button{grid-column:2;grid-row:1/span 2;min-height:44px;min-width:44px;align-self:start}
 html:root body.msp-product .ps-dialog{max-height:calc(100dvh - 24px)!important}
 html:root body.msp-product .main :is(.info-pop,.cost-history-popover){max-width:calc(100vw - 48px);overflow-wrap:anywhere}
 html:root body.msp-product .msp-review-inline button{flex:1 1 125px}
}
