/* Authenticated Relay product shell. Loaded after legacy header rules. */
body:not(:has(.relay-auth)) { --relay-rail-width: 82px; }
body:not(:has(.relay-auth)) .relay-header {
  position: fixed; inset: 0 auto 0 0; z-index: 20; width: var(--relay-rail-width);
  border: 0; border-right: 1px solid rgb(217 219 226 / .1);
  background: rgb(7 9 18 / .94); backdrop-filter: blur(24px);
  transition: width .22s ease, box-shadow .22s ease;
}
body:not(:has(.relay-auth)) .relay-header:hover,
body:not(:has(.relay-auth)) .relay-header:focus-within { width: 224px; box-shadow: 18px 0 60px rgb(0 0 0 / .3); }
body:not(:has(.relay-auth)) .relay-nav {
  height: 100%; max-width: none; margin: 0; padding: 22px 14px 18px;
  display: flex; flex-direction: column; align-items: stretch; gap: 22px;
}
body:not(:has(.relay-auth)) .relay-nav__brand {
  height: 42px; padding: 4px 9px; gap: 12px; overflow: hidden; color: var(--relay-white);
  font: 700 .82rem/1 var(--relay-font-sans); letter-spacing: .22em; white-space: nowrap;
}
body:not(:has(.relay-auth)) .relay-nav__brand img { flex: 0 0 38px; width: 38px; height: 34px; object-fit: contain; }
body:not(:has(.relay-auth)) .relay-nav__brand span { opacity: 0; transition: opacity .18s ease; }
body:not(:has(.relay-auth)) .relay-header:hover .relay-nav__brand span,
body:not(:has(.relay-auth)) .relay-header:focus-within .relay-nav__brand span { opacity: 1; }
body:not(:has(.relay-auth)) .relay-nav__links { display: flex; flex-direction: column; flex: 0 0 auto; gap: 5px; }
body:not(:has(.relay-auth)) .relay-nav__link {
  position: relative; display: flex; align-items: center; min-height: 44px; padding: 0 12px 0 45px;
  border-radius: 10px; color: #8e96aa; font: 600 .78rem/1 var(--relay-font-sans);
  white-space: nowrap; overflow: visible; transition: color .18s ease, background .18s ease;
}
body:not(:has(.relay-auth)) .relay-nav__link::after { left: 0; right: auto; top: 10px; bottom: 10px; width: 2px; height: auto; transform: scaleY(0); background: var(--relay-blue); }
body:not(:has(.relay-auth)) .relay-nav__link:hover { color: var(--relay-white); background: rgb(47 123 255 / .08); }
body:not(:has(.relay-auth)) .relay-nav__link.active { color: var(--relay-white); background: rgb(47 123 255 / .13); }
body:not(:has(.relay-auth)) .relay-nav__link.active::after { transform: scaleY(1); }
body:not(:has(.relay-auth)) .relay-nav__right { display: flex; flex-direction: column; align-items: stretch; gap: 12px; margin-top: auto; }
body:not(:has(.relay-auth)) .relay-companion-btn {
  justify-content: flex-start; width: 100%; min-height: 38px; padding: 7px 12px; border-radius: 9px;
  background: transparent; color: #8e96aa; overflow: hidden; white-space: nowrap;
}
body:not(:has(.relay-auth)) .relay-companion-btn:hover { background: rgb(217 219 226 / .07); color: var(--relay-silver); }
body:not(:has(.relay-auth)) .relay-companion-text { opacity: 0; transition: opacity .18s ease; }
body:not(:has(.relay-auth)) .relay-header:hover .relay-companion-text,
body:not(:has(.relay-auth)) .relay-header:focus-within .relay-companion-text { opacity: 1; }
body:not(:has(.relay-auth)) .relay-avatar-btn { align-self: flex-start; }
body:not(:has(.relay-auth)) .relay-view { min-height: 100vh; margin-left: var(--relay-rail-width); }
body:not(:has(.relay-auth)) .relay-modal { z-index: 40; }

@media (max-width: 720px) {
  body:not(:has(.relay-auth)) .relay-header { inset: auto 0 0; width: 100%; height: 64px; border-right: 0; border-top: 1px solid rgb(217 219 226 / .12); }
  body:not(:has(.relay-auth)) .relay-header:hover, body:not(:has(.relay-auth)) .relay-header:focus-within { width: 100%; box-shadow: 0 -12px 40px rgb(0 0 0 / .25); }
  body:not(:has(.relay-auth)) .relay-nav { height: 100%; padding: 7px 10px; flex-direction: row; align-items: center; gap: 4px; }
  body:not(:has(.relay-auth)) .relay-nav__brand { display: none; }
  body:not(:has(.relay-auth)) .relay-nav__links { flex: 1; flex-direction: row; justify-content: space-around; gap: 0; }
  body:not(:has(.relay-auth)) .relay-nav__link { min-height: 48px; flex: 1; justify-content: center; padding: 23px 2px 0; font-size: .58rem; letter-spacing: .01em; }
  body:not(:has(.relay-auth)) .relay-nav__link::after { top: auto; left: 20%; right: 20%; bottom: 0; width: auto; height: 2px; transform: scaleX(0); }
  body:not(:has(.relay-auth)) .relay-nav__link.active::after { transform: scaleX(1); }
  body:not(:has(.relay-auth)) .relay-nav__right { flex-direction: row; align-items: center; margin: 0; gap: 4px; }
  body:not(:has(.relay-auth)) .relay-companion-btn { width: 28px; min-height: 44px; padding: 7px; }
  body:not(:has(.relay-auth)) .relay-companion-text { display: none; }
  body:not(:has(.relay-auth)) .relay-view { margin-left: 0; padding-bottom: 72px; }
}
@media (prefers-reduced-motion: reduce) {
  body:not(:has(.relay-auth)) .relay-header, body:not(:has(.relay-auth)) .relay-nav__link,
  body:not(:has(.relay-auth)) .relay-nav__brand span { transition: none; }
}
