
/* Phone / high-resolution phone. The 941px reference is intentionally treated as phone UI. */
@media (max-width:1000px){
  :root{--bottomnav-h:76px;--font-size-body:14px;--height-input:44px;--height-btn:46px}
  body{font-size:14px}.topbar{height:74px;grid-template-columns:120px 1fr 120px;padding:0 20px}.brand strong{font-size:24px}.brand span{font-size:12px}
  .main{padding:16px 16px calc(var(--bottomnav-h) + 18px);width:100%;max-width:100%;overflow-x:hidden}
  .screen{width:100%;max-width:100%;overflow-x:hidden}.table-wrap{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .screen-head{margin-bottom:11px}.screen-head h1{font-size:27px}.title-icon{width:46px;height:46px;border-radius:14px}.head-select{min-height:40px}
  .card{padding:13px}.kpi{min-height:86px}.chart-svg{height:155px}.chart-card{grid-template-columns:1fr 220px}
  .data-table{min-width:820px}.data-table th,.data-table td{font-size:11px;padding:8px 7px}.thumb{width:42px;height:36px}
  .bottomnav{display:grid}.desktop-only{display:none!important}
}
@media (max-width:700px){
  :root{--height-input:39px;--height-btn:41px;--bottomnav-h:69px;--font-size-body:12px}
  body{font-size:12px}.statusbar{height:30px;padding:0 12px;font-size:12px}.statusbar .island{width:102px;height:21px;top:5px}
  .topbar{height:62px;grid-template-columns:82px 1fr 82px;padding:0 10px}.brand strong{font-size:19px}.brand span{font-size:9px}.top-actions{gap:5px}.icon-btn{width:32px;height:32px}.topbar .menu-trigger{padding:6px}
  .main{padding:10px 8px calc(var(--bottomnav-h) + 9px)}.screen-head{min-height:44px;margin-bottom:8px}.screen-head h1{font-size:20px}.title-icon{width:36px;height:36px;border-radius:11px}.head-select{padding:6px 8px;font-size:10px;min-height:34px}
  .searchbar{height:38px;margin-bottom:9px;padding:0 9px}.card{padding:9px;border-radius:13px}.card-title h2,.card-title h3,.section-title{font-size:12px}
  .grid,.split,.two,.three,.five,.form-grid{gap:7px}.kpis{gap:6px}.kpi{min-height:70px;padding:8px;border-radius:12px}.kpi strong{font-size:16px;margin-top:3px}.kpi small{font-size:9px}.kpi .icon{width:21px;height:21px}
  .summary{gap:6px}.summary-box{padding:8px}.summary-box strong{font-size:15px}.field label{font-size:9px}.control{padding:0 7px;border-radius:9px}.action-row{gap:6px}.action-row .btn{min-width:82px;padding:0 8px;font-size:10px}.btn-sm{height:29px;padding:0 7px}
  .table-wrap{border-radius:11px}.data-table{min-width:700px}.data-table th,.data-table td{padding:6px 5px;font-size:9px}.thumb{width:34px;height:29px}.chart-card{grid-template-columns:1fr 132px;gap:7px}.chart-svg{height:112px}.chart-side strong{font-size:18px}
  .segmented button{padding:6px 8px;min-width:58px;font-size:9px}.subnav{gap:4px}.subnav button{padding:7px 3px;font-size:9px}.bottomnav button{font-size:9px}.bottomnav .fab{width:46px;height:46px}
}
@media (max-width:470px){
  .grid-4,.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-5{grid-template-columns:repeat(3,minmax(0,1fr))}.split{grid-template-columns:1fr}.summary{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .chart-card{grid-template-columns:1fr}.chart-side{display:flex;justify-content:space-between;align-items:end;gap:8px}.chart-side strong{font-size:17px}.three,.five{grid-template-columns:repeat(3,1fr)}
}
/* Desktop: fixed right navigation, content gets its own explicit column. */
@media (min-width:1024px){
  .statusbar{display:none}.topbar{height:72px;position:fixed;top:0;left:0;right:var(--sidebar-w);z-index:35}.topbar .menu-trigger{display:none}.top-actions{justify-self:start}.brand{text-align:center;justify-self:center}.brand strong{font-size:22px}
  .shell{display:block;padding-right:var(--sidebar-w);padding-top:72px}.sidebar{position:fixed;right:0;left:auto;top:0;bottom:0;width:var(--sidebar-w);transform:none;box-shadow:-4px 0 18px rgba(21,51,91,.08);z-index:50;padding-top:18px}.sidebar .close-side{display:none}.sidebar-head{height:44px}
  .main{display:block;padding:26px 30px 40px;max-width:none;margin:0}.bottomnav{display:none}.overlay{display:none!important}.screen-head{margin-bottom:16px}.screen{max-width:1500px;margin:0 auto}.kpis{grid-template-columns:repeat(4,1fr)}.card{padding:16px}.data-table th,.data-table td{font-size:13px}.data-table{min-width:760px}.chart-svg{height:220px}.chart-card{grid-template-columns:1fr 310px}
}
@media (min-width:1600px){:root{--sidebar-w:290px}.main{padding:30px 42px}.screen{max-width:1600px}}

/* Dashboard responsive fidelity */
@media(max-width:700px){.dashboard-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.dashboard-kpi{min-height:72px;padding:8px}.dashboard-kpi strong{font-size:17px}.dashboard-kpi .dash-icon{width:34px;height:34px;border-radius:10px}.dashboard-chart{grid-template-columns:1fr}.dashboard-chart .chart-meta{display:flex;align-items:end;justify-content:space-between;gap:8px}.dashboard-chart .chart-meta strong{font-size:20px}.quick-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.quick-card{min-height:72px;padding:7px 3px;font-size:9px}.quick-card .quick-icon{width:32px;height:32px}.dashboard-panes{grid-template-columns:1fr}.module-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.module-card{min-height:55px;padding:7px;font-size:10px}.module-icon{width:32px;height:32px}.dashboard-welcome{align-items:flex-start}.dashboard-period{font-size:9px;padding:6px 7px}}
@media(min-width:1024px){.dashboard-kpis{grid-template-columns:repeat(4,1fr)}.quick-grid{grid-template-columns:repeat(5,1fr)}.module-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.dashboard-panes{grid-template-columns:1fr 1fr}}

/* =========================================================
   2026 MODERN RESPONSIVE OVERRIDES
   ========================================================= */
@media (max-width:1000px){
  .statusbar{display:none!important}
  .topbar{height:60px;grid-template-columns:78px 1fr 78px;padding:0 9px}.brand strong{font-size:19px}.brand span{font-size:9.5px}.top-actions{gap:4px}.icon-btn{width:34px;height:34px;border-radius:11px}.topbar .menu-trigger{width:34px;height:34px;padding:5px}
  .main{padding-top:11px}.screen-head h1{font-size:23px}.screen-head{min-height:48px}.title-icon{width:39px;height:39px}
  .quick-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.quick-card{min-height:104px}.quick-card .quick-icon{width:59px;height:59px;border-radius:18px}
  .module-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 5px}.module-card{min-height:91px}.module-icon{width:55px;height:55px;border-radius:16px}.module-card>span:last-child{font-size:9.8px;max-width:84px}
  .dashboard-block-title{margin-top:12px}
}
@media (max-width:470px){
  .topbar{height:58px}.brand strong{font-size:18px}.brand span{font-size:9px}
  .main{padding:8px 7px calc(var(--bottomnav-h) + 10px)}.screen-head h1{font-size:19px}
  .quick-card{min-height:96px;border-radius:18px;font-size:11px}.quick-card .quick-icon{width:54px;height:54px;border-radius:16px}.quick-card .quick-icon .icon{width:27px;height:27px}
  .module-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:11px 2px}.module-card{min-height:84px;padding:2px 0}.module-icon{width:50px;height:50px;border-radius:15px}.module-card .icon{width:24px;height:24px}.module-card>span:last-child{font-size:8.8px;max-width:76px}
  .dashboard-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-kpi{min-height:76px;padding:9px}.dashboard-kpi strong{font-size:18px}.dashboard-kpi .dash-icon{width:37px;height:37px}
}
@media (min-width:1024px){
  :root{--sidebar-w:216px}
  .statusbar{display:none!important}.topbar{height:64px;right:var(--sidebar-w);grid-template-columns:96px 1fr 96px;padding:0 14px}.brand strong{font-size:20px}.brand span{font-size:10px}
  .shell{padding-right:var(--sidebar-w);padding-top:64px}.sidebar{width:var(--sidebar-w);padding:11px 10px;box-shadow:-4px 0 16px rgba(21,51,91,.07)}.sidebar-head{height:42px;margin-bottom:8px}.sidebar-head strong{font-size:15px}.sidebar-head .muted{font-size:10px}.nav-list{gap:2px}.nav-link{padding:6px 7px;font-size:11px;border-radius:10px}.nav-link .nav-icon-shell{width:29px;height:29px}.nav-link .num{font-size:8px}.sidebar-divider{margin:9px 0}.sidebar-state{gap:4px}.sidebar-state button{padding:6px 2px;font-size:9px}
  .main{padding:22px 24px 34px}.screen{max-width:1540px}.screen-head h1{font-size:27px}
  .quick-grid{grid-template-columns:repeat(3,minmax(0,190px));justify-content:start;direction:rtl;gap:12px}.quick-card{min-height:116px}.quick-card .quick-icon{width:65px;height:65px}
  .module-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:16px 8px}.module-card{min-height:102px}.module-icon{width:60px;height:60px}.module-card>span:last-child{font-size:10.5px}
  .dashboard-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (min-width:1600px){:root{--sidebar-w:224px}.module-grid{grid-template-columns:repeat(10,minmax(0,1fr))}.main{padding:24px 30px 38px}}

/* =========================================================
   COMPACT DRAWER + SECTION RIBBON RESPONSIVE OVERRIDES
   ========================================================= */
@media (max-width:1000px){
  .sidebar{width:var(--sidebar-mobile-w);max-width:76vw;padding:10px 8px}
  .nav-link{min-height:39px;padding:4px 5px;font-size:11px}.nav-link .nav-icon-shell{width:29px;height:29px;border-radius:9px}.nav-link .num{display:none}
  .screen-head{min-height:62px;padding:8px 10px;border-radius:16px;gap:8px}.screen-head-main{gap:8px}.screen-head-icon{width:41px;height:41px;border-radius:13px}.screen-head-icon svg.icon{width:23px;height:23px}.screen-head h1{font-size:21px;letter-spacing:-.35px}.screen-kicker{font-size:8px}.screen-head-action{max-width:45%}.screen-head .head-select,.screen-head .dashboard-period{min-height:35px;padding:7px 8px;font-size:10px;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
}
@media (max-width:470px){
  .sidebar{width:min(72vw,var(--sidebar-mobile-w));padding:9px 7px}.sidebar-head strong{font-size:14px}.nav-link{min-height:37px;font-size:10.5px}.nav-link .nav-icon-shell{width:28px;height:28px}.nav-link .nav-icon-shell svg.icon{width:16px;height:16px}
  .screen-head{min-height:57px;padding:7px 8px;border-radius:15px}.screen-head-icon{width:37px;height:37px;border-radius:12px}.screen-head-icon svg.icon{width:21px;height:21px}.screen-head h1{font-size:18px;line-height:1.18}.screen-kicker{display:none}.screen-head-action{max-width:43%}.screen-head .head-select,.screen-head .dashboard-period{min-height:32px;padding:5px 6px;font-size:8.8px;border-radius:10px}.screen-head .head-select svg.icon,.screen-head .dashboard-period svg.icon{width:14px;height:14px}
}
@media (min-width:1024px){
  :root{--sidebar-w:204px}
  .sidebar{width:var(--sidebar-w);max-width:none;padding:10px 9px}.nav-link{min-height:39px;padding:4px 6px;font-size:10.8px}.nav-link .nav-icon-shell{width:29px;height:29px}.sidebar-head{height:auto;min-height:42px}
  .screen-head{min-height:72px;padding:11px 15px}.screen-head h1{font-size:27px}.screen-head-action{max-width:42%}
}
@media (min-width:1600px){:root{--sidebar-w:210px}.sidebar{width:var(--sidebar-w)}}

/* Yemen Smart Workflow responsive */
@media (max-width:1000px){
  .workspace-bar{top:60px;height:40px;padding:4px 7px}.workspace-tab{height:31px;min-width:96px;max-width:150px;font-size:9px}.workspace-save{display:none}.workspace-add{height:31px;width:31px}
  .weight-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.currency-converter{grid-template-columns:1fr 1fr}.currency-converter .calc-result{grid-column:1/-1}.preference-grid{grid-template-columns:1fr 1fr}.smart-options{position:fixed;top:auto;right:8px;left:8px;bottom:calc(var(--bottomnav-h) + 8px);max-height:48vh}
  .table-tools{align-items:center}.table-search{min-width:0;max-width:none;flex:1}.table-hint{display:none}
}
@media (max-width:470px){
  .workspace-bar{top:58px}.workspace-tab{min-width:88px;padding:0 7px}.screen-head-actions{gap:3px}.screen-head-actions .head-select{font-size:8px;padding:4px 5px}
  .weight-grid,.preference-grid,.journal-pair{grid-template-columns:1fr}.journal-explain{grid-template-columns:1fr}.journal-explain>span{transform:rotate(90deg)}.theme-choice{grid-template-columns:1fr 1fr 1fr}.theme-choice button{font-size:9px;padding:0 4px}.entity-context{grid-template-columns:36px minmax(0,1fr)}.entity-context .btn{display:none}.entity-context-icon{width:34px;height:34px}.currency-converter{grid-template-columns:1fr}
}
@media (min-width:1024px){
  .workspace-bar{position:fixed;top:64px;right:var(--sidebar-w);left:0;height:44px;z-index:34}.shell{padding-top:108px}.topbar{z-index:35}.smart-options{min-width:320px}.weight-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* Closed mobile drawer stays outside the layout without increasing document width. */
@media (max-width:1000px){
  .sidebar{
    right:calc(-1 * var(--sidebar-mobile-w));
    left:auto;
    transform:none;
    transition:right var(--transition),box-shadow var(--transition);
  }
  .sidebar.open{right:0;transform:none}
}

/* Fixed off-canvas elements can still enlarge Chromium's scroll area; remove the closed drawer from layout. */
@media (max-width:1000px){
  .sidebar:not(.open){display:none}
  .sidebar.open{display:block;right:0;left:auto;transform:none}
}

/* Mobile header reserves the real width of its three action buttons. */
@media (max-width:1000px){
  .topbar{grid-template-columns:110px minmax(0,1fr) 42px;padding-inline:7px}
  .top-actions{min-width:0;overflow:visible}
  .dashboard-kpi:after{left:0}
}
