.mobile-menu-toggle,.mobile-install,.mobile-install-help{display:none}
@media screen and (max-width:700px){
 .app-shell,.app-shell.direction-shell,.app-shell.sidebar-collapsed{display:block;min-width:0}
 .app-shell .sidebar.mobile-ready{position:static;height:auto;max-height:none;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.6rem .75rem;visibility:visible;opacity:1;pointer-events:auto}
 .sidebar.mobile-ready .brand{width:145px;height:42px;margin:0;order:-1}
 .sidebar.mobile-ready .mobile-menu-toggle{display:inline-flex;margin-left:auto;min-height:44px}
 .sidebar.mobile-ready>.eyebrow,.sidebar.mobile-ready>.nav,.sidebar.mobile-ready>.user,.sidebar.mobile-ready>#logout{display:none}
 .sidebar.mobile-ready.mobile-menu-open>.nav{display:grid;width:100%;grid-template-columns:1fr;max-height:55dvh;overflow:auto;gap:.35rem}
 .sidebar.mobile-ready.mobile-menu-open>.user{display:block;width:100%;margin:0;padding:.5rem 0}
 .sidebar.mobile-ready.mobile-menu-open>#logout{display:block;min-height:44px}
 .sidebar.mobile-ready.mobile-menu-open .direction-nav-group:first-child{grid-template-columns:1fr}
 .sidebar.mobile-ready .nav button{min-height:44px;white-space:normal;font-size:.95rem}
 .sidebar.mobile-menu-open .mobile-install:not([hidden]){display:inline-flex;min-height:44px}
 .sidebar.mobile-menu-open .mobile-install-help:not([hidden]){display:block;width:100%;margin:.25rem 0;font-size:.8rem;line-height:1.4;color:#526173}
 .workspace .page{width:100%;padding:.75rem;min-width:0}
 .workspace .page-head,.workspace .panel-head,.workspace .detail-head{flex-wrap:wrap;gap:.6rem}
 .workspace .page-head>*,.workspace .panel-head>*,.workspace .detail-head>*{min-width:0;max-width:100%;overflow-wrap:anywhere}
 .workspace .topbar{font-size:.85rem;gap:.4rem}
 .workspace .topbar>.muted{width:100%;font-size:.75rem}
 .workspace .fields,.workspace .grid,.workspace .report-grid,.workspace .report-executive-grid,.workspace .task-chart-grid,.workspace .consumption-filters{grid-template-columns:minmax(0,1fr)}
 .workspace .filters{display:grid;grid-template-columns:1fr;align-items:stretch}
 .workspace .filters .field{min-width:0;width:100%}
 .workspace .field input,.workspace .field select,.workspace .field textarea,dialog input,dialog select,dialog textarea{font-size:16px;min-height:44px}
 .workspace .btn,dialog .btn{min-height:44px;white-space:normal}
 .workspace .actions{flex-wrap:wrap}
 .workspace .kpis,.workspace .task-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
 .workspace .table.mobile-cards,.workspace .table.mobile-cards tbody,.workspace .table.mobile-cards tr,.workspace .table.mobile-cards td{display:block;width:100%;min-width:0;max-width:none;white-space:normal}
 .workspace .table.mobile-cards thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .workspace .table.mobile-cards tr{border:1px solid #dbe4ee;border-radius:10px;margin:0 0 .65rem;padding:.6rem;background:white}
 .workspace .table.mobile-cards td{border:0;padding:.3rem;overflow-wrap:anywhere}
 .workspace .table.mobile-cards td::before{content:none}
 .workspace .table.mobile-cards td[data-mobile-label]::before{content:attr(data-mobile-label);display:block;font-size:.75rem;font-weight:700;color:#526173;margin-bottom:.15rem}
 .workspace .table.mobile-cards td .btn{margin:.15rem .2rem .15rem 0;max-width:100%}
 .workspace .table.mobile-cards td .actions{gap:.4rem}
 dialog{width:calc(100% - 1rem);max-width:calc(100% - 1rem);max-height:94dvh;padding:.85rem;overflow:auto}
 dialog .fields{grid-template-columns:minmax(0,1fr)}
 .login{display:block}.login-story{display:none}.login-main{min-height:100dvh;padding:1.25rem}
 .login-form input{font-size:16px}
}

/* Compact funnel and consistent account controls on every screen. */
.sidebar-tools{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;width:100%;min-width:0}
.sidebar-tools>.sidebar-tool{display:flex;align-items:center;justify-content:center;min-height:44px;width:100%;margin:0;padding:9px 12px;border:1px solid #dbe4ee;border-radius:10px;background:#f8fafc;color:#183750;font-size:13px;font-weight:600;line-height:1.25;text-align:center;white-space:normal}
.sidebar-tools>.sidebar-tool:hover{background:#edf4fc;border-color:#adc5e1}
.sidebar-tools button:focus-visible{outline:3px solid #1768e5;outline-offset:2px}
.liters-client-count.link{appearance:none;border:0;background:transparent;box-shadow:none;margin:0;padding:0;color:var(--primary);font:inherit;text-align:inherit;line-height:inherit;text-decoration:underline;text-underline-offset:3px;white-space:normal}
.dashboard-charts .funnel{gap:3px}
.dashboard-charts .funnel-row{grid-template-columns:minmax(64px,.62fr) minmax(0,1.4fr) 26px;align-items:stretch;gap:9px;min-height:50px;font-size:13px}
.dashboard-charts .funnel-shape{height:100%;min-height:50px;margin:0 auto}
.funnel-stage{min-width:0;align-self:center;display:flex;flex-direction:column;gap:2px;padding:3px 0}
.funnel-stage>span{font-weight:600;line-height:1.25}
.funnel-stage .pipeline-liters{display:block;width:auto;padding:0;margin:0;font-size:11px;line-height:1.3;text-align:left;color:#697988}
.funnel-stage .pipeline-liters .liters-client-count{display:block;min-width:0;line-height:1.3}
.dashboard-charts .funnel-total{align-self:center;text-align:right;font-size:14px;font-variant-numeric:tabular-nums}
@media screen and (max-width:700px){
 .sidebar.mobile-ready>.sidebar-tools{order:-2;flex:0 0 100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .sidebar.mobile-ready .sidebar-tools>.mobile-menu-toggle,.sidebar.mobile-ready .sidebar-tools>.account-password{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;height:100%;margin:0;padding:10px 8px;border:1px solid #dbe4ee;border-radius:10px;background:#f8fafc;color:#183750;font-size:14px;font-weight:600;line-height:1.25;text-align:center}
 .sidebar.mobile-ready .sidebar-tools>.push-settings{grid-column:1/-1;min-height:44px;font-size:14px}
 .sidebar.mobile-ready.mobile-menu-open>#logout{width:100%;border:1px solid #dbe4ee;border-radius:10px;padding:10px;background:white;color:#183750;font-size:14px}
 .dashboard-charts .funnel-row{grid-template-columns:minmax(68px,.62fr) minmax(0,1.4fr) 24px;gap:8px}
}
/* Keep the shutter in its own top-layer viewport, independent of form scroll. */
dialog.field-camera-dialog{position:fixed;inset:0;margin:auto;width:min(480px,calc(100vw - 1rem));height:min(760px,calc(100dvh - 1rem));max-width:calc(100vw - 1rem);max-height:calc(100dvh - 1rem);padding:1rem;overflow:auto;overscroll-behavior:contain}
dialog.field-camera-dialog[open]{display:flex;flex-direction:column;gap:.75rem}
.field-camera-dialog h2,.field-camera-dialog p{margin:0;flex:none}
.field-camera-dialog h2{font-size:1.125rem}
.field-camera-dialog video{display:block;width:100%;flex:1 1 260px;min-height:80px;max-height:48dvh;object-fit:contain;background:#102a43;border-radius:8px}
.field-camera-dialog p{font-size:.9375rem;line-height:1.4;overflow-wrap:anywhere}
.field-camera-dialog .actions{display:grid;gap:.5rem;flex:none;width:100%;margin-top:auto}
.field-camera-dialog .btn{width:100%;min-height:48px;white-space:normal;line-height:1.3}
.field-camera-dialog [hidden]{display:none!important}
.field-dialog .field-photo-section{padding:1rem;border:1px solid #cdddec;border-radius:8px;background:#f4f8fc}
.field-dialog .field-photo-pickers .btn{width:100%}
.field-dialog .field-location{background:#f4f8fc;border-left-color:#a7bfd5}