/* Desktop defaults remain unchanged; mobile additions are isolated below 900px. */
.mobile-nav-toggle,.mobile-step-order { display:none !important; }
.mobile-table-scroll { display:contents; }
@media (max-width:900px) {
 html:root { --arc-dialog-action-height:44px; }
 body { min-width:0; }
 body .shell { display:block !important; min-width:0; }
 body .shell > aside { position:relative !important; top:auto; width:100%; height:auto !important; min-height:64px; padding:12px 16px !important; display:flex !important; flex-direction:row !important; flex-wrap:wrap; align-items:center; gap:12px; border-right:0; border-bottom:1px solid #dce3de; }
 body .shell > aside .brand { min-width:0; flex:1; margin:0; justify-content:flex-start !important; }
 body .shell > aside .brand > span { display:block !important; font-size:14px !important; }
 body .shell > aside .mobile-nav-toggle { display:inline-flex !important; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:8px 12px; border:1px solid #b9c8c0; border-radius:8px; background:#fff; color:#244d3c; font:inherit; cursor:pointer; }
 body .shell > aside:not(.mobile-nav-open) > nav,body .shell > aside:not(.mobile-nav-open) > .account { display:none !important; }
 body .shell > aside.mobile-nav-open > nav { display:grid !important; grid-template-columns:1fr 1fr; flex:auto !important; width:100%; margin:0; gap:4px; }
 body .shell > aside > nav button { min-height:44px; margin:0 !important; padding:10px !important; font-size:14px !important; white-space:normal; text-align:left; }
 body .shell > aside.mobile-nav-open > .account { display:flex !important; width:100%; margin:4px 0 0; padding-top:12px; }
 body .shell > aside .sign-out { min-width:44px; min-height:44px; }
 body .shell > main { min-width:0; width:100%; padding:20px 16px !important; }
 body main > header { flex-wrap:wrap; gap:12px; }
 body h1 { font-size:clamp(1.65rem,7vw,2.4rem); overflow-wrap:anywhere; }
 body .center { min-height:100dvh; padding:16px; }
 body .auth-card { width:100%; max-width:520px; min-width:0; padding:24px; }
 body .modal-backdrop,body .filter-modal-backdrop,body .backdrop { padding:12px; align-items:start; overflow-y:auto; }
 body .modal,body .filter-modal,body .backdrop > section,body .backdrop > .dialog { width:100% !important; min-width:0; max-height:calc(100dvh - 24px); margin:auto; overflow:auto; }
 body .modal > header,body .filter-modal > header { padding:16px; gap:12px; }
 body .modal h2,body .filter-modal h2 { font-size:1.4rem; overflow-wrap:anywhere; }
 body .modal .modal-form,body .filter-modal .modal-form,body .form { min-width:0; padding:16px; }
 body .modal-close { flex-shrink:0; min-width:44px; min-height:44px; }
 body .modal-actions,body .form footer { flex-wrap:wrap; gap:8px; }
 body button[data-dialog-action] { max-width:100%; white-space:normal; }
 body input:not([type=checkbox]):not([type=radio]),body select,body textarea { min-width:0; max-width:100%; font-size:16px; }
 body select,body input:not([type=checkbox]):not([type=radio]) { min-height:44px; }
 body .form-row,body .form-grid,body .permission-list { grid-template-columns:minmax(0,1fr) !important; }
 body .mobile-table-scroll { display:block; width:100%; max-width:100%; min-width:0; overflow-x:auto; overscroll-behavior-x:contain; }
 body .table-scroll { max-width:100%; min-width:0; overflow-x:auto; }
 body table { min-width:580px; }
 body table th:last-child,body table td:last-child { position:static; }
 body .panel,body .library,body .table-wrap,body .master-detail,body .detail { min-width:0; max-width:100%; }
 body .panel-title,body .section-title,body .row-actions,body .toolbar { flex-wrap:wrap; gap:10px; }
 body .panel-title { padding:16px; }
 body .filter { width:100%; max-width:none; }
 body .row-actions button,body .table-menu summary,body .action-menu summary { min-height:44px; }
 body .manage-menu,body .preset-floating-menu { max-width:calc(100vw - 24px); max-height:70dvh; overflow:auto; }
 body .name-options { max-height:35dvh; }
 body .name-options button,body .property-menu button { min-height:44px; }
}
@media (max-width:380px) { body .shell > aside.mobile-nav-open > nav { grid-template-columns:1fr; } }

@media(max-width:900px) {
 body .grid,body .form-panel,body .company-settings-layout,body .measure-grid,body .measure-grid.font { grid-template-columns:minmax(0,1fr) !important; }
 body .company-subnav { position:static; grid-template-columns:1fr 1fr; }
 body .hero { flex-wrap:wrap; gap:16px; padding:24px; }
 body .hero strong { font-size:clamp(2rem,10vw,4rem); }
 body .empty { min-height:240px; padding:24px; }
 body .code-backdrop { padding:0; }
 body .code-modal { height:100dvh; max-height:100dvh; border-radius:0; }
 body .code-workspace { padding:12px; grid-template-rows:auto minmax(100px,1fr) auto; }
 body .code-warning { grid-template-columns:1fr; }
 body .preset-step-row { grid-template-columns:40px 64px minmax(180px,1fr) 64px 70px 90px; gap:8px; }



 body .preset-step-row .mobile-step-order { grid-column:1; grid-row:1; }
 body .preset-step-row .drag-grip { display:none; }
 body .mobile-step-order { display:flex !important; flex-direction:column; }
 body .mobile-step-order button { min-width:40px; min-height:40px; padding:0; }
 body .preset-step-row button { min-height:40px; }
 body .filter-summary { grid-template-columns:minmax(0,1fr) auto auto; }
 body .field-rule { grid-template-columns:minmax(0,1fr) auto; }
 body .field-rule .badges { grid-column:1/-1; justify-content:flex-start; }
 body .field-rule .menu-host { grid-column:2; grid-row:1; }
 body .normalize-options .menu-button,body .expand-classes { width:44px; height:44px; }
 body .normalize-options .badges button { min-height:36px; }
 body .property-dialog { width:calc(100vw - 24px); max-height:calc(100dvh - 24px); overflow:auto; padding:20px; }
 body .period-head { padding:16px; flex-wrap:wrap; }
}

@media(max-width:900px) { body .shell > aside .account div,body .shell > aside .account strong,body .shell > aside .account small { display:block !important; } }

@media(max-width:900px) { body .shell > aside .brand small { display:block; } body .shell > aside .sign-out { display:block !important; margin-left:auto; } body .company-subnav { display:grid; margin:0; } body .company-subnav strong { grid-column:1/-1; } body .company-subnav button { font-size:14px !important; min-height:44px; } }
