/* Shared responsive shell. Data grids retain all columns inside their own scroll region. */
.mobile-menu-close,.mobile-menu-backdrop{display:none}
.mobile-table-scroll{max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}
.mobile-table-scroll:focus-visible{outline:3px solid #7c9d35;outline-offset:2px}
@media screen and (max-width:1023px){
 html .shell{display:block;min-height:100dvh}
 html .shell>main{min-width:0;width:100%}
 html .shell>.sidebar{position:fixed;inset:0 auto 0 0;width:min(330px,calc(100vw - 40px));height:100vh;height:100dvh;padding:24px 20px max(20px,env(safe-area-inset-bottom));display:flex;flex-direction:column;z-index:101;overflow-y:auto;overscroll-behavior-y:contain;box-shadow:8px 0 30px #102c2533}
 html .shell>.sidebar[hidden],html .mobile-menu-backdrop[hidden]{display:none}
 html:not(.mobile-nav-open) .shell>.sidebar{display:none}
 .mobile-nav-open body{overflow:hidden}
 html .sidebar .brand{flex-shrink:0;font-size:24px}
 html .sidebar .nav-label{display:block;flex-shrink:0;margin:24px 10px 10px}
 html .sidebar>nav{display:block;flex:1 1 auto;min-height:100px;overflow-y:auto;overflow-x:hidden;margin:0;scrollbar-width:thin;overscroll-behavior-y:contain}
 html .sidebar>nav a{display:flex;gap:12px;min-height:48px;padding:12px;font-size:14px;margin:0 0 4px;white-space:normal}
 html .sidebar>nav a span{display:block;flex-shrink:0;font-size:19px}
 html .sidebar .sidebar-bottom{display:block;flex-shrink:0;margin-top:16px;padding:14px 10px 0}
 html .sidebar .sidebar-bottom p{margin:8px 0}
 html .sidebar .user{flex-wrap:wrap;gap:8px;font-size:14px}
 html .sidebar .user a,html .sidebar .user button{min-height:44px;display:inline-flex;align-items:center}
 html .sidebar .menu-order-open{min-height:44px;margin-top:12px;flex-shrink:0}
 html .mobile-menu-close{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;margin-top:18px;padding:8px 12px;border:1px solid #728c7f;border-radius:5px;background:transparent;color:#f0f3e7;font:inherit;cursor:pointer;flex-shrink:0}
 .mobile-menu-close span{font-size:24px;line-height:1}
 html .mobile-menu-backdrop{display:block;position:fixed;inset:0;z-index:100;background:#102c256b;border:0;border-radius:0;width:100%;height:100%;padding:0;cursor:pointer}
 html .topbar{padding:12px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));gap:12px;min-height:68px;font-size:9px}
 html .topbar-start{flex-wrap:nowrap;gap:12px}
 html .sidebar-toggle{min-height:44px;min-width:88px;padding:10px 14px;font-size:14px}
 html .content,html.sidebar-collapsed .content{width:100%;max-width:none;padding:24px max(16px,env(safe-area-inset-right)) 30px max(16px,env(safe-area-inset-left))}
 html footer{padding:16px max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
 html .content :where(section,article,form,fieldset,details,.panel,.table-wrap){min-width:0;max-width:100%}
 html .content :where(img,video){max-width:100%;height:auto}
 html .content :where(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){min-width:0;max-width:100%;font-size:16px;min-height:44px}
 html .content input[type=checkbox],html .content input[type=radio]{width:auto;flex-shrink:0}
 html .content :where(button,.primary){min-height:44px;white-space:normal}
 html .content :where(.tabs,.pagination){flex-wrap:wrap;gap:8px}
 html .content .tabs a{min-height:44px;display:inline-flex;align-items:center;padding:10px 12px}
 html .content :where(.panel-heading,.management-heading,.search){flex-wrap:wrap}
 html .content .panel-heading{padding:16px;align-items:flex-start}
 html .content .panel-heading .link{white-space:normal;min-height:44px;display:inline-flex;align-items:center}
 html .content .notice{padding:16px;gap:12px}
 html .content :where(h1,h2,h3,p,dd,.mono,.badge){overflow-wrap:anywhere}
 html .content .badge{white-space:normal}
 html .content h1{font-size:clamp(28px,4.7vw,38px);line-height:1.16;letter-spacing:-.03em}
 html .content .table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
 html .content td,html .content th{padding:12px 14px}
 html .content td :where(input,select){min-width:90px}
 html .content .chart-legend{flex-wrap:wrap;gap:8px 16px;padding:12px 16px}
 html .content .business-chart{padding-inline:8px}
 html .content .mapping-card{grid-template-columns:minmax(0,1fr);padding:16px}
 html dialog{box-sizing:border-box;width:calc(100vw - 32px);max-width:600px;max-height:calc(100dvh - 32px);overflow:auto;padding:20px;margin:auto}
 html dialog::backdrop{background:#102c256b}
 html .account-view-banner{padding:14px 16px}
}
@media screen and (max-width:600px){
 html .topbar-start>span{font-size:8px;letter-spacing:.6px}
 html .topbar .environment{display:none}
 html .content .metrics{grid-template-columns:minmax(0,1fr);gap:10px;margin:20px 0}
 html .content .metric{padding:18px}
 html .content .metric strong{font-size:32px;margin:10px 0}
 html .content .metric>span{font-size:13px}
 html .content .metric em{font-size:12px}
 html .content .source-grid{grid-template-columns:minmax(0,1fr)}
 html .content .source-card{padding:18px;border-right:0}
 html .content .source-card p,html .content .notice p{font-size:13px}
 html .content .source-type{font-size:10px}
 html .content .primary{font-size:14px}
 html .content .management-cards,html .content .management-charts{grid-template-columns:minmax(0,1fr)}
 html .content .issue{display:block;padding:16px}
 html .content .resolution{width:100%;margin-top:16px}
 html .content .md-range{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
 html .content .md-range label{width:100%;min-width:0}
 html .content .md-range input,html .content .md-range select{width:100%;min-width:0}
 html .content .md-cabinets span{font-size:13px;min-height:44px;display:flex;align-items:center}
 html .content .md-grid{grid-template-columns:minmax(0,1fr)}
 html .content .md-card{padding:18px 16px}
 html .content .md-card h2{font-size:14px}
 html .content .md-card dl{font-size:13px}
 html .content .md-card dd{white-space:normal;min-width:0}
 html .content .md-help summary{width:32px;height:32px;line-height:30px;font-size:14px}
 html .content .md-help p{width:min(280px,calc(100vw - 72px));top:28px}
 html .content .access-savebar{gap:10px;flex-wrap:wrap;padding-bottom:max(12px,env(safe-area-inset-bottom))}
 html .content .access-dirty{white-space:normal}
 html .content .access-page.has-editor,html .content .access-role-page{padding-bottom:140px}
 html .content .access-page.has-editor .access-savebar,html .content .access-role-page .access-savebar{left:12px;right:12px;padding:12px 14px max(12px,env(safe-area-inset-bottom))}
 html .login-card{padding:28px 22px;width:min(calc(100vw - 32px),440px)}
 html .login-card input,html .login-card button{font-size:16px;min-height:44px}
}
@media(prefers-reduced-motion:reduce){html .metric,html .sidebar,html .sidebar-toggle{transition:none;animation:none}}

/* static/account_access.css */
@media screen and (max-width:850px){
 .access-page.has-editor .access-savebar,.access-role-page .access-savebar{left:12px;right:12px;flex-wrap:wrap;gap:8px;padding-bottom:max(12px,env(safe-area-inset-bottom))}
 .access-page.has-editor,.access-role-page{padding-bottom:calc(140px + env(safe-area-inset-bottom))}
 .access-dirty{white-space:normal}.access-person-top{flex-wrap:wrap}.access-share>div{min-width:0;flex-basis:100%}
}

/* static/advertising.css */
@media screen and (max-width:400px){.ad-kpis,.ad-ratios{grid-template-columns:minmax(0,1fr)}}

/* static/calendar_plan.css */
@media screen and (max-width:600px){
 .cal-heading{flex-wrap:wrap}.cal-source-states{grid-template-columns:minmax(0,1fr)}.cal-nav form{flex-wrap:wrap;min-width:0;max-width:100%}
 .cal-nav input,.cal-nav select{min-width:0;max-width:100%}.cal-operation-dialog{box-sizing:border-box}
}

/* static/manager_cabinet.css */
@media screen and (max-width:600px){
 .mc-heading{flex-wrap:wrap;align-items:flex-start}.mc-tabs{max-width:100%;overflow-x:auto;gap:16px}.mc-tabs>*{flex:0 0 auto}
 .mc-table th:first-child,.mc-forecast .mc-table th:first-child{min-width:140px;width:145px;max-width:160px}
 .mc-panel,.mc-table-scroll,.mc-control,.mc-chart{min-width:0;max-width:100%}.mc-control{flex-basis:100%}.mc-search{min-width:0}
 .mc-chart{padding-left:10px;padding-right:10px}
}

/* static/plan_fact.css */
@media screen and (max-width:480px){
 .pf-page .pf-chart .pf-bar-row{grid-template-columns:minmax(0,1fr) 95px}.pf-bar-label{grid-column:1/-1}
 .pf-products .pf-product-identity{min-width:135px;width:145px;max-width:145px}
 .pf-export-dialog-footer>div{flex-wrap:wrap;margin-left:0;width:100%}.pf-export-dialog-footer>div>*{flex:1}
 .pf-kpi-date{grid-template-columns:minmax(0,1fr)}
}

/* static/production_plan.css */
@media screen and (max-width:600px){
 .ps-table .ps-forecast-balance,.ps-table tbody tr:hover>.ps-forecast-balance{position:static;left:auto!important;right:auto!important;box-shadow:none}
 .ps-table thead .ps-forecast-balance{position:sticky;top:0;z-index:3}
 .ps-table .ps-balance{left:auto!important;right:auto!important}
 .ps-table .ps-name{max-width:145px;overflow-wrap:anywhere}
 .pp-save{position:static}.pp-controls label,.pp-toolbar label,.ps-toolbar label{min-width:0}
}

/* static/purchasing.css */
@media screen and (max-width:600px){
 .buyer-save label{min-width:0;flex-basis:100%}.buyer-save{flex-wrap:wrap}.buyer-workspace select{max-width:100%}
 .buyer-dialog-footer{flex-wrap:wrap;padding-bottom:max(12px,env(safe-area-inset-bottom))}.production-months{flex-wrap:wrap}
}

/* templates/dds_expense_style.html */
@media screen and (max-width:480px){
 .allocation-line{grid-template-columns:minmax(0,1fr) 44px}.allocation-line>.dds-article-field{grid-column:1/-1}
 .dds-single .allocation-line{grid-template-columns:minmax(0,1fr)}.dds-expense-item{grid-template-columns:minmax(0,1fr)}
 .dds-expense-value{align-items:flex-start}.dds-editor-actions{flex-wrap:wrap;padding-bottom:max(12px,env(safe-area-inset-bottom))}
 .dds-editor-head{gap:10px}.dds-editor-head h2{min-width:0;overflow-wrap:anywhere}
}

/* templates/finance_reports.html */
@media screen and (max-width:760px){
 .fw-grid>*,.fs-grid>*{min-width:0;max-width:100%}
 .fw input,.fw select,.fw textarea,.fs input,.fs select,.fs textarea{min-width:0;width:100%;box-sizing:border-box}
 .fw-table td,.fs-table td{overflow-wrap:anywhere;flex-wrap:wrap;white-space:normal}
 .fw-table td>*,.fs-table td>*{min-width:0;max-width:100%}
 .fw-summary-row,.fr-row{flex-wrap:wrap}.fw-summary-row>span,.fr-row>span{min-width:0;overflow-wrap:anywhere}
 .fw-summary-row strong,.fr-row strong{margin-left:auto;max-width:100%}
}

/* templates/finance_stage2_styles.html */
@media screen and (max-width:760px){
 .fw-grid>*,.fs-grid>*{min-width:0;max-width:100%}
 .fw input,.fw select,.fw textarea,.fs input,.fs select,.fs textarea{min-width:0;width:100%;box-sizing:border-box}
 .fw-table td,.fs-table td{overflow-wrap:anywhere;flex-wrap:wrap;white-space:normal}
 .fw-table td>*,.fs-table td>*{min-width:0;max-width:100%}
 .fw-summary-row,.fr-row{flex-wrap:wrap}.fw-summary-row>span,.fr-row>span{min-width:0;overflow-wrap:anywhere}
 .fw-summary-row strong,.fr-row strong{margin-left:auto;max-width:100%}
}

/* templates/finance_workspace.html */
@media screen and (max-width:760px){
 .fw-grid>*,.fs-grid>*{min-width:0;max-width:100%}
 .fw input,.fw select,.fw textarea,.fs input,.fs select,.fs textarea{min-width:0;width:100%;box-sizing:border-box}
 .fw-table td,.fs-table td{overflow-wrap:anywhere;flex-wrap:wrap;white-space:normal}
 .fw-table td>*,.fs-table td>*{min-width:0;max-width:100%}
 .fw-summary-row,.fr-row{flex-wrap:wrap}.fw-summary-row>span,.fr-row>span{min-width:0;overflow-wrap:anywhere}
 .fw-summary-row strong,.fr-row strong{margin-left:auto;max-width:100%}
}

/* Page-specific form rules must not shrink controls below the iOS/touch floor. */
@media screen and (max-width:1023px){
 html .shell .content :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){font-size:16px!important;min-height:44px!important}
 html .shell .content button{min-height:44px!important}
 html .shell .content .dep-net-node{min-height:72px!important}
 html .shell .content .allocation-line>label:first-child{min-width:0}
}
@media screen and (max-width:480px){html .shell .content .allocation-line>.dds-article-field,html .shell .content .allocation-line>label:first-child{grid-column:1/-1}}
@media screen and (max-width:1023px){
 html .shell .content .wg-section{margin-bottom:24px}
 html .shell .content .wg-tabs{max-width:100%;display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;padding:4px 2px 12px;gap:8px}
 html .shell .content .wg-tabs a{flex:0 0 auto;min-height:44px;max-width:240px;font-size:14px;padding:10px 14px;white-space:normal}
}
@media screen and (max-width:600px){
 html .shell .content .business-chart,html .shell .content .mc-chart{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}
 html .shell .content .business-chart svg,html .shell .content .mc-chart svg{min-width:1000px;max-width:none}
 html .shell .content .price-chart{overflow-x:auto;overscroll-behavior-x:contain}
 html .shell .content .price-chart svg{min-width:300px;max-width:none}
}
@media print{.mobile-table-scroll{display:contents;overflow:visible}.mobile-menu-close,.mobile-menu-backdrop{display:none!important}}
@media screen and (max-width:1023px){html .shell [hidden]:not([hidden="until-found"]){display:none!important}}
/* Native dialogs live in the top layer, and AJAX editors may be appended outside main. */
@media screen and (max-width:1023px){
 html :is(dialog,.dds-editor-dialog) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){font-size:16px!important;min-height:44px!important;min-width:0;max-width:100%;box-sizing:border-box}
 html :is(dialog,.dds-editor-dialog) button{min-height:44px!important}
 html .dds-editor-dialog .dds-editor-actions{padding-bottom:max(12px,env(safe-area-inset-bottom));flex-wrap:wrap}
}
