/* Keep a narrow icon rail on desktop; expand over content without shifting charts. */
@media (min-width:781px) and (hover:hover) and (pointer:fine){
  .app-shell{grid-template-columns:60px minmax(0,1fr)}
  .sidebar{position:fixed;inset:0 0 auto auto;width:60px;padding:17px 8px 13px;overflow-x:hidden;scrollbar-width:thin;transition:width .18s ease,box-shadow .18s ease}
  .sidebar .brand,.sidebar .group-switch,.sidebar .nav-list,.sidebar .nav-label,.sidebar .sidebar-status{width:198px;max-width:none;flex-shrink:0}
  .sidebar .brand{white-space:nowrap}
  .sidebar .brand-mark,.sidebar .nav-item>span,.sidebar .live-dot{flex-shrink:0}
  .sidebar .nav-item{white-space:nowrap;min-width:0;font-size:0}
  .sidebar:is(:hover,:has(:focus-visible)) .nav-item{font-size:12.5px}
  .sidebar .brand>div:not(.brand-mark),.sidebar .group-switch,.sidebar .nav-label,.sidebar .sidebar-status>div{opacity:0;pointer-events:none;transition:opacity .12s ease}
  .sidebar:is(:hover,:has(:focus-visible)){width:214px;box-shadow:-14px 0 35px rgba(14,22,37,.2)}
  .sidebar:is(:hover,:has(:focus-visible)) .brand>div:not(.brand-mark),.sidebar:is(:hover,:has(:focus-visible)) .group-switch,.sidebar:is(:hover,:has(:focus-visible)) .nav-label,.sidebar:is(:hover,:has(:focus-visible)) .sidebar-status>div{opacity:1;pointer-events:auto}
  .main{grid-column:2}
}
@media (prefers-reduced-motion:reduce){.sidebar,.sidebar .brand>div,.sidebar .group-switch,.sidebar .nav-label,.sidebar .sidebar-status>div{transition:none!important}}