@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@700;800&family=Russo+One&family=Unbounded:wght@700;800;900&display=swap");

:root {
  --page-bg: #090402;
  --page-ink: #211307;
  --page-muted: rgba(33, 19, 7, .68);
  --page-line: rgba(33, 19, 7, .2);
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  background: var(--page-bg);
}

body {
  overflow-x: hidden;
  overscroll-behavior-y: none;
  color: var(--page-ink);
  font-family: "Manrope", "Avenir Next", "Helvetica Neue", Arial, sans-serif;
}

.playlist-radar-page {
  position: relative;
  width: 100%;
  min-height: 100svh;
  overflow-x: hidden;
  isolation: isolate;
  background: linear-gradient(180deg, #d97831 0 100svh, #070403 100svh);
}

.playlist-radar-video {
  position: absolute;
  inset: 0 0 auto;
  z-index: -1;
  width: 100%;
  height: 100svh;
  background: #df7b32;
  object-fit: cover;
  object-position: center;
  filter: none;
  pointer-events: none;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  will-change: transform;
}

.playlist-radar-video--fill {
  display: none;
}

.playlist-radar-video--mobile {
  display: none;
}

.playlist-radar-page::before,
.playlist-radar-page::after {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 100svh;
  pointer-events: none;
}

.playlist-radar-page::before {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(115, 46, 14, .08), transparent 34% 78%, rgba(110, 42, 10, .07)),
    linear-gradient(180deg, rgba(255, 220, 156, .08) 0%, transparent 43%, rgba(95, 39, 9, .07) 100%);
}

.playlist-radar-page::after {
  z-index: 1;
  background:
    radial-gradient(ellipse at center, transparent 0 66%, rgba(101, 36, 5, .09) 100%),
    linear-gradient(90deg, rgba(255, 236, 191, .04), transparent 28% 80%, rgba(80, 29, 5, .06));
  opacity: .58;
}

.playlist-radar-header {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: 5;
  height: 88px;
  display: grid;
  grid-template-columns: minmax(190px, 1fr) auto;
  align-items: center;
  gap: 28px;
  padding: 22px clamp(22px, 4.5vw, 72px);
  color: rgba(23, 16, 11, .86);
  background: linear-gradient(180deg, rgba(255, 172, 79, .16), rgba(255, 172, 79, 0));
}

.playlist-radar-brand,
.playlist-radar-header__actions,
.playlist-radar-action {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.playlist-radar-brand {
  justify-self: start;
  gap: 14px;
  color: var(--page-ink);
  text-decoration: none;
  font-family: "Unbounded", "Avenir Next Condensed", "Arial Narrow", sans-serif;
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: .02em;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .14);
}

.playlist-radar-brand__mark {
  position: relative;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(31, 17, 8, .5);
  border-radius: 50%;
  background:
    radial-gradient(circle at center, rgba(31, 17, 8, .92) 0 7%, transparent 8%),
    radial-gradient(circle at center, transparent 0 37%, rgba(31, 17, 8, .36) 38% 40%, transparent 41%),
    radial-gradient(circle at center, transparent 0 62%, rgba(31, 17, 8, .42) 63% 65%, transparent 66%);
  box-shadow:
    inset 0 1px 0 rgba(255, 236, 183, .18),
    0 0 0 7px rgba(31, 17, 8, .035),
    0 14px 36px rgba(80, 31, 7, .15);
  overflow: hidden;
}

.playlist-radar-brand__mark::before,
.playlist-radar-brand__mark::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.playlist-radar-brand__mark::before {
  inset: 6px;
  border-radius: 50%;
  background:
    conic-gradient(from -35deg, transparent 0 292deg, rgba(31, 17, 8, .88) 293deg 316deg, transparent 317deg 360deg),
    radial-gradient(circle at center, rgba(31, 17, 8, .12), transparent 58%);
  animation: playlistMarkSpin 6s linear infinite;
}

.playlist-radar-brand__mark::after {
  left: 12px;
  top: 15px;
  width: 17px;
  height: 12px;
  border: 1px solid rgba(31, 17, 8, .8);
  border-radius: 3px;
  background:
    linear-gradient(180deg, rgba(255, 231, 174, .38), rgba(31, 17, 8, .08)),
    repeating-linear-gradient(180deg, rgba(31, 17, 8, .8) 0 1px, transparent 1px 4px);
  box-shadow: 0 0 0 1px rgba(255, 224, 156, .1);
  transform-origin: 50% 130%;
  animation: playlistCardTilt 2.4s ease-in-out infinite;
}

.playlist-radar-header__actions {
  justify-self: end;
  gap: 10px;
}

.playlist-radar-action {
  min-height: 44px;
  padding: 0 25px;
  border: 1px solid rgba(255, 228, 174, .2);
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(55, 28, 11, .95), rgba(28, 14, 6, .96));
  color: rgba(255, 248, 239, .96);
  backdrop-filter: blur(16px);
  box-shadow:
    inset 0 1px 0 rgba(255, 243, 220, .18),
    inset 0 -8px 18px rgba(0, 0, 0, .18),
    0 18px 42px rgba(23, 16, 11, .2);
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.playlist-radar-action:hover {
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255, 243, 220, .24),
    inset 0 -8px 18px rgba(0, 0, 0, .16),
    0 22px 46px rgba(23, 16, 11, .24);
}

.playlist-radar-action--login {
  min-width: 92px;
  justify-content: center;
  padding-inline: 20px;
}

.playlist-radar-action--register {
  color: rgba(43, 17, 5, .98);
  background:
    radial-gradient(circle at 22% 0, rgba(255, 245, 215, .42), transparent 35%),
    linear-gradient(180deg, rgba(255, 171, 62, .96), rgba(219, 87, 14, .96));
  border-color: rgba(71, 24, 5, .24);
  box-shadow:
    inset 0 1px 0 rgba(255, 249, 226, .42),
    inset 0 -10px 22px rgba(82, 22, 2, .18),
    0 18px 42px rgba(143, 51, 6, .18);
}

.playlist-radar-action--register:hover {
  box-shadow:
    inset 0 1px 0 rgba(255, 249, 226, .5),
    inset 0 -10px 22px rgba(82, 22, 2, .16),
    0 22px 50px rgba(143, 51, 6, .24);
}

.playlist-radar-hero {
  position: relative;
  z-index: 3;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  align-items: start;
  justify-content: flex-start;
  padding: clamp(158px, 18vh, 190px) clamp(76px, 7vw, 122px) 0 clamp(22px, 3vw, 48px);
  text-align: left;
}

.playlist-radar-hero h1 {
  position: relative;
  align-self: flex-end;
  max-width: min(900px, 54vw);
  margin: 0 0 0 auto;
  color: rgba(255, 246, 223, .98);
  font-family: "Unbounded", "Manrope", "Avenir Next", Arial, sans-serif;
  text-align: center;
  transform: translateY(10px);
  filter: drop-shadow(0 16px 30px rgba(35, 11, 2, .28));
}

.playlist-radar-hero h1::before {
  content: none;
}

.playlist-radar-hero h1::after {
  content: "";
  position: absolute;
  left: 12%;
  right: 12%;
  top: 50%;
  height: 1px;
  z-index: -1;
  background: linear-gradient(90deg, transparent, rgba(255, 239, 198, .34), transparent);
}

.playlist-radar-hero h1 span {
  display: block;
  white-space: nowrap;
}

.playlist-radar-title__main {
  position: relative;
  width: max-content;
  margin-left: auto;
  color: rgba(255, 248, 230, .98);
  -webkit-text-stroke: 1.15px rgba(19, 7, 2, .66);
  paint-order: stroke fill;
  font-size: clamp(40px, 3.7vw, 72px);
  line-height: .95;
  font-weight: 900;
  letter-spacing: -.055em;
  text-transform: uppercase;
  transform: skewX(-5deg);
  transform-origin: 100% 50%;
  text-shadow:
    0 2px 0 rgba(27, 9, 2, .34),
    1px 3px 0 rgba(20, 7, 2, .2),
    0 1px 0 rgba(255, 255, 255, .34),
    0 13px 26px rgba(40, 12, 2, .32),
    0 0 28px rgba(255, 224, 148, .16);
}

.playlist-radar-title__sub {
  width: max-content;
  margin: .42em 0 0 auto;
  padding: .44em .82em .5em;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(67, 24, 6, .84), rgba(29, 9, 2, .78));
  color: rgba(255, 240, 204, .94);
  font-family: "Manrope", "Avenir Next", Arial, sans-serif;
  font-size: clamp(16px, 1.45vw, 25px);
  line-height: 1;
  font-weight: 900;
  letter-spacing: -.015em;
  text-transform: uppercase;
  -webkit-text-stroke: .5px rgba(18, 6, 2, .58);
  box-shadow:
    inset 0 1px 0 rgba(255, 248, 223, .18),
    0 18px 38px rgba(41, 12, 2, .22);
  backdrop-filter: blur(9px);
}

.playlist-radar-audience {
  position: absolute;
  z-index: 4;
  display: none;
  color: rgba(39, 16, 5, .94);
  font-family: "Manrope", "Avenir Next", Arial, sans-serif;
  isolation: isolate;
}

.playlist-radar-page[data-graph="surge"] .playlist-radar-audience--surge,
.playlist-radar-page[data-graph="dock"] .playlist-radar-audience--dock,
.playlist-radar-page[data-graph="tower"] .playlist-radar-audience--tower {
  display: block;
}

.playlist-radar-audience::before,
.playlist-radar-audience::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.playlist-radar-audience::before {
  inset: -1px;
  z-index: -1;
  border-radius: inherit;
  background:
    radial-gradient(circle at 18% 0, rgba(255, 255, 232, .54), transparent 35%),
    linear-gradient(135deg, rgba(255, 226, 147, .7), rgba(234, 132, 36, .36) 50%, rgba(95, 32, 4, .38));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 235, .42),
    inset 0 -18px 34px rgba(65, 22, 4, .1),
    0 28px 70px rgba(60, 18, 3, .22);
  backdrop-filter: blur(14px) saturate(1.08);
}

.playlist-radar-audience::after {
  top: 0;
  bottom: 0;
  left: -46%;
  width: 36%;
  z-index: 2;
  background: linear-gradient(105deg, transparent, rgba(255, 255, 244, .5), transparent);
  transform: skewX(-18deg);
  animation: playlistAudienceGlint 5.6s ease-in-out infinite;
}

.playlist-radar-audience__meta {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.playlist-radar-audience__meta span {
  display: block;
  color: rgba(44, 17, 5, .76);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .1em;
  line-height: 1.12;
  text-transform: uppercase;
}

.playlist-radar-audience__meta strong {
  color: rgba(29, 10, 3, .97);
  font-family: "Unbounded", "Manrope", sans-serif;
  font-size: clamp(30px, 2.35vw, 42px);
  line-height: .86;
  letter-spacing: -.07em;
  text-shadow: 0 1px 0 rgba(255, 246, 219, .36);
}

.playlist-radar-audience__stage {
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.playlist-radar-audience--surge {
  top: clamp(342px, 42.4vh, 412px);
  right: clamp(42px, 4.3vw, 84px);
  width: min(820px, 50vw);
  min-height: 288px;
  padding: 26px 30px 26px;
  border-radius: 34px;
  transform: perspective(1040px) rotateY(-6deg) rotateX(4deg);
  transform-origin: 80% 50%;
}

.playlist-radar-audience--surge::before {
  background:
    radial-gradient(circle at 14% 0, rgba(255, 164, 65, .34), transparent 34%),
    radial-gradient(circle at 88% 18%, rgba(255, 119, 21, .32), transparent 28%),
    linear-gradient(135deg, rgba(24, 13, 7, .92) 0%, rgba(32, 16, 8, .9) 42%, rgba(105, 42, 9, .8) 72%, rgba(221, 99, 15, .66) 100%),
    rgba(24, 12, 6, .88);
  box-shadow:
    inset 0 1px 0 rgba(255, 218, 158, .26),
    inset 0 -26px 44px rgba(0, 0, 0, .24),
    inset 0 0 0 1px rgba(255, 143, 42, .24),
    0 30px 74px rgba(44, 18, 4, .34),
    0 0 42px rgba(255, 115, 24, .16);
  backdrop-filter: blur(18px) saturate(1.12);
}

.playlist-radar-audience--surge::after {
  background: linear-gradient(105deg, transparent, rgba(255, 184, 90, .34), rgba(255, 245, 220, .34), transparent);
}

.playlist-radar-audience--surge .playlist-radar-audience__meta span {
  color: rgba(255, 194, 112, .82);
  font-size: 12px;
}

.playlist-radar-audience--surge .playlist-radar-audience__meta strong {
  color: rgba(255, 240, 213, .96);
  font-size: clamp(44px, 3.45vw, 66px);
  text-shadow:
    0 2px 0 rgba(0, 0, 0, .26),
    0 0 24px rgba(255, 123, 27, .34);
}

.playlist-radar-audience--surge .playlist-radar-audience__stage {
  height: 188px;
  margin-top: 17px;
  border-radius: 25px;
  background:
    linear-gradient(rgba(255, 152, 51, .14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 152, 51, .11) 1px, transparent 1px),
    radial-gradient(circle at 82% 24%, rgba(255, 126, 24, .2), transparent 28%),
    linear-gradient(180deg, rgba(15, 8, 5, .5), rgba(64, 28, 8, .32));
  background-size: 100% 44px, 68px 100%, auto, auto;
  box-shadow:
    inset 0 1px 0 rgba(255, 196, 114, .16),
    inset 0 -18px 28px rgba(0, 0, 0, .18),
    inset 0 0 0 1px rgba(255, 133, 31, .1);
}

.playlist-radar-audience--surge .playlist-radar-audience__area {
  fill: rgba(255, 119, 22, .18);
  opacity: .9;
}

.playlist-radar-audience--surge .playlist-radar-audience__line {
  stroke: rgba(255, 241, 213, .96);
  filter: drop-shadow(0 0 18px rgba(255, 125, 28, .7));
}

.playlist-radar-audience--surge .playlist-radar-audience__spark {
  background: rgba(255, 248, 230, .98);
  box-shadow:
    0 0 0 8px rgba(255, 127, 31, .18),
    0 0 28px rgba(255, 137, 35, .84);
}

.playlist-radar-audience--surge svg {
  position: absolute;
  inset: 7px 10px 9px;
  width: calc(100% - 20px);
  height: calc(100% - 16px);
  overflow: visible;
}

.playlist-radar-audience__area {
  fill: url("#audienceSurgeFill");
  opacity: .78;
  animation: playlistAudienceArea 4.2s ease-in-out infinite;
}

.playlist-radar-audience__line {
  fill: none;
  stroke: url("#audienceSurgeLine");
  stroke-width: 8;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 720;
  stroke-dashoffset: 720;
  filter: drop-shadow(0 0 15px rgba(255, 239, 177, .5));
  animation: playlistAudienceDraw 4.2s cubic-bezier(.2, .78, .2, 1) infinite;
}

.playlist-radar-audience__spark {
  position: absolute;
  z-index: 3;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(255, 255, 247, .98);
  box-shadow:
    0 0 0 8px rgba(255, 237, 170, .14),
    0 0 26px rgba(255, 241, 186, .82);
  animation: playlistAudienceSpark 4.2s ease-in-out infinite;
}

.playlist-radar-audience__spark--one {
  left: 28%;
  top: 55%;
  animation-delay: .45s;
}

.playlist-radar-audience__spark--two {
  left: 61%;
  top: 34%;
  animation-delay: 1.35s;
}

.playlist-radar-audience__spark--three {
  left: 89%;
  top: 18%;
  animation-delay: 2.15s;
}

.playlist-radar-audience--dock {
  right: clamp(64px, 6vw, 118px);
  bottom: clamp(36px, 5.2vh, 56px);
  width: min(720px, 45vw);
  min-height: 148px;
  padding: 17px 19px 18px;
  border-radius: 28px;
  transform: perspective(1100px) rotateY(-5deg) rotateX(7deg);
  transform-origin: 82% 80%;
}

.playlist-radar-audience--dock .playlist-radar-audience__stage {
  height: 74px;
  margin-top: 13px;
  border-radius: 18px;
  background:
    linear-gradient(90deg, rgba(61, 22, 5, .14) 1px, transparent 1px),
    linear-gradient(180deg, rgba(61, 22, 5, .12) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 241, 190, .08), rgba(95, 32, 5, .05));
  background-size: 52px 100%, 100% 26px, auto;
}

.playlist-radar-audience__wave {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 10px;
  height: 58px;
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: 11px;
  align-items: end;
}

.playlist-radar-audience__wave span,
.playlist-radar-audience__tower-bars span {
  display: block;
  height: calc(var(--h) * 100%);
  min-height: 10px;
  border-radius: 999px 999px 8px 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 246, .95), rgba(255, 223, 132, .68) 47%, rgba(75, 24, 4, .2));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 245, .4),
    0 0 18px rgba(255, 231, 147, .25);
  transform-origin: bottom;
  animation: playlistAudienceBars 2.8s ease-in-out infinite;
  animation-delay: var(--d);
}

.playlist-radar-audience__track {
  position: absolute;
  left: 14px;
  right: 14px;
  top: 50%;
  height: 3px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, rgba(61, 22, 5, .05), rgba(255, 255, 240, .86) 68%, rgba(255, 234, 167, .22));
  box-shadow: 0 0 22px rgba(255, 236, 169, .28);
  animation: playlistAudienceTrack 3.4s ease-in-out infinite;
}

.playlist-radar-audience--tower {
  top: clamp(314px, 36vh, 380px);
  right: clamp(70px, 6vw, 112px);
  width: min(250px, 16vw);
  min-height: 332px;
  padding: 20px 19px 18px;
  border-radius: 30px;
  transform: perspective(1000px) rotateY(-12deg) rotateX(4deg);
  transform-origin: 90% 55%;
}

.playlist-radar-audience__meta--tower {
  display: block;
}

.playlist-radar-audience__meta--tower strong {
  display: block;
  margin-top: 11px;
  font-size: clamp(36px, 3.2vw, 58px);
}

.playlist-radar-audience--tower .playlist-radar-audience__stage {
  height: 190px;
  margin-top: 22px;
  border-radius: 24px;
  background:
    radial-gradient(ellipse at 50% 100%, rgba(255, 245, 200, .32), transparent 43%),
    linear-gradient(180deg, rgba(64, 23, 6, .12), rgba(255, 226, 145, .08));
  box-shadow:
    inset 0 1px 0 rgba(255, 252, 226, .2),
    inset 0 -20px 28px rgba(65, 22, 4, .08);
}

.playlist-radar-audience__tower-bars {
  position: absolute;
  left: 26px;
  right: 26px;
  bottom: 18px;
  height: 138px;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 9px;
  align-items: end;
}

.playlist-radar-audience__orbit {
  position: absolute;
  left: 50%;
  bottom: 21px;
  width: 164px;
  height: 52px;
  border: 2px solid rgba(255, 248, 220, .38);
  border-radius: 50%;
  transform: translateX(-50%) perspective(180px) rotateX(66deg);
  box-shadow:
    0 0 22px rgba(255, 236, 165, .22),
    inset 0 0 20px rgba(255, 236, 165, .1);
  animation: playlistAudienceOrbit 4s ease-in-out infinite;
}

.playlist-radar-listener-graph {
  position: absolute;
  right: clamp(48px, 5.4vw, 98px);
  bottom: clamp(52px, 7.2vh, 92px);
  z-index: 2;
  width: min(560px, 36vw);
  min-height: 258px;
  padding: 18px 20px 16px;
  border: 1px solid rgba(255, 242, 205, .36);
  border-radius: 28px;
  background:
    radial-gradient(circle at 18% 0, rgba(255, 250, 224, .5), transparent 34%),
    linear-gradient(135deg, rgba(255, 218, 127, .72), rgba(236, 126, 36, .46) 47%, rgba(91, 30, 5, .5)),
    rgba(255, 169, 63, .18);
  box-shadow:
    inset 0 2px 0 rgba(255, 254, 238, .4),
    inset 0 -22px 34px rgba(76, 24, 4, .14),
    12px 15px 0 rgba(82, 29, 6, .13),
    0 30px 70px rgba(54, 17, 3, .26);
  backdrop-filter: blur(14px) saturate(1.12);
  transform: perspective(1000px) rotateY(-8deg) rotateX(5deg);
  transform-origin: 75% 70%;
  overflow: hidden;
}

.playlist-radar-listener-graph::before {
  content: "";
  position: absolute;
  inset: -40% auto -40% -55%;
  width: 48%;
  background: linear-gradient(105deg, transparent, rgba(255, 255, 245, .62), transparent);
  transform: skewX(-18deg);
  animation: playlistGraphShine 4.8s ease-in-out infinite;
  pointer-events: none;
}

.playlist-radar-listener-graph::after {
  content: "";
  position: absolute;
  right: 18px;
  top: 18px;
  width: 48px;
  height: 4px;
  border-radius: 999px;
  background: rgba(72, 25, 5, .28);
  box-shadow:
    0 9px 0 rgba(72, 25, 5, .15),
    0 18px 0 rgba(72, 25, 5, .08);
}

.playlist-radar-listener-graph__top,
.playlist-radar-listener-graph__bottom {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.playlist-radar-listener-graph__top span,
.playlist-radar-listener-graph__bottom {
  color: rgba(44, 17, 5, .78);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.playlist-radar-listener-graph__top strong {
  padding-right: 74px;
  color: rgba(37, 14, 4, .96);
  font-family: "Unbounded", "Manrope", sans-serif;
  font-size: clamp(30px, 2.6vw, 46px);
  line-height: .9;
  letter-spacing: -.06em;
  text-shadow: 0 1px 0 rgba(255, 242, 204, .34);
}

.playlist-radar-listener-graph__stage {
  position: relative;
  z-index: 1;
  height: 172px;
  margin-top: 12px;
  border-radius: 20px;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(74, 27, 7, .2), rgba(255, 218, 125, .08)),
    radial-gradient(circle at 84% 18%, rgba(255, 249, 224, .28), transparent 24%);
  box-shadow:
    inset 0 1px 0 rgba(255, 250, 230, .22),
    inset 0 -20px 28px rgba(61, 19, 3, .1);
}

.playlist-radar-listener-graph__grid {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(58, 21, 5, .12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(58, 21, 5, .1) 1px, transparent 1px);
  background-size: 100% 42px, 56px 100%;
  mask-image: linear-gradient(180deg, transparent, #000 18%, #000 84%, transparent);
}

.playlist-radar-listener-graph__svg {
  position: absolute;
  inset: 10px 12px 12px;
  width: calc(100% - 24px);
  height: calc(100% - 22px);
  overflow: visible;
}

.playlist-radar-listener-graph__area {
  fill: url("#listenerGraphFill");
  opacity: .8;
  animation: playlistGraphArea 3.8s ease-in-out infinite;
}

.playlist-radar-listener-graph__line {
  fill: none;
  stroke: url("#listenerGraphLine");
  stroke-width: 7;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 760;
  stroke-dashoffset: 760;
  filter: drop-shadow(0 0 16px rgba(255, 238, 169, .54));
  animation: playlistGraphLine 3.8s cubic-bezier(.22, .75, .24, 1) infinite;
}

.playlist-radar-listener-graph__line--ghost {
  stroke-width: 18;
  opacity: .12;
  animation-delay: .18s;
}

.playlist-radar-listener-graph__bars {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 14px;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  align-items: end;
  gap: 10px;
  height: 92px;
  opacity: .72;
}

.playlist-radar-listener-graph__bars span {
  display: block;
  height: calc(var(--bar) * 100%);
  min-height: 18px;
  border-radius: 999px 999px 6px 6px;
  background:
    linear-gradient(180deg, rgba(255, 255, 246, .92), rgba(255, 222, 134, .58) 42%, rgba(80, 29, 6, .18));
  box-shadow: 0 0 18px rgba(255, 232, 153, .22);
  transform-origin: bottom;
  animation: playlistGraphBar 2.6s ease-in-out infinite;
  animation-delay: var(--delay);
}

.playlist-radar-listener-graph__pulse {
  position: absolute;
  z-index: 3;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255, 255, 245, .98);
  box-shadow:
    0 0 0 6px rgba(255, 239, 181, .16),
    0 0 22px rgba(255, 239, 181, .72);
  animation: playlistGraphPulse 3.8s ease-in-out infinite;
}

.playlist-radar-listener-graph__pulse--one {
  left: 31%;
  top: 50%;
  animation-delay: .28s;
}

.playlist-radar-listener-graph__pulse--two {
  left: 62%;
  top: 28%;
  animation-delay: 1.2s;
}

.playlist-radar-listener-graph__pulse--three {
  left: 89%;
  top: 10%;
  animation-delay: 2s;
}

.playlist-radar-listener-graph__bottom {
  margin-top: 12px;
  font-size: 11px;
}

.playlist-radar-feature-deck {
  position: absolute;
  right: clamp(46px, 5.2vw, 96px);
  bottom: clamp(52px, 7vh, 88px);
  z-index: 2;
  width: min(850px, 55vw);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  perspective: 1200px;
  transform: perspective(1200px) rotateX(6deg) rotateY(-6deg);
  transform-origin: 75% 50%;
}

.playlist-radar-feature {
  --feature-x: 0;
  --feature-y: 0;
  --feature-ry: -6deg;
  --feature-rx: 4deg;
  position: relative;
  min-height: 94px;
  display: grid;
  grid-template-columns: 66px 1fr;
  align-items: center;
  gap: 16px;
  padding: 15px 20px 15px 15px;
  border: 1px solid rgba(255, 241, 202, .42);
  border-radius: 22px;
  background:
    radial-gradient(circle at 16% 16%, rgba(255, 250, 220, .62), transparent 32%),
    linear-gradient(135deg, rgba(255, 222, 134, .92), rgba(238, 137, 45, .72) 48%, rgba(139, 51, 11, .7)),
    linear-gradient(180deg, rgba(255, 246, 219, .36), rgba(70, 22, 4, .14));
  box-shadow:
    inset 0 2px 0 rgba(255, 252, 230, .46),
    inset 0 -18px 28px rgba(79, 25, 4, .16),
    inset 0 0 0 1px rgba(255, 255, 255, .08),
    9px 12px 0 rgba(91, 33, 6, .18),
    0 26px 48px rgba(62, 20, 3, .24);
  backdrop-filter: blur(12px) saturate(1.08);
  transform: translate3d(var(--feature-x), var(--feature-y), 0) rotateY(var(--feature-ry)) rotateX(var(--feature-rx));
  transform-origin: 50% 50%;
  overflow: hidden;
  animation: playlistFeatureFloat 6.4s ease-in-out infinite;
  transition: box-shadow .22s ease, filter .22s ease;
  will-change: transform;
}

.playlist-radar-feature:nth-child(1) {
  --feature-x: -10px;
  --feature-y: 0;
  --feature-ry: -7deg;
  animation-delay: -.2s;
}

.playlist-radar-feature:nth-child(2) {
  --feature-x: 8px;
  --feature-y: 13px;
  --feature-ry: -4deg;
  animation-delay: -1.5s;
}

.playlist-radar-feature:nth-child(3) {
  --feature-x: 8px;
  --feature-y: -2px;
  --feature-ry: -5deg;
  animation-delay: -2.8s;
}

.playlist-radar-feature:nth-child(4) {
  --feature-x: 24px;
  --feature-y: 12px;
  --feature-ry: -3deg;
  animation-delay: -4.1s;
}

.playlist-radar-feature::before {
  content: "";
  position: absolute;
  top: -42%;
  bottom: -42%;
  left: -65%;
  width: 46%;
  background:
    linear-gradient(105deg, transparent, rgba(255, 255, 245, .64) 42%, transparent 74%);
  opacity: .72;
  transform: skewX(-18deg) translateX(-20%);
  animation: playlistFeatureShine 5.8s ease-in-out infinite;
  pointer-events: none;
}

.playlist-radar-feature::after {
  content: "";
  position: absolute;
  right: 13px;
  top: 11px;
  width: 38px;
  height: 3px;
  border-radius: 999px;
  background: rgba(85, 31, 6, .24);
  box-shadow:
    0 8px 0 rgba(85, 31, 6, .14),
    0 16px 0 rgba(85, 31, 6, .08);
  opacity: .7;
}

.playlist-radar-feature__icon {
  position: relative;
  z-index: 1;
  width: 62px;
  height: 62px;
  border: 1px solid rgba(255, 236, 184, .45);
  border-radius: 19px;
  background:
    radial-gradient(circle at 30% 18%, rgba(255, 237, 179, .32), transparent 38%),
    linear-gradient(180deg, rgba(61, 28, 10, .95), rgba(20, 7, 2, .94));
  box-shadow:
    inset 0 1px 0 rgba(255, 248, 223, .28),
    inset 0 -12px 20px rgba(0, 0, 0, .24),
    0 14px 26px rgba(35, 10, 2, .28);
  transform-style: preserve-3d;
  transition: transform .38s cubic-bezier(.2, .8, .18, 1);
}

.playlist-radar-feature__icon::before,
.playlist-radar-feature__icon::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.playlist-radar-feature--base .playlist-radar-feature__icon::before {
  left: 18px;
  top: 15px;
  width: 27px;
  height: 31px;
  border-radius: 50%;
  background:
    radial-gradient(ellipse at center, transparent 0 56%, rgba(255, 215, 123, .9) 58% 65%, transparent 67%),
    repeating-linear-gradient(180deg, rgba(255, 225, 143, .92) 0 3px, transparent 3px 7px);
  transform: perspective(70px) rotateX(60deg);
}

.playlist-radar-feature--base .playlist-radar-feature__icon::after {
  left: 23px;
  top: 23px;
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255, 225, 143, .9);
  border-radius: 50%;
  box-shadow: 0 0 18px rgba(255, 202, 94, .4);
}

.playlist-radar-feature--analytics .playlist-radar-feature__icon::before {
  left: 14px;
  right: 14px;
  top: 16px;
  bottom: 16px;
  background:
    linear-gradient(90deg, transparent 0 9%, rgba(255, 225, 143, .9) 10% 16%, transparent 17% 29%, rgba(255, 225, 143, .9) 30% 38%, transparent 39% 51%, rgba(255, 225, 143, .9) 52% 61%, transparent 62% 75%, rgba(255, 225, 143, .9) 76% 84%, transparent 85%),
    linear-gradient(180deg, transparent 0 40%, rgba(255, 225, 143, .38) 42% 48%, transparent 50%);
  filter: drop-shadow(0 0 12px rgba(255, 204, 98, .36));
}

.playlist-radar-feature--analytics .playlist-radar-feature__icon::after {
  left: 13px;
  right: 13px;
  bottom: 16px;
  height: 2px;
  border-radius: 999px;
  background: rgba(255, 225, 143, .86);
}

.playlist-radar-feature--risk .playlist-radar-feature__icon::before {
  left: 18px;
  top: 14px;
  width: 28px;
  height: 33px;
  clip-path: polygon(50% 0, 100% 18%, 92% 68%, 50% 100%, 8% 68%, 0 18%);
  background: linear-gradient(180deg, rgba(255, 224, 135, .96), rgba(188, 64, 25, .82));
  box-shadow: 0 0 18px rgba(255, 112, 66, .34);
}

.playlist-radar-feature--risk .playlist-radar-feature__icon::after {
  left: 30px;
  top: 21px;
  width: 3px;
  height: 14px;
  border-radius: 999px;
  background: rgba(40, 16, 5, .86);
  box-shadow: 0 18px 0 -1px rgba(40, 16, 5, .86);
}

.playlist-radar-feature--placement .playlist-radar-feature__icon::before {
  left: 15px;
  top: 20px;
  width: 34px;
  height: 22px;
  border: 2px solid rgba(255, 225, 143, .92);
  border-radius: 999px;
  transform: rotate(-18deg);
}

.playlist-radar-feature--placement .playlist-radar-feature__icon::after {
  left: 25px;
  top: 18px;
  width: 17px;
  height: 25px;
  border-right: 3px solid rgba(255, 225, 143, .92);
  border-bottom: 3px solid rgba(255, 225, 143, .92);
  transform: rotate(38deg);
  filter: drop-shadow(0 0 12px rgba(255, 204, 98, .38));
}

.playlist-radar-feature__text {
  position: relative;
  z-index: 1;
  color: rgba(39, 16, 5, .94);
  font-family: "Manrope", "Avenir Next", sans-serif;
  font-size: 15.5px;
  line-height: 1.08;
  font-weight: 900;
  text-shadow: 0 1px 0 rgba(255, 239, 196, .32);
}

.playlist-radar-feature:hover {
  animation: playlistFeatureOrbit .9s cubic-bezier(.18, .86, .25, 1) both;
  filter: saturate(1.18) brightness(1.04);
  box-shadow:
    inset 0 2px 0 rgba(255, 252, 230, .58),
    inset 0 -18px 28px rgba(79, 25, 4, .12),
    13px 16px 0 rgba(91, 33, 6, .18),
    0 34px 62px rgba(62, 20, 3, .3),
    0 0 34px rgba(255, 207, 101, .22);
}

.playlist-radar-feature:hover .playlist-radar-feature__icon {
  transform: rotateZ(360deg) rotateY(22deg) scale(1.06);
}

.playlist-radar-result {
  position: relative;
  z-index: 4;
  min-height: 100svh;
  padding: clamp(54px, 6vh, 78px) clamp(28px, 5vw, 82px);
  overflow: hidden;
  color: rgba(255, 244, 224, .96);
  background:
    radial-gradient(circle at 70% 26%, rgba(255, 104, 18, .2), transparent 32%),
    radial-gradient(circle at 18% 85%, rgba(255, 142, 37, .16), transparent 28%),
    linear-gradient(180deg, #241006 0%, #100806 48%, #070504 100%);
}

.playlist-radar-result::before,
.playlist-radar-result::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.playlist-radar-result::before {
  left: -8%;
  right: -8%;
  top: -220px;
  height: 360px;
  border-radius: 0 0 50% 50%;
  background:
    radial-gradient(ellipse at center, rgba(255, 153, 56, .28), transparent 64%),
    linear-gradient(180deg, rgba(255, 150, 46, .24), rgba(14, 7, 5, 0));
  filter: blur(2px);
}

.playlist-radar-result::after {
  inset: 0;
  background:
    linear-gradient(rgba(255, 139, 37, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 139, 37, .045) 1px, transparent 1px);
  background-size: 100% 76px, 92px 100%;
  mask-image: radial-gradient(ellipse at 52% 48%, #000 0 52%, transparent 78%);
  opacity: .62;
}

.playlist-radar-result__shell {
  position: relative;
  z-index: 1;
  max-width: 1460px;
  min-height: clamp(610px, 78svh, 720px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(360px, .92fr) minmax(500px, 1.08fr);
  grid-template-areas: "copy proof";
  column-gap: clamp(30px, 4.2vw, 68px);
  align-items: center;
  transform: translateY(42px);
}

.playlist-radar-result__copy {
  grid-area: copy;
  align-self: center;
}

.playlist-radar-result__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid rgba(255, 126, 29, .3);
  border-radius: 999px;
  background: rgba(255, 118, 24, .1);
  color: rgba(255, 180, 92, .94);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
  box-shadow:
    inset 0 1px 0 rgba(255, 215, 162, .1),
    0 0 24px rgba(255, 115, 24, .12);
}

.playlist-radar-result__eyebrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ff7a1a;
  box-shadow: 0 0 18px rgba(255, 122, 26, .8);
}

.playlist-radar-result h2 {
  max-width: 800px;
  margin: 18px 0 0;
  font-family: "Unbounded", "Manrope", sans-serif;
  font-size: clamp(46px, 5.05vw, 82px);
  font-weight: 900;
  line-height: .94;
  letter-spacing: -.065em;
  color: rgba(255, 247, 232, .98);
  text-transform: uppercase;
  text-shadow:
    0 2px 0 rgba(0, 0, 0, .34),
    0 20px 44px rgba(0, 0, 0, .36),
    0 0 34px rgba(255, 129, 29, .16);
}

.playlist-radar-result h2 span {
  display: block;
  white-space: nowrap;
}

.playlist-radar-result__points {
  max-width: 760px;
  margin: 24px 0 0;
  padding: 0;
  display: grid;
  gap: 12px;
  list-style: none;
}

.playlist-radar-result__points li {
  position: relative;
  min-height: 34px;
  display: flex;
  align-items: center;
  padding: 0 0 0 28px;
  color: rgba(255, 228, 198, .85);
  font-size: clamp(15px, 1.06vw, 18px);
  line-height: 1.22;
  font-weight: 900;
}

.playlist-radar-result__points li:last-child {
  white-space: nowrap;
  font-size: clamp(14px, .98vw, 17px);
}

.playlist-radar-result__points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #ff801f;
  box-shadow:
    0 0 0 7px rgba(255, 128, 31, .08),
    0 0 22px rgba(255, 128, 31, .42);
  transform: translateY(-50%);
}

.playlist-radar-result__copy p {
  max-width: 660px;
  margin: 18px 0 0;
  color: rgba(255, 228, 198, .82);
  font-size: clamp(15px, 1.14vw, 19px);
  line-height: 1.46;
  font-weight: 800;
}

.playlist-radar-result__stats {
  margin-top: 30px;
  display: grid;
  grid-template-columns: 1.16fr repeat(3, minmax(0, 1fr));
  gap: 11px;
}

.playlist-radar-result__stat {
  position: relative;
  min-height: 92px;
  padding: 14px 16px 13px;
  border: 1px solid rgba(255, 136, 37, .22);
  border-radius: 19px;
  background:
    radial-gradient(circle at 18% 0, rgba(255, 180, 91, .2), transparent 42%),
    linear-gradient(180deg, rgba(35, 18, 9, .86), rgba(14, 7, 5, .78));
  box-shadow:
    inset 0 1px 0 rgba(255, 213, 156, .13),
    0 18px 38px rgba(0, 0, 0, .22);
  overflow: hidden;
  transform: perspective(760px) rotateX(var(--stat-rx, 0deg)) rotateY(var(--stat-ry, 0deg)) translate3d(0, 0, 0);
  transform-style: preserve-3d;
  will-change: transform;
  animation: playlistResultStatDrift 7.8s ease-in-out infinite;
  animation-delay: var(--stat-delay, 0s);
}

.playlist-radar-result__stat:nth-child(1) {
  --stat-rx: 2deg;
  --stat-ry: -4deg;
  --stat-delay: -.8s;
}

.playlist-radar-result__stat:nth-child(2) {
  --stat-rx: -1deg;
  --stat-ry: 3deg;
  --stat-delay: -2.2s;
}

.playlist-radar-result__stat:nth-child(3) {
  --stat-rx: 2deg;
  --stat-ry: 2deg;
  --stat-delay: -3.4s;
}

.playlist-radar-result__stat:nth-child(4) {
  --stat-rx: -2deg;
  --stat-ry: -3deg;
  --stat-delay: -4.7s;
}

.playlist-radar-result__stat::after {
  content: "";
  position: absolute;
  left: 13px;
  right: 13px;
  bottom: 10px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 127, 28, .8), rgba(255, 228, 176, .26), transparent);
}

.playlist-radar-result__stat span {
  display: block;
  color: rgba(255, 177, 94, .78);
  font-size: 10.5px;
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.playlist-radar-result__stat strong {
  display: block;
  margin-top: 12px;
  color: rgba(255, 248, 232, .98);
  font-family: "Unbounded", "Manrope", sans-serif;
  font-size: clamp(23px, 1.72vw, 31px);
  line-height: .9;
  letter-spacing: -.08em;
  white-space: nowrap;
}

.playlist-radar-result__stat--hot {
  border-color: rgba(255, 138, 32, .44);
  background:
    radial-gradient(circle at 18% 0, rgba(255, 150, 40, .34), transparent 45%),
    linear-gradient(135deg, rgba(68, 28, 8, .96), rgba(23, 10, 6, .88));
}

.playlist-radar-result__proof {
  grid-area: proof;
  position: relative;
  align-self: center;
  transform: translateY(18px);
}

.playlist-radar-result__proof::before {
  content: "";
  position: absolute;
  inset: 10% -8% -12% 14%;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(255, 121, 24, .2), transparent 67%);
  filter: blur(16px);
  pointer-events: none;
}

.playlist-radar-result__screen {
  position: relative;
  padding: 17px;
  border: 1px solid rgba(255, 134, 32, .32);
  border-radius: 31px;
  background:
    radial-gradient(circle at 12% 0, rgba(255, 164, 74, .2), transparent 34%),
    linear-gradient(135deg, rgba(30, 15, 8, .96), rgba(10, 6, 5, .92) 48%, rgba(95, 38, 8, .75));
  box-shadow:
    inset 0 1px 0 rgba(255, 207, 149, .18),
    inset 0 -30px 58px rgba(0, 0, 0, .22),
    0 44px 120px rgba(0, 0, 0, .36),
    0 0 56px rgba(255, 112, 22, .13);
  transform: perspective(1200px) rotateY(-7deg) rotateX(4deg);
  transform-origin: 58% 52%;
  overflow: hidden;
}

.playlist-radar-result__screen::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(105deg, transparent 0 34%, rgba(255, 255, 255, .09) 43%, transparent 54%),
    radial-gradient(circle at 88% 18%, rgba(255, 127, 24, .2), transparent 28%);
  pointer-events: none;
}

.playlist-radar-result__screen-top {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  margin-bottom: 13px;
  color: rgba(255, 187, 106, .78);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.playlist-radar-result__screen-top strong {
  color: rgba(255, 244, 224, .92);
  font-size: 11px;
  letter-spacing: .14em;
}

.playlist-radar-result__screen video {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  aspect-ratio: 1064 / 376;
  border: 1px solid rgba(255, 138, 32, .22);
  border-radius: 22px;
  background: #080504;
  box-shadow:
    inset 0 1px 0 rgba(255, 210, 148, .12),
    0 22px 48px rgba(0, 0, 0, .34);
  object-fit: cover;
}

.playlist-radar-analytics {
  position: relative;
  z-index: 4;
  min-height: 100svh;
  padding: clamp(72px, 8vh, 106px) clamp(28px, 5vw, 82px);
  overflow: hidden;
  color: rgba(37, 18, 7, .96);
  background:
    radial-gradient(circle at 22% 20%, rgba(255, 226, 149, .58), transparent 28%),
    radial-gradient(circle at 79% 31%, rgba(255, 143, 35, .34), transparent 34%),
    radial-gradient(circle at 52% 92%, rgba(116, 45, 9, .24), transparent 38%),
    linear-gradient(135deg, #f1a244 0%, #df7a2f 44%, #b64d16 100%);
}

.playlist-radar-analytics::before,
.playlist-radar-analytics::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.playlist-radar-analytics::before {
  inset: 0;
  background:
    linear-gradient(rgba(64, 25, 6, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(64, 25, 6, .052) 1px, transparent 1px),
    radial-gradient(ellipse at 50% 12%, rgba(255, 242, 200, .34), transparent 54%),
    linear-gradient(180deg, rgba(12, 7, 4, .1), transparent 28%, rgba(35, 12, 3, .22));
  background-size: 100% 82px, 94px 100%, auto, auto;
}

.playlist-radar-analytics::after {
  left: -12%;
  right: -12%;
  bottom: -38%;
  height: 70%;
  border-radius: 50% 50% 0 0;
  background:
    radial-gradient(ellipse at center, rgba(44, 18, 5, .6), transparent 61%),
    linear-gradient(180deg, transparent, rgba(12, 6, 3, .62));
  opacity: .42;
  filter: blur(1px);
}

.playlist-radar-analytics__shell {
  position: relative;
  z-index: 1;
  max-width: 1460px;
  min-height: clamp(640px, 82svh, 780px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(380px, .86fr) minmax(560px, 1.14fr);
  gap: clamp(36px, 5vw, 78px);
  align-items: center;
}

.playlist-radar-analytics__copy {
  position: relative;
  z-index: 2;
}

.playlist-radar-analytics__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 36px;
  padding: 0 15px;
  border: 1px solid rgba(42, 18, 7, .2);
  border-radius: 999px;
  background: rgba(255, 236, 183, .22);
  color: rgba(42, 18, 7, .76);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
  box-shadow:
    inset 0 1px 0 rgba(255, 247, 220, .35),
    0 20px 46px rgba(96, 35, 5, .12);
  backdrop-filter: blur(14px);
}

.playlist-radar-analytics__eyebrow::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #221006;
  box-shadow:
    0 0 0 6px rgba(34, 16, 6, .08),
    0 0 24px rgba(255, 238, 176, .74);
}

.playlist-radar-analytics h2 {
  max-width: 760px;
  margin: 20px 0 0;
  color: rgba(37, 16, 5, .97);
  font-family: "Unbounded", "Manrope", sans-serif;
  font-size: clamp(42px, 4.8vw, 80px);
  font-weight: 900;
  line-height: .9;
  letter-spacing: -.07em;
  text-transform: uppercase;
  text-shadow:
    0 1px 0 rgba(255, 244, 210, .35),
    0 18px 42px rgba(67, 24, 4, .2);
}

.playlist-radar-analytics h2 span {
  display: block;
}

.playlist-radar-analytics__copy > p {
  max-width: 590px;
  margin: 23px 0 0;
  color: rgba(48, 21, 8, .78);
  font-size: clamp(16px, 1.12vw, 19px);
  line-height: 1.42;
  font-weight: 900;
}

.playlist-radar-analytics__notice {
  position: relative;
  max-width: 630px;
  margin-top: 32px;
  padding: 22px 24px 24px 25px;
  border: 1px solid rgba(255, 218, 149, .18);
  border-radius: 26px;
  background:
    radial-gradient(circle at 12% 0, rgba(255, 151, 42, .26), transparent 42%),
    linear-gradient(135deg, rgba(39, 17, 7, .96), rgba(20, 9, 4, .9) 62%, rgba(92, 33, 6, .84));
  box-shadow:
    inset 0 1px 0 rgba(255, 237, 202, .16),
    inset 0 -18px 34px rgba(0, 0, 0, .18),
    0 28px 68px rgba(72, 25, 4, .22);
  color: rgba(255, 240, 212, .9);
  transform: perspective(900px) rotateY(5deg) rotateX(2deg);
}

.playlist-radar-analytics__notice::before {
  content: "";
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 15px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 126, 21, .9), rgba(255, 238, 179, .22), transparent);
}

.playlist-radar-analytics__notice strong {
  display: block;
  margin-bottom: 9px;
  color: rgba(255, 148, 40, .98);
  font-family: "Unbounded", "Manrope", sans-serif;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.playlist-radar-analytics__notice span {
  display: block;
  max-width: 590px;
  color: rgba(255, 236, 207, .88);
  font-size: clamp(13.5px, .91vw, 16px);
  line-height: 1.38;
  font-weight: 900;
}

.playlist-radar-analytics__console {
  position: relative;
  min-height: clamp(610px, 72svh, 720px);
  transform-style: preserve-3d;
  perspective: 1200px;
}

.playlist-radar-analytics__console::before,
.playlist-radar-analytics__console::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.playlist-radar-analytics__console::before {
  inset: 8% 4% 5%;
  border: 1px solid rgba(53, 22, 7, .12);
  border-radius: 44px;
  background:
    linear-gradient(105deg, rgba(255, 244, 210, .16), transparent 34% 72%, rgba(58, 20, 4, .16)),
    radial-gradient(circle at 48% 44%, rgba(255, 216, 139, .24), transparent 34%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 230, .24),
    inset 0 -28px 48px rgba(72, 24, 4, .09),
    0 40px 90px rgba(82, 28, 4, .14);
  transform: rotateX(58deg) rotateZ(-7deg) translateY(60px);
  transform-origin: center bottom;
}

.playlist-radar-analytics__console::after {
  inset: 3% 8% 11%;
  border-radius: 50%;
  background:
    repeating-conic-gradient(from 18deg, rgba(45, 18, 6, .16) 0 1deg, transparent 1deg 15deg),
    radial-gradient(circle at center, transparent 0 36%, rgba(45, 18, 6, .1) 37% 38%, transparent 39% 58%, rgba(45, 18, 6, .1) 59% 60%, transparent 61%);
  opacity: .42;
  mask-image: radial-gradient(circle at center, transparent 0 17%, #000 18% 70%, transparent 75%);
  transform: perspective(1000px) rotateX(61deg) translateY(34px);
}

.playlist-radar-analytics__core {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: clamp(184px, 17vw, 260px);
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%) perspective(780px) rotateX(62deg);
  transform-style: preserve-3d;
}

.playlist-radar-analytics__core-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1px solid rgba(48, 19, 6, .24);
  background:
    radial-gradient(circle at center, rgba(36, 16, 6, .86) 0 9%, transparent 10%),
    radial-gradient(circle at center, transparent 0 38%, rgba(255, 243, 203, .34) 39% 40%, transparent 41%),
    conic-gradient(from 0deg, rgba(34, 15, 6, .18), rgba(255, 244, 204, .36), rgba(34, 15, 6, .14), rgba(255, 132, 27, .42), rgba(34, 15, 6, .18));
  box-shadow:
    0 0 0 15px rgba(255, 223, 150, .08),
    0 0 38px rgba(255, 158, 54, .2);
  animation: playlistAnalyticsOrbit 12s linear infinite;
}

.playlist-radar-analytics__core-line {
  position: absolute;
  left: 50%;
  top: 50%;
  height: 1px;
  width: clamp(260px, 28vw, 420px);
  background: linear-gradient(90deg, rgba(38, 16, 6, .34), rgba(255, 246, 214, .62), transparent);
  transform-origin: left center;
}

.playlist-radar-analytics__core-line--one {
  transform: rotate(-34deg);
}

.playlist-radar-analytics__core-line--two {
  transform: rotate(38deg);
}

.playlist-radar-analytics__core-line--three {
  width: clamp(220px, 25vw, 360px);
  transform: rotate(152deg);
  opacity: .56;
}

.playlist-radar-analytics__core-dot {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: rgba(255, 249, 221, .98);
  box-shadow:
    0 0 0 10px rgba(255, 249, 221, .1),
    0 0 32px rgba(255, 145, 34, .78);
  transform: translate(-50%, -50%);
}

.playlist-radar-analytics__module {
  position: absolute;
  z-index: 2;
  width: min(312px, 39%);
  min-height: 172px;
  padding: 19px 20px 20px;
  border: 1px solid rgba(44, 19, 7, .15);
  border-radius: 26px;
  background:
    radial-gradient(circle at 14% 0, rgba(255, 239, 190, .36), transparent 38%),
    linear-gradient(145deg, rgba(255, 202, 111, .46), rgba(241, 137, 42, .45) 46%, rgba(78, 27, 5, .2));
  box-shadow:
    inset 0 1px 0 rgba(255, 250, 224, .34),
    inset 0 -18px 28px rgba(99, 35, 5, .08),
    9px 14px 0 rgba(79, 28, 5, .11),
    0 30px 64px rgba(89, 30, 4, .18);
  transform: perspective(900px) rotateX(var(--module-rx, 0deg)) rotateY(var(--module-ry, 0deg)) translate3d(0, 0, 0);
  transform-style: preserve-3d;
  will-change: transform;
  animation: playlistAnalyticsModuleFloat 8s ease-in-out infinite;
  animation-delay: var(--module-delay, 0s);
  overflow: hidden;
}

.playlist-radar-analytics__module::before {
  content: "";
  position: absolute;
  left: -42%;
  top: 0;
  width: 35%;
  height: 100%;
  background: linear-gradient(105deg, transparent, rgba(255, 255, 235, .42), transparent);
  transform: skewX(-18deg);
  animation: playlistAnalyticsShine 6.4s ease-in-out infinite;
  animation-delay: var(--module-delay, 0s);
}

.playlist-radar-analytics__module--base {
  left: 3%;
  top: 3%;
  --module-rx: 5deg;
  --module-ry: 10deg;
  --module-delay: -.4s;
}

.playlist-radar-analytics__module--stats {
  right: 0;
  top: 10%;
  --module-rx: 4deg;
  --module-ry: -9deg;
  --module-delay: -2s;
}

.playlist-radar-analytics__module--links {
  left: 0;
  bottom: 9%;
  --module-rx: -3deg;
  --module-ry: 8deg;
  --module-delay: -3.5s;
}

.playlist-radar-analytics__module--monitoring {
  right: 4%;
  bottom: 0;
  --module-rx: -4deg;
  --module-ry: -10deg;
  --module-delay: -5s;
}

.playlist-radar-analytics__module-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 28px;
  margin-bottom: 14px;
  border-radius: 999px;
  background: rgba(35, 15, 6, .92);
  color: rgba(255, 191, 92, .96);
  font-family: "Russo One", "Manrope", sans-serif;
  font-size: 12px;
  box-shadow:
    inset 0 1px 0 rgba(255, 236, 194, .16),
    0 12px 28px rgba(69, 25, 5, .18);
}

.playlist-radar-analytics__module h3 {
  margin: 0;
  color: rgba(37, 16, 5, .96);
  font-family: "Unbounded", "Manrope", sans-serif;
  font-size: clamp(16px, 1.25vw, 21px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -.04em;
  text-transform: uppercase;
}

.playlist-radar-analytics__module h3 span {
  display: block;
  white-space: nowrap;
}

.playlist-radar-analytics__module p {
  margin: 10px 0 0;
  color: rgba(45, 19, 7, .76);
  font-size: clamp(13px, .9vw, 15px);
  line-height: 1.33;
  font-weight: 900;
}

.playlist-radar-analytics__bars,
.playlist-radar-analytics__contacts,
.playlist-radar-analytics__timeline,
.playlist-radar-analytics__mini-graph {
  margin-top: 15px;
}

.playlist-radar-analytics__bars {
  display: flex;
  align-items: end;
  gap: 8px;
  height: 42px;
}

.playlist-radar-analytics__bars span {
  flex: 1;
  height: calc(var(--h) * 100%);
  min-height: 10px;
  border-radius: 999px 999px 6px 6px;
  background:
    linear-gradient(180deg, rgba(255, 254, 232, .96), rgba(255, 164, 58, .8) 56%, rgba(51, 18, 5, .5));
  box-shadow: 0 0 18px rgba(255, 179, 72, .28);
  animation: playlistAnalyticsBars 2.9s ease-in-out infinite;
}

.playlist-radar-analytics__bars span:nth-child(2) {
  animation-delay: -.7s;
}

.playlist-radar-analytics__bars span:nth-child(3) {
  animation-delay: -1.4s;
}

.playlist-radar-analytics__bars span:nth-child(4) {
  animation-delay: -2s;
}

.playlist-radar-analytics__bars span:nth-child(5) {
  animation-delay: -2.4s;
}

.playlist-radar-analytics__mini-graph {
  height: 46px;
  border-radius: 14px;
  background:
    linear-gradient(rgba(38, 16, 6, .1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(38, 16, 6, .08) 1px, transparent 1px);
  background-size: 100% 23px, 38px 100%;
}

.playlist-radar-analytics__mini-graph svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.playlist-radar-analytics__mini-graph path {
  fill: none;
  stroke: rgba(255, 249, 225, .96);
  stroke-width: 8;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 360;
  filter: drop-shadow(0 0 14px rgba(255, 158, 47, .72));
  animation: playlistAnalyticsGraph 4.4s ease-in-out infinite;
}

.playlist-radar-analytics__contacts {
  display: grid;
  gap: 7px;
}

.playlist-radar-analytics__contacts span {
  height: 12px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, rgba(34, 15, 6, .72), rgba(255, 241, 204, .82) 34%, rgba(255, 146, 38, .6) 72%, transparent);
  box-shadow: 0 0 18px rgba(255, 154, 45, .2);
  animation: playlistAnalyticsContact 3.8s ease-in-out infinite;
}

.playlist-radar-analytics__contacts span:nth-child(2) {
  width: 78%;
  animation-delay: -.9s;
}

.playlist-radar-analytics__contacts span:nth-child(3) {
  width: 58%;
  animation-delay: -1.8s;
}

.playlist-radar-analytics__timeline {
  position: relative;
  height: 38px;
  border-radius: 999px;
  background: rgba(42, 17, 6, .17);
  box-shadow: inset 0 1px 0 rgba(255, 246, 218, .16);
}

.playlist-radar-analytics__timeline::before {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  top: 50%;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(42, 17, 6, .34), rgba(255, 248, 220, .8), rgba(255, 126, 26, .84));
  transform: translateY(-50%);
}

.playlist-radar-analytics__timeline span {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255, 249, 224, .96);
  box-shadow:
    0 0 0 7px rgba(255, 127, 28, .16),
    0 0 22px rgba(255, 127, 28, .54);
  transform: translate(-50%, -50%);
  animation: playlistAnalyticsPulse 2.7s ease-in-out infinite;
}

.playlist-radar-analytics__timeline span:nth-child(1) {
  left: 18%;
}

.playlist-radar-analytics__timeline span:nth-child(2) {
  left: 54%;
  animation-delay: -.8s;
}

.playlist-radar-analytics__timeline span:nth-child(3) {
  left: 84%;
  animation-delay: -1.6s;
}

.playlist-radar-pricing {
  position: relative;
  z-index: 4;
  min-height: 100svh;
  padding: clamp(56px, 5.8vh, 78px) clamp(28px, 5vw, 82px) clamp(18px, 2.4vh, 28px);
  overflow: hidden;
  color: rgba(255, 244, 224, .96);
  background:
    radial-gradient(circle at 26% 16%, rgba(255, 134, 32, .2), transparent 31%),
    radial-gradient(circle at 78% 66%, rgba(255, 95, 14, .2), transparent 32%),
    linear-gradient(180deg, #281207 0%, #120806 47%, #070403 100%);
}

.playlist-radar-pricing::before,
.playlist-radar-pricing::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.playlist-radar-pricing::before {
  inset: 0;
  background:
    linear-gradient(rgba(255, 135, 36, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 135, 36, .045) 1px, transparent 1px),
    radial-gradient(ellipse at 50% 0, rgba(255, 144, 38, .24), transparent 58%);
  background-size: 100% 82px, 92px 100%, auto;
  opacity: .82;
  mask-image: radial-gradient(ellipse at 50% 48%, #000 0 58%, transparent 83%);
}

.playlist-radar-pricing::after {
  left: -18%;
  right: -18%;
  bottom: -32%;
  height: 58%;
  border-radius: 50% 50% 0 0;
  background:
    radial-gradient(ellipse at center, rgba(255, 118, 24, .18), transparent 64%),
    linear-gradient(180deg, transparent, rgba(0, 0, 0, .62));
  filter: blur(2px);
}

.playlist-radar-pricing__shell {
  position: relative;
  z-index: 1;
  max-width: 1460px;
  min-height: calc(100svh - clamp(56px, 5.8vh, 78px) - clamp(18px, 2.4vh, 28px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(360px, .78fr) minmax(650px, 1.22fr);
  grid-template-areas:
    "intro stage"
    "cta stage"
    "legal legal";
  grid-template-rows: auto auto min-content;
  column-gap: clamp(28px, 4.6vw, 72px);
  row-gap: clamp(18px, 2.35vh, 30px);
  align-items: center;
  align-content: space-between;
}

.playlist-radar-pricing__intro {
  grid-area: intro;
  align-self: end;
}

.playlist-radar-pricing__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid rgba(255, 126, 29, .3);
  border-radius: 999px;
  background: rgba(255, 118, 24, .1);
  color: rgba(255, 180, 92, .94);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
  box-shadow:
    inset 0 1px 0 rgba(255, 215, 162, .1),
    0 0 24px rgba(255, 115, 24, .12);
}

.playlist-radar-pricing__eyebrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ff7a1a;
  box-shadow: 0 0 18px rgba(255, 122, 26, .8);
}

.playlist-radar-pricing h2 {
  max-width: 650px;
  margin: 19px 0 0;
  font-family: "Unbounded", "Manrope", sans-serif;
  font-size: clamp(42px, 4.45vw, 76px);
  font-weight: 900;
  line-height: .92;
  letter-spacing: -.067em;
  color: rgba(255, 247, 232, .98);
  text-transform: uppercase;
  text-shadow:
    0 2px 0 rgba(0, 0, 0, .34),
    0 22px 50px rgba(0, 0, 0, .34),
    0 0 38px rgba(255, 122, 26, .15);
}

.playlist-radar-pricing h2 span {
  display: block;
}

.playlist-radar-pricing__intro p {
  max-width: 560px;
  margin: 22px 0 0;
  color: rgba(255, 226, 197, .82);
  font-size: clamp(15px, 1.05vw, 18px);
  line-height: 1.42;
  font-weight: 900;
}

.playlist-radar-pricing__stage {
  grid-area: stage;
  position: relative;
  min-height: clamp(500px, 58svh, 600px);
  transform-style: preserve-3d;
  perspective: 1250px;
}

.playlist-radar-pricing__stage::before {
  content: "";
  position: absolute;
  inset: 15% 2% 4%;
  border: 1px solid rgba(255, 136, 35, .16);
  border-radius: 48px;
  background:
    radial-gradient(circle at 50% 47%, rgba(255, 129, 31, .2), transparent 32%),
    linear-gradient(110deg, rgba(255, 228, 184, .08), transparent 35% 74%, rgba(255, 102, 18, .1));
  box-shadow:
    inset 0 1px 0 rgba(255, 219, 161, .11),
    inset 0 -34px 58px rgba(0, 0, 0, .2),
    0 46px 110px rgba(0, 0, 0, .26);
  transform: rotateX(62deg) rotateZ(-5deg) translateY(72px);
  transform-origin: center bottom;
}

.playlist-radar-pricing__card {
  position: absolute;
  z-index: 2;
  top: 50%;
  width: min(372px, 46.5%);
  min-height: clamp(500px, 52svh, 542px);
  padding: 24px 24px 22px;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(255, 137, 35, .26);
  border-radius: 32px;
  background:
    radial-gradient(circle at 16% 0, rgba(255, 162, 60, .24), transparent 38%),
    linear-gradient(142deg, rgba(34, 17, 8, .96), rgba(12, 7, 5, .92) 50%, rgba(92, 35, 7, .8));
  box-shadow:
    inset 0 1px 0 rgba(255, 218, 158, .17),
    inset 0 -28px 46px rgba(0, 0, 0, .2),
    12px 18px 0 rgba(0, 0, 0, .18),
    0 42px 110px rgba(0, 0, 0, .34),
    0 0 46px rgba(255, 112, 22, .12);
  transform-style: preserve-3d;
  will-change: transform;
  animation: playlistPricingFloat 8.6s ease-in-out infinite;
  overflow: hidden;
}

.playlist-radar-pricing__card::before,
.playlist-radar-pricing__card::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.playlist-radar-pricing__card::before {
  inset: 0;
  background:
    linear-gradient(118deg, transparent 0 34%, rgba(255, 255, 255, .1) 44%, transparent 55%),
    radial-gradient(circle at 90% 12%, rgba(255, 136, 35, .24), transparent 28%);
}

.playlist-radar-pricing__card::after {
  left: 24px;
  right: 24px;
  bottom: 20px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 127, 28, .9), rgba(255, 232, 184, .28), transparent);
}

.playlist-radar-pricing__card--regular {
  left: 2%;
  transform: translateY(-50%) perspective(1150px) rotateY(8deg) rotateX(3deg) rotateZ(-2deg);
  animation-delay: -.8s;
}

.playlist-radar-pricing__card--auto {
  right: 1%;
  border-color: rgba(255, 166, 65, .42);
  background:
    radial-gradient(circle at 18% 0, rgba(255, 178, 76, .3), transparent 38%),
    radial-gradient(circle at 88% 24%, rgba(255, 103, 18, .18), transparent 28%),
    linear-gradient(142deg, rgba(55, 23, 8, .98), rgba(16, 8, 5, .94) 46%, rgba(130, 49, 8, .84));
  transform: translateY(-48%) perspective(1150px) rotateY(-8deg) rotateX(5deg) rotateZ(2deg);
  animation-delay: -3.4s;
}

.playlist-radar-pricing__badge {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 13px;
  border: 1px solid rgba(255, 136, 35, .25);
  border-radius: 999px;
  background: rgba(255, 126, 24, .11);
  color: rgba(255, 183, 97, .95);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.playlist-radar-pricing__card h3 {
  position: relative;
  z-index: 1;
  margin: 24px 0 0;
  color: rgba(255, 246, 229, .98);
  font-family: "Unbounded", "Manrope", sans-serif;
  font-size: clamp(25px, 2.05vw, 38px);
  font-weight: 900;
  line-height: .95;
  letter-spacing: -.06em;
  text-transform: uppercase;
  text-shadow:
    0 2px 0 rgba(0, 0, 0, .32),
    0 16px 34px rgba(0, 0, 0, .34);
}

.playlist-radar-pricing__card--auto h3 {
  font-size: clamp(22px, 1.68vw, 32px);
  letter-spacing: -.064em;
  white-space: nowrap;
}

.playlist-radar-pricing__price {
  position: relative;
  z-index: 1;
  margin-top: 24px;
}

.playlist-radar-pricing__price strong {
  display: block;
  color: rgba(255, 247, 232, .99);
  font-family: "Unbounded", "Manrope", sans-serif;
  font-size: clamp(42px, 3.65vw, 68px);
  line-height: .86;
  letter-spacing: -.08em;
  white-space: nowrap;
}

.playlist-radar-pricing__price span {
  display: block;
  margin-top: 10px;
  color: rgba(255, 176, 88, .88);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.playlist-radar-pricing__card p {
  position: relative;
  z-index: 1;
  margin: 20px 0 0;
  color: rgba(255, 226, 197, .78);
  font-size: 14px;
  line-height: 1.38;
  font-weight: 900;
}

.playlist-radar-pricing__card ul {
  position: relative;
  z-index: 1;
  margin: 22px 0 24px;
  padding: 0;
  display: grid;
  gap: 10px;
  list-style: none;
}

.playlist-radar-pricing__card li {
  position: relative;
  padding-left: 22px;
  color: rgba(255, 238, 215, .86);
  font-size: 13px;
  line-height: 1.22;
  font-weight: 900;
}

.playlist-radar-pricing__card li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .42em;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #ff801f;
  box-shadow:
    0 0 0 6px rgba(255, 128, 31, .08),
    0 0 18px rgba(255, 128, 31, .52);
}

.playlist-radar-pricing__renew {
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: 44px;
  margin-top: auto;
  flex-shrink: 0;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(255, 142, 41, .18), rgba(255, 142, 41, .06));
  color: rgba(255, 196, 116, .95);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .08em;
  line-height: 1.1;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  box-shadow:
    inset 0 1px 0 rgba(255, 230, 186, .13),
    inset 0 0 0 1px rgba(255, 134, 35, .16);
}

.playlist-radar-pricing__orb {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: clamp(180px, 18vw, 260px);
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%) perspective(700px) rotateX(62deg);
}

.playlist-radar-pricing__orb span {
  position: absolute;
  inset: calc(var(--i, 0) * 24px);
  border: 1px solid rgba(255, 151, 48, .2);
  border-radius: 50%;
  box-shadow:
    0 0 32px rgba(255, 116, 24, .14),
    inset 0 0 24px rgba(255, 116, 24, .08);
  animation: playlistPricingOrbit 9s linear infinite;
}

.playlist-radar-pricing__orb span:nth-child(1) {
  --i: 0;
}

.playlist-radar-pricing__orb span:nth-child(2) {
  --i: 1;
  animation-duration: 7.5s;
  animation-direction: reverse;
}

.playlist-radar-pricing__orb span:nth-child(3) {
  --i: 2;
  animation-duration: 11s;
}

.playlist-radar-pricing__cta {
  grid-area: cta;
  align-self: start;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.playlist-radar-pricing__cta a {
  position: relative;
  min-height: 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 30px;
  border: 1px solid rgba(255, 195, 116, .3);
  border-radius: 999px;
  background:
    radial-gradient(circle at 22% 0, rgba(255, 236, 190, .34), transparent 34%),
    linear-gradient(180deg, rgba(255, 126, 27, .96), rgba(184, 66, 8, .96));
  color: rgba(40, 15, 4, .98);
  font-family: "Unbounded", "Manrope", sans-serif;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: -.02em;
  text-decoration: none;
  text-transform: uppercase;
  box-shadow:
    inset 0 1px 0 rgba(255, 250, 224, .38),
    inset 0 -10px 22px rgba(82, 22, 2, .18),
    0 26px 62px rgba(255, 102, 18, .22);
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}

.playlist-radar-pricing__cta a:hover {
  transform: translateY(-3px) scale(1.02);
  filter: saturate(1.08) brightness(1.04);
  box-shadow:
    inset 0 1px 0 rgba(255, 250, 224, .46),
    inset 0 -10px 22px rgba(82, 22, 2, .16),
    0 32px 74px rgba(255, 102, 18, .28);
}

.playlist-radar-pricing__cta span {
  color: rgba(255, 212, 169, .64);
  font-size: 13px;
  font-weight: 900;
}

.playlist-radar-pricing__legal {
  grid-area: legal;
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: none;
  margin: 0;
  display: grid;
  grid-template-columns: minmax(520px, 1fr) minmax(260px, .52fr);
  gap: clamp(16px, 2vw, 24px);
  align-items: end;
  padding: 16px 20px;
  border: 1px solid rgba(255, 132, 32, .18);
  border-radius: 28px;
  background:
    radial-gradient(circle at 18% 0, rgba(255, 160, 54, .12), transparent 34%),
    linear-gradient(115deg, rgba(30, 13, 6, .72), rgba(9, 5, 3, .82) 54%, rgba(72, 25, 5, .58));
  box-shadow:
    inset 0 1px 0 rgba(255, 220, 165, .1),
    0 26px 70px rgba(0, 0, 0, .22);
}

.playlist-radar-pricing__legal-copy strong,
.playlist-radar-pricing__legal-entity span:first-child {
  display: block;
  color: rgba(255, 237, 212, .94);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.playlist-radar-pricing__legal-copy p {
  margin: 8px 0 0;
  color: rgba(255, 218, 181, .67);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.38;
}

.playlist-radar-pricing__legal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 11px;
}

.playlist-radar-pricing__legal-links a {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  border: 1px solid rgba(255, 135, 35, .23);
  border-radius: 999px;
  background: rgba(255, 120, 26, .09);
  color: rgba(255, 198, 126, .9);
  font-size: 11px;
  font-weight: 900;
  text-decoration: none;
  text-transform: uppercase;
  transition: transform .2s ease, background .2s ease, color .2s ease;
}

.playlist-radar-pricing__legal-links a:hover {
  transform: translateY(-2px);
  background: rgba(255, 127, 30, .16);
  color: rgba(255, 240, 214, .96);
}

.playlist-radar-pricing__legal-entity {
  display: grid;
  gap: 8px;
  justify-items: end;
  color: rgba(255, 211, 169, .7);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  text-align: right;
}

.playlist-radar-pricing__legal-entity span:not(:first-child) {
  letter-spacing: .02em;
}

@keyframes playlistResultStatDrift {
  0%,
  100% {
    transform: perspective(760px) rotateX(var(--stat-rx)) rotateY(var(--stat-ry)) translate3d(0, 0, 0);
  }

  45% {
    transform: perspective(760px) rotateX(calc(var(--stat-rx) + 2deg)) rotateY(calc(var(--stat-ry) + 5deg)) translate3d(0, -5px, 18px);
  }

  70% {
    transform: perspective(760px) rotateX(calc(var(--stat-rx) - 1deg)) rotateY(calc(var(--stat-ry) - 3deg)) translate3d(0, -2px, 8px);
  }
}

@keyframes playlistAnalyticsOrbit {
  to {
    transform: rotate(360deg);
  }
}

@keyframes playlistAnalyticsModuleFloat {
  0%,
  100% {
    transform: perspective(900px) rotateX(var(--module-rx)) rotateY(var(--module-ry)) translate3d(0, 0, 0);
  }

  48% {
    transform: perspective(900px) rotateX(calc(var(--module-rx) + 2deg)) rotateY(calc(var(--module-ry) - 4deg)) translate3d(0, -9px, 22px);
  }

  72% {
    transform: perspective(900px) rotateX(calc(var(--module-rx) - 1deg)) rotateY(calc(var(--module-ry) + 2deg)) translate3d(0, -3px, 10px);
  }
}

@keyframes playlistAnalyticsShine {
  0%,
  45% {
    opacity: 0;
    transform: skewX(-18deg) translateX(0);
  }

  60% {
    opacity: .68;
  }

  100% {
    opacity: 0;
    transform: skewX(-18deg) translateX(430%);
  }
}

@keyframes playlistAnalyticsBars {
  0%,
  100% {
    transform: scaleY(.68);
    opacity: .62;
  }

  52% {
    transform: scaleY(1.1);
    opacity: 1;
  }
}

@keyframes playlistAnalyticsGraph {
  0% {
    opacity: 0;
    stroke-dashoffset: 360;
    transform: translateY(10px);
  }

  18%,
  72% {
    opacity: 1;
  }

  72% {
    stroke-dashoffset: 0;
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    stroke-dashoffset: -360;
    transform: translateY(-10px);
  }
}

@keyframes playlistAnalyticsContact {
  0%,
  100% {
    opacity: .52;
    transform: scaleX(.72);
    transform-origin: left center;
  }

  48% {
    opacity: 1;
    transform: scaleX(1);
  }
}

@keyframes playlistAnalyticsPulse {
  0%,
  100% {
    opacity: .62;
    transform: translate(-50%, -50%) scale(.86);
  }

  50% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.16);
  }
}

@keyframes playlistPricingFloat {
  0%,
  100% {
    translate: 0 0;
  }

  48% {
    translate: 0 -9px;
  }

  72% {
    translate: 0 -3px;
  }
}

@keyframes playlistPricingOrbit {
  to {
    transform: rotate(360deg);
  }
}

@keyframes playlistMarkSpin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes playlistCardTilt {
  0%,
  100% {
    transform: rotate(-5deg) translateY(0);
  }

  50% {
    transform: rotate(7deg) translateY(-1px);
  }
}

@keyframes playlistFeatureFloat {
  0%,
  100% {
    transform: translate3d(var(--feature-x), var(--feature-y), 0) rotateY(var(--feature-ry)) rotateX(var(--feature-rx));
  }

  50% {
    transform: translate3d(calc(var(--feature-x) + 2px), calc(var(--feature-y) - 5px), 18px) rotateY(calc(var(--feature-ry) + 1deg)) rotateX(calc(var(--feature-rx) - 1deg));
  }
}

@keyframes playlistFeatureOrbit {
  0% {
    transform: translate3d(var(--feature-x), var(--feature-y), 0) rotateY(var(--feature-ry)) rotateX(var(--feature-rx)) scale(1);
  }

  42% {
    transform: translate3d(calc(var(--feature-x) + 8px), calc(var(--feature-y) - 14px), 34px) rotateY(calc(var(--feature-ry) + 26deg)) rotateX(calc(var(--feature-rx) + 9deg)) rotateZ(2deg) scale(1.05);
  }

  100% {
    transform: translate3d(calc(var(--feature-x) + 4px), calc(var(--feature-y) - 8px), 22px) rotateY(calc(var(--feature-ry) + 10deg)) rotateX(calc(var(--feature-rx) + 5deg)) rotateZ(.6deg) scale(1.035);
  }
}

@keyframes playlistFeatureShine {
  0%,
  42% {
    transform: skewX(-18deg) translateX(-30%);
    opacity: 0;
  }

  58% {
    opacity: .62;
  }

  100% {
    transform: skewX(-18deg) translateX(330%);
    opacity: 0;
  }
}

@keyframes playlistGraphLine {
  0% {
    stroke-dashoffset: 760;
    opacity: 0;
    transform: translateY(18px);
  }

  16% {
    opacity: 1;
  }

  68% {
    stroke-dashoffset: 0;
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    stroke-dashoffset: -760;
    opacity: 0;
    transform: translateY(-22px);
  }
}

@keyframes playlistGraphArea {
  0%,
  18% {
    opacity: 0;
    transform: translateY(18px) scaleY(.72);
    transform-origin: bottom;
  }

  62% {
    opacity: .82;
    transform: translateY(0) scaleY(1);
  }

  100% {
    opacity: 0;
    transform: translateY(-18px) scaleY(1.04);
  }
}

@keyframes playlistGraphBar {
  0%,
  100% {
    transform: scaleY(.48) translateY(8px);
    opacity: .54;
  }

  48% {
    transform: scaleY(1.08) translateY(-8px);
    opacity: .96;
  }
}

@keyframes playlistGraphPulse {
  0%,
  22% {
    opacity: 0;
    transform: translateY(24px) scale(.7);
  }

  50% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  100% {
    opacity: 0;
    transform: translateY(-28px) scale(1.2);
  }
}

@keyframes playlistGraphShine {
  0%,
  48% {
    transform: skewX(-18deg) translateX(0);
    opacity: 0;
  }

  62% {
    opacity: .72;
  }

  100% {
    transform: skewX(-18deg) translateX(360%);
    opacity: 0;
  }
}

@keyframes playlistAudienceGlint {
  0%,
  54% {
    transform: skewX(-18deg) translateX(0);
    opacity: 0;
  }

  68% {
    opacity: .7;
  }

  100% {
    transform: skewX(-18deg) translateX(420%);
    opacity: 0;
  }
}

@keyframes playlistAudienceDraw {
  0% {
    stroke-dashoffset: 720;
    opacity: 0;
    transform: translateY(14px);
  }

  18% {
    opacity: 1;
  }

  72% {
    stroke-dashoffset: 0;
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    stroke-dashoffset: -720;
    opacity: 0;
    transform: translateY(-18px);
  }
}

@keyframes playlistAudienceArea {
  0%,
  24% {
    opacity: 0;
    transform: translateY(14px) scaleY(.72);
    transform-origin: bottom;
  }

  66% {
    opacity: .8;
    transform: translateY(0) scaleY(1);
  }

  100% {
    opacity: 0;
    transform: translateY(-12px) scaleY(1.04);
  }
}

@keyframes playlistAudienceSpark {
  0%,
  22% {
    opacity: 0;
    transform: translateY(18px) scale(.68);
  }

  46% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  100% {
    opacity: 0;
    transform: translateY(-24px) scale(1.18);
  }
}

@keyframes playlistAudienceBars {
  0%,
  100% {
    opacity: .58;
    transform: scaleY(.56) translateY(5px);
  }

  48% {
    opacity: .96;
    transform: scaleY(1.12) translateY(-7px);
  }
}

@keyframes playlistAudienceTrack {
  0%,
  100% {
    opacity: .36;
    transform: scaleX(.62);
    transform-origin: left center;
  }

  54% {
    opacity: 1;
    transform: scaleX(1);
  }
}

@keyframes playlistAudienceOrbit {
  0%,
  100% {
    opacity: .48;
    transform: translateX(-50%) perspective(180px) rotateX(66deg) scale(.9);
  }

  48% {
    opacity: .96;
    transform: translateX(-50%) perspective(180px) rotateX(66deg) scale(1.06);
  }
}

@media (min-width: 861px) and (max-width: 1180px) {
  .playlist-radar-video {
    object-position: 24% center;
  }

  .playlist-radar-header {
    padding-inline: clamp(28px, 4vw, 46px);
  }

  .playlist-radar-hero {
    padding: clamp(126px, 15vh, 158px) clamp(28px, 4vw, 46px) 0;
  }

  .playlist-radar-hero h1 {
    max-width: min(600px, 58vw);
  }

  .playlist-radar-hero h1 span {
    white-space: normal;
  }

  .playlist-radar-title__main {
    width: auto;
    max-width: 100%;
    font-size: clamp(38px, 4.4vw, 52px);
    line-height: .92;
    text-wrap: balance;
  }

  .playlist-radar-title__sub {
    width: fit-content;
    max-width: 100%;
    margin-left: auto;
    font-size: clamp(16px, 2vw, 21px);
  }

  .playlist-radar-audience--surge {
    top: auto;
    right: clamp(28px, 4vw, 48px);
    bottom: clamp(32px, 5vh, 58px);
    width: min(560px, 54vw);
    min-height: 218px;
    padding: 20px 22px;
    border-radius: 30px;
    transform: perspective(980px) rotateY(-5deg) rotateX(5deg);
  }

  .playlist-radar-audience--surge .playlist-radar-audience__meta strong {
    font-size: clamp(38px, 4.4vw, 52px);
  }

  .playlist-radar-audience--surge .playlist-radar-audience__stage {
    height: 130px;
    margin-top: 14px;
  }
}

@media (max-width: 860px) {
  .playlist-radar-video--hero {
    inset: auto;
    left: 50%;
    top: clamp(186px, 21svh, 218px);
    width: clamp(880px, 210vw, 1040px);
    height: auto;
    aspect-ratio: 2560 / 1426;
    max-width: none;
    object-fit: contain;
    object-position: center;
    background: transparent;
    transform: translate3d(-39%, 0, 0);
    opacity: .98;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 10%, #000 88%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 10%, #000 88%, transparent 100%);
  }

  .playlist-radar-video--fill {
    display: block;
    inset: 0 0 auto;
    left: 0;
    top: 0;
    width: 100%;
    height: 100svh;
    aspect-ratio: auto;
    z-index: -3;
    object-fit: cover;
    object-position: 26% center;
    opacity: .58;
    filter: blur(20px) saturate(1.08);
    transform: scale(1.12);
  }

  .playlist-radar-header {
    height: 76px;
    grid-template-columns: 1fr auto;
    padding: 18px;
  }

  .playlist-radar-nav {
    display: none;
  }

  .playlist-radar-header__actions {
    gap: 8px;
  }

  .playlist-radar-brand {
    font-size: 12px;
  }

  .playlist-radar-brand__mark {
    width: 32px;
    height: 32px;
  }

  .playlist-radar-action {
    min-height: 40px;
    padding-inline: 14px;
    font-size: 12px;
  }

  .playlist-radar-action--login {
    min-width: 70px;
  }

  .playlist-radar-hero {
    min-height: 100svh;
    display: block;
    padding: 0;
    overflow: hidden;
  }

  .playlist-radar-hero h1 {
    position: absolute;
    left: clamp(12px, 3.6vw, 24px);
    right: clamp(12px, 3.6vw, 24px);
    top: clamp(96px, 10.6svh, 116px);
    z-index: 5;
    max-width: none;
    margin: 0;
    text-align: center;
    transform: rotate(-.6deg);
  }

  .playlist-radar-hero h1 span {
    white-space: nowrap;
  }

  .playlist-radar-title__main {
    width: auto;
    max-width: 100%;
    margin-inline: auto;
    font-size: clamp(28px, 7vw, 40px);
    line-height: .86;
    letter-spacing: -.06em;
    text-wrap: nowrap;
    -webkit-text-stroke-width: .85px;
  }

  .playlist-radar-title__sub {
    width: fit-content;
    max-width: min(100%, 520px);
    margin: 8px auto 0;
    padding: .46em .72em .5em;
    font-size: clamp(11px, 2.86vw, 15px);
    line-height: 1;
    letter-spacing: -.02em;
    text-wrap: nowrap;
  }

  .playlist-radar-feature-deck {
    display: none;
  }

  .playlist-radar-listener-graph {
    right: 18px;
    bottom: 24px;
    width: min(420px, calc(100vw - 36px));
    min-height: 210px;
    transform: none;
  }

  .playlist-radar-listener-graph__stage {
    height: 132px;
  }

  .playlist-radar-page[data-graph="surge"] .playlist-radar-audience--surge {
    display: block !important;
  }

  .playlist-radar-audience--dock,
  .playlist-radar-audience--tower {
    display: none !important;
  }

  .playlist-radar-audience--surge {
    left: clamp(18px, 5.4vw, 32px);
    right: clamp(18px, 5.4vw, 32px);
    top: auto;
    bottom: max(18px, env(safe-area-inset-bottom));
    width: auto;
    min-height: 162px;
    padding: 16px 17px 17px;
    border-radius: 23px;
    transform: perspective(760px) rotateX(4deg);
    transform-origin: 50% 100%;
  }

  .playlist-radar-audience--surge .playlist-radar-audience__meta {
    gap: 12px;
  }

  .playlist-radar-audience--surge .playlist-radar-audience__meta span {
    font-size: 10px;
  }

  .playlist-radar-audience--surge .playlist-radar-audience__meta strong {
    font-size: clamp(30px, 8vw, 42px);
  }

  .playlist-radar-audience--surge .playlist-radar-audience__stage {
    height: 94px;
    margin-top: 10px;
    border-radius: 18px;
  }

  .playlist-radar-result {
    min-height: auto;
    padding: 82px 18px 64px;
  }

  .playlist-radar-result__shell {
    min-height: auto;
    grid-template-columns: 1fr;
    grid-template-areas:
      "copy"
      "proof";
    gap: 28px;
    transform: none;
  }

  .playlist-radar-result h2 {
    font-size: clamp(34px, 8.5vw, 64px);
  }

  .playlist-radar-result__points li,
  .playlist-radar-result__copy p {
    font-size: 16px;
  }

  .playlist-radar-result__points li:last-child {
    white-space: normal;
  }

  .playlist-radar-result__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .playlist-radar-result__proof {
    transform: none;
  }

  .playlist-radar-result__screen {
    padding: 14px;
    border-radius: 28px;
    transform: none;
  }

  .playlist-radar-analytics {
    min-height: auto;
    padding: 78px 18px 72px;
  }

  .playlist-radar-analytics__shell {
    min-height: auto;
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .playlist-radar-analytics h2 {
    font-size: clamp(34px, 8.2vw, 64px);
  }

  .playlist-radar-analytics__notice {
    transform: none;
  }

  .playlist-radar-analytics__console {
    min-height: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    perspective: none;
  }

  .playlist-radar-analytics__console::before,
  .playlist-radar-analytics__console::after,
  .playlist-radar-analytics__core {
    display: none;
  }

  .playlist-radar-analytics__module {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    width: auto;
    min-height: 180px;
    transform: none;
  }

  .playlist-radar-pricing {
    min-height: auto;
    padding: 82px 18px 72px;
  }

  .playlist-radar-pricing__shell {
    min-height: auto;
    grid-template-columns: 1fr;
    grid-template-areas:
      "intro"
      "stage"
      "cta"
      "legal";
    gap: 30px;
  }

  .playlist-radar-pricing h2 {
    font-size: clamp(34px, 8.2vw, 64px);
  }

  .playlist-radar-pricing__stage {
    min-height: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    perspective: none;
  }

  .playlist-radar-pricing__stage::before,
  .playlist-radar-pricing__orb {
    display: none;
  }

  .playlist-radar-pricing__card {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    width: auto;
    min-height: 480px;
    transform: none;
  }

  .playlist-radar-pricing__card--regular,
  .playlist-radar-pricing__card--auto {
    transform: none;
  }

  .playlist-radar-pricing__legal {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    max-width: none;
    margin: 0;
    grid-area: legal;
    grid-template-columns: 1fr;
    align-items: start;
  }

  .playlist-radar-pricing__legal-entity {
    justify-items: start;
    text-align: left;
  }

}

@media (max-width: 520px) {
  .playlist-radar-video--hero {
    inset: auto;
    left: 50%;
    top: clamp(188px, 21.6svh, 218px);
    width: clamp(880px, 211vw, 980px);
    transform: translate3d(-33.5%, 0, 0);
  }

  .playlist-radar-video--fill {
    inset: 0 0 auto;
    left: 0;
    top: 0;
    width: 100%;
    height: 100svh;
    object-fit: cover;
    object-position: 26% center;
    opacity: .58;
    filter: blur(20px) saturate(1.08);
    transform: scale(1.12);
  }

  .playlist-radar-header {
    gap: 12px;
  }

  .playlist-radar-brand span:last-child {
    display: none;
  }

  .playlist-radar-action {
    padding-inline: 12px;
  }

  .playlist-radar-hero h1 {
    left: 18px;
    right: 18px;
    top: clamp(96px, 10.4svh, 112px);
  }

  .playlist-radar-hero h1 span {
    white-space: nowrap;
  }

  .playlist-radar-title__main {
    font-size: clamp(25px, 6.35vw, 29px);
    letter-spacing: -.055em;
    -webkit-text-stroke-width: .75px;
  }

  .playlist-radar-title__kicker {
    margin-inline: auto;
  }

  .playlist-radar-title__sub {
    font-size: clamp(10.5px, 2.75vw, 12.6px);
  }

  .playlist-radar-audience--surge {
    left: 16px;
    right: 16px;
    min-height: 158px;
    padding: 15px 16px 16px;
    border-radius: 22px;
  }

  .playlist-radar-audience--surge .playlist-radar-audience__stage {
    height: 90px;
  }

  .playlist-radar-listener-graph {
    display: none;
  }

  .playlist-radar-result__stats {
    grid-template-columns: 1fr;
  }

  .playlist-radar-result__stat {
    min-height: 86px;
  }

  .playlist-radar-result__screen-top {
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }

  .playlist-radar-analytics h2 {
    font-size: clamp(32px, 10vw, 46px);
  }

  .playlist-radar-analytics__copy > p,
  .playlist-radar-analytics__notice span {
    font-size: 15px;
  }

  .playlist-radar-analytics__console {
    grid-template-columns: 1fr;
  }

  .playlist-radar-analytics__module {
    min-height: 168px;
  }

  .playlist-radar-pricing h2 {
    font-size: clamp(32px, 10vw, 46px);
  }

  .playlist-radar-pricing__stage {
    grid-template-columns: 1fr;
  }

  .playlist-radar-pricing__card {
    min-height: auto;
  }

  .playlist-radar-pricing__price strong {
    font-size: clamp(38px, 12vw, 54px);
  }

  .playlist-radar-pricing__cta a {
    width: 100%;
  }
}

@media (max-width: 860px) {
  .playlist-radar-hero,
  .playlist-radar-result,
  .playlist-radar-analytics,
  .playlist-radar-pricing {
    contain: paint;
  }

  .playlist-radar-video--fill,
  .playlist-radar-video--hero {
    display: none;
  }

  .playlist-radar-video--mobile {
    display: block;
    inset: 0 0 auto;
    left: 0;
    top: 0;
    z-index: -1;
    width: 100%;
    height: 100svh;
    aspect-ratio: auto;
    object-fit: cover;
    object-position: center;
    filter: none;
    opacity: 1;
    transform: none;
    contain: layout paint;
    will-change: auto;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .playlist-radar-brand__mark::before,
  .playlist-radar-brand__mark::after,
  .playlist-radar-audience::after,
  .playlist-radar-audience__area,
  .playlist-radar-audience__line,
  .playlist-radar-audience__spark,
  .playlist-radar-result__stat,
  .playlist-radar-analytics__core-ring,
  .playlist-radar-analytics__module,
  .playlist-radar-analytics__module::before,
  .playlist-radar-analytics__bars span,
  .playlist-radar-analytics__mini-graph path,
  .playlist-radar-analytics__contacts span,
  .playlist-radar-analytics__timeline span,
  .playlist-radar-pricing__card,
  .playlist-radar-pricing__orb span {
    animation: none !important;
    will-change: auto;
  }

  .playlist-radar-audience__line,
  .playlist-radar-analytics__mini-graph path {
    stroke-dashoffset: 0;
  }

  .playlist-radar-audience__area {
    opacity: .92;
  }

  .playlist-radar-audience__spark {
    opacity: .72;
  }

  .playlist-radar-analytics__module::before {
    left: auto;
    right: -6%;
    opacity: .26;
    transform: skewX(-18deg);
  }

  .playlist-radar-action,
  .playlist-radar-title__sub,
  .playlist-radar-audience,
  .playlist-radar-audience::before,
  .playlist-radar-audience--surge::before,
  .playlist-radar-listener-graph,
  .playlist-radar-feature,
  .playlist-radar-analytics__eyebrow {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .playlist-radar-result::before,
  .playlist-radar-result__proof::before,
  .playlist-radar-analytics::after,
  .playlist-radar-pricing::after {
    filter: none;
  }

  .playlist-radar-result {
    min-height: 100svh;
    padding: clamp(26px, 4svh, 38px) 16px clamp(22px, 3.2svh, 32px);
    display: flex;
    align-items: stretch;
  }

  .playlist-radar-result__shell {
    width: min(100%, 680px);
    min-height: calc(100svh - clamp(48px, 7.2svh, 70px));
    grid-template-columns: 1fr;
    grid-template-areas:
      "copy"
      "proof";
    grid-template-rows: auto auto;
    gap: clamp(12px, 2svh, 18px);
    align-content: space-between;
    align-items: stretch;
    transform: none;
  }

  .playlist-radar-result__eyebrow {
    min-height: 28px;
    padding-inline: 12px;
    font-size: 9px;
  }

  .playlist-radar-result h2 {
    margin-top: 10px;
    font-size: clamp(38px, 10vw, 56px);
    line-height: .88;
  }

  .playlist-radar-result__points {
    margin-top: clamp(13px, 2svh, 19px);
    gap: clamp(8px, 1.3svh, 11px);
  }

  .playlist-radar-result__points li,
  .playlist-radar-result__points li:last-child {
    min-height: auto;
    padding-left: 22px;
    font-size: clamp(12.4px, 3.05vw, 15px);
    line-height: 1.16;
    white-space: normal;
  }

  .playlist-radar-result__points li::before {
    width: 9px;
    height: 9px;
  }

  .playlist-radar-result__stats {
    margin-top: clamp(14px, 2svh, 19px);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .playlist-radar-result__stat {
    min-height: clamp(70px, 8.6svh, 82px);
    padding: 10px 12px 11px;
    border-radius: 16px;
  }

  .playlist-radar-result__stat span {
    font-size: 8.5px;
  }

  .playlist-radar-result__stat strong {
    margin-top: 7px;
    font-size: clamp(23px, 5.9vw, 32px);
  }

  .playlist-radar-result__proof {
    transform: none;
  }

  .playlist-radar-result__screen {
    padding: clamp(10px, 1.6svh, 14px);
    border-radius: 22px;
    transform: none;
  }

  .playlist-radar-result__screen-top {
    margin-bottom: 8px;
    font-size: 9px;
  }

  .playlist-radar-result__screen video {
    border-radius: 14px;
  }

  .playlist-radar-analytics {
    min-height: 100svh;
    padding: clamp(26px, 4svh, 38px) 16px clamp(22px, 3.2svh, 32px);
    display: flex;
    align-items: stretch;
  }

  .playlist-radar-analytics__shell {
    width: min(100%, 720px);
    min-height: calc(100svh - clamp(48px, 7.2svh, 70px));
    display: flex;
    flex-direction: column;
    gap: clamp(10px, 1.6svh, 15px);
    justify-content: space-between;
  }

  .playlist-radar-analytics__copy {
    display: contents;
  }

  .playlist-radar-analytics__eyebrow,
  .playlist-radar-analytics h2,
  .playlist-radar-analytics__copy > p {
    order: 1;
  }

  .playlist-radar-analytics__console {
    order: 2;
    min-height: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(10px, 1.55svh, 14px);
    perspective: none;
  }

  .playlist-radar-analytics__notice {
    order: 3;
    max-width: none;
    margin: 0;
    padding: clamp(13px, 1.8svh, 17px) 15px clamp(15px, 2svh, 19px);
    border-radius: 18px;
    transform: none;
  }

  .playlist-radar-analytics h2 {
    margin-top: 9px;
    font-size: clamp(34px, 8.6vw, 54px);
    line-height: .88;
  }

  .playlist-radar-analytics__copy > p {
    margin-top: 0;
    font-size: clamp(12.5px, 3vw, 15px);
    line-height: 1.22;
  }

  .playlist-radar-analytics__module {
    position: relative;
    width: auto;
    min-height: clamp(136px, 17.2svh, 158px);
    padding: clamp(13px, 1.7svh, 16px) 13px clamp(14px, 1.9svh, 17px);
    border-radius: 18px;
    transform: none;
  }

  .playlist-radar-analytics__module-index {
    width: 30px;
    height: 24px;
    margin-bottom: 8px;
    font-size: 10px;
  }

  .playlist-radar-analytics__module h3 {
    font-size: clamp(13px, 3vw, 16px);
  }

  .playlist-radar-analytics__module p {
    margin-top: 7px;
    font-size: clamp(10.5px, 2.6vw, 13px);
    line-height: 1.22;
  }

  .playlist-radar-analytics__bars,
  .playlist-radar-analytics__contacts,
  .playlist-radar-analytics__timeline,
  .playlist-radar-analytics__mini-graph {
    margin-top: 9px;
  }

  .playlist-radar-analytics__bars,
  .playlist-radar-analytics__mini-graph {
    height: 32px;
  }

  .playlist-radar-analytics__notice strong {
    margin-bottom: 6px;
    font-size: 11px;
  }

  .playlist-radar-analytics__notice span {
    font-size: clamp(11px, 2.7vw, 13px);
    line-height: 1.28;
  }

  .playlist-radar-pricing {
    min-height: 100svh;
    padding: clamp(24px, 3.8svh, 36px) 14px clamp(12px, 1.9svh, 18px);
    display: flex;
    align-items: stretch;
  }

  .playlist-radar-pricing__shell {
    width: min(100%, 760px);
    min-height: calc(100svh - clamp(36px, 5.7svh, 54px));
    grid-template-columns: 1fr;
    grid-template-areas:
      "intro"
      "stage"
      "cta"
      "legal";
    grid-template-rows: auto auto auto minmax(150px, auto);
    gap: clamp(8px, 1.15svh, 12px);
    align-content: space-between;
    align-items: stretch;
  }

  .playlist-radar-pricing__intro {
    align-self: start;
  }

  .playlist-radar-pricing__eyebrow {
    min-height: 28px;
    padding-inline: 12px;
    font-size: 9px;
  }

  .playlist-radar-pricing h2 {
    margin-top: 10px;
    font-size: clamp(34px, 8.2vw, 50px);
    line-height: .88;
  }

  .playlist-radar-pricing__intro p {
    display: none;
  }

  .playlist-radar-pricing__stage {
    min-height: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    perspective: none;
  }

  .playlist-radar-pricing__card {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    width: auto;
    min-height: clamp(310px, 36svh, 338px);
    padding: 13px 12px 14px;
    border-radius: 22px;
    transform: none;
  }

  .playlist-radar-pricing__badge {
    min-height: 23px;
    padding-inline: 9px;
    font-size: 7.5px;
  }

  .playlist-radar-pricing__card h3,
  .playlist-radar-pricing__card--auto h3 {
    margin-top: 13px;
    font-size: clamp(13px, 3.05vw, 19px);
    line-height: .94;
    letter-spacing: -.07em;
    white-space: normal;
  }

  .playlist-radar-pricing__price {
    margin-top: 14px;
  }

  .playlist-radar-pricing__price strong {
    font-size: clamp(28px, 7vw, 40px);
  }

  .playlist-radar-pricing__price span {
    margin-top: 6px;
    font-size: 8.5px;
  }

  .playlist-radar-pricing__card p {
    margin-top: 12px;
    font-size: clamp(9.5px, 2.45vw, 12px);
    line-height: 1.22;
  }

  .playlist-radar-pricing__card ul {
    margin: 13px 0 12px;
    gap: 7px;
  }

  .playlist-radar-pricing__card li {
    padding-left: 15px;
    font-size: clamp(9.5px, 2.4vw, 12px);
    line-height: 1.14;
  }

  .playlist-radar-pricing__card li::before {
    width: 7px;
    height: 7px;
  }

  .playlist-radar-pricing__renew {
    min-height: 34px;
    padding-inline: 9px;
    font-size: clamp(8.2px, 2.1vw, 10px);
    letter-spacing: .04em;
    white-space: normal;
  }

  .playlist-radar-pricing__cta {
    gap: 6px;
  }

  .playlist-radar-pricing__cta a {
    min-height: 42px;
    padding-inline: 18px;
    font-size: 11px;
  }

  .playlist-radar-pricing__cta span {
    font-size: 10px;
  }

  .playlist-radar-pricing__legal {
    align-self: end;
    padding: 12px 13px;
    border-radius: 20px;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .playlist-radar-pricing__legal-copy strong,
  .playlist-radar-pricing__legal-entity span:first-child {
    font-size: 10px;
  }

  .playlist-radar-pricing__legal-copy p,
  .playlist-radar-pricing__legal-entity {
    font-size: 9.5px;
    line-height: 1.25;
  }

  .playlist-radar-pricing__legal-links {
    margin-top: 8px;
    gap: 6px;
  }

  .playlist-radar-pricing__legal-links a {
    min-height: 26px;
    padding-inline: 9px;
    font-size: 9px;
  }
}

@media (max-width: 520px) {
  .playlist-radar-result__stats,
  .playlist-radar-pricing__stage {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .playlist-radar-pricing__legal {
    max-height: none;
    overflow: visible;
  }
}

@media (min-width: 521px) and (max-width: 860px) {
  .playlist-radar-result,
  .playlist-radar-analytics,
  .playlist-radar-pricing {
    padding-inline: clamp(24px, 5vw, 42px);
  }

  .playlist-radar-result__shell,
  .playlist-radar-analytics__shell,
  .playlist-radar-pricing__shell {
    width: min(100%, 760px);
    margin-inline: auto;
  }

  .playlist-radar-result__shell {
    grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr);
    grid-template-areas: "copy proof";
    column-gap: clamp(18px, 3vw, 28px);
    align-content: center;
    align-items: center;
  }

  .playlist-radar-result h2 {
    font-size: clamp(42px, 6.4vw, 58px);
  }

  .playlist-radar-result__points li,
  .playlist-radar-result__points li:last-child {
    font-size: clamp(12px, 1.75vw, 14px);
  }

  .playlist-radar-result__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .playlist-radar-result__screen {
    padding: 12px;
  }

  .playlist-radar-result__screen video {
    aspect-ratio: 1064 / 376;
    object-fit: contain;
  }

  .playlist-radar-analytics__shell {
    gap: clamp(12px, 1.4svh, 18px);
  }

  .playlist-radar-analytics h2 {
    font-size: clamp(40px, 6.4vw, 56px);
  }

  .playlist-radar-analytics__copy > p {
    max-width: 680px;
    font-size: clamp(13px, 1.7vw, 15px);
  }

  .playlist-radar-analytics__console {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
  }

  .playlist-radar-analytics__module {
    min-height: clamp(206px, 23svh, 244px);
    padding: 14px 12px 15px;
  }

  .playlist-radar-analytics__module h3 {
    font-size: clamp(11px, 1.45vw, 14px);
    letter-spacing: -.055em;
  }

  .playlist-radar-analytics__module h3 span {
    white-space: normal;
  }

  .playlist-radar-analytics__module p {
    font-size: clamp(10px, 1.26vw, 12px);
    line-height: 1.2;
  }

  .playlist-radar-analytics__bars,
  .playlist-radar-analytics__mini-graph {
    height: 28px;
  }

  .playlist-radar-analytics__notice {
    padding: 14px 16px 17px;
  }

  .playlist-radar-analytics__notice span {
    font-size: clamp(11px, 1.4vw, 13px);
    line-height: 1.25;
  }

  .playlist-radar-pricing__shell {
    grid-template-rows: auto minmax(360px, auto) auto minmax(150px, auto);
  }

  .playlist-radar-pricing h2 {
    font-size: clamp(42px, 6.6vw, 58px);
  }

  .playlist-radar-pricing__stage {
    gap: 14px;
  }

  .playlist-radar-pricing__card {
    min-height: clamp(350px, 38svh, 404px);
    padding: 16px 15px 16px;
  }

  .playlist-radar-pricing__card h3,
  .playlist-radar-pricing__card--auto h3 {
    font-size: clamp(18px, 2.45vw, 24px);
  }

  .playlist-radar-pricing__price strong {
    font-size: clamp(36px, 5vw, 48px);
  }

  .playlist-radar-pricing__card p,
  .playlist-radar-pricing__card li {
    font-size: clamp(10.5px, 1.45vw, 12.5px);
  }

  .playlist-radar-pricing__legal {
    margin-top: auto;
    padding: 13px 15px;
  }
}

@keyframes playlistStableLineGlow {
  0%,
  100% {
    opacity: .78;
    filter: drop-shadow(0 0 10px rgba(255, 128, 31, .42));
  }

  50% {
    opacity: 1;
    filter: drop-shadow(0 0 18px rgba(255, 160, 58, .64));
  }
}

@keyframes playlistStableAreaGlow {
  0%,
  100% {
    opacity: .48;
    transform: translate3d(0, 0, 0) scaleY(.98);
    transform-origin: bottom;
  }

  50% {
    opacity: .78;
    transform: translate3d(0, -2px, 0) scaleY(1.01);
  }
}

@keyframes playlistStableDotPulse {
  0%,
  100% {
    opacity: .66;
    transform: translate3d(0, 0, 0) scale(.94);
  }

  50% {
    opacity: 1;
    transform: translate3d(0, -3px, 0) scale(1.08);
  }
}

@keyframes playlistMobileCardFloat {
  0%,
  100% {
    transform: translate3d(0, 0, 0) rotateX(0deg) rotateY(0deg);
  }

  48% {
    transform: translate3d(0, -5px, 0) rotateX(1.4deg) rotateY(-1.8deg);
  }

  72% {
    transform: translate3d(0, -2px, 0) rotateX(-.6deg) rotateY(.8deg);
  }
}

@keyframes playlistMobileProofFloat {
  0%,
  100% {
    transform: translate3d(0, 0, 0) rotateX(0deg);
  }

  50% {
    transform: translate3d(0, -4px, 0) rotateX(1.3deg);
  }
}

@keyframes playlistMobileBarsLive {
  0%,
  100% {
    opacity: .68;
    transform: scaleY(.72);
  }

  50% {
    opacity: 1;
    transform: scaleY(1.06);
  }
}

@keyframes playlistMobileTrackLive {
  0%,
  100% {
    opacity: .66;
    transform: scaleX(.74);
    transform-origin: left center;
  }

  50% {
    opacity: 1;
    transform: scaleX(1);
  }
}

@keyframes playlistAudienceNumberLive {
  0%,
  100% {
    transform: translate3d(0, 0, 0) scale(1);
    text-shadow:
      0 2px 0 rgba(0, 0, 0, .26),
      0 0 18px rgba(255, 123, 27, .26);
  }

  50% {
    transform: translate3d(0, -2px, 0) scale(1.035);
    text-shadow:
      0 2px 0 rgba(0, 0, 0, .24),
      0 0 30px rgba(255, 160, 58, .5);
  }
}

@keyframes playlistAudienceMobileFlow {
  0% {
    opacity: .82;
    stroke-dasharray: 34 18;
    stroke-dashoffset: 0;
    filter: drop-shadow(0 0 10px rgba(255, 232, 166, .42));
  }

  45% {
    opacity: 1;
    stroke-dasharray: 58 16;
    filter: drop-shadow(0 0 18px rgba(255, 241, 194, .7));
  }

  100% {
    opacity: .86;
    stroke-dasharray: 34 18;
    stroke-dashoffset: -260;
    filter: drop-shadow(0 0 12px rgba(255, 145, 36, .46));
  }
}

.playlist-radar-audience__line {
  stroke-dashoffset: 0;
  animation: playlistStableLineGlow 4.8s ease-in-out infinite !important;
}

.playlist-radar-audience__area {
  animation: playlistStableAreaGlow 5.4s ease-in-out infinite !important;
}

.playlist-radar-audience__spark {
  animation: playlistStableDotPulse 4.9s ease-in-out infinite !important;
}

.playlist-radar-audience--surge .playlist-radar-audience__meta strong {
  display: block;
  animation: playlistAudienceNumberLive 4.2s ease-in-out infinite !important;
  transform-origin: 100% 50%;
  will-change: transform;
}

@media (max-width: 860px) {
  .playlist-radar-brand__mark::before {
    animation: playlistMarkSpin 6s linear infinite !important;
    will-change: transform;
  }

  .playlist-radar-brand__mark::after {
    animation: playlistCardTilt 2.4s ease-in-out infinite !important;
    will-change: transform;
  }

  .playlist-radar-audience--surge .playlist-radar-audience__line {
    animation: playlistAudienceMobileFlow 3.8s linear infinite !important;
    stroke-dasharray: 34 18;
    stroke-dashoffset: 0;
  }

  .playlist-radar-audience--surge .playlist-radar-audience__area {
    animation: playlistStableAreaGlow 5.4s ease-in-out infinite !important;
  }

  .playlist-radar-audience--surge .playlist-radar-audience__spark {
    animation: playlistStableDotPulse 4.9s ease-in-out infinite !important;
  }

  .playlist-radar-result__stat,
  .playlist-radar-analytics__module,
  .playlist-radar-pricing__card {
    animation: playlistMobileCardFloat 7.4s ease-in-out infinite !important;
    animation-delay: var(--stat-delay, var(--module-delay, 0s)) !important;
    backface-visibility: hidden;
    will-change: transform;
  }

  .playlist-radar-result__screen {
    animation: playlistMobileProofFloat 8.2s ease-in-out infinite !important;
    backface-visibility: hidden;
    will-change: transform;
  }

  .playlist-radar-analytics__bars span {
    animation: playlistMobileBarsLive 2.9s ease-in-out infinite !important;
    animation-delay: var(--d, 0s) !important;
    transform-origin: bottom;
    will-change: transform, opacity;
  }

  .playlist-radar-analytics__bars span:nth-child(2) {
    --d: -.65s;
  }

  .playlist-radar-analytics__bars span:nth-child(3) {
    --d: -1.25s;
  }

  .playlist-radar-analytics__bars span:nth-child(4) {
    --d: -1.8s;
  }

  .playlist-radar-analytics__bars span:nth-child(5) {
    --d: -2.35s;
  }

  .playlist-radar-analytics__mini-graph path {
    stroke-dashoffset: 0;
    animation: playlistStableLineGlow 4.6s ease-in-out infinite !important;
  }

  .playlist-radar-analytics__contacts span {
    animation: playlistMobileTrackLive 3.8s ease-in-out infinite !important;
  }

  .playlist-radar-analytics__timeline span {
    animation: playlistStableDotPulse 3.4s ease-in-out infinite !important;
  }
}

@media (max-width: 520px) {
  .playlist-radar-hero h1 {
    top: clamp(118px, 12.8svh, 132px);
  }

  .playlist-radar-brand__mark::before {
    animation: playlistMarkSpin 6s linear infinite !important;
    will-change: transform;
  }

  .playlist-radar-brand__mark::after {
    animation: playlistCardTilt 2.4s ease-in-out infinite !important;
    will-change: transform;
  }

  .playlist-radar-result {
    min-height: 100svh;
    padding: clamp(42px, 5.1svh, 52px) 16px clamp(30px, 3.8svh, 38px);
    align-items: stretch;
    justify-content: center;
  }

  .playlist-radar-result__shell {
    width: 100%;
    min-height: calc(100svh - clamp(72px, 8.9svh, 90px));
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 0;
    align-content: stretch;
    align-items: center;
  }

  .playlist-radar-result__copy {
    width: 100%;
    display: contents;
  }

  .playlist-radar-result__eyebrow {
    order: 1;
    align-self: center;
    min-height: 34px;
    padding-inline: 18px;
    font-size: 9.2px;
    background:
      radial-gradient(circle at 12% 0, rgba(255, 186, 82, .24), transparent 42%),
      rgba(255, 118, 24, .13);
    box-shadow:
      inset 0 1px 0 rgba(255, 215, 162, .14),
      0 16px 38px rgba(255, 115, 24, .1);
  }

  .playlist-radar-result h2 {
    order: 2;
    max-width: 100%;
    margin-top: 0;
    font-size: clamp(38px, 10.45vw, 48px);
    line-height: .86;
    text-align: center;
  }

  .playlist-radar-result__points {
    order: 3;
    width: 100%;
    max-width: 398px;
    margin-top: 0;
    gap: clamp(10px, 1.25svh, 13px);
    text-align: left;
  }

  .playlist-radar-result__points li,
  .playlist-radar-result__points li:last-child {
    min-height: 18px;
    padding-left: 18px;
    font-size: clamp(10.6px, 2.75vw, 12.6px);
    line-height: 1.08;
    white-space: nowrap;
  }

  .playlist-radar-result__stats {
    order: 5;
    width: 100%;
    max-width: 398px;
    margin-top: 0;
    gap: clamp(10px, 1.25svh, 12px);
  }

  .playlist-radar-result__stat {
    min-height: clamp(80px, 9svh, 88px);
    padding: 12px 13px 12px;
  }

  .playlist-radar-result__stat strong {
    margin-top: 7px;
    font-size: clamp(25px, 6.5vw, 31px);
  }

  .playlist-radar-result__proof {
    order: 4;
    width: 100%;
    max-width: 398px;
    align-self: center;
  }

  .playlist-radar-result__screen {
    width: 100%;
    padding: 10px;
    border-radius: 22px;
  }

  .playlist-radar-result__screen-top {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    font-size: 8.2px;
  }

  .playlist-radar-result__screen-top strong {
    font-size: 8.2px;
  }

  .playlist-radar-result__screen video {
    aspect-ratio: 1064 / 376;
    object-fit: contain;
    border-radius: 13px;
  }
}
