/* OROX Mobile Native-Like UX V2 — Phase 1 Foundation */
html[data-orox-mobile-native-v2="1"]{
  --orox-mobile-touch-target:44px;
  --orox-mobile-space-1:6px;
  --orox-mobile-space-2:10px;
  --orox-mobile-space-3:14px;
  --orox-mobile-card-padding:14px;
  --orox-mobile-list-gap:10px;
  --orox-mobile-sheet-radius:22px;
  --orox-mobile-motion-fast:140ms;
  --orox-mobile-motion-normal:190ms;
}

html[data-orox-mobile-native-v2="1"][data-orox-mobile-density="compact"]{
  --orox-mobile-space-1:4px;
  --orox-mobile-space-2:8px;
  --orox-mobile-space-3:10px;
  --orox-mobile-card-padding:10px;
  --orox-mobile-list-gap:7px;
}

.orox-touch{
  -webkit-tap-highlight-color:transparent;
  transition:transform var(--orox-mobile-motion-fast) ease,opacity var(--orox-mobile-motion-fast) ease,border-color var(--orox-mobile-motion-fast) ease,background var(--orox-mobile-motion-fast) ease;
  touch-action:manipulation;
}
.orox-touch:active{transform:scale(.985);opacity:.9}

.orox-native-skeleton{border-radius:12px}
.orox-skeleton-line{display:block;height:12px;border-radius:999px}
.orox-skeleton-line.short{width:42%}
.orox-skeleton-line.medium{width:68%}
.orox-skeleton-line.long{width:92%}
.orox-skeleton-stack{display:grid;gap:8px}
.orox-skeleton-card{min-height:92px;border:1px solid var(--line);border-radius:14px}

.orox-mobile-safe-top{padding-top:max(var(--orox-mobile-space-2),env(safe-area-inset-top))}
.orox-mobile-safe-bottom{padding-bottom:max(var(--orox-mobile-space-2),env(safe-area-inset-bottom))}
.orox-mobile-safe-inline{
  padding-inline-start:max(var(--orox-mobile-space-2),env(safe-area-inset-left));
  padding-inline-end:max(var(--orox-mobile-space-2),env(safe-area-inset-right));
}

.orox-mobile-chips{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
  max-width:100%;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scrollbar-width:none;
  scroll-snap-type:inline proximity;
  padding:2px 1px 5px;
}
.orox-mobile-chips::-webkit-scrollbar{display:none}
.orox-filter-chip{
  flex:0 0 auto;
  min-height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:1px solid var(--line);
  border-radius:999px;
  padding:7px 11px;
  background:var(--surface-2);
  color:var(--muted);
  font-weight:850;
  font-size:11px;
  white-space:nowrap;
}
.orox-filter-chip b{
  min-width:18px;height:18px;padding:0 5px;border-radius:999px;display:inline-grid;place-items:center;
  background:color-mix(in srgb,var(--text) 8%,transparent);color:var(--text);font-size:9px
}
.orox-filter-chip.is-active{
  color:#fff;background:var(--blue);border-color:var(--blue);
  box-shadow:0 5px 18px color-mix(in srgb,var(--blue) 24%,transparent)
}
.orox-filter-chip:focus-visible{outline:2px solid color-mix(in srgb,var(--blue) 70%,#fff);outline-offset:2px}

.orox-mobile-sheet{
  width:min(520px,calc(100vw - 28px));
  max-width:520px;
  border:0;
  border-radius:var(--orox-mobile-sheet-radius);
  padding:0;
  background:transparent;
  color:var(--text);
  box-shadow:none;
}
.orox-mobile-sheet::backdrop{
  background:rgba(2,10,20,.68);
  backdrop-filter:blur(3px);
}
.orox-mobile-sheet-panel{
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr) auto;
  max-height:min(82dvh,760px);
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:inherit;
  background:var(--card);
  box-shadow:0 28px 90px rgba(0,0,0,.42);
}
.orox-mobile-sheet-handle{
  display:none;
  width:44px;height:4px;border-radius:999px;
  background:color-mix(in srgb,var(--muted) 56%,transparent);
  justify-self:center;margin-top:8px
}
.orox-mobile-sheet-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  min-height:54px;padding:12px 14px;border-bottom:1px solid var(--line)
}
.orox-mobile-sheet-head h3{margin:0;font-size:15px;line-height:1.35}
.orox-mobile-sheet-head .btn{width:40px;height:40px;min-width:40px;padding:0;display:grid;place-items:center;font-size:22px}
.orox-mobile-sheet-body{min-height:0;overflow:auto;padding:14px;overscroll-behavior:contain}
.orox-mobile-sheet-foot{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;
  padding:10px 14px max(10px,env(safe-area-inset-bottom));
  border-top:1px solid var(--line);background:color-mix(in srgb,var(--card) 96%,transparent)
}
.orox-mobile-sheet-foot .btn{min-height:44px}

.orox-mobile-form{display:grid;grid-template-columns:1fr;gap:var(--orox-mobile-list-gap);min-width:0}
.orox-mobile-field{display:grid;gap:6px;min-width:0}
.orox-mobile-field>label,.orox-mobile-field>.orox-mobile-label{
  color:var(--muted);font-size:11px;font-weight:850;line-height:1.35
}
.orox-required::after{content:" *";color:var(--red);font-weight:950}
.orox-mobile-help{color:var(--muted);font-size:10px;line-height:1.5}
.orox-mobile-error{color:var(--red);font-size:10px;line-height:1.45}
.orox-mobile-field.is-invalid input,
.orox-mobile-field.is-invalid select,
.orox-mobile-field.is-invalid textarea{border-color:var(--red)!important}
.orox-mobile-form input:not([type="checkbox"]):not([type="radio"]),
.orox-mobile-form select,
.orox-mobile-form textarea{
  width:100%;min-width:0;min-height:var(--orox-mobile-touch-target);
  border-radius:12px;padding:10px 12px;font-size:16px;line-height:1.4
}
.orox-mobile-form textarea{min-height:96px;resize:vertical}

.orox-mobile-chart{
  width:100%;min-width:0;max-width:100%;overflow:hidden;
  container-type:inline-size;
}
.orox-mobile-chart svg,.orox-mobile-chart canvas{
  display:block;width:100%!important;max-width:100%!important;height:auto
}
.orox-mobile-chart .exec-chart-legend{
  display:flex;gap:7px;flex-wrap:wrap;min-width:0
}

.orox-mobile-dialog{max-width:min(560px,94vw)}
.orox-mobile-dialog .dlg-body{overscroll-behavior:contain}
.orox-mobile-dialog .dlg-foot{gap:8px;flex-wrap:wrap}

.orox-swipe-row{
  position:relative;overflow:hidden;isolation:isolate;touch-action:pan-y;
  --orox-swipe-x:0px;
}
.orox-swipe-actions{
  position:absolute;z-index:0;inset-block:0;inset-inline-end:0;
  display:flex;align-items:stretch;justify-content:flex-end;
  min-width:88px;background:var(--surface-3)
}
.orox-swipe-actions>*{
  min-width:72px;min-height:44px;border-radius:0;
  display:grid;place-items:center
}
.orox-swipe-content{
  position:relative;z-index:1;min-width:0;background:inherit;
  transform:translate3d(var(--orox-swipe-x),0,0);
  transition:transform var(--orox-mobile-motion-normal) cubic-bezier(.2,.8,.2,1);
  will-change:transform
}
.orox-swipe-dragging .orox-swipe-content,
.orox-swipe-no-transition .orox-swipe-content{transition:none}

@media(max-width:680px){
  html[data-orox-mobile-native-v2="1"],html[data-orox-mobile-native-v2="1"] body{
    max-width:100%;overflow-x:hidden;overscroll-behavior-x:none
  }

  .orox-mobile-sticky-header{
    position:sticky!important;
    inset-block-start:0;
    z-index:45!important;
    padding-top:max(8px,env(safe-area-inset-top))!important;
    padding-inline-start:max(10px,env(safe-area-inset-left))!important;
    padding-inline-end:max(10px,env(safe-area-inset-right))!important;
    background:color-mix(in srgb,var(--surface-1) 92%,transparent)!important;
    backdrop-filter:blur(16px) saturate(130%)
  }

  .orox-mobile-sticky-actions{
    position:sticky;
    z-index:36;
    inset-block-end:0;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-inline:calc(-1 * max(10px,env(safe-area-inset-left)));
    padding:
      10px
      max(10px,env(safe-area-inset-right))
      max(10px,calc(env(safe-area-inset-bottom) + 6px))
      max(10px,env(safe-area-inset-left));
    border-top:1px solid var(--line);
    background:color-mix(in srgb,var(--surface-1) 94%,transparent);
    box-shadow:0 -12px 32px rgba(0,0,0,.18);
    backdrop-filter:blur(16px) saturate(130%)
  }
  .orox-mobile-sticky-actions>.btn,
  .orox-mobile-sticky-actions>button{min-height:var(--orox-mobile-touch-target);min-width:0}
  .orox-mobile-sticky-actions>.primary:only-child{grid-column:1/-1}

  .orox-mobile-sheet{
    width:100vw;max-width:none;margin:0;
    inset:auto 0 0 0;
    border-radius:var(--orox-mobile-sheet-radius) var(--orox-mobile-sheet-radius) 0 0
  }
  .orox-mobile-sheet-panel{
    max-height:min(88dvh,760px);
    border-inline:0;border-bottom:0;
    border-radius:inherit
  }
  .orox-mobile-sheet-handle{display:block}
  .orox-mobile-sheet-head{
    position:sticky;inset-block-start:0;z-index:2;
    padding-inline-start:max(14px,env(safe-area-inset-left));
    padding-inline-end:max(14px,env(safe-area-inset-right))
  }
  .orox-mobile-sheet-body{
    padding-inline-start:max(14px,env(safe-area-inset-left));
    padding-inline-end:max(14px,env(safe-area-inset-right));
    padding-bottom:max(16px,env(safe-area-inset-bottom))
  }
  .orox-mobile-sheet-foot{
    padding-inline-start:max(14px,env(safe-area-inset-left));
    padding-inline-end:max(14px,env(safe-area-inset-right))
  }

  .orox-filter-chip{min-height:40px}
  .orox-touch,button,.btn,.tab,.searchable-combobox-input,.searchable-combobox-clear{
    min-height:var(--orox-mobile-touch-target)
  }

  .searchable-combobox{width:100%;min-width:0}
  .searchable-combobox-input{
    width:100%;min-width:0;min-height:var(--orox-mobile-touch-target);
    padding-block:10px;font-size:16px;border-radius:12px
  }
  .searchable-combobox-clear{min-width:44px}
  .searchable-combobox-list{
    inset-inline:max(10px,env(safe-area-inset-left)) max(10px,env(safe-area-inset-right));
    inset-block:auto max(10px,env(safe-area-inset-bottom));
    max-height:min(46dvh,420px);
    border-radius:16px;
    padding:7px;
    box-shadow:0 24px 70px rgba(0,0,0,.42)
  }
  .searchable-combobox-option,.searchable-combobox-more{
    min-height:44px;padding:10px 11px
  }

  .orox-mobile-dialog.dialog{
    width:calc(100vw - 20px);max-width:none;
    max-height:calc(100dvh - max(20px,env(safe-area-inset-top)) - max(20px,env(safe-area-inset-bottom)));
    border-radius:18px
  }
  .orox-mobile-dialog .dlg-head{
    position:sticky;inset-block-start:0;z-index:2;
    min-height:54px;background:var(--card)
  }
  .orox-mobile-dialog .dlg-body{
    max-height:calc(100dvh - 150px);
    padding-inline:max(14px,env(safe-area-inset-left)) max(14px,env(safe-area-inset-right))
  }
  .orox-mobile-dialog .dlg-foot{
    position:sticky;inset-block-end:0;z-index:2;
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
    padding-bottom:max(12px,env(safe-area-inset-bottom));
    background:var(--card)
  }
  .orox-mobile-dialog .dlg-foot .btn{min-height:44px;min-width:0}

  .orox-density-surface{gap:var(--orox-mobile-list-gap)}
  .orox-density-card{padding:var(--orox-mobile-card-padding)}
  html[data-orox-mobile-density="compact"] .orox-density-secondary{font-size:.94em}
  html[data-orox-mobile-density="compact"] .orox-density-card{border-radius:12px}

  .orox-mobile-type-title{font-size:18px;line-height:1.35;font-weight:900}
  .orox-mobile-type-section{font-size:14px;line-height:1.4;font-weight:900}
  .orox-mobile-type-body{font-size:12px;line-height:1.6}
  .orox-mobile-type-meta{font-size:10px;line-height:1.5;color:var(--muted)}

  .orox-mobile-chart{min-height:140px}
  .orox-mobile-chart .chart-row{
    grid-template-columns:minmax(72px,.9fr) minmax(0,1.5fr) auto;
    gap:6px;min-width:0
  }
}

@media(max-width:430px){
  .orox-mobile-sheet-foot,.orox-mobile-sticky-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:390px){
  .orox-mobile-sheet-body{padding-top:12px}
  .orox-filter-chip{padding-inline:10px}
}

@media(max-width:360px){
  .orox-mobile-sticky-actions{gap:6px}
  .orox-mobile-sheet-head{padding-inline:12px}
  .orox-mobile-sheet-body{padding-inline:12px}
}

@media(hover:hover) and (pointer:fine){
  .orox-filter-chip:hover{border-color:color-mix(in srgb,var(--blue) 50%,var(--line));color:var(--text)}
}

@media(prefers-reduced-motion:reduce){
  .orox-touch,.orox-swipe-content{transition:none!important}
  .orox-touch:active{transform:none}
}


.entity-mobile-cancel{display:none}

/* OROX Mobile Native-Like UX V2 — Phase 2 Dashboard + Phase 3 Item Forms */
@media(max-width:680px){
  .dashboard-native-v2 .hero{
    gap:10px;margin-bottom:12px;padding:2px 1px 0
  }
  .dashboard-native-v2 .hero h2{
    font-size:19px;line-height:1.3;letter-spacing:-.01em
  }
  .dashboard-native-v2 .hero p{
    font-size:10.5px;line-height:1.55;max-width:42ch
  }
  .dashboard-native-v2 #dashboardHeroActions{
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;width:100%
  }
  .dashboard-native-v2 #dashboardHeroActions .btn{
    min-width:0;min-height:44px;border-radius:12px
  }
  .dashboard-native-v2 #dashboardHeroActions .btn.primary:first-child:nth-last-child(odd){
    grid-column:1/-1
  }
  .dashboard-native-v2 .executive-primary-kpis,
  .dashboard-native-v2 .executive-finance-kpis{
    gap:8px
  }
  .dashboard-native-v2 .executive-kpi{
    border-radius:15px;
    box-shadow:0 7px 22px rgba(0,0,0,.11);
    transition:transform var(--orox-mobile-motion-fast) ease,border-color var(--orox-mobile-motion-fast) ease,background var(--orox-mobile-motion-fast) ease
  }
  .dashboard-native-v2 .executive-kpi:active{transform:scale(.987)}
  .dashboard-native-v2 .executive-kpi-value{
    font-variant-numeric:tabular-nums;
    overflow-wrap:anywhere
  }
  .dashboard-native-v2 .badge,
  .dashboard-native-v2 .kpi-delta,
  .dashboard-native-v2 .priority-score{
    border-radius:999px
  }
  .dashboard-native-v2 .executive-card{
    border-radius:15px;overflow:hidden
  }
  .dashboard-native-v2 .executive-card-head{
    min-height:54px
  }
  .dashboard-native-v2 .exec-line-wrap,
  .dashboard-native-v2 .exec-donut-layout,
  .dashboard-native-v2 .mini-chart{
    min-width:0;max-width:100%;overflow:hidden
  }
  .dashboard-native-v2 .exec-line-chart,
  .dashboard-native-v2 .exec-donut svg,
  .dashboard-native-v2 .kpi-sparkline{
    display:block;max-width:100%;width:100%;height:auto
  }
  .dashboard-native-v2 .dashboard-mobile-period-trigger,
  .dashboard-native-v2 .dashboard-mobile-refresh{
    min-height:44px;border-radius:12px
  }
  .dashboard-native-v2 .dashboard-period-dialog{
    border-radius:22px 22px 0 0
  }
  .dashboard-native-v2 .dashboard-period-sheet{
    padding-bottom:max(16px,env(safe-area-inset-bottom))
  }

  #entityDialog:has(.orox-item-form){
    width:100vw;max-width:none;margin:0;inset:auto 0 0 0;
    height:min(92dvh,860px);max-height:92dvh;
    border-radius:22px 22px 0 0;border-bottom:0
  }
  #entityDialog:has(.orox-item-form) #entityForm{
    height:100%;min-height:0;display:grid;
    grid-template-rows:auto minmax(0,1fr) auto
  }
  #entityDialog:has(.orox-item-form) .dlg-head{
    position:sticky;top:0;z-index:4;
    min-height:58px;
    padding:
      max(12px,env(safe-area-inset-top))
      max(14px,env(safe-area-inset-right))
      10px
      max(14px,env(safe-area-inset-left));
    background:color-mix(in srgb,var(--card) 96%,transparent);
    backdrop-filter:blur(16px);
    border-bottom:1px solid var(--line)
  }
  #entityDialog:has(.orox-item-form) .dlg-head h3{
    font-size:16px;line-height:1.35;min-width:0;overflow-wrap:anywhere
  }
  #entityDialog:has(.orox-item-form) .dlg-head .btn{
    min-width:44px;min-height:44px
  }
  #entityDialog:has(.orox-item-form) .dlg-body{
    min-height:0;max-height:none;overflow:auto;
    overscroll-behavior:contain;
    scroll-padding-bottom:120px;
    padding:
      14px
      max(14px,env(safe-area-inset-right))
      18px
      max(14px,env(safe-area-inset-left))
  }
  #entityDialog:has(.orox-item-form) .orox-item-form{
    grid-template-columns:1fr!important;
    gap:12px;
    min-width:0
  }
  #entityDialog:has(.orox-item-form) .orox-item-form>.full{
    grid-column:1!important
  }
  #entityDialog:has(.orox-item-form) .form-field{
    gap:6px;min-width:0
  }
  #entityDialog:has(.orox-item-form) .form-field label,
  #entityDialog:has(.orox-item-form) .form-field>span{
    font-size:11px;line-height:1.35;font-weight:850;color:var(--muted)
  }
  #entityDialog:has(.orox-item-form) .form-field:has([required]) label::after,
  #entityDialog:has(.orox-item-form) .form-field:has([required])>span::after{
    content:" *";color:var(--red);font-weight:950
  }
  #entityDialog:has(.orox-item-form) input:not([type="checkbox"]):not([type="radio"]),
  #entityDialog:has(.orox-item-form) select,
  #entityDialog:has(.orox-item-form) textarea,
  #entityDialog:has(.orox-item-form) .searchable-combobox-input{
    min-height:46px;width:100%;max-width:100%;
    border-radius:12px;padding:10px 12px;
    font-size:16px;line-height:1.4
  }
  #entityDialog:has(.orox-item-form) input[type="file"]{
    padding:9px
  }
  #entityDialog:has(.orox-item-form) textarea{min-height:96px}
  #entityDialog:has(.orox-item-form) .split-head{
    align-items:center;gap:10px;padding-top:3px
  }
  #entityDialog:has(.orox-item-form) .split-head h3{
    margin:0;font-size:13px;line-height:1.4
  }
  #entityDialog:has(.orox-item-form) .split-head small{
    display:block;margin-top:3px;font-size:10px;line-height:1.45
  }
  #entityDialog:has(.orox-item-form) .split-head .btn{
    min-height:40px;flex:none
  }
  #entityDialog:has(.orox-item-form) .doc-lines{
    gap:8px;min-width:0
  }
  #entityDialog:has(.orox-item-form) .doc-line,
  #entityDialog:has(.orox-item-form) .doc-line.variant{
    width:100%;min-width:0;max-width:100%;
    grid-template-columns:1fr!important;
    gap:8px;padding:10px;border-radius:13px
  }
  #entityDialog:has(.orox-item-form) .doc-line>*{
    min-width:0;max-width:100%
  }
  #entityDialog:has(.orox-item-form) .line-remove{
    width:100%;min-height:40px
  }
  #entityDialog:has(.orox-item-form) .dlg-foot{
    position:sticky;bottom:0;z-index:5;
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    padding:
      10px
      max(14px,env(safe-area-inset-right))
      max(10px,calc(env(safe-area-inset-bottom) + 6px))
      max(14px,env(safe-area-inset-left));
    background:color-mix(in srgb,var(--card) 97%,transparent);
    border-top:1px solid var(--line);
    box-shadow:0 -14px 30px rgba(0,0,0,.18);
    backdrop-filter:blur(16px)
  }
  #entityDialog:has(.orox-item-form) .dlg-foot .btn{
    min-height:46px;width:100%;min-width:0
  }
  #entityDialog:has(.orox-item-form) #entityMessage{
    grid-column:1/-1;min-height:0;font-size:10px;line-height:1.45
  }
  #entityDialog:has(.orox-item-form) .entity-mobile-cancel{
    display:inline-flex;align-items:center;justify-content:center
  }

  html.orox-keyboard-open #entityDialog:has(.orox-item-form){
    height:var(--orox-visual-height,92dvh);
    max-height:var(--orox-visual-height,92dvh)
  }
  html.orox-keyboard-open #entityDialog:has(.orox-item-form) .dlg-body{
    scroll-padding-bottom:96px
  }
}

@media(min-width:681px){
  .entity-mobile-cancel{display:none!important}
}


/* OROX Mobile Native-Like UX V2 — Phase 4 Items */
.product-mobile-controls,
.product-quick-filters{display:none}
.product-swipe-shell{min-width:0}
.product-card-phase4{height:100%}
.product-card-swipe-actions{display:none}

@media(max-width:680px){
  .inventory-mobile-view .product-list-toolbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px;
    align-items:center;
    width:100%;
    min-width:0;
    padding:8px;
    border:1px solid var(--line);
    border-radius:15px;
    background:color-mix(in srgb,var(--card) 94%,var(--bg));
  }
  .inventory-mobile-view .product-desktop-filters{
    width:100%;
    min-width:0;
  }
  .inventory-mobile-view .product-desktop-filters #inventorySearch{
    width:100%;
    min-width:0;
    min-height:44px;
    font-size:16px;
    border-radius:12px;
  }
  .inventory-mobile-view .product-desktop-filters #inventoryStock,
  .inventory-mobile-view .product-desktop-filters #inventorySort{
    display:none;
  }
  .inventory-mobile-view .product-mobile-controls{
    display:flex;
    gap:6px;
    flex:0 0 auto;
  }
  .inventory-mobile-view .product-mobile-controls .btn{
    position:relative;
    min-width:44px;
    padding-inline:9px;
  }
  .inventory-mobile-view .product-mobile-controls .btn span:last-of-type{
    display:none;
  }
  .inventory-mobile-view .product-filter-count{
    position:absolute;
    inset-block-start:-5px;
    inset-inline-end:-5px;
    min-width:19px;
    height:19px;
    display:grid;
    place-items:center;
    padding:0 5px;
    border-radius:999px;
    background:var(--red);
    color:#fff;
    font-size:9px;
    font-weight:950;
    box-shadow:0 0 0 2px var(--card);
  }
  .inventory-mobile-view .product-quick-filters{
    display:block;
    width:100%;
    min-width:0;
    margin:2px 0 8px;
  }
  .inventory-mobile-view #categoryTabs{display:none!important}

  .inventory-mobile-view .product-grid{
    grid-template-columns:minmax(0,1fr)!important;
    gap:var(--orox-mobile-list-gap)!important;
    width:100%;
    min-width:0;
  }
  .inventory-mobile-view .product-swipe-shell{
    width:100%;
    min-width:0;
    border-radius:17px;
    background:var(--surface-3);
  }
  .inventory-mobile-view .product-card-swipe-actions{
    display:flex;
    overflow:hidden;
    border-radius:17px;
  }
  .inventory-mobile-view .product-card-swipe-actions .btn{
    min-width:76px;
    border:0;
    border-inline-start:1px solid var(--line);
    border-radius:0;
  }
  .inventory-mobile-view .product-card-phase4{
    display:grid;
    grid-template-columns:96px minmax(0,1fr);
    min-height:118px;
    width:100%;
    max-width:100%;
    border-radius:17px;
    overflow:hidden;
    background:var(--card);
    box-shadow:0 4px 14px rgba(0,0,0,.06);
    cursor:pointer;
  }
  .inventory-mobile-view .product-card-phase4 .product-media{
    width:96px;
    min-height:118px;
    height:100%;
    aspect-ratio:auto;
    border-inline-end:1px solid var(--line);
  }
  .inventory-mobile-view .product-card-phase4 .product-media img{
    width:100%;
    height:100%;
    object-fit:contain;
    padding:7px;
  }
  .inventory-mobile-view .product-card-phase4 .product-body{
    display:grid;
    gap:7px;
    min-width:0;
    padding:10px 11px;
  }
  .inventory-mobile-view .product-card-phase4 .product-list-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:7px;
    min-width:0;
  }
  .inventory-mobile-view .product-card-phase4 .product-title{
    margin:0;
    min-width:0;
    min-height:0;
    font-size:13px;
    line-height:1.45;
    overflow-wrap:anywhere;
  }
  .inventory-mobile-view .product-card-phase4 .product-list-head .badge{
    flex:0 0 auto;
    font-size:8px;
    padding:4px 7px;
  }
  .inventory-mobile-view .product-list-code{
    width:max-content;
    max-width:100%;
    color:var(--muted);
    font:800 10px/1.35 ui-monospace,SFMono-Regular,Menlo,monospace;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .inventory-mobile-view .product-list-subline{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    min-width:0;
    color:var(--muted);
    font-size:9px;
  }
  .inventory-mobile-view .product-list-subline>span{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .inventory-mobile-view .product-list-price{
    flex:0 0 auto;
    color:var(--text);
    font-size:11px;
    direction:ltr;
  }
  .inventory-mobile-view .product-card-phase4 .product-meta{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
  }
  .inventory-mobile-view .product-card-phase4 .stock-chip{
    padding:5px 7px;
    border-radius:9px;
  }
  .inventory-mobile-view .product-list-actions{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
  }
  .inventory-mobile-view .product-list-actions .btn{
    min-width:0;
    min-height:38px;
    padding:6px 8px;
    font-size:10px;
  }
  .inventory-mobile-view .product-list-actions .primary:only-child{
    grid-column:1/-1;
  }

  html[data-orox-mobile-density="compact"] .inventory-mobile-view .product-card-phase4{
    grid-template-columns:76px minmax(0,1fr);
    min-height:92px;
  }
  html[data-orox-mobile-density="compact"] .inventory-mobile-view .product-card-phase4 .product-media{
    width:76px;
    min-height:92px;
  }
  html[data-orox-mobile-density="compact"] .inventory-mobile-view .product-card-phase4 .product-body{
    gap:4px;
    padding:7px 8px;
  }
  html[data-orox-mobile-density="compact"] .inventory-mobile-view .product-card-phase4 .product-title{
    font-size:12px;
  }
  html[data-orox-mobile-density="compact"] .inventory-mobile-view .product-card-phase4 .product-list-subline{
    font-size:8px;
  }
  html[data-orox-mobile-density="compact"] .inventory-mobile-view .product-list-actions .btn{
    min-height:44px;
  }
  html[data-orox-mobile-density="compact"] .inventory-mobile-view .product-card-phase4 .stock-chip{
    padding:3px 5px;
  }

  .product-filter-sheet{
    display:grid;
    gap:12px;
    width:100%;
    min-width:0;
  }
  .product-filter-sheet .orox-mobile-field{
    display:grid;
    gap:6px;
  }
  .product-filter-sheet .orox-mobile-field>span{
    font-size:10px;
    font-weight:900;
    color:var(--muted);
  }

  .inventory-mobile-view #productPager{
    width:100%;
    min-width:0;
  }
  .inventory-mobile-view #productPager .filters{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:6px;
  }
  .inventory-mobile-view #productPager .badge{
    min-width:0;
    white-space:normal;
    text-align:center;
  }
}

@media(max-width:390px){
  .inventory-mobile-view .product-list-toolbar{
    grid-template-columns:minmax(0,1fr) 94px;
  }
  .inventory-mobile-view .product-mobile-controls .btn{
    padding-inline:7px;
  }
}

@media(min-width:681px){
  .inventory-mobile-view .product-card-phase4 .product-list-head>.badge,
  .inventory-mobile-view .product-card-phase4 .product-list-code,
  .inventory-mobile-view .product-card-phase4 .product-list-subline,
  .inventory-mobile-view .product-card-phase4 .product-list-actions{
    display:none;
  }
}


/* OROX Mobile Native-Like UX V2 — Phase 5 Invoice Details */
.invoice-number-link{
  border:0;background:transparent;color:var(--blue);font:inherit;font-weight:900;
  padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px
}
.invoice-number-link:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}
.invoice-detail-mobile{display:grid;gap:14px;min-width:0}
.invoice-detail-mobile-header{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;
  min-width:0
}
.invoice-detail-heading{min-width:0;text-align:center}
.invoice-detail-heading small{display:block;color:var(--muted);font-size:9px;font-weight:850}
.invoice-detail-heading h3{
  margin:2px 0 0;font-size:17px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.invoice-detail-status{min-width:0}
.invoice-back-glyph{font-size:22px;line-height:1;transform:translateY(-1px)}
.invoice-detail-tabs{
  display:flex;gap:7px;overflow-x:auto;max-width:100%;padding:1px 1px 5px;scrollbar-width:none;
  overscroll-behavior-inline:contain;scroll-snap-type:inline proximity
}
.invoice-detail-tabs::-webkit-scrollbar{display:none}
.invoice-detail-tabs button{
  flex:0 0 auto;min-height:40px;border:1px solid var(--line);border-radius:999px;padding:7px 11px;
  background:var(--surface-2);color:var(--muted);font-weight:900;font-size:10px;white-space:nowrap
}
.invoice-detail-tabs button.active{background:var(--blue);border-color:var(--blue);color:#fff}
.invoice-detail-tabs button b{
  margin-inline-start:4px;min-width:17px;height:17px;padding:0 4px;border-radius:999px;
  display:inline-grid;place-items:center;background:color-mix(in srgb,currentColor 14%,transparent);font-size:8px
}
.invoice-detail-financial{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px
}
.invoice-detail-financial>div{
  min-width:0;border:1px solid var(--line);border-radius:13px;padding:10px;background:var(--card)
}
.invoice-detail-financial small{display:block;color:var(--muted);font-size:9px;font-weight:850}
.invoice-detail-financial b{
  display:block;margin-top:5px;font-size:15px;line-height:1.3;white-space:normal;overflow-wrap:anywhere
}
.invoice-detail-financial .due b{color:var(--amber)}
.invoice-detail-financial .settled b{color:var(--green)}
.invoice-detail-panel{display:grid;gap:12px;min-width:0}
.invoice-detail-facts{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px
}
.invoice-detail-fact{
  min-width:0;border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--surface-2)
}
.invoice-detail-fact small{display:block;color:var(--muted);font-size:8px}
.invoice-detail-fact b{display:block;margin-top:4px;font-size:11px;line-height:1.45;overflow-wrap:anywhere}
.invoice-detail-breakdown,
.invoice-payment-breakdown{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px
}
.invoice-detail-breakdown>div,
.invoice-payment-breakdown>div{
  display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;
  border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--card)
}
.invoice-detail-breakdown span,
.invoice-payment-breakdown small{color:var(--muted);font-size:9px}
.invoice-detail-breakdown b,
.invoice-payment-breakdown b{font-size:11px;overflow-wrap:anywhere;text-align:end}
.invoice-detail-notes{
  border:1px solid var(--line);border-radius:12px;padding:11px;background:var(--surface-2)
}
.invoice-detail-notes small{color:var(--muted);font-size:9px}
.invoice-detail-notes p{margin:5px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.65}
.invoice-detail-lines{display:grid;gap:9px}
.invoice-detail-line{
  display:grid;gap:9px;min-width:0;border:1px solid var(--line);border-radius:14px;padding:11px;background:var(--card)
}
.invoice-detail-line-head{
  display:flex;justify-content:space-between;align-items:flex-start;gap:10px;min-width:0
}
.invoice-detail-line-head>div{display:grid;gap:3px;min-width:0}
.invoice-detail-line-head b{font-size:12px;overflow-wrap:anywhere}
.invoice-detail-line-head small{color:var(--muted);font-size:8px;overflow-wrap:anywhere}
.invoice-detail-line-head>strong{flex:0 0 auto;font-size:11px}
.invoice-detail-line-facts{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px
}
.invoice-detail-line-facts span{
  min-width:0;border-radius:9px;padding:7px;background:var(--surface-2);text-align:center
}
.invoice-detail-line-facts small{display:block;color:var(--muted);font-size:7px}
.invoice-detail-line-facts b{display:block;margin-top:3px;font-size:9px;overflow-wrap:anywhere}
.invoice-detail-sticky-actions{margin-top:2px}

@media(max-width:680px){
  .invoice-detail-dialog.dialog{
    width:100vw;max-width:none;max-height:100dvh;height:100dvh;margin:0;border-radius:0;
    inset:0
  }
  .invoice-detail-dialog .dlg-head{
    display:none
  }
  .invoice-detail-dialog .dlg-body{
    max-height:none;height:100%;padding:
      max(10px,env(safe-area-inset-top))
      max(12px,env(safe-area-inset-right))
      max(16px,calc(env(safe-area-inset-bottom) + 76px))
      max(12px,env(safe-area-inset-left));
    overflow-y:auto;overflow-x:hidden
  }
  .invoice-detail-dialog .dlg-foot{display:none!important}
  .invoice-detail-mobile{min-height:100%}
  .invoice-detail-mobile-header{
    position:sticky;inset-block-start:calc(-1 * max(10px,env(safe-area-inset-top)));
    z-index:6;
    margin:
      calc(-1 * max(10px,env(safe-area-inset-top)))
      calc(-1 * max(12px,env(safe-area-inset-right)))
      0
      calc(-1 * max(12px,env(safe-area-inset-left)));
    padding:
      max(10px,env(safe-area-inset-top))
      max(12px,env(safe-area-inset-right))
      10px
      max(12px,env(safe-area-inset-left));
    border-bottom:1px solid var(--line);
    background:color-mix(in srgb,var(--card) 94%,transparent);
    backdrop-filter:blur(16px) saturate(130%)
  }
  .invoice-detail-back{
    min-width:44px;min-height:44px;padding:7px 9px
  }
  .invoice-detail-back span:last-child{display:none}
  .invoice-detail-heading h3{font-size:15px}
  .invoice-detail-status .badge{max-width:94px;white-space:normal;text-align:center;line-height:1.3}
  .invoice-detail-tabs{
    position:sticky;inset-block-start:64px;z-index:5;
    margin-inline:-2px;padding-block:7px;
    background:color-mix(in srgb,var(--card) 94%,transparent);
    backdrop-filter:blur(14px)
  }
  .invoice-detail-financial{
    grid-template-columns:repeat(2,minmax(0,1fr));gap:7px
  }
  .invoice-detail-financial>div{padding:9px}
  .invoice-detail-financial b{font-size:14px}
  .invoice-detail-facts{
    grid-template-columns:repeat(2,minmax(0,1fr));gap:7px
  }
  .invoice-detail-breakdown,
  .invoice-payment-breakdown{
    grid-template-columns:1fr
  }
  .invoice-detail-line-facts{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .invoice-detail-sticky-actions{
    position:fixed!important;
    inset-inline:0;
    inset-block-end:0!important;
    z-index:80;
    margin:0!important;
    padding:
      9px
      max(10px,env(safe-area-inset-right))
      max(10px,calc(env(safe-area-inset-bottom) + 6px))
      max(10px,env(safe-area-inset-left));
    grid-template-columns:repeat(3,minmax(0,1fr));
    background:color-mix(in srgb,var(--card) 96%,transparent);
    border-top:1px solid var(--line);
    box-shadow:0 -10px 28px rgba(0,0,0,.16)
  }
  .invoice-detail-sticky-actions .btn{
    min-width:0;min-height:44px;padding:7px 6px;font-size:9px
  }
  .invoice-detail-sticky-actions .btn .ui-icon{width:16px;height:16px}
  .invoice-detail-sticky-actions .primary:only-child{grid-column:1/-1}
  .invoice-detail-sticky-actions .btn:nth-child(2):last-child{grid-column:auto}
}

@media(max-width:390px){
  .invoice-detail-mobile-header{grid-template-columns:44px minmax(0,1fr) auto;gap:6px}
  .invoice-detail-financial b{font-size:13px}
  .invoice-detail-sticky-actions{gap:6px}
}

@media(min-width:681px){
  .invoice-detail-dialog.dialog{width:min(920px,94vw)}
  .invoice-detail-sticky-actions{
    display:flex;justify-content:flex-end;gap:8px;padding-top:4px
  }
}


/* OROX Mobile Native-Like UX V2 — Phases 6-7 rollout */
.orox-native-list-tools,
.orox-native-filter-mobile{display:none}

@media(max-width:680px){
  .orox-native-rollout-view{
    overflow-x:hidden!important;
    min-width:0;
  }
  .orox-native-rollout-view .section-card{
    min-width:0;
  }
  .orox-native-rollout-view .table-wrap,
  .orox-native-rollout-view .section-content{
    overflow-x:visible!important;
    min-width:0;
  }
  .orox-native-rollout-view .orox-native-list-tools{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px;
    align-items:center;
    margin:0 0 9px;
    min-width:0;
  }
  .orox-native-rollout-view .orox-native-list-search{
    width:100%;
    min-width:0;
    min-height:44px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--card);
    color:var(--text);
    padding:9px 11px;
    font-size:16px;
  }
  .orox-native-rollout-view .orox-native-list-status{
    grid-column:1/-1;
    min-width:0;
  }
  .orox-native-rollout-view .orox-native-density-toggle{
    min-height:44px;
    white-space:nowrap;
  }
  .orox-native-rollout-view table.orox-native-list-table,
  .orox-rollout-detail-dialog table.orox-native-list-table{
    display:block;
    width:100%;
    min-width:0;
    border:0;
  }
  .orox-native-rollout-view table.orox-native-list-table thead,
  .orox-rollout-detail-dialog table.orox-native-list-table thead{
    display:none;
  }
  .orox-native-rollout-view table.orox-native-list-table tbody,
  .orox-rollout-detail-dialog table.orox-native-list-table tbody{
    display:grid;
    gap:var(--orox-mobile-list-gap);
    width:100%;
    min-width:0;
  }
  .orox-native-rollout-view table.orox-native-list-table tr,
  .orox-rollout-detail-dialog table.orox-native-list-table tr{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px 9px;
    width:100%;
    min-width:0;
    padding:11px;
    border:1px solid var(--line);
    border-radius:15px;
    background:var(--card);
    box-shadow:0 3px 12px rgba(0,0,0,.045);
  }
  .orox-native-rollout-view table.orox-native-list-table td,
  .orox-rollout-detail-dialog table.orox-native-list-table td{
    display:grid;
    gap:3px;
    min-width:0;
    width:auto;
    padding:0!important;
    border:0!important;
    white-space:normal!important;
    overflow-wrap:anywhere;
  }
  .orox-native-rollout-view table.orox-native-list-table td::before,
  .orox-rollout-detail-dialog table.orox-native-list-table td::before{
    content:attr(data-label);
    color:var(--muted);
    font-size:8px;
    font-weight:850;
    line-height:1.3;
  }
  .orox-native-rollout-view table.orox-native-list-table td:has(.action-row),
  .orox-rollout-detail-dialog table.orox-native-list-table td:has(.action-row){
    grid-column:1/-1;
  }
  .orox-native-rollout-view table.orox-native-list-table .action-row,
  .orox-rollout-detail-dialog table.orox-native-list-table .action-row{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    width:100%;
    min-width:0;
  }
  .orox-native-rollout-view table.orox-native-list-table .action-row .btn,
  .orox-rollout-detail-dialog table.orox-native-list-table .action-row .btn{
    min-width:0;
    min-height:44px;
    white-space:normal;
  }
  .orox-native-rollout-view table.orox-native-list-table input[type="checkbox"]{
    width:22px;height:22px;
  }
  .orox-native-list-empty{
    margin:8px 0;
  }

  html[data-orox-mobile-density="compact"] .orox-native-rollout-view table.orox-native-list-table tr,
  html[data-orox-mobile-density="compact"] .orox-rollout-detail-dialog table.orox-native-list-table tr{
    gap:5px 7px;
    padding:8px;
    border-radius:12px;
  }
  html[data-orox-mobile-density="compact"] .orox-native-rollout-view table.orox-native-list-table td,
  html[data-orox-mobile-density="compact"] .orox-rollout-detail-dialog table.orox-native-list-table td{
    font-size:10px;
  }
  html[data-orox-mobile-density="compact"] .orox-native-rollout-view table.orox-native-list-table .action-row .btn,
  html[data-orox-mobile-density="compact"] .orox-rollout-detail-dialog table.orox-native-list-table .action-row .btn{
    min-height:44px;
    padding-block:6px;
  }

  #moduleFilters:has(.orox-native-filter-mobile){
    display:grid;
    gap:7px;
    width:100%;
    min-width:0;
  }
  #moduleFilters:has(.orox-native-filter-mobile)>.filters{
    display:block;
    width:100%;
    min-width:0;
  }
  #moduleFilters:has(.orox-native-filter-mobile)>.filters>input[type="search"]{
    display:block;
    width:100%;
    min-width:0;
    min-height:44px;
    font-size:16px;
  }
  #moduleFilters:has(.orox-native-filter-mobile) .orox-mobile-advanced-filter{
    display:none!important;
  }
  .orox-native-filter-mobile{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:7px;
    min-width:0;
  }
  .orox-native-filter-quick{
    min-width:0;
  }
  .orox-native-filter-button{
    position:relative;
    min-width:44px;
    min-height:44px;
    padding-inline:9px;
  }
  .orox-native-filter-button>span:last-of-type{display:none}
  .orox-native-filter-count{
    position:absolute;
    inset-block-start:-5px;
    inset-inline-end:-5px;
    min-width:19px;
    height:19px;
    display:grid;
    place-items:center;
    padding:0 5px;
    border-radius:999px;
    background:var(--red);
    color:#fff;
    font-size:9px;
    box-shadow:0 0 0 2px var(--card);
  }
  .orox-native-filter-sheet{
    display:grid;
    gap:12px;
  }
  .orox-native-filter-sheet .orox-mobile-field{
    display:grid;
    gap:6px;
  }
  .orox-native-filter-sheet .orox-mobile-field>span{
    color:var(--muted);
    font-size:9px;
    font-weight:900;
  }

  .orox-rollout-form-dialog.dialog,
  .orox-rollout-detail-dialog.dialog{
    width:100vw;
    max-width:none;
    max-height:100dvh;
    height:100dvh;
    margin:0;
    inset:0;
    border-radius:0;
  }
  .orox-rollout-form-dialog .dlg-head,
  .orox-rollout-detail-dialog .dlg-head{
    position:sticky;
    inset-block-start:0;
    z-index:8;
    padding-block-start:max(10px,env(safe-area-inset-top));
    background:color-mix(in srgb,var(--card) 96%,transparent);
    backdrop-filter:blur(14px);
  }
  .orox-rollout-form-dialog .dlg-body,
  .orox-rollout-detail-dialog .dlg-body{
    max-height:none;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    padding-inline:max(12px,env(safe-area-inset-left));
  }
  .orox-rollout-form-dialog .form-grid{
    grid-template-columns:1fr!important;
    gap:11px;
    min-width:0;
  }
  .orox-rollout-form-dialog .form-field,
  .orox-rollout-form-dialog .full,
  .orox-rollout-form-dialog .doc-lines,
  .orox-rollout-form-dialog [data-doc-line]{
    min-width:0;
    max-width:100%;
  }
  .orox-rollout-form-dialog input,
  .orox-rollout-form-dialog select,
  .orox-rollout-form-dialog textarea,
  .orox-rollout-form-dialog .searchable-combobox,
  .orox-rollout-form-dialog .searchable-combobox-input{
    width:100%;
    max-width:100%;
    min-width:0;
    font-size:16px;
  }
  .orox-rollout-form-dialog textarea{min-height:96px}
  .orox-rollout-form-dialog .dlg-foot{
    position:sticky;
    inset-block-end:0;
    z-index:9;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:8px;
    padding:
      9px
      max(12px,env(safe-area-inset-right))
      max(10px,calc(env(safe-area-inset-bottom) + 6px))
      max(12px,env(safe-area-inset-left));
    background:color-mix(in srgb,var(--card) 96%,transparent);
    border-top:1px solid var(--line);
    box-shadow:0 -8px 24px rgba(0,0,0,.1);
  }
  .orox-rollout-form-dialog .dlg-foot .btn{
    min-height:44px;
    min-width:0;
  }
  .orox-rollout-form-dialog .dlg-foot .muted{
    grid-column:1/-1;
    min-width:0;
  }
  .orox-rollout-detail-dialog .dlg-body{
    padding-bottom:max(20px,calc(env(safe-area-inset-bottom) + 16px));
  }
  .orox-rollout-detail-dialog .inline-metrics,
  .orox-rollout-detail-dialog .profile-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    min-width:0;
  }
  .orox-rollout-detail-dialog .profile-kpi,
  .orox-rollout-detail-dialog .metric{
    min-width:0;
  }
  .orox-rollout-detail-dialog .profile-kpi b,
  .orox-rollout-detail-dialog .metric strong{
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .orox-rollout-detail-dialog .dlg-inline-actions{
    position:sticky;
    inset-block-end:0;
    z-index:5;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    padding-block:max(8px,env(safe-area-inset-bottom));
    background:color-mix(in srgb,var(--card) 96%,transparent);
  }
  .orox-rollout-detail-dialog .dlg-inline-actions .btn{
    min-height:44px;
    min-width:0;
  }

  .orox-native-rollout-view.orox-native-skeleton{
    min-height:220px;
    position:relative;
  }
  .orox-native-rollout-view.orox-native-skeleton>.empty{
    min-height:180px;
    display:grid;
    place-items:center;
  }
}

@media(max-width:390px){
  .orox-native-rollout-view table.orox-native-list-table tr,
  .orox-rollout-detail-dialog table.orox-native-list-table tr{
    grid-template-columns:1fr;
  }
  .orox-native-rollout-view table.orox-native-list-table td:has(.action-row),
  .orox-rollout-detail-dialog table.orox-native-list-table td:has(.action-row){
    grid-column:1;
  }
  .orox-rollout-detail-dialog .inline-metrics,
  .orox-rollout-detail-dialog .profile-grid{
    grid-template-columns:1fr 1fr!important;
  }
}

@media(min-width:681px){
  .orox-native-rollout-view .orox-native-list-tools,
  #moduleFilters .orox-native-filter-mobile{
    display:none!important;
  }
  .orox-rollout-form-dialog.dialog,
  .orox-rollout-detail-dialog.dialog{
    width:min(960px,94vw);
  }
}

/* OROX Mobile Native-Like UX V2 — Phase 8 full-platform rollout */
@media(max-width:680px){
  .orox-phase8-surface{
    min-width:0;
    max-width:100%;
    overflow-x:hidden!important;
  }
  .orox-phase8-surface .hero{
    grid-template-columns:1fr;
    gap:10px;
    min-width:0;
  }
  .orox-phase8-surface .hero>div,
  .orox-phase8-surface .section-card,
  .orox-phase8-surface .section-content,
  .orox-phase8-surface .table-wrap,
  .orox-phase8-surface .panel,
  .orox-phase8-surface .card,
  .orox-phase8-surface .module-summary-block{
    min-width:0;
    max-width:100%;
    overflow-x:hidden;
  }
  .orox-phase8-surface #moduleActions,
  .orox-phase8-surface .platform-admin-head-actions{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    width:100%;
    min-width:0;
  }
  .orox-phase8-surface #moduleActions .btn,
  .orox-phase8-surface .platform-admin-head-actions .btn{
    min-width:0;
    min-height:44px;
    white-space:normal;
    line-height:1.35;
  }
  .orox-phase8-surface .health-tile-grid,
  .orox-phase8-surface .profile-grid,
  .orox-phase8-surface .inline-metrics,
  .orox-phase8-surface .recon-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px;
    min-width:0;
  }
  .orox-phase8-surface .health-tile,
  .orox-phase8-surface .profile-kpi,
  .orox-phase8-surface .metric,
  .orox-phase8-surface .recon-item{
    min-width:0;
    overflow:hidden;
  }
  .orox-phase8-surface .health-tile b,
  .orox-phase8-surface .profile-kpi b,
  .orox-phase8-surface .metric b,
  .orox-phase8-surface .money,
  .orox-phase8-surface .executive-kpi-value{
    max-width:100%;
    white-space:normal;
    overflow-wrap:anywhere;
    font-variant-numeric:tabular-nums;
  }
  .orox-phase8-surface .section-title{
    align-items:flex-start;
    gap:8px;
    min-width:0;
  }
  .orox-phase8-surface .section-title h3,
  .orox-phase8-surface .section-title .action-row{
    min-width:0;
  }
  .orox-phase8-surface .section-title .action-row{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
  }
  .orox-phase8-surface .section-title .action-row .btn{
    min-width:0;
    min-height:44px;
    white-space:normal;
  }
  .orox-phase8-surface .accounting-tabs,
  .orox-phase8-surface .platform-subnav,
  .orox-phase8-surface .platform-360-tabs{
    width:100%;
    min-width:0;
  }
  .orox-phase8-surface input,
  .orox-phase8-surface select,
  .orox-phase8-surface textarea,
  .orox-phase8-surface .searchable-combobox,
  .orox-phase8-surface .searchable-combobox-input{
    max-width:100%;
    min-width:0;
  }
  .orox-phase8-surface input:not([type="checkbox"]):not([type="radio"]),
  .orox-phase8-surface select,
  .orox-phase8-surface textarea{
    font-size:16px;
  }
  .orox-phase8-surface .orox-mobile-chart,
  .orox-phase8-surface .orox-mobile-chart svg,
  .orox-phase8-surface .orox-mobile-chart canvas{
    width:100%!important;
    max-width:100%!important;
    min-width:0;
  }
  .orox-phase8-dialog.dialog{max-width:100vw}
  .orox-phase8-detail-dialog.dialog{
    width:100vw;
    max-width:none;
    height:100dvh;
    max-height:100dvh;
    margin:0;
    inset:0;
    border-radius:0;
  }
  .orox-phase8-detail-dialog .dlg-head{
    position:sticky;
    inset-block-start:0;
    z-index:8;
    padding-block-start:max(10px,env(safe-area-inset-top));
    background:color-mix(in srgb,var(--card) 96%,transparent);
    backdrop-filter:blur(14px);
  }
  .orox-phase8-detail-dialog .dlg-body{
    max-height:none;
    height:100%;
    overflow-y:auto;
    overflow-x:hidden;
    padding-bottom:max(18px,calc(env(safe-area-inset-bottom) + 14px));
  }
}
@media(max-width:390px){
  .orox-phase8-surface #moduleActions,
  .orox-phase8-surface .platform-admin-head-actions{
    grid-template-columns:1fr;
  }
  .orox-phase8-surface .health-tile-grid,
  .orox-phase8-surface .profile-grid,
  .orox-phase8-surface .inline-metrics,
  .orox-phase8-surface .recon-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

/* OROX Mobile Native-Like UX V2 — Phases 9-10 polish + accessibility */
.orox-touch:focus-visible,
.orox-filter-chip:focus-visible,
.orox-native-list-search:focus-visible,
.orox-mobile-sheet button:focus-visible,
.orox-rollout-form-dialog button:focus-visible,
.orox-rollout-detail-dialog button:focus-visible,
.orox-phase8-surface button:focus-visible,
.orox-phase8-surface a:focus-visible,
.orox-phase8-surface [role="button"]:focus-visible,
.orox-phase8-surface [role="tab"]:focus-visible,
.searchable-combobox-input:focus-visible,
.searchable-combobox-clear:focus-visible{
  outline:2px solid color-mix(in srgb,var(--blue) 78%,#fff);
  outline-offset:2px;
}

.orox-touch:disabled,
.orox-touch[aria-disabled="true"],
.orox-filter-chip:disabled,
.orox-mobile-sheet .btn:disabled{
  opacity:.52;
  cursor:not-allowed;
  transform:none!important;
}

.orox-native-list-empty,
.orox-mobile-error,
.orox-phase8-surface .empty,
.orox-phase8-surface .load-error{
  min-width:0;
  overflow-wrap:anywhere;
}

.orox-density-transitioning .orox-density-card,
.orox-density-transitioning .orox-native-list-table tr,
.orox-density-transitioning .product-card-phase4{
  transition:
    padding var(--orox-mobile-motion-fast) ease,
    gap var(--orox-mobile-motion-fast) ease,
    border-radius var(--orox-mobile-motion-fast) ease,
    min-height var(--orox-mobile-motion-fast) ease;
}

.orox-mobile-sheet[open] .orox-mobile-sheet-panel{
  animation:orox-sheet-in var(--orox-mobile-motion-normal) cubic-bezier(.2,.8,.2,1);
}
.orox-mobile-sheet[open]::backdrop{
  animation:orox-backdrop-in var(--orox-mobile-motion-fast) ease-out;
}
@keyframes orox-sheet-in{
  from{transform:translateY(10px);opacity:.92}
  to{transform:translateY(0);opacity:1}
}
@keyframes orox-backdrop-in{
  from{opacity:0}
  to{opacity:1}
}

@media(max-width:680px){
  html[data-orox-mobile-native-v2="1"],
  html[data-orox-mobile-native-v2="1"] body{
    max-width:100%;
    overflow-x:hidden;
  }

  .orox-mobile-sheet-head h3,
  .orox-phase8-surface h1,
  .orox-phase8-surface h2,
  .orox-phase8-surface h3,
  .orox-phase8-surface .badge,
  .orox-phase8-surface .status-badge{
    max-width:100%;
    overflow-wrap:anywhere;
  }

  .orox-phase8-surface .badge,
  .orox-phase8-surface .status-badge{
    white-space:normal;
    line-height:1.35;
    text-align:center;
  }

  .orox-mobile-sheet .btn,
  .orox-rollout-form-dialog .btn,
  .orox-rollout-detail-dialog .btn,
  .orox-phase8-surface .btn,
  .orox-phase8-surface button,
  .orox-phase8-surface [role="button"],
  .orox-phase8-surface [role="tab"]{
    min-height:44px;
  }

  .orox-mobile-sheet input,
  .orox-mobile-sheet select,
  .orox-mobile-sheet textarea,
  .orox-rollout-form-dialog input,
  .orox-rollout-form-dialog select,
  .orox-rollout-form-dialog textarea{
    scroll-margin-block:90px;
  }

  html.orox-keyboard-open .orox-rollout-form-dialog.dialog,
  html.orox-keyboard-open .orox-phase8-detail-dialog.dialog{
    height:var(--orox-visual-height,100dvh);
    max-height:var(--orox-visual-height,100dvh);
  }

  html.orox-keyboard-open .orox-rollout-form-dialog .dlg-body,
  html.orox-keyboard-open .orox-phase8-detail-dialog .dlg-body{
    scroll-padding-bottom:96px;
  }
}

@media(max-width:900px) and (orientation:landscape){
  .orox-mobile-sheet-panel{
    max-height:min(92dvh,640px);
  }
  .orox-mobile-sheet-body,
  .orox-rollout-form-dialog .dlg-body,
  .orox-phase8-detail-dialog .dlg-body{
    overscroll-behavior:contain;
  }
  .orox-rollout-form-dialog.dialog,
  .orox-phase8-detail-dialog.dialog{
    max-height:100dvh;
  }
}

@media(prefers-reduced-motion:reduce){
  .orox-mobile-sheet[open] .orox-mobile-sheet-panel,
  .orox-mobile-sheet[open]::backdrop{
    animation:none!important;
  }
  .orox-density-transitioning .orox-density-card,
  .orox-density-transitioning .orox-native-list-table tr,
  .orox-density-transitioning .product-card-phase4,
  .dashboard-native-v2 .executive-kpi{
    transition:none!important;
  }
  .orox-touch,
  .orox-swipe-content,
  .orox-filter-chip{
    transition:none!important;
  }
  .orox-touch:active,
  .dashboard-native-v2 .executive-kpi:active{
    transform:none!important;
  }
}

/* OROX Mobile Native-Like UX V2 — visible shell hotfix */
@media(max-width:680px){
  html[data-orox-mobile-native-v2="1"] body{
    background:
      radial-gradient(circle at 88% -8%,color-mix(in srgb,var(--blue) 16%,transparent),transparent 34%),
      radial-gradient(circle at 4% 22%,color-mix(in srgb,var(--cyan) 8%,transparent),transparent 28%),
      var(--surface-0);
  }
  html[data-orox-mobile-native-v2="1"] .app,
  html[data-orox-mobile-native-v2="1"] .shell{
    min-height:100dvh;
  }
  html[data-orox-mobile-native-v2="1"] .shell{
    background:transparent;
  }
  html[data-orox-mobile-native-v2="1"] .topbar{
    min-height:64px;
    height:auto;
    gap:8px;
    padding:
      max(8px,env(safe-area-inset-top))
      max(10px,env(safe-area-inset-right))
      8px
      max(10px,env(safe-area-inset-left));
    background:color-mix(in srgb,var(--surface-1) 91%,transparent);
    border-bottom-color:color-mix(in srgb,var(--line) 72%,transparent);
    box-shadow:0 10px 28px rgba(0,0,0,.16);
    backdrop-filter:blur(18px) saturate(135%);
  }
  html[data-orox-mobile-native-v2="1"] .top-left{
    flex:1 1 auto;
    min-width:0;
  }
  html[data-orox-mobile-native-v2="1"] .menu-btn{
    display:grid;
    place-items:center;
    flex:0 0 44px;
    width:44px;
    height:44px;
    min-width:44px;
    min-height:44px;
    padding:0;
    border-radius:14px;
    background:color-mix(in srgb,var(--surface-3) 88%,transparent);
    box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--blue) 10%,transparent);
  }
  html[data-orox-mobile-native-v2="1"] .page-head{
    min-width:0;
  }
  html[data-orox-mobile-native-v2="1"] .page-head h1{
    font-size:17px;
    line-height:1.25;
    font-weight:950;
    letter-spacing:-.01em;
  }
  html[data-orox-mobile-native-v2="1"] .top-actions{
    gap:6px;
    min-width:0;
  }
  html[data-orox-mobile-native-v2="1"] .top-actions>.btn,
  html[data-orox-mobile-native-v2="1"] .top-actions>.user-chip{
    min-height:44px;
    border-radius:14px;
  }
  html[data-orox-mobile-native-v2="1"] .top-actions>.btn{
    box-shadow:none;
  }
  html[data-orox-mobile-native-v2="1"] .user-chip{
    padding:6px;
    background:color-mix(in srgb,var(--surface-2) 90%,transparent);
  }
  html[data-orox-mobile-native-v2="1"] .avatar{
    width:32px;
    height:32px;
    background:linear-gradient(145deg,var(--blue),color-mix(in srgb,var(--purple) 72%,var(--blue)));
    box-shadow:0 7px 18px color-mix(in srgb,var(--blue) 20%,transparent);
  }
  html[data-orox-mobile-native-v2="1"] .global-search-box{
    order:20;
    flex:1 0 100%;
    width:100%;
    min-width:0;
    gap:6px;
    margin-top:1px;
    padding:5px;
    border:1px solid color-mix(in srgb,var(--line) 84%,transparent);
    border-radius:15px;
    background:color-mix(in srgb,var(--surface-2) 80%,transparent);
  }
  html[data-orox-mobile-native-v2="1"] .global-search-box input{
    min-width:0;
    min-height:42px;
    border:0;
    border-radius:11px;
    background:transparent;
    padding-inline:10px;
    font-size:16px;
    outline:none;
  }
  html[data-orox-mobile-native-v2="1"] .global-search-box .btn{
    flex:0 0 auto;
    min-width:44px;
    min-height:42px;
    border-radius:11px;
  }
  html[data-orox-mobile-native-v2="1"] .main{
    width:100%;
    max-width:none;
    padding:
      14px
      max(10px,env(safe-area-inset-right))
      max(30px,calc(env(safe-area-inset-bottom) + 18px))
      max(10px,env(safe-area-inset-left));
  }
  html[data-orox-mobile-native-v2="1"] .view>.hero{
    margin-bottom:12px;
    padding:14px;
    border:1px solid color-mix(in srgb,var(--line) 84%,transparent);
    border-radius:18px;
    background:
      linear-gradient(145deg,color-mix(in srgb,var(--surface-2) 94%,var(--blue) 6%),color-mix(in srgb,var(--surface-1) 96%,transparent));
    box-shadow:0 12px 28px rgba(0,0,0,.12);
  }
  html[data-orox-mobile-native-v2="1"] .view>.hero h2{
    font-size:18px;
    font-weight:950;
    line-height:1.3;
  }
  html[data-orox-mobile-native-v2="1"] .view>.hero p{
    margin-top:5px;
    font-size:10.5px;
    line-height:1.6;
  }
  html[data-orox-mobile-native-v2="1"] .view>.hero .quick{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    width:100%;
  }
  html[data-orox-mobile-native-v2="1"] .view>.hero .quick .btn{
    width:100%;
    min-width:0;
    min-height:44px;
    border-radius:12px;
    padding-inline:9px;
  }
  html[data-orox-mobile-native-v2="1"] .card,
  html[data-orox-mobile-native-v2="1"] .panel,
  html[data-orox-mobile-native-v2="1"] .section-card{
    border-radius:18px;
    border-color:color-mix(in srgb,var(--line) 84%,transparent);
    background:color-mix(in srgb,var(--surface-2) 96%,transparent);
    box-shadow:0 10px 26px rgba(0,0,0,.10);
  }
  html[data-orox-mobile-native-v2="1"] .card-head,
  html[data-orox-mobile-native-v2="1"] .section-title{
    min-height:52px;
    padding:12px 13px;
  }
  html[data-orox-mobile-native-v2="1"] .card-body{
    padding:13px;
  }
  html[data-orox-mobile-native-v2="1"] .metric,
  html[data-orox-mobile-native-v2="1"] .executive-kpi{
    border-radius:16px;
    border-color:color-mix(in srgb,var(--line) 82%,transparent);
    box-shadow:0 8px 22px rgba(0,0,0,.09);
  }
  html[data-orox-mobile-native-v2="1"] .toolbar:not(.product-list-toolbar){
    gap:8px;
    padding:8px;
    border:1px solid color-mix(in srgb,var(--line) 82%,transparent);
    border-radius:15px;
    background:color-mix(in srgb,var(--surface-1) 88%,transparent);
  }
  html[data-orox-mobile-native-v2="1"] .btn{
    border-radius:12px;
  }
  html[data-orox-mobile-native-v2="1"] .btn.primary{
    box-shadow:0 8px 20px color-mix(in srgb,var(--blue) 20%,transparent);
  }
  html[data-orox-mobile-native-v2="1"] .sidebar{
    width:min(330px,calc(100vw - 34px));
    padding:
      max(14px,env(safe-area-inset-top))
      12px
      max(14px,env(safe-area-inset-bottom));
    gap:10px;
    border-inline-end:1px solid rgba(255,255,255,.08);
    background:
      radial-gradient(circle at 18% 0%,rgba(78,140,255,.18),transparent 34%),
      linear-gradient(180deg,#081523 0%,#0b1b2d 55%,#081522 100%);
    box-shadow:0 0 60px rgba(0,0,0,.50);
  }
  html[data-orox-mobile-native-v2="1"] .sidebar .brand{
    justify-content:flex-start;
    min-height:54px;
    padding:2px 8px 12px;
  }
  html[data-orox-mobile-native-v2="1"] .sidebar-brand-logo{
    width:112px;
  }
  html[data-orox-mobile-native-v2="1"] .nav-scroll{
    padding:2px 3px 8px;
  }
  html[data-orox-mobile-native-v2="1"] .nav-section{
    margin-top:6px;
    border:1px solid transparent;
    border-radius:14px;
  }
  html[data-orox-mobile-native-v2="1"] .nav-section.open,
  html[data-orox-mobile-native-v2="1"] .nav-section.has-active{
    border-color:rgba(255,255,255,.07);
    background:rgba(255,255,255,.035);
  }
  html[data-orox-mobile-native-v2="1"] .nav-section-toggle{
    min-height:48px;
    grid-template-columns:34px minmax(0,1fr) 10px;
    gap:9px;
    padding:7px 9px;
    border-radius:13px;
  }
  html[data-orox-mobile-native-v2="1"] .nav-section-icon{
    width:34px;
    height:34px;
    border-radius:11px;
    background:rgba(255,255,255,.085);
  }
  html[data-orox-mobile-native-v2="1"] .nav-submenu{
    gap:4px;
    margin:0 6px 7px;
    padding:5px;
    border-inline-start:0;
    border-radius:12px;
    background:rgba(255,255,255,.025);
  }
  html[data-orox-mobile-native-v2="1"] .nav-submenu .nav-item,
  html[data-orox-mobile-native-v2="1"] .nav-item{
    min-height:44px;
    border-radius:12px;
  }
  html[data-orox-mobile-native-v2="1"] .nav-item.active{
    color:#fff;
    background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 92%,#fff),color-mix(in srgb,var(--purple) 68%,var(--blue)));
    box-shadow:0 8px 22px rgba(0,0,0,.16);
  }
  html[data-orox-mobile-native-v2="1"] .nav-item.active .ico{
    color:#fff;
    border-color:rgba(255,255,255,.18);
    background:rgba(255,255,255,.12);
  }
  html[data-orox-mobile-native-v2="1"] .sidebar-foot{
    margin-top:8px;
    padding:10px 6px 2px;
  }
  html[data-orox-mobile-native-v2="1"] .toast{
    inset-inline:10px;
    inset-block-end:max(12px,env(safe-area-inset-bottom));
    max-width:none;
    border-radius:14px;
  }
}
@media(max-width:430px){
  html[data-orox-mobile-native-v2="1"] .sidebar{
    width:calc(100vw - 22px);
  }
  html[data-orox-mobile-native-v2="1"] .main{
    padding-inline:9px;
  }
  html[data-orox-mobile-native-v2="1"] .view>.hero{
    padding:12px;
    border-radius:17px;
  }
}



/* OROX Mobile Native-Like UX V2 — production mobile layout regression closure */
@media(max-width:680px){
  /* The visible-shell hotfix widened the drawer beyond --sidebar. Hide it by
     its rendered width so no drawer fragment can remain over the app. */
  html[data-orox-mobile-native-v2="1"]:not([dir="rtl"]) body:not(.platform-mode) .sidebar{
    transform:translateX(calc(-100% - 20px));
  }
  html[data-orox-mobile-native-v2="1"][dir="rtl"] body:not(.platform-mode) .sidebar{
    transform:translateX(calc(100% + 20px));
  }
  html[data-orox-mobile-native-v2="1"] body:not(.platform-mode) .sidebar.open{
    transform:none;
  }

  /* Keep the mobile dashboard within the viewport. #dashboardFinancial now
     contains grouped sections, not direct KPI cards, so it must stay one
     section per row while the KPI cards inside each section remain 2-up. */
  html[data-orox-mobile-native-v2="1"] #dashboardView,
  html[data-orox-mobile-native-v2="1"] #dashboardPriority,
  html[data-orox-mobile-native-v2="1"] #dashboardMetrics,
  html[data-orox-mobile-native-v2="1"] #dashboardFinancial,
  html[data-orox-mobile-native-v2="1"] #dashboardAnalytics,
  html[data-orox-mobile-native-v2="1"] #dashboardFollowup{
    width:100%;
    min-width:0;
    max-width:100%;
  }
  html[data-orox-mobile-native-v2="1"] #dashboardFinancial.executive-finance-kpis{
    grid-template-columns:minmax(0,1fr)!important;
    gap:8px;
  }
  html[data-orox-mobile-native-v2="1"] #dashboardFinancial>.dashboard-secondary-section{
    width:100%;
    min-width:0;
    max-width:100%;
  }
  html[data-orox-mobile-native-v2="1"] #dashboardFinancial .dashboard-secondary-items{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:100%;
    min-width:0;
    max-width:100%;
  }
  html[data-orox-mobile-native-v2="1"] #dashboardAnalytics.executive-dashboard-grid,
  html[data-orox-mobile-native-v2="1"] #dashboardFollowup.executive-followup-grid{
    grid-template-columns:minmax(0,1fr)!important;
    width:100%;
    min-width:0;
    max-width:100%;
  }
  html[data-orox-mobile-native-v2="1"] #dashboardAnalytics>.executive-card,
  html[data-orox-mobile-native-v2="1"] #dashboardFollowup>.executive-card{
    grid-column:1!important;
    width:100%;
    min-width:0;
    max-width:100%;
  }
}


/* OROX mobile sidebar desktop-like compact restoration */
@media(max-width:680px){
  /* Keep the current mobile header, but make the drawer compact and desktop-like. */
  html[data-orox-mobile-native-v2="1"] body:not(.platform-mode) .sidebar{
    width:min(var(--sidebar),calc(100vw - 64px));
    z-index:70;
    gap:14px;
  }

  /* Restore the cleaner desktop navigation rhythm instead of card-within-card sections. */
  html[data-orox-mobile-native-v2="1"] body:not(.platform-mode) .nav-section{
    margin-top:5px;
    border:0;
    border-radius:12px;
    background:transparent;
  }
  html[data-orox-mobile-native-v2="1"] body:not(.platform-mode) .nav-section.open,
  html[data-orox-mobile-native-v2="1"] body:not(.platform-mode) .nav-section.has-active{
    border-color:transparent;
    background:transparent;
  }
  html[data-orox-mobile-native-v2="1"] body:not(.platform-mode) .nav-section-toggle{
    min-height:44px;
    grid-template-columns:30px minmax(0,1fr) 10px;
    gap:9px;
    padding:8px 9px;
    border-radius:11px;
  }
  html[data-orox-mobile-native-v2="1"] body:not(.platform-mode) .nav-section-icon{
    width:30px;
    height:30px;
    border-radius:9px;
    background:rgba(255,255,255,.08);
  }
  html[data-orox-mobile-native-v2="1"] body:not(.platform-mode) .nav-submenu{
    gap:1px;
    margin-block:2px 6px;
    margin-inline-start:8px;
    margin-inline-end:0;
    padding:0;
    padding-inline-start:9px;
    border-inline-start:1px solid rgba(255,255,255,.1);
    border-radius:0;
    background:transparent;
  }
  html[data-orox-mobile-native-v2="1"] body:not(.platform-mode) .nav-submenu .nav-item{
    min-height:44px;
    font-size:12px;
    padding:6px 7px;
    margin:1px 0;
    border-radius:11px;
  }

  /* Return active navigation to the restrained desktop-style treatment. */
  html[data-orox-mobile-native-v2="1"] body:not(.platform-mode) .nav-item.active{
    color:var(--text);
    background:linear-gradient(100deg,color-mix(in srgb,var(--nav-tone) 18%,var(--surface-3)),var(--surface-2));
    border:1px solid color-mix(in srgb,var(--nav-tone) 36%,var(--line));
    box-shadow:0 9px 24px rgba(0,0,0,.18);
  }
  html[data-orox-mobile-native-v2="1"] body:not(.platform-mode) .nav-item.active .ico{
    color:var(--nav-tone);
    background:color-mix(in srgb,var(--nav-tone) 19%,var(--surface-2));
    border-color:color-mix(in srgb,var(--nav-tone) 42%,var(--line));
  }
}

@media(max-width:430px){
  html[data-orox-mobile-native-v2="1"] body:not(.platform-mode) .sidebar{
    width:min(var(--sidebar),calc(100vw - 56px));
  }
}


/* OROX brand refresh: keep sidebar identity centered on mobile */
@media(max-width:680px){
  html[data-orox-mobile-native-v2="1"] .sidebar .brand.sidebar-brand{
    justify-content:center;
    align-items:center;
    min-height:92px;
    padding:4px 8px 10px;
  }
  html[data-orox-mobile-native-v2="1"] .sidebar .sidebar-brand-logo{
    width:84px;
    max-width:84px;
  }
}