/* Xenyra hub header (H47). Rewritten from scratch; replaces hub-nav.css. Reads tokens.css. */
.xh-header{
  position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:16px;
  min-height:var(--xt-head-h);box-sizing:border-box;padding:10px clamp(16px,4vw,48px);
  background:rgb(var(--xt-surface-rgb) / .55);border-bottom:1px solid rgb(var(--xt-line-rgb) / .85);
  -webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);
  font-family:var(--xt-font);font-weight:300;
}
.xh-brand{display:flex;align-items:center;gap:10px;color:var(--xt-ink);text-decoration:none;border-radius:var(--xt-r-ctl)}
.xh-brand img{display:block;width:30px;height:30px;object-fit:contain}
.xh-brand-name{display:grid;line-height:1.1}
.xh-brand-name strong{white-space:nowrap;font-size:22px;font-weight:600;letter-spacing:-.2px}
.xh-brand-name small{font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--xt-mute);white-space:nowrap}
.xh-brand:focus-visible{outline:2px solid var(--xt-blue);outline-offset:4px}

.xh-nav{display:flex;align-items:center;justify-content:flex-end;gap:6px 14px;font-size:15px}
.xh-nav a{white-space:nowrap;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 10px;color:var(--xt-ink);text-decoration:none;border-radius:var(--xt-r-pill);transition:color .18s,background .18s}
.xh-nav a[hidden]{display:none}
.xh-nav a:hover{color:var(--xt-blue);background:var(--xt-tint)}
.xh-nav a:focus-visible{outline:2px solid var(--xt-blue);outline-offset:2px}
.xh-nav .hh-ico{display:inline-flex}
.xh-nav .xh-account{color:var(--xt-ink);font-weight:300;white-space:nowrap}
.xh-nav .hh-cta{padding:0 20px;background:var(--xt-cta-bg);color:var(--xt-cta-ink);font-weight:400}
.xh-nav .hh-cta:hover{background:var(--xt-blue-d);color:#fff}

/* body.xh-in is set when signed in: hide the sign-up button */
body.xh-in .hh-guest-only,body.xh-user .hh-guest-only{display:none}


@media(max-width:700px){
  .xh-header{gap:8px;padding:8px 14px}
  .xh-brand-name strong{font-size:20px}
  .xh-brand-name small{display:none}
  .xh-nav{gap:2px}
  .xh-nav a{padding:0 8px;font-size:14px}
  .xh-nav .hh-lab{display:none}
  .xh-nav .hh-cta{padding:0 14px;font-size:14px}
}
@media(max-width:420px){.xh-nav .hh-cta{display:none}}
@media(prefers-reduced-motion:reduce){.xh-header,.xh-nav a{transition:none}}