/* STARONE_V4716R26_6_4_10_RESPONSIVE_BASELINE
 * Measurement-first responsive guardrails. This file deliberately avoids a
 * page redesign; it establishes safe viewport primitives for the vNext UI.
 */
:root{
  --starone-safe-top:env(safe-area-inset-top,0px);
  --starone-safe-right:env(safe-area-inset-right,0px);
  --starone-safe-bottom:env(safe-area-inset-bottom,0px);
  --starone-safe-left:env(safe-area-inset-left,0px);
  --starone-visual-viewport-height:100vh;
  --starone-keyboard-inset:0px;
  --starone-touch-target:40px;
}
*,*::before,*::after{box-sizing:border-box}
html,body{max-width:100%;min-width:0}
img,svg,video,canvas{max-width:100%;height:auto}
.app-shell,.app-header,.page-wrap,.content,.card,.surface,.grid,.toolbar,.top-row,.header-actions,.main-nav{min-width:0}
.app-header>* , .grid>* , .toolbar>* , .top-row>* , .header-actions>*{min-width:0}
input,select,textarea,button{max-width:100%}
:where(button,a,input,select,textarea,[tabindex]):focus-visible{outline:3px solid color-mix(in srgb,var(--primary,#2563eb) 72%,white);outline-offset:2px}

/* Keep generic overlays within the visual viewport. Domain tables can retain
 * their own explicitly scoped horizontal scrollers inside the dialog. */
.modal,.drawer{padding-top:max(10px,var(--starone-safe-top));padding-right:max(10px,var(--starone-safe-right));padding-bottom:max(10px,var(--starone-safe-bottom));padding-left:max(10px,var(--starone-safe-left))}
.modal-card,.drawer-card{max-width:calc(100vw - max(20px,calc(var(--starone-safe-left) + var(--starone-safe-right))));max-height:min(92vh,calc(var(--starone-visual-viewport-height) - 20px));overscroll-behavior:contain}
#modalBody,#drawerBody{min-width:0}

/* Current mobile bar has six entries. The legacy 5-column rule caused the
 * sixth action to wrap between 641px and 900px. Keep it single-row until the
 * vNext five-item shell lands in r26.6.7.0. */
@media(max-width:900px){
  .mobile-bottom-nav{grid-template-columns:repeat(6,minmax(0,1fr));height:calc(62px + var(--starone-safe-bottom));padding-bottom:var(--starone-safe-bottom)}
  .page-wrap{padding-bottom:calc(74px + var(--starone-safe-bottom))}
}

@media(pointer:coarse){
  :where(button,.btn,.icon-btn,.nav,.avatar,summary,[role="button"]){min-height:var(--starone-touch-target)}
  :where(input,select,textarea){min-height:var(--starone-touch-target);font-size:max(16px,1em)}
}

/* Low-bandwidth mode is observational in this release. Only nonessential
 * animation/backdrop cost is reduced; live market and execution data remain. */
html[data-starone-network="low"] *,
html[data-starone-network="low"] *::before,
html[data-starone-network="low"] *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
html[data-starone-network="low"] :where(.app-header,.r257-tabs,.modal-head){backdrop-filter:none!important}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* Visible only when ?uiAudit=1 or the diagnostic API explicitly enables it. */
.starone-r26410-audit-badge{position:fixed;right:max(8px,var(--starone-safe-right));top:max(8px,var(--starone-safe-top));z-index:2147483600;max-width:min(360px,calc(100vw - 16px));padding:7px 9px;border:1px solid color-mix(in srgb,var(--line,#cbd5e1) 85%,transparent);border-radius:9px;background:color-mix(in srgb,var(--surface,#fff) 94%,transparent);box-shadow:0 8px 24px rgba(15,23,42,.18);font:700 11px/1.35 system-ui,sans-serif;color:var(--text,#0f172a);pointer-events:none;white-space:normal}
.starone-r26410-audit-badge[data-status="warn"]{border-color:#f59e0b;color:#92400e}
.starone-r26410-audit-badge[data-status="bad"]{border-color:#ef4444;color:#991b1b}
