/* V97 mobile playback, featured hero framing and voice-search reliability */
@media(max-width:900px){
  /* The opening Shawn + Naya photograph is landscape artwork. Preserve both hosts
     instead of forcing it into the same portrait crop used by square covers. */
  .stage.featured-hero-stage{
    aspect-ratio:16/11!important;
    min-height:360px!important;
    max-height:520px!important;
    background:#08060b!important;
  }
  .stage.featured-hero-stage .stage-art{
    object-fit:contain!important;
    object-position:center center!important;
    background:linear-gradient(180deg,#09070d,#030205)!important;
  }
  .stage.featured-hero-stage .stage-bg{
    background-position:center center!important;
    filter:blur(22px) saturate(.9) brightness(.46)!important;
    transform:scale(1.18)!important;
  }
  .stage.featured-hero-stage .stage-badge{top:12px!important}
  .stage.featured-hero-stage .stage-actions{top:52px!important;right:8px!important}
  .stage.featured-hero-stage .visualizer{bottom:52px!important;height:92px!important}
  .stage.featured-hero-stage .title-panel{display:none!important}

  /* Keep the expanded dock genuinely interactive and above all app surfaces. */
  .bottom-player{pointer-events:auto!important;z-index:90!important}
  .bottom-player .bottom-controls,
  .bottom-player .bottom-controls button,
  #bottomPlay{pointer-events:auto!important;touch-action:manipulation!important}
  #bottomPlay{z-index:4!important;cursor:pointer!important}
  #bottomPlay:disabled{opacity:.78!important;pointer-events:auto!important}

  /* Voice control communicates permission state without breaking the row. */
  #voiceSearch.permission-needed{
    border-color:#ffd68a!important;
    box-shadow:0 0 0 2px rgba(255,214,138,.24),0 0 18px rgba(255,195,85,.32)!important;
  }
  #voiceSearch.listening{
    animation:hmcMicPulse 1.15s ease-in-out infinite!important;
  }
}
@keyframes hmcMicPulse{
  0%,100%{transform:scale(1);filter:brightness(1)}
  50%{transform:scale(1.045);filter:brightness(1.22)}
}
@media(max-width:390px){
  .stage.featured-hero-stage{min-height:325px!important;max-height:450px!important}
  .stage.featured-hero-stage .visualizer{bottom:44px!important;height:82px!important}
}
@media(prefers-reduced-motion:reduce){#voiceSearch.listening{animation:none!important}}


/* V132 — Hemasonics square artwork: centered, symmetrical mobile presentation */
@media(max-width:900px){
  .stage.featured-hero-stage.square-feature-art{
    aspect-ratio:1 / 1!important;
    min-height:0!important;
    max-height:none!important;
    width:100%!important;
    overflow:hidden!important;
    background:#050307!important;
  }
  .stage.featured-hero-stage.square-feature-art .stage-art{
    width:100%!important;
    height:100%!important;
    inset:0!important;
    object-fit:cover!important;
    object-position:50% 50%!important;
    transform:none!important;
    background:#050307!important;
  }
  .stage.featured-hero-stage.square-feature-art .stage-bg{
    display:none!important;
  }
  .stage.featured-hero-stage.square-feature-art .stage-badge{
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    max-width:calc(100% - 120px)!important;
    white-space:nowrap!important;
  }
}
@media(max-width:420px){
  .stage.featured-hero-stage.square-feature-art .stage-actions{
    right:6px!important;
    top:50px!important;
    transform:scale(.9)!important;
    transform-origin:top right!important;
  }
}