/* 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{width:20px;height:20px;padding:0;border-radius:8px;background:transparent;color:var(--ps-icon-mint);stroke-width:2;opacity:1}
/* Only the referenced colleague/chat/notification group loses its icon backplates. */
body:not(.login-mode)>.app-header .head-tools>button[data-nav] svg{width:20px;height:20px;padding:0;background:transparent;color:var(--ps-icon-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{background:var(--ps-mint-soft);border-color:var(--ps-line)}
body:not(.login-mode)>.app-header .head-tools>button[data-nav]:hover{background:transparent;border-color:transparent}
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)>#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))}
@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}
}
@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}

/* Explicit exception to the border-minimal theme: one neutral header divider.
   The header already reserves this 1px, so its size and content offsets stay unchanged. */
html[data-theme] body:not(.login-mode)>.app-header{border-bottom:1px solid #c4c4c4!important;box-shadow:none!important}
html[data-theme=dark] body:not(.login-mode)>.app-header{border-bottom-color:#555555!important}

/* Presence sits between the left-aligned search and the unchanged right tools. */
body:not(.login-mode)>.app-header{grid-template-columns:44px 174px minmax(120px,1fr) auto auto}
body:not(.login-mode)>.app-header #search-form{justify-self:start}
#station-presence{min-width:44px;justify-self:end}
#station-presence .presence-trigger{display:flex;align-items:center;justify-content:center;gap:6px;min-width:44px;min-height:44px;padding:4px 6px;border:1px solid transparent;border-radius:22px;background:transparent;color:var(--ps-ink);font-size:12px}
#station-presence .presence-trigger:hover{background:var(--ps-inset)}
#station-presence .presence-trigger:focus-visible,#station-presence .presence-panel:focus-visible{outline:2px solid var(--ps-action);outline-offset:2px}
#station-presence .presence-faces{display:flex;align-items:center;padding-left:5px}
#station-presence .profile-avatar,#station-presence .presence-overflow{display:inline-flex;align-items:center;justify-content:center;flex:0 0 28px;width:28px;height:28px;min-width:28px;min-height:28px;border-radius:50%;background:var(--ps-mint-soft);color:var(--ps-action);border:2px solid var(--ps-surface);font-size:12px;overflow:hidden}
#station-presence .presence-faces>span{margin-left:-5px}
#station-presence .profile-avatar img{width:100%;height:100%;object-fit:cover}
#station-presence .profile-avatar svg{width:18px;height:18px}
#station-presence .presence-count{display:none}
#station-presence[data-empty=true] .presence-count{display:inline}
#station-presence .presence-panel{position:absolute;right:var(--ps-header-edge);top:100%;z-index:100;width:min(320px,calc(100vw - 24px));max-height:min(440px,calc(100dvh - var(--ps-header-height) - 24px));overflow:auto;padding:16px;border:1px solid var(--ps-line);border-radius:14px;background:var(--ps-surface);color:var(--ps-ink);box-shadow:0 8px 24px #0002}
#station-presence h2{font-size:14px;margin:0 0 8px}
#station-presence .presence-note{font-size:12px;color:var(--ps-muted);line-height:1.5;margin:0 0 12px}
#station-presence ul{list-style:none;margin:0;padding:0}
#station-presence li{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:13px;overflow-wrap:anywhere}
#station-presence li>span:last-child{min-width:0}
@media(max-width:1100px){
 body:not(.login-mode)>.app-header{grid-template-columns:minmax(44px,1fr) auto auto}
 body:not(.login-mode)>.app-header .brand{grid-column:1 / -1;margin-left:52px;max-width:calc(100% - 174px)}
 body:not(.login-mode)>.app-header #search-form,body.search-open:not(.login-mode)>.app-header #search-form{grid-column:1;justify-self:start}
 body:not(.login-mode)>.app-header #station-presence{grid-column:2;grid-row:2}
}
@media(max-width:760px){
 #station-presence .presence-trigger{position:relative;width:44px}
 #station-presence .presence-faces{padding-left:0}
 #station-presence .presence-faces>span{margin:0}
 #station-presence .presence-faces>span:not(:first-child){display:none}
 #station-presence .presence-count{display:inline-flex;align-items:center;justify-content:center;position:absolute;right:0;bottom:0;min-width:16px;height:16px;padding:0 2px;font-size:10px;border-radius:8px;background:var(--ps-mint-soft);color:var(--ps-action)}
}
/* Narrow phones keep search usable rather than compressing it beside four tools. */
@media(max-width:600px){
 body:not(.login-mode){--ps-header-height:calc(164px + env(safe-area-inset-top))}
 body:not(.login-mode)>.app-header{grid-template-columns:44px minmax(0,1fr) 44px;grid-template-rows:44px 44px 44px}
 body:not(.login-mode)>.app-header #search-form,body.search-open:not(.login-mode)>.app-header #search-form{grid-column:1 / 3;grid-row:2}
 body:not(.login-mode)>.app-header #station-presence{grid-column:3;grid-row:2}
 body:not(.login-mode)>.app-header .head-tools{grid-column:1 / -1;grid-row:3;justify-self:end}
}