/* Shared Arxael family header rail and spacing tokens. */
:root{--family-header-desktop:76px;--family-header-mobile:66px;--family-max:1200px;--family-gutter:40px;--family-gutter-mobile:18px;--family-ink:#edf0f2;--family-muted:#a6afb9;--family-accent:#3ad8f0;--family-panel:#0e1217;--family-line:#ffffff20}
/* The two Arxael wordmarks share a 1280px header container with 40px inner gutters. */
header.site{height:var(--family-header-desktop);min-height:var(--family-header-desktop);padding:0;box-sizing:border-box}
header.site>.wrap.nav{width:100%;max-width:1280px;height:100%;margin:0 auto;padding:0 var(--family-gutter);box-sizing:border-box;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:24px}
header.site .wrap.nav>.brand{flex:0 0 auto}
/* Research keeps its authored 860px content measure and typography. */
body[data-family-site="research"] .wrap{padding-left:var(--family-gutter);padding-right:var(--family-gutter)}
header.site .wrap.nav>nav.links{display:flex;align-items:center;flex-wrap:nowrap;gap:clamp(12px,1.5vw,20px);white-space:nowrap}
header.site .wrap.nav>nav.links>a{font-size:10.5px;letter-spacing:.13em;padding:4px 0}
header.site .family-menu{display:none}
.family-menu-toggle{list-style:none;cursor:pointer;display:flex;align-items:center;gap:9px;min-height:40px;padding:0 12px;border:1px solid var(--family-line);border-radius:6px;color:var(--family-ink);font:600 11px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase}
.family-menu-toggle::-webkit-details-marker{display:none}
.family-menu-glyph,.family-menu-glyph:before,.family-menu-glyph:after{display:block;width:16px;height:1.5px;background:currentColor;content:""}
.family-menu-glyph{position:relative}.family-menu-glyph:before{position:absolute;top:-5px}.family-menu-glyph:after{position:absolute;top:5px}
.family-menu[open] .family-menu-glyph{background:transparent}.family-menu[open] .family-menu-glyph:before{top:0;transform:rotate(45deg)}.family-menu[open] .family-menu-glyph:after{top:0;transform:rotate(-45deg)}
.family-menu-panel{position:absolute;z-index:100;top:calc(100% + 10px);right:0;width:min(340px,calc(100vw - 36px));display:grid;grid-template-columns:1fr 1fr;gap:2px;padding:10px;border:1px solid var(--family-line);border-radius:8px;background:var(--family-panel);box-shadow:0 16px 44px #0009}
.family-menu-panel>a{display:flex;align-items:center;min-height:40px;padding:8px 10px;border-radius:4px;color:var(--family-muted);font:600 10px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase}
.family-menu-panel>a:hover,.family-menu-panel>a:focus-visible{background:#ffffff0b;color:var(--family-ink)}
.family-menu-panel>.lang-sw{grid-column:1/-1;display:flex;gap:8px;align-items:center;padding:7px 8px;border-top:1px solid var(--family-line)}
.family-menu-panel>.lang-sw a{padding:8px 10px;border:1px solid var(--family-line);border-radius:4px;text-decoration:none}
.family-menu-panel>.lang-sw a.on{border-color:var(--family-accent);color:var(--family-ink)}
/* Telemetry and its account page use the same 1200px rail and shell height. */
header.shell.topbar{max-width:var(--family-max);width:calc(100% - 2 * var(--family-gutter));height:var(--family-header-desktop);box-sizing:border-box}
header.shell.topbar>.nav{flex:0 1 auto}
header.shell.topbar>.pg-family-mobile-menu{display:none}
.pg-family-mobile-menu>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:9px;min-height:40px;padding:0 12px;border:1px solid var(--family-line);border-radius:6px;color:var(--family-ink);font:600 11px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase}
.pg-family-mobile-menu>summary::-webkit-details-marker{display:none}
.pg-family-mobile-menu>summary:before{content:"☰";font-size:16px;line-height:1}
.pg-family-mobile-menu[open]>summary:before{content:"×";font-size:21px}
.pg-family-mobile-panel{position:absolute;z-index:100;top:calc(100% + 8px);right:0;width:min(340px,calc(100vw - 36px));padding:10px;border:1px solid var(--family-line);border-radius:8px;background:var(--family-panel);box-shadow:0 16px 44px #0009}
.pg-family-mobile-panel nav{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.pg-family-mobile-panel nav>a,.pg-family-mobile-panel nav>[aria-current=page]{display:flex;align-items:center;min-height:42px;padding:8px 10px;border-radius:4px;color:var(--family-muted);font:600 11px/1.4 var(--sans);letter-spacing:.07em}
.pg-family-mobile-panel nav>a:hover,.pg-family-mobile-panel nav>a:focus-visible{background:#ffffff0b;color:var(--family-ink)}
.pg-family-mobile-panel .language{grid-column:1/-1;width:fit-content;margin:6px 0 0;padding:3px}
.pg-family-mobile-panel .language button{min-height:34px;padding:7px 12px}
body[data-family-site="telemetry"] .shell{max-width:var(--family-max);width:calc(100% - 2 * var(--family-gutter))}
/* Compact the compiled Arxael nav on small tablets without hiding any destinations. */
@media(min-width:721px) and (max-width:900px){body[data-family-site="arxael"] header.site>.wrap.nav{padding-left:18px;padding-right:18px;gap:0}body[data-family-site="arxael"] header.site .wrap.nav>.links{gap:4px}body[data-family-site="arxael"] header.site .wrap.nav>.spacer{display:none}body[data-family-site="arxael"] header.site .wrap.nav .navbtn,body[data-family-site="arxael"] header.site .wrap.nav .gh{font-size:10px;padding-left:4px;padding-right:4px}body[data-family-site="arxael"] header.site .wrap.nav .cta{font-size:10px;padding-left:8px;padding-right:8px}}
@media(max-width:960px){body[data-family-site="research"] header.site>.wrap.nav{padding:0 var(--family-gutter-mobile);gap:12px}body[data-family-site="research"] header.site .wrap.nav>nav.links{display:none}body[data-family-site="research"] header.site .family-menu{display:block;position:relative;margin-left:auto;flex:0 0 auto}body[data-family-site="research"] .wrap{padding-left:var(--family-gutter-mobile);padding-right:var(--family-gutter-mobile)}}
@media(min-width:621px) and (max-width:850px){body[data-family-site="telemetry"] header.shell.topbar>.nav a:nth-child(2){display:block}}
@media(max-width:720px){header.site{height:var(--family-header-mobile);min-height:var(--family-header-mobile)}header.site>.wrap.nav{padding:0 var(--family-gutter-mobile)}body[data-family-site="arxael"] .wrap{padding-left:var(--family-gutter-mobile);padding-right:var(--family-gutter-mobile)}header.shell.topbar{width:calc(100% - 2 * var(--family-gutter-mobile));height:var(--family-header-mobile);display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;padding:0;flex-wrap:nowrap}header.shell.topbar>.brand{flex:0 0 auto;min-width:0}header.shell.topbar>.nav{display:none}header.shell.topbar>.pg-family-mobile-menu{display:block;position:relative;margin-left:auto;flex:0 0 auto}body[data-family-site="telemetry"] .shell{width:calc(100% - 2 * var(--family-gutter-mobile))}.pg-family-menu-zh{display:none}html:lang(zh-CN) .pg-family-menu-en{display:none}html:lang(zh-CN) .pg-family-menu-zh{display:inline}}
@media(prefers-reduced-motion:reduce){.family-menu-panel,.pg-family-mobile-panel{scroll-behavior:auto}}
