/* SENSIK final UX patch: trusted-device mobile header, honest generation progress, and cover waveform. */

/* On signed-in mobile layouts, use a true flexible brand column plus a compact profile column.
   Previous styles stretched the 42px avatar wrapper across the whole action grid, visually centering it. */
@media (max-width: 767.98px) {
  .snv-nav.has-profile {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 44px !important;
    align-items: center !important;
    gap: 10px !important;
    width: min(calc(100% - 24px), 680px) !important;
  }
  .snv-nav.has-profile .snv-brand {
    justify-self: start !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .snv-nav-actions.has-profile {
    justify-self: end !important;
    align-self: center !important;
    display: flex !important;
    width: 44px !important;
    min-width: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-content: flex-end !important;
    flex: 0 0 44px !important;
    gap: 0 !important;
  }
  .snv-nav-actions.has-profile > .snv-profile-menu {
    display: block !important;
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    margin: 0 !important;
    flex: 0 0 44px !important;
  }
  .snv-nav-actions.has-profile .snv-profile-trigger {
    display: grid !important;
    place-items: center !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
  }
  .snv-nav-actions.has-profile > .snv-premium-link,
  .snv-nav-actions.has-profile > .snv-btn-primary { display: none !important; }
  .snv-nav-actions.has-profile .snv-profile-dropdown { right: 0 !important; }
}

@media (max-width: 360px) {
  .snv-nav.has-profile { grid-template-columns: minmax(0, 1fr) 42px !important; gap: 7px !important; }
  .snv-nav-actions.has-profile,
  .snv-nav-actions.has-profile > .snv-profile-menu { width: 42px !important; min-width: 42px !important; max-width: 42px !important; flex-basis: 42px !important; }
  .snv-nav-actions.has-profile .snv-profile-trigger { width: 40px !important; min-width: 40px !important; height: 40px !important; min-height: 40px !important; }
}

/* Honest indeterminate progress for providers which do not expose numeric percentages. */
#studio-workspace .mgen-progress-overview:not(.is-success):not(.is-failed) .mgen-progress-track-main.is-indeterminate span {
  background: linear-gradient(90deg, #3be8d0 0%, #65e7ff 50%, #9b8bff 100%);
  box-shadow: 0 0 12px rgba(73, 245, 213, .25);
}
#studio-workspace .mgen-progress-overview:not(.is-success):not(.is-failed) .mgen-progress-count {
  max-width: min(46vw, 180px);
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Playlist now-playing indicator: replace the thumbnail play icon with a live wave. */
#studio-workspace .music-panel .li-thumb-play .play-overlay .snv-track-now-wave {
  position: absolute !important;
  left: 50% !important; top: 50% !important; right: auto !important; bottom: auto !important;
  width: 43px !important; height: 25px !important; inset: auto !important;
  transform: translate(-50%, -50%) !important; z-index: 5 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  pointer-events: none !important;
}
#studio-workspace .music-panel .li-thumb-play .play-overlay .snv-track-now-wave > span {
  display: block !important;
  flex: 0 0 3px !important;
  width: 3px !important;
  height: var(--snv-track-wave-height, 10px) !important;
  max-height: 26px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #edfffb !important;
  box-shadow: none !important;
  transform-origin: center !important;
  animation: sensikPlaylistNowWave .68s ease-in-out var(--snv-track-wave-delay, 0s) infinite alternate !important;
}
#studio-workspace .music-panel .li-thumb-play.is-now-playing .play-overlay i {
  opacity: 0 !important;
  visibility: hidden !important;
  transform: scale(.45) !important;
}
#studio-workspace .music-panel .li-thumb-play.is-now-playing .play-overlay .snv-track-now-wave {
  display: flex !important;
  opacity: 1 !important;
}
#studio-workspace .music-panel .list-item.is-now-playing {
  border-color: rgba(73, 245, 213, .52) !important;
  background: linear-gradient(100deg, rgba(15, 47, 50, .92), rgba(8, 22, 32, .9)) !important;
  box-shadow: inset 0 0 0 1px rgba(73, 245, 213, .06), 0 0 18px rgba(73, 245, 213, .055) !important;
}
@keyframes sensikPlaylistNowWave {
  0% { transform: scaleY(.34); filter: brightness(.88); opacity: .72; }
  45% { transform: scaleY(.78); filter: brightness(1.12); opacity: 1; }
  100% { transform: scaleY(1); filter: brightness(1.3); opacity: .92; }
}

#pricing .snv-plan-features { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 7px !important; width: 100% !important; min-width: 0 !important; }
#pricing .snv-plan-features .snv-plan-benefit { display: flex !important; width: 100% !important; }

/* SIMPLE NOW-PLAYING INDICATOR — exactly one compact waveform in the Play-icon position. */
#studio-workspace .music-panel .cf-card-waveform,
#studio-workspace .music-panel .cf-card-now-pill,
#studio-workspace .music-panel .cf-card-play-orb { display: none !important; }
#studio-workspace .music-panel .cf-card-play-overlay {
  position: absolute !important; inset: 0 !important; z-index: 5 !important;
  display: grid !important; place-items: center !important; pointer-events: none !important;
  background: none !important; border: 0 !important; box-shadow: none !important;
}
#studio-workspace .music-panel .cf-card-play-icon {
  display: grid !important; place-items: center !important;
  width: 34px !important; height: 34px !important; margin: 0 !important;
  border: 1px solid rgba(242,255,252,.32) !important; border-radius: 50% !important;
  color: #f3fffc !important; background: rgba(4,12,19,.46) !important;
  box-shadow: none !important; font-size: 15px !important;
  backdrop-filter: blur(2px) !important; -webkit-backdrop-filter: blur(2px) !important;
}
#studio-workspace .music-panel .cf-card-orb-wave {
  position: absolute !important; left: 50% !important; top: 50% !important;
  transform: translate(-50%,-50%) !important; display: none !important;
  align-items: center !important; justify-content: center !important; gap: 3px !important;
  width: 38px !important; height: 24px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important;
  border-radius: 0 !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
#studio-workspace .music-panel .cf-card-orb-wave > span {
  display: block !important; flex: 0 0 2.5px !important; width: 2.5px !important;
  max-height: 18px !important; height: var(--snv-wave-base-height, 10px) !important;
  border: 0 !important; border-radius: 999px !important; background: #edfffb !important;
  box-shadow: none !important; opacity: .95 !important; transform: scaleY(.35);
  transform-origin: center !important; will-change: transform, opacity;
}
#studio-workspace .music-panel .cf-card.is-playing .cf-card-play-icon { display: none !important; }
#studio-workspace .music-panel .cf-card.is-playing .cf-card-orb-wave { display: flex !important; }
#studio-workspace .music-panel .cf-card.is-paused .cf-card-play-icon { display: grid !important; }
#studio-workspace .music-panel .cf-card.is-paused .cf-card-orb-wave,
#studio-workspace .music-panel .cf-card.is-stopped .cf-card-orb-wave { display: none !important; }
#studio-workspace .music-panel .cf-card.is-playing .cf-card-orb-wave > span {
  animation: sensikOrbWaveFallback .58s ease-in-out var(--snv-track-wave-delay, 0s) infinite alternate !important;
}
#studio-workspace .music-panel .cf-card-orb-wave > span.is-audio-reactive,
#studio-workspace .music-panel .li-thumb-play .play-overlay .snv-track-now-wave > span.is-audio-reactive {
  animation: none !important; transform: scaleY(var(--snv-wave-scale, .42)) !important;
  transition: transform 55ms linear !important; filter: none !important; background: #effffb !important;
}
@keyframes sensikOrbWaveFallback {
  0% { transform: scaleY(.28); opacity: .78; }
  100% { transform: scaleY(.92); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  /* Keep a subtle live signal even when the OS requests reduced motion. */
  #studio-workspace .music-panel .cf-card.is-playing .cf-card-orb-wave > span:not(.is-audio-reactive),
  #studio-workspace .music-panel .li-thumb-play.is-now-playing .play-overlay .snv-track-now-wave > span:not(.is-audio-reactive) {
    animation-duration: 1.1s !important;
    animation-iteration-count: infinite !important;
  }
}

/* FINAL PLAYER LAYOUT: explicitly map every playlist element to its own grid area.
   This prevents the hidden equalizer column from affecting action/button alignment. */
#studio-workspace .music-panel .list-item {
  display: grid !important;
  box-sizing: border-box !important;
  grid-template-columns: 50px minmax(0, 1fr) max-content !important;
  grid-template-areas: "thumb info actions" !important;
  align-items: center !important;
  column-gap: 10px !important;
  row-gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 66px !important;
  padding: 8px 10px !important;
  margin: 0 0 7px !important;
  overflow: hidden !important;
}
#studio-workspace .music-panel .list-item > .li-thumb-play {
  grid-area: thumb !important;
  justify-self: start !important;
  align-self: center !important;
  display: block !important;
  position: relative !important;
  flex: 0 0 50px !important;
  width: 50px !important;
  min-width: 50px !important;
  height: 50px !important;
  min-height: 50px !important;
  aspect-ratio: 1 / 1 !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  overflow: hidden !important;
}
#studio-workspace .music-panel .list-item > .li-info-container {
  grid-area: info !important;
  align-self: center !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
}
#studio-workspace .music-panel .list-item .li-title-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}
#studio-workspace .music-panel .list-item .li-title {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  line-height: 1.35 !important;
}
#studio-workspace .music-panel .list-item .li-model-badge {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: 48% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#studio-workspace .music-panel .list-item .li-subtitle {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 4px 0 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  line-height: 1.35 !important;
}
#studio-workspace .music-panel .list-item > .li-equalizer { display: none !important; }
#studio-workspace .music-panel .list-item > .li-actions-right {
  grid-area: actions !important;
  justify-self: end !important;
  align-self: center !important;
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 5px !important;
  width: max-content !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
#studio-workspace .music-panel .list-item .li-icon-btn {
  flex: 0 0 29px !important;
  width: 29px !important;
  min-width: 29px !important;
  height: 29px !important;
  min-height: 29px !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
#studio-workspace .music-panel .li-thumb-play .play-overlay {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: none !important;
}
#studio-workspace .music-panel .li-thumb-play .play-overlay .snv-track-now-wave {
  width: 28px !important;
  height: 22px !important;
  gap: 2px !important;
  flex-wrap: nowrap !important;
  justify-content: center !important;
}
#studio-workspace .music-panel .li-thumb-play .play-overlay .snv-track-now-wave > span {
  flex: 0 0 2px !important;
  width: 2px !important;
  max-height: 19px !important;
  border-radius: 999px !important;
  will-change: transform, opacity;
}
@media (max-width: 760px) {
  #studio-workspace .music-panel .list-item {
    grid-template-columns: 42px minmax(0, 1fr) max-content !important;
    grid-template-areas: "thumb info actions" !important;
    column-gap: 7px !important;
    min-height: 58px !important;
    padding: 6px 7px !important;
  }
  #studio-workspace .music-panel .list-item > .li-thumb-play {
    flex-basis: 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    border-radius: 9px !important;
  }
  #studio-workspace .music-panel .list-item .li-title-row { gap: 4px !important; }
  #studio-workspace .music-panel .list-item .li-model-badge { max-width: 42% !important; font-size: 7px !important; padding: 3px 4px !important; }
  #studio-workspace .music-panel .list-item .li-subtitle { margin-top: 3px !important; font-size: 9px !important; }
  #studio-workspace .music-panel .list-item > .li-actions-right { gap: 3px !important; }
  #studio-workspace .music-panel .list-item .li-icon-btn {
    flex-basis: 25px !important; width: 25px !important; min-width: 25px !important;
    height: 26px !important; min-height: 26px !important; border-radius: 7px !important;
  }
}


/* GLOBAL AUDIO INDICATORS: centered thumbnail wave + live community waveform.
   A single playback lock in page.js ensures only one <audio> can sound at once. */
#studio-workspace .music-panel .li-thumb-play {
  position: relative !important;
  display: block !important;
  align-self: center !important;
  justify-self: center !important;
  overflow: hidden !important;
  padding: 0 !important;
  line-height: 0 !important;
}
#studio-workspace .music-panel .li-thumb-play .play-overlay {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
#studio-workspace .music-panel .li-thumb-play .play-overlay .snv-track-now-wave {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  inset: auto !important;
  transform: translate3d(-50%, -50%, 0) !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  pointer-events: none !important;
}
#studio-workspace .music-panel .li-thumb-play.is-now-playing .play-overlay .snv-track-now-wave {
  display: flex !important;
}
#studio-workspace .music-panel .li-thumb-play .play-overlay .snv-track-now-wave > span {
  align-self: center !important;
  flex: 0 0 2px !important;
  width: 2px !important;
  margin: 0 !important;
  transform-origin: center center !important;
}

/* Community timeline: bars pulse only for the card whose audio is actually playing. */
.snv-social-card .snv-waveform {
  align-items: center !important;
  justify-content: space-between !important;
  overflow: hidden !important;
  min-height: 34px !important;
}
.snv-social-card .snv-waveform [data-wave-bar] {
  align-self: center !important;
  flex: 1 1 2px !important;
  transform: scaleY(.72);
  transform-origin: center center !important;
  will-change: transform;
}
.snv-social-card.is-playing .snv-waveform [data-wave-bar] {
  animation: sensikCommunityLiveWave .56s ease-in-out infinite alternate !important;
}
.snv-social-card.is-playing .snv-waveform [data-wave-bar]:nth-child(7n + 1) { animation-delay: -.48s !important; }
.snv-social-card.is-playing .snv-waveform [data-wave-bar]:nth-child(7n + 2) { animation-delay: -.13s !important; }
.snv-social-card.is-playing .snv-waveform [data-wave-bar]:nth-child(7n + 3) { animation-delay: -.36s !important; }
.snv-social-card.is-playing .snv-waveform [data-wave-bar]:nth-child(7n + 4) { animation-delay: -.05s !important; }
.snv-social-card.is-playing .snv-waveform [data-wave-bar]:nth-child(7n + 5) { animation-delay: -.27s !important; }
.snv-social-card.is-playing .snv-waveform [data-wave-bar]:nth-child(7n + 6) { animation-delay: -.41s !important; }
.snv-social-card.is-playing .snv-waveform [data-wave-bar]:nth-child(7n) { animation-delay: -.19s !important; }
@keyframes sensikCommunityLiveWave {
  0% { transform: scaleY(.28); opacity: .72; filter: brightness(.88); }
  48% { transform: scaleY(.78); opacity: .96; filter: brightness(1.08); }
  100% { transform: scaleY(1.16); opacity: 1; filter: brightness(1.25); }
}
@media (prefers-reduced-motion: reduce) {
  .snv-social-card.is-playing .snv-waveform [data-wave-bar] { animation-duration: 1.05s !important; }
}

/* FINAL FIX: center the active thumbnail waveform in the full cover, and keep duration inline with title. */
#studio-workspace #musicFeedBox .list-item > .li-thumb-play .play-overlay {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 100% !important;
}
#studio-workspace #musicFeedBox .list-item > .li-thumb-play .play-overlay .snv-track-now-wave {
  position: absolute !important;
  inset: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  transform: none !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  pointer-events: none !important;
  box-sizing: border-box !important;
}
#studio-workspace #musicFeedBox .list-item > .li-thumb-play.is-now-playing .play-overlay .snv-track-now-wave {
  display: flex !important;
}
#studio-workspace #musicFeedBox .list-item .li-title-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
  min-width: 0 !important;
  width: 100% !important;
}
#studio-workspace #musicFeedBox .list-item .li-title-row > .li-title {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#studio-workspace #musicFeedBox .list-item .li-title-row > .li-thumb-time {
  position: static !important;
  inset: auto !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 2px 5px !important;
  border: 1px solid rgba(163, 255, 239, .14) !important;
  border-radius: 6px !important;
  background: rgba(255, 255, 255, .045) !important;
  color: #91aaa5 !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  box-shadow: none !important;
  transform: none !important;
}
#studio-workspace #musicFeedBox .list-item .li-title-row > .li-model-badge {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: 38% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
@media (max-width: 760px) {
  #studio-workspace #musicFeedBox .list-item .li-title-row { gap: 4px !important; }
  #studio-workspace #musicFeedBox .list-item .li-title-row > .li-thumb-time {
    padding: 2px 4px !important;
    font-size: 8px !important;
  }
  #studio-workspace #musicFeedBox .list-item .li-title-row > .li-model-badge { max-width: 32% !important; }
}


/* COMMUNITY COVER WAVE: one compact centered waveform replaces the Play glyph only during playback. */
.snv-social-art .snv-cover-play {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: grid !important;
  place-items: center !important;
  transform: translate(-50%, -50%) scale(.94) !important;
  overflow: visible !important;
}
.snv-social-art .snv-cover-play .snv-cover-now-wave {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 34px !important;
  height: 28px !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translate(-50%, -50%) !important;
  pointer-events: none !important;
  line-height: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.snv-social-art .snv-cover-play .snv-cover-now-wave > span {
  display: block !important;
  flex: 0 0 2px !important;
  width: 2px !important;
  height: var(--cover-wave-height, 8px) !important;
  min-height: 4px !important;
  border-radius: 999px !important;
  background: #eafffb !important;
  box-shadow: 0 0 6px rgba(73,245,213,.38) !important;
  transform: scaleY(.55);
  transform-origin: center center !important;
}
.snv-social-card.is-playing .snv-social-art .snv-cover-play {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  opacity: 1 !important;
  color: #effffb !important;
  background: rgba(5,15,18,.36) !important;
  border: 1px solid rgba(222,255,250,.28) !important;
  box-shadow: 0 3px 13px rgba(0,0,0,.25) !important;
  backdrop-filter: blur(4px);
  transform: translate(-50%, -50%) scale(1) !important;
}
.snv-social-card.is-playing .snv-social-art .snv-cover-play > i {
  display: none !important;
}
.snv-social-card.is-playing .snv-social-art .snv-cover-play .snv-cover-now-wave {
  display: flex !important;
}
.snv-social-card.is-playing .snv-social-art .snv-cover-play .snv-cover-now-wave > span {
  animation: sensikCommunityCoverWave .62s ease-in-out var(--cover-wave-delay, 0s) infinite alternate !important;
}
@keyframes sensikCommunityCoverWave {
  0% { transform: scaleY(.32); opacity: .72; }
  55% { transform: scaleY(.92); opacity: 1; }
  100% { transform: scaleY(.52); opacity: .86; }
}
@media (prefers-reduced-motion: reduce) {
  .snv-social-card.is-playing .snv-social-art .snv-cover-play .snv-cover-now-wave > span {
    animation-duration: 1.1s !important;
  }
}

/* SENSIK FIX — keep mode tabs and console actions in separate, non-overlapping groups. */
#studio-workspace .control-console > .master-tabs-container {
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:space-between !important;
  flex-wrap:nowrap !important;
  gap:10px !important;
  width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}
#studio-workspace .master-tabs-choice {
  display:flex !important;
  align-items:stretch !important;
  flex:1 1 auto !important;
  gap:7px !important;
  min-width:0 !important;
}
#studio-workspace .master-tabs-choice > .master-tab {
  flex:1 1 0 !important;
  width:auto !important;
  min-width:0 !important;
}
#studio-workspace .master-tabs-actions {
  display:flex !important;
  flex:0 0 auto !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex-wrap:nowrap !important;
  gap:8px !important;
  min-width:0 !important;
}
#studio-workspace .master-tabs-actions > button { flex:0 0 auto !important; }
@media (max-width: 760px) {
  #studio-workspace .control-console > .master-tabs-container { gap:7px !important; padding:5px !important; }
  #studio-workspace .master-tabs-choice { gap:5px !important; }
  #studio-workspace .master-tabs-actions { gap:5px !important; }
  #studio-workspace .studio-plan-toggle { min-width:40px !important; width:40px !important; padding:8px !important; }
  #studio-workspace .studio-plan-toggle span { display:none !important; }
}
@media (max-width: 420px) {
  #studio-workspace .control-console > .master-tabs-container { align-items:stretch !important; flex-wrap:wrap !important; }
  #studio-workspace .master-tabs-choice { flex:1 1 100% !important; width:100% !important; }
  #studio-workspace .master-tabs-actions { flex:1 1 100% !important; justify-content:flex-end !important; }
  #studio-workspace .studio-plan-toggle { width:auto !important; min-width:40px !important; }
}

/* In-console package chooser: visible access state and disabled rentals while one is active. */
.sensik-studio-plan-status {
  display:flex; align-items:flex-start; gap:9px; margin:0 auto 14px; padding:12px 13px;
  border:1px solid rgba(73,245,213,.2); border-radius:13px;
  background:linear-gradient(110deg,rgba(73,245,213,.075),rgba(91,173,255,.035));
  color:#b5cdca; font:600 11px/1.65 Inter,sans-serif; text-align:left;
}
.sensik-studio-plan-status > i { flex:0 0 auto; color:#61f0d7; margin-top:2px; font-size:14px; }
.sensik-studio-plan-status.is-rental-active { border-color:rgba(73,245,213,.42); background:linear-gradient(110deg,rgba(73,245,213,.13),rgba(91,173,255,.045)); }
.sensik-studio-plan-status.is-rental-active > i { color:#72f6b9; }
.sensik-studio-plan-status b { color:#eafffa; font-weight:900; }
.sensik-studio-plan-status-date { color:#61f0d7; font-weight:800; }
.sensik-studio-plan-status-note { display:inline-block; margin-top:3px; color:#93aaa8; }
.sensik-studio-plan-card.is-active {
  border-color:rgba(73,245,213,.78) !important;
  background:radial-gradient(ellipse at 100% 0,rgba(73,245,213,.13),transparent 55%),linear-gradient(145deg,rgba(17,49,46,.99),rgba(8,20,24,.99)) !important;
  box-shadow:0 0 0 1px rgba(73,245,213,.17),0 13px 34px rgba(0,0,0,.2) !important;
  cursor:default !important;
}
.sensik-studio-plan-card.is-unavailable,
.sensik-studio-plan-card:disabled {
  opacity:.58 !important; cursor:not-allowed !important; transform:none !important;
  filter:saturate(.6);
}
.sensik-studio-plan-ribbon.is-active-ribbon { background:linear-gradient(110deg,#7cf9c5,#3cdbbc) !important; }
.sensik-studio-plan-card .sensik-studio-plan-cta.is-active-cta {
  color:#042923 !important; background:linear-gradient(110deg,#72f6dc,#38d8c8) !important;
  border:0 !important; border-radius:8px; padding:8px 9px; justify-content:center;
}



/* SENSIK floating studio shortcut — reachable from any scroll position. */
.sensik-studio-fab {
  position: fixed !important;
  right: max(18px, env(safe-area-inset-right, 0px) + 14px) !important;
  bottom: max(20px, env(safe-area-inset-bottom, 0px) + 16px) !important;
  z-index: 99980 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 58px !important;
  padding: 7px 18px 7px 8px !important;
  border: 1px solid rgba(111, 255, 229, .58) !important;
  border-radius: 999px !important;
  color: #edfffc !important;
  background: linear-gradient(128deg, rgba(9, 34, 37, .97), rgba(8, 18, 28, .97)) !important;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .38), 0 0 0 1px rgba(76, 245, 216, .1), 0 0 28px rgba(58, 228, 203, .16) !important;
  backdrop-filter: blur(16px) saturate(1.18) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.18) !important;
  font: 800 12px/1 Inter, sans-serif !important;
  letter-spacing: .01em !important;
  cursor: pointer !important;
  isolation: isolate !important;
  overflow: visible !important;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, opacity .18s ease !important;
  -webkit-tap-highlight-color: transparent !important;
}
.sensik-studio-fab:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(127, 255, 231, .9) !important;
  box-shadow: 0 16px 38px rgba(0, 0, 0, .42), 0 0 0 1px rgba(76, 245, 216, .18), 0 0 34px rgba(58, 228, 203, .24) !important;
}
.sensik-studio-fab:active { transform: translateY(0) scale(.98) !important; }
.sensik-studio-fab:focus-visible { outline: 3px solid rgba(104, 255, 229, .78) !important; outline-offset: 4px !important; }
.sensik-studio-fab-icon {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 42px !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  color: #062b27 !important;
  background: linear-gradient(140deg, #72ffdd, #38d8ce 60%, #7dc4ff) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.65), 0 4px 18px rgba(58,228,203,.22) !important;
  font-size: 19px !important;
}
.sensik-studio-fab-label { position: relative !important; z-index: 1 !important; white-space: nowrap !important; }
.sensik-studio-fab-pulse {
  position: absolute !important;
  z-index: 0 !important;
  left: 7px !important;
  top: 6px !important;
  width: 44px !important;
  height: 44px !important;
  border: 1px solid rgba(103, 255, 225, .28) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  animation: sensikStudioShortcutPulse 2.8s ease-out infinite !important;
}
@keyframes sensikStudioShortcutPulse {
  0% { transform: scale(.78); opacity: .62; }
  75%, 100% { transform: scale(1.42); opacity: 0; }
}
/* The shortcut should not float over the console after it has opened. */
body.sensik-studio-focus-active #sensikStudioShortcut {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(8px) scale(.94) !important;
}
@media (max-width: 600px) {
  .sensik-studio-fab {
    right: max(12px, env(safe-area-inset-right, 0px) + 8px) !important;
    bottom: max(14px, env(safe-area-inset-bottom, 0px) + 10px) !important;
    min-height: 54px !important;
    gap: 8px !important;
    padding: 6px 14px 6px 6px !important;
    font-size: 11px !important;
  }
  .sensik-studio-fab-icon { flex-basis: 40px !important; width: 40px !important; height: 40px !important; font-size: 18px !important; }
  .sensik-studio-fab-pulse { left: 6px !important; top: 5px !important; width: 42px !important; height: 42px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .sensik-studio-fab, .sensik-studio-fab-pulse { animation: none !important; transition: none !important; }
}


/* Mobile focus-mode repair: one scroll surface and a docked Generate bar. */
@media (max-width: 767.98px) {
  #studio-workspace.studio-focus-fallback {
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    padding: calc(env(safe-area-inset-top, 0px) + 6px) 0 0 !important;
    gap: 7px !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
    box-sizing: border-box !important;
  }

  #studio-workspace.studio-focus-fallback > .snv-container {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: none !important;
    padding: 0 12px !important;
    margin: 0 auto !important;
  }
  #studio-workspace.studio-focus-fallback > .snv-container .snv-kicker {
    font-size: 8px !important;
    letter-spacing: .14em !important;
  }
  #studio-workspace.studio-focus-fallback > .snv-container h2 {
    margin: 2px 0 0 !important;
    font-size: clamp(18px, 5.2vw, 24px) !important;
    line-height: 1.15 !important;
  }
  #studio-workspace.studio-focus-fallback > .snv-container p { display: none !important; }

  /* The outer studio column is the only vertical scroll container on phones.
     Avoid nested scroll traps in the form and playlist. */
  #studio-workspace.studio-focus-fallback .generator-layout {
    display: flex !important;
    flex: 1 1 0% !important;
    flex-direction: column !important;
    align-items: stretch !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 10px calc(112px + env(safe-area-inset-bottom, 0px)) !important;
    gap: 12px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain !important;
    touch-action: pan-y pinch-zoom !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(73,245,213,.30) rgba(255,255,255,.025) !important;
    box-sizing: border-box !important;
  }
  #studio-workspace.studio-focus-fallback .generator-layout::-webkit-scrollbar { width: 4px; }
  #studio-workspace.studio-focus-fallback .generator-layout::-webkit-scrollbar-thumb {
    background: rgba(73,245,213,.34);
    border-radius: 8px;
  }

  #studio-workspace.studio-focus-fallback .control-console,
  #studio-workspace.studio-focus-fallback .music-panel {
    flex: 0 0 auto !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }
  #studio-workspace.studio-focus-fallback .control-console {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 10px !important;
  }
  #studio-workspace.studio-focus-fallback .master-tabs-container { flex: 0 0 auto !important; }

  #studio-workspace.studio-focus-fallback #mainFormContainer:not([style*="display: none"]) {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 0 0 10px !important;
    overscroll-behavior: auto !important;
    -webkit-overflow-scrolling: auto !important;
  }

  /* Keep the primary action reachable while users scroll the full form/library. */
  #studio-workspace.studio-focus-fallback .control-console > #studioActionRow {
    position: fixed !important;
    inset: auto max(10px, env(safe-area-inset-right, 0px)) calc(8px + env(safe-area-inset-bottom, 0px) + var(--sensik-keyboard-inset, 0px)) max(10px, env(safe-area-inset-left, 0px)) !important;
    z-index: 100110 !important;
    display: flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 8px !important;
    gap: 7px !important;
    border: 1px solid rgba(110, 244, 225, .28) !important;
    border-radius: 16px !important;
    background: linear-gradient(150deg, rgba(8,22,28,.97), rgba(4,12,19,.97)) !important;
    box-shadow: 0 -5px 28px rgba(0,0,0,.36), 0 0 22px rgba(73,245,213,.08) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.2) !important;
    backdrop-filter: blur(18px) saturate(1.2) !important;
    box-sizing: border-box !important;
  }
  #studio-workspace.studio-focus-fallback #thinkingToggleWrap {
    flex: 0 0 auto !important;
    min-height: 42px !important;
    padding: 8px !important;
    font-size: 9px !important;
    white-space: nowrap !important;
  }
  #studio-workspace.studio-focus-fallback #btnGenerate {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    min-height: 48px !important;
    font-size: 11px !important;
  }
  #studio-workspace.studio-focus-fallback #studioActionRow .btn-dice-inspire {
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    height: 42px !important;
  }

  /* Let the whole playlist participate in the main scroll, not an inner trap. */
  #studio-workspace.studio-focus-fallback .music-panel {
    display: flex !important;
    flex-direction: column !important;
  }
  #studio-workspace.studio-focus-fallback .music-panel > .music-header,
  #studio-workspace.studio-focus-fallback .music-panel > .hero-player-area,
  #studio-workspace.studio-focus-fallback .music-panel > .music-feed,
  #studio-workspace.studio-focus-fallback .music-panel > #musicPagination {
    flex: 0 0 auto !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  #studio-workspace.studio-focus-fallback .music-panel > .hero-player-area {
    padding: 12px 10px !important;
  }
}

@media (max-width: 380px) {
  #studio-workspace.studio-focus-fallback .control-console { padding: 8px !important; }
  #studio-workspace.studio-focus-fallback .generator-layout { padding-inline: 7px !important; }
  #studio-workspace.studio-focus-fallback .control-console > #studioActionRow { gap: 5px !important; padding: 6px !important; }
  #studio-workspace.studio-focus-fallback #thinkingToggleWrap { padding: 6px !important; }
  #studio-workspace.studio-focus-fallback #btnGenerate { font-size: 10px !important; }
}

@media (max-height: 620px) and (max-width: 767.98px) {
  #studio-workspace.studio-focus-fallback > .snv-container h2 { font-size: 18px !important; }
  #studio-workspace.studio-focus-fallback { gap: 4px !important; }
}


/* Mobile exit control: keep an always-visible, thumb-friendly way out of Studio focus mode. */
@media (max-width: 767.98px) {
  #studio-workspace.studio-focus-fallback #btnStudioFocus {
    position: fixed !important;
    top: max(8px, calc(env(safe-area-inset-top, 0px) + 8px)) !important;
    right: max(8px, calc(env(safe-area-inset-right, 0px) + 8px)) !important;
    z-index: 100220 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    width: auto !important;
    min-width: 68px !important;
    min-height: 38px !important;
    padding: 9px 12px !important;
    margin: 0 !important;
    border: 1px solid rgba(73,245,213,.42) !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, rgba(97,247,217,.98), rgba(56,216,206,.98) 60%, rgba(108,182,239,.98)) !important;
    color: #052723 !important;
    box-shadow: 0 6px 20px rgba(0,0,0,.36), 0 0 18px rgba(73,245,213,.14) !important;
    font: 900 11px/1 Inter, sans-serif !important;
    white-space: nowrap !important;
    -webkit-tap-highlight-color: transparent !important;
  }
  #studio-workspace.studio-focus-fallback #btnStudioFocus i {
    font-size: 14px !important;
  }
  /* Reserve space at the right of the title so the fixed exit pill never covers it. */
  #studio-workspace.studio-focus-fallback > .snv-container h2 {
    width: calc(100% - 82px) !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    text-align: center !important;
  }
}


/* SENSIK MOBILE POLISH — compact floating shortcut, clean controls, and modal-safe layout. */
@media (max-width: 767.98px) {
  /* Keep the floating shortcut useful without hiding lyrics, community controls, or payment actions. */
  .sensik-studio-fab {
    right: max(12px, calc(env(safe-area-inset-right, 0px) + 8px)) !important;
    bottom: max(16px, calc(env(safe-area-inset-bottom, 0px) + 12px)) !important;
    width: 54px !important;
    min-width: 54px !important;
    max-width: 54px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 5px !important;
    gap: 0 !important;
    border-radius: 50% !important;
  }
  .sensik-studio-fab-label { display: none !important; }
  .sensik-studio-fab-icon {
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
    font-size: 18px !important;
  }
  .sensik-studio-fab-pulse { left: 5px !important; top: 5px !important; width: 42px !important; height: 42px !important; }

  /* The action dock is already fixed in Studio focus mode. Keep its controls from squeezing. */
  #studio-workspace.studio-focus-fallback .control-console > #studioActionRow {
    left: max(8px, env(safe-area-inset-left, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    gap: 6px !important;
    padding: 7px !important;
    border-radius: 15px !important;
  }
  #studio-workspace.studio-focus-fallback #thinkingToggleWrap {
    min-width: 0 !important;
    padding: 7px 8px !important;
    font-size: 10px !important;
  }
  #studio-workspace.studio-focus-fallback #btnGenerate {
    min-width: 0 !important;
    padding-inline: 8px !important;
    letter-spacing: .015em !important;
  }

  /* Keep mode tabs and package shortcut together instead of wrapping the gem onto a new row. */
  #studio-workspace .control-console > .master-tabs-container,
  #studio-workspace.studio-focus-fallback .control-console > .master-tabs-container {
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 5px !important;
  }
  #studio-workspace .master-tabs-choice,
  #studio-workspace.studio-focus-fallback .master-tabs-choice {
    flex: 1 1 0% !important;
    width: auto !important;
    min-width: 0 !important;
    gap: 4px !important;
  }
  #studio-workspace .master-tabs-choice > .master-tab {
    min-width: 0 !important;
    min-height: 40px !important;
    padding: 8px 5px !important;
    font-size: clamp(10px, 2.9vw, 12px) !important;
    white-space: nowrap !important;
  }
  #studio-workspace .master-tabs-actions,
  #studio-workspace.studio-focus-fallback .master-tabs-actions {
    flex: 0 0 auto !important;
    width: auto !important;
    justify-content: flex-end !important;
    gap: 4px !important;
  }
  #studio-workspace .studio-plan-toggle,
  #studio-workspace.studio-focus-fallback .studio-plan-toggle {
    flex: 0 0 40px !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    justify-content: center !important;
  }
  #studio-workspace .studio-plan-toggle span { display: none !important; }

  /* Improve form readability and avoid controls forcing horizontal overflow. */
  #studio-workspace.studio-focus-fallback .generator-layout,
  #studio-workspace .generator-layout {
    min-width: 0 !important;
  }
  #studio-workspace .control-console,
  #studio-workspace .music-panel,
  #studio-workspace .ace-card,
  #studio-workspace .model-selector-wrap,
  #studio-workspace .mode-tabs-shell,
  #studio-workspace .rcs-tabs {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  #studio-workspace .rcs-tabs { overflow-x: auto !important; overscroll-behavior-x: contain !important; }
  #studio-workspace textarea,
  #studio-workspace input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  #studio-workspace select { min-width: 0 !important; max-width: 100% !important; }

  /* Community sort controls become a balanced 2 x 2 grid instead of an awkward wrapped capsule. */
  .snv-community-topline {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
    margin-bottom: 20px !important;
  }
  .snv-community-count {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 5px 7px !important;
    width: 100% !important;
    text-align: center !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
  }
  .snv-community-tabs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 7px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 7px !important;
    border-radius: 17px !important;
    box-sizing: border-box !important;
  }
  .snv-community-tab {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    width: 100% !important;
    min-height: 42px !important;
    padding: 9px 6px !important;
    margin: 0 !important;
    border-radius: 12px !important;
    font-size: clamp(10px, 2.8vw, 12px) !important;
    line-height: 1.25 !important;
    text-align: center !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
  .snv-community-tab i { flex: 0 0 auto !important; margin-right: 4px !important; }
  .snv-social-card { min-width: 0 !important; }
  .snv-social-track-info { min-width: 0 !important; overflow-wrap: anywhere !important; }
  .snv-social-track-info h3 { overflow-wrap: anywhere !important; }
  .snv-social-model { max-width: 100% !important; overflow-wrap: anywhere !important; }

  /* Prevent the floating Studio icon from covering a QRIS/plan/login modal. */
  body.sensik-qris-modal-open #sensikStudioShortcut,
  body:has(.swal2-container.swal2-shown) #sensikStudioShortcut,
  body:has(.modal.show) #sensikStudioShortcut,
  body:has(#instantPassModal.open) #sensikStudioShortcut,
  body:has(.snv-modal-backdrop.open) #sensikStudioShortcut {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /* Do not let the site shortcut sit over the dock or over active Studio controls. */
  body.sensik-studio-focus-active #sensikStudioShortcut { display: none !important; }
}

@media (max-width: 420px) {
  .snv-container { padding-left: 14px !important; padding-right: 14px !important; }
  .snv-community-section .snv-container > .text-center h2 { font-size: clamp(25px, 7vw, 32px) !important; line-height: 1.12 !important; }
  .snv-community-section .snv-container > .text-center p { font-size: 12px !important; line-height: 1.7 !important; }
  .snv-community-tabs { gap: 6px !important; padding: 6px !important; }
  .snv-community-tab { min-height: 40px !important; }
  #studio-workspace.studio-focus-fallback > .snv-container { padding-inline: 10px !important; }
  #studio-workspace.studio-focus-fallback .control-console { padding: 8px !important; }
  #studio-workspace.studio-focus-fallback .master-tabs-choice > .master-tab { font-size: 10px !important; }
  #studio-workspace.studio-focus-fallback .control-console > #studioActionRow { gap: 5px !important; }
  #studio-workspace.studio-focus-fallback #thinkingToggleWrap { padding: 6px !important; font-size: 9px !important; }
}

/* A modal must own the viewport on mobile; background shortcuts and controls stay behind it. */
@media (max-width: 600px) {
  .swal2-container.swal2-center { padding: 10px !important; }
  .sensik-studio-plan-popup {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }
  .sensik-studio-plan-popup .swal2-html-container {
    max-height: calc(100dvh - 165px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }
}


/* Mobile Studio header: keep the exit control in its own visual row.
   The control remains fixed for easy access, while the heading starts below it. */
@media (max-width: 767.98px) {
  #studio-workspace.studio-focus-fallback > .snv-container {
    padding-top: 46px !important;
  }
  #studio-workspace.studio-focus-fallback > .snv-container .snv-kicker {
    display: inline-flex !important;
    max-width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
    overflow-wrap: normal !important;
  }
  #studio-workspace.studio-focus-fallback > .snv-container h2 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 4px auto 0 !important;
    padding: 0 4px !important;
    text-align: center !important;
    overflow-wrap: normal !important;
    box-sizing: border-box !important;
  }
}