/* Sidebar size is independent of the selected color theme and build settings. */
.sidebar-icon-button{width:36px;height:36px;min-width:36px;display:inline-flex;align-items:center;justify-content:center;padding:8px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}
.sidebar-icon-button:hover{color:var(--text);background:var(--soft-accent,var(--panel2))}.sidebar-icon-button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.sidebar-icon-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sidebar-controls{display:flex;align-items:center;gap:10px;margin-bottom:2px;min-height:36px}.sidebar-control-label{font-size:11px;font-weight:600;color:var(--muted)}.sidebar-close,.sidebar-mobile-toggle,.sidebar-backdrop{display:none}.sidebar .nav-link{position:relative}.sidebar .nav-label{line-height:1.45}.sidebar .nav-link svg{flex:0 0 17px}
@media(min-width:851px){
 .shell{display:grid;grid-template-columns:205px minmax(0,1fr)}
 /* Both sizes occupy their own grid column. The shared sticky offset follows
    the visible header, while only the navigation list scrolls on short screens. */
 .sidebar{position:sticky;top:var(--sidebar-sticky-top,12px);align-self:start;max-height:calc(100dvh - var(--sidebar-sticky-top,12px) - 16px);padding-top:19px;padding-bottom:19px;gap:20px;overflow:visible;min-width:0;min-height:0;z-index:4}
 .sidebar-controls{flex-shrink:0}
 .sidebar-navigation{display:flex;flex-direction:column;min-height:0}
 .sidebar-navigation .nav-title{flex-shrink:0}
 .sidebar .nav{min-height:0;overflow:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
 .sidebar .sidebar-bottom{flex-shrink:0}
 html[data-sidebar-size="collapsed"] .shell{grid-template-columns:64px minmax(0,1fr)}
 html[data-sidebar-size="collapsed"] .sidebar{padding:19px 10px;align-items:stretch}
 html[data-sidebar-size="collapsed"] .sidebar-controls{justify-content:center;flex-shrink:0}
 html[data-sidebar-size="collapsed"] .sidebar>div:not(.sidebar-controls):not(.sidebar-bottom){min-height:0}
 html[data-sidebar-size="collapsed"] .sidebar-control-label,html[data-sidebar-size="collapsed"] .sidebar .nav-title,html[data-sidebar-size="collapsed"] .sidebar-bottom,html[data-sidebar-size="collapsed"] .sidebar .soon-dot{display:none}
 html[data-sidebar-size="collapsed"] .sidebar-desktop-toggle svg{transform:rotate(180deg)}
 html[data-sidebar-size="collapsed"] .sidebar .nav{gap:6px;width:52px;margin:-4px;padding:4px}
 html[data-sidebar-size="collapsed"] .sidebar .nav-link{width:100%;min-height:44px;padding:13px 9px;justify-content:center}
 html[data-sidebar-size="collapsed"] .sidebar .nav-label{position:fixed;left:var(--rail-tooltip-left,74px);top:var(--rail-tooltip-top,100px);transform:translateY(-50%);white-space:nowrap;padding:9px 12px;border:1px solid var(--line);border-radius:7px;background:var(--surface,var(--panel));box-shadow:0 4px 18px #0002;color:var(--text);font-size:12px;z-index:40;visibility:hidden;opacity:0;pointer-events:none}
 html[data-sidebar-size="collapsed"] .sidebar .nav-link:is(:hover,:focus-visible) .nav-label{visibility:visible;opacity:1}
}
/* Navigation takes priority over the optional channel promo on laptop heights.
   The same channel link remains available in the page footer. */
@media(min-width:851px) and (max-height:900px){.sidebar .sidebar-bottom{display:none}}
@media(max-width:850px){
 .shell{display:block;min-height:calc(100vh - 70px)}
 .topbar{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;padding-left:14px;padding-right:14px}
 .sidebar-mobile-toggle{display:inline-flex}.topbar .top-right{justify-content:flex-end}.topbar .private-badge{display:none}
 .sidebar{position:fixed;inset:0 auto 0 0;width:min(300px,calc(100vw - 46px));height:100dvh;z-index:60;display:flex;flex-direction:column;padding:20px 17px 26px;gap:20px;background:var(--surface,var(--panel));border-right:1px solid var(--line);border-bottom:0;overflow:auto;overscroll-behavior:contain;box-shadow:16px 0 50px #0004;transform:translateX(-105%);visibility:hidden}
 html[data-theme="light"] .sidebar{background:#eef2f2}
 html[data-sidebar-drawer="open"] .sidebar{transform:translateX(0);visibility:visible}
 .sidebar>div{display:block}.sidebar>.sidebar-controls{display:flex;margin:0;align-items:center;justify-content:space-between;gap:12px}.sidebar-controls .sidebar-control-label{font-size:15px;color:var(--text)}
 .sidebar-desktop-toggle{display:none}.sidebar-close{display:inline-flex}.sidebar .nav-title{display:block;padding:0 12px;margin:6px 0 15px}.sidebar .nav{display:grid;width:auto;padding:0;gap:6px}.sidebar .nav-link{padding:13px;white-space:normal;min-height:44px;font-size:13px}.sidebar .nav-label{position:static}.sidebar .nav-link.active{box-shadow:inset 3px 0 var(--accent)}
 .sidebar .sidebar-bottom{display:block;margin-top:auto;padding:20px 12px 0}.sidebar-bottom p{font-size:12px}.sidebar .soon-dot{display:block}
 .sidebar-backdrop{display:block;position:fixed;inset:0;width:100%;height:100dvh;background:#030b16a6;z-index:50;border:0;border-radius:0;padding:0;cursor:pointer}.sidebar-backdrop[hidden]{display:none!important}
}
@media(max-width:620px){
 .topbar{grid-template-columns:32px minmax(0,1fr) auto;gap:8px;min-height:76px;height:auto;padding:10px}
 .sidebar-mobile-toggle{width:32px;min-width:32px;height:36px;padding:6px}
 .topbar .theme-toggle{padding:8px 6px;gap:3px;font-size:9px;min-height:36px}.topbar .theme-icon{display:none}
}
@media(max-width:360px){.topbar{gap:6px;padding:10px 8px}.topbar .theme-toggle{padding:8px 5px;font-size:8px;gap:3px}}