/* Xenyra Hub header (H33). Business look: calm and matte at rest, clear highlight on hover.
   Own file so the header can change without touching the rest of the hub styles. */
.xh-header{
  --nav-ink:#26324f;--nav-mute:#6b7894;--nav-hover:rgba(39,113,255,.09);
  position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:12px clamp(18px,4vw,66px);
  background:rgba(255,255,255,.62);
  border-bottom:1px solid rgba(203,214,238,.55);
  box-shadow:0 8px 28px -22px rgba(20,40,90,.35);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);
}

/* logo block: click = home page */
.xh-brand{display:flex;align-items:center;gap:12px;text-decoration:none;padding:6px 14px 6px 8px;margin:-6px 0 -6px -8px;border-radius:14px;transition:background .2s,box-shadow .2s}
.xh-brand img{object-fit:contain;opacity:.9;transition:transform .25s,opacity .2s}
.xh-brand span{display:grid;line-height:1.1}
.xh-brand strong{font-size:23px;font-weight:750;letter-spacing:-.5px;color:#1b2750}
.xh-brand small{font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--nav-mute);transition:color .2s}
.xh-brand:hover,.xh-brand:focus-visible{background:var(--nav-hover);box-shadow:0 0 0 1px rgba(39,113,255,.16) inset;outline:none}
.xh-brand:hover img,.xh-brand:focus-visible img{opacity:1;transform:scale(1.06)}
.xh-brand:hover strong,.xh-brand:focus-visible strong{background:linear-gradient(90deg,var(--blue),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.xh-brand:hover small,.xh-brand:focus-visible small{color:var(--ink-2)}

/* links */
.xh-nav{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:6px clamp(4px,.8vw,10px)}
.xh-nav a{position:relative;text-decoration:none;font-size:14.5px;font-weight:600;color:var(--nav-ink);padding:9px 14px;border-radius:10px;transition:color .18s,background .18s}
.xh-nav a:hover,.xh-nav a:focus-visible{background:var(--nav-hover);color:var(--blue);outline:none}
.xh-nav a:not(.xh-account)::after{content:"";position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--blue),var(--violet));transform:scaleX(0);transform-origin:left;transition:transform .22s}
.xh-nav a:not(.xh-account):hover::after,.xh-nav a:not(.xh-account):focus-visible::after{transform:scaleX(1)}

/* account (sign in): plain text link, no frame (signed-in users get the avatar from hub-user) */
.xh-nav .xh-account{margin-left:2px;padding:9px 10px;background:none;color:var(--blue);font-weight:700;white-space:nowrap}
.xh-nav .xh-account:hover,.xh-nav .xh-account:focus-visible{background:var(--nav-hover);color:var(--blue)}
.xh-nav .xh-account[data-auth="signed"]{color:var(--ink-2)}

/* install button */
.xh-nav button{font:600 14px Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--blue);height:38px;padding:0 6px;border:0;background:none;cursor:pointer}
.xh-nav button:hover{text-decoration:underline}
.xh-nav button:focus-visible{outline:2px solid rgba(39,113,255,.5);outline-offset:2px}

/* mobile: compact header (the rest lives in the assistant window) */
@media(max-width:920px){.xh-header{flex-wrap:wrap}}
@media(max-width:700px){
  .xh-header{transition:transform .28s ease;flex-wrap:nowrap;gap:10px;padding:10px 14px}
  .xh-header.xh-hide{transform:translateY(-105%)}
  .xh-brand small{display:none}
  .xh-nav{display:contents}
  .xh-nav>a:not(.xh-account){display:none}
  .xh-nav #xh-lang{margin-left:auto}
  .xh-nav #xh-install{display:none}
}
@media(max-width:540px){
  .xh-brand strong{font-size:20px}
  .xh-nav{width:100%;justify-content:flex-start;gap:8px 12px}
  .xh-nav a{font-size:13px}.xh-nav .xh-account{padding:8px 6px}.xhl-btn{font-size:13px}
}
@media(prefers-reduced-motion:reduce){.xh-brand,.xh-brand img,.xh-nav a,.xh-nav a::after,.xh-nav .xh-account{transition:none}}