/* Header only. Page content and Phase 11B cards are deliberately untouched. */
html {scroll-padding-top:calc(var(--site-header-height, 9rem) + 12px);}
.site-header {position:sticky;top:0;z-index:100;background:var(--brand-900);color:white;border-bottom:1px solid rgba(255,255,255,.1);}
/* Keep the existing Session sidebar below the header even when desktop links wrap. */
main .signup-panel {top:calc(var(--site-header-height, 72px) + 20px);}
.header-inner {position:relative;max-width:var(--content-width);min-height:72px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px;}
.header-top {flex-shrink:0;}
.site-name {font-size:20px;font-weight:750;letter-spacing:-.025em;}
.site-name a,.site-name a:hover {display:flex;align-items:center;gap:11px;min-height:44px;color:white;text-decoration:none;}
.brand-mark {width:36px;height:36px;display:inline-grid;place-items:center;border-radius:11px;background:rgba(255,255,255,.16);font-size:14px;letter-spacing:0;}
.site-menu {display:contents;}
.site-menu-toggle {display:none;}
.site-header .mobile-notifications {display:none;}
.main-nav {display:flex;align-items:center;justify-content:flex-end;gap:2px;flex-wrap:wrap;min-width:0;margin-left:auto;}
.main-nav>a,.nav-disclosure>summary,.site-menu-toggle {position:relative;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:10px 9px;border-radius:8px;color:white;font-size:14px;font-weight:650;line-height:1.3;text-decoration:none;cursor:pointer;}
.site-menu>.site-menu-toggle {display:none;}
.nav-disclosure {position:relative;}
.nav-disclosure>summary {list-style:none;}
.nav-disclosure>summary::-webkit-details-marker,.site-menu-toggle::-webkit-details-marker {display:none;}
.nav-disclosure>summary::after {content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin:0 2px 3px 4px;}
.nav-disclosure[open]>summary::after {transform:rotate(225deg);margin-top:5px;}
.main-nav>a:hover,.nav-disclosure>summary:hover,.main-nav>a.active,.nav-section-active>summary {background:rgba(255,255,255,.13);color:white;}
.main-nav>a.active::before,.nav-section-active>summary::before {content:"";position:absolute;left:10px;right:10px;bottom:5px;height:2px;background:white;}
.nav-panel {position:absolute;right:0;top:calc(100% + 8px);width:244px;max-width:calc(100vw - 36px);max-height:calc(100dvh - var(--site-header-height, 72px) - 16px);overflow-y:auto;padding:8px;border:1px solid var(--border);border-radius:var(--radius-md);background:white;color:var(--ink-950);box-shadow:var(--shadow-sm);}
.nav-panel>a,.site-header .nav-panel .nav-install-button,.site-header .nav-panel .nav-logout-button {display:flex;align-items:center;width:100%;min-height:44px;padding:10px 12px;border:0;border-radius:6px;background:transparent;color:var(--ink-800);font:inherit;font-size:14px;font-weight:600;text-align:left;text-decoration:none;white-space:normal;overflow-wrap:anywhere;cursor:pointer;}
.nav-panel>a:hover,.site-header .nav-panel button:hover,.nav-panel>a.active {background:var(--brand-50);color:var(--brand-900);}
.nav-panel>a.active {text-decoration:underline;}
.nav-logout-form {margin:0;}
.nav-unread {display:inline-grid;place-items:center;min-width:23px;padding:3px 5px;border-radius:12px;background:var(--brand-100);color:var(--brand-900);font-size:14px;}
.nav-unread .sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
.site-header a:focus-visible,.site-header summary:focus-visible {outline:2px solid white;outline-offset:2px;}
.site-header .nav-panel a:focus-visible,.site-header .nav-panel button:focus-visible {outline:3px solid var(--brand-700);outline-offset:-3px;}
.public-nav {display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;}
.public-nav a,.site-header .public-install-button {display:inline-flex;align-items:center;min-height:44px;padding:10px 12px;color:white;font-size:14px;font-weight:650;text-decoration:none;}
.public-signup {border:1px solid rgba(255,255,255,.5);border-radius:8px;}
@media(max-width:1050px) {
.header-inner {display:block;padding:14px 18px;}
.header-top {min-height:44px;padding-right:70px;}
.header-top:has(.mobile-notifications) {display:flex;align-items:flex-start;gap:8px;}
.header-top:has(.mobile-notifications) .site-name {flex:1;min-width:0;}
.header-top:has(.mobile-notifications) .site-name a {min-width:0;}
.header-top:has(.mobile-notifications) .site-name a>span:last-child {overflow-wrap:anywhere;}
.site-header .mobile-notifications {display:inline-flex;align-items:center;justify-content:center;gap:5px;flex:0 0 auto;min-width:44px;min-height:44px;padding:6px;border-radius:8px;color:white;text-decoration:none;}
.site-header .mobile-notifications:hover {background:rgba(255,255,255,.13);color:white;}
.mobile-notifications svg {flex:0 0 22px;}
.mobile-notifications .nav-unread {min-width:20px;max-width:5ch;padding:2px 4px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums;}
.main-nav>.nav-notifications {display:none;}
.site-name {font-size:19px;}
.brand-mark {width:34px;height:34px;}
.site-menu {display:block;}
.site-menu>.site-menu-toggle {display:inline-flex;position:absolute;right:18px;top:14px;min-width:60px;justify-content:center;list-style:none;border:1px solid rgba(255,255,255,.4);}
.main-nav {position:absolute;top:100%;left:0;right:0;z-index:1;display:flex;flex-direction:column;align-items:stretch;gap:3px;margin:0;padding:12px 18px;border-top:1px solid rgba(255,255,255,.18);background:var(--brand-900);max-height:calc(100dvh - var(--site-header-height, 9rem) - 8px);overflow-y:auto;overscroll-behavior:contain;}
.nav-panel {position:static;width:auto;max-width:none;max-height:none;overflow:visible;padding:0 0 4px 12px;background:transparent;box-shadow:none;border:0;border-radius:0;}
.nav-panel>a,.site-header .nav-panel .nav-install-button,.site-header .nav-panel .nav-logout-button {color:white;}
.nav-panel>a:hover,.site-header .nav-panel button:hover,.nav-panel>a.active {background:rgba(255,255,255,.13);color:white;}
.site-header .nav-panel a:focus-visible,.site-header .nav-panel button:focus-visible {outline:2px solid white;outline-offset:-3px;}
.nav-disclosure {border-top:1px solid rgba(255,255,255,.18);padding-top:4px;}
.nav-disclosure>summary {width:100%;}
.public-nav {margin-top:8px;justify-content:flex-start;}
}
@media(max-width:420px) {
/* Leave room for a full unread count and Menu without compressing the brand text. */
.header-top:has(.mobile-notifications) .brand-mark {display:none;}
}
.site-header .js-install-app[hidden] {display:none;}