/* Shared staff chrome. Every tab (Add access, Members, Community, Analytics) uses this one header, nav and
   page title, so nothing shifts when you click between them. Loaded before each page's own stylesheet;
   page stylesheets must not restyle .app-header, .app-nav or .page-title. */
:root{--shell-ink:#171719;--shell-muted:#6c6d78;--shell-line:#dddde5;--shell-accent:#3434d9;--shell-bg:#f6f6f8;--shell-font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
html{background:var(--shell-bg);scrollbar-gutter:stable}
body{margin:0;background:var(--shell-bg);font-family:var(--shell-font);font-synthesis:none}
main{box-sizing:border-box;max-width:1160px;margin:0 auto;padding:0 32px 64px}

.app-header{display:flex;align-items:center;gap:28px;min-height:68px;margin:0 0 40px;border-bottom:1px solid var(--shell-line);font-family:var(--shell-font);font-size:14px;line-height:1.2;color:var(--shell-ink)}
.app-header .brand{font-size:15px;font-weight:650;color:var(--shell-ink);text-decoration:none;white-space:nowrap}
.app-header .brand span{margin-left:4px;font-weight:400;color:var(--shell-muted)}
.app-header .app-nav{display:flex;align-self:stretch;gap:26px;margin-right:auto}
.app-header .app-nav[hidden]{display:none}
.app-header .app-nav a,.app-header .app-nav button{display:flex;align-items:center;box-sizing:border-box;min-height:0;margin:0;padding:0;border:0;border-bottom:2px solid transparent;border-radius:0;background:none;font:inherit;font-size:14px;font-weight:500;color:var(--shell-muted);text-decoration:none;white-space:nowrap;cursor:pointer}
.app-header .app-nav a:hover,.app-header .app-nav button:hover{background:none;color:var(--shell-ink)}
.app-header .app-nav [aria-current=page],.app-header .app-nav [aria-pressed=true]{background:none;border-bottom-color:var(--shell-accent);color:var(--shell-ink)}
.app-header .app-nav :focus-visible,.app-header .sign-out:focus-visible,.app-header .brand:focus-visible{outline:2px solid var(--shell-accent);outline-offset:2px}
.app-header .operator{max-width:240px;font-size:12px;color:var(--shell-muted);text-align:right;overflow-wrap:anywhere}
.app-header .sign-out{min-height:0;margin:0;padding:7px 12px;border:1px solid var(--shell-line);border-radius:6px;background:white;font:inherit;font-size:13px;font-weight:500;color:var(--shell-ink);white-space:nowrap;cursor:pointer}
.app-header .sign-out:hover{background:var(--shell-bg);border-color:#cdced8}
.app-header .sign-out[hidden],.app-header .operator[hidden]{display:none}

.page-title{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:16px 24px;margin:0 0 32px;text-align:left}
.page-title h1{margin:0;font-family:var(--shell-font);font-size:32px;line-height:1.15;font-weight:600;letter-spacing:-.02em;color:var(--shell-ink)}
.page-title h1+p{max-width:64ch;margin:8px 0 0;font-size:14px;line-height:1.5;color:var(--shell-muted)}

@media(max-width:760px){
main{padding:0 16px 40px}
.app-header{flex-wrap:wrap;gap:0 16px;min-height:0;margin-bottom:28px}
.app-header .brand{padding:16px 0;margin-right:auto}
.app-header .app-nav{order:3;flex-basis:100%;gap:22px;margin:0;overflow-x:auto}
.app-header .app-nav a,.app-header .app-nav button{padding:12px 0;font-size:13px}
.app-header .operator{display:none}
.page-title{margin-bottom:24px}
.page-title h1{font-size:26px}
.page-title h1+p{font-size:13px}
}
