/* BeatsHouse unified nav/menu — extracted from home.css so EVERY page gets the same full-width neon menu. Generated; edit home.css + re-extract. */

/* Single brand accent site-wide (acid green) — forces consistency over the
   generated legacy white and the older purple so every page shares one accent. */
:root{ --bh-accent:#22B6FF!important; --bh-accent-strong:#4AB8F5!important; --bh-accent-rgb:34,182,255!important; }


.bh-topnav{
      position:fixed;top:0;left:0;right:0;z-index:99999;pointer-events:auto;
    }

html.bh-iab .bh-topnav{
      position:fixed !important;
      top:0 !important;
      left:0 !important;
      right:0 !important;
      z-index:99999 !important;
    }

html.bh-iab .bh-topnav__bar{
      background:#000 !important;
      backdrop-filter:none !important;
      -webkit-backdrop-filter:none !important;
      padding-top:calc(12px + env(safe-area-inset-top, 0px)) !important;
    }

html.bh-iab .bh-slide-menu{backdrop-filter:none !important;-webkit-backdrop-filter:none !important;}

html.bh-iab .bh-slide-backdrop{backdrop-filter:none !important;-webkit-backdrop-filter:none !important;background:rgba(0,0,0,.85) !important;}

html.bh-iab .bh-topnav .bh-dock-item{min-height:44px;min-width:44px;}

html.bh-iab .bh-slide-menu{max-height:min(560px, calc(100vh - 120px)) !important;}

.bh-topnav__bar{
      display:flex;justify-content:space-between;align-items:center;gap:6px;
      padding:12px max(24px, 4vw);
      background:#000;
      backdrop-filter:none;
      -webkit-backdrop-filter:none;
      border-bottom:1px solid rgba(255,255,255,.08);
      box-shadow:none;
    }

@media(min-width:900px) {
.bh-topnav__bar{
        justify-content:center;
        gap:clamp(16px, 4vw, 48px);
      }
}

.bh-topnav .bh-dock-item{
      display:inline-flex;flex-direction:row;align-items:center;justify-content:center;
      gap:8px;height:40px;min-height:44px;padding:0 16px;
      border-radius:999px;border:1px solid transparent;background:transparent;
      color:rgba(255,255,255,.55);
      cursor:pointer;text-decoration:none;
      touch-action:manipulation;
      transition:color 180ms cubic-bezier(0.19,1,0.22,1), background 180ms cubic-bezier(0.19,1,0.22,1), border-color 180ms cubic-bezier(0.19,1,0.22,1), transform 100ms cubic-bezier(0.19,1,0.22,1);
      -webkit-tap-highlight-color:rgba(34,182,255,0.10);-webkit-appearance:none;appearance:none;
      position:relative;
      font-family:'Manrope',system-ui,sans-serif;
    }

.bh-topnav .bh-dock-item:hover{
      color:#ffffff;
      background:rgba(255,255,255,.05);
      border-color:rgba(255,255,255,.08);
    }

.bh-topnav .bh-dock-item:active{transform:scale(.97);}

.bh-topnav .bh-dock-item i{
      font-size:16px;line-height:1;pointer-events:none;
      display:inline-flex;align-items:center;justify-content:center;
    }

.bh-topnav .bh-dock-item svg{pointer-events:none;display:block;}

.bh-topnav .bh-dock-item__label{
      display:inline;
      font:700 11px/1 'Manrope',system-ui,sans-serif;
      letter-spacing:.12em;text-transform:uppercase;
      white-space:nowrap;pointer-events:none;
    }

.bh-topnav .bh-dock-item.active{
      background:rgba(34,182,255,.08) !important;
      border-color:rgba(34,182,255,.22) !important;
      box-shadow:none;
    }

.bh-topnav .bh-dock-item.active i,
    .bh-topnav .bh-dock-item.active svg{color:#22B6FF !important;}

.bh-topnav .bh-dock-item.active .bh-dock-item__label{color:#22B6FF;}

.bh-topnav .bh-dock-item.active:hover{background:rgba(34,182,255,.14) !important;}

.bh-topnav .bh-dock-item--menu{
      width:40px;min-width:40px;max-width:40px;padding:0;gap:0;
      justify-content:center;border-radius:999px;
      border-color:rgba(255,255,255,.12);
      background:
        radial-gradient(120% 120% at 50% 0%, rgba(255,255,255,.10), rgba(255,255,255,0) 60%),
        rgba(255,255,255,.035);
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        inset 0 -1px 0 rgba(0,0,0,.25),
        0 2px 8px rgba(0,0,0,.25);
      transition:background 220ms cubic-bezier(0.19,1,0.22,1), border-color 220ms cubic-bezier(0.19,1,0.22,1), transform 220ms cubic-bezier(0.19,1,0.22,1), box-shadow 220ms cubic-bezier(0.19,1,0.22,1);
    }

.bh-topnav .bh-dock-item--menu .bh-dock-menu-icon{
      width:20px;height:14px;flex-shrink:0;display:block;overflow:visible;
      color:currentColor;
    }

.bh-topnav .bh-dock-item--menu .bh-dock-menu-stroke{
      transition:transform .35s cubic-bezier(.76,0,.18,1), opacity .18s ease, width .3s ease;
      transform-origin:center;
    }

.bh-topnav .bh-dock-item--menu:hover{
      background:
        radial-gradient(120% 120% at 50% 0%, rgba(255,255,255,.16), rgba(255,255,255,0) 60%),
        rgba(255,255,255,.06);
      border-color:rgba(255,255,255,.22);
      transform:translateY(-1px);
    }

.bh-topnav .bh-dock-item--menu:active{transform:translateY(0) scale(.97);}

.bh-topnav .bh-dock-item--menu.is-menu-open{
      background:rgba(34,182,255,.10);
      border-color:rgba(34,182,255,.3);
      color:#22B6FF;
      box-shadow:none;
    }

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-dock-menu-stroke{color:#22B6FF;}

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-dock-menu-stroke--top{
      transform:translateY(7px) rotate(45deg);
    }

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-dock-menu-stroke--bot{
      transform:translateY(-7px) rotate(-45deg);
    }

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-dock-menu-stroke--mid{
      opacity:0;
      width:0;
    }

.bh-topnav .bh-dock-item--menu.active .bh-dock-menu-icon{color:#22B6FF;}

@media(max-width:560px) {
.bh-topnav .bh-dock-item--menu{width:36px;min-width:36px;max-width:36px;height:36px;}
.bh-topnav .bh-dock-item--menu .bh-dock-menu-icon{width:18px;height:12px;}
}

.bh-topnav .bh-dock-badge{
      position:absolute;top:-2px;right:-4px;
      min-width:18px;height:18px;padding:0 5px;
      border-radius:999px;
      background:#f4f4f5;color:#0a0a0a;
      font:800 10px/18px 'Manrope',sans-serif;
      text-align:center;pointer-events:none;
      box-shadow:0 0 0 2px rgba(10,10,12,1), 0 2px 6px rgba(0,0,0,.4);
    }

.bh-topnav .bh-dock-badge.is-empty{display:none;}

.bh-topnav .bh-dock-item.active .bh-dock-badge{
      background:#0a0a0a;color:#f4f4f5;
      box-shadow:0 0 0 2px #f4f4f5, 0 2px 6px rgba(0,0,0,.3);
    }

@media(max-width:560px) {
.bh-topnav__bar{padding:10px 12px;gap:2px;}
.bh-topnav .bh-dock-item{padding:0 10px;height:36px;gap:0;}
.bh-topnav .bh-dock-item__label{font-size:10px;letter-spacing:.1em;}
}

@media(max-width:380px) {
.bh-topnav__bar{padding:10px 8px;}
.bh-topnav .bh-dock-item{padding:0 8px;}
.bh-topnav .bh-dock-item__label{font-size:9px;letter-spacing:.08em;}
}

.bh-topnav{
      padding:0 !important;
      left:0 !important;
      right:0 !important;
      width:100% !important;
      max-width:100% !important;
      margin:0 !important;
    }

.bh-topnav__bar{
      display:flex !important;
      align-items:center !important;
      justify-content:center !important;
      gap:6px !important;
      border-radius:0 !important;
      padding:10px 14px !important;
      background:#000 !important;
      backdrop-filter:none !important;
      -webkit-backdrop-filter:none !important;
      border:0 !important;
      border-bottom:1px solid rgba(34,182,255,.10) !important;
      box-shadow:none !important;
      max-width:100% !important;
      width:100% !important;
      margin:0 auto !important;
      box-sizing:border-box !important;
    }

.bh-topnav .bh-dock-item{
      position:relative !important;
      border:0 !important;
      background:transparent !important;
      color:rgba(255,255,255,.65) !important;
      pointer-events:auto !important;
      visibility:visible !important;
      touch-action:manipulation !important;
      min-height:44px !important;
      min-width:44px !important;
      height:auto !important;
      text-decoration:none !important;
      transition:background-color .2s ease, color .2s ease !important;
      -webkit-tap-highlight-color:rgba(34,182,255,0.18) !important;
    }

.bh-topnav .bh-dock-item__label{
      pointer-events:none !important;
      font:700 11px/1 'Manrope',system-ui,sans-serif !important;
      letter-spacing:.12em !important;
      text-transform:uppercase !important;
    }

@media(hover:hover) {
.bh-topnav .bh-dock-item:hover{
        color:#ffffff !important;
        background:rgba(255,255,255,.06) !important;
      }
}

.bh-topnav .bh-dock-item:active{
      transform:scale(.96) !important;
      transition:transform .08s ease, background-color .1s ease !important;
    }

.bh-topnav .bh-dock-item.active,
    .bh-topnav .bh-dock-item.active:hover{
      background:rgba(34,182,255,.14) !important;
      color:#22B6FF !important;
      box-shadow:
        0 0 0 1px rgba(34,182,255,0.35) inset,
        0 6px 18px rgba(34,182,255,.14) !important;
    }

.bh-topnav .bh-dock-item.active i,
    .bh-topnav .bh-dock-item.active svg,
    .bh-topnav .bh-dock-item.active .bh-dock-item__label{color:#22B6FF !important;}

.bh-topnav .bh-dock-item.active .bh-dock-badge{
      background:#22B6FF !important;color:#000 !important;
      box-shadow:0 0 0 2px rgba(6,5,10,.9), 0 2px 6px rgba(0,0,0,.3) !important;
    }

.bh-topnav .bh-dock-item .bh-dock-item__label::after{display:none !important;}

.bh-topnav .bh-dock-item--menu{
      width:38px !important;min-width:38px !important;
      height:38px !important;
      padding:0 !important;
      background:transparent !important;
      border:1px solid transparent !important;
      box-shadow:none !important;
      transition:background-color .2s ease, border-color .25s cubic-bezier(.2,.8,.2,1), transform .2s ease !important;
    }

@media(hover:hover) {
.bh-topnav .bh-dock-item--menu:hover{
        background:rgba(255,255,255,.06) !important;
        border-color:rgba(255,255,255,.16) !important;
      }
}

.bh-topnav .bh-dock-item--menu:active{transform:scale(.92) !important;}

.bh-topnav .bh-dock-item--menu.is-menu-open{
      background:rgba(34,182,255,.16) !important;
      border-color:rgba(34,182,255,0.4) !important;
      box-shadow:
        0 0 0 1px rgba(34,182,255,.26) inset,
        0 4px 18px rgba(34,182,255,.16) !important;
    }

.bh-topnav .bh-dock-item--menu .bh-dock-menu-icon{
      transition:transform .3s cubic-bezier(.2,.8,.2,1), color .2s ease !important;
    }

.bh-topnav .bh-dock-item--menu:hover .bh-dock-menu-icon{
      transform:scale(1.06) !important;
    }

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-dock-menu-icon{
      transform:scale(1) !important;
      color:#22B6FF !important;
    }

.bh-topnav .bh-dock-item--menu .bh-dock-menu-icon{
      width:12px !important;height:12px !important;overflow:visible !important;
    }

.bh-topnav .bh-dock-item--menu .bh-menu-dots{
      opacity:1;transform:rotate(0deg) scale(1);
      transform-box:fill-box;transform-origin:center;
      transition:opacity .22s ease, transform .3s cubic-bezier(.2,.8,.2,1);
    }

.bh-topnav .bh-dock-item--menu .bh-menu-x{
      opacity:0;transform:scale(.6) rotate(-45deg);
      transform-box:fill-box;transform-origin:center;
      transition:opacity .22s ease, transform .3s cubic-bezier(.2,.8,.2,1);
    }

@media(hover:hover) {
.bh-topnav .bh-dock-item--menu:not(.is-menu-open):hover .bh-menu-dots{
        transform:rotate(45deg) scale(1.08);
      }
}

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-menu-dots{
      opacity:0;transform:rotate(45deg) scale(.5);
    }

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-menu-x{
      opacity:1;transform:scale(1) rotate(0deg);
    }

.bh-topnav .bh-dock-badge{
      transition:transform .22s cubic-bezier(.2,.8,.2,1) !important;
      transform-origin:center center !important;
    }

.bh-topnav .bh-dock-badge.is-bump{
      animation:bhBadgeBump .55s cubic-bezier(.2,.8,.2,1) !important;
    }

@media(max-width:560px) {
.bh-topnav__bar{padding:4px 6px !important;}
.bh-topnav .bh-dock-item{min-height:44px !important;padding:0 12px !important;}
.bh-topnav .bh-dock-item__label{font-size:9.5px !important;letter-spacing:.1em !important;}
}

.bh-topnav__bar{
      position:relative !important;
      background:rgba(6,5,10,.97) !important;
      border-bottom:1px solid rgba(34,182,255,0.12) !important;
      backdrop-filter:none !important;
      -webkit-backdrop-filter:none !important;
    }

.bh-topnav__bar::before{
      content:"BH" !important;
      position:absolute !important;
      left:max(16px,3vw) !important;
      top:50% !important;
      transform:translateY(-50%) !important;
      font:800 13px/1 'Syne',system-ui,sans-serif !important;
      letter-spacing:.18em !important;
      color:#22B6FF !important;
      pointer-events:none !important;
    }

.bh-topnav .bh-dock-item{
      font-family:'Manrope',system-ui,sans-serif !important;
      border-radius:3px !important;
    }

.bh-topnav .bh-dock-item.active,
    .bh-topnav .bh-dock-item.active:hover{
      background:rgba(34,182,255,0.12) !important;
      color:#22B6FF !important;
      box-shadow:
        0 0 0 1px rgba(34,182,255,0.28) inset,
        0 4px 16px rgba(34,182,255,0.1) !important;
      border-radius:3px !important;
    }

.bh-topnav .bh-dock-item.active .bh-dock-item__label,
    .bh-topnav .bh-dock-item.active i,
    .bh-topnav .bh-dock-item.active svg{ color:#22B6FF !important; }

.bh-topnav .bh-dock-badge{
      background:#22B6FF !important;
      color:#000 !important;
      font-family:'DM Mono','Space Mono',monospace !important;
      font-weight:700 !important;
      box-shadow:0 0 0 2px rgba(6,5,10,1), 0 2px 8px rgba(34,182,255,0.4) !important;
    }

.bh-topnav .bh-dock-item--menu.is-menu-open{
      background:rgba(34,182,255,.14) !important;
      border-color:rgba(34,182,255,.36) !important;
    }

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-dock-menu-icon{
      color:#22B6FF !important;
    }

.bh-topnav .bh-dock-item{gap:6px !important;}

.bh-topnav .bh-dock-item i{
      font-size:13px !important;
      line-height:1 !important;
      display:inline-flex !important;
      align-items:center !important;
      opacity:.75 !important;
      transition:opacity .18s ease !important;
    }

.bh-topnav .bh-dock-item.active i,
    .bh-topnav .bh-dock-item:hover i{opacity:1 !important;}

@media(max-width:560px) {
.bh-topnav .bh-dock-item{gap:4px !important;}
.bh-topnav .bh-dock-item i{font-size:12px !important;}
}

@media(max-width:380px) {
.bh-topnav .bh-dock-item__label{display:none !important;}
.bh-topnav .bh-dock-item{width:40px !important;min-width:40px !important;padding:0 !important;justify-content:center !important;}
.bh-topnav .bh-dock-item i{font-size:15px !important;opacity:1 !important;}
.bh-topnav .bh-dock-item--menu{width:38px !important;min-width:38px !important;}
}

.bh-slide-menu{
      background:rgba(6,5,10,.96) !important;
      border:0 !important;
      box-shadow:0 20px 60px rgba(0,0,0,.7) !important;
    }

.bh-slide-menu__head{
      background:transparent !important;
      border-bottom:1px solid rgba(242,237,228,.06) !important;
    }

.bh-slide-menu__avatar{
      border-radius:10px !important;
      box-shadow:0 0 0 1px rgba(242,237,228,.12),0 4px 12px rgba(0,0,0,.4) !important;
    }

.bh-slide-menu__name{
      font:700 15px/1.15 'Manrope',system-ui,sans-serif !important;
      color:rgba(242,237,228,.92) !important;
      letter-spacing:-.01em !important;
    }

.bh-slide-menu__role{
      font:700 8.5px/1 'Space Mono',monospace !important;
      letter-spacing:.2em !important;
      text-transform:uppercase !important;
      color:rgba(242,237,228,.38) !important;
    }

.bh-slide-menu__item{
      font:500 13px/1 'Manrope',system-ui,sans-serif !important;
      color:rgba(242,237,228,.55) !important;
      border-radius:8px !important;
    }

.bh-slide-menu__item::before{
      background:var(--bh-accent,#22B6FF) !important;
      box-shadow:none !important;
    }

@media(hover:hover) {
.bh-slide-menu__item:hover{
        color:rgba(242,237,228,.92) !important;
        background:rgba(242,237,228,.05) !important;
      }
.bh-slide-menu__item:hover i{color:rgba(242,237,228,.7) !important;}
}

.bh-slide-menu__item:active{background:rgba(242,237,228,.07) !important;}

.bh-slide-menu__item i{color:rgba(242,237,228,.28) !important;}

.bh-slide-menu__item--primary{
      background:rgba(34,182,255,.1) !important;
      color:var(--bh-accent,#22B6FF) !important;
      box-shadow:0 0 0 1px rgba(34,182,255,.18) inset !important;
    }

.bh-slide-menu__item--primary:hover{
      background:rgba(34,182,255,.16) !important;
      color:#F5A832 !important;
    }

.bh-slide-menu__item--admin i{color:rgba(242,237,228,.22) !important;}

.bh-slide-menu__item--admin:hover{color:rgba(242,237,228,.92) !important;background:rgba(242,237,228,.05) !important;}

.bh-slide-menu__item--admin:hover i{color:rgba(242,237,228,.6) !important;}

.bh-slide-menu__sep{background:rgba(242,237,228,.06) !important;margin:8px 14px !important;}

.bh-slide-menu__sep[data-label]{height:auto !important;background:transparent !important;margin:12px 14px 4px !important;font:600 10px/1 'Manrope',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.22);}

.bh-slide-menu__sep[data-label]::before{content:attr(data-label);display:block;}

.bh-slide-menu__sep[data-label]::before{
      font:600 8px/1 'Space Mono',monospace !important;
      letter-spacing:.2em !important;
      color:rgba(242,237,228,.28) !important;
      background:rgba(6,5,10,.96) !important;
    }

.bh-slide-menu__badge{
      background:rgba(242,237,228,.07) !important;
      color:rgba(242,237,228,.55) !important;
      font-family:'Space Mono',monospace !important;
      box-shadow:none !important;
    }

.bh-fullmenu-sec-lbl{color:rgba(255,255,255,.3)!important;}

.bh-fullmenu-sec--browse .bh-fullmenu-sec-lbl{color:rgba(34,182,255,.6)!important;}

.bh-fullmenu-sec--browse .bh-slide-menu__item i{color:rgba(34,182,255,.45)!important;}

@media(hover:hover) {
.bh-fullmenu-sec--browse .bh-slide-menu__item:hover i{color:#22B6FF!important;}
}

.bh-fullmenu-sec--explore .bh-fullmenu-sec-lbl{color:rgba(52,211,153,.55)!important;}

.bh-fullmenu-sec--explore .bh-slide-menu__item i{color:rgba(52,211,153,.4)!important;}

@media(hover:hover) {
.bh-fullmenu-sec--explore .bh-slide-menu__item:hover i{color:#34d399!important;}
}

.bh-fullmenu-sec--account .bh-fullmenu-sec-lbl{color:rgba(167,139,250,.55)!important;}

.bh-fullmenu-sec--account .bh-slide-menu__item i{color:rgba(167,139,250,.4)!important;}

@media(hover:hover) {
.bh-fullmenu-sec--account .bh-slide-menu__item:hover i{color:#a78bfa!important;}
}

.bh-fullmenu-sec--create .bh-fullmenu-sec-lbl{color:rgba(251,146,60,.55)!important;}

.bh-fullmenu-sec--create .bh-slide-menu__item i{color:rgba(251,146,60,.4)!important;}

@media(hover:hover) {
.bh-fullmenu-sec--create .bh-slide-menu__item:hover i{color:#fb923c!important;}
}

.bh-fullmenu-sec--account .bh-slide-menu__item--primary i{color:#22B6FF!important;}

.bh-slide-backdrop{
      background:rgba(6,5,10,.7) !important;
      backdrop-filter:blur(10px) !important;
      -webkit-backdrop-filter:blur(10px) !important;
    }

.bh-topnav__bar{
      background:linear-gradient(180deg,rgba(255,255,255,.055) 0%,rgba(255,255,255,.01) 100%),rgba(5,4,14,.91) !important;
      backdrop-filter:blur(36px) saturate(210%) brightness(1.05) !important;
      -webkit-backdrop-filter:blur(36px) saturate(210%) brightness(1.05) !important;
      border-bottom:0 !important;
      box-shadow:
        0 1px 0 rgba(255,255,255,.055) inset,
        0 0 0 0.5px rgba(94,234,212,.15) inset,
        0 8px 32px rgba(0,0,0,.45),
        0 1px 0 rgba(56,189,248,.12) !important;
    }

.bh-topnav__bar::after{
      content:"" !important;
      position:absolute !important;
      inset:0 0 auto 0 !important;
      height:1px !important;
      background:linear-gradient(90deg,transparent 0%,#5eead4 22%,#c4b5f4 50%,#38bdf8 78%,transparent 100%) !important;
      opacity:.55 !important;
      pointer-events:none !important;
    }

.bh-topnav__bar::before{
      color:transparent !important;
      background:linear-gradient(135deg,#5eead4 0%,#c4b5f4 100%) !important;
      -webkit-background-clip:text !important;
      background-clip:text !important;
      -webkit-text-fill-color:transparent !important;
    }

.bh-topnav .bh-dock-item.active,
    .bh-topnav .bh-dock-item.active:hover{
      background:linear-gradient(135deg,rgba(94,234,212,.18) 0%,rgba(129,140,248,.18) 100%) !important;
      color:#5eead4 !important;
      box-shadow:
        0 0 0 1px rgba(94,234,212,.35) inset,
        0 4px 20px rgba(94,234,212,.14) !important;
      border-radius:6px !important;
    }

.bh-topnav .bh-dock-item.active .bh-dock-item__label,
    .bh-topnav .bh-dock-item.active i,
    .bh-topnav .bh-dock-item.active svg{ color:#5eead4 !important; fill:#5eead4 !important; }

.bh-topnav .bh-dock-badge{
      background:linear-gradient(135deg,#5eead4,#c4b5f4) !important;
      color:#000 !important;
      box-shadow:0 0 0 2px rgba(6,5,10,1),0 2px 10px rgba(94,234,212,.45) !important;
    }

.bh-topnav .bh-dock-item--menu.is-menu-open{
      background:linear-gradient(135deg,rgba(94,234,212,.16) 0%,rgba(129,140,248,.16) 100%) !important;
      border-color:rgba(94,234,212,.32) !important;
    }

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-dock-menu-icon{
      color:#5eead4 !important;
    }

.bh-slide-menu{
      background:linear-gradient(180deg,rgba(255,255,255,.045) 0%,rgba(255,255,255,.005) 100%),rgba(5,4,14,.94) !important;
      backdrop-filter:blur(40px) saturate(200%) !important;
      -webkit-backdrop-filter:blur(40px) saturate(200%) !important;
      border:0.5px solid rgba(94,234,212,.14) !important;
      box-shadow:0 0 0 0.5px rgba(129,140,248,.12),0 24px 64px rgba(0,0,0,.65),0 8px 24px rgba(94,234,212,.06) !important;
    }

.bh-slide-menu__head{
      border-bottom:1px solid rgba(94,234,212,.1) !important;
    }

.bh-slide-menu__item::before{
      background:linear-gradient(90deg,#5eead4,#c4b5f4) !important;
    }

.bh-home-v5 .bh-dock-container{
      position:fixed !important;
      left:50% !important;
      bottom:14px !important;
      transform:translateX(-50%) !important;
      z-index:2147483000 !important;
      width:auto !important;
      display:block !important;
      opacity:1 !important;
      visibility:visible !important;
      pointer-events:none !important;
      background:transparent !important;
      border:0 !important;
      padding:0 !important;
      box-shadow:none !important;
      touch-action:none !important;
    }

.bh-home-v5 .bh-dock-nav{
      pointer-events:auto !important;
      display:flex !important;
      align-items:center !important;
      gap:6px !important;
      padding:8px !important;
      border:0 !important;
      border-radius:18px !important;
      background:rgba(255,255,255,.05) !important;
      box-shadow:
        0 0 0 1px rgba(255,255,255,.06),
        0 4px 16px rgba(0,0,0,.35),
        0 12px 40px rgba(0,0,0,.2) !important;
      backdrop-filter:blur(32px) saturate(130%) !important;
      -webkit-backdrop-filter:blur(32px) saturate(130%) !important;
      touch-action:manipulation !important;
      -webkit-user-select:none !important;
      user-select:none !important;
      overscroll-behavior:none !important;
    }

.bh-home-v5 .bh-dock-item{
      -webkit-appearance:none;
      appearance:none;
      border:0 !important;
      background:transparent !important;
      color:rgba(255,255,255,.35) !important;
      font-size:18px !important;
      line-height:1 !important;
      width:52px;
      height:44px;
      min-width:52px;
      min-height:44px;
      padding:0 !important;
      border-radius:12px !important;
      cursor:pointer;
      text-decoration:none !important;
      position:relative;
      display:flex;
      align-items:center;
      justify-content:center;
      -webkit-tap-highlight-color:transparent;
      touch-action:manipulation;
      transition:color .2s ease, background .2s ease;
    }

.bh-home-v5 .bh-dock-item:focus,
    .bh-home-v5 .bh-dock-item:active{
      background:transparent !important;
      box-shadow:none !important;
      outline:none !important;
    }

.bh-home-v5 .bh-dock-item i{
      pointer-events:none;
      transition:transform .2s cubic-bezier(.34,1.56,.64,1) !important;
    }

.bh-home-v5 .bh-dock-item:hover{
      color:rgba(255,255,255,.7) !important;
    }

.bh-home-v5 .bh-dock-item:hover i{
      transform:translateY(-1px) !important;
    }

.bh-home-v5 .bh-dock-item.active{
      color:#fff !important;
      background:rgba(255,255,255,.1) !important;
      box-shadow:none !important;
    }

.bh-home-v5 .bh-dock-item.active::after{
      content:'';
      position:absolute;
      bottom:5px;
      left:50%;
      transform:translateX(-50%);
      width:3px;
      height:3px;
      border-radius:50%;
      background:#fff;
      box-shadow:0 0 4px rgba(255,255,255,.5);
    }

.bh-home-v5 .bh-dock-badge{
      position:absolute;
      top:4px;
      right:4px;
      min-width:16px;
      height:16px;
      padding:0 4px;
      border-radius:999px;
      background:#fff;
      color:#0c0c0c;
      font:800 8px/16px 'Manrope',system-ui,sans-serif;
      text-align:center;
      pointer-events:none;
      box-shadow:0 1px 4px rgba(0,0,0,.4);
    }

.bh-home-v5 .bh-dock-badge.is-empty{
      display:none;
    }

.bh-home-v5 .bh-dock-item__label{
      display:none !important;
    }

.bh-home-v5 .bh-dock-item--menu{
      width:44px !important;
      height:44px !important;
      min-width:44px !important;
      min-height:44px !important;
      border-radius:12px !important;
      background:rgba(255,255,255,.08) !important;
      border:1px solid rgba(255,255,255,.06) !important;
      color:rgba(255,255,255,.6) !important;
      transition:background .2s ease, color .2s ease, border-color .2s ease, transform .15s ease !important;
    }

.bh-home-v5 .bh-dock-item--menu:hover{
      background:rgba(255,255,255,.14) !important;
      color:#fff !important;
      border-color:rgba(255,255,255,.12) !important;
    }

.bh-home-v5 .bh-dock-item--menu:active{
      transform:scale(.9) !important;
    }

.bh-dock-menu-icon{
      display:block !important;
      overflow:visible !important;
    }

.bh-dock-menu-stroke{
      transition:transform .35s cubic-bezier(.76,0,.18,1), opacity .2s ease, width .3s ease !important;
      transform-origin:center !important;
    }

.bh-dock-item--menu.is-menu-open .bh-dock-menu-stroke--top{
      transform:translateY(4px) rotate(45deg) !important;
    }

.bh-dock-item--menu.is-menu-open .bh-dock-menu-stroke--bot{
      transform:translateY(-4px) translateX(2.5px) rotate(-45deg) scaleX(1.45) !important;
    }

@media (max-width:480px) {
.bh-home-v5 .bh-dock-nav{
        gap:4px !important;
        padding:6px !important;
      }
.bh-home-v5 .bh-dock-item{
        font-size:16px !important;
        width:48px;
        height:40px;
        min-width:48px;
        min-height:40px;
      }
}

@media (max-width:640px) {
.bh-home-v5 .bh-dock-nav{
        gap:14px !important;
        padding:8px 12px !important;
      }
.bh-home-v5 .bh-dock-item{
        font-size:17px !important;
        min-width:26px;
        min-height:26px;
        padding:0 !important;
      }
}

.bh-home-v5 .bh-dock-container{
      bottom:14px !important;
      z-index:2147483000 !important;
    }

.bh-home-v5 .bh-dock-nav{
      border-radius:999px !important;
      background:rgba(7,7,10,.82) !important;
      backdrop-filter:blur(22px) saturate(150%) !important;
      -webkit-backdrop-filter:blur(22px) saturate(150%) !important;
      box-shadow:0 12px 44px rgba(0,0,0,.38),0 0 0 1px rgba(255,255,255,.05) !important;
      padding:10px 16px !important;
      gap:12px !important;
    }

.bh-home-v5 .bh-dock-item{
      width:44px !important;
      height:44px !important;
      min-width:44px !important;
      min-height:44px !important;
      border:1px solid rgba(255,255,255,.14) !important;
      border-radius:999px !important;
      background:rgba(255,255,255,.06) !important;
      color:rgba(244,244,245,.92) !important;
      font-size:16px !important;
      line-height:1 !important;
      box-shadow:0 0 0 1px rgba(255,255,255,.03),0 10px 20px rgba(0,0,0,.16) !important;
      transition:border-color .16s ease,background .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease !important;
      transform:translate3d(0,0,0) scale(1) !important;
      transform-origin:center center !important;
      opacity:1 !important;
    }

.bh-home-v5 .bh-dock-item i{
      display:block !important;
      font-size:1em !important;
      line-height:1 !important;
    }

.bh-home-v5 .bh-dock-item:hover{
      border-color:rgba(255,255,255,.22) !important;
      background:rgba(255,255,255,.1) !important;
      color:#ffffff !important;
      box-shadow:0 0 0 1px rgba(255,255,255,.04),0 12px 22px rgba(0,0,0,.18) !important;
      transform:scale(1.08) !important;
    }

.bh-home-v5 .bh-dock-item.active::after{
      width:5px !important;
      height:5px !important;
      bottom:-7px !important;
      background:#cccccc !important;
      box-shadow:0 0 10px rgba(160,160,160,.3), 0 0 20px rgba(255,255,255,.1);
    }

.bh-home-v5 .bh-dock-item.active{
      border-color:rgba(255,255,255,.12) !important;
      background:rgba(255,255,255,.08) !important;
      color:#cccccc !important;
      box-shadow:0 0 15px rgba(255,255,255,.1), 0 0 30px rgba(255,255,255,.03) !important;
      transform:none !important;
    }

.bh-home-v5 .bh-dock-nav{
      background:rgba(7,7,10,.85) !important;
      border:1px solid rgba(255,255,255,.04) !important;
      box-shadow:0 4px 30px rgba(0,0,0,.6), 0 0 20px rgba(255,255,255,.015), inset 0 1px 0 rgba(255,255,255,.03) !important;
    }

@media (max-width:640px) {
.bh-home-v5 .bh-dock-nav{
        padding:10px 14px !important;
        gap:10px !important;
        border-radius:18px !important;
      }
.bh-home-v5 .bh-dock-item{
        width:44px !important;
        height:44px !important;
        min-width:44px !important;
        min-height:44px !important;
        font-size:15px !important;
      }
}

.bh-home-v5 .bh-dock-nav{
      padding:8px 12px !important;
      gap:4px !important;
      border-top:1px solid rgba(255,255,255,.06) !important;
      overscroll-behavior:contain !important;
      touch-action:manipulation !important;
      -webkit-user-select:none !important;
      user-select:none !important;
    }

.bh-home-v5 .bh-dock-item{
      width:auto !important;
      height:auto !important;
      min-width:56px !important;
      min-height:48px !important;
      display:flex !important;
      flex-direction:column !important;
      align-items:center !important;
      justify-content:center !important;
      gap:4px !important;
      padding:6px 8px !important;
      font-size:17px !important;
      border-radius:12px !important;
      touch-action:manipulation !important;
    }

.bh-home-v5 .bh-dock-item.active{
      background:rgba(255,255,255,.08) !important;
    }

.bh-home-v5 .bh-dock-item__label{
      display:block !important;
      font:600 8px/1 "Manrope",system-ui,sans-serif !important;
      letter-spacing:.06em !important;
      text-transform:uppercase !important;
      color:inherit !important;
      white-space:nowrap !important;
      opacity:.85 !important;
    }

.bh-home-v5 .bh-dock-item.active .bh-dock-item__label{
      opacity:1 !important;
    }

.bh-home-v5 .bh-dock-badge{
      top:2px !important;
      right:6px !important;
    }

.bh-slide-backdrop{
      position:fixed !important;
      inset:0 !important;
      z-index:9999 !important;
      background:rgba(4,3,8,.72) !important;
      backdrop-filter:blur(18px) saturate(120%) !important;
      -webkit-backdrop-filter:blur(18px) saturate(120%) !important;
      opacity:0 !important;
      transition:opacity .28s ease !important;
      pointer-events:none !important;
    }

.bh-slide-backdrop.is-open{opacity:1 !important;pointer-events:auto !important}

.bh-slide-menu{
      position:fixed !important;
      inset:0 !important;
      top:54px !important;
      left:0 !important;right:0 !important;bottom:0 !important;
      width:100% !important;max-width:none !important;
      max-height:none !important;height:auto !important;
      z-index:10000 !important;
      background:rgba(8,7,14,.98) !important;
      border-radius:0 !important;
      border-top:1px solid rgba(34,182,255,.12) !important;
      border-left:0 !important;border-right:0 !important;border-bottom:0 !important;
      box-shadow:none !important;
      backdrop-filter:none !important;
      -webkit-backdrop-filter:none !important;
      display:flex !important;
      flex-direction:column !important;
      opacity:0 !important;
      pointer-events:none !important;
      transform:translateX(100%) !important;
      transition:transform .34s cubic-bezier(.2,.8,.2,1), opacity .2s ease !important;
      overflow-x:hidden !important;
      overflow-y:auto !important;
      overscroll-behavior:contain !important;
      padding:0 !important;
    }

.bh-slide-menu.is-open{
      opacity:1 !important;
      pointer-events:auto !important;
      transform:translateX(0) !important;
    }

.bh-slide-menu::before{content:none !important;}

.bh-slide-menu::after{content:none !important;}

.bh-slide-menu__head{
      position:relative !important;
      z-index:1 !important;
      display:flex !important;
      align-items:center !important;
      gap:14px !important;
      padding:18px 24px 16px !important;
      flex-shrink:0 !important;
      overflow:hidden !important;
      border-bottom:1px solid rgba(255,255,255,.06) !important;
    }

.bh-slide-menu__head::after{content:none !important;}

.bh-slide-menu__avatar{
      width:44px !important;height:44px !important;
      border-radius:10px !important;object-fit:cover !important;
      flex-shrink:0 !important;border:0 !important;
      outline:2px solid rgba(34,182,255,.4) !important;
      outline-offset:2px !important;
      box-shadow:0 6px 20px rgba(0,0,0,.5) !important;
    }

.bh-slide-menu__name{
      margin:0 0 4px !important;color:#f0ebe1 !important;
      font:700 15px/1 "Manrope",system-ui,sans-serif !important;
      letter-spacing:-.02em !important;
    }

.bh-slide-menu__role{
      display:inline-flex !important;align-items:center !important;
      margin:0 !important;padding:2px 7px !important;
      background:rgba(34,182,255,.1) !important;
      border:1px solid rgba(34,182,255,.2) !important;
      border-radius:3px !important;color:#d4880f !important;
      font:700 8px/1 "Space Mono",monospace !important;
      letter-spacing:.22em !important;text-transform:uppercase !important;
    }

.bh-fullmenu-body{
      display:grid !important;
      grid-template-columns:1fr !important; /* default 1 col — menus with one .bh-fullmenu-col (e.g. profile) no longer leave an empty right half */
      flex:1 !important;
    }
    /* Two columns only when there really are two (e.g. the home mega-menu). */
    .bh-fullmenu-body:has(.bh-fullmenu-col ~ .bh-fullmenu-col){grid-template-columns:1fr 1fr !important;}

.bh-fullmenu-col{
      padding:24px 24px 32px !important;
      display:flex !important;flex-direction:column !important;gap:24px !important;
    }

.bh-fullmenu-col:first-child{border-right:1px solid rgba(255,255,255,.04) !important;}

.bh-fullmenu-sec-lbl{
      font:700 9px/1 "Space Mono",monospace !important;
      letter-spacing:.2em !important;text-transform:uppercase !important;
      color:rgba(34,182,255,.5) !important;
      padding-bottom:10px !important;
      border-bottom:1px solid rgba(255,255,255,.05) !important;
      margin-bottom:4px !important;
    }

.bh-slide-menu__item{
      display:flex !important;align-items:center !important;
      gap:12px !important;padding:10px 12px !important;
      border:0 !important;border-radius:10px !important;
      background:transparent !important;
      color:rgba(240,235,225,.62) !important;
      font:500 13px/1.2 "Manrope",system-ui,sans-serif !important;
      text-align:left !important;text-decoration:none !important;
      cursor:pointer !important;-webkit-appearance:none !important;appearance:none !important;
      transition:background .15s ease, color .13s ease !important;
      width:100% !important;box-shadow:none !important;box-sizing:border-box !important;
    }

.bh-slide-menu__item i{
      width:28px !important;height:28px !important;
      display:flex !important;align-items:center !important;justify-content:center !important;
      flex-shrink:0 !important;font-size:13px !important;
      border-radius:7px !important;
      background:rgba(255,255,255,.05) !important;
      color:rgba(34,182,255,.7) !important;
      transition:background .15s ease, color .13s ease !important;
    }

.bh-slide-menu__item span{flex:1 !important;min-width:0 !important;}

@media(hover:hover) {
.bh-slide-menu__item:hover{
        background:rgba(255,255,255,.055) !important;color:#f0ebe1 !important;
      }
.bh-slide-menu__item:hover i{
        background:rgba(34,182,255,.15) !important;color:#f5a832 !important;
      }
}

.bh-slide-menu__item:active{transform:scale(.985) !important;}

.bh-slide-menu__item--primary{
      background:rgba(34,182,255,.1) !important;color:#f5a832 !important;
      font-weight:600 !important;border:1px solid rgba(34,182,255,.16) !important;
    }

.bh-slide-menu__item--primary i{background:rgba(34,182,255,.18) !important;color:#f5a832 !important;}

.bh-slide-menu__item--admin{color:rgba(240,235,225,.5) !important;}

.bh-slide-menu__item--danger{color:rgba(255,255,255,.3) !important;}

.bh-slide-menu__item--danger i{color:rgba(239,68,68,.4) !important;background:rgba(239,68,68,.07) !important;}

@media(hover:hover) {
.bh-slide-menu__item--danger:hover{color:#ef4444 !important;background:rgba(239,68,68,.07) !important;}
}

.bh-slide-menu__badge{
      margin-left:auto !important;min-width:18px !important;height:18px !important;
      padding:0 6px !important;border-radius:99px !important;
      background:rgba(34,182,255,.15) !important;color:#f5a832 !important;
      font:700 9px/18px "Space Mono",monospace !important;text-align:center !important;
    }

.bh-fullmenu-admin-row{
      display:flex !important;flex-wrap:wrap !important;gap:4px !important;
      padding:12px 24px 16px !important;
      border-top:1px solid rgba(255,255,255,.04) !important;
    }

.bh-fullmenu-admin-row .bh-slide-menu__item{
      width:auto !important;flex:0 0 auto !important;
      padding:6px 12px !important;font-size:11px !important;
      border:1px solid rgba(255,255,255,.06) !important;border-radius:8px !important;
    }

.bh-fullmenu-footer{
      padding:12px 24px !important;
      border-top:1px solid rgba(255,255,255,.05) !important;
      display:flex !important;flex-wrap:wrap !important;gap:6px !important;align-items:center !important;
    }

.bh-slide-menu__foot{display:none !important;}

.bh-slide-menu__sep{
      height:1px !important;background:rgba(255,255,255,.05) !important;margin:6px 0 !important;
    }

.bh-slide-menu__sep[data-label]{
      height:auto !important;background:none !important;margin:10px 0 2px !important;padding:0 !important;
      font:700 9px/1 "Space Mono",monospace !important;letter-spacing:.2em !important;
      text-transform:uppercase !important;color:rgba(34,182,255,.45) !important;
    }

.bh-slide-menu__sep[data-label]::before{content:attr(data-label) !important;display:block !important;}

.bh-menu-close-btn{
      position:absolute !important;top:14px !important;right:16px !important;
      background:rgba(255,255,255,.06) !important;border:1px solid rgba(255,255,255,.1) !important;
      color:rgba(255,255,255,.5) !important;width:30px !important;height:30px !important;
      border-radius:8px !important;cursor:pointer !important;
      display:flex !important;align-items:center !important;justify-content:center !important;
      font-size:15px !important;line-height:1 !important;z-index:2 !important;
      transition:all .15s !important;
    }

@media(max-width:680px) {
.bh-fullmenu-body{grid-template-columns:1fr !important;}
.bh-fullmenu-col:first-child{border-right:none !important;border-bottom:1px solid rgba(255,255,255,.04) !important;padding-bottom:16px !important;}
.bh-fullmenu-col,.bh-fullmenu-footer,.bh-fullmenu-admin-row{padding-left:16px !important;padding-right:16px !important;}
.bh-slide-menu{top:52px !important;}
.bh-slide-menu__head{padding:14px 16px 12px !important;}
}

.bh-fullmenu-sec--browse .bh-fullmenu-sec-lbl{color:#22B6FF!important;}

.bh-fullmenu-sec--browse .bh-slide-menu__item i{color:#22B6FF!important;background:rgba(34,182,255,.09)!important;}

@media(hover:hover) {
.bh-fullmenu-sec--browse .bh-slide-menu__item:hover i{color:#7dd3fc!important;background:rgba(34,182,255,.16)!important;}
}

.bh-fullmenu-sec--explore .bh-fullmenu-sec-lbl{color:#34d399!important;}

.bh-fullmenu-sec--explore .bh-slide-menu__item i{color:#34d399!important;background:rgba(52,211,153,.09)!important;}

@media(hover:hover) {
.bh-fullmenu-sec--explore .bh-slide-menu__item:hover i{color:#6ee7b7!important;background:rgba(52,211,153,.16)!important;}
}

.bh-fullmenu-sec--account .bh-fullmenu-sec-lbl{color:#a78bfa!important;}

.bh-fullmenu-sec--account .bh-slide-menu__item i{color:#a78bfa!important;background:rgba(167,139,250,.09)!important;}

@media(hover:hover) {
.bh-fullmenu-sec--account .bh-slide-menu__item:hover i{color:#c4b5fd!important;background:rgba(167,139,250,.16)!important;}
}

.bh-fullmenu-sec--account .bh-slide-menu__item--primary i{color:#22B6FF!important;background:rgba(34,182,255,.14)!important;}

.bh-fullmenu-sec--create .bh-fullmenu-sec-lbl{color:#fb923c!important;}

.bh-fullmenu-sec--create .bh-slide-menu__item i{color:#fb923c!important;background:rgba(251,146,60,.09)!important;}

@media(hover:hover) {
.bh-fullmenu-sec--create .bh-slide-menu__item:hover i{color:#fdba74!important;background:rgba(251,146,60,.16)!important;}
}

@media (max-width:640px) {
.bh-home-v5 .bh-dock-item{
        width:54px !important;
        height:54px !important;
        min-width:54px !important;
        min-height:54px !important;
      }
.bh-home-v5 .bh-dock-item__label{
        font-size:7px !important;
      }
}

.bh-home-v5 .bh-home-master-play.is-playing,
    .bh-home-v5 .bh-app-main-player__btn--play,
    .bh-home-v5 .bh-dock-item.active,
    .bh-home-v5 .bottom-nav .active{
      border-color:color-mix(in srgb, var(--accent) 34%, transparent) !important;
      background:color-mix(in srgb, var(--accent) 16%, rgba(255,255,255,.04)) !important;
      color:#999999 !important;
      box-shadow:0 0 0 1px rgba(255,255,255,.04), 0 14px 28px rgba(0,0,0,.2), var(--accent-glow) !important;
    }

.bh-home-v5 .bh-home-master-play.is-playing i,
    .bh-home-v5 .bh-app-main-player__btn--play i,
    .bh-home-v5 .bh-dock-item.active i{
      color:#999999 !important;
    }

.bh-home-v5 .bh-dock-item.active::after{
      background:#999999 !important;
      box-shadow:0 0 10px rgba(160,160,160,.45), 0 0 20px rgba(160,160,160,.18) !important;
    }

.bh-home-v5 .featured-card,
    .bh-home-v5 .recent-section,
    .bh-home-v5 .bh-dock-container{
      animation:bhFadeUp .4s ease both;
    }

.bh-home-v5 .bh-dock-container{animation-delay:.15s}

@media (prefers-reduced-motion:reduce) {
.bh-home-v5 .featured-card,
      .bh-home-v5 .recent-section,
      .bh-home-v5 .bh-dock-container,
      .bh-home-v5 .beat-card,
      .bh-home-v5 .bh-home-trackrow{
        animation:none !important;
      }
}

.bh-home-v5 .bh-dock-container{
      position:sticky !important;
      top:0 !important;
      width:100% !important;
      transform:none !important;
      z-index:9999 !important;
      pointer-events:auto !important;
      left:auto !important;right:auto !important;bottom:auto !important;
    }

.bh-home-v5 .nav-item .bh-dock-item__label{
      display:inline !important;
      font:500 10px/1 "Manrope",system-ui,sans-serif !important;
      letter-spacing:.02em !important;
      text-transform:uppercase !important;
    }

.bh-slide-backdrop{z-index:9998 !important}

.bh-slide-menu{z-index:10000 !important;bottom:0 !important;}

.bh-home-v5 .bottom-nav,
    .bh-home-v5 .bh-dock-nav{
      flex-wrap:nowrap !important;
      overflow:hidden !important;
      max-height:60px !important;
    }

.bh-home-v5 .nav-item,
    .bh-home-v5 .bh-dock-item{
      display:inline-flex !important;
      flex-direction:row !important;
      align-items:center !important;
      gap:5px !important;
      height:36px !important;
      min-height:0 !important;
      max-height:36px !important;
      width:auto !important;
      min-width:0 !important;
      padding:0 10px !important;
      border-radius:8px !important;
      font-size:10px !important;
      flex-shrink:1 !important;
    }

.bh-home-v5 .nav-item i,
    .bh-home-v5 .bh-dock-item i{
      font-size:14px !important;
      line-height:1 !important;
    }

.bh-home-v5 .bh-dock-item__label{
      display:inline !important;
      font:500 10px/1 'Manrope',sans-serif !important;
      white-space:nowrap !important;
    }

.bh-home-v5 .bh-dock-item--menu{
      width:36px !important;
      max-width:36px !important;
      padding:0 !important;
      justify-content:center !important;
    }

.bh-home-v5 .bh-dock-item--menu .bh-dock-item__label{
      display:none !important;
    }

.bh-topnav__bar{
      box-shadow:
        0 1px 0 rgba(34,182,255,0.18),
        0 8px 24px rgba(0,0,0,.5) !important;
    }

.bh-home-v5 .bh-dock-item--active .bh-dock-item__label::before,
    .bh-home-v5 .bh-dock-item.is-active .bh-dock-item__label::before{
      content:"" !important;
      display:inline-block !important;
      width:5px !important;
      height:5px !important;
      border-radius:0 !important;
      background:#22B6FF !important;
      margin-right:5px !important;
      vertical-align:middle !important;
      animation:bhLedPulse 2s ease-in-out infinite !important;
      box-shadow:0 0 6px rgba(34,182,255,0.6) !important;
    }

.bh-slide-menu__head img,
    .bh-slide-menu__head .bh-slide-menu__avatar{
      box-shadow:0 0 0 2px rgba(34,182,255,0.3), 0 0 12px rgba(34,182,255,0.15) !important;
    }

.bh-home-v5 .bh-dock-item--active,
    .bh-home-v5 .bh-dock-item.is-active{
      color:#22B6FF !important;
    }

.bh-home-v5 .bh-dock-item--active::after,
    .bh-home-v5 .bh-dock-item.is-active::after{
      content:"" !important;
      display:block !important;
      width:20px !important;
      height:2px !important;
      background:#22B6FF !important;
      border-radius:0 !important;
      margin:4px auto 0 !important;
      box-shadow:0 0 8px rgba(34,182,255,0.5) !important;
    }

.bh-gsap-ready .bh-topnav{opacity:0;transform:translateY(-100%);}

.bh-home-v5 .bh-hero__badge,
    .bh-home-v5 .bh-hero__spec,
    .bh-home-v5 .bh-hero__prices,
    .bh-home-v5 .bh-hero__cta,
    .bh-home-v5 .bh-catalog__specs,
    .bh-home-v5 .bh-catalog__price,
    .bh-home-v5 .bh-catalog__num,
    .bh-home-v5 .bh-dock-item__label{ font-family:'DM Mono','Space Mono',ui-monospace,monospace !important; }

.bh-topnav__bar::before{ display:none !important; content:"" !important; }

.bh-topnav{
      padding:env(safe-area-inset-top,0px) 0 0 0 !important;
      background:rgba(6,5,10,.97) !important;
    }

.bh-topnav__bar{
      justify-content:center !important;
      gap:4px !important;
      padding:0 10px !important;
      height:48px !important;
    }

.bh-topnav .bh-dock-item{
      flex:0 0 auto !important;
      margin:0 !important;
      min-height:40px !important;
      min-width:44px !important;
      -webkit-tap-highlight-color:transparent !important;
      touch-action:manipulation !important;
    }

.bh-topnav .bh-dock-item--menu{
      width:auto !important;
      min-width:44px !important;
      max-width:none !important;
      padding:0 14px !important;
      height:40px !important;
      border:0 !important;
      background:transparent !important;
      box-shadow:none !important;
      border-radius:6px !important;
    }

.bh-topnav .bh-dock-item--menu .bh-brand-label{
      font:800 13px/1 'Syne',system-ui,sans-serif !important;
      letter-spacing:.22em !important;
      color:#22B6FF !important;
      text-transform:uppercase !important;
      pointer-events:none !important;
      display:block !important;
    }

.bh-topnav .bh-dock-item--menu:hover{ background:rgba(34,182,255,0.08) !important; }

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-brand-label{ color:#22B6FF !important; }

.bh-topnav .bh-dock-item--menu.is-menu-open{
      background:rgba(34,182,255,0.12) !important;
    }

.bh-topnav .bh-dock-item{ border:0 !important; box-shadow:none !important; }

.bh-topnav .bh-dock-item.active{
      background:rgba(34,182,255,.14) !important;
      color:#22B6FF !important;
      box-shadow:none !important;
    }

.bh-topnav{
      position:fixed !important;top:0 !important;left:0 !important;right:0 !important;
      /* Was 9999 !important — this unconditional rule silently overrode the
         non-!important z-index:99999 set elsewhere (beatshouse-plugin.php,
         this same file's own base rule), which is what the nav's own CSS
         intended. At 9999 the topnav's stacking context sat BELOW several
         page overlays (lead-magnet modal 10018, other modals up to 10060),
         so anything rendered inside the nav — including the Browse dropdown
         popover, whose own z-index:100000 is meaningless once trapped in a
         lower-z-index ancestor context — got visually and functionally
         covered by those overlays. Nav needs to sit above all "modal-tier"
         overlays but below true fullscreen views (#bh-fp at 100001, generic
         modals at 1000000), which is what 99999 (used elsewhere) achieves;
         matching that value here instead of a separate 4-nines constant. */
      z-index:99999 !important;
      background:rgba(4,4,6,.98) !important;
      border-bottom:1px solid rgba(34,182,255,0.1) !important;
      padding:env(safe-area-inset-top,0px) 0 0 0 !important;
    }

.bh-topnav__bar{
      display:flex !important;
      align-items:center !important;
      justify-content:center !important;
      gap:0 !important;
      padding:0 !important;
      height:46px !important;
      backdrop-filter:none !important;
      -webkit-backdrop-filter:none !important;
      background:transparent !important;
      border:0 !important;
      box-shadow:none !important;
    }

.bh-topnav__bar::before{ display:none !important; }

.bh-topnav .bh-dock-item{
      position:relative !important;
      display:inline-flex !important;
      flex-direction:column !important;
      align-items:center !important;
      justify-content:center !important;
      flex:1 1 0 !important;
      /* Override width:auto from earlier blocks — full flex area must be tappable */
      width:auto !important;
      max-width:none !important;
      height:46px !important;
      min-height:44px !important;
      min-width:0 !important;
      padding:0 !important;
      border:0 !important;
      border-radius:0 !important;
      background:transparent !important;
      color:rgba(255,255,255,.38) !important;
      font:700 9px/1 'DM Mono','Space Mono',monospace !important;
      letter-spacing:.16em !important;
      text-transform:uppercase !important;
      cursor:pointer !important;
      transition:color .18s ease !important;
      box-shadow:none !important;
      -webkit-tap-highlight-color:transparent !important;
      touch-action:manipulation !important;
      /* Expand touch area to full element bounds */
      -webkit-user-select:none !important;
      user-select:none !important;
      isolation:isolate !important;
    }

.bh-topnav .bh-dock-item::before{
      content:'' !important;
      position:absolute !important;
      inset:0 !important;
      z-index:2 !important;
      pointer-events:auto !important;
      cursor:pointer !important;
    }

.bh-topnav .bh-dock-item > *{
      position:relative !important;
      z-index:1 !important;
      pointer-events:none !important;
    }

.bh-topnav .bh-dock-item::after{
      content:'' !important;
      position:absolute !important;
      bottom:0 !important;
      left:20% !important;
      right:20% !important;
      height:2px !important;
      background:#22B6FF !important;
      transform:scaleX(0) !important;
      transition:transform .2s cubic-bezier(.4,0,.2,1) !important;
      pointer-events:none !important;
      z-index:3 !important;
    }

.bh-topnav .bh-dock-item.active{
      color:#fff !important;
      background:transparent !important;
    }

.bh-topnav .bh-dock-item.active::after{
      transform:scaleX(1) !important;
    }

.bh-topnav .bh-dock-item:hover:not(.active){
      color:rgba(255,255,255,.65) !important;
      background:rgba(255,255,255,.03) !important;
    }

.bh-topnav .bh-dock-item__label{
      font:700 9px/1 'DM Mono','Space Mono',monospace !important;
      letter-spacing:.14em !important;
      text-transform:uppercase !important;
      display:block !important;
      pointer-events:auto !important;
    }

.bh-topnav .bh-dock-item--menu{
      flex:0 0 52px !important;
      width:52px !important;
      max-width:52px !important;
      min-width:52px !important;
      padding:0 !important;
      border-right:1px solid rgba(34,182,255,0.1) !important;
    }

.bh-topnav .bh-dock-item--menu::after{ display:none !important; }

.bh-topnav .bh-dock-item--menu.active,
    .bh-topnav .bh-dock-item--menu.is-menu-open{
      color:#22B6FF !important;
      background:rgba(34,182,255,0.07) !important;
    }

.bh-topnav .bh-brand-label{
      font:800 11px/1 'Syne',system-ui,sans-serif !important;
      letter-spacing:.22em !important;
      color:#22B6FF !important;
      text-transform:uppercase !important;
      display:block !important;
      pointer-events:none !important;
    }

.bh-topnav .bh-dock-badge{
      position:absolute !important;
      top:8px !important;
      right:calc(50% - 14px) !important;
      min-width:14px !important;
      height:14px !important;
      padding:0 3px !important;
      border-radius:7px !important;
      background:#22B6FF !important;
      color:#fff !important;
      font:700 8px/14px 'DM Mono',monospace !important;
      text-align:center !important;
      pointer-events:none !important;
    }

.bh-topnav .bh-dock-badge.is-empty{
      display:none !important;
    }

.bh-topnav .bh-dock-menu-stroke{
      stroke:rgba(255,255,255,.55) !important;
    }

.bh-topnav .bh-dock-item--menu:hover .bh-dock-menu-stroke,
    .bh-topnav .bh-dock-item--menu.is-menu-open .bh-dock-menu-stroke{
      stroke:#22B6FF !important;
    }

@media(max-width:400px) {
.bh-topnav__bar{ height:42px !important; }
.bh-topnav .bh-dock-item{ height:42px !important; }
.bh-topnav .bh-dock-item__label{ font-size:8px !important; letter-spacing:.1em !important; }
.bh-topnav .bh-dock-item--menu{ flex:0 0 46px !important; width:46px !important; min-width:46px !important; max-width:46px !important; }
}

.bh-slide-backdrop{
      position:fixed !important;
      inset:0 !important;
      z-index:9998 !important;
      background:rgba(0,0,0,.72) !important;
      backdrop-filter:blur(4px) !important;
      -webkit-backdrop-filter:blur(4px) !important;
      opacity:0 !important;
      pointer-events:none !important;
      transition:opacity .24s ease !important;
    }

.bh-slide-backdrop.is-open{
      opacity:1 !important;
      pointer-events:auto !important;
    }

.bh-slide-menu{
      position:fixed !important;
      inset:0 !important;
      top:calc(54px + env(safe-area-inset-top,0px)) !important;
      left:0 !important;right:0 !important;bottom:0 !important;
      width:100% !important;max-width:none !important;
      z-index:10000 !important;
      display:flex !important;
      flex-direction:column !important;
      background:rgba(8,7,14,.98) !important;
      border-top:1px solid rgba(34,182,255,0.1) !important;
      border-right:0 !important;
      box-shadow:none !important;
      transform:translateX(100%) !important;
      transition:transform .34s cubic-bezier(.2,.8,.2,1), opacity .2s ease !important;
      overflow-y:auto !important;overflow-x:hidden !important;
      overscroll-behavior:contain !important;
      opacity:0 !important;pointer-events:none !important;
    }

.bh-slide-menu.is-open{
      transform:translateX(0) !important;
      opacity:1 !important;pointer-events:auto !important;
    }

.bh-slide-menu__head{
      display:flex !important;
      align-items:center !important;
      gap:12px !important;
      padding:16px 18px !important;
      border-bottom:1px solid rgba(255,255,255,.06) !important;
      background:transparent !important;
      min-height:64px !important;
      flex-shrink:0 !important;
      margin-top:0 !important;
    }

.bh-slide-menu__avatar{
      width:38px !important;
      height:38px !important;
      border-radius:6px !important;
      flex-shrink:0 !important;
      box-shadow:0 0 0 1px rgba(34,182,255,0.25) !important;
      object-fit:cover !important;
    }

.bh-slide-menu__name{
      font:700 13px/1.2 'Syne',system-ui,sans-serif !important;
      color:#f4f4f5 !important;
      letter-spacing:.01em !important;
      margin:0 !important;
    }

.bh-slide-menu__role{
      font:600 8px/1 'DM Mono',monospace !important;
      letter-spacing:.2em !important;
      text-transform:uppercase !important;
      color:rgba(255,255,255,.3) !important;
      margin:4px 0 0 !important;
    }

.bh-slide-menu__items{
      flex:1 !important;
      overflow-y:auto !important;
      overscroll-behavior:contain !important;
      padding:10px 10px 24px !important;
      scrollbar-width:none !important;
      -ms-overflow-style:none !important;
    }

.bh-slide-menu__items::-webkit-scrollbar{ display:none !important; }

.bh-slide-menu__item{
      display:flex !important;
      align-items:center !important;
      gap:11px !important;
      width:100% !important;
      padding:10px 12px !important;
      border:0 !important;
      border-radius:6px !important;
      background:transparent !important;
      color:rgba(255,255,255,.55) !important;
      font:500 12px/1 'DM Mono',monospace !important;
      letter-spacing:.08em !important;
      text-transform:uppercase !important;
      text-align:left !important;
      cursor:pointer !important;
      text-decoration:none !important;
      transition:color .15s ease, background .15s ease !important;
      -webkit-tap-highlight-color:transparent !important;
      touch-action:manipulation !important;
      margin-bottom:1px !important;
    }

.bh-slide-menu__item i{
      font-size:13px !important;
      width:16px !important;
      text-align:center !important;
      color:rgba(255,255,255,.22) !important;
      flex-shrink:0 !important;
      transition:color .15s ease !important;
    }

.bh-slide-menu__item span{
      font:500 12px/1 'DM Mono',monospace !important;
      letter-spacing:.08em !important;
      text-transform:uppercase !important;
    }

@media(hover:hover) {
.bh-slide-menu__item:hover{
        color:rgba(255,255,255,.9) !important;
        background:rgba(255,255,255,.05) !important;
      }
.bh-slide-menu__item:hover i{ color:rgba(255,255,255,.55) !important; }
}

.bh-slide-menu__item:active{
      background:rgba(255,255,255,.08) !important;
    }

.bh-slide-menu__item::before{ display:none !important; }

.bh-slide-menu__item--primary{
      color:#22B6FF !important;
      background:rgba(34,182,255,0.1) !important;
      box-shadow:inset 0 0 0 1px rgba(34,182,255,0.2) !important;
    }

.bh-slide-menu__item--primary i{ color:#22B6FF !important; }

@media(hover:hover) {
.bh-slide-menu__item--primary:hover{
        background:rgba(34,182,255,.16) !important;
        color:#22B6FF !important;
      }
}

.bh-slide-menu__item--admin{
      color:rgba(255,255,255,.38) !important;
    }

@media(hover:hover) {
.bh-slide-menu__item--admin:hover{
        color:rgba(255,255,255,.75) !important;
        background:rgba(255,255,255,.04) !important;
      }
}

.bh-slide-menu__item--danger{
      color:rgba(239,68,68,.7) !important;
    }

.bh-slide-menu__item--danger i{ color:rgba(239,68,68,.5) !important; }

@media(hover:hover) {
.bh-slide-menu__item--danger:hover{
        color:#ef4444 !important;
        background:rgba(239,68,68,.07) !important;
      }
}

.bh-slide-menu__sep{
      height:1px !important;
      background:rgba(255,255,255,.06) !important;
      margin:8px 12px !important;
      border:0 !important;
      position:relative !important;
    }

.bh-slide-menu__sep[data-label]::before{
      content:attr(data-label) !important;
      position:absolute !important;
      top:50% !important;
      left:0 !important;
      transform:translateY(-50%) !important;
      background:#060608 !important;
      padding-right:8px !important;
      font:600 8px/1 'DM Mono',monospace !important;
      letter-spacing:.2em !important;
      text-transform:uppercase !important;
      color:rgba(255,255,255,.22) !important;
    }

.bh-slide-menu__badge{
      margin-left:auto !important;
      background:rgba(34,182,255,0.18) !important;
      color:#22B6FF !important;
      border-radius:4px !important;
      padding:2px 6px !important;
      font:700 9px/1.4 'DM Mono',monospace !important;
      letter-spacing:.05em !important;
      min-width:18px !important;
      text-align:center !important;
    }

.bh-topnav .bh-dock-item--menu{
      flex:0 0 40px !important;
      width:40px !important;
      min-width:40px !important;
      max-width:40px !important;
      height:40px !important;
      padding:0 !important;
      border-radius:8px !important;
      border:1px solid transparent !important;
      border-right:0 !important;
      background:transparent !important;
      box-shadow:none !important;
      display:inline-flex !important;
      align-items:center !important;
      justify-content:center !important;
      transition:border-color .18s ease, background .18s ease, transform .12s ease !important;
    }

@media(hover:hover) {
.bh-topnav .bh-dock-item--menu:hover{
        border-color:rgba(255,255,255,.12) !important;
        background:rgba(255,255,255,.06) !important;
      }
}

.bh-topnav .bh-dock-item--menu:active{ transform:scale(.9) !important; }

.bh-topnav .bh-dock-item--menu.is-menu-open{
      background:rgba(34,182,255,0.12) !important;
      border-color:rgba(34,182,255,0.3) !important;
    }

.bh-topnav .bh-dock-menu-stroke{
      color:rgba(255,255,255,.55) !important;
      transition:color .18s ease, stroke-dashoffset .3s ease !important;
    }

@media(hover:hover) {
.bh-topnav .bh-dock-item--menu:hover .bh-dock-menu-stroke{
        color:rgba(255,255,255,.9) !important;
      }
}

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-dock-menu-stroke{
      color:#22B6FF !important;
    }

.bh-topnav .bh-dock-menu-icon{
      transition:transform .28s cubic-bezier(.6,0,.4,1) !important;
      overflow:visible !important;
    }

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-dock-menu-stroke--top{
      transform:translateY(5px) rotate(45deg) !important;
      transform-origin:center !important;
      color:#22B6FF !important;
    }

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-dock-menu-stroke--bot{
      transform:translateY(-5px) rotate(-45deg) !important;
      transform-origin:center !important;
      color:#22B6FF !important;
    }

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-dock-menu-stroke--mid{
      opacity:0 !important;
      transform:scaleX(0) !important;
      transform-origin:left center !important;
    }

@media(max-width:400px) {
.bh-topnav .bh-dock-item--menu{
        flex:0 0 36px !important;
        width:36px !important;
        min-width:36px !important;
        max-width:36px !important;
      }
}

.bh-topnav .bh-dock-item--menu .bh-menu-dots{opacity:1 !important;transform:rotate(0deg) scale(1) !important;}

.bh-topnav .bh-dock-item--menu .bh-menu-x{opacity:0 !important;transform:scale(.6) rotate(-45deg) !important;}

@media(hover:hover) {
.bh-topnav .bh-dock-item--menu:not(.is-menu-open):hover .bh-menu-dots{transform:rotate(45deg) scale(1.08) !important;}
}

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-menu-dots{opacity:0 !important;transform:rotate(45deg) scale(.5) !important;}

.bh-topnav .bh-dock-item--menu.is-menu-open .bh-menu-x{opacity:1 !important;transform:scale(1) rotate(0deg) !important;color:#22B6FF !important;}

.bh-home-v5 .bh-home-embed-stage,
    .bh-home-v5 .bh-home-embed-section,
    .bh-home-v5 #bh-home-app-stage,
    .bh-home-v5 #bh-app-main-player,
    .bh-home-v5 .bhc-pane,
    .bh-home-v5 .bh-slide-menu,
    .bh-home-v5 .bh-slide-backdrop,
    .bh-home-v5 .bh-home-stats,
    .bh-home-v5 .bh-home-featured,
    .bh-home-v5 .bh-levels-wrapper,
    .bh-home-v5 .bh-home-yt-section,
    .bh-home-v5 .bh-home-foryou-feed,
    .bh-home-v5 .bh-home-plans-section,
    .bh-home-v5 .bh-home-community-section{grid-column:1/-1 !important;grid-row:auto !important;}

.bh-topnav.is-scrolled .bh-topnav__bar {
  background: rgba(0,0,0,.95);
  border-bottom-color: rgba(34,182,255,.10);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.04),
    0 8px 40px rgba(0, 0, 0, 0.65),
    0 2px 8px rgba(0, 0, 0, 0.4);
  transition:
    background 400ms cubic-bezier(0.32, 0.72, 0, 1),
    border-color 400ms cubic-bezier(0.32, 0.72, 0, 1),
    box-shadow 400ms cubic-bezier(0.32, 0.72, 0, 1);
}

@media (hover: none) {
.bh-home-v5 .bh-dock-item {
    min-width: 44px !important;
    min-height: 44px !important;
  }
}

.bh-home-v5 .bh-dock-nav,
.bh-topnav {
  padding-bottom: env(safe-area-inset-bottom, 0px);
}

/* ── Desktop: compact right-side drawer (≥701px) ──────────────────────────
   The base .bh-slide-menu (above, and a 2nd def ~L1662) is a full-page overlay
   (inset:0; width:100%). This menu has a single .bh-fullmenu-col, so on desktop
   the grid stayed 1 column and the right ~60% of the viewport rendered as an
   empty void (verified live: computed width 1440px, content crammed left).
   Constrain it to a ~400px right drawer on desktop; the .bh-slide-backdrop
   (position:fixed; inset:0) dims the page behind. Mobile (≤700px) keeps the
   full-screen menu, which is correct there. The #id.class selector (1-1-0) plus
   end-of-file source order beats every base `.bh-slide-menu !important` rule
   without touching the concurrently-edited plugin PHP. Reversible: delete this
   block to restore the full-page menu. */
@media (min-width:701px){
  #bh-slide-menu.bh-slide-menu{
    top:54px !important;
    right:0 !important;
    bottom:0 !important;
    left:auto !important;
    width:min(400px,92vw) !important;
    max-width:400px !important;
    border-left:1px solid rgba(34,182,255,.14) !important;
    box-shadow:-30px 0 80px rgba(0,0,0,.55) !important;
  }
}
