/* Standalone mobile layout: role-aware product content and shared navigation. */
body.mobile-standalone { min-width:0; overflow-x:hidden; padding-bottom:calc(76px + env(safe-area-inset-bottom)); }
.mobile-standalone .app-shell { display:block; }
.mobile-standalone .sidebar {
  position:fixed; inset:auto 0 0; z-index:12; width:100%; height:calc(70px + env(safe-area-inset-bottom));
  min-height:0; padding:0 4px env(safe-area-inset-bottom); transform:none; overflow:hidden;
  border:0; border-top:1px solid rgba(255,255,255,.12); background:rgba(8,33,24,.98);
  box-shadow:0 -8px 28px rgba(12,30,21,.14); backdrop-filter:blur(14px);
}
.mobile-standalone .brand, .mobile-standalone .sidebar-bottom { display:none; }
.mobile-standalone .nav {
  display:grid; grid-template-columns:repeat(var(--nav-items,7),minmax(0,1fr)); align-items:stretch;
  gap:0; width:100%; height:70px; overflow:hidden;
}
.mobile-standalone .nav-item {
  min-width:0; width:100%; height:62px; margin-top:4px; padding:5px 1px;
  display:flex; flex-direction:column; justify-content:center; align-items:center; gap:3px;
  overflow:hidden; text-align:center; font-size:9.5px; border-radius:8px;
}
.mobile-standalone .nav-item > span { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mobile-standalone .nav-item i { width:auto; height:19px; font-size:17px; line-height:19px; }
.mobile-standalone .nav-item b { position:absolute; margin:-27px 0 0 29px; min-width:16px; padding:1px 4px; font-size:9px; }
.mobile-standalone .main-content { width:100%; }
.mobile-standalone .topbar { position:sticky; height:calc(56px + env(safe-area-inset-top)); padding:0; }
.mobile-standalone .topbar-inner { padding:env(safe-area-inset-top) 10px 0 12px; gap:8px; }
.mobile-standalone .topbar .crumbs { flex:1; max-width:none; font-size:12px; }
.mobile-standalone .topbar .crumbs-context { display:none; }
.mobile-standalone .topbar-actions { flex:none; gap:2px; }
.mobile-standalone .desktop-link, .mobile-standalone .mobile-avatar, .mobile-standalone .mobile-menu, .mobile-standalone .mobile-link { display:none; }
.mobile-standalone .icon-button { width:44px; height:44px; }
.mobile-standalone .mobile-role-picker { display:block; margin:0 3px 0 0; padding:0; border:0; }
.mobile-standalone .mobile-role-picker span { display:none; }
.mobile-standalone .mobile-role-picker select {
  width:auto; min-width:78px; min-height:42px; margin:0; padding:7px 24px 7px 9px;
  border:1px solid #cbd9cf; border-radius:9px; color:var(--ink); background:#fff;
  font-size:14px; font-weight:600;
}
.mobile-standalone .page { padding:18px 13px 28px; }
.mobile-standalone .page > * { min-width:0; }
.mobile-standalone .page-header { width:100%; margin-bottom:17px; gap:12px; }
.mobile-standalone .page-heading { width:100%; }
.mobile-standalone .page-header h1 { font-size:25px; }
.mobile-standalone .page-header p { margin-top:4px; font-size:12px; line-height:1.4; }
.mobile-standalone .page-header .header-actions { width:100%; }
.mobile-standalone .page-header .header-actions .button { flex:1; }
.mobile-standalone .role-banner { align-items:flex-start; margin-top:-3px; line-height:1.4; }
.mobile-standalone .metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:14px; }
.mobile-standalone .metrics > * { grid-column:auto !important; }
.mobile-standalone .metrics > :last-child:nth-child(5) { grid-column:1 / -1 !important; }
.mobile-standalone .metric-card { min-height:96px; padding:12px; }
.mobile-standalone .metric-value { font-size:19px; }
.mobile-standalone .metric-foot { font-size:11px; }
.mobile-standalone .dashboard-grid, .mobile-standalone .two-cols, .mobile-standalone .three-cols { grid-template-columns:minmax(0,1fr); gap:11px; }
.mobile-standalone .dashboard-grid > *, .mobile-standalone .two-cols > *, .mobile-standalone .three-cols > * { min-width:0; }
.mobile-standalone .panel { padding:14px; border-radius:11px; }
.mobile-standalone .panel h2 { font-size:14px; }
.mobile-standalone .object-hero { padding:15px; margin-bottom:13px; border-radius:11px; }
.mobile-standalone .object-hero h1 { font-size:22px; }
.mobile-standalone .object-meta { line-height:1.65; }
.mobile-standalone .object-meta span { display:block; margin-right:0; }
.mobile-standalone .object-actions { width:100%; }
.mobile-standalone .object-actions .button { flex:1; min-height:44px; }
.mobile-standalone .mini-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.mobile-standalone .mini-metric { padding:11px; }
.mobile-standalone .tabs { margin-left:-13px; margin-right:-13px; padding:0 13px; margin-bottom:14px; }
.mobile-standalone .tab { min-height:44px; padding:10px 9px; font-size:12px; }
.mobile-standalone .filterbar { gap:7px; }
.mobile-standalone .object-filters { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.mobile-standalone .object-filters input { grid-column:1 / -1; width:100%; }
.mobile-standalone .object-filters select { width:100%; max-width:none; min-width:0; }
.mobile-standalone .object-filters > :last-child { grid-column:1 / -1; }
.mobile-standalone input, .mobile-standalone select, .mobile-standalone textarea { font-size:16px; }
.mobile-standalone .button, .mobile-standalone .text-link, .mobile-standalone .close { min-height:44px; }
.mobile-standalone .close { width:44px; }

/* Operational tables become cards; dense financial tables retain deliberate horizontal scroll. */
.mobile-standalone .data-table { min-width:590px; }
.mobile-standalone .data-table-wrap { max-width:calc(100% + 28px); margin:0 -14px; padding:0 14px 6px; overflow-x:auto; box-shadow:inset -18px 0 18px -20px rgba(14,24,19,.65); }
.mobile-standalone .data-table-wrap:has(.mobile-card-table) { margin:0; padding:0; overflow:visible; box-shadow:none; }
.mobile-standalone .mobile-card-table, .mobile-standalone .mobile-card-table tbody { display:block; width:100%; min-width:0; }
.mobile-standalone .mobile-card-table thead { display:none; }
.mobile-standalone .mobile-card-table tbody { display:grid; gap:10px; }
.mobile-standalone .mobile-card-table tr {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 14px;
  padding:13px; border:1px solid var(--line); border-radius:10px; background:var(--panel-sunken);
}
.mobile-standalone .mobile-card-table td { min-width:0; padding:0; border:0; text-align:left !important; white-space:normal; }
.mobile-standalone .mobile-card-table td[data-span="full"] { grid-column:1 / -1; }
.mobile-standalone .mobile-card-table td[data-label]:before {
  content:attr(data-label); display:block; margin-bottom:4px; color:var(--muted);
  font-size:10px; font-weight:700; letter-spacing:.045em; text-transform:uppercase;
}
.mobile-standalone .mobile-card-table td:first-child .entity-name { font-size:14px; }
.mobile-standalone .mobile-card-table .subline { white-space:normal; }
.mobile-standalone .drawer { width:100%; height:100dvh; padding:calc(19px + env(safe-area-inset-top)) 15px calc(22px + env(safe-area-inset-bottom)); }
.mobile-standalone .modal-backdrop { align-items:end; padding:0; }
.mobile-standalone .modal { width:100%; max-height:90dvh; border-radius:16px 16px 0 0; padding:18px 15px calc(18px + env(safe-area-inset-bottom)); }
.mobile-standalone .modal-actions { flex-wrap:wrap; }
.mobile-standalone .form-grid { grid-template-columns:1fr; gap:10px; }
.mobile-standalone .form-grid .full { grid-column:auto; }
.mobile-standalone .field-overlay { padding:0; align-items:end; }
.mobile-standalone .phone { width:100%; min-height:0; height:100dvh; padding:0; border:0; border-radius:22px 22px 0 0; background:var(--canvas); box-shadow:none; }
.mobile-standalone .phone::before { display:none; }
.mobile-standalone .phone-notch { top:max(0px, env(safe-area-inset-top)); }
.mobile-standalone .phone-head { padding-top:calc(43px + env(safe-area-inset-top)); }
.mobile-standalone .toast { left:14px; right:14px; bottom:calc(82px + env(safe-area-inset-bottom)); text-align:center; }

@media (max-width:360px) {
  .mobile-standalone .metrics { grid-template-columns:1fr; }
  .mobile-standalone .metrics > :last-child:nth-child(5) { grid-column:auto !important; }
  .mobile-standalone .nav-item { font-size:9px; }
  .mobile-standalone .nav-item i { font-size:15px; }
  .mobile-standalone .topbar-inner { padding-left:9px; padding-right:7px; gap:4px; }
  .mobile-standalone .topbar-actions { gap:0; }
  .mobile-standalone .mobile-role-picker { margin-right:0; }
  .mobile-standalone .mobile-role-picker select { min-width:70px; padding-left:7px; padding-right:19px; }
  .mobile-standalone .modal-actions .button { width:100%; }
}
