/* Shared site navigation styles for public pages.
   Player keeps its own compact menu-button layout and does not load this file. */
.site-header{
  position:static;
  top:auto;
  z-index:auto;
  width:100%;
  max-width:var(--site-nav-max, var(--site-page-max, var(--max, 1180px)));
  margin:18px auto 22px;
  padding:12px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border:1px solid var(--site-line, var(--line, var(--border, rgba(17,24,39,.12))));
  border-radius:24px;
  background:rgba(255,255,255,.86);
  color:var(--site-text, var(--text, var(--fg, #111827)));
  box-shadow:var(--site-shadow, var(--shadow, 0 14px 36px rgba(17,24,39,.08)));
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}

.site-brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  color:inherit;
  text-decoration:none;
}

.site-logo{
  width:46px;
  height:46px;
  border-radius:16px;
  border:1px solid var(--site-line, var(--line, var(--border, rgba(17,24,39,.12))));
  background:var(--surface-soft, var(--panel-strong, rgba(255,255,255,.12)));
  overflow:hidden;
  flex:0 0 auto;
}

.site-logo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.site-brand-text{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:2px;
}

.site-brand-title{
  font-size:16px;
  line-height:1.1;
  font-weight:900;
  letter-spacing:-.02em;
}

.site-brand-subtitle{
  color:var(--muted, rgba(17,24,39,.68));
  font-size:13px;
  line-height:1.25;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.site-nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.site-nav-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:40px;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid transparent;
  color:var(--muted, rgba(17,24,39,.68));
  font-weight:800;
  line-height:1;
  text-decoration:none;
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .08s ease,box-shadow .18s ease;
}

.site-nav-link:hover,
.site-nav-link.active,
.site-nav-link[aria-current="page"]{
  background:var(--surface-soft, var(--panel-strong, rgba(255,255,255,.92)));
  border-color:var(--line, var(--border, rgba(17,24,39,.12)));
  color:var(--site-text, var(--text, var(--fg, #111827)));
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(17,24,39,.06);
}

.site-nav-auth{
  background:var(--surface-soft, var(--panel-strong, rgba(255,255,255,.92)));
  border-color:var(--line, var(--border, rgba(17,24,39,.12)));
  color:var(--brand, var(--text, var(--fg, #111827)));
}

.site-nav-auth:hover,
.site-nav-auth.active,
.site-nav-auth[aria-current="page"]{
  background:var(--accent-soft, var(--surface-soft, var(--panel-strong, rgba(255,255,255,.92))));
  border-color:var(--accent, var(--line, var(--border, rgba(17,24,39,.12))));
  color:var(--accent, var(--text, var(--fg, #111827)));
}

.site-nav-divider{
  width:1px;
  height:28px;
  margin:0 2px;
  background:var(--line, var(--border, rgba(17,24,39,.12)));
  flex:0 0 auto;
}

.site-header + .book-back-row{
  margin:-6px 0 18px;
}

.site-nav-divider[hidden],
[data-auth-nav][hidden]{
  display:none !important;
}

@media (max-width:720px){
  .site-header{
    align-items:stretch;
    flex-direction:column;
    border-radius:20px;
  }

  .site-nav{
    justify-content:flex-start;
  }

  .site-nav-divider{
    display:none;
  }
}


body:not(.page-player) .site-header{
  margin:18px auto 24px;
}

body:not(.page-player) .site-page > .site-header{
  max-width:100%;
  margin:0 0 24px;
}


body:not(.page-player) .site-logo{
  background:var(--site-surface-soft, var(--surface-soft, var(--panel-strong, rgba(255,255,255,.12))));
}