/* Keep the layout width stable between short and long pages.
   Otherwise the appearance/disappearance of the vertical scrollbar can move
   right-aligned header controls by the scrollbar width. */
html{scrollbar-gutter:stable}
@supports not (scrollbar-gutter:stable){html{overflow-y:scroll}}

/* SPICE 0.6.6 — detached account badge.
   The badge is deliberately NOT a child of the theme navigation. JS docks it
   visually to the navigation, which avoids changing the menu's flex/grid flow. */
.spice-public-account-badge{
  position:fixed!important;
  z-index:99998!important;
  left:auto;
  right:28px;
  top:18px;
  display:block!important;
  width:max-content;
  max-width:calc(100vw - 28px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-1px);
  transition:opacity .16s ease,transform .16s ease;
}
.spice-public-account-badge.is-ready{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.spice-public-account-item{position:relative;display:block!important;list-style:none!important;margin:0!important;padding:0!important}
.spice-public-account-wrap{position:relative;display:flex;align-items:center}
.spice-public-account{
  appearance:none;border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(18,18,18,.82)!important;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  color:#fff!important;display:flex!important;align-items:center!important;gap:10px!important;
  min-height:46px;padding:5px 10px 5px 6px!important;border-radius:999px!important;
  cursor:pointer;text-decoration:none!important;white-space:nowrap;line-height:1.15!important;
  font-family:inherit!important;box-shadow:0 8px 28px rgba(0,0,0,.18)!important;
  transition:background .18s ease,border-color .18s ease,transform .18s ease
}
.spice-public-account:hover{background:rgba(29,29,29,.94)!important;border-color:rgba(255,255,255,.2)!important;transform:translateY(-1px)}
.spice-public-avatar{width:34px!important;height:34px!important;min-width:34px;border-radius:50%!important;display:grid!important;place-items:center!important;background:#f3f3f3!important;color:#171717!important;font-size:11px!important;font-weight:850!important;letter-spacing:-.02em!important}
.spice-public-account-copy{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:3px!important;text-align:left!important;padding-right:2px}
.spice-public-account-copy strong{font-size:12px!important;font-weight:760!important;color:#fff!important;line-height:1.05!important}
.spice-public-account-copy small{font-size:10px!important;font-weight:500!important;color:rgba(255,255,255,.58)!important;line-height:1!important}
.spice-public-chevron{font-size:11px!important;color:rgba(255,255,255,.55)!important;margin-left:1px;transition:transform .18s ease}
.spice-public-account-toggle[aria-expanded="true"] .spice-public-chevron{transform:rotate(180deg)}
.spice-public-account-menu{position:absolute!important;top:calc(100% + 9px)!important;right:0!important;z-index:99999!important;width:250px!important;padding:9px!important;border:1px solid #dededb!important;border-radius:16px!important;background:#fff!important;color:#171717!important;box-shadow:0 18px 55px rgba(0,0,0,.20)!important;transform-origin:top right;animation:spicePublicMenuIn .17s ease both}
.spice-public-account-menu[hidden]{display:none!important}
.spice-public-menu-head{display:flex!important;align-items:center!important;gap:10px!important;padding:10px 10px 13px!important;margin-bottom:5px!important;border-bottom:1px solid #ececea!important}
.spice-public-menu-head .spice-public-avatar{background:#1b1b1b!important;color:#fff!important;width:34px!important;height:34px!important;min-width:34px!important}
.spice-public-menu-head>div{display:flex!important;flex-direction:column!important;gap:3px!important}.spice-public-menu-head strong{font-size:12px!important;color:#171717!important}.spice-public-menu-head small{font-size:10px!important;color:#868686!important}
.spice-public-account-menu>a{display:flex!important;justify-content:space-between!important;align-items:center!important;width:100%!important;padding:10px 11px!important;border-radius:9px!important;color:#252525!important;background:transparent!important;text-decoration:none!important;font-size:12px!important;font-weight:650!important;line-height:1.2!important;box-sizing:border-box!important}
.spice-public-account-menu>a:hover{background:#f2f2f0!important;color:#111!important}.spice-public-account-menu>a span{color:#999!important}.spice-public-menu-separator{height:1px;background:#ececea;margin:5px 8px}.spice-public-menu-logout{color:#686868!important}.spice-public-account-login .spice-public-avatar{font-size:13px!important}
@keyframes spicePublicMenuIn{from{opacity:0;transform:translateY(-5px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}

/* If the measured header is narrow, JS adds compact mode instead of allowing
   the badge to push or wrap anything. */
.spice-public-account-badge.is-compact .spice-public-account-copy,
.spice-public-account-badge.is-compact .spice-public-chevron{display:none!important}
.spice-public-account-badge.is-compact .spice-public-account{padding:5px!important}

@media(max-width:782px){
  .spice-public-account-badge{max-width:none}
  .spice-public-account-copy,.spice-public-chevron{display:none!important}
  .spice-public-account{padding:5px!important;min-height:42px}
  .spice-public-avatar{width:32px!important;height:32px!important;min-width:32px!important}
  .spice-public-account-menu{position:fixed!important;top:66px!important;right:12px!important;left:12px!important;width:auto!important}
}
@media(prefers-reduced-motion:reduce){.spice-public-account-badge,.spice-public-account-menu,.spice-public-account,.spice-public-chevron{animation:none!important;transition:none!important}}