/* The hero copy and illustrative product tools share one scene controller. */
.heroAudienceTabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.heroAudienceTabs button{font:inherit;font-size:12px;line-height:1.4;border:0;border-radius:999px;padding:9px 14px;background:#dedfd5;color:#5c6453;cursor:pointer;transition:background-color 400ms ease,color 400ms ease}.heroAudienceTabs button.isActive{background:#20251d;color:#fff}.heroAudienceTabs button:focus-visible,.heroPreviewFooter button:focus-visible{outline:2px solid #428fd5;outline-offset:4px}
.heroToolWindow{transform:none}.heroToolPanels{display:grid;height:640px;position:relative}.heroToolPanel{grid-area:1/1;min-width:0;min-height:0;overflow:hidden;visibility:hidden;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity 750ms ease,transform 750ms cubic-bezier(.25,.8,.25,1),visibility 750ms}.heroToolPanel.isActive{visibility:visible;opacity:1;transform:none;pointer-events:auto}.heroToolBody{padding:22px;height:100%;display:flex;flex-direction:column;gap:16px;min-width:0;min-height:0}.heroToolHeading{display:flex;align-items:center;justify-content:space-between;gap:12px}.heroToolHeading small{display:block;font-size:8px;letter-spacing:.08em;color:var(--muted)}.heroToolHeading h2{font-size:26px;line-height:1.15;letter-spacing:-.035em;margin:7px 0 0}.heroPreviewLabel{font-size:9px;color:var(--muted)}.heroPreviewFooter{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}.hero .heroPreviewFooter .previewCaption{margin:0;font-size:10px;text-align:left}.heroPreviewFooter button{flex:0 0 auto;border:0;background:#e0e2d7;color:var(--muted);font:inherit;font-size:10px;line-height:1.4;padding:7px 10px;border-radius:999px;cursor:pointer}
.heroCatalogTabs{display:flex;gap:20px;font-size:10px;color:var(--muted);padding-bottom:12px;border-bottom:1px solid var(--line)}.heroCatalogTabs b{position:relative;color:var(--ink)}.heroCatalogTabs b:after{content:"";position:absolute;bottom:-13px;left:-7px;right:-7px;height:2px;background:var(--ink)}.heroCatalogSearch{display:flex;gap:10px;align-items:center;font-size:10px;background:#e6e3dd;color:var(--muted);padding:10px 14px;border-radius:999px}.heroCatalogSearch>span{font-size:17px;line-height:1}.heroCatalogMetrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.heroCatalogMetrics>div{background:var(--panel);border-radius:14px;padding:12px;min-width:0}.heroCatalogMetrics i{display:block;width:19px;height:19px;border-radius:50%;margin-bottom:9px}.heroCatalogMetrics span{display:block;font-size:9px;color:var(--muted);white-space:nowrap}.heroCatalogMetrics b{display:block;font-size:19px;line-height:1.2;letter-spacing:-.025em;margin-top:7px}.heroCatalogMetrics>div:nth-child(2) b{font-size:14px;line-height:1.6}
.heroCatalogTableHead{display:grid;grid-template-columns:22px minmax(0,1fr) 110px;gap:10px;font-size:8px;letter-spacing:.035em;color:var(--muted);padding:0 10px}.heroCatalogTableHead>span:last-child{text-align:right}.heroCatalogViewport{flex:1;min-height:0;overflow:hidden}.heroCatalogScroll{animation:hero-catalog-scroll 8s cubic-bezier(.25,.1,.25,1) infinite;animation-play-state:paused}.heroCatalogRow{display:flex;align-items:center;gap:10px;min-width:0;height:60px;border-radius:12px;padding:8px 10px}.heroCatalogRow:nth-child(4){background:#e8e1d6}.heroCatalogRow>span:first-child{flex:0 0 18px;font-size:9px;color:var(--muted);font-variant-numeric:tabular-nums}.heroCatalogArt{width:34px;height:34px;flex:0 0 34px;border-radius:7px;background:linear-gradient(135deg,#29424a,#8aa1a3 50%,#deb8a3)}.heroCatalogArt.art1{background:linear-gradient(135deg,#6e687d,#c9aa9c 55%,#778e85)}.heroCatalogArt.art2{background:linear-gradient(135deg,#314744,#b2b89b 60%,#d2ae84)}.heroCatalogArt.art3{background:linear-gradient(135deg,#465b75,#b3c6c4 55%,#dfbf9b)}.heroCatalogName{min-width:0}.heroCatalogName b{display:block;font-size:11px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.heroCatalogName small{display:block;font-size:9px;line-height:1.5;margin-top:3px;color:var(--muted)}.heroCatalogStreams{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto;flex:0 0 110px;font-size:10px;font-variant-numeric:tabular-nums}.heroCatalogStreams svg{width:42px;height:20px;flex:0 0 42px}.heroCatalogStreams path{fill:none;stroke:#428fd5;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.heroCatalogFoot{display:flex;align-items:center;gap:6px;font-size:9px;line-height:1.5;color:var(--muted)}.heroCatalogFoot>i,.heroArtistLive>i{display:block;width:5px;height:5px;flex:0 0 5px;border-radius:50%;background:#68b291}
.heroArtistPage{display:flex;flex-direction:column;gap:12px;flex:1;min-height:0}.heroArtistRelease{display:flex;align-items:center;gap:12px;padding:12px;border-radius:18px;background:linear-gradient(120deg,#dedce0,#e4e8df)}.heroArtistCover{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-width:0;flex:0 0 88px;aspect-ratio:1;border-radius:12px;padding:14px;color:#fff;background:radial-gradient(ellipse at 65% 30%,#abbbb4,transparent 50%),linear-gradient(135deg,#2e4650,#6f8590 55%,#c49d8c);overflow:hidden}.heroArtistCover span{font-size:7px;letter-spacing:.08em}.heroArtistCover b{font-size:13px;letter-spacing:-.04em;line-height:1.05}.heroArtistBadge{display:block;width:fit-content;font-size:8px;letter-spacing:.05em;padding:6px 9px;border-radius:999px;background:#b3d663;color:#344424}.heroArtistRelease h3{font-size:27px;line-height:1.15;letter-spacing:-.035em;margin:14px 0 5px}.hero .heroArtistRelease p{font-size:12px;margin:0;line-height:1.5}.heroArtistLive{display:flex;align-items:center;gap:6px;font-size:9px;color:var(--muted);margin-top:16px}.heroArtistServices{display:grid;gap:9px}.heroArtistServices>div{display:flex;align-items:center;gap:10px;padding:7px 12px;border-radius:999px;background:var(--panel)}.heroArtistServices i{font-style:normal;display:grid;place-items:center;width:24px;height:24px;flex:0 0 24px;border-radius:50%;font-size:13px}.heroArtistServices b{font-size:11px}.heroArtistServices span{margin-left:auto;font-size:10px;color:var(--muted)}.heroArtistJoin{padding:16px;border-radius:18px;background:#e4e7d8}.heroArtistJoin h3{font-size:23px;line-height:1.1;letter-spacing:-.03em;margin:10px 0 8px}.hero .heroArtistJoin p{font-size:11px;margin:0;line-height:1.5}.heroArtistEmail{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border-radius:999px;background:#f8f6f2;margin-top:12px;font-size:10px}.heroArtistEmail>span{color:var(--muted)}.heroArtistEmail b{font-size:9px;white-space:nowrap}.heroArtistJoin>small{display:block;font-size:8px;color:var(--muted);margin-top:10px}
.heroInsightMetrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.heroInsightMetrics>div{background:var(--panel);border-radius:14px;padding:14px;min-width:0}.heroInsightMetrics span{display:block;font-size:9px;color:var(--muted);white-space:nowrap}.heroInsightMetrics b{display:block;font-size:24px;line-height:1.15;letter-spacing:-.035em;margin-top:10px}.heroToolPanel .previewChart{flex:1;min-height:0;display:flex;flex-direction:column}.heroToolPanel .previewChartHead{flex:0 0 auto}.heroToolPanel .previewCurve{min-height:0;flex:1;height:100%;max-height:145px}.heroToolPanel .previewDates{margin-top:auto}.heroDrawCurve{stroke-dasharray:1;stroke-dashoffset:0;animation:hero-curve-draw 8s ease both infinite;animation-play-state:paused}.heroSignalRows{display:grid;gap:8px}.heroSignalRows>div{display:flex;align-items:center;gap:12px;border-radius:14px;background:var(--panel);padding:12px 14px}.heroSignalRows i{display:grid;place-items:center;flex:0 0 26px;height:26px;border-radius:50%;font-style:normal;font-size:14px}.heroSignalRows b{display:block;font-size:11px}.heroSignalRows small{display:block;font-size:9px;color:var(--muted);margin-top:4px;line-height:1.5}
@keyframes hero-catalog-scroll{0%,16%{transform:translateY(0)}78%,100%{transform:translateY(-180px)}}
@keyframes hero-curve-draw{0%,10%{stroke-dashoffset:1}78%,100%{stroke-dashoffset:0}}
@keyframes hero-tool-enter{0%,8%{opacity:0;transform:translateY(8px)}22%,100%{opacity:1;transform:none}}
.heroArtistServices>div,.heroArtistJoin,.heroSignalRows>div{animation:hero-tool-enter 8s cubic-bezier(.25,.8,.25,1) both infinite;animation-play-state:paused}.heroArtistServices>div:nth-child(2),.heroSignalRows>div:nth-child(2){animation-delay:250ms}.heroArtistServices>div:nth-child(3){animation-delay:500ms}.heroArtistJoin{animation-delay:750ms}
.heroToolPanel.isActive :where(.heroCatalogScroll):is(ci-spec.ci-spec,*),.heroToolPanel.isActive :where(.heroDrawCurve):is(ci-spec.ci-spec,*),.heroToolPanel.isActive :where(.heroArtistServices>div):is(ci-spec.ci-spec,*),.heroToolPanel.isActive :where(.heroArtistJoin):is(ci-spec.ci-spec,*),.heroToolPanel.isActive :where(.heroSignalRows>div):is(ci-spec.ci-spec,*){animation-play-state:running}.hero[data-hero-paused="true"] :where(.heroCatalogScroll):is(ci-spec.ci-spec,*),.hero[data-hero-paused="true"] :where(.heroDrawCurve):is(ci-spec.ci-spec,*),.hero[data-hero-paused="true"] :where(.heroArtistServices>div):is(ci-spec.ci-spec,*),.hero[data-hero-paused="true"] :where(.heroArtistJoin):is(ci-spec.ci-spec,*),.hero[data-hero-paused="true"] :where(.heroSignalRows>div):is(ci-spec.ci-spec,*){animation-play-state:paused}
@container site (max-width:1100px){.heroToolBody{padding:18px;gap:14px}.heroCatalogStreams{flex-basis:88px;font-size:9px}.heroCatalogStreams svg{width:30px;flex-basis:30px}.heroCatalogTableHead{grid-template-columns:18px minmax(0,1fr) 88px}.heroArtistCover{flex-basis:88px}.heroArtistRelease{padding:14px;gap:14px}.heroInsightMetrics>div{padding:12px}.heroInsightMetrics b{font-size:22px}}
@container site (max-width:540px){.heroToolPanels{height:600px}.heroToolBody{padding:14px;gap:12px}.heroToolHeading h2{font-size:23px}.heroCatalogTabs{gap:18px;font-size:9px}.heroCatalogMetrics>div{padding:10px 8px}.heroCatalogMetrics span{font-size:8px}.heroCatalogMetrics b{font-size:18px}.heroCatalogMetrics>div:nth-child(2) b{font-size:12px}.heroCatalogRow{gap:7px;padding-inline:4px}.heroCatalogRow>span:first-child{flex-basis:14px;font-size:8px}.heroCatalogArt{width:28px;height:28px;flex-basis:28px}.heroCatalogStreams{flex-basis:75px;gap:5px}.heroCatalogStreams svg{width:25px;flex-basis:25px}.heroCatalogName b{font-size:10px}.heroCatalogName small{font-size:8px}.heroCatalogTableHead{grid-template-columns:14px minmax(0,1fr) 75px;gap:7px;padding-inline:4px}.heroCatalogFoot{font-size:8px}.heroArtistCover{flex-basis:80px;padding:10px}.heroArtistCover b{font-size:13px}.heroArtistRelease{padding:12px;gap:12px}.heroArtistRelease h3{font-size:23px;margin-top:12px}.heroArtistBadge{font-size:7px;padding:5px 7px}.heroArtistLive{font-size:8px;line-height:1.5;margin-top:10px}.heroArtistPage{gap:12px}.heroArtistServices>div{padding:7px 12px}.heroArtistJoin{padding:16px}.heroArtistJoin h3{font-size:21px}.heroArtistJoin>small{font-size:7px}.heroArtistEmail{font-size:9px;padding:10px}.heroArtistEmail b{font-size:8px}.heroInsightMetrics>div{padding:10px 8px}.heroInsightMetrics span{font-size:8px}.heroInsightMetrics b{font-size:19px}.heroSignalRows>div{padding:10px;gap:8px}.heroSignalRows b{font-size:10px}.heroSignalRows small{font-size:8px}.hero .heroPreviewFooter .previewCaption{font-size:8px}.heroPreviewFooter button{font-size:9px;padding:6px 8px}.heroAudienceTabs button{font-size:11px;padding:8px 12px}}
@media(prefers-reduced-motion:reduce){.heroAudienceTabs button,.heroToolPanel{transition:none;transform:none}.heroToolPanel *{animation:none!important}.heroDrawCurve{stroke-dashoffset:0}}