/* Authenticated app chrome only. The reference informs spacing, not new features.
   One compact row on desktop; two touch-sized rows where all tools cannot fit. */
body:not(.login-mode){--ps-header-height:calc(64px + env(safe-area-inset-top));--ps-header-edge:24px}
body:not(.login-mode)>.app-header{display:grid;grid-template-columns:44px 174px minmax(180px,1fr) auto;align-items:center;column-gap:12px;height:var(--ps-header-height);padding:env(safe-area-inset-top) var(--ps-header-edge) 0;background:var(--ps-surface);border-bottom:1px solid var(--ps-line);box-shadow:0 1px 0 var(--ps-inset)}
body:not(.login-mode)>.app-header .brand{display:flex;align-items:center;width:auto;min-width:0;gap:9px;font-size:14px;letter-spacing:.2px;color:var(--ps-ink)}
body:not(.login-mode)>.app-header .brand img{width:32px;height:32px;flex:0 0 32px}
body:not(.login-mode)>.app-header .brand b{font-weight:750}
body:not(.login-mode)>.app-header #mobile-menu{width:44px;height:44px;min-width:44px;min-height:44px;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--ps-ink)}
body:not(.login-mode)>.app-header #search-form{display:flex;align-items:center;justify-self:center;width:100%;min-width:0;max-width:530px;height:44px;gap:8px;margin:0;padding:0 12px;border:1px solid var(--ps-line);border-radius:24px;background:var(--ps-input);box-shadow:inset 0 1px 0 var(--ps-surface)}
body:not(.login-mode)>.app-header #search-form:focus-within{border-color:var(--ps-action);outline:2px solid var(--ps-action);outline-offset:2px}
body:not(.login-mode)>.app-header #search-form>span{flex:0 0 auto;color:var(--ps-action)}
body:not(.login-mode)>.app-header #search-form input{width:100%;min-width:0;min-height:40px;height:40px;padding:0;border:0;background:transparent;color:var(--ps-ink);font-size:14px;outline:none;text-overflow:ellipsis}
body:not(.login-mode)>.app-header #search-form input::placeholder{color:var(--ps-muted);opacity:1}
body:not(.login-mode)>.app-header #search-form kbd{flex:0 0 auto;padding:1px 5px;border:1px solid var(--ps-line);border-radius:5px;font-size:10px;color:var(--ps-muted);background:var(--ps-surface)}
body:not(.login-mode)>.app-header .head-tools{display:flex;align-items:center;gap:4px;min-width:0;margin:0}
body:not(.login-mode)>.app-header .head-tools>button{display:inline-grid;place-items:center;flex:0 0 44px;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--ps-ink)}
body:not(.login-mode)>.app-header .head-tools>[data-mobile-search]{display:none}
body:not(.login-mode)>.app-header [hidden]{display:none!important}
body:not(.login-mode)>.app-header #mobile-menu svg,body:not(.login-mode)>.app-header .head-tools>button:not(.avatar) svg{width:28px;height:28px;padding:4px;border-radius:8px;background:var(--ps-on-mint);color:var(--ps-mint);stroke-width:2;opacity:1}
body:not(.login-mode)>.app-header .head-tools>button.avatar{display:inline-grid;background:var(--ps-mint);border-color:var(--ps-action);color:var(--ps-on-mint);border-radius:50%;font-size:14px;font-weight:750}
body:not(.login-mode)>.app-header #mobile-menu:hover,body:not(.login-mode)>.app-header .head-tools>button:hover{background:var(--ps-mint-soft);border-color:var(--ps-line)}
body:not(.login-mode)>.app-header .head-tools>button.avatar:hover{background:var(--ps-mint-hover);color:var(--ps-on-mint);border-color:var(--ps-action)}
body:not(.login-mode)>.app-header #mobile-menu:focus-visible,body:not(.login-mode)>.app-header .head-tools>button:focus-visible,body:not(.login-mode)>.app-header .brand:focus-visible{outline:3px solid var(--ps-action);outline-offset:2px}
body:not(.login-mode)>.app-header .header-appearance{gap:4px;margin-left:4px;padding-left:8px;border-left:1px solid var(--ps-line)}
body:not(.login-mode)>.app-header #pwa-update{min-height:44px;color:var(--ps-on-mint);background:var(--ps-mint);border-color:var(--ps-mint)}
body:not(.login-mode)>#main{margin-top:var(--ps-header-height);min-height:calc(100dvh - var(--ps-header-height))}
body:not(.login-mode)>#main.project-detail{min-height:calc(100dvh - var(--ps-header-height))}
body:not(.login-mode) #pwa-status{top:calc(var(--ps-header-height) + 12px)}
@media(min-width:761px){
 body:not(.login-mode)>#sidebar,body:not(.login-mode)>.rail{top:var(--ps-header-height)}
 body.chat-page:not(.login-mode) #messenger{height:calc(100dvh - var(--ps-header-height) - var(--ps-bottom-inset) - 32px)}
}
@media(max-width:1100px){
 body:not(.login-mode){--ps-header-height:calc(112px + env(safe-area-inset-top));--ps-header-edge:max(12px,env(safe-area-inset-right))}
 body:not(.login-mode)>.app-header{grid-template-columns:44px minmax(0,1fr) auto;grid-template-rows:44px 44px;gap:8px;height:var(--ps-header-height);padding:calc(8px + env(safe-area-inset-top)) var(--ps-header-edge) 8px max(12px,env(safe-area-inset-left))}
 body:not(.login-mode)>.app-header #mobile-menu{grid-column:1;grid-row:1}
 body:not(.login-mode)>.app-header .brand{grid-column:2 / -1;grid-row:1;width:auto;min-width:0;max-width:calc(100% - 122px)}
 body:not(.login-mode)>.app-header #search-form,body.search-open:not(.login-mode)>.app-header #search-form{position:static;grid-column:1 / 3;grid-row:2;justify-self:stretch;width:100%;min-width:0;max-width:none;height:44px;padding:0 10px;gap:6px;background:var(--ps-input);border-color:var(--ps-line);box-shadow:none}
 body:not(.login-mode)>.app-header #search-form input{font-size:16px}
 body:not(.login-mode)>.app-header #search-form kbd{display:none}
 body:not(.login-mode)>.app-header .head-tools{grid-column:3;grid-row:2;gap:4px}
 body:not(.login-mode)>.app-header .head-tools .header-appearance{position:absolute;top:calc(8px + env(safe-area-inset-top));right:var(--ps-header-edge);gap:4px;width:110px;height:44px;margin:0;padding:0;border:0}
 body:not(.login-mode)>.app-header .header-appearance .language-control{width:62px;min-width:62px}
 body:not(.login-mode)>.app-header #pwa-controls{position:absolute;top:calc(8px + env(safe-area-inset-top));right:calc(var(--ps-header-edge) + 116px);width:86px}
 body:not(.login-mode)>.app-header #pwa-update{width:86px;min-width:0;max-width:86px;height:44px;padding:4px 6px;font-size:13px;line-height:1.3;white-space:normal;overflow-wrap:anywhere}
 body:not(.login-mode)>.app-header:has(#pwa-controls:not([hidden])) .brand{width:auto;min-width:32px;max-width:calc(100% - 214px)}
 body:not(.login-mode)>.app-header:has(#pwa-controls:not([hidden])) .head-tools{gap:4px}
}
@media(max-width:760px){
 body:not(.login-mode)>.app-header .brand b{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 body:not(.login-mode)>.app-header .brand img{width:32px;height:32px}
 body:not(.login-mode)>.app-header .head-tools>button[data-nav=members],body:not(.login-mode)>.app-header .head-tools>button[data-nav=notifications],body:not(.login-mode)>.app-header .head-tools>button.avatar{display:inline-grid}
 body:not(.login-mode)>.app-header #search-form{padding:0 8px}
 body:not(.login-mode)>#sidebar{top:0}
 body.chat-page:not(.login-mode)>#main{min-height:0}
 body.chat-page:not(.login-mode) #messenger{height:calc(100dvh - var(--ps-header-height) - var(--ps-bottom-inset));min-height:0}
}
/* Never turn the separate intro appearance controls into an app header. */
body.login-mode>.app-header{display:none}