/* Header spans both columns; the vertical navigation starts below its border. */
html:not(.watch-mode){--site-header-height:80px;--site-sidebar-width:232px;scroll-padding-top:calc(var(--site-header-height) + 16px)}
html:not(.watch-mode) .site-header{position:fixed;inset:0 0 auto 0;z-index:40;display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:12px 24px;min-height:80px;height:auto!important;width:100%;max-width:100%;padding:12px 24px}
.header-brand{display:flex;align-items:center;gap:14px;flex:0 0 auto}
html:not(.watch-mode) .header-brand .brand{width:160px;margin:0;flex-shrink:0}
html:not(.watch-mode) .header-brand .site-logo{width:100%;height:auto;max-width:none}
html:not(.watch-mode) .menu-toggle{display:inline-flex;justify-content:center;align-items:center;width:40px;height:40px;flex-shrink:0;padding:8px;border:0;border-radius:50%;background:transparent;color:var(--ink);cursor:pointer}
.menu-toggle svg{width:24px;height:24px}.menu-toggle:hover{background:var(--line)!important}
html:not(.watch-mode) .site-header .breadcrumb{flex-shrink:0;white-space:nowrap}
html:not(.watch-mode) .site-header .header-right{flex:1 1 500px;display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px 12px;width:auto;min-width:0;max-width:100%;margin-left:auto}
.site-header .member-buttons{flex-wrap:wrap;min-width:0;max-width:100%}
html:not(.watch-mode) .sidebar{position:fixed;inset:var(--site-header-height) auto 0 0;width:var(--site-sidebar-width);height:calc(100dvh - var(--site-header-height));max-width:100%;padding:20px 14px;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;z-index:30;border-bottom:0}
html:not(.watch-mode) .sidebar #nav{display:flex;flex-direction:column;gap:4px;overflow:visible;margin:0;width:100%}
html:not(.watch-mode) .sidebar #nav a{display:flex;flex-direction:row;align-items:center;gap:12px;padding:12px;margin:0;font-size:13px;white-space:nowrap;min-width:0}
.sidebar .nav-icon{flex-shrink:0;text-align:center}.sidebar .nav-text{min-width:0;overflow:hidden;text-overflow:ellipsis}
html:not(.watch-mode) .sidebar .nav-label{display:block;margin:0 12px 16px}
html:not(.watch-mode) .sidebar .side-bottom{display:block;margin-top:24px;padding-top:20px}
html:not(.watch-mode) .main-shell{margin-left:var(--site-sidebar-width);padding-top:var(--site-header-height);min-width:0;width:auto}
html:not(.watch-mode) .nav-backdrop{position:fixed;inset:var(--site-header-height) 0 0;background:#0008;border:0;padding:0;z-index:25}
html[data-site-theme=dark]:not(.watch-mode) body>button.nav-backdrop{background:#0008}
html[data-site-theme=dark] .sidebar #nav a{color:#bdcfc1}
html[data-site-theme=dark] .sidebar #nav a.active{color:#f5fff4}
@media(min-width:801px){
 html.nav-collapsed:not(.watch-mode){--site-sidebar-width:80px}
 html.nav-collapsed:not(.watch-mode) .sidebar{padding:14px 6px}
 html.nav-collapsed:not(.watch-mode) .sidebar :is(.nav-label,.side-bottom,.nav-arrow){display:none}
 html.nav-collapsed:not(.watch-mode) .sidebar #nav a{flex-direction:column;justify-content:center;gap:6px;padding:12px 2px;font-size:10px;min-height:62px}
 html.nav-collapsed:not(.watch-mode) .sidebar .nav-text{max-width:100%}
}
@media(min-width:1200px){html:not(.watch-mode) body.has-notice-rail #notice-rail{top:calc(var(--site-header-height) + 24px);max-height:calc(100dvh - var(--site-header-height) - 40px)}}
@media(max-width:1100px){html:not(.watch-mode) .site-header .breadcrumb{display:none}.site-header .season-pill,.site-header .community{display:none}}
@media(max-width:800px){
 html:not(.watch-mode){--site-sidebar-width:0px;--site-header-height:128px}
 html:not(.watch-mode) .site-header{padding:10px 14px;gap:8px 12px;min-height:64px}
 html:not(.watch-mode) .header-brand{gap:8px}
 html:not(.watch-mode) .header-brand .brand{width:132px}
 html:not(.watch-mode) .site-header .header-right{flex-basis:100%;justify-content:flex-start;gap:6px 8px}
 html:not(.watch-mode) .sidebar{width:min(260px,85vw);padding:16px 12px;transform:translateX(-100%);visibility:hidden;transition:transform .18s ease,visibility .18s}
 html.nav-drawer-open:not(.watch-mode) .sidebar{transform:translateX(0);visibility:visible}
 html.nav-drawer-open:not(.watch-mode) body{overflow:hidden}
 html:not(.watch-mode) .sidebar #nav .nav-arrow{display:block;margin-left:auto}
 html:not(.watch-mode) .main-shell{margin-left:0;width:100%}
 html:not(.watch-mode) .site-header .site-stats{flex-wrap:wrap;min-width:0;max-width:100%;white-space:normal}
}
@media(prefers-reduced-motion:reduce){html:not(.watch-mode) .sidebar{transition:none}}
