/* =========================================================
   STEVE BOSTON ACCESS — PHASE 3F.1
   Unified site navigation
   ========================================================= */
:root{
  --agn-bg:#09090a;
  --agn-panel:#111113;
  --agn-line:#27272a;
  --agn-text:#f4f4f5;
  --agn-muted:#9c9ca3;
  --agn-gold:#c9a84c;
  --agn-red:#9a1e1e;
}
body.access-global-nav-page > header.site-header,
body.access-global-nav-page > header.access-topbar,
body.access-global-nav-page > header.community-topbar,
body.access-global-nav-page > header.notify-top,
body.access-global-nav-page > nav:not(.access-account-nav),
body.access-global-nav-page > .mobile-nav{
  display:none!important;
}

.access-global-nav{
  position:sticky;
  top:0;
  z-index:12000;
  width:100%;
  background:rgba(8,8,9,.97);
  border-bottom:1px solid var(--agn-line);
  color:var(--agn-text);
  font-family:'DM Sans',Arial,sans-serif;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.access-global-nav *{box-sizing:border-box}
.access-global-nav a{text-decoration:none}
.access-global-nav-inner{
  min-height:72px;
  width:min(1240px,calc(100% - 32px));
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:24px;
}
.access-global-brand{
  display:flex;
  flex-direction:column;
  flex:0 0 auto;
  color:#fff;
  font-family:'Bebas Neue',Impact,sans-serif;
  font-size:28px;
  line-height:.82;
  letter-spacing:.045em;
}
.access-global-brand span{color:var(--agn-gold)}
.access-global-brand small{
  margin-top:6px;
  color:#8e8e94;
  font-family:'Space Mono',monospace;
  font-size:8px;
  letter-spacing:.36em;
}
.access-global-links{
  display:flex;
  align-items:center;
  gap:4px;
  margin-left:14px;
}
.access-global-link,
.access-global-more{
  position:relative;
  appearance:none;
  border:0;
  background:none;
  color:#c9c9ce;
  padding:12px 13px;
  font:700 10px 'Space Mono',monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
}
.access-global-link:hover,.access-global-more:hover{color:#fff}
.access-global-link.active{color:var(--agn-gold)}
.access-global-link.active:after{
  content:"";
  position:absolute;
  left:13px;right:13px;bottom:5px;
  height:2px;background:var(--agn-gold);
}
.access-global-spacer{flex:1}
.access-global-member{
  display:flex;
  align-items:center;
  gap:5px;
}
.access-global-notifications{
  position:relative;
}
.access-global-count{
  position:absolute;
  right:3px;
  top:1px;
  min-width:17px;
  height:17px;
  padding:0 4px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#b51f25;
  color:#fff;
  font:700 8px 'Space Mono',monospace;
  box-shadow:0 0 0 2px var(--agn-bg);
}
.access-global-member-cta{
  border:1px solid #665521;
  color:var(--agn-gold);
  padding:10px 13px;
  font:700 9px 'Space Mono',monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.access-global-member-cta.primary{
  background:var(--agn-gold);
  color:#111;
  border-color:var(--agn-gold);
}
.access-global-menu-wrap{position:relative}
.access-global-more-panel{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  min-width:220px;
  background:var(--agn-panel);
  border:1px solid var(--agn-line);
  box-shadow:0 18px 48px rgba(0,0,0,.3);
  padding:7px;
  display:none;
}
.access-global-more-panel.open{display:block}
.access-global-more-panel a{
  display:block;
  color:#d7d7db;
  padding:11px 12px;
  font:700 9px 'Space Mono',monospace;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.access-global-more-panel a:hover{background:#19191c;color:#fff}
.access-global-more-panel small{
  display:block;
  color:#73737a;
  margin-top:3px;
  font:500 10px 'DM Sans',Arial,sans-serif;
  letter-spacing:0;
  text-transform:none;
}
.access-global-burger{
  display:none;
  width:43px;height:43px;
  border:1px solid #353539;
  background:#0d0d0f;
  color:#fff;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.access-global-burger span,
.access-global-burger span:before,
.access-global-burger span:after{
  display:block;width:18px;height:2px;background:currentColor;content:"";position:relative
}
.access-global-burger span:before{position:absolute;top:-6px}
.access-global-burger span:after{position:absolute;top:6px}
.access-global-mobile{
  display:none;
  border-top:1px solid var(--agn-line);
  background:#0b0b0c;
  padding:12px 16px 20px;
}
.access-global-mobile.open{display:block}
.access-global-mobile-grid{
  width:min(680px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.access-global-mobile a,
.access-global-mobile button{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border:1px solid #29292d;
  background:#111113;
  color:#e7e7e9;
  padding:11px 13px;
  font:700 10px 'Space Mono',monospace;
  letter-spacing:.07em;
  text-transform:uppercase;
  text-align:left;
}
.access-global-mobile a.active{border-color:var(--agn-gold);color:var(--agn-gold)}
.access-global-mobile .wide{grid-column:1/-1}
.access-global-mobile .primary{background:var(--agn-gold);border-color:var(--agn-gold);color:#111}
.access-global-mobile-section{
  grid-column:1/-1;
  color:#707078;
  padding:10px 2px 0;
  font:700 8px 'Space Mono',monospace;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.access-global-signout{
  cursor:pointer;
}
@media(max-width:960px){
  .access-global-links{gap:0;margin-left:2px}
  .access-global-link,.access-global-more{padding-left:9px;padding-right:9px;font-size:9px}
  .access-global-member .access-global-link{display:none}
}
@media(max-width:760px){
  .access-global-nav-inner{min-height:64px;width:calc(100% - 24px);gap:12px}
  .access-global-brand{font-size:24px}
  .access-global-brand small{font-size:7px;margin-top:5px}
  .access-global-links,.access-global-member{display:none}
  .access-global-spacer{display:block}
  .access-global-burger{display:flex}
}
@media(max-width:420px){
  .access-global-mobile-grid{grid-template-columns:1fr}
  .access-global-mobile .wide,.access-global-mobile-section{grid-column:1}
}

/* 3F.1A — authenticated nav visibility repair */
.access-global-nav [hidden]{
  display:none!important;
}
.access-global-signout-desktop{
  appearance:none;
  border:1px solid #3a3a3f;
  background:transparent;
  color:#d7d7db;
  padding:10px 12px;
  font:700 9px 'Space Mono',monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
}
.access-global-signout-desktop:hover{
  border-color:#666;
  color:#fff;
}
@media(max-width:960px) and (min-width:761px){
  .access-global-signout-desktop{
    padding:9px 10px;
    font-size:8px;
  }
}


/* =========================================================
   VERSION 2.0BG — HOMEPAGE CAROUSEL OVERLAY
   The player floats OVER the existing global nav.
   It does not consume flex/grid space and does not resize
   the brand, links, member controls, hero, or any other site UI.
   ========================================================= */
.access-global-nav-inner{position:relative}

/* Default desktop/landscape position:
   after MORE and before MY PROFILE / MY ACCESS. */
.access-home-carousel-slot{
  position:absolute;
  z-index:20;
  top:8px;
  right:360px;
  width:245px;
  height:48px;
  display:block;
  pointer-events:none;
}
.access-home-carousel-live{
  position:absolute!important;
  inset:0!important;
  transform:none!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  border:1px solid rgba(201,168,76,.55)!important;
  border-radius:4px!important;
  overflow:hidden!important;
  background:#080808!important;
  box-shadow:0 8px 22px rgba(0,0,0,.42)!important;
  pointer-events:auto;
}
.access-home-carousel-live .hcl-stage{
  position:absolute!important;
  inset:0 auto 0 0!important;
  width:35%!important;
  height:100%!important;
  overflow:hidden!important;
  background:#070604!important;
}
.access-home-carousel-live .hcl-stage::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent 58%,#080808 100%);
  pointer-events:none;
}
.access-home-carousel-live .hcl-carousel-real-video{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  background:radial-gradient(circle at 50% 48%,#211704 0%,#0d0b07 48%,#050505 82%)!important;
}
.access-home-carousel-live .hcl-ui{
  position:absolute!important;
  inset:0 0 0 34%!important;
  padding:5px 7px 4px 8px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 34px!important;
  grid-template-rows:auto auto 1fr!important;
  column-gap:5px!important;
  align-content:center!important;
}
.access-home-carousel-live .hcl-kicker{display:none!important}
.access-home-carousel-live .hcl-title{
  grid-column:1!important;
  grid-row:1!important;
  margin:0!important;
  color:#fff!important;
  font-family:'Bebas Neue',Impact,sans-serif!important;
  font-size:15px!important;
  line-height:.82!important;
  letter-spacing:.02em!important;
  white-space:nowrap!important;
}
.access-home-carousel-live .hcl-title span{
  display:inline!important;
  margin-left:4px!important;
  color:var(--agn-gold)!important;
}
.access-home-carousel-live .hcl-live{
  grid-column:1!important;
  grid-row:2!important;
  display:flex!important;
  align-items:center!important;
  gap:4px!important;
  margin:3px 0 0!important;
  color:#d8d3c8!important;
  font:700 6px/1 'Space Mono',monospace!important;
  letter-spacing:.11em!important;
  white-space:nowrap!important;
}
.access-home-carousel-live .hcl-wave{
  display:flex!important;
  align-items:center!important;
  gap:1px!important;
  height:8px!important;
}
.access-home-carousel-live .hcl-wave i{
  display:block!important;
  width:1px!important;
  height:4px!important;
  background:var(--agn-gold)!important;
}
.access-home-carousel-live.is-playing .hcl-wave i{animation:hclWave .75s ease-in-out infinite alternate}
.access-home-carousel-live.is-playing .hcl-wave i:nth-child(2n){animation-delay:.18s}
.access-home-carousel-live.is-playing .hcl-wave i:nth-child(3n){animation-delay:.31s}
.access-home-carousel-live .hcl-controls{display:contents!important}
.access-home-carousel-live .hcl-play{
  grid-column:2!important;
  grid-row:1 / 4!important;
  align-self:center!important;
  justify-self:end!important;
  width:30px!important;
  height:30px!important;
  border-radius:50%!important;
  border:1px solid var(--agn-gold)!important;
  background:#111!important;
  color:var(--agn-gold)!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  cursor:pointer!important;
}
.access-home-carousel-live .hcl-play svg{width:12px!important;height:12px!important;fill:currentColor!important}
.access-home-carousel-live .hcl-play .pause-icon{display:none!important}
.access-home-carousel-live.is-playing .hcl-play .play-icon{display:none!important}
.access-home-carousel-live.is-playing .hcl-play .pause-icon{display:block!important}
.access-home-carousel-live .hcl-now{
  grid-column:1!important;
  grid-row:3!important;
  min-width:0!important;
  margin-top:2px!important;
}
.access-home-carousel-live .hcl-status{
  display:inline!important;
  margin:0 4px 0 0!important;
  color:var(--agn-gold)!important;
  font:700 5px/1 'Space Mono',monospace!important;
  letter-spacing:.07em!important;
}
.access-home-carousel-live .hcl-song{
  display:inline!important;
  color:#fff!important;
  font:700 7px/1 'DM Sans',Arial,sans-serif!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.access-home-carousel-live .hcl-artist,
.access-home-carousel-live .hcl-foot{display:none!important}
.access-home-carousel-live .hcl-lights{position:absolute;inset:0;pointer-events:none}

/* Slightly tighter desktop widths. Still overlays only. */
@media(max-width:1180px) and (min-width:761px){
  .access-home-carousel-slot{
    right:300px;
    width:260px;
  }
  .access-home-carousel-live .hcl-title{font-size:13px!important}
}

/* MOBILE:
   Float the player between STEVE BOSTON ACCESS and the hamburger.
   The existing nav remains its original 64px height and layout. */
@media(max-width:760px){
  .access-home-carousel-slot{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    top:6px!important;
    left:78px!important;
    right:53px!important;
    width:auto!important;
    height:52px!important;
    min-width:0!important;
  }
  .access-home-carousel-live{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
  .access-home-carousel-live .hcl-stage{width:31%!important}
  .access-home-carousel-live .hcl-ui{
    inset:0 0 0 30%!important;
    padding:4px 5px!important;
    grid-template-columns:minmax(0,1fr) 27px!important;
    column-gap:3px!important;
  }
  .access-home-carousel-live .hcl-title{
    font-size:clamp(9px,2.9vw,12px)!important;
    line-height:.80!important;
    white-space:normal!important;
  }
  .access-home-carousel-live .hcl-title span{
    display:block!important;
    margin-left:0!important;
  }
  .access-home-carousel-live .hcl-live{
    font-size:4.5px!important;
    letter-spacing:.06em!important;
    margin-top:2px!important;
  }
  .access-home-carousel-live .hcl-wave{display:none!important}
  .access-home-carousel-live .hcl-play{
    width:25px!important;
    height:25px!important;
  }
  .access-home-carousel-live .hcl-play svg{width:10px!important;height:10px!important}
  .access-home-carousel-live .hcl-status{font-size:4px!important}
  .access-home-carousel-live .hcl-song{font-size:5.5px!important}
}

/* Give the logo a few more pixels on wider phones without touching its size. */
@media(min-width:421px) and (max-width:760px){
  .access-home-carousel-slot{left:88px!important}
}

@media(max-width:360px){
  .access-home-carousel-slot{
    left:72px!important;
    right:49px!important;
  }
  .access-home-carousel-live .hcl-title{font-size:8.5px!important}
  .access-home-carousel-live .hcl-song{font-size:5px!important}
}


/* VERSION 2.0BH — DESKTOP ONLY COMPACT PLAYER.
   Mobile keeps the exact 2.0BG size/position that was approved. */
@media(min-width:1181px){
  .access-home-carousel-live .hcl-title{font-size:11px!important}
  .access-home-carousel-live .hcl-live{font-size:5px!important}
  .access-home-carousel-live .hcl-play{width:26px!important;height:26px!important}
  .access-home-carousel-live .hcl-play svg{width:10px!important;height:10px!important}
  .access-home-carousel-live .hcl-status{font-size:4px!important}
  .access-home-carousel-live .hcl-song{font-size:6px!important}
  .access-home-carousel-live .hcl-ui{
    grid-template-columns:minmax(0,1fr) 29px!important;
    padding:4px 6px!important;
  }
  .access-home-carousel-live .hcl-stage{width:32%!important}
}
@media(max-width:1180px) and (min-width:761px){
  .access-home-carousel-slot{
    right:305px!important;
    width:215px!important;
    height:46px!important;
    top:9px!important;
  }
  .access-home-carousel-live .hcl-title{font-size:10px!important}
  .access-home-carousel-live .hcl-play{width:24px!important;height:24px!important}
}


/* =========================================================
   VERSION 2.0BI — LANDSCAPE / DESKTOP HEADER PLAYER FIX
   Mobile <=760px stays exactly as approved in 2.0BH.
   ========================================================= */

/* Full desktop: compact enough to stay in the open space before account buttons. */
@media(min-width:1181px){
  .access-home-carousel-slot{
    top:9px!important;
    right:355px!important;
    width:190px!important;
    height:44px!important;
  }
  .access-home-carousel-live .hcl-stage{width:30%!important}
  .access-home-carousel-live .hcl-ui{
    inset:0 0 0 29%!important;
    padding:3px 5px!important;
    grid-template-columns:minmax(0,1fr) 25px!important;
    grid-template-rows:auto 1fr!important;
    column-gap:4px!important;
  }
  .access-home-carousel-live .hcl-title{
    grid-row:1!important;
    font-size:9px!important;
    line-height:.82!important;
    white-space:nowrap!important;
  }
  .access-home-carousel-live .hcl-live{
    display:none!important;
  }
  .access-home-carousel-live .hcl-play{
    grid-column:2!important;
    grid-row:1 / 3!important;
    width:22px!important;
    height:22px!important;
  }
  .access-home-carousel-live .hcl-play svg{width:9px!important;height:9px!important}
  .access-home-carousel-live .hcl-now{
    grid-column:1!important;
    grid-row:2!important;
    margin-top:1px!important;
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    column-gap:3px!important;
    align-items:center!important;
  }
  .access-home-carousel-live .hcl-status{
    grid-column:1!important;
    grid-row:1 / 3!important;
    font-size:3.7px!important;
    line-height:1.05!important;
    margin:0!important;
  }
  .access-home-carousel-live .hcl-song{
    grid-column:2!important;
    grid-row:1!important;
    display:block!important;
    font-size:5.6px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .access-home-carousel-live .hcl-artist{
    grid-column:2!important;
    grid-row:2!important;
    display:block!important;
    color:#a9a59d!important;
    font:500 4.8px/1.05 'DM Sans',Arial,sans-serif!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}

/* iPhone landscape / tablet-width desktop nav:
   Fit entirely between MORE and the account controls.
   In this narrow header state, prioritize actual Now Playing information
   over the promotional headline so no navigation buttons are covered. */
@media(min-width:761px) and (max-width:1180px){
  .access-home-carousel-slot{
    top:10px!important;
    right:292px!important;
    width:128px!important;
    height:42px!important;
  }
  .access-home-carousel-live .hcl-stage{
    width:31%!important;
  }
  .access-home-carousel-live .hcl-ui{
    inset:0 0 0 30%!important;
    padding:3px 4px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 22px!important;
    grid-template-rows:1fr!important;
    column-gap:3px!important;
    align-content:center!important;
  }
  .access-home-carousel-live .hcl-title,
  .access-home-carousel-live .hcl-live{
    display:none!important;
  }
  .access-home-carousel-live .hcl-controls{display:contents!important}
  .access-home-carousel-live .hcl-play{
    grid-column:2!important;
    grid-row:1!important;
    align-self:center!important;
    width:20px!important;
    height:20px!important;
  }
  .access-home-carousel-live .hcl-play svg{
    width:8px!important;
    height:8px!important;
  }
  .access-home-carousel-live .hcl-now{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
    margin:0!important;
    display:grid!important;
    grid-template-rows:auto auto auto!important;
    align-content:center!important;
    row-gap:1px!important;
  }
  .access-home-carousel-live .hcl-status{
    display:block!important;
    margin:0!important;
    color:var(--agn-gold)!important;
    font:700 3.7px/1 'Space Mono',monospace!important;
    letter-spacing:.04em!important;
    white-space:nowrap!important;
  }
  .access-home-carousel-live .hcl-song{
    display:block!important;
    color:#fff!important;
    font:700 5.6px/1.05 'DM Sans',Arial,sans-serif!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .access-home-carousel-live .hcl-artist{
    display:block!important;
    color:#aaa69d!important;
    font:500 4.7px/1.05 'DM Sans',Arial,sans-serif!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}

/* Slightly wider landscape devices can afford a little more room without
   touching navigation or account controls. */
@media(min-width:900px) and (max-width:1180px){
  .access-home-carousel-slot{
    right:305px!important;
    width:145px!important;
  }
}


/* =========================================================
   VERSION 2.0BJ — LANDSCAPE POSITION ONLY
   Shift Carousel right to fully clear MORE.
   No resizing. Mobile untouched.
   ========================================================= */
@media(min-width:1181px){
  .access-home-carousel-slot{
    right:330px!important;
  }
}
@media(min-width:900px) and (max-width:1180px){
  .access-home-carousel-slot{
    right:280px!important;
  }
}
@media(min-width:761px) and (max-width:899px){
  .access-home-carousel-slot{
    right:270px!important;
  }
}


/* =========================================================
   VERSION 2.0BV — DESKTOP VISUAL POLISH ONLY
   No mobile/tablet behavior or functionality changed.
   ========================================================= */

/* Give the Carousel player more room ONLY on full desktop. */
@media(min-width:1200px){
  .access-home-carousel-slot{
    width:330px!important;
    height:50px!important;
    right:320px!important;
  }
  .access-home-carousel-live .hcl-stage{
    width:29%!important;
  }
  .access-home-carousel-live .hcl-ui{
    inset:0 0 0 28%!important;
    grid-template-columns:minmax(0,1fr) 30px!important;
    padding:4px 7px!important;
    column-gap:6px!important;
  }
  .access-home-carousel-live .hcl-title{
    display:block!important;
    font-size:11px!important;
    line-height:.85!important;
    white-space:nowrap!important;
  }
  .access-home-carousel-live .hcl-title span{
    display:inline!important;
    margin-left:3px!important;
  }
  .access-home-carousel-live .hcl-live{
    display:flex!important;
    font-size:5px!important;
  }
  .access-home-carousel-live .hcl-now{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    column-gap:4px!important;
  }
  .access-home-carousel-live .hcl-song{
    font-size:6px!important;
  }
  .access-home-carousel-live .hcl-artist{
    display:block!important;
    font-size:5px!important;
  }
  .access-home-carousel-live .hcl-play{
    width:26px!important;
    height:26px!important;
  }
}

/* =========================================================
   NAVBAR COLLISION FIX — 2026-08-21
   Keep the existing visual language while reserving a distinct lane for
   the Carousel player and signed-in account controls.
   ========================================================= */
@media (min-width:1181px){
  .access-home-carousel-slot{
    right:405px!important;
    width:230px!important;
  }
  .access-global-member{
    position:relative;
    z-index:30;
    gap:7px;
  }
}

/* Compact desktop: keep every navigation action visible, but make the
   overlay narrower and reserve enough room for the member controls. */
@media (min-width:1041px) and (max-width:1180px){
  .access-home-carousel-slot{
    right:355px!important;
    width:170px!important;
  }
  .access-global-member{
    position:relative;
    z-index:30;
    gap:4px;
  }
  .access-global-member-cta,
  .access-global-signout-desktop{
    padding-left:9px;
    padding-right:9px;
  }
}

/* There is not enough horizontal room for links + player + authenticated
   controls in this band. Keep the navigation intact and suppress only the
   decorative mini-player; The Carousel remains available under More. */
@media (min-width:761px) and (max-width:1040px){
  .access-home-carousel-slot{
    display:none!important;
  }
  .access-global-member{
    position:relative;
    z-index:30;
  }
}