/* Shared shell structure, loaded for every installation. Colours remain owned by
   the tenant presentation; First 4's later stylesheet supplies its visual system. */
.f4-navigation-rail{overflow:hidden;transition:width 160ms ease-out}
.f4-navigation-header{flex-shrink:0;padding:24px 20px 20px}
.f4-navigation-brand{display:block}
.f4-navigation-header img{display:block;max-width:100%;height:auto;object-fit:contain}
.f4-navigation-content{display:flex;flex-direction:column;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:16px 12px}
.f4-navigation-list{margin:0;padding:0;list-style:none}
.f4-navigation-list>li+li{margin-top:4px}
.f4-navigation-rail :is(.sidebar-link,.f4-navigation-group){display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:10px 12px;font-size:14px;line-height:20px;text-align:left}
.f4-navigation-rail .sidebar-icon{width:20px;height:20px;margin:0;flex-shrink:0}
.f4-navigation-rail .nav-label{min-width:0;overflow-wrap:break-word}
.f4-navigation-secondary{margin-top:20px;padding-top:12px}
.f4-navigation-settings{margin-top:auto;padding-top:24px}
.f4-navigation-group::after{content:'';width:8px;height:8px;margin-left:auto;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.f4-navigation-group[aria-expanded=true]::after{transform:rotate(225deg)}
.f4-navigation-submenu:not(.hidden){padding:4px 0 8px 12px;margin-left:20px}
.f4-navigation-create{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;margin-bottom:16px;padding:10px 12px;border-radius:4px;background:var(--platform-primary);color:white;font-size:14px;font-weight:600;line-height:20px}
.f4-navigation-badge{flex-shrink:0;min-width:24px;margin-left:auto;padding:2px 6px;border:1px solid currentColor;border-radius:4px;font-size:12px;line-height:16px;text-align:center;font-variant-numeric:tabular-nums}
.f4-navigation-footer{display:flex;align-items:center;flex-shrink:0;gap:4px;padding:8px;border-top:1px solid currentColor}
.f4-navigation-profile{display:flex;align-items:center;flex:1;min-width:0;min-height:52px;gap:8px;padding:8px;text-align:left}
.f4-navigation-avatar{display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;border:1px solid currentColor;border-radius:50%;font-size:12px;font-weight:600}
.f4-navigation-profile-copy{display:flex;flex-direction:column;min-width:0;gap:2px}
.f4-navigation-profile-name,.f4-navigation-profile-hint{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:18px}
.f4-navigation-profile-name{font-size:13px;font-weight:600}
.f4-navigation-profile-hint{font-size:11px;line-height:16px}
.f4-navigation-collapse{display:grid;place-items:center;flex-shrink:0;width:44px;height:44px}
/* Above the legacy app.css rail's z-index:40, so the resize hit area remains usable. */
#sidebarResizeHandle.f4-navigation-resize{position:absolute;right:-3px;top:0;bottom:0;z-index:50;width:8px;cursor:col-resize}
.f4-navigation-rail :is(a,button,[tabindex]):focus-visible,.f4-navigation-mobile-bar button:focus-visible,.f4-navigation-resize:focus-visible{outline:3px solid currentColor;outline-offset:2px}
.f4-navigation-rail.sidebar-collapsed :is(.sidebar-content,.nav-label,.submenu,.f4-navigation-badge){display:none!important}
.f4-navigation-rail.sidebar-collapsed .f4-navigation-content{padding:12px 8px}
.f4-navigation-rail.sidebar-collapsed .f4-navigation-list>li:has(.sidebar-section){display:none}
.f4-navigation-rail.sidebar-collapsed :is(.sidebar-link,.f4-navigation-group,.f4-navigation-create){justify-content:center;width:44px;min-height:44px;padding:12px;gap:0}
.f4-navigation-rail.sidebar-collapsed .f4-navigation-group::after{display:none}
.f4-navigation-rail.sidebar-collapsed .f4-navigation-footer{flex-direction:column;padding:8px;gap:4px}
.f4-navigation-rail.sidebar-collapsed .f4-navigation-profile{justify-content:center;flex:auto;width:44px;min-height:44px;padding:6px;gap:0}
.f4-navigation-mobile-bar,.f4-navigation-rail .mobile-sidebar-control,#mobileSidebarBackdrop{display:none}
@media(max-width:640px){
  #main-content{--navigation-mobile-bar-height:56px}
  #sidebarWrapper.f4-navigation-wrapper{width:0!important}
  #sidebar.f4-navigation-rail{position:absolute;inset:0 auto 0 0;z-index:42;height:100%;width:280px;max-width:calc(100vw - 44px);transition:none}
  #sidebar.f4-navigation-rail:not(.mobile-drawer-open){display:none}
  #sidebar.f4-navigation-rail.mobile-drawer-motion{transition:width 160ms ease-out}
  #sidebarResizeHandle,.f4-navigation-rail .f4-navigation-collapse{display:none}
  .f4-navigation-rail .mobile-sidebar-control{display:flex;align-items:center;flex-shrink:0;min-height:56px;padding:6px 12px}
  .f4-navigation-mobile-trigger,.f4-navigation-mobile-close{display:flex;align-items:center;gap:8px;min-height:44px;padding:10px 12px;font-size:14px;font-weight:600;line-height:20px}
  #mobileSidebarBackdrop:not([hidden]){display:block;position:fixed;inset:0;z-index:41;background:CanvasText;opacity:.36;cursor:pointer}
  .f4-navigation-mobile-bar{display:flex;position:sticky;top:0;z-index:20;align-items:center;justify-content:space-between;flex-shrink:0;gap:12px;min-height:56px;padding:6px 12px;background:Canvas;color:CanvasText}
  /* Keep the environment warning readable below the persistent Menu toolbar. */
  #main-content>#testModeBanner{position:sticky;top:var(--navigation-mobile-bar-height);z-index:19;flex-shrink:0}
  .f4-navigation-mobile-brand{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:600}
  .dark-mode .f4-navigation-mobile-bar{color-scheme:dark}
}
/* Short viewports need space for focused controls beneath the Menu toolbar.
   Keep the full environment warning in the normal scrolling content. */
@media(max-width:640px) and (max-height:480px){
  #main-content{scroll-padding-top:calc(var(--navigation-mobile-bar-height) + 8px)}
  #main-content>#testModeBanner{position:static}
}
@media(prefers-reduced-motion:reduce){.f4-navigation-rail,.f4-navigation-rail *,.f4-navigation-resize{transition:none!important}}