.furi-preview-player {
  --furi-preview-x: 0px;
  --furi-preview-y: 0px;
  --furi-preview-tilt-x: 0deg;
  --furi-preview-tilt-y: 0deg;
  --furi-preview-glow-x: 50%;
  --furi-preview-glow-y: 50%;
  --furi-preview-warp: 0;
  --furi-preview-energy: 0;
  --furi-preview-accent: #ffb800;
  --furi-preview-bg: #0a0a0a;
  --furi-preview-panel: #111111;
  --furi-preview-text: #f5f3ee;
  --furi-preview-muted: #b7aea0;
  position: relative;
  display: grid;
  gap: 10px;
  padding: 14px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255,184,0,.10), rgba(255,184,0,.02)), var(--furi-preview-bg);
  border: 1px solid rgba(255,184,0,.28);
  box-shadow: 0 12px 30px rgba(0,0,0,.28), 0 0 0 1px rgba(255,255,255,.02) inset;
  color: var(--furi-preview-text);
  max-width: 100%;
  overflow: hidden;
  transform: translate3d(var(--furi-preview-x), var(--furi-preview-y), 0) rotateX(var(--furi-preview-tilt-x)) rotateY(var(--furi-preview-tilt-y));
  transition: transform .12s ease, box-shadow .12s ease, opacity .2s ease;
  will-change: transform;
}
.furi-preview-player.has-warp {
  transform:
    perspective(720px)
    rotateX(calc(var(--furi-preview-tilt-y, 0deg) * -1))
    rotateY(calc(var(--furi-preview-tilt-x, 0deg) * 1))
    translate3d(
      calc((var(--furi-preview-x, 0.5) - 0.5) * 11px),
      calc((var(--furi-preview-y, 0.5) - 0.5) * 8px),
      0
    );
}
.furi-preview-player.has-warp::before {
  content: "";
  position: absolute;
  inset: -1px;
  pointer-events: none;
  background:
    radial-gradient(circle at var(--furi-preview-glow-x, 50%) var(--furi-preview-glow-y, 50%), rgba(255, 216, 97, calc(0.20 + var(--furi-preview-warp, 0) * 0.25)), rgba(255, 124, 24, calc(0.08 + var(--furi-preview-warp, 0) * 0.14)) 24%, transparent 58%);
  opacity: calc(0.52 + var(--furi-preview-warp, 0) * 0.78);
  mix-blend-mode: screen;
  transition: opacity .14s ease;
}
.furi-preview-player.is-playing.has-warp {
  animation: furiPreviewAudioBreath 1.2s ease-in-out infinite;
}
.furi-preview-player.has-warp .furi-preview-player__progress-fill {
  box-shadow:
    0 0 18px rgba(255, 204, 72, calc(0.48 + var(--furi-preview-warp, 0) * 0.52)),
    0 0 34px rgba(255, 134, 24, calc(0.28 + var(--furi-preview-energy, 0) * 0.48));
}
.furi-preview-player.has-warp .furi-preview-player__button {
  transform:
    translate3d(
      calc((var(--furi-preview-x, 0.5) - 0.5) * 6px),
      calc((var(--furi-preview-y, 0.5) - 0.5) * 6px),
      0
    )
    scale(calc(1 + var(--furi-preview-warp, 0) * 0.07));
}
body.furi-warp-active .furi-preview-player.has-warp::before {
  opacity: calc(0.62 + var(--furi-preview-warp, 0) * 0.84);
}
body.furi-warp-scrolling .furi-preview-player.has-warp::before,
body.furi-warp-dragging .furi-preview-player.has-warp::before,
body.furi-warp-scrubbing .furi-preview-player.has-warp::before {
  opacity: calc(0.78 + var(--furi-preview-warp, 0) * 0.42);
}
body.furi-warp-active .furi-preview-player.has-warp .furi-preview-player__progress-fill {
  box-shadow:
    0 0 22px rgba(255, 204, 72, calc(0.54 + var(--furi-preview-warp, 0) * 0.56)),
    0 0 40px rgba(255, 134, 24, calc(0.34 + var(--furi-audio-energy, 0) * 0.54));
}
.furi-preview-player.has-warp .furi-preview-player__progress-track {
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.08),
    0 0 28px rgba(255, 194, 59, calc(0.20 + var(--furi-preview-warp, 0) * 0.36));
}
.furi-preview-player--full {
  width: 100%;
  max-width: 100%;
  min-height: 46px;
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px 10px;
  padding: 9px 12px 8px;
  border-color: rgba(255, 214, 91, 0.34);
  border-radius: 14px;
  background:
    radial-gradient(circle at var(--furi-preview-glow-x, 50%) var(--furi-preview-glow-y, 50%), rgba(255, 210, 88, 0.16), transparent 42%),
    linear-gradient(180deg, rgba(20, 18, 12, 0.98), rgba(8, 8, 7, 0.99));
  box-shadow: 0 10px 24px rgba(0,0,0,.28), 0 0 0 1px rgba(255,255,255,.02) inset, 0 0 18px rgba(214, 169, 63, 0.10);
}
.furi-preview-player--compact-button,
.furi-preview-player--catalog-chip,
.furi-preview-player--mini-strip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: auto;
  min-height: 42px;
}
.furi-preview-player--waveform-bar { min-height: 60px; }
.furi-preview-player--orb-player { padding-left: 72px; }
.furi-preview-player--product .furi-preview-player__artwork,
.furi-preview-player--landing .furi-preview-player__artwork {
  display: none;
}
.furi-preview-player--full .furi-preview-player__button {
  width: auto;
  min-width: 0;
  min-height: 34px;
  white-space: nowrap;
  padding: 7px 12px;
  background: linear-gradient(180deg, #fff0a6, #f2b900 45%, #b87900);
  color: #080704;
  border: 1px solid rgba(255, 230, 140, 0.8);
  box-shadow: 0 0 0 1px rgba(255,255,255,.10) inset, 0 0 20px rgba(255, 196, 59, 0.28);
  text-shadow: none;
  flex-wrap: nowrap;
}
.furi-preview-player--full .furi-preview-player__button:hover,
.furi-preview-player--full .furi-preview-player__button:focus-visible {
  filter: brightness(1.03);
  box-shadow: 0 0 0 1px rgba(255,255,255,.18) inset, 0 0 28px rgba(255, 196, 59, 0.42);
}
.furi-preview-player--full .furi-preview-player__title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff5d0;
}
.furi-preview-player--full .furi-preview-player__progress {
  grid-column: 1 / -1;
  width: 100%;
  height: 8px;
}
.furi-preview-player--full .furi-preview-player__time {
  grid-column: 1 / -1;
  font-size: 11px;
  line-height: 1;
}
.furi-preview-player--full .furi-preview-player__wave {
  grid-column: 1 / -1;
  min-height: 14px;
  opacity: 0.72;
}
.furi-preview-player.is-fallback { opacity: .92; border-color: rgba(255,184,0,.18); }
.furi-preview-player.is-loading { opacity: .9; }
.furi-preview-player.is-playing { box-shadow: 0 16px 36px rgba(0,0,0,.36), 0 0 0 1px rgba(255,184,0,.14) inset, 0 0 24px rgba(255,184,0,.12); }
.furi-preview-player.is-paused { opacity: .96; }
.furi-preview-player.is-ended { opacity: .92; }
.furi-preview-player.is-error { border-color: rgba(255,92,92,.35); }
.furi-preview-player.has-warp:hover { box-shadow: 0 16px 36px rgba(0,0,0,.32), 0 0 28px rgba(255,184,0,.12); }
.furi-preview-player__button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(180deg, #ffce4b, #c78f00);
  color: #0a0a0a;
  border: 1px solid #9c6c0a;
  border-radius: 999px;
  padding: 10px 16px;
  font: 700 13px/1.1 "Courier New", monospace;
  text-transform: uppercase;
  letter-spacing: 1.1px;
  cursor: pointer;
  width: fit-content;
  flex-wrap: wrap;
}
.furi-preview-player__button:hover { filter: brightness(1.02); transform: translateY(-1px); }
.furi-preview-player__icon {
  width: 18px;
  display: inline-flex;
  justify-content: center;
}
.furi-preview-sound-label {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  opacity: .82;
}
.furi-preview-player--full .furi-preview-sound-label {
  display: inline-flex;
}
.furi-preview-sound-indicator {
  display: inline-flex;
  align-items: end;
  gap: 2px;
  height: 10px;
}
.furi-preview-sound-indicator span {
  width: 2px;
  height: 4px;
  border-radius: 999px;
  background: currentColor;
  opacity: .62;
  transform-origin: center bottom;
}
.furi-preview-player.is-playing .furi-preview-sound-indicator span {
  animation: furiSoundBars 0.72s ease-in-out infinite;
}
.furi-preview-player.is-playing .furi-preview-sound-indicator span:nth-child(2) { animation-delay: 0.12s; }
.furi-preview-player.is-playing .furi-preview-sound-indicator span:nth-child(3) { animation-delay: 0.24s; }
.furi-preview-player.is-playing .furi-preview-sound-indicator span:nth-child(4) { animation-delay: 0.36s; }
.furi-preview-player__label,
.furi-preview-player__title,
.furi-preview-player__time,
.furi-preview-player__disabled {
  font-family: Arial, sans-serif;
}
.furi-preview-player__label { color: #120d00; font-weight: 800; }
.furi-preview-player__source {
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #f7d36a;
  opacity: .9;
}
.furi-preview-player__title { font-size: 14px; font-weight: 700; letter-spacing: .02em; }
.furi-preview-player__artwork {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,184,0,.18);
}
.furi-preview-player__artwork-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.furi-preview-player__progress {
  position: relative;
  min-height: 18px;
  border-radius: 999px;
  cursor: pointer;
  touch-action: pan-y;
  user-select: none;
  outline: none;
}
.furi-preview-player__progress:focus-visible {
  box-shadow: 0 0 0 2px rgba(255,184,0,.32), 0 0 24px rgba(255,184,0,.18);
}
.furi-preview-player__progress-track {
  position: relative;
  height: 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  overflow: hidden;
  margin-top: 5px;
}
.furi-preview-player__progress-fill,
.furi-preview-player__progress-handle {
  position: absolute;
  top: 0;
  left: 0;
}
.furi-preview-player__progress-fill {
	width: 0%;
	height: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, #f7d36a, #ffb800, #fff0b5);
	background-size: 200% 100%;
	background-position: calc(var(--furi-preview-progress, 0) * 100%) 50%;
	filter: brightness(calc(1 + var(--furi-preview-progress, 0) * 0.22));
	box-shadow: 0 0 12px rgba(255,184,0,.28);
}

.furi-preview-player.is-seeking .furi-preview-player__progress-fill {
	filter: brightness(1.34) saturate(1.14);
	box-shadow:
		0 0 16px rgba(255, 214, 92, 0.78),
		0 0 42px rgba(255, 156, 29, 0.38),
		inset 0 0 0 1px rgba(255, 248, 215, 0.5);
}
.furi-preview-player__progress-handle {
  width: 16px;
  height: 16px;
  top: 50%;
  left: 0%;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(255, 236, 176, .9);
  background: radial-gradient(circle at 30% 30%, #fff4c8, #ffb800 56%, #c78500 100%);
  box-shadow: 0 0 12px rgba(255,184,0,.42);
}
.furi-preview-player.is-scrubbing .furi-preview-player__progress-handle,
.furi-preview-player:hover .furi-preview-player__progress-handle {
  box-shadow: 0 0 16px rgba(255,184,0,.65), 0 0 0 1px rgba(255,255,255,.08) inset;
}
.furi-preview-player__time { font-size: 12px; color: var(--furi-preview-muted); }
.furi-preview-player__wave {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 4px;
  align-items: end;
  height: 18px;
}
.furi-preview-player__wave span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(255,184,0,.9), rgba(255,184,0,.35));
  animation: furiPulse 1.4s ease-in-out infinite;
}
.furi-preview-player__wave span:nth-child(2n) { animation-duration: 1.7s; }
.furi-preview-player__wave span:nth-child(3n) { animation-duration: 1.2s; }
.furi-preview-player__orb {
  position: absolute;
  right: 10px;
  top: 50%;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  pointer-events: none;
  transform: translateY(-50%) translate3d(calc(var(--furi-preview-x) * .2), calc(var(--furi-preview-y) * .2), 0);
  background: radial-gradient(circle at var(--furi-preview-glow-x) var(--furi-preview-glow-y), rgba(255,214,106,.35), rgba(255,184,0,.08) 45%, rgba(255,184,0,0) 72%);
  filter: blur(2px);
  opacity: .8;
}
.furi-preview-player__close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid rgba(255,184,0,.25);
  background: rgba(0,0,0,.28);
  color: #fff;
  cursor: pointer;
}
.furi-preview-player__disabled {
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(255,255,255,.03);
  color: var(--furi-preview-muted);
  font-size: 12px;
}
.furi-preview-mini-player {
  position: fixed;
  z-index: 9998;
  right: 18px;
  bottom: 18px;
  left: auto;
  width: min(420px, calc(100vw - 24px));
  display: none;
  gap: 10px;
  align-items: center;
  background: rgba(7,7,7,.96);
  border: 1px solid rgba(255,184,0,.28);
  border-radius: 16px;
  padding: 12px 12px 10px;
  color: #f5f3ee;
  box-shadow: 0 18px 40px rgba(0,0,0,.45);
}
.furi-preview-mini-player--bottom {
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}
.furi-preview-mini-player--bottom-left {
  left: 18px;
  right: auto;
}
.furi-preview-mini-player--bottom-right {
  right: 18px;
  left: auto;
}
.furi-preview-mini-player.is-visible { display: grid; }
.furi-preview-mini-player__meta { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: center; min-width: 0; }
.furi-preview-mini-player__artwork {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,184,0,.18);
}
.furi-preview-mini-player__artwork img { width: 100%; height: 100%; object-fit: cover; display: block; }
.furi-preview-mini-player__text { min-width: 0; display: grid; }
.furi-preview-mini-player__text strong,
.furi-preview-mini-player__text span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.furi-preview-mini-player__progress { grid-column: 1 / -1; height: 6px; background: rgba(255,255,255,.08); border-radius: 999px; overflow: hidden; }
.furi-preview-mini-player__progress span { display: block; height: 100%; width: 0%; background: linear-gradient(90deg, #f7d36a, #ffb800); }
.furi-preview-mini-player__close,
.furi-preview-mini-player__play {
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
}
@keyframes furiPulse {
  0%,100% { transform: scaleY(.72); opacity: .65; }
  50% { transform: scaleY(1); opacity: 1; }
}
@keyframes furiSoundBars {
  0%, 100% {
    transform: scaleY(0.45);
    opacity: 0.45;
  }
  50% {
    transform: scaleY(1.8);
    opacity: 1;
  }
}
@keyframes furiPreviewAudioBreath {
  0%, 100% {
    filter: saturate(1) brightness(1);
  }
  50% {
    filter: saturate(1.15) brightness(1.08);
  }
}
@media (prefers-reduced-motion: reduce) {
  .furi-preview-player,
  .furi-preview-player__wave span,
  .furi-preview-sound-indicator span {
    transition: none !important;
    animation: none !important;
    transform: none !important;
  }
}

@media (max-width: 520px) {
  .furi-preview-player--full {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 8px 10px;
  }
  .furi-preview-player--full .furi-preview-player__button {
    grid-column: 1 / -1;
  }
  .furi-preview-player--full .furi-preview-player__title {
    grid-column: 1 / -1;
  }
  .furi-preview-player--full .furi-preview-player__progress,
  .furi-preview-player--full .furi-preview-player__time,
  .furi-preview-player--full .furi-preview-player__wave {
    grid-column: 1 / -1;
  }
}
@media (max-width: 680px) {
  .furi-preview-player { padding: 12px; }
  .furi-preview-player__button { width: 100%; justify-content: center; }
  .furi-preview-mini-player { right: 12px; left: 12px; width: auto; }
}
