/*
 * SUNO WAVE — чистое белое result-окно без солнечного/планетарного оформления.
 *
 * Структурные старые CSS сохраняются ради адаптивности, но их декоративные
 * градиенты, оранжевое свечение и "космос" полностью перекрываются.
 */

html body #resultModal.swModal {
  background: rgba(15, 23, 42, .38) !important;
  backdrop-filter: blur(11px) saturate(.88) !important;
  -webkit-backdrop-filter: blur(11px) saturate(.88) !important;
}

html body #resultModal.swModal .swResult {
  color: #111827 !important;
  border: 1px solid rgba(148, 163, 184, .28) !important;
  background: #ffffff !important;
  box-shadow:
    0 34px 100px rgba(15, 23, 42, .24),
    0 12px 34px rgba(15, 23, 42, .13),
    inset 0 1px 0 rgba(255, 255, 255, 1) !important;
}

/* Удаляем декоративные солнечные, планетарные и космические слои. */
html body #resultModal.swModal .swResult::before,
html body #resultModal.swModal .swResult::after,
html body #resultModal.swModal .swTracks::before,
html body #resultModal.swModal .swTracks::after,
html body #resultModal.swModal .swPlanetTracks::before,
html body #resultModal.swModal .swPlanetTracks::after,
html body #resultModal.swModal .swPlanetMission::before,
html body #resultModal.swModal .swPlanetMission::after,
html body #resultModal.swModal .swTrack::before,
html body #resultModal.swModal .swTrack::after,
html body #resultModal.swModal .swBuy::before,
html body #resultModal.swModal .swBuy::after {
  content: none !important;
  display: none !important;
  background: none !important;
  box-shadow: none !important;
}

/* Содержательные блоки — белые карточки с мягкой тенью. */
html body #resultModal.swModal .swPlanetMission,
html body #resultModal.swModal .swTrack,
html body #resultModal.swModal .swTrack.is-vocal,
html body #resultModal.swModal .swTrack.swPlanetTrack,
html body #resultModal.swModal .swTrack.swPlanetTrack--minus,
html body #resultModal.swModal .swTrack.swPlanetTrack--vocal,
html body #resultModal.swModal .swBuy,
html body #resultModal.swModal .swResultFoot,
html body #resultModal.swModal .swPaidPreparing {
  color: #111827 !important;
  border-color: rgba(148, 163, 184, .28) !important;
  background: #ffffff !important;
  box-shadow:
    0 18px 42px rgba(15, 23, 42, .09),
    0 4px 14px rgba(15, 23, 42, .055) !important;
}

/* Убираем старые декоративные подписи и значок-солнце. */
html body #resultModal.swModal .swPlanetMission__kicker,
html body #resultModal.swModal .swPlanetTrack__tag,
html body #resultModal.swModal .swBuyIcon {
  display: none !important;
}

/* Все основные тексты переводим в спокойную тёмную палитру. */
html body #resultModal.swModal h2,
html body #resultModal.swModal h3,
html body #resultModal.swModal b,
html body #resultModal.swModal strong,
html body #resultModal.swModal .swPlanetTrack__name h3,
html body #resultModal.swModal .swPriceCopy b,
html body #resultModal.swModal .swPriceStrong {
  color: #111827 !important;
  text-shadow: none !important;
}

html body #resultModal.swModal p,
html body #resultModal.swModal small,
html body #resultModal.swModal .swBuyText,
html body #resultModal.swModal .swBenefits li,
html body #resultModal.swModal .swResultFoot,
html body #resultModal.swModal .swPlanetTrack__name p,
html body #resultModal.swModal .swPlanetTrack__name small,
html body #resultModal.swModal .swPlayValueCue,
html body #resultModal.swModal .swPaidPreparing__text,
html body #resultModal.swModal .swPaidPreparing__meta {
  color: #52606d !important;
  text-shadow: none !important;
}

/* Кнопка закрытия — белая, без неона. */
html body #resultModal.swModal .swResultClose {
  color: #111827 !important;
  border: 1px solid rgba(148, 163, 184, .35) !important;
  background: #ffffff !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .12) !important;
  backdrop-filter: none !important;
}

html body #resultModal.swModal .swResultClose:hover,
html body #resultModal.swModal .swResultClose:focus-visible {
  background: #f8fafc !important;
  border-color: rgba(71, 85, 105, .42) !important;
}

/* Плееры — чистые белые круги с нейтральной тенью. */
html body #resultModal.swModal .swPlay,
html body #resultModal.swModal .swPlay.swPlanetPlay,
html body #resultModal.swModal .swTrack.is-vocal .swPlay,
html body #resultModal.swModal .swTrack.swPlanetTrack--vocal .swPlay {
  color: #111827 !important;
  border: 1px solid rgba(100, 116, 139, .34) !important;
  background: #ffffff !important;
  box-shadow:
    0 12px 28px rgba(15, 23, 42, .14),
    inset 0 1px 0 #ffffff !important;
}

html body #resultModal.swModal .swPlay:hover,
html body #resultModal.swModal .swPlay:focus-visible,
html body #resultModal.swModal .swPlay.is-playing {
  color: #020617 !important;
  border-color: rgba(51, 65, 85, .52) !important;
  background: #f8fafc !important;
  box-shadow:
    0 15px 34px rgba(15, 23, 42, .18),
    0 0 0 6px rgba(148, 163, 184, .11) !important;
}

/*
 * Волновое поле больше не солнечное.
 * Форма обеих настоящих волн — чисто белая, читается за счёт кристальной тени.
 */
html body #resultModal.swModal .swWaveBox,
html body #resultModal.swModal .swWaveBox.swPlanetWave,
html body #resultModal.swModal #instrumentalTrack .swWaveBox.swPlanetWave,
html body #resultModal.swModal #vocalTrack .swWaveBox.swPlanetWave,
html body #resultModal.swModal .swTrack.is-vocal .swWaveBox {
  border: 1px solid rgba(148, 163, 184, .30) !important;
  background: #eef2f6 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .95),
    inset 0 -8px 20px rgba(148, 163, 184, .08),
    0 9px 22px rgba(15, 23, 42, .07) !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
}

html body #resultModal.swModal .swWaveBox::before {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(100, 116, 139, .18),
    transparent
  ) !important;
}

html body #resultModal.swModal .swWaveBox::after,
html body #resultModal.swModal .swWaveLux {
  display: none !important;
  opacity: 0 !important;
  animation: none !important;
  background: none !important;
  filter: none !important;
}

html body #resultModal.swModal .swWaveFake {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  animation: none !important;
}

/* Точный белый силуэт с холодной кристальной тенью. */
html body #resultModal.swModal .swWaveImg,
html body #resultModal.swModal #minusWaveImage,
html body #resultModal.swModal #vocalWaveImage,
html body #resultModal.swModal .swTrack.is-vocal .swWaveImg {
  filter:
    brightness(0)
    saturate(0)
    invert(1)
    drop-shadow(0 1px 1px rgba(15, 23, 42, .55))
    drop-shadow(0 0 4px rgba(100, 116, 139, .54))
    drop-shadow(0 0 10px rgba(186, 230, 253, .72)) !important;
  box-shadow: none !important;
  outline: 0 !important;
  opacity: 1 !important;
}

/* Линия уже прослушанного участка — белая с серой тенью. */
html body #resultModal.swModal .swWaveProgress i {
  background: linear-gradient(
    90deg,
    #ffffff 0%,
    #f8fafc 48%,
    #dbeafe 100%
  ) !important;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, .42),
    0 0 8px rgba(186, 230, 253, .70) !important;
}

html body #resultModal.swModal .swWaveClock {
  color: #334155 !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .85) !important;
}

/* Технические характеристики — светлые нейтральные ячейки. */
html body #resultModal.swModal .swFileSpecs span,
html body #resultModal.swModal .swPlanetTrack__footer .swFileSpecs span {
  color: #475569 !important;
  border-color: rgba(148, 163, 184, .24) !important;
  background: #f8fafc !important;
  box-shadow: inset 0 1px 0 #ffffff !important;
}

html body #resultModal.swModal .swFileSpecs b,
html body #resultModal.swModal .swFileSpecs em {
  color: #334155 !important;
}

/* Бесплатная загрузка WAV — белая кнопка с чёткой тенью. */
html body #resultModal.swModal .swMiniBtn,
html body #resultModal.swModal .swMiniBtn.is-blue,
html body #resultModal.swModal .swMiniBtn.is-green {
  color: #111827 !important;
  border: 1px solid rgba(100, 116, 139, .32) !important;
  background: #ffffff !important;
  box-shadow:
    0 10px 24px rgba(15, 23, 42, .11),
    inset 0 1px 0 #ffffff !important;
}

html body #resultModal.swModal .swMiniBtn:hover,
html body #resultModal.swModal .swMiniBtn:focus-visible {
  color: #020617 !important;
  border-color: rgba(51, 65, 85, .48) !important;
  background: #f8fafc !important;
  transform: translateY(-1px);
}

/* Карточки покупки — белые; оригинальный логотип СБП остаётся. */
html body #resultModal.swModal .swPrice,
html body #resultModal.swModal .swCleanPayCard,
html body #resultModal.swModal .swTrackBuy {
  color: #111827 !important;
  border: 1px solid rgba(34, 197, 94, .28) !important;
  background: #ffffff !important;
  box-shadow:
    0 16px 34px rgba(15, 23, 42, .11),
    0 3px 10px rgba(15, 23, 42, .05) !important;
}

html body #resultModal.swModal .swPrice:hover,
html body #resultModal.swModal .swCleanPayCard:hover,
html body #resultModal.swModal .swTrackBuy:hover {
  border-color: rgba(22, 163, 74, .48) !important;
  background: #ffffff !important;
  box-shadow:
    0 20px 42px rgba(15, 23, 42, .15),
    0 0 0 4px rgba(34, 197, 94, .07) !important;
}

html body #resultModal.swModal .swPriceCopy small,
html body #resultModal.swModal .swCleanPaySub,
html body #resultModal.swModal .swCleanPayKicker {
  color: #52606d !important;
}

/* Центральная CTA без золотого солнца. */
html body #resultModal.swModal .swCta,
html body #resultModal.swModal .swCta.is-gold,
html body #resultModal.swModal .swCta.is-blue,
html body #resultModal.swModal .swCta.is-green {
  color: #ffffff !important;
  border: 1px solid #111827 !important;
  background: #111827 !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, .17) !important;
}

html body #resultModal.swModal .swCta:hover,
html body #resultModal.swModal .swCta:focus-visible {
  color: #ffffff !important;
  background: #020617 !important;
  border-color: #020617 !important;
}

/* Чек-лист сохраняем как полезный продающий элемент, но без золота. */
html body #resultModal.swModal .swBenefits li::before {
  color: #ffffff !important;
  background: #16a34a !important;
  box-shadow: none !important;
}

/* Экран проверки оплаты также становится белым. */
html body #resultModal.swModal .swPaidPreparing__mark,
html body #resultModal.swModal .swPaidPreparing__steps li i {
  color: #111827 !important;
  border-color: rgba(100, 116, 139, .30) !important;
  background: #ffffff !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .08) !important;
}

html body #resultModal.swModal .swPaidPreparing__progress {
  border-color: rgba(148, 163, 184, .28) !important;
  background: #e2e8f0 !important;
}

html body #resultModal.swModal .swPaidPreparing__progress i {
  background: linear-gradient(90deg, #334155, #0f172a) !important;
  box-shadow: none !important;
}

html body #resultModal.swModal .swPaidPreparing__steps li,
html body #resultModal.swModal .swPaidPreparing__steps li.is-active,
html body #resultModal.swModal .swPaidPreparing__steps li.is-done,
html body #resultModal.swModal .swPaidPreparing__eyebrow {
  color: #475569 !important;
}

@media (max-width: 720px) {
  html body #resultModal.swModal {
    background: #ffffff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html body #resultModal.swModal .swResult {
    background: #ffffff !important;
    box-shadow: none !important;
  }

  html body #resultModal.swModal .swPlanetMission,
  html body #resultModal.swModal .swTrack,
  html body #resultModal.swModal .swBuy,
  html body #resultModal.swModal .swResultFoot {
    box-shadow:
      0 12px 28px rgba(15, 23, 42, .08),
      0 2px 8px rgba(15, 23, 42, .04) !important;
  }
}


/* === SUNO GOLD WAVE PATCH START === */

/*
  Белое окно оставляем.
  Делаем волну золотой и хорошо читаемой на светлом фоне.
*/

/* Само поле волны — чуть теплее и контрастнее */
html body #resultModal.swModal .swWaveBox,
html body #resultModal.swModal .swWaveBox.swPlanetWave,
html body #resultModal.swModal #instrumentalTrack .swWaveBox.swPlanetWave,
html body #resultModal.swModal #vocalTrack .swWaveBox.swPlanetWave,
html body #resultModal.swModal .swTrack.is-vocal .swWaveBox {
  border: 1px solid rgba(212, 175, 55, 0.24) !important;
  background: linear-gradient(
    180deg,
    #eef4f8 0%,
    #e7edf3 100%
  ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 -10px 24px rgba(148,163,184,.10),
    0 10px 24px rgba(15,23,42,.08) !important;
}

/* Реальная картинка волны — золотая */
html body #resultModal.swModal .swWaveImg,
html body #resultModal.swModal #minusWaveImage,
html body #resultModal.swModal #vocalWaveImage,
html body #resultModal.swModal .swTrack.is-vocal .swWaveImg {
  filter:
    brightness(0)
    saturate(100%)
    invert(72%)
    sepia(83%)
    saturate(1130%)
    hue-rotate(354deg)
    brightness(1.04)
    contrast(1.08)
    drop-shadow(0 1px 1px rgba(86, 52, 0, 0.55))
    drop-shadow(0 0 4px rgba(212, 175, 55, 0.70))
    drop-shadow(0 0 10px rgba(255, 215, 96, 0.34)) !important;
  opacity: 1 !important;
}

/* Уже прослушанный прогресс — тоже золото */
html body #resultModal.swModal .swWaveProgress i {
  background: linear-gradient(
    90deg,
    #fff0a8 0%,
    #ffd86b 18%,
    #f4bf2a 52%,
    #d89a00 100%
  ) !important;
  box-shadow:
    0 1px 2px rgba(86, 52, 0, 0.38),
    0 0 10px rgba(255, 210, 85, 0.38) !important;
}

/* Бегунок — золотой */
html body #resultModal.swModal .swKernelSeekKnob {
  background: radial-gradient(circle at 35% 35%, #fff5bf 0%, #ffd86b 38%, #e1a900 100%) !important;
  border: 1px solid rgba(163, 104, 0, 0.28) !important;
  box-shadow:
    0 0 0 3px rgba(255, 217, 107, 0.18),
    0 4px 10px rgba(86, 52, 0, 0.20) !important;
}

/* Вертикальный курсор */
html body #resultModal.swModal .swWaveCursor {
  background: linear-gradient(
    180deg,
    rgba(255,248,210,.0) 0%,
    rgba(255,219,101,.88) 18%,
    rgba(255,199,56,1) 50%,
    rgba(255,219,101,.88) 82%,
    rgba(255,248,210,.0) 100%
  ) !important;
  box-shadow:
    0 0 8px rgba(255, 210, 85, 0.35),
    0 0 16px rgba(255, 210, 85, 0.18) !important;
}

/* Часы — чуть темнее, чтобы не терялись */
html body #resultModal.swModal .swWaveClock {
  color: #475569 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.95) !important;
}

/* На мобильном чуть усиливаем видимость */
@media (max-width: 720px) {
  html body #resultModal.swModal .swWaveImg,
  html body #resultModal.swModal #minusWaveImage,
  html body #resultModal.swModal #vocalWaveImage,
  html body #resultModal.swModal .swTrack.is-vocal .swWaveImg {
    filter:
      brightness(0)
      saturate(100%)
      invert(72%)
      sepia(83%)
      saturate(1200%)
      hue-rotate(354deg)
      brightness(1.05)
      contrast(1.10)
      drop-shadow(0 1px 1px rgba(86, 52, 0, 0.58))
      drop-shadow(0 0 5px rgba(212, 175, 55, 0.74))
      drop-shadow(0 0 12px rgba(255, 215, 96, 0.38)) !important;
  }
}

/* === SUNO GOLD WAVE PATCH END === */

/* === REAL GOLD WAVEFORM MASK START === */

/*
 * Настоящая PNG-форма берётся из --wave-url.
 * Золото накладывается строго по её альфа-маске.
 */

html body #resultModal.swModal .swWaveBox.has-real-wave {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
}

/*
 * Оригинальную цветную картинку оставляем загруженной в DOM,
 * но визуально заменяем золотой копией по той же реальной форме.
 */
html body #resultModal.swModal .swWaveBox.has-real-wave > .swWaveImg,
html body #resultModal.swModal .swWaveBox.has-real-wave > img.swWaveImg,
html body #resultModal.swModal #minusWaveImage,
html body #resultModal.swModal #vocalWaveImage {
  opacity: 0 !important;
  filter: none !important;
}

/* Золотая реальная waveform */
html body #resultModal.swModal .swWaveBox.has-real-wave::after {
  content: "" !important;
  display: block !important;

  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;

  width: 100% !important;
  height: 100% !important;

  pointer-events: none !important;

  background:
    linear-gradient(
      180deg,
      #fff4b0 0%,
      #ffd967 20%,
      #f5bd2c 47%,
      #d89500 72%,
      #ffdf74 100%
    ) !important;

  -webkit-mask-image: var(--wave-url) !important;
  mask-image: var(--wave-url) !important;

  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;

  -webkit-mask-position: center !important;
  mask-position: center !important;

  -webkit-mask-size: 100% 100% !important;
  mask-size: 100% 100% !important;

  -webkit-mask-mode: alpha !important;
  mask-mode: alpha !important;

  opacity: 1 !important;

  filter:
    drop-shadow(0 1px 1px rgba(91, 55, 0, .70))
    drop-shadow(0 0 3px rgba(198, 133, 0, .76))
    drop-shadow(0 0 8px rgba(255, 203, 62, .52))
    drop-shadow(0 0 15px rgba(255, 226, 135, .30)) !important;

  animation: none !important;
}

/* Плеер должен оставаться поверх самой волны */
html body #resultModal.swModal .swWaveBox .swPlay,
html body #resultModal.swModal .swWaveBox .swPlanetPlay {
  position: relative !important;
  z-index: 6 !important;
}

/* Прогресс остаётся поверх золотого силуэта */
html body #resultModal.swModal .swWaveProgress {
  position: absolute !important;
  z-index: 4 !important;
}

html body #resultModal.swModal .swWaveClock {
  position: absolute !important;
  z-index: 7 !important;
}

html body #resultModal.swModal .swKernelSeekKnob {
  z-index: 8 !important;
}

/* Убираем любые старые декоративные слои поверх формы */
html body #resultModal.swModal .swWaveBox.has-real-wave .swWaveLux,
html body #resultModal.swModal .swWaveBox.has-real-wave .swWaveFake {
  display: none !important;
  opacity: 0 !important;
}

/* На мобильном делаем золото чуть плотнее */
@media (max-width: 720px) {
  html body #resultModal.swModal .swWaveBox.has-real-wave::after {
    background:
      linear-gradient(
        180deg,
        #fff1a0 0%,
        #ffd253 22%,
        #edae17 52%,
        #c98200 76%,
        #ffdc67 100%
      ) !important;

    filter:
      drop-shadow(0 1px 1px rgba(77, 43, 0, .76))
      drop-shadow(0 0 4px rgba(190, 122, 0, .78))
      drop-shadow(0 0 10px rgba(255, 198, 38, .54)) !important;
  }
}

/* === REAL GOLD WAVEFORM MASK END === */