/* Single header layout, independent of earlier prototype positioning rules. */
body[data-page] .shell .topbar{display:grid!important;grid-template-columns:minmax(0,1fr) 200px minmax(0,1fr)!important;grid-template-rows:auto!important;align-items:center!important;height:auto!important;min-height:112px!important;padding:14px 0!important;gap:16px!important;overflow:visible;z-index:80;transform:none;filter:none}
body[data-page] .topbar .brand.home-brand{position:static!important;inset:auto!important;transform:none!important;grid-column:2!important;grid-row:1!important;justify-self:center;margin:0}
body[data-page] .shell .topbar .top-actions{position:static!important;inset:auto!important;transform:none!important;grid-column:3!important;grid-row:1!important;justify-self:end;align-self:center!important;display:flex;align-items:center;gap:8px!important;padding:6px!important;margin:0!important;width:max-content;max-width:100%;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;overflow:visible}
body[data-page] .topbar .header-center{display:none!important}
body[data-page] .top-actions .icon-btn,body[data-page] .top-actions .friends-menu>summary{box-sizing:border-box;width:40px!important;min-width:40px!important;height:40px!important;padding:8px!important}
body[data-page] .top-actions .profile-menu>summary{box-sizing:border-box;min-height:44px!important;min-width:0!important;max-width:145px;padding:4px 8px!important;gap:7px}
body[data-page] .top-actions .profile-menu>summary .avatar{width:32px!important;height:32px!important;flex:0 0 32px}
body[data-page] .top-actions .profile-menu>summary b{max-width:75px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topbar details:not([open])>.friends-popover,.topbar details:not([open])>nav.nav{display:none!important}
.topbar details[open]>.friends-popover,.topbar details[open]>nav.nav{display:block!important;position:fixed!important;inset:auto!important;left:var(--menu-left,16px)!important;top:var(--menu-top,120px)!important;transform:none!important;width:min(330px,calc(100vw - 32px))!important;max-width:calc(100vw - 32px)!important;max-height:var(--menu-height,65dvh)!important;overflow:auto!important;box-sizing:border-box;padding:12px;background:#252c35!important;color:#f4f6f8;border:1px solid #758294;border-radius:12px;box-shadow:0 12px 36px #0008;z-index:1000}
.topbar .profile-menu nav.nav :is(a,button){display:block!important;width:100%!important;height:auto!important;min-height:42px!important;box-sizing:border-box;padding:11px 12px!important;font:600 13px/1.5 system-ui,sans-serif!important;letter-spacing:normal!important;white-space:normal!important;text-align:left;color:#f4f6f8!important;opacity:1!important;visibility:visible!important;background:transparent;border:0;cursor:pointer}
.topbar .profile-menu nav.nav :is(a,button):hover,.topbar .profile-menu nav.nav :is(a,button):focus-visible{background:#465363!important;outline:2px solid #ff9b57;outline-offset:-2px}
.topbar .top-actions>details>summary{cursor:pointer;list-style:none}.topbar summary::-webkit-details-marker{display:none}
@media(max-width:1050px){body[data-page] .shell .topbar{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto!important;gap:14px!important;min-height:0!important;padding:14px 0 18px!important}body[data-page] .topbar .brand.home-brand{grid-column:1!important;grid-row:1!important}body[data-page] .shell .topbar .top-actions{grid-column:1!important;grid-row:2!important;justify-self:center!important}}
@media(max-width:380px){body[data-page] .shell .topbar .top-actions{gap:5px!important;padding:5px!important}body[data-page] .top-actions .profile-menu>summary b{max-width:48px}body[data-page] .top-actions .icon-btn,body[data-page] .top-actions .friends-menu>summary{width:36px!important;min-width:36px!important;height:36px!important}}
