.account-nav.signed-in{gap:9px}
.admin-tool{display:grid;place-items:center;flex:0 0 36px;width:36px;height:38px;border:1px solid #93a9d257;border-radius:6px;background:#14233c;color:#b8cce9;transition:background .18s,color .18s,border-color .18s,transform .18s}
.admin-tool svg{width:21px;height:21px}
.admin-tool:hover{background:#244268;color:#fff;border-color:#9ab6e2;transform:translateY(-2px)}
.admin-tool:active{transform:translateY(1px)}
.admin-tool:focus-visible,.header-social:focus-visible{outline:2px solid #d9c18b;outline-offset:4px}
.header-socials{display:flex;align-items:center;gap:7px;border-left:1px solid #7186af40;padding-left:14px;flex-shrink:0}
.header-social{display:grid;place-items:center;width:30px;height:32px;border:1px solid #8798b83d;border-radius:5px;background:#112039;color:#b8c9e1;transition:color .18s,background .18s,border-color .18s,transform .18s}
a.header-social:hover{color:#fff;background:#263d60;border-color:#92aed3;transform:translateY(-2px)}
.header-social svg{width:17px;height:17px}
.header-social.is-unconfigured{color:#9db0ce;cursor:default}
.topbar-right{gap:15px}
@media(min-width:1101px){.navy-header .topbar{max-width:1480px}.topbar-right .server-status{font-size:7px}.topbar-right .captain-chip{min-width:190px}}
@media(max-width:1200px){.topbar-right .server-status{display:none}.topbar-title{font-size:15px}.header-socials{gap:5px;padding-left:9px}.header-social{width:27px}.topbar-right{gap:11px}}
@media(max-width:760px){.header-socials{position:absolute;top:13px;right:15px;border-left:0;padding-left:0;gap:5px}.header-social{width:26px;height:27px}.header-social svg{width:15px;height:15px}.navy-header .topbar .brand{padding-right:99px;max-width:100%}.navy-header .topbar .brand .topbar-title{font-size:12px}.account-nav.signed-in{gap:7px}.admin-tool{width:31px;flex-basis:31px;height:36px}.header-socials~*{min-width:0}}
@media(prefers-reduced-motion:reduce){.admin-tool,.header-social{transition:none}}

@media(min-width:761px) and (max-width:1100px){.topbar-title{display:none}.captain-chip{min-width:170px;max-width:210px}.top-download{min-width:145px}.topbar-right{gap:10px}.header-socials{padding-left:8px}}
@media(max-width:760px){.navy-header .topbar{height:178px;display:block;padding:0 13px}.navy-header .topbar .brand{position:absolute;left:13px;top:5px;padding-right:0;max-width:calc(100% - 115px)}.header-socials{top:20px;right:13px}.navy-header .account-nav{position:absolute;left:13px;top:73px}.account-nav.signed-in{width:185px;max-width:calc(100% - 181px)}.account-nav.signed-in .captain-chip{flex:1;min-width:0;width:auto}.navy-header .top-download{position:absolute;right:13px;top:73px;width:148px;margin:0}.navy-header .language-menu{position:absolute;left:13px;right:auto;top:129px}.navy-header .topbar .mobile-toggle{position:absolute;right:16px;top:133px;margin:0;align-self:auto}.navy-header .topbar .brand .topbar-title{font-size:12px}.header-social{width:27px;height:29px}}
@media(max-width:390px){.account-nav.signed-in .captain-chip-wallet{display:none}}

/* Layout stability: keep the header fixed in place while moving between pages.
   Short pages (e.g. /store/) have no scrollbar; reserving the gutter stops the
   whole header from shifting sideways. The account slot keeps its width while
   the signed-in chip replaces the static login buttons. */
html{overflow-y:scroll;scrollbar-gutter:stable}
html[data-auth=pending] #account-nav{visibility:hidden;animation:auth-reveal 0s 2.5s forwards}
@keyframes auth-reveal{to{visibility:visible}}
@media(min-width:761px){.navy-header .account-nav{min-width:219px;justify-content:flex-end}}