/* STAR ONE v4.7.16-r26.6.7.0.21 — page and responsive contract hardening */
*,*::before,*::after{box-sizing:border-box}
html,body,#appShell,.vnext-app-body,.page-wrap,#mainContent,.content{min-width:0;max-width:100%}
html,body{overflow-x:hidden}
.page-wrap,#mainContent,.content{width:100%}
.content>*{min-width:0}

/* One deterministic rail geometry. Page-specific CSS must not resize a nav item. */
.vnext-rail .vnext-nav-item,.vnext-nav-drawer .vnext-nav-item{
  width:100%!important;min-width:0!important;max-width:none!important;
  display:grid!important;grid-template-columns:32px minmax(0,1fr)!important;
  align-items:center!important;justify-items:start!important;column-gap:10px!important;
  transform:none!important;margin-inline:0!important;padding-inline:12px!important;
}
.vnext-rail .vnext-nav-icon,.vnext-nav-drawer .vnext-nav-icon{
  width:32px!important;height:32px!important;display:grid!important;place-items:center!important;
  margin:0!important;transform:none!important;justify-self:center!important;
}
[data-vnext-rail="collapsed"] .vnext-rail .vnext-nav-item{
  grid-template-columns:1fr!important;padding-inline:0!important;justify-items:center!important;
}
[data-vnext-rail="collapsed"] .vnext-rail .vnext-nav-icon{justify-self:center!important}
[data-vnext-rail="collapsed"] .vnext-rail .vnext-nav-label{display:none!important}

/* Compact command surfaces wrap instead of forcing horizontal page overflow. */
.toolbar,.button-row,.filter-row,.filters,.page-actions,.header-actions,.compact-command-bar,
.strategy-filter-bar,.timeline-filter-bar,.watchlist-command-bar,.broker-command-bar{
  min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:8px
}
.toolbar>*,.button-row>*,.filter-row>*,.filters>*,.page-actions>*{min-width:0}
input,select,textarea,button{max-width:100%}

/* Tables own their horizontal overflow; the full application must not scroll sideways. */
.table-wrap,.table-scroll,.responsive-table,.data-table-wrap,.timeline-table-wrap,
.watchlist-table-wrap,.broker-table-wrap,.report-table-wrap{max-width:100%;overflow:auto;overscroll-behavior-inline:contain}
table{max-width:100%}
.content table{width:100%;border-collapse:collapse}
.content th,.content td{overflow-wrap:anywhere}

/* Stable cards and form grids across desktop/tablet/mobile. */
.grid,.form-grid,.summary-grid,.readiness-grid,.timeline-summary-grid,.cards-grid{
  min-width:0;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr))
}
.card,.surface,.panel,.strategy-row,.timeline-card{min-width:0;max-width:100%}
pre,code,.json-view,.payload-view{max-width:100%;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere}

/* Modals/drawers always fit the current viewport and cannot trap off-screen controls. */
.modal,.drawer{padding:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}
.modal-card,.drawer-card,.command-box{width:min(960px,calc(100vw - 20px));max-width:100%;max-height:calc(100dvh - 20px);overflow:auto}
.modal-actions{position:sticky;bottom:0;z-index:2;background:inherit;flex-wrap:wrap}

/* Long list controls retain a usable touch target without making desktop pages tall. */
.btn,.icon-btn,.nav,button{min-height:34px}
.btn.mini,button.mini{min-height:30px}

@media (max-width:1024px){
  .watchlist-layout,.broker-layout,.timeline-layout,.page-two-column,.two-column-layout{grid-template-columns:minmax(0,1fr)!important}
  .readiness-panel,.secondary-panel{position:static!important;max-height:none!important}
  .header-actions .badge{display:none}
}
@media (max-width:768px){
  .content{padding-inline:10px!important}
  .toolbar,.page-actions{align-items:stretch}
  .toolbar>.button-row,.page-actions>.button-row{width:100%}
  .toolbar select,.toolbar input,.filter-row select,.filter-row input{flex:1 1 160px}
  .content th,.content td{padding:7px 8px!important;font-size:12px}
  .modal-card,.drawer-card{width:calc(100vw - 12px);max-height:calc(100dvh - 12px)}
}
@media (max-width:480px){
  .button-row>.btn,.button-row>button,.page-actions>.btn,.page-actions>button{flex:1 1 auto}
  .summary-grid,.readiness-grid,.timeline-summary-grid{grid-template-columns:1fr!important}
  .content{padding-inline:6px!important}
}

/* Page navigation keeps the existing DOM in place while one bootstrap request runs. */
#content.page-bootstrap-pending-r267021{cursor:progress}
#content.page-bootstrap-pending-r267021::before{content:"";position:fixed;z-index:1200;top:var(--header-height,64px);left:var(--vnext-rail-width,80px);right:0;height:2px;background:currentColor;opacity:.18;animation:starone-bootstrap-progress-r267021 .9s ease-in-out infinite alternate;pointer-events:none}
@keyframes starone-bootstrap-progress-r267021{from{transform:scaleX(.08);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}
@media(max-width:768px){#content.page-bootstrap-pending-r267021::before{left:0}}
