
/* 2026-10-30: accessible, compact nested sidebar navigation. */
.app-shell{grid-template-columns:256px minmax(0,1fr)}
.sidebar{height:100vh;height:100dvh;width:256px;overflow:hidden}
.sidebar .brand{flex-shrink:0}
.sidebar nav{
  min-height:0;flex:0 1 auto;overflow-y:auto;overflow-x:hidden;
  align-content:start;overscroll-behavior:contain;
  padding:0 3px 9px 0;scrollbar-gutter:stable;
}
.sidebar nav>.nav-item{width:100%;min-height:44px;font-size:18px;line-height:1.45}
.sidebar .nav-disclosure{min-width:0}
.sidebar .nav-group-trigger{
  display:flex;align-items:center;gap:12px;min-height:44px;
  padding:11px 12px;border-radius:9px;color:#b8cbc7;
  cursor:pointer;list-style:none;font-weight:700;font-size:18px;
  line-height:1.4;user-select:none;
}
.sidebar .nav-group-trigger::-webkit-details-marker{display:none}
.sidebar .nav-group-trigger::marker{content:""}
.sidebar .nav-group-trigger:hover,
.sidebar .nav-group-trigger:focus-visible{background:rgba(255,255,255,.09);color:#fff}
.sidebar .nav-disclosure.has-active>.nav-group-trigger{color:#fff}
.sidebar .nav-group-label{font-size:18px;min-width:0;flex:1 1 auto}
.sidebar .nav-chevron{
  display:block;flex:0 0 7px;width:7px;height:7px;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(-45deg);transition:transform .17s ease;
}
.sidebar .nav-disclosure[open]>.nav-group-trigger .nav-chevron{transform:rotate(45deg)}
.sidebar .nav-subitems{
  display:grid;gap:2px;margin:2px 0 6px 18px;
  padding:1px 0 3px 9px;border-left:1px solid rgba(197,224,214,.2);
}
.sidebar .nav-disclosure:not([open])>.nav-subitems{display:none}
.sidebar .nav-subitem{
  width:100%;min-height:44px;padding:9px 8px;gap:9px;
  font-size:16px;line-height:1.5;border-radius:8px;
}
.sidebar .nav-subitem .icon{width:16px;height:16px}
.sidebar .nav-disclosure .nav-item.active{
  background:rgba(255,255,255,.11);
  box-shadow:inset 3px 0 var(--amber);
}
.sidebar-group-filter,.sidebar-bottom{flex-shrink:0}
.sidebar .sidebar-group-filter{padding-top:12px;margin-top:9px}
.sidebar .sidebar-group-filter label{font-size:16px}
.sidebar .sidebar-group-filter select{font-size:16px}
.sidebar .sidebar-bottom .status-line{margin-bottom:11px;font-size:16px}
@media(max-width:720px){
  .app-shell{display:block}
  .sidebar .sidebar-group-filter select{font-size:16px}
}
@media(max-height:740px){
  .sidebar{padding-top:16px;padding-bottom:14px}
  .sidebar .brand{padding-bottom:14px}
  .sidebar nav{margin-top:13px}
}
@media(prefers-reduced-motion:reduce){
  .sidebar .nav-chevron{transition:none}
}
