/* T40 shell refinements: shared chrome only; page business layouts stay unchanged. */
.sh2-scope{min-width:0}
#navV5{min-width:0;overflow-x:auto;scrollbar-width:thin}
#navV5 a{white-space:nowrap}
#wSub{position:sticky;top:var(--bar-h,56px);z-index:4;min-width:0;overflow-x:auto;scrollbar-width:thin;background:var(--surface-solid);border-top:1px solid var(--line);padding:6px 0 2px}
#wSub .w-sub-seg{min-width:max-content}
#wSub .w-sub-seg button{border-bottom:2px solid transparent;font-weight:500}
#wSub .w-sub-seg button[aria-pressed="true"],#wSub .w-sub-seg button[aria-current="page"]{border-bottom-color:var(--accent);font-weight:700;color:var(--text)}
#view>section.panel:first-child,.w-page>section.panel:first-child{margin-top:clamp(14px,2vw,24px)}
#view .kicker{margin-bottom:6px;color:var(--muted);font-family:var(--mono);font-size:.75rem;letter-spacing:.04em;text-transform:uppercase}
#view .panel-head{gap:8px}
#view .empty,#view .loading{min-height:96px;display:grid;place-items:center;border:1px dashed var(--line-strong);background:var(--surface-2)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
@media (max-width:640px){
  #navV5{flex:1;order:3;flex-basis:100%;padding-top:4px}
  #bar{flex-wrap:wrap}
  #wSub{top:calc(var(--bar-h,56px) + 42px);margin-inline:-10px;padding-inline:10px}
  #view>section.panel:first-child{margin-top:12px}
}
@media (prefers-reduced-motion:reduce){#wSub{scroll-behavior:auto}#wSub *{transition:none!important;animation:none!important}}
[data-style="classic"] #wSub{box-shadow:0 2px 8px var(--line)}

/* F5-R: shared shell controls use common heights without changing shell flow. */
#bar{--sh2-control-height:max(32px,2rem);align-items:center}
#bar :is(.bar-right,.w-estop-group,.w-sub-seg){align-items:center}
/* State-independent sizing: 2rem alone is only 30px at the site's 15px root. */
body.app #bar :is(button,.icon-btn,#pillSess,input,select),
body.app #navV5 a[data-page]{
  height:var(--sh2-control-height);
  min-height:var(--sh2-control-height);
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
#bar .btn.sm{padding-block:0;line-height:1.2}
#bar .icon-btn{width:var(--sh2-control-height);aspect-ratio:1}
#pillSess{color:var(--text);background:var(--surface-2);flex:0 0 auto}
#btnEstop{color:var(--danger-text)!important;background:var(--surface-2)!important;border-color:var(--danger-text)!important}
#btnEstop:disabled{color:var(--text)!important;border-color:var(--line-strong)!important;opacity:1}
body.app #pillSess{background:var(--surface-2)}
@media(max-width:640px){
  #bar{--sh2-control-height:max(40px,2.5rem)}
}

/* F5: keep selected foreground/background paired in every skin and state.
   --ink changes with the theme; do not pair an inherited ink fill with --text. */
body.app :is(button,.btn,[role="button"],.tc-f,.chip):is([aria-pressed="true"],[aria-selected="true"],[aria-current="page"]),
body.app #wSub .w-sub-seg button:is([aria-pressed="true"],[aria-current="page"]),
body.app .chip.accent{
  background:var(--surface-2)!important;
  color:var(--text)!important;
  border-color:var(--text);
}
body.app :is(.seg button,.tc-f,.chip):is([aria-pressed="true"],[aria-selected="true"],[aria-current="page"]) :is(b,span),
body.app .chip.accent :is(b,span){color:inherit}
/* Disabled is conveyed by cursor/border as well as semantics, not faded text. */
body.app :is(.btn,.icon-btn,.seg button,.tc-f,.chip,input,select,textarea):is(:disabled,[aria-disabled="true"]){
  opacity:1;
  color:var(--text)!important;
  background:var(--surface-2)!important;
  border-style:dashed;
  cursor:not-allowed;
}
body.app :is(button,[role="button"],a,input,select,textarea):focus-visible{
  outline:3px solid var(--text)!important;
  outline-offset:3px;
}
/* Small neutral chip labels measured 3.84:1 on the magazine surface.
   Status remains available through its label, icon, border and tinted fill. */
body.app .chip{color:var(--text)}
/* Classic accent + small white type measured 4.35:1. Use the existing
   pastel/lime primary fill and a theme-aware dark token instead. */
body.app .btn.primary:not(:disabled):not([aria-disabled="true"]):not([aria-pressed="true"]):not([aria-selected="true"]){
  background:var(--lime)!important;
  color:var(--ink)!important;
}
:root[data-theme="dark"] body.app .btn.primary:not(:disabled):not([aria-disabled="true"]):not([aria-pressed="true"]):not([aria-selected="true"]){color:var(--ink-text)!important}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) body.app .btn.primary:not(:disabled):not([aria-disabled="true"]):not([aria-pressed="true"]):not([aria-selected="true"]){color:var(--ink-text)!important}
}

