/* Mobile navigation + hero polish */
body{
  background:
    radial-gradient(circle at 50% 10%,rgba(26,49,91,.72) 0,rgba(8,17,32,.48) 34%,transparent 58%),
    linear-gradient(180deg,#010204 0,#030812 12%,#07101f 30%,#050a12 100%);
}
.music-first{
  position:relative;
  background:linear-gradient(180deg,rgba(0,0,0,.56) 0,rgba(2,7,15,.34) 42%,rgba(7,16,31,0) 100%);
}

/* Keep the functional BeatStars player as high as possible. The large site search follows it. */
.music-first > .wrap{display:flex;flex-direction:column}
.music-first-intro{order:1}
.player-shell{order:2}
.hero-store-search{order:3;margin-top:16px!important;margin-bottom:4px!important;width:min(760px,100%)}
.after-player{order:4}
.brand-breath{order:5}

/* Rows below the hero select/load a beat; they do not directly start playback. */
.track-button .play,
.catalog-row .catalog-play,
.global-result .global-result-play{
  font-size:0!important;
}
.track-button .play::before,
.catalog-row .catalog-play::before,
.global-result .global-result-play::before{
  content:'›';
  font-size:24px;
  line-height:1;
  font-weight:700;
}

@media(max-width:860px){
  .navin{
    min-height:58px;
    flex-wrap:nowrap;
    gap:5px;
    padding:6px 0;
  }
  .brand{gap:0;flex:0 0 auto}
  .brand > span{display:none}
  .mini-logo{width:36px;height:36px}
  .nav .brand-logo-shell{width:40px!important;height:36px!important}
  .links{
    order:initial;
    flex:1 1 auto;
    width:auto;
    min-width:0;
    gap:3px;
    overflow:hidden;
    padding:0;
  }
  .links a{padding:7px 5px;font-size:10px;white-space:nowrap}
  .links a[href="#store"],
  .links a[href="#collabs"],
  .links a[href="releases.html"],
  .links a[href="#contact"]{display:none}
  .nav-actions{flex:0 0 auto;margin-left:0!important;gap:4px!important}
  .nav-icon{height:36px!important}
  .nav-search{width:36px!important}
  .nav-store-text{min-width:58px!important;width:auto!important;padding:0 6px!important;font-size:8px!important;letter-spacing:.05em!important}
}

@media(max-width:390px){
  .wrap{width:min(1180px,94vw)}
  .nav .brand-logo-shell{width:36px!important;height:34px!important}
  .links{gap:2px}
  .links a{padding:7px 4px;font-size:9px}
  .nav-search{width:34px!important}
  .nav-icon{height:34px!important}
  .nav-store-text{min-width:52px!important;padding:0 4px!important;font-size:7.5px!important}
}