body.playlists-page{
  background:#fff;
  color:#111;
}

body.playlists-page .hero{
  height: 276px;
}

body.playlists-page .site-logo{
  width:min(720px, 88vw);
}

body.playlists-page .playlists-canvas{
  position: relative;
  width:min(1280px, calc(100vw - 48px));
  margin:0 auto;
  padding: 18px 0 96px;
  min-height: 1200px;
}

.playlists-intro,
.playlist-module,
.playlist-archiveHook{
  border:1px solid rgba(0,0,0,.16);
  background:rgba(255,255,255,.94);
}

.playlists-intro{
  max-width: 820px;
  margin: 18px 0 32px 260px;
  padding: 28px 28px 26px;
  box-shadow: 0 14px 34px rgba(0,0,0,.08);
}

.playlists-kicker,
.playlist-module__eyebrow{
  margin:0 0 8px;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#5e5e5e;
}

.playlists-intro h1,
.playlist-module h2,
.playlist-archiveHook h2{
  margin:0;
  font-size: clamp(26px, 4vw, 42px);
  line-height:1;
  font-weight:400;
}

.playlists-copy,
.playlist-module__note,
.playlist-archiveHook .playlist-module__note{
  margin:14px 0 0;
  max-width:62ch;
  font-size:14px;
  line-height:1.45;
}

.playlists-copy{
  max-width: 66ch;
  line-height: 1.62;
}

.playlists-copy--lead{
  margin-top: 18px;
  font-size: 15px;
}

.playlists-copy--detail{
  margin-top: 12px;
  color:#2f2f2f;
}

.playlists-copy em{
  font-style: normal;
  font-weight: 600;
}

.playlist-module__note--aside,
.playlist-module__note--bside{
  margin-top: 18px;
  padding: 14px 10px 0;
  max-width: none;
  border-top: 1px solid rgba(0,0,0,.08);
  line-height: 1.62;
}

.playlist-module__note--aside{
  padding-bottom: 10px;
}

.playlist-module__note--bside{
  padding-bottom: 18px;
}

.playlists-stage{
  display:grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 24px;
  align-items:start;
}

.playlist-module{
  padding:18px;
}

.playlist-module--aside{
  grid-row: 1 / span 2;
  min-height: 860px;
}

.playlist-module__header{
  margin-bottom:16px;
}

.playlist-module__header--bside{
  text-align:center;
}

.playlist-module--asideInteractive,
.playlist-module--bsideInteractive{
  padding:16px 16px 24px;
  perspective: 1500px;
}

.playlist-module__flipShell{
  position:relative;
  min-height: 826px;
}

.playlist-module__flipInner{
  position:relative;
  min-height: inherit;
  transform-style: preserve-3d;
  transition: transform .74s cubic-bezier(.28,.72,.18,1);
}

/* Pre-flip pick-up nudge — desktop 3D flip only */
@media (min-width: 981px){
  .playlist-module--asideInteractive.is-flipping .playlist-module__flipInner,
  .playlist-module--bsideInteractive.is-flipping .playlist-module__flipInner{
    transform: rotateY(-6deg) scale(0.982);
    transition: transform .13s cubic-bezier(.4,0,1,1);
  }
}

.playlist-module--asideInteractive.is-detail .playlist-module__flipInner,
.playlist-module--bsideInteractive.is-detail .playlist-module__flipInner{
  transform: rotateY(180deg);
}

.playlist-module__face{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  gap:14px;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

.playlist-module__face--back{
  transform: rotateY(180deg);
}

.playlist-module__header--asideFront{
  text-align:center;
  padding-top: 4px;
}

.playlist-grid{
  display:grid;
  gap:10px;
}

.playlist-grid span{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height: 88px;
  border:1px dashed rgba(0,0,0,.24);
  background:rgba(0,0,0,.03);
  color:#7a7a7a;
  font-size:13px;
}

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

.playlist-grid--horizontal{
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.playlist-grid--aSide{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 1fr;
}

.playlist-coverButton{
  appearance:none;
  border:1px solid rgba(0,0,0,.18);
  background:#fff;
  padding:0;
  cursor:pointer;
  overflow:hidden;
  min-height: 114px;
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.playlist-coverButton:hover,
.playlist-coverButton:focus-visible{
  transform: translateY(-2px);
  box-shadow: 0 14px 22px rgba(0,0,0,.12);
  border-color: rgba(0,0,0,.34);
}

.playlist-coverButton:focus-visible{
  outline:2px solid #111;
  outline-offset:2px;
}

.playlist-coverButton img{
  display:block;
  width:100%;
  height:100%;
  aspect-ratio: 1 / 1;
  object-fit:cover;
}


.playlist-detailBack{
  align-self:flex-start;
  appearance:none;
  border:1px solid rgba(0,0,0,.18);
  background:#fff;
  color:#111;
  padding:6px 10px;
  min-width:38px;
  min-height:38px;
  cursor:pointer;
  font:inherit;
  line-height:1;
}

.playlist-detailCard{
  display:flex;
  flex-direction:column;
  gap:16px;
  flex:1;
  min-height:0;
  padding:8px 2px 4px;
}

.playlist-detailCard__coverWrap{
  margin:0;
  border:1px solid rgba(0,0,0,.18);
  background:#f5f5f5;
  overflow:hidden;
}

.playlist-detailCard__coverWrap img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:1 / 1;
  object-fit:cover;
}

.playlist-detailCard__body{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.playlist-detailCard__body h3{
  margin:0;
  font-size: clamp(28px, 4vw, 34px);
  line-height: .95;
  font-weight:500;
}

.playlist-detailCard__subhead,
.playlist-detailCard__copy{
  margin:0;
  font-size:14px;
  line-height:1.45;
}

.playlist-detailCard__subhead{
  color:#4f4f4f;
}

.playlist-detailLinks{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:8px;
  margin-top: 6px;
}

.playlist-detailLinks a{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:8px 10px;
  border:1px solid rgba(0,0,0,.18);
  background:#fff;
  color:#111;
  font-size:12px;
  letter-spacing:.05em;
  text-transform:uppercase;
  text-decoration:none;
}

.playlist-detailLinks a:hover,
.playlist-detailLinks a:focus-visible,
.playlist-detailBack:hover,
.playlist-detailBack:focus-visible{
  background:#111;
  color:#fff;
}

.playlist-module--turntable{
  min-height: 520px;
}

.playlist-turntableStage{
  display:grid;
  grid-template-columns: minmax(0, 1fr) clamp(332px, 36vw, 360px);
  gap:22px;
  align-items:stretch;
  margin-top: 18px;
}

.playlist-turntableDeck{
  --deck-light: #f4e4c8;
  --deck-accent: #d8c9b2;
  --deck-shadow: #ba9870;
  --deck-deep: #cda779;
  --deck-glow: rgba(186, 145, 84, .24);
  --deck-dock-ring: rgba(105, 72, 35, .18);
  position:relative;
  min-height: 420px;
  overflow:hidden;
  border:1px solid rgba(57,37,14,.28);
  border-radius: 30px;
  background:
    radial-gradient(circle at 24% 18%, rgba(255,255,255,.38), transparent 24%),
    radial-gradient(circle at 82% 82%, rgba(0,0,0,.08), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.2), rgba(0,0,0,0) 22%),
    linear-gradient(135deg, var(--deck-light) 0%, var(--deck-accent) 38%, var(--deck-shadow) 68%, var(--deck-deep) 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 26px 48px rgba(0,0,0,.14);
  perspective: 1800px;
  perspective-origin: 42% 48%;
  transform-style: preserve-3d;
  transition:
    --deck-light .6s ease,
    --deck-accent .6s ease,
    --deck-shadow .6s ease,
    --deck-deep .6s ease;
}

.playlist-turntableDeck[data-active-side="B"]{
  --deck-light: #ece3d7;
  --deck-accent: #d1c4b3;
  --deck-shadow: #9d8a76;
  --deck-deep: #b89f8a;
  --deck-glow: rgba(74, 106, 168, .2);
  --deck-dock-ring: rgba(66, 87, 122, .18);
}

.playlist-turntableDeck::before{
  content:"";
  position:absolute;
  inset:14px;
  border-radius: 24px;
  border:1px solid rgba(255,255,255,.22);
  pointer-events:none;
}

.playlist-turntableDeck::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(100deg, rgba(103,67,28,.07), rgba(255,255,255,0) 18%, rgba(102,67,28,.05) 38%, rgba(255,255,255,0) 56%, rgba(94,63,29,.08) 78%, rgba(255,255,255,0) 100%),
    repeating-linear-gradient(8deg, rgba(255,255,255,.06) 0 2px, rgba(0,0,0,0) 2px 16px);
  opacity:.58;
  mix-blend-mode:multiply;
  pointer-events:none;
}

.playlist-turntableDeck__brand{
  position:absolute;
  left:24px;
  bottom:22px;
  width:172px;
  opacity:.24;
  mix-blend-mode:multiply;
  z-index:1;
  transition:opacity .24s ease, mix-blend-mode .24s ease;
}

.playlist-turntableDeck__brand img{
  display:block;
  width:100%;
  height:auto;
  filter:grayscale(1) brightness(0);
  transition:filter .24s ease;
}

.playlist-turntableDeck[data-brand-contrast="light"] .playlist-turntableDeck__brand{
  opacity:.32;
  mix-blend-mode:screen;
}

.playlist-turntableDeck[data-brand-contrast="light"] .playlist-turntableDeck__brand img{
  filter:grayscale(1) brightness(0) invert(1);
}

.playlist-turntableDeck__monitor{
  position:absolute;
  top:24px;
  right:24px;
  display:grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap:12px;
  align-items:center;
  min-width: 214px;
  padding:12px 14px;
  border:1px solid rgba(0,0,0,.18);
  border-radius:20px;
  background:linear-gradient(180deg, rgba(255,255,255,.9), rgba(248,244,238,.86));
  box-shadow: 0 12px 22px rgba(0,0,0,.09), inset 0 1px 0 rgba(255,255,255,.5);
  z-index:3;
}

.playlist-turntableDeck__miniRecord{
  position:relative;
  width:58px;
  aspect-ratio:1/1;
  border-radius:999px;
  background:radial-gradient(circle at 32% 30%, rgba(255,255,255,.18), transparent 18%), radial-gradient(circle at center, #191d21 0 34%, #090b0d 34% 50%, #13161b 50% 74%, #040506 74% 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.05), 0 10px 18px rgba(0,0,0,.18);
}

.playlist-turntableDeck__miniGrooves,
.playlist-turntableDeck__miniShine,
.playlist-turntableDeck__miniArt{
  position:absolute;
  inset:0;
  border-radius:inherit;
}

.playlist-turntableDeck__miniGrooves{
  background: repeating-radial-gradient(circle at center, rgba(255,255,255,.02) 0 1px, rgba(255,255,255,0) 1px 4px, rgba(0,0,0,.26) 4px 5px, rgba(0,0,0,0) 5px 8px);
  opacity:.52;
}

.playlist-turntableDeck__miniShine{
  background: conic-gradient(from 210deg, rgba(255,255,255,.22), rgba(255,255,255,0) 14%, rgba(255,255,255,0) 60%, rgba(255,255,255,.14) 80%, rgba(255,255,255,.22));
  opacity:.4;
}

.playlist-turntableDeck__miniArt{
  inset:29%;
  background-position:center;
  background-size:cover;
  box-shadow: 0 0 0 2px rgba(255,255,255,.78), 0 0 0 3px rgba(0,0,0,.08);
}

.playlist-turntableDeck__monitorMeta{
  min-width:0;
  display:grid;
  gap:4px;
}

.playlist-turntableDeck__monitorEyebrow,
.playlist-turntableDeck__monitorSide{
  display:block;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#666;
}

.playlist-turntableDeck__monitorTitle{
  display:block;
  max-width: 15ch;
  font-size:15px;
  line-height:1.05;
  font-weight:600;
  color:#111;
}

.playlist-turntableDeck__badge{
  grid-column: 1 / -1;
  justify-self:start;
  min-width:84px;
  padding:7px 10px 6px;
  border:1px solid rgba(0,0,0,.16);
  border-radius:999px;
  background:rgba(17,17,17,.06);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.46);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  text-align:center;
  color:#555;
}

.playlist-turntableDeck__platter{
  position:absolute;
  top:51%;
  left:43%;
  width:min(75%, 610px);
  aspect-ratio:1/1;
  --record-angle: 0deg;
  transform:translate(-50%, -50%) rotate(var(--record-angle));
  border-radius:999px;
  cursor:grab;
  touch-action:none;
  user-select:none;
  background:
    radial-gradient(circle at center, rgba(12,12,12,.34) 0 18%, rgba(255,255,255,.05) 18% 20%, rgba(24,24,24,.88) 20% 59%, rgba(255,255,255,.05) 59% 60%, rgba(20,20,20,.9) 60% 80%, rgba(0,0,0,.78) 80% 100%);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.05), inset 0 0 0 10px rgba(0,0,0,.16), 0 28px 46px rgba(0,0,0,.18), 0 0 28px var(--deck-glow);
  z-index:0;
}

.playlist-turntableRecord{
  position:absolute;
  top:51%;
  left:43%;
  width:min(71%, 580px);
  aspect-ratio:1/1;
  --record-angle: 0deg;
  --record-cover: radial-gradient(circle at center, #15171a 0 60%, #050608 60% 100%);
  transform:translate(-50%, -50%) rotate(var(--record-angle));
  border-radius:999px;
  cursor:grab;
  touch-action:none;
  user-select:none;
  background:
    radial-gradient(circle at center, rgba(0,0,0,0) 0 56%, rgba(0,0,0,.1) 60%, rgba(0,0,0,.45) 74%, rgba(0,0,0,.72) 100%),
    radial-gradient(circle at 34% 30%, rgba(255,255,255,.18), transparent 18%),
    var(--record-cover);
  background-position:center;
  background-repeat:no-repeat;
  background-size:100% 100%, 100% 100%, cover;
  box-shadow: 0 28px 44px rgba(0,0,0,.28);
  transform-origin:center center;
  transform-style: preserve-3d;
  backface-visibility: visible;
  will-change: transform, box-shadow, filter;
  overflow:hidden;
  z-index:1;
}

.playlist-turntableRecord::after{
  content:"";
  position:absolute;
  inset:2.75%;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.06);
}

.playlist-turntableRecord.is-playing{
  animation:none;
}

.playlist-turntableRecord.is-scratching{
  cursor:grabbing;
  transition:none;
  box-shadow: 0 34px 56px rgba(0,0,0,.34);
}

.playlist-turntableRecord.is-sideFlipping{
  animation: playlist-record-side-flip 1.72s cubic-bezier(.18,.84,.22,1);
  z-index: 3;
  filter: saturate(1.04);
}

.playlist-turntableRecord__grooves,
.playlist-turntableRecord__shine,
.playlist-turntableRecord__label,
.playlist-turntableRecord__spindle{
  position:absolute;
  inset:0;
}

.playlist-turntableRecord__grooves{
  border-radius:999px;
  background: repeating-radial-gradient(circle at center, rgba(255,255,255,.03) 0 1px, rgba(255,255,255,0) 1px 6px, rgba(0,0,0,.14) 6px 7px, rgba(0,0,0,0) 7px 12px);
  opacity:.34;
  mix-blend-mode:soft-light;
}

.playlist-turntableRecord__shine{
  border-radius:999px;
  background: conic-gradient(from 208deg, rgba(255,255,255,.16), rgba(255,255,255,0) 12%, rgba(255,255,255,0) 36%, rgba(255,255,255,.08) 56%, rgba(255,255,255,0) 72%, rgba(255,255,255,.18) 100%);
  mix-blend-mode:screen;
  opacity:.42;
}

.playlist-turntableRecord__label{
  inset:auto;
  top:29.25%;
  left:29.25%;
  width:41.5%;
  height:41.5%;
  display:grid;
  place-items:center;
  padding:0;
  border-radius:50%;
  background: radial-gradient(circle at 36% 30%, rgba(255,255,255,1) 0%, rgba(250,247,240,.98) 62%, rgba(232,224,213,.96) 100%);
  color:#111;
  text-align:center;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.10), inset 0 0 0 11px rgba(255,255,255,.18), 0 0 0 8px rgba(0,0,0,.04);
}

.playlist-turntableRecord__labelInner{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:1px;
  width:100%;
  max-width:10.75ch;
  padding:16px 14px 14px;
}

.playlist-turntableRecord__label strong{
  display:block;
  margin:1px 0;
  max-width:6.6ch;
  font-size: clamp(13px, 1.32vw, 16px);
  line-height:1;
  font-weight:600;
}

.playlist-turntableRecord__labelKicker,
.playlist-turntableRecord__labelMeta,
#playlistTurntableTrackArtist{
  display:block;
  max-width: 10ch;
  font-size:8.35px;
  line-height:1.16;
}

.playlist-turntableRecord__labelKicker,
.playlist-turntableRecord__labelMeta{
  text-transform:uppercase;
  letter-spacing:.18em;
}

.playlist-turntableRecord__labelKicker{
  color:#232323;
}

.playlist-turntableRecord__labelMeta{
  color:#636363;
}

.playlist-turntableRecord__spindle{
  inset:calc(50% - 6px);
  width:12px;
  height:12px;
  border-radius:999px;
  background:#f8f8f8;
  box-shadow: 0 0 0 2px rgba(0,0,0,.24), 0 0 0 7px rgba(255,255,255,.06);
}

.playlist-turntableDeck__armBase{
  position:absolute;
  right:38px;
  top:88px;
  width:64px;
  height:64px;
  border-radius:999px;
  background: radial-gradient(circle at 34% 34%, rgba(255,255,255,.42), rgba(82,88,95,.82) 42%, rgba(19,21,24,.95) 73%, rgba(6,7,8,1) 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.2), 0 10px 18px rgba(0,0,0,.16);
  z-index:2;
}

.playlist-turntableDeck__armBase::after{
  content:"";
  position:absolute;
  inset:16px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
}

.playlist-turntableDeck__arm{
  position:absolute;
  right:62px;
  top:108px;
  width:214px;
  height:24px;
  transform-origin:right center;
  transform:rotate(38deg);
  transition:transform .82s cubic-bezier(.2,.86,.32,1.24);
  will-change: transform;
  z-index:2;
}

/* Needle tip sweeps onto outer groove during playback */
.playlist-turntableDeck[data-turntable-state="playing"] .playlist-turntableDeck__arm,
.playlist-turntableDeck[data-turntable-state="rewinding"] .playlist-turntableDeck__arm,
.playlist-turntableDeck[data-turntable-state="fast-forwarding"] .playlist-turntableDeck__arm,
.playlist-turntableDeck[data-turntable-state="scratching"] .playlist-turntableDeck__arm{
  transform: rotate(20deg);
}

.playlist-turntableDeck__armTube,
.playlist-turntableDeck__armHead,
.playlist-turntableDeck__needle{
  position:absolute;
  display:block;
}

.playlist-turntableDeck__armTube{
  left:34px;
  right:0;
  top:7px;
  height:8px;
  border-radius:999px;
  background:linear-gradient(270deg, rgba(255,255,255,.84), rgba(111,118,126,.94) 38%, rgba(44,49,55,.96));
  box-shadow: 0 1px 0 rgba(255,255,255,.22);
}

.playlist-turntableDeck__armHead{
  left:0;
  right:auto;
  top:0;
  width:34px;
  height:24px;
  border-radius:6px 6px 8px 8px;
  background:linear-gradient(180deg, #1a1d22, #08090c);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 8px 12px rgba(0,0,0,.18);
}

.playlist-turntableDeck__needle{
  left:4px;
  right:auto;
  top:16px;
  width:14px;
  height:20px;
  clip-path: polygon(0 0, 100% 0, 62% 100%, 38% 100%);
  background:linear-gradient(180deg, #43474d, #111315);
  transform: rotate(-10deg);
}

.playlist-turntableDeck__colorDock{
  position:absolute;
  right:24px;
  bottom:22px;
  display:grid;
  gap:0;
  width:min(248px, calc(100% - 48px));
  padding:12px 14px;
  border:1px solid rgba(0,0,0,.16);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.84), rgba(242,235,227,.8));
  box-shadow: 0 14px 24px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.46);
  z-index:2;
  transition: width .18s ease, padding .18s ease, box-shadow .18s ease, background .18s ease;
}

.playlist-turntableDeck__colorDock[data-collapsed="true"]{
  width:min(236px, calc(100% - 48px));
  padding:12px 14px;
  background:linear-gradient(180deg, rgba(255,255,255,.8), rgba(244,238,231,.76));
  box-shadow: 0 10px 18px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.48);
}

.playlist-turntableDeck__colorDockHeader{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  grid-template-areas:
    "title toggle"
    "meta meta"
    "bar bar";
  align-items:center;
  gap:6px 10px;
}

.playlist-turntableDeck__colorDockTitle{
  grid-area:title;
  display:block;
  min-width:0;
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#6a6258;
}

.playlist-turntableDeck__colorDockMeta{
  grid-area:meta;
  display:block;
  min-width:0;
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#6a6258;
}

.playlist-turntableDeck__colorDockBar{
  grid-area:bar;
  width:100%;
  box-sizing:border-box;
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  align-items:center;
  gap:10px;
  min-width:0;
  min-height:34px;
  padding:0 11px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  background:rgba(255,255,255,.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.52);
}

.playlist-turntableDeck__colorDockSwatch{
  flex:0 0 auto;
  width:16px;
  height:16px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.42);
  background:#d8c9b2;
}

.playlist-turntableDeck__colorDockValue{
  display:block;
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#4b453d;
}

.playlist-turntableDeck__colorDockToggle{
  grid-area:toggle;
  justify-self:end;
  align-self:start;
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:32px;
  padding:0 10px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:999px;
  background:rgba(255,255,255,.58);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.48);
  color:#4f493f;
  cursor:pointer;
}

.playlist-turntableDeck__colorDockToggleText{
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.playlist-turntableDeck__colorDockToggleIcon{
  width:8px;
  height:8px;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:translateY(-1px) rotate(45deg);
  transition:transform .18s ease;
}

.playlist-turntableDeck__colorDock[data-collapsed="false"] .playlist-turntableDeck__colorDockToggleIcon{
  transform:translateY(1px) rotate(-135deg);
}

.playlist-turntableDeck__colorDockBody{
  display:grid;
  gap:0;
  margin-top:12px;
}

.playlist-turntableDeck__colorDock[data-collapsed="true"] .playlist-turntableDeck__colorDockBody{
  display:none !important;
}

.playlist-turntableDeck__colorDock[data-collapsed="false"] .playlist-turntableDeck__colorDockBody{
  display:grid !important;
}

.playlist-turntableDeck__colorDockControls{
  display:grid;
  grid-template-columns:36px minmax(0, 1fr);
  grid-template-areas:
    "picker color"
    "hex hex";
  gap:10px;
  align-items:center;
}

.playlist-turntableDeck__colorPicker{
  grid-area:picker;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:12px;
  overflow:hidden;
  border:1px solid var(--deck-dock-ring);
  background: rgba(255,255,255,.66);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.42);
  color:transparent;
  font-size:0;
}

.playlist-turntableDeck__colorInput{
  grid-area:color;
  width:100%;
  min-width:0;
  height:36px;
  padding:0;
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  background:rgba(255,255,255,.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.52);
  cursor:pointer;
}

.playlist-turntableDeck__colorInput::-webkit-color-swatch-wrapper{
  padding:0;
}

.playlist-turntableDeck__colorInput::-webkit-color-swatch,
.playlist-turntableDeck__colorInput::-moz-color-swatch{
  border:0;
  border-radius:10px;
}

.playlist-turntableDeck__colorHex{
  grid-area:hex;
  width:100%;
  min-width:0;
  height:36px;
  padding:0 12px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.12);
  background:rgba(255,255,255,.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.52);
  font:inherit;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#23201c;
}

.playlist-turntableDeck__colorHex:focus,
.playlist-turntableDeck__colorInput:focus,
.playlist-turntableDeck__colorDockToggle:focus{
  outline:2px solid rgba(0,0,0,.22);
  outline-offset:2px;
}



/* Auto-color lock toggle — sits below the hex input inside the dock body */
.playlist-turntableDeck__colorLock{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:10px;
  padding:7px 11px;
  border:1px solid rgba(0,0,0,.11);
  border-radius:10px;
  background:rgba(255,255,255,.52);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.48);
  cursor:pointer;
  font:inherit;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#5a5248;
  width:100%;
  box-sizing:border-box;
  transition:background .16s ease, border-color .16s ease, color .16s ease;
}
.playlist-turntableDeck__colorLock:hover{
  background:rgba(255,255,255,.72);
  border-color:rgba(0,0,0,.18);
}
.playlist-turntableDeck__colorLock:focus-visible{
  outline:2px solid rgba(0,0,0,.22);
  outline-offset:2px;
}
.playlist-turntableDeck__colorLockIcon{
  position:relative;
  flex:0 0 auto;
  width:12px;
  height:11px;
  border:1.5px solid currentColor;
  border-radius:2px;
  margin-top:2px;
}
.playlist-turntableDeck__colorLockIcon::before{
  content:"";
  position:absolute;
  top:-6px;
  left:50%;
  transform:translateX(-50%);
  width:8px;
  height:7px;
  border:1.5px solid currentColor;
  border-bottom:none;
  border-radius:4px 4px 0 0;
  transition:opacity .16s ease;
}
.playlist-turntableDeck__colorLock[data-locked="true"]{
  background:rgba(17,17,17,.08);
  border-color:rgba(0,0,0,.22);
  color:#2a2520;
  font-weight:600;
}
.playlist-turntableDeck__colorLock[data-locked="true"] .playlist-turntableDeck__colorLockIcon{
  border-color:currentColor;
}
.playlist-turntableDeck__colorLockAuto{
  margin-left:auto;
  font-size:9px;
  letter-spacing:.1em;
  color:#888;
  text-transform:uppercase;
}
.playlist-turntableDeck__colorLock[data-locked="true"] .playlist-turntableDeck__colorLockAuto{
  display:none;
}

.playlist-turntableDeck[data-turntable-state="playing"] .playlist-turntableDeck__badge{
  background:#111;
  color:#fff;
}

.playlist-turntableDeck.is-sideFlipping .playlist-turntableDeck__arm{
  transform:translate(0, -22px) rotate(10deg);
}

.playlist-turntableDeck.is-sideFlipping .playlist-turntableDeck__badge{
  background:#111;
  color:#fff;
}

.playlist-turntableDeck.is-sideFlipping .playlist-turntableRecord__shine{
  opacity:.68;
}

.playlist-turntableDeck.is-sideFlipping .playlist-turntableRecord__label{
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08), inset 0 0 0 12px rgba(255,255,255,.26), 0 18px 28px rgba(0,0,0,.12);
}

.playlist-turntableDeck.is-sideFlipping .playlist-turntableDeck__platter{
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.05), inset 0 0 0 10px rgba(0,0,0,.16), 0 22px 30px rgba(0,0,0,.1), 0 0 36px var(--deck-glow);
}

.playlist-turntableControls{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:12px;
  padding:16px;
  border:1px solid rgba(0,0,0,.22);
  border-radius: 22px;
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(245,245,245,.96));
}

.playlist-turntableControls__stack{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:8px;
}

.playlist-turntableControls__stack--transport{
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.playlist-turntableControls__stack--utility{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.playlist-turntableControls__button,
.playlist-controlShell button,
.playlist-playerShell button{
  border:1px solid rgba(0,0,0,.22);
  border-radius: 8px;
  background:#fff;
  color:#111;
  font:inherit;
  padding:6px 10px;
}

.playlist-turntableControls__button{
  min-height:42px;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:10px;
  background:linear-gradient(180deg, #fbfbfb, #efefef);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.54);
}

.playlist-turntableControls__button--transport,
.playlist-playerShell__button--transport{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
}

.playlist-controlIcon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
}

.playlist-controlIcon svg{
  display:block;
  width:100%;
  height:100%;
  fill:currentColor;
}

.playlist-turntableControls__button--transport .playlist-controlIcon{
  width:18px;
  height:18px;
}

.playlist-turntableControls__button--play.is-playing{
  background:#111;
  color:#fff;
}

.playlist-turntableControls__meter{
  display:flex;
  align-items:flex-end;
  gap:4px;
  min-height:56px;
  padding:10px 11px;
  border:1px solid rgba(0,0,0,.16);
  border-radius: 14px;
  background:linear-gradient(180deg, rgba(255,255,255,.46), rgba(0,0,0,.04));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4);
}

.playlist-turntableControls__meter span{
  flex:1;
  min-height:8px;
  height:10px;
  border-radius:999px 999px 4px 4px;
  background:rgba(0,0,0,.16);
  transition:height .1s linear, background-color .14s ease, opacity .14s ease, transform .14s ease;
  transform-origin:center bottom;
  opacity:.34;
}

.playlist-turntableControls.is-playing .playlist-turntableControls__meter span{
  background:rgba(0,0,0,.82);
  opacity:1;
}

.playlist-turntableControls__meter--cthugha{
  position:relative;
  display:block;
  min-height:230px;
  width:100%;
  max-width:100%;
  padding:0;
  overflow:hidden;
  border-radius:22px;
  background:radial-gradient(circle at 50% 10%, rgba(255,255,255,.08), rgba(8,8,10,.96) 30%, rgba(0,0,0,1) 82%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06), inset 0 1px 0 rgba(255,255,255,.08), 0 14px 28px rgba(0,0,0,.14);
  isolation:isolate;
  transition:left .38s cubic-bezier(.22,.84,.24,1), top .38s cubic-bezier(.22,.84,.24,1), width .38s cubic-bezier(.22,.84,.24,1), height .38s cubic-bezier(.22,.84,.24,1), border-radius .28s ease, box-shadow .28s ease, filter .28s ease;
}

.playlist-turntableControls__meter--cthugha::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.06), transparent 22%, transparent 78%, rgba(255,255,255,.03));
  pointer-events:none;
  z-index:1;
}

.playlist-turntableControls__meter--cthugha[data-locked="true"]{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.1), inset 0 1px 0 rgba(255,255,255,.08), 0 16px 30px rgba(0,0,0,.18), 0 0 0 1px rgba(214,232,255,.22);
}

.playlist-turntableControls__meter--cthugha[data-locked="true"]::before{
  content:"";
  position:absolute;
  inset:8px;
  border-radius:16px;
  border:1px solid rgba(194,224,255,.18);
  box-shadow:0 0 0 1px rgba(82,134,198,.1) inset;
  pointer-events:none;
  z-index:2;
}

.playlist-turntableControls__meter--cthugha.is-focus-floating{
  position:fixed;
  min-height:0;
  margin:0;
  z-index:1401;
}

.playlist-turntableControls__meter--cthugha.is-focus-mode{
  border-radius:28px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08), inset 0 1px 0 rgba(255,255,255,.08), 0 26px 72px rgba(0,0,0,.44), 0 0 0 1px rgba(255,255,255,.08);
  filter:saturate(1.04);
}

.playlist-turntableControls__visualizerPlaceholder{
  display:block;
  width:100%;
  min-height:230px;
  border-radius:22px;
  visibility:hidden;
  pointer-events:none;
}

.playlist-turntableControls__visualizerBackdrop{
  position:fixed;
  inset:0;
  z-index:1400;
  background:rgba(4,4,6,0);
  opacity:0;
  pointer-events:none;
  transition:opacity .38s ease, background .38s ease;
}

.playlist-turntableControls__visualizerBackdrop.is-visible{
  opacity:1;
  background:rgba(4,4,6,.84);
  pointer-events:auto;
}

body.playlists-page.is-visualizerFocus{
  overflow:hidden;
}


.playlist-turntableControls__visualizerCanvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  background:#000;
  image-rendering:pixelated;
  image-rendering:crisp-edges;
}

.playlist-turntableControls__visualizerLauncher,
.playlist-turntableControls__visualizerWheel{
  position:absolute;
  z-index:3;
}

.playlist-turntableControls__visualizerLauncher{
  right:12px;
  top:12px;
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  padding:0;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(244,241,236,.9);
  color:#231f1a;
  box-shadow:0 8px 18px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.74);
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.playlist-turntableControls__visualizerLauncher:hover,
.playlist-turntableControls__visualizerLauncher:focus-visible{
  transform:translateY(-1px) scale(1.04);
  box-shadow:0 12px 22px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.82);
  outline:none;
}

.playlist-turntableControls__visualizerLauncher span{
  display:block;
  width:12px;
  height:1.5px;
  border-radius:999px;
  background:currentColor;
}

.playlist-turntableControls__visualizerLauncher span + span{
  margin-top:2px;
}

.playlist-turntableControls__visualizerWheel{
  right:6px;
  top:6px;
  width:144px;
  height:144px;
  opacity:0;
  transform:scale(.72);
  transform-origin:calc(100% - 22px) 22px;
  pointer-events:none;
  transition:opacity .18s ease, transform .22s cubic-bezier(.22,.84,.24,1.14);
}

.playlist-turntableControls__visualizerWheel.is-open{
  opacity:1;
  transform:scale(1);
  pointer-events:auto;
}

.playlist-turntableControls__visualizerWheel::before{
  content:"";
  position:absolute;
  inset:6px;
  border-radius:999px;
  background:radial-gradient(circle at 34% 28%, rgba(255,255,255,.18), rgba(30,30,34,.78) 42%, rgba(8,8,10,.96) 74%);
  box-shadow:0 18px 30px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.08);
}

.playlist-turntableControls__visualizerAction,
.playlist-turntableControls__visualizerClose{
  position:absolute;
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  padding:0;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(15,15,18,.9);
  color:rgba(255,255,255,.94);
  box-shadow:0 8px 14px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08);
  cursor:pointer;
}

.playlist-turntableControls__visualizerAction{
  left:calc(50% - 12px);
  top:calc(50% - 12px);
  transform:rotate(var(--angle)) translateY(-54px) rotate(calc(var(--angle) * -1));
}

.playlist-turntableControls__visualizerAction span{
  font-size:10px;
  font-weight:700;
  letter-spacing:.03em;
}

.playlist-turntableControls__visualizerAction[data-action="focus"] span{
  font-size:12px;
  line-height:1;
}


.playlist-turntableControls__visualizerAction:hover,
.playlist-turntableControls__visualizerAction:focus-visible,
.playlist-turntableControls__visualizerClose:hover,
.playlist-turntableControls__visualizerClose:focus-visible{
  outline:none;
  background:rgba(239,234,226,.96);
  color:#1a1713;
}

.playlist-turntableControls__visualizerClose{
  left:calc(50% - 14px);
  top:calc(50% - 14px);
  width:28px;
  height:28px;
  background:rgba(239,234,226,.96);
  color:#1a1713;
  font-size:16px;
  line-height:1;
}

.playlist-turntableControls__visualizerTooltip{
  position:absolute;
  right:48px;
  top:12px;
  z-index:4;
  display:grid;
  gap:2px;
  min-width:118px;
  max-width:168px;
  padding:7px 10px 8px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  background:rgba(12,12,15,.9);
  color:rgba(255,255,255,.96);
  box-shadow:0 12px 24px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.08);
  opacity:0;
  transform:translateY(-4px) scale(.96);
  transform-origin:100% 0;
  pointer-events:none;
  transition:opacity .14s ease, transform .16s ease;
}

.playlist-turntableControls__visualizerTooltip::after{
  content:"";
  position:absolute;
  right:-5px;
  top:14px;
  width:10px;
  height:10px;
  border-right:1px solid rgba(255,255,255,.14);
  border-bottom:1px solid rgba(255,255,255,.14);
  background:rgba(12,12,15,.9);
  transform:rotate(-45deg);
}

.playlist-turntableControls__visualizerTooltip.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}

.playlist-turntableControls__visualizerTooltipTitle{
  font-size:10px;
  font-weight:700;
  line-height:1.1;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.playlist-turntableControls__visualizerTooltipHint{
  font-size:11px;
  line-height:1.15;
  letter-spacing:.01em;
  color:rgba(255,255,255,.72);
}


.playlist-turntableControls__visualizerAction.is-active{
  background:rgba(239,234,226,.96);
  color:#17130f;
  border-color:rgba(255,255,255,.28);
}

.playlist-turntableControls__visualizerLauncher.is-locked{
  background:rgba(214,232,255,.96);
  color:#102235;
  box-shadow:0 0 0 2px rgba(174,214,255,.24), 0 12px 22px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.84);
}

.playlist-turntableControls__visualizerLauncher.is-cycling{
  box-shadow:0 0 0 2px rgba(120,204,255,.16), 0 10px 22px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.74);
}

.playlist-turntableControls__visualizerAction.is-pulsing{
  animation:playlistVisualizerPulse .28s ease;
}

.playlist-turntableControls__visualizerAction.is-denied{
  animation:playlistVisualizerDenied .4s ease;
}

.playlist-turntableControls__visualizerToast{
  position:absolute;
  left:12px;
  bottom:12px;
  z-index:4;
  min-width:120px;
  max-width:184px;
  padding:7px 10px 8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(10,10,12,.84);
  color:rgba(255,255,255,.96);
  box-shadow:0 12px 24px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06);
  opacity:0;
  transform:translateY(6px) scale(.97);
  pointer-events:none;
  transition:opacity .14s ease, transform .16s ease;
}

.playlist-turntableControls__visualizerToast.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}

.playlist-turntableControls__visualizerToastTitle{
  display:block;
  font-size:10px;
  font-weight:700;
  line-height:1.1;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.playlist-turntableControls__visualizerToastHint{
  display:block;
  margin-top:2px;
  font-size:11px;
  line-height:1.15;
  color:rgba(255,255,255,.72);
}

.playlist-turntableControls__visualizerLive{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.playlist-turntableControls__nowSpinning{
  display:grid;
  grid-template-columns:52px minmax(0, 1fr);
  gap:10px 14px;
  align-items:center;
  padding:12px 14px;
  border:1px solid rgba(0,0,0,.16);
  border-radius:16px;
  background:linear-gradient(180deg, rgba(255,255,255,.84), rgba(246,241,234,.78));
  box-shadow:0 10px 18px rgba(0,0,0,.06), inset 0 1px 0 rgba(255,255,255,.46);
}

.playlist-turntableControls__nowSpinning .playlist-turntableDeck__miniRecord{
  width:52px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05), 0 8px 14px rgba(0,0,0,.14);
}

.playlist-turntableControls__nowSpinning .playlist-turntableDeck__monitorMeta{
  gap:3px;
}

.playlist-turntableControls__nowSpinning .playlist-turntableDeck__monitorEyebrow,
.playlist-turntableControls__nowSpinning .playlist-turntableDeck__monitorSide{
  font-size:9px;
  letter-spacing:.15em;
}

.playlist-turntableControls__nowSpinning .playlist-turntableDeck__monitorTitle{
  max-width:none;
  font-size:13px;
  line-height:1.1;
}

.playlist-turntableControls__nowSpinning .playlist-turntableDeck__badge{
  min-width:0;
  padding:6px 9px 5px;
  font-size:9px;
  letter-spacing:.15em;
  border-radius:999px;
}

.playlist-turntableControls__meta,
.playlist-turntableControls__eyebrow,
.playlist-turntableControls__track{
  display:none;
}

.playlist-turntableControls__meta{
  padding:4px 2px;
}

.playlist-turntableControls__eyebrow{
  margin:0 0 6px;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#5f5f5f;
}

.playlist-turntableControls__track{
  margin:0;
  font-size:14px;
  line-height:1.35;
}


.playlist-turntableControls__volume{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr) auto;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border:1px solid rgba(0,0,0,.16);
  border-radius: 12px;
  background:rgba(0,0,0,.04);
}

.playlist-turntableControls__volumeLabel,
.playlist-turntableQueue__label{
  margin:0;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#5f5f5f;
}

#playlistVolumeRange{
  width:100%;
  accent-color:#111;
}

.playlist-turntableControls__volumeValue{
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#444;
  min-width:36px;
  text-align:right;
}

.playlist-turntableControls__adjacent{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.playlist-turntableControls__adjacentButton{
  display:grid;
  justify-items:center;
  gap:8px;
  padding:10px 12px 12px;
  border:1px solid rgba(0,0,0,.16);
  border-radius:14px;
  background:rgba(0,0,0,.04);
  cursor:pointer;
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.playlist-turntableControls__adjacentButton:hover,
.playlist-turntableControls__adjacentButton:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(0,0,0,.26);
  box-shadow:0 12px 22px rgba(0,0,0,.08);
}

.playlist-turntableControls__adjacentButton:focus-visible{
  outline:2px solid rgba(17,17,17,.35);
  outline-offset:2px;
}

.playlist-turntableControls__adjacentButton.is-disabled,
.playlist-turntableControls__adjacentButton:disabled{
  opacity:.45;
  cursor:default;
  transform:none;
  box-shadow:none;
}

.playlist-turntableControls__adjacentLabel{
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#5f5f5f;
}

.playlist-turntableControls__adjacentCoverWrap{
  display:grid;
  place-items:center;
  width:74px;
  aspect-ratio:1/1;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 10px 18px rgba(0,0,0,.12);
}

.playlist-turntableControls__adjacentCover{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.playlist-turntableQueue{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:12px;
  border:1px solid rgba(0,0,0,.16);
  border-radius: 14px;
  background:rgba(0,0,0,.04);
}

.playlist-turntableQueue__grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
}

.playlist-turntableQueue__section{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
}

.playlist-turntableQueue__list{
  list-style:none;
  margin:0;
  padding:0;
}

.playlist-turntableQueue__item{
  display:block;
}

.playlist-turntableQueue__card{
  width:100%;
  display:grid;
  grid-template-columns:78px minmax(0, 1fr);
  gap:12px;
  align-items:center;
  min-width:0;
  padding:10px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:16px;
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(244,244,244,.9));
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  text-align:left;
}

.playlist-turntableQueue__card--previous,
.playlist-turntableQueue__card--upcoming{
  grid-template-columns:minmax(0, 1fr);
  gap:10px;
  align-items:start;
  padding:0;
  border:none;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

button.playlist-turntableQueue__card{
  font:inherit;
  color:inherit;
  cursor:pointer;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

button.playlist-turntableQueue__card:hover,
button.playlist-turntableQueue__card:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(0,0,0,.22);
  box-shadow:0 14px 26px rgba(0,0,0,.08);
  outline:none;
}

button.playlist-turntableQueue__card--previous:hover,
button.playlist-turntableQueue__card--previous:focus-visible,
button.playlist-turntableQueue__card--upcoming:hover,
button.playlist-turntableQueue__card--upcoming:focus-visible{
  border-color:transparent;
  box-shadow:none;
  transform:translateY(-1px);
}

.playlist-turntableQueue__item--current .playlist-turntableQueue__card{
  grid-template-columns:112px minmax(0, 1fr);
  padding:12px;
  border-radius:20px;
  background:#111;
  color:#fff;
  border-color:#111;
  box-shadow:0 16px 34px rgba(0,0,0,.16);
}

.playlist-turntableQueue__coverWrap{
  position:relative;
  width:100%;
  aspect-ratio:1 / 1;
  border-radius:14px;
  overflow:hidden;
  background:rgba(17,17,17,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.34);
}

.playlist-turntableQueue__card--previous .playlist-turntableQueue__coverWrap,
.playlist-turntableQueue__card--upcoming .playlist-turntableQueue__coverWrap{
  border-radius:16px;
  background:transparent;
  box-shadow:none;
}

.playlist-turntableQueue__item--current .playlist-turntableQueue__coverWrap{
  border-radius:18px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
}

.playlist-turntableQueue__cover{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.playlist-turntableQueue__badge{
  position:absolute;
  left:8px;
  bottom:8px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:20px;
  padding:0 8px;
  border-radius:999px;
  background:rgba(17,17,17,.76);
  backdrop-filter:blur(8px);
  font-size:9px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#fff;
}

.playlist-turntableQueue__text{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:5px;
}

.playlist-turntableQueue__card--previous .playlist-turntableQueue__text,
.playlist-turntableQueue__card--upcoming .playlist-turntableQueue__text{
  gap:3px;
}

.playlist-turntableQueue__eyebrow{
  display:block;
  font-size:9px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#757575;
}

.playlist-turntableQueue__item--current .playlist-turntableQueue__eyebrow{
  color:rgba(255,255,255,.62);
}

.playlist-turntableQueue__title,
.playlist-turntableQueue__artist{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
}

.playlist-turntableQueue__title{
  font-size:13px;
  line-height:1.2;
  white-space:nowrap;
}

.playlist-turntableQueue__card--previous .playlist-turntableQueue__title,
.playlist-turntableQueue__card--upcoming .playlist-turntableQueue__title{
  font-size:12px;
  white-space:normal;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}

.playlist-turntableQueue__item--current .playlist-turntableQueue__title{
  font-size:16px;
}

.playlist-turntableQueue__artist{
  font-size:11px;
  line-height:1.35;
  color:#666;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  white-space:normal;
}

.playlist-turntableQueue__card--previous .playlist-turntableQueue__artist,
.playlist-turntableQueue__card--upcoming .playlist-turntableQueue__artist{
  font-size:10px;
  -webkit-line-clamp:2;
}

.playlist-turntableQueue__item--current .playlist-turntableQueue__artist{
  color:rgba(255,255,255,.76);
}

.playlist-playerShell__button.is-playing{
  background:#111;
  color:#fff;
}

.playlist-grid--bSide{
  grid-template-columns: repeat(5, minmax(0, 1fr));
  grid-auto-rows: 1fr;
}

.playlist-coverButton--bSide{
  min-height: 132px;
}

.playlist-module--bside{
  min-height: 500px;
}

.playlist-module__flipShell--bside{
  min-height: 472px;
}

.playlist-module--bsideInteractive .playlist-module__face--front{
  min-height: 472px;
}

.playlist-module--bsideInteractive .playlist-module__face--back{
  min-height: 472px;
}

.playlist-detailCard--horizontal{
  flex-direction: row;
  align-items: stretch;
  gap:18px;
}

.playlist-detailCard__coverWrap--horizontal{
  flex: 0 0 min(33%, 260px);
}

.playlist-detailCard--horizontal .playlist-detailCard__body{
  flex:1;
  justify-content:center;
}

.playlist-detailLinks--horizontal{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.playlist-archiveHook{
  margin: 24px 0 0 244px;
  padding:18px;
}


.playlist-archiveHook{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
}

.playlist-archiveHook__copy{
  min-width:0;
}

.playlist-archiveHook__actions{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
}

.playlist-archiveHook__button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  padding:0 16px;
  border:1px solid rgba(0,0,0,.22);
  text-decoration:none;
  color:#111;
  background:#fff;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}

.playlist-archiveHook__button:hover,
.playlist-archiveHook__button:focus-visible{
  background:#111;
  color:#fff;
  border-color:#111;
}

.playlist-archiveHook__meta{
  margin:0;
  font-size:12px;
  color:#5f5f5f;
  text-align:right;
}

.playlist-playerShell{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:10020;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  min-height: 32px;
  padding: 4px 14px;
  background:rgba(255,255,255,.96);
  border-top:1px solid rgba(0,0,0,.16);
}

.playlist-playerShell__controls{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}

.playlist-playerShell__button{
  min-width:38px;
  min-height:30px;
  line-height:1;
  padding:0 10px;
  cursor:pointer;
  border-radius:999px;
}

.playlist-turntableControls__button.is-scrubbing,
.playlist-playerShell__button.is-scrubbing{
  background:#111;
  color:#fff;
}

.playlist-playerShell__button--transport .playlist-controlIcon{
  width:16px;
  height:16px;
}

.playlist-playerShell__button.is-playing,
.playlist-turntableControls__button--play.is-playing{
  background:#111;
  color:#fff;
}

.playlist-playerShell__meta{
  min-width:0;
}

.playlist-playerShell__status{
  margin:0 0 2px;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#6c6c6c;
}

.playlist-playerShell__marquee{
  position:relative;
  overflow:hidden;
  white-space:nowrap;
  font-size:13px;
}

.playlist-playerShell__marqueeTrack{
  display:inline-flex;
  min-width:max-content;
  gap:44px;
  will-change:transform;
  animation:playlist-marquee 18s linear infinite;
}

.playlist-playerShell__marqueeText{
  display:inline-block;
}

.playlist-playerShell__time{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  color:#555;
}

.playlist-playerShell__timeSlash{
  opacity:.5;
}

body.playlists-page .nav a[aria-current="page"]{
  text-decoration: underline;
}

@keyframes playlist-marquee{
  from { transform: translateX(0); }
  to { transform: translateX(calc(-50% - 22px)); }
}

@keyframes playlist-record-spin{
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

.playlist-turntableControls__meter--cthugha.is-focus-mode .playlist-turntableControls__visualizerLauncher{
  right:16px;
  top:16px;
}

.playlist-turntableControls__meter--cthugha.is-focus-mode .playlist-turntableControls__visualizerWheel{
  right:10px;
  top:10px;
}

@media (prefers-reduced-motion: reduce){
  .playlist-turntableControls__meter--cthugha,
  .playlist-turntableControls__visualizerBackdrop,
  .playlist-turntableControls__visualizerWheel,
  .playlist-turntableControls__visualizerTooltip,
  .playlist-turntableControls__visualizerToast,
  .playlist-turntableControls__visualizerLauncher{
    transition-duration:.18s !important;
  }
}

@media (max-width: 1180px){
  .playlist-turntableStage{
    grid-template-columns:minmax(0, 1fr) 320px;
    gap:18px;
  }

  .playlist-turntableControls__meter--cthugha{
    min-height:216px;
  }
}

@media (max-width: 980px){
  body.playlists-page .playlists-canvas{
    width:min(100vw - 24px, 920px);
    padding-bottom: 110px;
  }

  .playlists-intro,
  .playlist-support,
  .playlist-archiveHook{
    margin-left: 0;
  }

  .playlist-archiveHook{
    flex-direction:column;
    align-items:flex-start;
  }

  .playlist-archiveHook__actions{
    align-items:flex-start;
  }

  .playlist-archiveHook__meta{
    text-align:left;
  }

  .playlists-stage{
    grid-template-columns: 1fr;
  }

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

  .playlist-turntableDeck{
    min-height: 360px;
  }

  .playlist-turntableDeck__platter,
  .playlist-turntableRecord{
    left:50%;
  }

  .playlist-turntableDeck__monitor{
    min-width: 0;
    max-width: calc(100% - 48px);
  }

  .playlist-turntableControls{
    min-height: 0;
  }

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

  .playlist-turntableQueue__item--current .playlist-turntableQueue__card,
  .playlist-turntableQueue__card{
    grid-template-columns:84px minmax(0, 1fr);
  }

  .playlist-module--aside{
    grid-row:auto;
    min-height: 0;
  }

  .playlist-module__flipShell{
    min-height: 0;
  }

  .playlist-module__face{
    position:relative;
    transform:none;
    backface-visibility:visible;
    -webkit-backface-visibility:visible;
  }

  .playlist-module__face--back{
    display:none;
  }

  .playlist-module--asideInteractive.is-detail .playlist-module__face--front,
  .playlist-module--bsideInteractive.is-detail .playlist-module__face--front{
    display:none;
  }

  .playlist-module--asideInteractive.is-detail .playlist-module__face--back,
  .playlist-module--bsideInteractive.is-detail .playlist-module__face--back{
    display:flex;
  }

  .playlist-module--bside{
    min-height:0;
  }

  .playlist-module__flipShell--bside,
  .playlist-module--bsideInteractive .playlist-module__face--front,
  .playlist-module--bsideInteractive .playlist-module__face--back{
    min-height:0;
  }

  .playlist-grid--vertical,
  .playlist-grid--horizontal{
    grid-template-columns: repeat(5, minmax(0,1fr));
  }

  .playlist-detailCard--horizontal{
    flex-direction:column;
  }

  .playlist-support__header{
    flex-direction:column;
  }

  .playlist-support__button{
    width:100%;
  }

  .playlist-detailCard__coverWrap--horizontal{
    flex-basis:auto;
  }
}

@media (max-width: 640px){
  .playlist-grid--vertical,
  .playlist-grid--horizontal{
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

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

  .playlist-turntableDeck{
    min-height: 300px;
    border-radius: 22px;
  }

  .playlist-turntableDeck__brand{
    width:128px;
  }

  .playlist-turntableDeck__monitor{
    top:16px;
    right:16px;
    left:16px;
    grid-template-columns: 50px minmax(0, 1fr);
    gap:10px;
    padding:12px 14px;
  }

  .playlist-turntableDeck__monitorTitle{
    font-size:13px;
  }

  .playlist-turntableDeck__colorDock{
    right:16px;
    bottom:16px;
    min-width: 0;
    width:min(236px, calc(100% - 32px));
    max-width: calc(100% - 32px);
    padding:12px 14px;
  }

  .playlist-turntableDeck__arm{
    right:34px;
    top:126px;
    width:126px;
  }

  .playlist-turntableDeck__armBase{
    right:18px;
    top:104px;
    width:52px;
    height:52px;
  }


  .playlist-turntableControls__stack{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .playlist-turntableControls__volume{
    grid-template-columns: 1fr;
    align-items:flex-start;
  }

  .playlist-turntableControls__volumeValue{
    text-align:left;
  }

  .playlist-playerShell{
    grid-template-columns: 1fr;
    align-items:flex-start;
    gap:8px;
  }

  .playlist-playerShell__time{
    justify-self:start;
  }
}


.playlist-coverButton{
  position:relative;
}

.playlist-coverButton.is-current{
  border-color: rgba(0,0,0,.68);
  box-shadow: 0 0 0 2px rgba(17,17,17,.14), 0 16px 26px rgba(0,0,0,.14);
}

.playlist-coverButton.is-current::after{
  content:"now on deck";
  position:absolute;
  left:8px;
  bottom:8px;
  padding:4px 6px;
  background:rgba(17,17,17,.88);
  color:#fff;
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.playlist-turntableRecord__label{
  position:relative;
  overflow:hidden;
}

.playlist-turntableRecord__label::before{
  content:"";
  position:absolute;
  inset:10.5%;
  border-radius:inherit;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08), inset 0 0 0 8px rgba(255,255,255,.12);
  pointer-events:none;
}

.playlist-turntableRecord__label::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:radial-gradient(circle at center, rgba(255,255,255,.20), rgba(255,255,255,0) 52%);
  pointer-events:none;
}

.playlist-turntableControls__button{
  cursor:pointer;
}

.playlist-turntableControls__button[aria-disabled="true"]{
  cursor:default;
}

.playlist-turntableControls__button.is-live{
  border-color: rgba(0,0,0,.34);
  background:rgba(255,255,255,.9);
}

.playlist-turntableControls__button--play.is-playing{
  background:#111;
  color:#fff;
}

@media (max-width: 900px){
  .playlist-coverButton.is-current::after{
    font-size:9px;
    left:6px;
    bottom:6px;
  }
}


@keyframes playlist-record-side-flip{
  0%{
    transform:translate3d(-50%, -50%, 0) rotateZ(var(--flip-start-angle, 0deg)) rotateX(0deg) scale(1);
    box-shadow:0 24px 38px rgba(0,0,0,.24);
    filter:saturate(1);
  }
  8%{
    transform:translate3d(-50%, -51%, 4px) rotateZ(calc(var(--flip-start-angle, 0deg) + 4deg)) rotateX(6deg) scale(1.002);
    box-shadow:0 28px 42px rgba(0,0,0,.24);
  }
  22%{
    transform:translate3d(-50%, -58%, 22px) rotateZ(calc(var(--flip-start-angle, 0deg) + 18deg)) rotateX(34deg) scale(1.008);
    box-shadow:0 42px 58px rgba(0,0,0,.18);
    filter:saturate(1.02) brightness(1.01);
  }
  38%{
    transform:translate3d(-50%, -67%, 62px) rotateZ(calc(var(--flip-start-angle, 0deg) + 62deg)) rotateX(78deg) scale(1.016);
    box-shadow:0 58px 72px rgba(0,0,0,.12);
    filter:saturate(1.04) brightness(1.03);
  }
  50%{
    transform:translate3d(-50%, -71%, 82px) rotateZ(calc(var(--flip-start-angle, 0deg) + 90deg)) rotateX(89deg) scale(1.02);
    box-shadow:0 66px 82px rgba(0,0,0,.08);
    filter:saturate(1.06) brightness(1.04);
  }
  62%{
    transform:translate3d(-50%, -68%, 68px) rotateZ(calc(var(--flip-start-angle, 0deg) + 120deg)) rotateX(76deg) scale(1.016);
    box-shadow:0 56px 72px rgba(0,0,0,.12);
    filter:saturate(1.05) brightness(1.03);
  }
  78%{
    transform:translate3d(-50%, -58%, 30px) rotateZ(calc(var(--flip-start-angle, 0deg) + 156deg)) rotateX(28deg) scale(1.008);
    box-shadow:0 34px 48px rgba(0,0,0,.18);
    filter:saturate(1.03) brightness(1.02);
  }
  90%{
    transform:translate3d(-50%, -52%, 8px) rotateZ(calc(var(--flip-end-angle, 180deg) + 8deg)) rotateX(10deg) scale(1.004);
    box-shadow:0 28px 40px rgba(0,0,0,.2);
    filter:saturate(1.01) brightness(1.01);
  }
  100%{
    transform:translate3d(-50%, -50%, 0) rotateZ(var(--flip-end-angle, 180deg)) rotateX(0deg) scale(1);
    box-shadow:0 24px 38px rgba(0,0,0,.24);
    filter:saturate(1);
  }
}


.playlist-support{
  margin: 34px 0 0 244px;
  padding:18px;
  background:rgba(255,255,255,.76);
  border:1px solid rgba(0,0,0,.12);
  box-shadow:0 12px 28px rgba(0,0,0,.08);
}

.playlist-support__header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
}

.playlist-support__header h2{
  margin:0;
  font-size:26px;
  line-height:1.05;
}

.playlist-support__copy{
  margin:8px 0 0;
  max-width:720px;
  font-size:13px;
  line-height:1.5;
  color:#3f3f3f;
}

.playlist-support__button{
  flex:0 0 auto;
  min-width:142px;
  min-height:36px;
  padding:8px 14px;
  border:1px solid rgba(0,0,0,.74);
  background:#fff;
  color:#111;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background-color .18s ease, color .18s ease, opacity .18s ease;
}

.playlist-support__button:hover,
.playlist-support__button:focus-visible{
  background:#111;
  color:#fff;
}

.playlist-support__button[disabled]{
  cursor:default;
  opacity:.52;
}

.playlist-support__meta{
  display:flex;
  align-items:baseline;
  gap:8px;
  margin:16px 0 12px;
}

.playlist-support__count{
  font-size:28px;
  line-height:1;
}

.playlist-support__label{
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#666;
}

.playlist-support__grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(184px, 1fr));
  gap:14px;
}

.playlist-supportCard{
  display:grid;
  grid-template-columns:56px minmax(0,1fr);
  gap:12px;
  align-items:center;
  min-height:76px;
  padding:12px;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(0,0,0,.1);
  box-shadow:0 8px 18px rgba(0,0,0,.05);
}

.playlist-supportCard__avatar{
  width:56px;
  height:56px;
  border-radius:999px;
  object-fit:cover;
  display:block;
  background:#e6e6e6;
}

.playlist-supportCard__body{
  min-width:0;
  display:grid;
  gap:4px;
}

.playlist-supportCard__badge,
.playlist-supportCard__username,
.playlist-supportCard__meta{
  display:block;
}

.playlist-supportCard__badgeRow{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.playlist-supportCard__badge{
  display:inline-flex;
  align-items:center;
  max-width:100%;
  padding:4px 8px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:999px;
  background:rgba(0,0,0,.04);
  color:#111;
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.playlist-supportCard__username{
  font-size:12px;
  line-height:1.2;
  color:#2d2d2d;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.playlist-supportCard__meta{
  font-size:10px;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:#6a6a6a;
}

@media (max-width: 840px){
  .playlist-turntableControls__nowSpinning{
    grid-template-columns:44px minmax(0,1fr);
    padding:9px 10px;
    gap:8px 10px;
  }

  .playlist-turntableControls__nowSpinning .playlist-turntableDeck__miniRecord{
    width:44px;
  }
}


/* ============================================================
   MODE BAR
   ============================================================ */
.playlist-modeBar{position:fixed;left:14px;bottom:48px;z-index:10021;display:flex;align-items:center;gap:6px;padding:5px 8px 5px 7px;border:1px solid rgba(0,0,0,.18);border-radius:999px;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 4px 14px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.7);}
.playlist-modeBar__group{display:flex;align-items:center;gap:2px;}
.playlist-modeBar__sep{font-size:10px;color:rgba(0,0,0,.22);padding:0 1px;user-select:none;}
.playlist-modeBar__divider{width:1px;height:16px;background:rgba(0,0,0,.13);margin:0 2px;flex-shrink:0;}
.playlist-modeBar__btn{appearance:none;border:none;background:transparent;cursor:pointer;font:inherit;border-radius:999px;line-height:1;transition:background .16s ease,color .16s ease;}
.playlist-modeBar__btn--mode{padding:5px 8px;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:rgba(0,0,0,.38);}
.playlist-modeBar__btn--mode.is-active{background:rgba(0,0,0,.9);color:#fff;}
.playlist-modeBar__btn--mode:not(.is-active):hover{background:rgba(0,0,0,.07);color:#111;outline:none;}
.playlist-modeBar__btn--theme{display:flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;color:rgba(0,0,0,.5);}
.playlist-modeBar__btn--theme:hover{color:#111;background:rgba(0,0,0,.07);outline:none;}
.playlist-modeBar__icon{width:13px;height:13px;flex:0 0 auto;display:block;}
.playlist-modeBar__icon--sun{display:block;}
.playlist-modeBar__icon--moon{display:none;}

/* ============================================================
   SOUNDCLOUD WIDGET WRAP
   ============================================================ */
.playlist-scWrap{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  border:0;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
}
.playlist-scWrap.is-active{
  display:block;
}
.playlist-scWrap__label{display:none !important;}
.playlist-scWrap__iframe{
  display:block;
  width:1px;
  height:1px;
  border:0;
  border-radius:0;
  overflow:hidden;
  background:transparent;
}
.playlist-scWrap__hint{
  display:none !important;
}

/* ============================================================
   YNGF EMPTY SLOT BUTTONS
   ============================================================ */
.playlist-coverButton--empty{background:rgba(0,0,0,.02);border-style:dashed;border-color:rgba(0,0,0,.16);display:flex;align-items:center;justify-content:center;box-shadow:none;}
.playlist-coverButton--empty:hover,.playlist-coverButton--empty:focus-visible{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.3);box-shadow:none;transform:translateY(-1px);}
.playlist-coverButton__emptyIcon{font-size:22px;font-weight:200;color:rgba(0,0,0,.22);line-height:1;pointer-events:none;user-select:none;transition:color .2s ease,transform .2s ease;}
.playlist-coverButton--empty:hover .playlist-coverButton__emptyIcon,.playlist-coverButton--empty:focus-visible .playlist-coverButton__emptyIcon{color:rgba(0,0,0,.42);transform:scale(1.14);}

/* ============================================================
   YNGF PANEL — back-face URL input + metadata
   ============================================================ */
/* Hide YNGP card and show YNGF panel in free-listen detail mode */
.playlist-module--asideInteractive.is-yngf .playlist-yngpCard,
.playlist-module--bsideInteractive.is-yngf .playlist-yngpCard{display:none!important;}
.playlist-module--asideInteractive.is-yngf .playlist-yngfPanel,
.playlist-module--bsideInteractive.is-yngf .playlist-yngfPanel{display:flex!important;flex-direction:column;gap:12px;flex:1;min-height:0;overflow-y:auto;}

.playlist-yngfPanel{display:none;flex-direction:column;gap:12px;flex:1;min-height:0;padding:4px 2px;overflow-y:auto;}
.playlist-yngfPanel .playlist-module__eyebrow{margin:0;}

/* URL input row */
.playlist-yngfInput{display:flex;flex-direction:column;gap:10px;flex:1;min-height:0;}
.playlist-yngfInput__row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;}
.playlist-yngfInput__field{height:38px;padding:0 12px;border:1px solid rgba(0,0,0,.18);border-radius:8px;background:#fff;font:inherit;font-size:13px;color:#111;min-width:0;width:100%;box-shadow:inset 0 1px 0 rgba(255,255,255,.52);}
.playlist-yngfInput__field::placeholder{color:rgba(0,0,0,.32);}
.playlist-yngfInput__field:focus{outline:none;border-color:rgba(0,0,0,.36);box-shadow:inset 0 1px 0 rgba(255,255,255,.52),0 0 0 2px rgba(0,0,0,.06);}
.playlist-yngfInput__btn{height:38px;padding:0 14px;border:1px solid rgba(0,0,0,.22);border-radius:8px;background:linear-gradient(180deg,#fbfbfb,#efefef);color:#111;font:inherit;font-size:10px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:background .16s ease,color .16s ease;}
.playlist-yngfInput__btn:hover,.playlist-yngfInput__btn:focus-visible{background:#111;color:#fff;outline:none;}
.playlist-yngfInput__btn:disabled{opacity:.5;cursor:wait;}
.playlist-yngfNote{margin:6px 0 0;font-size:12px;line-height:1.45;color:rgba(0,0,0,.44);}
.playlist-yngfNoteLink{display:inline-flex;align-items:center;gap:4px;margin-top:2px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#555;text-decoration:none;}
.playlist-yngfNoteLink:hover,.playlist-yngfNoteLink:focus-visible{color:#111;outline:none;}
.playlist-yngfNote--error{color:rgba(180,30,30,.8);}

/* Filled slot metadata view */
.playlist-yngfMeta{display:flex;flex-direction:column;gap:12px;flex:1;}
.playlist-yngfMeta__art{margin:0;border:1px solid rgba(0,0,0,.14);border-radius:8px;overflow:hidden;background:#f5f5f5;}
.playlist-yngfMeta__art img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;}
.playlist-yngfMeta__title{margin:0;font-size:clamp(15px,2.2vw,20px);line-height:1.05;font-weight:500;color:#111;}
.playlist-yngfMeta__artist{display:block;font-size:12px;color:#555;}
.playlist-yngfMeta__link{display:inline-flex;align-items:center;gap:4px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#555;text-decoration:none;}
.playlist-yngfMeta__link:hover{color:#111;}
.playlist-yngfMeta__actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:auto;padding-top:4px;}
.playlist-yngfMeta__playBtn{display:flex;align-items:center;justify-content:center;width:100%;min-height:40px;padding:9px 14px;border:1px solid #111;border-radius:8px;background:#111;color:#fff;font:inherit;font-size:11px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;margin-bottom:7px;transition:background .16s ease;}
.playlist-yngfMeta__playBtn:hover{background:#333;}
.playlist-yngfMeta__replaceBtn,.playlist-yngfMeta__clearBtn{display:flex;align-items:center;justify-content:center;min-height:36px;padding:7px 10px;border:1px solid rgba(0,0,0,.18);border-radius:8px;background:#fff;color:#111;font:inherit;font-size:10px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:background .16s ease,color .16s ease;}
.playlist-yngfMeta__replaceBtn:hover,.playlist-yngfMeta__clearBtn:hover{background:#111;color:#fff;outline:none;}

.playlist-yngfMeta--bsideCompact{
  display:grid;
  grid-template-columns:112px minmax(0,1fr);
  grid-template-areas:
    "art title"
    "art artist"
    "art link"
    "play play"
    "actions actions";
  align-content:start;
  column-gap:14px;
  row-gap:8px;
}
.playlist-yngfMeta--bsideCompact.playlist-yngfMeta--noArt{
  grid-template-columns:minmax(0,1fr);
  grid-template-areas:
    "title"
    "artist"
    "link"
    "play"
    "actions";
}
.playlist-yngfMeta--bsideCompact .playlist-yngfMeta__art{
  grid-area:art;
  width:112px;
  max-width:112px;
  border-radius:8px;
  align-self:start;
}
.playlist-yngfMeta--bsideCompact .playlist-yngfMeta__title{
  grid-area:title;
  align-self:end;
  font-size:clamp(16px,2vw,22px);
  line-height:1.02;
}
.playlist-yngfMeta--bsideCompact .playlist-yngfMeta__artist{grid-area:artist;}
.playlist-yngfMeta--bsideCompact .playlist-yngfMeta__link{grid-area:link; align-self:start;}
.playlist-yngfMeta--bsideCompact .playlist-yngfMeta__playBtn{
  grid-area:play;
  margin:2px 0 0;
}
.playlist-yngfMeta--bsideCompact .playlist-yngfMeta__actions{
  grid-area:actions;
  margin-top:0;
  padding-top:0;
}
#playlistBSideYngfPanel[data-view="meta"]{
  padding-right:0;
}
@media (max-width: 980px){
  .playlist-yngfMeta--bsideCompact,
  .playlist-yngfMeta--bsideCompact.playlist-yngfMeta--noArt{
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:
      "art"
      "title"
      "artist"
      "link"
      "play"
      "actions";
  }
  .playlist-yngfMeta--bsideCompact .playlist-yngfMeta__art{
    width:min(100%, 164px);
    max-width:164px;
  }
}

/* ============================================================
   YNGF PROGRESS BAR
   ============================================================ */
.playlist-yngfBar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:18px 0 0 244px;padding:14px 18px;border:1px solid rgba(0,0,0,.12);background:rgba(255,255,255,.88);box-shadow:0 8px 20px rgba(0,0,0,.06);}
@media(max-width:980px){.playlist-yngfBar{margin-left:0;}}
.playlist-yngfBar__left{display:flex;flex-direction:column;gap:4px;}
.playlist-yngfBar__left .playlist-module__eyebrow{margin:0;}
.playlist-yngfBar__count{font-size:22px;line-height:1;color:#111;}
.playlist-yngfBar__total{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#666;margin-left:2px;}
.playlist-yngfBar__clearBtn{appearance:none;border:1px solid rgba(0,0,0,.22);background:#fff;color:#111;font:inherit;font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:8px 16px;min-height:36px;cursor:pointer;transition:background .18s ease,color .18s ease,opacity .18s ease;flex-shrink:0;}
.playlist-yngfBar__clearBtn:hover:not(:disabled){background:#111;color:#fff;}
.playlist-yngfBar__clearBtn:disabled{opacity:.38;cursor:default;}
body[data-playlist-mode="yngp"] .playlist-yngfBar{display:none!important;}

/* ============================================================
   DARK MODE
   ============================================================ */
body.playlists-page.is-dark{background:#0d0d0d;color:#e8e8e8;}
body.playlists-page.is-dark .playlists-intro,
body.playlists-page.is-dark .playlist-module,
body.playlists-page.is-dark .playlist-archiveHook{border-color:rgba(255,255,255,.1);background:rgba(18,18,18,.97);}
body.playlists-page.is-dark .playlists-kicker,
body.playlists-page.is-dark .playlist-module__eyebrow{color:rgba(255,255,255,.36);}
body.playlists-page.is-dark .playlists-intro h1,
body.playlists-page.is-dark .playlist-module h2,
body.playlists-page.is-dark .playlist-archiveHook h2{color:#e8e8e8;}
body.playlists-page.is-dark .playlists-copy--lead{color:rgba(255,255,255,.72);}
body.playlists-page.is-dark .playlists-copy--detail{color:rgba(255,255,255,.54);}
body.playlists-page.is-dark .playlist-module__note{color:rgba(255,255,255,.54);}
body.playlists-page.is-dark .playlist-coverButton{background:#1c1c1c;border-color:rgba(255,255,255,.11);}
body.playlists-page.is-dark .playlist-coverButton:hover{border-color:rgba(255,255,255,.26);}
body.playlists-page.is-dark .playlist-coverButton--empty{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.11);}
body.playlists-page.is-dark .playlist-coverButton__emptyIcon{color:rgba(255,255,255,.26);}
body.playlists-page.is-dark .playlist-detailBack{background:#1c1c1c;border-color:rgba(255,255,255,.12);color:#e8e8e8;}
body.playlists-page.is-dark .playlist-detailCard__coverWrap{border-color:rgba(255,255,255,.1);background:#242424;}
body.playlists-page.is-dark .playlist-detailCard__body h3{color:#e8e8e8;}
body.playlists-page.is-dark .playlist-detailCard__subhead{color:rgba(255,255,255,.48);}
body.playlists-page.is-dark .playlist-detailCard__copy{color:rgba(255,255,255,.62);}
body.playlists-page.is-dark .playlist-detailLinks a{background:#1c1c1c;border-color:rgba(255,255,255,.12);color:#e8e8e8;}
body.playlists-page.is-dark .playlist-detailLinks a:hover,.is-dark .playlist-detailBack:hover{background:#e8e8e8;color:#111;}
body.playlists-page.is-dark .playlist-turntableControls{background:linear-gradient(180deg,rgba(22,22,22,.98),rgba(16,16,16,.96));border-color:rgba(255,255,255,.14);}
body.playlists-page.is-dark .playlist-turntableControls__button{background:linear-gradient(180deg,#242424,#1a1a1a);color:#d8d8d8;border-color:rgba(255,255,255,.13);}
body.playlists-page.is-dark .playlist-turntableControls__button.is-live{border-color:rgba(255,255,255,.24);}
body.playlists-page.is-dark .playlist-turntableControls__button--play.is-playing,.is-dark .playlist-playerShell__button.is-playing{background:#e8e8e8;color:#111;}
body.playlists-page.is-dark .playlist-turntableControls__meter{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border-color:rgba(255,255,255,.1);}
body.playlists-page.is-dark .playlist-turntableControls__meter--cthugha{border-color:rgba(255,255,255,.12);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08), inset 0 1px 0 rgba(255,255,255,.08), 0 14px 28px rgba(0,0,0,.3);}
body.playlists-page.is-dark .playlist-turntableControls__visualizerLauncher{background:rgba(232,232,232,.94);color:#161616;}
body.playlists-page.is-dark .playlist-turntableControls__meter span{background:rgba(255,255,255,.15);}
body.playlists-page.is-dark .playlist-turntableControls.is-playing .playlist-turntableControls__meter span{background:rgba(255,255,255,.76);}
body.playlists-page.is-dark .playlist-turntableControls__nowSpinning{background:linear-gradient(180deg,rgba(24,24,24,.84),rgba(18,18,18,.78));border-color:rgba(255,255,255,.1);}
body.playlists-page.is-dark .playlist-turntableDeck__monitorTitle{color:#e8e8e8;}
body.playlists-page.is-dark .playlist-turntableDeck__badge{border-color:rgba(255,255,255,.11);background:rgba(255,255,255,.06);color:rgba(255,255,255,.46);}
body.playlists-page.is-dark .playlist-turntableControls__volume{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1);}
body.playlists-page.is-dark #playlistVolumeRange{accent-color:#e8e8e8;}
body.playlists-page.is-dark .playlist-turntableQueue{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1);}
body.playlists-page.is-dark .playlist-turntableQueue__card{background:linear-gradient(180deg,rgba(26,26,26,.96),rgba(20,20,20,.9));border-color:rgba(255,255,255,.1);color:#e8e8e8;}
body.playlists-page.is-dark .playlist-turntableQueue__item--current .playlist-turntableQueue__card{background:#e8e8e8;color:#111;border-color:#e8e8e8;}
body.playlists-page.is-dark .playlist-turntableQueue__title{color:#e8e8e8;}
body.playlists-page.is-dark .playlist-turntableQueue__artist{color:rgba(255,255,255,.42);}
body.playlists-page.is-dark .playlist-playerShell{background:rgba(10,10,10,.97);border-top-color:rgba(255,255,255,.1);color:#e8e8e8;}
body.playlists-page.is-dark .playlist-playerShell__status{color:rgba(255,255,255,.34);}
body.playlists-page.is-dark .playlist-playerShell__time{color:rgba(255,255,255,.48);}
body.playlists-page.is-dark .playlist-playerShell button{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.13);color:#d8d8d8;}
body.playlists-page.is-dark .playlist-support{background:rgba(16,16,16,.76);border-color:rgba(255,255,255,.1);}
body.playlists-page.is-dark .playlist-support__header h2{color:#e8e8e8;}
body.playlists-page.is-dark .playlist-support__copy{color:rgba(255,255,255,.5);}
body.playlists-page.is-dark .playlist-support__button{background:#1a1a1a;border-color:rgba(255,255,255,.38);color:#e8e8e8;}
body.playlists-page.is-dark .playlist-support__button:hover{background:#e8e8e8;color:#111;}
body.playlists-page.is-dark .playlist-supportCard{background:rgba(20,20,20,.9);border-color:rgba(255,255,255,.1);}
body.playlists-page.is-dark .playlist-supportCard__badge{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:#d0d0d0;}
body.playlists-page.is-dark .playlist-supportCard__username{color:#d0d0d0;}
body.playlists-page.is-dark .playlist-archiveHook__button{background:#1a1a1a;border-color:rgba(255,255,255,.2);color:#e8e8e8;}
body.playlists-page.is-dark .playlist-archiveHook__button:hover{background:#e8e8e8;color:#111;}
body.playlists-page.is-dark .playlist-archiveHook__meta{color:rgba(255,255,255,.38);}
body.playlists-page.is-dark .playlist-modeBar{background:rgba(18,18,18,.94);border-color:rgba(255,255,255,.12);}
body.playlists-page.is-dark .playlist-modeBar__sep{color:rgba(255,255,255,.22);}
body.playlists-page.is-dark .playlist-modeBar__divider{background:rgba(255,255,255,.13);}
body.playlists-page.is-dark .playlist-modeBar__btn--mode{color:rgba(255,255,255,.38);}
body.playlists-page.is-dark .playlist-modeBar__btn--mode.is-active{background:rgba(255,255,255,.9);color:#111;}
body.playlists-page.is-dark .playlist-modeBar__btn--theme{color:rgba(255,255,255,.5);}
body.playlists-page.is-dark .playlist-modeBar__icon--sun{display:none;}
body.playlists-page.is-dark .playlist-modeBar__icon--moon{display:block;}
body.playlists-page.is-dark .nav a{color:rgba(255,255,255,.6);}
body.playlists-page.is-dark .nav a:hover{color:#e8e8e8;}
body.playlists-page.is-dark .nav a[aria-current="page"]{color:#e8e8e8;}
body.playlists-page.is-dark .playlist-scWrap{border-top-color:rgba(255,255,255,.1);}
body.playlists-page.is-dark .playlist-scWrap__hint{background:rgba(255,255,255,.06);color:rgba(255,255,255,.54);}
body.playlists-page.is-dark .playlist-yngfInput__field{background:#1c1c1c;border-color:rgba(255,255,255,.13);color:#e8e8e8;}
body.playlists-page.is-dark .playlist-yngfInput__field::placeholder{color:rgba(255,255,255,.26);}
body.playlists-page.is-dark .playlist-yngfInput__btn{background:linear-gradient(180deg,#2a2a2a,#1e1e1e);border-color:rgba(255,255,255,.13);color:#d8d8d8;}
body.playlists-page.is-dark .playlist-yngfInput__btn:hover{background:#e8e8e8;color:#111;}
body.playlists-page.is-dark .playlist-yngfNote{color:rgba(255,255,255,.34);}
body.playlists-page.is-dark .playlist-yngfNoteLink{color:rgba(255,255,255,.5);}
body.playlists-page.is-dark .playlist-yngfNoteLink:hover,body.playlists-page.is-dark .playlist-yngfNoteLink:focus-visible{color:#fff;}
body.playlists-page.is-dark .playlist-yngfMeta__title{color:#e8e8e8;}
body.playlists-page.is-dark .playlist-yngfMeta__artist{color:rgba(255,255,255,.44);}
body.playlists-page.is-dark .playlist-yngfMeta__art{border-color:rgba(255,255,255,.1);background:#242424;}
body.playlists-page.is-dark .playlist-yngfMeta__link{color:rgba(255,255,255,.44);}
body.playlists-page.is-dark .playlist-yngfMeta__playBtn{background:#e8e8e8;color:#111;border-color:#e8e8e8;}
body.playlists-page.is-dark .playlist-yngfMeta__replaceBtn,.is-dark .playlist-yngfMeta__clearBtn{background:#1c1c1c;border-color:rgba(255,255,255,.13);color:#d8d8d8;}
body.playlists-page.is-dark .playlist-yngfMeta__replaceBtn:hover,.is-dark .playlist-yngfMeta__clearBtn:hover{background:#e8e8e8;color:#111;}
body.playlists-page.is-dark .playlist-yngfBar{background:rgba(16,16,16,.88);border-color:rgba(255,255,255,.1);}
body.playlists-page.is-dark .playlist-yngfBar__count{color:#e8e8e8;}
body.playlists-page.is-dark .playlist-yngfBar__total{color:rgba(255,255,255,.34);}
body.playlists-page.is-dark .playlist-yngfBar__clearBtn{background:#1a1a1a;border-color:rgba(255,255,255,.2);color:#e8e8e8;}
body.playlists-page.is-dark .playlist-yngfBar__clearBtn:hover:not(:disabled){background:#e8e8e8;color:#111;}


/* ================================================================
   VINYL LABEL CLEANUP — delayed hover reveal, title + artist only
   ================================================================ */
.playlist-turntableRecord__label{
  pointer-events:none;
  opacity:0;
  transform:scale(.965);
  transition:opacity .34s ease, transform .34s ease, box-shadow .34s ease;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08), inset 0 0 0 10px rgba(255,255,255,.14), 0 0 0 6px rgba(0,0,0,.03);
}

.playlist-turntableRecord.is-label-visible .playlist-turntableRecord__label{
  opacity:1;
  transform:scale(1);
}

.playlist-turntableRecord__labelInner{
  position:relative;
  width:100%;
  height:100%;
  gap:0;
  max-width:none;
  padding:0;
}

.playlist-turntableRecord__labelKicker,
.playlist-turntableRecord__labelMeta{
  display:none !important;
}

.playlist-turntableRecord__label strong{
  position:absolute;
  top:50%;
  left:50%;
  z-index:2;
  transform:translate(-50%, -56%);
  width:68%;
  max-width:68%;
  margin:0;
  display:block;
  text-align:center;
  font-size:clamp(14px, 1.5vw, 18px);
  line-height:1.05;
  font-weight:600;
  letter-spacing:.01em;
  white-space:normal;
  overflow:hidden;
  text-overflow:ellipsis;
  text-wrap:balance;
}

.playlist-turntableRecord__labelArtistArc{
  position:absolute;
  inset:0;
  z-index:1;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
}

.playlist-turntableRecord__labelArtistArcPath{
  fill:none;
}

.playlist-turntableRecord__labelArtistText{
  fill:#313131;
  font-size:6.1px;
  font-weight:500;
  letter-spacing:.07em;
  text-transform:uppercase;
  paint-order:stroke fill;
  stroke:rgba(255,255,255,.18);
  stroke-width:.45px;
  text-rendering:geometricPrecision;
}

#playlistTurntableTrackArtist{
  dominant-baseline:middle;
}


.playlist-turntableRecord__label::before{
  opacity:.9;
}

.playlist-turntableRecord__label::after{
  opacity:.6;
}


/* --- 2026-04 playlist builder / support / authoring cleanup --- */
.playlists-stage{gap:32px 24px;}
.playlist-module--bside{margin-top:18px; margin-bottom:18px;}
.playlist-module__flipShell--bside{padding-bottom:18px;}
.playlist-module--bsideInteractive .playlist-module__face--front{padding-bottom:8px;}
.playlist-module--bsideInteractive .playlist-module__face--back{padding-bottom:8px;}
.playlist-yngfBuilder{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) auto;align-items:start;gap:22px;margin:30px 0 8px 244px;padding:22px 24px;border:1px solid rgba(0,0,0,.12);background:rgba(255,255,255,.9);box-shadow:0 10px 26px rgba(0,0,0,.06);}
.playlist-yngfBuilder__intro h2{margin:0;}
.playlist-yngfBuilder__copy{margin:14px 0 0;max-width:46ch;font-size:14px;line-height:1.6;color:#222;}
.playlist-yngfBuilder__helper{margin:12px 0 0;max-width:48ch;font-size:12px;line-height:1.55;color:rgba(0,0,0,.56);}
.playlist-yngfBuilder__steps{margin:0;padding:0;list-style:none;display:grid;gap:12px;}
.playlist-yngfBuilder__steps li{display:grid;gap:2px;padding-left:16px;position:relative;font-size:13px;line-height:1.5;color:#333;}
.playlist-yngfBuilder__steps li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;border-radius:50%;background:#111;}
.playlist-yngfBuilder__steps strong{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;}
.playlist-yngfBuilder__meta{display:grid;justify-items:end;gap:12px;align-self:stretch;min-width:160px;}
.playlist-yngfBuilder__countWrap{display:grid;gap:5px;justify-items:end;text-align:right;}
.playlist-yngfBuilder__count{font-size:26px;line-height:1;color:#111;}
.playlist-yngfBuilder__total{display:block;margin-top:5px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#666;}
.playlist-yngfBuilder__clearBtn{appearance:none;border:1px solid rgba(0,0,0,.22);background:#fff;color:#111;font:inherit;font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding:10px 18px;min-height:40px;cursor:pointer;transition:background .18s ease,color .18s ease,opacity .18s ease;}
.playlist-yngfBuilder__clearBtn:hover:not(:disabled),.playlist-yngfBuilder__clearBtn:focus-visible:not(:disabled){background:#111;color:#fff;outline:none;}
.playlist-yngfBuilder__clearBtn:disabled{opacity:.38;cursor:default;}
body[data-playlist-mode="yngp"] .playlist-yngfBuilder{display:none!important;}
.playlist-authorEditor{display:grid;gap:10px;margin-top:14px;padding:14px;border:1px solid rgba(0,0,0,.1);background:rgba(0,0,0,.025);}
.playlist-authorEditor__eyebrow{margin:0;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#5e5e5e;}
.playlist-authorEditor textarea{width:100%;min-height:120px;resize:vertical;padding:12px;border:1px solid rgba(0,0,0,.16);background:#fff;color:#111;font:inherit;line-height:1.55;}
.playlist-authorEditor__actions{display:flex;flex-wrap:wrap;gap:8px;}
.playlist-authorEditor__button{appearance:none;border:1px solid rgba(0,0,0,.16);background:#fff;color:#111;font:inherit;font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:9px 12px;cursor:pointer;}
.playlist-authorEditor__button:hover,.playlist-authorEditor__button:focus-visible{background:#111;color:#fff;outline:none;}
.playlist-authorEditor__status{font-size:12px;color:#666;}
.playlist-support__finePrint{margin:14px 0 0;font-size:12px;line-height:1.5;color:#6a6a6a;max-width:58ch;}
.playlist-support__copy{max-width:58ch;}
.playlist-support__grid{margin-top:18px;}
.playlist-supportCard{align-items:center;}
.playlist-supportCard__avatar{object-fit:cover;background:#ece8e1;display:flex;align-items:center;justify-content:center;}
.playlist-supportCard__badgeRow{display:none;}
.playlist-supportCard__username{font-size:15px;}
.playlist-supportCard__meta{font-size:12px;line-height:1.5;color:#5b5b5b;}
.playlist-supportCard--seed .playlist-supportCard__meta::after{content:" · neighborhood regular";}
.playlist-supportCard--user .playlist-supportCard__meta::after{content:" · on the wall";}
.playlist-supportModal[hidden]{display:none!important;}
.playlist-supportModal{position:fixed;inset:0;z-index:10060;display:grid;justify-items:center;align-items:start;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:clamp(14px,3vw,24px);}
.playlist-supportModal__backdrop{position:absolute;inset:0;background:rgba(10,10,10,.52);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);}
.playlist-supportModal__dialog{position:relative;z-index:1;width:min(540px,calc(100vw - 28px));max-height:calc(100dvh - 28px);margin:auto;padding:22px 22px 18px;border:1px solid rgba(0,0,0,.12);background:rgba(255,255,255,.98);box-shadow:0 18px 50px rgba(0,0,0,.18);display:flex;flex-direction:column;overflow:hidden;border-radius:22px;overscroll-behavior:contain;}
.playlist-supportModal__dialog h3{margin:0;font-size:clamp(24px,3vw,34px);line-height:1;}
.playlist-supportModal__copy{margin:14px 0 0;max-width:46ch;font-size:14px;line-height:1.6;color:#2d2d2d;}
.playlist-supportModal__close{appearance:none;position:absolute;right:14px;top:14px;border:1px solid rgba(0,0,0,.12);background:#fff;color:#111;width:34px;height:34px;cursor:pointer;font:inherit;font-size:22px;line-height:1;}
.playlist-supportForm{display:grid;gap:14px;margin-top:18px;min-height:0;flex:1 1 auto;overflow-y:auto;padding-right:4px;padding-bottom:12px;}
.playlist-supportForm__field{display:grid;gap:6px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#555;}
.playlist-supportForm__field input{padding:11px 12px;border:1px solid rgba(0,0,0,.16);background:#fff;color:#111;font:inherit;letter-spacing:normal;text-transform:none;}
.playlist-supportForm__field--file input{padding:10px;border-style:dashed;}
.playlist-supportForm__preview{position:relative;display:grid;place-items:center;width:82px;height:82px;border:1px solid rgba(0,0,0,.14);border-radius:999px;background:rgba(0,0,0,.03);overflow:hidden;flex:0 0 auto;}
.playlist-supportForm__preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.playlist-supportForm__preview img[hidden],
.playlist-supportForm__previewFallback[hidden]{display:none!important;}
.playlist-supportForm__previewFallback{font-size:22px;letter-spacing:.16em;color:#555;}
.playlist-supportForm__hint{margin:0;font-size:12px;line-height:1.5;color:#666;}
.playlist-supportForm__footer{position:sticky;bottom:-1px;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:4px;padding:12px 0 2px;border-top:1px solid rgba(0,0,0,.1);background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.96) 22%,rgba(255,255,255,.98) 100%);}
.playlist-supportForm__brand{display:flex;align-items:center;min-height:44px;opacity:.88;}
.playlist-supportForm__brand img{display:block;width:min(130px,34vw);height:auto;max-height:34px;object-fit:contain;}
.playlist-supportForm__actions{display:flex;justify-content:flex-end;gap:10px;}
.playlist-supportForm__secondary,.playlist-supportForm__submit{appearance:none;border:1px solid rgba(0,0,0,.16);background:#fff;color:#111;font:inherit;font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:10px 14px;cursor:pointer;}
.playlist-supportForm__submit{background:#111;color:#fff;border-color:#111;}
.playlist-supportForm__secondary:hover,.playlist-supportForm__secondary:focus-visible{background:#111;color:#fff;outline:none;}
.playlist-supportForm__submit:hover,.playlist-supportForm__submit:focus-visible{opacity:.86;outline:none;}
@media(max-width:1180px){.playlist-yngfBuilder{grid-template-columns:1fr;gap:18px;margin-left:0;}.playlist-yngfBuilder__meta{justify-items:start;text-align:left;}.playlist-yngfBuilder__countWrap{justify-items:start;text-align:left;}}
@media(max-width:760px){.playlist-supportModal{padding:14px;}.playlist-supportModal__dialog{width:min(100vw - 18px,540px);max-height:calc(100dvh - 18px);padding:18px 16px 14px;}.playlist-supportForm{padding-right:0;}.playlist-supportForm__footer{flex-direction:column;align-items:stretch;gap:10px;padding-top:10px;}.playlist-supportForm__brand{justify-content:center;}.playlist-supportForm__actions{flex-direction:column;}.playlist-supportForm__secondary,.playlist-supportForm__submit{width:100%;}.playlist-yngfBuilder{padding:18px;}}
body.playlists-page.is-dark .playlist-yngfBuilder{background:rgba(16,16,16,.88);border-color:rgba(255,255,255,.1);}
body.playlists-page.is-dark .playlist-yngfBuilder__copy,body.playlists-page.is-dark .playlist-yngfBuilder__steps li{color:#d0d0d0;}
body.playlists-page.is-dark .playlist-yngfBuilder__helper{color:rgba(255,255,255,.42);}
body.playlists-page.is-dark .playlist-yngfBuilder__count{color:#f0f0f0;}
body.playlists-page.is-dark .playlist-yngfBuilder__total{color:rgba(255,255,255,.4);}
body.playlists-page.is-dark .playlist-yngfBuilder__clearBtn{background:#1a1a1a;border-color:rgba(255,255,255,.2);color:#e8e8e8;}
body.playlists-page.is-dark .playlist-yngfBuilder__clearBtn:hover:not(:disabled),body.playlists-page.is-dark .playlist-yngfBuilder__clearBtn:focus-visible:not(:disabled){background:#e8e8e8;color:#111;}
body.playlists-page.is-dark .playlist-authorEditor{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.1);}
body.playlists-page.is-dark .playlist-authorEditor textarea{background:#121212;border-color:rgba(255,255,255,.14);color:#e8e8e8;}
body.playlists-page.is-dark .playlist-authorEditor__button{background:#1a1a1a;border-color:rgba(255,255,255,.14);color:#e8e8e8;}
body.playlists-page.is-dark .playlist-authorEditor__button:hover,body.playlists-page.is-dark .playlist-authorEditor__button:focus-visible{background:#e8e8e8;color:#111;}
body.playlists-page.is-dark .playlist-support__finePrint{color:rgba(255,255,255,.45);}
body.playlists-page.is-dark .playlist-supportCard__meta{color:rgba(255,255,255,.55);}
body.playlists-page.is-dark .playlist-supportModal__dialog{background:rgba(18,18,18,.98);border-color:rgba(255,255,255,.12);}
body.playlists-page.is-dark .playlist-supportModal__copy{color:#d0d0d0;}
body.playlists-page.is-dark .playlist-supportModal__close,body.playlists-page.is-dark .playlist-supportForm__field input,body.playlists-page.is-dark .playlist-supportForm__secondary{background:#121212;border-color:rgba(255,255,255,.14);color:#e8e8e8;}
body.playlists-page.is-dark .playlist-supportForm__submit{background:#e8e8e8;border-color:#e8e8e8;color:#111;}
body.playlists-page.is-dark .playlist-supportForm__preview{border-color:rgba(255,255,255,.14);background:rgba(255,255,255,.04);}
body.playlists-page.is-dark .playlist-supportForm__brand{opacity:.94;filter:drop-shadow(0 3px 10px rgba(0,0,0,.28));}
body.playlists-page.is-dark .playlist-supportForm__footer{border-top-color:rgba(255,255,255,.12);background:linear-gradient(180deg,rgba(18,18,18,0),rgba(18,18,18,.96) 22%,rgba(18,18,18,.98) 100%);}

@media (max-width: 760px){
  .playlist-turntableControls__adjacent{
    grid-template-columns:1fr 1fr;
  }

  .playlist-turntableControls__adjacentCoverWrap{
    width:62px;
  }

  .playlist-turntableRecord__label{
    top:33%;
    left:33%;
    width:34%;
    height:34%;
  }

  .playlist-turntableRecord__labelInner{
    padding:0;
    gap:0;
  }

  .playlist-turntableRecord__labelArtistText{
    font-size:6px;
  }
}


#playlistTurntableQueueButton,
#playlistTurntableQueueCaret{
  display:none !important;
}


.playlist-trainJazzLink{position:fixed;left:14px;bottom:96px;width:min(128px,16vw);min-width:92px;z-index:10021;display:block;user-select:none;text-decoration:none;outline:none;}
.playlist-trainJazzLink__icon{display:block;width:100%;height:auto;filter:brightness(0) invert(1) drop-shadow(0 1px 3px rgba(0,0,0,0.28));opacity:.82;transition:opacity .2s ease,transform .2s ease,filter .2s ease;}
.playlist-trainJazzLink:hover .playlist-trainJazzLink__icon,
.playlist-trainJazzLink:focus-visible .playlist-trainJazzLink__icon{opacity:1;transform:translateY(-2px);filter:brightness(0) invert(1) drop-shadow(0 4px 10px rgba(0,0,0,0.34));}
.playlist-trainJazzLink:focus-visible{border-radius:10px;box-shadow:0 0 0 3px rgba(255,255,255,0.85);}

.playlist-goHomeLink{position:fixed;right:14px;bottom:96px;width:min(128px,16vw);min-width:92px;z-index:10021;display:none;user-select:none;text-decoration:none;outline:none;text-align:center;color:#fff;font-family:inherit;font-weight:900;letter-spacing:.02em;text-transform:lowercase;text-shadow:0 2px 6px rgba(0,0,0,.38);}
body[data-playlist-mode="yngf"] .playlist-goHomeLink,
body[data-playlist-mode="yngfr"] .playlist-goHomeLink{display:block;}
.playlist-goHomeLink[hidden]{display:none!important;}
.playlist-goHomeLink__icon{display:block;width:100%;height:auto;filter:brightness(0) invert(1) drop-shadow(0 1px 3px rgba(0,0,0,0.28));opacity:.82;transition:opacity .2s ease,transform .2s ease,filter .2s ease;}
.playlist-goHomeLink__label{display:block;margin-top:-8px;font-size:clamp(18px,2.3vw,30px);line-height:.95;color:rgba(255,255,255,.94);filter:drop-shadow(0 1px 3px rgba(0,0,0,.28));transition:opacity .2s ease,transform .2s ease,filter .2s ease;}
.playlist-goHomeLink:hover .playlist-goHomeLink__icon,
.playlist-goHomeLink:focus-visible .playlist-goHomeLink__icon{opacity:1;transform:translateY(-2px);filter:brightness(0) invert(1) drop-shadow(0 4px 10px rgba(0,0,0,0.34));}
.playlist-goHomeLink:hover .playlist-goHomeLink__label,
.playlist-goHomeLink:focus-visible .playlist-goHomeLink__label{opacity:1;transform:translateY(-2px);filter:drop-shadow(0 4px 10px rgba(0,0,0,.34));}
.playlist-goHomeLink:focus-visible{border-radius:10px;box-shadow:0 0 0 3px rgba(255,255,255,0.85);}

@media (max-width: 760px){
  .playlist-trainJazzLink{bottom:92px;width:min(112px,24vw);}
  .playlist-goHomeLink{bottom:92px;width:min(112px,24vw);}
}

@media (max-width: 520px){
  .playlist-trainJazzLink{bottom:90px;width:min(96px,30vw);}
  .playlist-goHomeLink{bottom:90px;width:min(96px,30vw);}
  .playlist-goHomeLink__label{font-size:18px;margin-top:-6px;}
}


@keyframes playlistVisualizerPulse{
  0%{transform:rotate(var(--angle)) translateY(-47px) rotate(calc(var(--angle) * -1)) scale(1);}
  50%{transform:rotate(var(--angle)) translateY(-47px) rotate(calc(var(--angle) * -1)) scale(1.16);}
  100%{transform:rotate(var(--angle)) translateY(-47px) rotate(calc(var(--angle) * -1)) scale(1);}
}

@keyframes playlistVisualizerDenied{
  0%,100%{transform:rotate(var(--angle)) translateY(-47px) rotate(calc(var(--angle) * -1)) translateX(0);}
  25%{transform:rotate(var(--angle)) translateY(-47px) rotate(calc(var(--angle) * -1)) translateX(-2px);}
  50%{transform:rotate(var(--angle)) translateY(-47px) rotate(calc(var(--angle) * -1)) translateX(2px);}
  75%{transform:rotate(var(--angle)) translateY(-47px) rotate(calc(var(--angle) * -1)) translateX(-1px);}
}

/* --- 2026-04 support wall expansion / YNGF snapshot --- */
.playlist-support{
  overflow:hidden;
}

.playlist-support__yngp,
.playlist-support__yngf{
  display:grid;
  gap:0;
}

.playlist-support__button--quiet{
  background:transparent;
}

.playlist-support__yngp[hidden],
.playlist-support__yngf[hidden],
.playlist-support__overflow[hidden],
.playlist-support__overflowGrid[hidden]{display:none!important;}

.playlist-support[data-mode="yngp"] .playlist-support__yngf{display:none!important;}
.playlist-support[data-mode="yngf"] .playlist-support__yngp{display:none!important;}

.playlist-support__grid{
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
}

.playlist-supportCard{
  align-items:flex-start;
  grid-template-columns:52px minmax(0,1fr);
  min-height:0;
}

.playlist-supportCard__avatar{
  width:52px;
  height:52px;
  border-radius:999px;
}

.playlist-supportCard__body{
  gap:6px;
}

.playlist-supportCard__username{
  font-size:14px;
  line-height:1.2;
  color:#171717;
}

.playlist-supportCard__title{
  display:block;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#6c6c6c;
}

.playlist-supportCard__badge{
  display:inline-flex;
  align-items:center;
  width:fit-content;
  max-width:100%;
  padding:4px 8px;
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.playlist-supportCard__badge--common{background:rgba(0,0,0,.04);}
.playlist-supportCard__badge--uncommon{background:rgba(0,0,0,.06);}
.playlist-supportCard__badge--rare{background:rgba(0,0,0,.08);}
.playlist-supportCard__badge--legendary{background:rgba(0,0,0,.12);}

.playlist-supportCard__meta{
  margin:0;
  font-size:12px;
  line-height:1.45;
  color:#454545;
  letter-spacing:0;
  text-transform:none;
}

.playlist-supportCard__meta::after{
  content:none !important;
}

.playlist-support__overflow{
  margin-top:14px;
}

.playlist-support__overflowToggle{
  appearance:none;
  border:1px solid rgba(0,0,0,.14);
  background:#fff;
  color:#111;
  font:inherit;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  padding:10px 12px;
  cursor:pointer;
}

.playlist-support__overflowToggle:hover,
.playlist-support__overflowToggle:focus-visible{
  background:#111;
  color:#fff;
  outline:none;
}

.playlist-support__overflowGrid{
  --playlist-support-mosaic-size: 36px;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(var(--playlist-support-mosaic-size),1fr));
  gap:8px;
  margin-top:12px;
}

.playlist-supportThumb{
  position:relative;
  appearance:none;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
}

.playlist-supportThumb__avatar{
  width:var(--playlist-support-mosaic-size);
  height:var(--playlist-support-mosaic-size);
  border-radius:999px;
  object-fit:cover;
  display:block;
  background:#ece8e1;
  box-shadow:0 6px 14px rgba(0,0,0,.06);
}

.playlist-supportThumb__tooltip{
  position:absolute;
  left:50%;
  bottom:calc(100% + 8px);
  transform:translateX(-50%);
  min-width:max-content;
  max-width:220px;
  padding:8px 10px;
  border:1px solid rgba(0,0,0,.12);
  background:rgba(255,255,255,.98);
  color:#111;
  font-size:11px;
  line-height:1.45;
  box-shadow:0 10px 24px rgba(0,0,0,.12);
  opacity:0;
  pointer-events:none;
  transition:opacity .16s ease, transform .16s ease;
  z-index:2;
}

.playlist-supportThumb:hover .playlist-supportThumb__tooltip,
.playlist-supportThumb:focus-visible .playlist-supportThumb__tooltip,
.playlist-supportThumb.is-open .playlist-supportThumb__tooltip{
  opacity:1;
  transform:translateX(-50%) translateY(-2px);
}

.playlist-yngfSummary__actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:10px;
}

.playlist-yngfSummary__stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-top:18px;
}

.playlist-yngfSummary__stat{
  display:grid;
  gap:6px;
  padding:14px;
  border:1px solid rgba(0,0,0,.1);
  background:rgba(255,255,255,.82);
}

.playlist-yngfSummary__stat--wide{
  grid-column:1 / -1;
}

.playlist-yngfSummary__label{
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#6a6a6a;
}

.playlist-yngfSummary__value{
  font-size:18px;
  line-height:1.3;
  color:#161616;
}

.playlist-yngfSummary__mosaic{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(64px,1fr));
  gap:10px;
  margin-top:16px;
}

.playlist-yngfSummary__tile{
  aspect-ratio:1;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid rgba(0,0,0,.1);
  background:rgba(255,255,255,.84);
  color:#6b6b6b;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.playlist-yngfSummary__tile img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.playlist-yngfSummary__empty{
  margin:0;
  grid-column:1 / -1;
  font-size:13px;
  line-height:1.6;
  color:#5d5d5d;
}

.playlist-supportForm__field small{
  font-size:11px;
  line-height:1.5;
  letter-spacing:normal;
  text-transform:none;
  color:#6c6c6c;
}

.playlist-supportForm__honeypot{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

.playlist-supportForm__hint.is-error{
  color:#9a2c2c;
}

body.playlists-page.is-dark .playlist-support__button--quiet{
  background:transparent;
}

.playlist-support__yngp[hidden],
.playlist-support__yngf[hidden],
.playlist-support__overflow[hidden],
.playlist-support__overflowGrid[hidden]{display:none!important;}

.playlist-support[data-mode="yngp"] .playlist-support__yngf{display:none!important;}
.playlist-support[data-mode="yngf"] .playlist-support__yngp{display:none!important;}

body.playlists-page.is-dark .playlist-supportCard__username,
body.playlists-page.is-dark .playlist-yngfSummary__value{
  color:#f0f0f0;
}

body.playlists-page.is-dark .playlist-supportCard__title,
body.playlists-page.is-dark .playlist-yngfSummary__label,
body.playlists-page.is-dark .playlist-supportForm__field small{
  color:rgba(255,255,255,.5);
}

body.playlists-page.is-dark .playlist-supportCard__meta,
body.playlists-page.is-dark .playlist-yngfSummary__empty{
  color:rgba(255,255,255,.68);
}

body.playlists-page.is-dark .playlist-support__overflowToggle,
body.playlists-page.is-dark .playlist-yngfSummary__stat,
body.playlists-page.is-dark .playlist-yngfSummary__tile,
body.playlists-page.is-dark .playlist-supportThumb__tooltip{
  background:rgba(22,22,22,.95);
  border-color:rgba(255,255,255,.12);
  color:#ececec;
}

body.playlists-page.is-dark .playlist-supportThumb__avatar{
  background:#1d1d1d;
}

body.playlists-page.is-dark .playlist-supportCard__badge--common{background:rgba(255,255,255,.06);}
body.playlists-page.is-dark .playlist-supportCard__badge--uncommon{background:rgba(255,255,255,.09);}
body.playlists-page.is-dark .playlist-supportCard__badge--rare{background:rgba(255,255,255,.12);}
body.playlists-page.is-dark .playlist-supportCard__badge--legendary{background:rgba(255,255,255,.16);}
body.playlists-page.is-dark .playlist-supportForm__hint.is-error{color:#ff9a9a;}

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

@media(max-width:760px){
  .playlist-support__header{
    flex-direction:column;
  }

  .playlist-support__button,
  .playlist-support__overflowToggle{
    width:100%;
  }

  .playlist-yngfSummary__actions{
    width:100%;
  }

  .playlist-yngfSummary__actions .playlist-support__button{
    width:100%;
  }

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

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

  .playlist-yngfSummary__mosaic{
    grid-template-columns:repeat(auto-fill,minmax(58px,1fr));
  }
}

.playlist-supportCard__avatar,
.playlist-supportThumb__avatar,
.playlist-yngfSummary__tile img{content-visibility:auto;}

/* ================================================================
   YNGF POSTER STUDIO
   ================================================================ */
.playlist-yngfStudio{
  margin-top:26px;
  padding-top:18px;
  border-top:1px solid rgba(0,0,0,.08);
  display:grid;
  gap:18px;
}

.playlist-yngfStudio__intro,
.playlist-yngfStudio__layout{
  display:grid;
  gap:18px;
}

.playlist-yngfStudio__intro{
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
}

.playlist-yngfStudio__topActions,
.playlist-yngfStudio__miniActions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.playlist-yngfStudio__layout{
  grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr);
  align-items:start;
}

.playlist-yngfStudio__previewShell{
  position:relative;
  min-width:0;
}

.playlist-yngfPoster{
  --poster-bg:#151219;
  --poster-bg-rgb:21, 18, 25;
  --poster-accent:#ff6f61;
  --poster-accent-rgb:255, 111, 97;
  --poster-ink:#f5ead8;
  --poster-ink-rgb:245, 234, 216;
  --poster-font-family:Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
  --poster-tint:.28;
  --poster-blur:0px;
  --poster-bg-image:none;
  position:relative;
  width:100%;
  min-height:var(--poster-height, 820px);
  transition:min-height .2s ease;
  overflow:hidden;
  border-radius:28px;
  background:var(--poster-bg);
  color:var(--poster-ink);
  box-shadow:0 24px 70px rgba(0,0,0,.16);
  isolation:isolate;
}

.playlist-yngfPoster__backdrop,
.playlist-yngfPoster__texture,
.playlist-yngfPoster__frame,
.playlist-yngfPoster__inner,
.playlist-yngfPoster::before,
.playlist-yngfPoster::after{
  position:absolute;
  inset:0;
}

.playlist-yngfPoster__backdrop{
  background:
    radial-gradient(circle at 18% 18%, rgba(var(--poster-accent-rgb), .36), transparent 28%),
    radial-gradient(circle at 78% 16%, rgba(var(--poster-ink-rgb), .09), transparent 24%),
    linear-gradient(180deg, rgba(var(--poster-accent-rgb), .14), transparent 40%),
    var(--poster-bg-image) center/cover no-repeat,
    var(--poster-bg);
  filter:blur(var(--poster-blur));
  transform:scale(1.02);
}

.playlist-yngfPoster[data-fit="contain"] .playlist-yngfPoster__backdrop{
  background-size:auto, auto, auto, contain, auto;
  background-repeat:no-repeat;
}

.playlist-yngfPoster[data-fit="repeat"] .playlist-yngfPoster__backdrop{
  background-size:auto, auto, auto, 220px 220px, auto;
  background-repeat:no-repeat, no-repeat, no-repeat, repeat, no-repeat;
}

.playlist-yngfPoster::before{
  content:"";
  background:linear-gradient(180deg, rgba(0,0,0,.05), rgba(var(--poster-bg-rgb), var(--poster-tint)) 24%, rgba(var(--poster-bg-rgb), .78) 100%);
  z-index:0;
}

.playlist-yngfPoster__texture{
  z-index:1;
  pointer-events:none;
  mix-blend-mode:screen;
  opacity:.68;
}

.playlist-yngfPoster[data-pattern="grain"] .playlist-yngfPoster__texture{
  background:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.08) 0 2px, transparent 2px 100%),
    radial-gradient(circle at 70% 40%, rgba(255,255,255,.06) 0 1px, transparent 1px 100%),
    radial-gradient(circle at 45% 70%, rgba(255,255,255,.05) 0 1.5px, transparent 1.5px 100%);
  background-size:16px 16px, 22px 22px, 18px 18px;
}

.playlist-yngfPoster[data-pattern="checker"] .playlist-yngfPoster__texture{
  background:repeating-conic-gradient(from 45deg, rgba(var(--poster-accent-rgb), .13) 0 25%, transparent 0 50%) 50% / 42px 42px;
  mix-blend-mode:overlay;
}

.playlist-yngfPoster[data-pattern="stars"] .playlist-yngfPoster__texture{
  background:
    radial-gradient(circle at 18% 28%, rgba(var(--poster-ink-rgb), .92) 0 1.5px, transparent 1.5px 100%),
    radial-gradient(circle at 73% 18%, rgba(var(--poster-ink-rgb), .78) 0 2px, transparent 2px 100%),
    radial-gradient(circle at 58% 62%, rgba(var(--poster-ink-rgb), .55) 0 1.5px, transparent 1.5px 100%),
    radial-gradient(circle at 82% 72%, rgba(var(--poster-accent-rgb), .55) 0 2px, transparent 2px 100%),
    radial-gradient(circle at 24% 78%, rgba(var(--poster-ink-rgb), .6) 0 1px, transparent 1px 100%);
  background-size:140px 140px, 220px 220px, 180px 180px, 250px 250px, 120px 120px;
}

.playlist-yngfPoster[data-pattern="wave"] .playlist-yngfPoster__texture{
  background:
    repeating-radial-gradient(circle at 15% 12%, rgba(var(--poster-accent-rgb), .16) 0 10px, transparent 10px 26px),
    repeating-linear-gradient(135deg, transparent 0 18px, rgba(var(--poster-ink-rgb), .08) 18px 19px, transparent 19px 36px);
  mix-blend-mode:soft-light;
}

.playlist-yngfPoster[data-pattern="tieDye"] .playlist-yngfPoster__texture{
  background:
    radial-gradient(circle at 15% 20%, rgba(var(--poster-accent-rgb), .55), transparent 34%),
    radial-gradient(circle at 78% 18%, rgba(80,120,255,.36), transparent 30%),
    radial-gradient(circle at 70% 72%, rgba(255,250,120,.24), transparent 28%),
    radial-gradient(circle at 24% 74%, rgba(255,255,255,.18), transparent 24%);
  mix-blend-mode:screen;
}

.playlist-yngfPoster[data-pattern="halftone"] .playlist-yngfPoster__texture{
  background-image:radial-gradient(circle, rgba(var(--poster-accent-rgb), .32) 0 1px, transparent 1.2px);
  background-size:14px 14px;
  mix-blend-mode:overlay;
}

.playlist-yngfPoster[data-pattern="stripes"] .playlist-yngfPoster__texture{
  background:repeating-linear-gradient(135deg, rgba(var(--poster-accent-rgb), .16) 0 12px, transparent 12px 26px);
  mix-blend-mode:screen;
}

.playlist-yngfPoster[data-pattern="spark"] .playlist-yngfPoster__texture{
  background:
    radial-gradient(circle at 12% 18%, rgba(var(--poster-ink-rgb), .88) 0 2px, transparent 2px 100%),
    radial-gradient(circle at 74% 24%, rgba(var(--poster-accent-rgb), .7) 0 2px, transparent 2px 100%),
    radial-gradient(circle at 58% 62%, rgba(var(--poster-ink-rgb), .58) 0 2px, transparent 2px 100%),
    radial-gradient(circle at 82% 78%, rgba(var(--poster-accent-rgb), .82) 0 1px, transparent 1px 100%);
  background-size:140px 140px, 210px 210px, 180px 180px, 120px 120px;
}

.playlist-yngfPoster[data-pattern="haze"] .playlist-yngfPoster__texture{
  background:
    radial-gradient(circle at 22% 18%, rgba(var(--poster-accent-rgb), .28), transparent 30%),
    radial-gradient(circle at 78% 22%, rgba(var(--poster-ink-rgb), .18), transparent 24%),
    radial-gradient(circle at 66% 70%, rgba(var(--poster-accent-rgb), .18), transparent 22%),
    radial-gradient(circle at 18% 76%, rgba(var(--poster-ink-rgb), .16), transparent 20%);
  mix-blend-mode:screen;
}

.playlist-yngfPoster[data-pattern="blocks"] .playlist-yngfPoster__texture{
  background:
    linear-gradient(0deg, transparent 0 30%, rgba(var(--poster-accent-rgb), .18) 30% 58%, transparent 58% 100%),
    linear-gradient(90deg, rgba(var(--poster-ink-rgb), .08) 0 22%, transparent 22% 52%, rgba(var(--poster-accent-rgb), .14) 52% 76%, transparent 76% 100%);
  mix-blend-mode:overlay;
}

.playlist-yngfPoster[data-pattern="burst"] .playlist-yngfPoster__texture{
  background:repeating-conic-gradient(from 0deg at 50% 32%, rgba(var(--poster-accent-rgb), .18) 0deg 8deg, transparent 8deg 18deg);
  mix-blend-mode:screen;
}

.playlist-yngfPoster[data-pattern="grid"] .playlist-yngfPoster__texture{
  background:
    linear-gradient(rgba(var(--poster-ink-rgb), .12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--poster-ink-rgb), .12) 1px, transparent 1px);
  background-size:44px 44px;
  mix-blend-mode:overlay;
}

.playlist-yngfPoster[data-pattern="rings"] .playlist-yngfPoster__texture{
  background:repeating-radial-gradient(circle at 50% 35%, rgba(var(--poster-accent-rgb), .18) 0 8px, transparent 8px 22px);
  mix-blend-mode:screen;
}

.playlist-yngfPoster[data-pattern="confetti"] .playlist-yngfPoster__texture{
  background:
    radial-gradient(circle at 12% 18%, rgba(var(--poster-ink-rgb), .75) 0 2px, transparent 2px 100%),
    radial-gradient(circle at 74% 24%, rgba(var(--poster-accent-rgb), .7) 0 2px, transparent 2px 100%),
    radial-gradient(circle at 58% 62%, rgba(var(--poster-ink-rgb), .48) 0 2px, transparent 2px 100%),
    radial-gradient(circle at 82% 78%, rgba(var(--poster-accent-rgb), .72) 0 1px, transparent 1px 100%),
    radial-gradient(circle at 26% 72%, rgba(var(--poster-accent-rgb), .46) 0 1.5px, transparent 1.5px 100%);
  background-size:120px 120px, 180px 180px, 160px 160px, 100px 100px, 140px 140px;
}

.playlist-yngfPoster[data-pattern="kaleido"] .playlist-yngfPoster__texture{
  background:
    repeating-conic-gradient(from 35deg at 50% 30%, rgba(var(--poster-accent-rgb), .16) 0deg 12deg, transparent 12deg 24deg),
    radial-gradient(circle at 24% 72%, rgba(var(--poster-ink-rgb), .18), transparent 24%),
    radial-gradient(circle at 78% 22%, rgba(var(--poster-accent-rgb), .18), transparent 22%);
  mix-blend-mode:screen;
}

.playlist-yngfPoster__frame{
  z-index:2;
  inset:18px;
  border:1px solid rgba(var(--poster-ink-rgb), .18);
  border-radius:18px;
  opacity:0;
  transition:opacity .2s ease;
}

.playlist-yngfPoster.is-framed .playlist-yngfPoster__frame{opacity:1;}

.playlist-yngfPoster__inner{
  z-index:3;
  padding:38px 38px 32px;
  display:grid;
  grid-template-rows:auto auto minmax(240px, auto) auto auto;
  align-content:start;
  gap:18px;
  box-sizing:border-box;
}

.playlist-yngfPoster__kicker{
  margin:0;
  font-size:11px;
  letter-spacing:.26em;
  text-transform:uppercase;
  opacity:.78;
}

.playlist-yngfPoster__headlineBlock{display:grid;gap:8px;}

.playlist-yngfPoster__title,
.playlist-yngfPoster__subtitle,
.playlist-yngfPoster__artistRow,
.playlist-yngfPoster__footer{
  font-family:var(--poster-font-family);
}

.playlist-yngfPoster__title{
  margin:0;
  font-size:clamp(48px, 7vw, 88px);
  line-height:.92;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.playlist-yngfPoster__subtitle{
  margin:0;
  font-size:13px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(var(--poster-accent-rgb), .96);
}

.playlist-yngfPoster__lineup{
  display:grid;
  gap:8px;
  min-height:240px;
  align-content:start;
}

.playlist-yngfPoster__artistRow{
  text-transform:uppercase;
  line-height:.92;
  word-break:break-word;
  transition:transform .22s ease, opacity .22s ease;
  text-wrap:balance;
}

.playlist-yngfPoster__artistRow--headliner{max-width:11ch;}
.playlist-yngfPoster__artistRow--cohead{max-width:16ch;}
.playlist-yngfPoster__artistRow--feature{max-width:22ch;}
.playlist-yngfPoster__artistRow.is-tight{letter-spacing:.02em;}

.playlist-yngfPoster[data-layout="centered"] .playlist-yngfPoster__headlineBlock,
.playlist-yngfPoster[data-layout="centered"] .playlist-yngfPoster__lineup,
.playlist-yngfPoster[data-layout="centered"] .playlist-yngfPoster__footer,
.playlist-yngfPoster[data-mode="story"] .playlist-yngfPoster__headlineBlock{
  text-align:center;
  justify-items:center;
}

.playlist-yngfPoster[data-layout="columns"] .playlist-yngfPoster__lineup,
.playlist-yngfPoster[data-layout="posterwall"] .playlist-yngfPoster__lineup{
  grid-template-columns:repeat(2, minmax(0,1fr));
  column-gap:18px;
}

.playlist-yngfPoster[data-layout="cascade"] .playlist-yngfPoster__artistRow:nth-child(even){padding-left:clamp(0px, 7%, 38px);}
.playlist-yngfPoster[data-layout="marquee"] .playlist-yngfPoster__lineup{gap:4px;}
.playlist-yngfPoster[data-layout="marquee"] .playlist-yngfPoster__artistRow{text-transform:none;letter-spacing:.03em;}
.playlist-yngfPoster[data-layout="widebill"] .playlist-yngfPoster__headlineBlock{max-width:20ch;}
.playlist-yngfPoster[data-layout="footerheavy"] .playlist-yngfPoster__inner{grid-template-rows:auto auto minmax(160px,1fr) auto auto;}
.playlist-yngfPoster[data-layout="footerheavy"] .playlist-yngfPoster__mosaic{order:4;}
.playlist-yngfPoster[data-layout="footerheavy"] .playlist-yngfPoster__footer{font-size:12px;}
.playlist-yngfPoster[data-layout="splitstack"] .playlist-yngfPoster__artistRow:nth-child(even){padding-left:8%;}
.playlist-yngfPoster[data-layout="spotlightgrid"] .playlist-yngfPoster__artistRow:first-child{grid-column:1/-1;}
.playlist-yngfPoster[data-layout="tower"] .playlist-yngfPoster__lineup{gap:6px;}
.playlist-yngfPoster[data-layout="tower"] .playlist-yngfPoster__headlineBlock{max-width:12ch;}
.playlist-yngfPoster[data-layout="duet"] .playlist-yngfPoster__lineup{grid-template-columns:repeat(2, minmax(0,1fr));}
.playlist-yngfPoster[data-layout="duet"] .playlist-yngfPoster__artistRow:first-child{grid-column:1/-1;}
.playlist-yngfPoster[data-layout="gridbill"] .playlist-yngfPoster__lineup{grid-template-columns:repeat(3, minmax(0,1fr)); column-gap:12px; gap:6px;}

.playlist-yngfPoster[data-columns="2"]{--poster-columns:2;}
.playlist-yngfPoster[data-columns="3"]{--poster-columns:3;}

.playlist-yngfPoster[data-mode="story"] .playlist-yngfPoster__inner{
  grid-template-rows:auto auto minmax(160px,1fr) auto auto;
}

.playlist-yngfPoster[data-mode="reel"] .playlist-yngfPoster__headlineBlock,
.playlist-yngfPoster[data-mode="skyline"] .playlist-yngfPoster__headlineBlock{
  max-width:18ch;
}

.playlist-yngfPoster[data-mode="spotlight"] .playlist-yngfPoster__lineup,
.playlist-yngfPoster[data-mode="duo"] .playlist-yngfPoster__lineup{gap:14px;}
.playlist-yngfPoster[data-mode="reel"] .playlist-yngfPoster__lineup,
.playlist-yngfPoster[data-mode="flyer"] .playlist-yngfPoster__lineup{gap:6px;}
.playlist-yngfPoster[data-mode="reel"] .playlist-yngfPoster__artistRow{text-transform:none;}
.playlist-yngfPoster[data-mode="skyline"] .playlist-yngfPoster__headlineBlock{justify-items:start;}
.playlist-yngfPoster[data-mode="flyer"] .playlist-yngfPoster__headlineBlock{max-width:20ch;}
.playlist-yngfPoster[data-mode="marathon"] .playlist-yngfPoster__headlineBlock{max-width:22ch;}
.playlist-yngfPoster[data-mode="mosaic"] .playlist-yngfPoster__lineup{display:none;}
.playlist-yngfPoster[data-mode="mosaic"] .playlist-yngfPoster__mosaic{min-height:360px;}
.playlist-yngfPoster[data-mode="story"] .playlist-yngfPoster__mosaic,
.playlist-yngfPoster[data-mode="marathon"] .playlist-yngfPoster__mosaic{min-height:420px;}

.playlist-yngfPoster__mosaic{
  display:grid;
  grid-template-columns:repeat(var(--poster-cover-columns, 4), minmax(0,1fr));
  gap:8px;
  align-content:start;
}

.playlist-yngfPoster__coverTile{
  aspect-ratio:1/1;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(var(--poster-ink-rgb), .12);
  background:rgba(var(--poster-ink-rgb), .08);
  display:grid;
  place-items:center;
  color:rgba(var(--poster-ink-rgb), .84);
  font-size:13px;
  letter-spacing:.2em;
  text-transform:uppercase;
}

.playlist-yngfPoster__coverTile img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.playlist-yngfPoster__coverTile--placeholder{background:rgba(255,255,255,.05);}
.playlist-yngfPoster__coverTile--summary{background:linear-gradient(180deg, rgba(var(--poster-accent-rgb), .18), rgba(var(--poster-bg-rgb), .45));text-align:center;padding:10px;gap:4px;}
.playlist-yngfPoster__coverTile--summary strong{font-size:26px;line-height:1;}
.playlist-yngfPoster__coverTile--summary span{font-size:10px;letter-spacing:.22em;text-transform:uppercase;}

.playlist-yngfPoster__empty{
  margin:0;
  font-size:14px;
  letter-spacing:.12em;
  text-transform:uppercase;
  opacity:.76;
}

.playlist-yngfPoster__footer{
  margin-top:auto;
  display:flex;
  justify-content:space-between;
  gap:12px;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(var(--poster-ink-rgb), .82);
}

.playlist-yngfPoster[data-theme="neon"]{--poster-bg:#10091f; --poster-accent:#ff3bb9; --poster-ink:#f2ecff;}
.playlist-yngfPoster[data-theme="xerox"]{--poster-bg:#ece6dc; --poster-accent:#111; --poster-ink:#131313; box-shadow:0 14px 44px rgba(0,0,0,.12);}
.playlist-yngfPoster[data-theme="sunset"]{--poster-bg:#2f0f13; --poster-accent:#ffc06b; --poster-ink:#fff0df;}
.playlist-yngfPoster[data-theme="cosmic"]{--poster-bg:#0c0d1d; --poster-accent:#81d2ff; --poster-ink:#f6f0ff;}
.playlist-yngfPoster[data-theme="borough"]{--poster-bg:#111111; --poster-accent:#f25c3d; --poster-ink:#f5ead8;}
.playlist-yngfPoster[data-theme="cream"]{--poster-bg:#f3ecdf; --poster-accent:#8f4630; --poster-ink:#181410; box-shadow:0 16px 42px rgba(0,0,0,.12);}
.playlist-yngfPoster[data-theme="chrome"]{--poster-bg:#171b22; --poster-accent:#c7f0ff; --poster-ink:#f4f7fb;}
.playlist-yngfPoster[data-theme="aurora"]{--poster-bg:#140f2c; --poster-accent:#88ffd9; --poster-ink:#f4eaff;}
.playlist-yngfPoster[data-theme="afterhours"]{--poster-bg:#0a1224; --poster-accent:#ff6db6; --poster-ink:#ecf4ff;}
.playlist-yngfPoster[data-theme="skyline"]{--poster-bg:#10222b; --poster-accent:#ffb86e; --poster-ink:#fff5ea;}
.playlist-yngfPoster[data-theme="mural"]{--poster-bg:#1b1311; --poster-accent:#77c8ff; --poster-ink:#ffe6cf;}
.playlist-yngfPoster[data-theme="midnight"]{--poster-bg:#08101e; --poster-accent:#60b6ff; --poster-ink:#edf4ff;}
.playlist-yngfPoster[data-theme="tabloid"]{--poster-bg:#111111; --poster-accent:#ffd22f; --poster-ink:#faf5e8;}
.playlist-yngfPoster[data-theme="opal"]{--poster-bg:#20182d; --poster-accent:#b4f7ff; --poster-ink:#fff0ff;}
.playlist-yngfPoster[data-theme="desert"]{--poster-bg:#3b2418; --poster-accent:#ffcb88; --poster-ink:#fff2dd;}

.playlist-yngfPoster[data-font="serif"]{--poster-font-family:"Iowan Old Style", "Palatino Linotype", Georgia, serif;}
.playlist-yngfPoster[data-font="grotesk"]{--poster-font-family:Inter, "Helvetica Neue", Arial, sans-serif;}
.playlist-yngfPoster[data-font="wide"]{--poster-font-family:"Trebuchet MS", "Arial Black", sans-serif;}
.playlist-yngfPoster[data-font="mono"]{--poster-font-family:"SFMono-Regular", Consolas, monospace;}
.playlist-yngfPoster[data-font="display"]{--poster-font-family:"Avenir Next Condensed", "Arial Narrow", sans-serif;}
.playlist-yngfPoster[data-font="slab"]{--poster-font-family:Rockwell, "Roboto Slab", Georgia, serif;}
.playlist-yngfPoster[data-font="editorial"]{--poster-font-family:Baskerville, "Times New Roman", serif;}
.playlist-yngfPoster[data-font="billboard"]{--poster-font-family:"Franklin Gothic Medium", "Arial Narrow", Arial, sans-serif;}
.playlist-yngfPoster[data-font="club"]{--poster-font-family:"Gill Sans", "Trebuchet MS", sans-serif;}
.playlist-yngfPoster[data-font="poster"]{--poster-font-family:"Arial Black", Impact, sans-serif;}
.playlist-yngfPoster[data-font="luxe"]{--poster-font-family:Didot, "Bodoni MT", Georgia, serif;}
.playlist-yngfPoster[data-font="punk"]{--poster-font-family:"Arial Narrow", Impact, sans-serif; letter-spacing:.02em;}

.playlist-yngfStudio__controls,
.playlist-yngfStudio__fineTune,
.playlist-yngfStudio__wheels{
  display:grid;
  gap:18px;
}

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

.playlist-yngfWheel{
  padding:12px 12px 10px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:24px;
  background:rgba(255,255,255,.68);
  box-shadow:0 8px 24px rgba(0,0,0,.05);
}

.playlist-yngfWheel__frame{
  position:relative;
  width:min(100%, 176px);
  aspect-ratio:1/1;
  margin:0 auto;
}

.playlist-yngfWheel__ring,
.playlist-yngfWheel__core{
  position:absolute;
  inset:0;
}

.playlist-yngfWheel__ring{
  pointer-events:none;
}

.playlist-yngfWheel__core{
  z-index:2;
  margin:auto;
  width:84px;
  height:84px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.14);
  background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(243,239,231,.86));
  display:grid;
  place-items:center;
  gap:2px;
  text-align:center;
  padding:8px;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.playlist-yngfWheel.is-open .playlist-yngfWheel__core,
.playlist-yngfWheel__core:hover,
.playlist-yngfWheel__core:focus-visible{
  transform:translateY(-1px);
  box-shadow:0 12px 28px rgba(0,0,0,.12);
  outline:none;
}

.playlist-yngfWheel__coreLabel{
  font-size:10px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:#666;
}

.playlist-yngfWheel__coreValue,
.playlist-yngfWheel__status{
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#111;
}

.playlist-yngfWheel__option{
  position:absolute;
  left:50%;
  top:50%;
  width:var(--wheel-button, 36px);
  height:var(--wheel-button, 36px);
  margin:calc(var(--wheel-button, 36px) / -2);
  border-radius:999px;
  transform:rotate(var(--angle)) translateY(-6px) rotate(calc(var(--angle) * -1)) scale(.2);
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  color:#111;
  font:inherit;
  font-size:9px;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
  opacity:0;
  pointer-events:none;
  transition:transform .2s ease, opacity .16s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}

.playlist-yngfWheel.is-open .playlist-yngfWheel__option{
  opacity:1;
  pointer-events:auto;
  transform:rotate(var(--angle)) translateY(calc(var(--wheel-orbit, 78px) * -1)) rotate(calc(var(--angle) * -1)) scale(1);
}

.playlist-yngfWheel__option:hover,
.playlist-yngfWheel__option:focus-visible,
.playlist-yngfWheel__option.is-active{
  background:#111;
  color:#fff;
  box-shadow:0 10px 22px rgba(0,0,0,.16);
  outline:none;
}

.playlist-yngfWheel.is-open .playlist-yngfWheel__option.is-active{
  transform:rotate(var(--angle)) translateY(calc((var(--wheel-orbit, 78px) + 4px) * -1)) rotate(calc(var(--angle) * -1)) scale(1.05);
}

.playlist-yngfWheel__status{
  min-height:32px;
  margin:8px 0 0;
  text-align:center;
  font-size:10px;
  letter-spacing:.12em;
  line-height:1.45;
  color:#666;
}

.playlist-yngfStudio__fineTune{
  padding:18px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:26px;
  background:rgba(255,255,255,.7);
}

.playlist-yngfStudio__fieldGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
}

.playlist-yngfStudio__fieldGrid--colors{grid-template-columns:repeat(3, minmax(0,1fr));}
.playlist-yngfStudio__fieldGrid--media{grid-template-columns:minmax(0,1.2fr) minmax(120px,.8fr);align-items:end;}
.playlist-yngfStudio__sliders{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:12px;}

.playlist-yngfStudio__field{
  display:grid;
  gap:6px;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#666;
}

.playlist-yngfStudio__field input,
.playlist-yngfStudio__field select{
  min-height:42px;
  padding:0 12px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:14px;
  background:#fff;
  color:#111;
  font:inherit;
  letter-spacing:normal;
  text-transform:none;
}

.playlist-yngfStudio__field--range input{padding:0;}
.playlist-yngfStudio__field--file input{padding:10px;border-style:dashed;}
.playlist-yngfStudio__field small{font-size:11px;letter-spacing:normal;text-transform:none;line-height:1.45;color:#6f6f6f;}

.playlist-yngfStudio__colorControl{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  gap:10px;
  align-items:center;
}

.playlist-yngfStudio__colorControl input[type="color"]{
  inline-size:48px;
  block-size:42px;
  padding:3px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:14px;
  background:#fff;
  cursor:pointer;
}

.playlist-yngfStudio__colorControl input[type="color"]::-webkit-color-swatch-wrapper{padding:0;}
.playlist-yngfStudio__colorControl input[type="color"]::-webkit-color-swatch,
.playlist-yngfStudio__colorControl input[type="color"]::-moz-color-swatch{
  border:none;
  border-radius:10px;
}

body.playlists-page.is-dark .playlist-yngfStudio{border-top-color:rgba(255,255,255,.08);}
body.playlists-page.is-dark .playlist-yngfWheel,
body.playlists-page.is-dark .playlist-yngfStudio__fineTune{background:rgba(18,18,18,.76);border-color:rgba(255,255,255,.1);box-shadow:0 16px 34px rgba(0,0,0,.24);}
body.playlists-page.is-dark .playlist-yngfWheel__core,
body.playlists-page.is-dark .playlist-yngfWheel__option,
body.playlists-page.is-dark .playlist-yngfStudio__field input,
body.playlists-page.is-dark .playlist-yngfStudio__field select,
body.playlists-page.is-dark .playlist-yngfStudio__colorControl input[type="color"]{background:#111;border-color:rgba(255,255,255,.12);color:#f0ede6;}
body.playlists-page.is-dark .playlist-yngfWheel__coreLabel,
body.playlists-page.is-dark .playlist-yngfStudio__field,
body.playlists-page.is-dark .playlist-yngfStudio__field small{color:rgba(255,255,255,.58);}
body.playlists-page.is-dark .playlist-yngfWheel__option:hover,
body.playlists-page.is-dark .playlist-yngfWheel__option:focus-visible,
body.playlists-page.is-dark .playlist-yngfWheel__option.is-active{background:#f0ede6;color:#111;}
body.playlists-page.is-dark .playlist-yngfPoster{box-shadow:0 24px 70px rgba(0,0,0,.36);}

@media (max-width: 980px){
  .playlist-yngfStudio__layout{grid-template-columns:1fr;}
  .playlist-yngfStudio__wheels{grid-template-columns:repeat(2, minmax(0,1fr));}
}

@media (max-width: 760px){
  .playlist-yngfStudio__intro{grid-template-columns:1fr;}
  .playlist-yngfStudio__topActions,
  .playlist-yngfStudio__miniActions{width:100%;}
  .playlist-yngfStudio__topActions .playlist-support__button,
  .playlist-yngfStudio__miniActions .playlist-support__button{flex:1 1 100%;}
  .playlist-yngfStudio__wheels,
  .playlist-yngfStudio__fieldGrid,
  .playlist-yngfStudio__fieldGrid--colors,
  .playlist-yngfStudio__fieldGrid--media,
  .playlist-yngfStudio__sliders{grid-template-columns:1fr;}
  .playlist-yngfPoster{min-height:720px;border-radius:22px;}
  .playlist-yngfPoster__inner{padding:22px 20px 20px;}
  .playlist-yngfPoster__title{font-size:clamp(36px, 11vw, 66px);}
  .playlist-yngfPoster__footer{flex-direction:column;align-items:flex-start;}
  .playlist-yngfWheel__frame{width:min(100%, 170px);}
  .playlist-yngfWheel__option{transform:rotate(var(--angle)) translateY(-64px) rotate(calc(var(--angle) * -1));}
  .playlist-yngfWheel__option.is-active{transform:rotate(var(--angle)) translateY(-68px) rotate(calc(var(--angle) * -1));}
}

@media(max-width:900px){
  .playlist-yngfStudio__layout{grid-template-columns:1fr;}
  .playlist-yngfStudio__wheels{grid-template-columns:1fr;}
}

/* ============================================================
   YNGF(r) BACKGROUND PAINT LAYER
   ============================================================ */
.playlist-paintCanvas{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;pointer-events:none;touch-action:none;}
body.playlists-page[data-playlist-mode="yngfr"].is-painting-enabled .playlist-paintCanvas{pointer-events:auto;cursor:crosshair;}
body.playlists-page .nav,
body.playlists-page .top8,
body.playlists-page .playlists-canvas,
body.playlists-page .playlist-playerShell,
body.playlists-page .playlist-modeBar,
body.playlists-page .playlist-paintDock,
body.playlists-page .playlist-trainJazzLink,
body.playlists-page .playlist-scWrap,
body.playlists-page #tooltip{z-index:2;}
.playlist-modeBar,.playlist-trainJazzLink,.playlist-paintDock{z-index:10021;}
.playlist-paintDock{
  position:fixed;
  /* Anchored above the TrainJazz angel/train mark, not down in the mode bar. */
  left:54px;
  bottom:214px;
  width:34px;
  height:34px;
  z-index:10030;
  pointer-events:auto;
  opacity:1;
  visibility:visible;
}
body.playlists-page[data-playlist-mode="yngfr"] .playlist-paintDock:not([hidden]){
  display:block!important;
}
.playlist-paintDock[hidden]{display:none!important;}
.playlist-paintDock__launcher{appearance:none;width:34px;height:34px;border-radius:999px;border:1px solid rgba(0,0,0,.18);background:rgba(255,255,255,.94);color:rgba(0,0,0,.72);box-shadow:0 4px 14px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);cursor:pointer;font:inherit;font-size:8px;letter-spacing:.16em;text-transform:uppercase;line-height:1;padding:0;transition:transform .18s ease,background .16s ease,color .16s ease,box-shadow .18s ease;}
.playlist-paintDock__launcher:hover,.playlist-paintDock__launcher:focus-visible{transform:translateY(-1px);background:rgba(0,0,0,.9);color:#fff;outline:none;}
.playlist-paintDock__wheel{position:absolute;left:-8px;bottom:-8px;width:178px;height:178px;opacity:0;transform:scale(.68);transform-origin:26px calc(100% - 26px);pointer-events:none;transition:opacity .18s ease,transform .22s cubic-bezier(.22,.84,.24,1.14);}
.playlist-paintDock__wheel.is-open{opacity:1;transform:scale(1);pointer-events:auto;}
.playlist-paintDock__wheel::before{content:"";position:absolute;inset:16px;border-radius:999px;background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.86),rgba(246,241,233,.84) 44%,rgba(255,255,255,.72) 72%);border:1px solid rgba(0,0,0,.08);box-shadow:0 16px 30px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.8);}
.playlist-paintDock__action{position:absolute;left:50%;top:50%;width:28px;height:28px;margin:-14px;border-radius:999px;border:1px solid rgba(0,0,0,.12);background:#fff;color:#111;display:grid;place-items:center;cursor:pointer;font:inherit;font-size:9px;line-height:1;letter-spacing:.05em;transform:rotate(var(--angle)) translateY(-76px) rotate(calc(var(--angle) * -1));box-shadow:0 8px 18px rgba(0,0,0,.12);transition:background .16s ease,color .16s ease,transform .18s ease,opacity .16s ease;}
.playlist-paintDock__action:hover,.playlist-paintDock__action:focus-visible,.playlist-paintDock__action.is-active{background:#111;color:#fff;outline:none;transform:rotate(var(--angle)) translateY(-80px) rotate(calc(var(--angle) * -1)) scale(1.06);}
.playlist-paintDock__action:disabled{opacity:.35;cursor:not-allowed;transform:rotate(var(--angle)) translateY(-76px) rotate(calc(var(--angle) * -1));}
.playlist-paintDock__status{position:absolute;left:42px;bottom:34px;max-width:112px;padding:5px 7px;border-radius:999px;background:rgba(255,255,255,.88);color:rgba(0,0,0,.62);border:1px solid rgba(0,0,0,.08);font-size:8px;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;white-space:normal;box-shadow:0 8px 18px rgba(0,0,0,.08);}
body.playlists-page.is-dark .playlist-paintDock__launcher{background:rgba(18,18,18,.94);color:rgba(255,255,255,.72);border-color:rgba(255,255,255,.12);box-shadow:0 4px 14px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.08);}
body.playlists-page.is-dark .playlist-paintDock__launcher:hover,body.playlists-page.is-dark .playlist-paintDock__launcher:focus-visible{background:rgba(255,255,255,.9);color:#111;}
body.playlists-page.is-dark .playlist-paintDock__wheel::before{background:radial-gradient(circle at 34% 28%,rgba(50,50,50,.88),rgba(20,20,20,.9) 48%,rgba(8,8,8,.78) 76%);border-color:rgba(255,255,255,.1);}
body.playlists-page.is-dark .playlist-paintDock__action{background:#171717;color:#f5f0e8;border-color:rgba(255,255,255,.13);}
body.playlists-page.is-dark .playlist-paintDock__action:hover,body.playlists-page.is-dark .playlist-paintDock__action:focus-visible,body.playlists-page.is-dark .playlist-paintDock__action.is-active{background:#f0ede6;color:#111;}
body.playlists-page.is-dark .playlist-paintDock__status{background:rgba(18,18,18,.88);color:rgba(255,255,255,.66);border-color:rgba(255,255,255,.1);}
@media (max-width:720px){.playlist-paintDock{bottom:188px;left:42px;}.playlist-paintDock__wheel{width:160px;height:160px;}.playlist-paintDock__action{width:26px;height:26px;margin:-13px;transform:rotate(var(--angle)) translateY(-68px) rotate(calc(var(--angle) * -1));}.playlist-paintDock__action:hover,.playlist-paintDock__action:focus-visible,.playlist-paintDock__action.is-active{transform:rotate(var(--angle)) translateY(-72px) rotate(calc(var(--angle) * -1)) scale(1.05);}.playlist-paintDock__status{left:38px;bottom:32px;max-width:98px;}}


/* YNGF(r) mode visibility guardrails borrowed from cross-reference.
   Keep YNGF builder/bar available in paint mode without overriding hidden panels. */
body.playlists-page[data-playlist-mode="yngfr"] .playlist-yngfBuilder:not([hidden]),
body.playlists-page[data-playlist-mode="yngfr"] .playlist-yngfBar:not([hidden]){display:block!important;}

/* ============================================================
   YNGF(r) PAINT USABILITY PATCH
   - blank paintable space above and below page content in paint mode only
   - paint launcher remains visible; radial controls open beside it, not over it
   ============================================================ */
.playlist-paintSpace{
  display:none;
  min-height:0;
  pointer-events:none;
  position:relative;
  z-index:1;
}
body.playlists-page[data-playlist-mode="yngfr"] .playlist-paintSpace{
  display:block;
  min-height:100vh;
  min-height:100svh;
}
body.playlists-page[data-playlist-mode="yngfr"] .playlist-paintSpace--top{
  margin-bottom:10px;
}
body.playlists-page[data-playlist-mode="yngfr"] .playlist-paintSpace--bottom{
  margin-top:18px;
  padding-bottom:104px;
}

.playlist-paintDock{
  width:38px;
  height:34px;
}
.playlist-paintDock__launcher{
  position:relative;
  z-index:3;
  width:38px;
  min-width:38px;
  height:34px;
  font-size:7px;
  letter-spacing:.12em;
}
.playlist-paintDock__wheel{
  left:48px;
  bottom:-48px;
  width:174px;
  height:174px;
  transform-origin:-30px calc(100% - 17px);
}
.playlist-paintDock__wheel::before{
  inset:22px;
  opacity:.92;
  pointer-events:none;
}
.playlist-paintDock__action{
  z-index:2;
  transform:rotate(var(--angle)) translateY(-72px) rotate(calc(var(--angle) * -1));
}
.playlist-paintDock__action:hover,
.playlist-paintDock__action:focus-visible,
.playlist-paintDock__action.is-active{
  transform:rotate(var(--angle)) translateY(-76px) rotate(calc(var(--angle) * -1)) scale(1.06);
}
.playlist-paintDock__action:disabled{
  transform:rotate(var(--angle)) translateY(-72px) rotate(calc(var(--angle) * -1));
}
.playlist-paintDock__status{
  left:50px;
  bottom:-34px;
  max-width:158px;
  pointer-events:none;
}
.playlist-paintDock__wheel:not(.is-open) .playlist-paintDock__action,
.playlist-paintDock__wheel:not(.is-open) .playlist-paintDock__status{
  display:none;
}
.playlist-paintDock__action--color{
  border-color:var(--paint-color, rgba(0,0,0,.12));
  box-shadow:0 8px 18px rgba(0,0,0,.12), inset 0 0 0 3px var(--paint-color, transparent);
}

.playlist-paintDock__action--color::after{
  content:"";
  position:absolute;
  right:3px;
  bottom:3px;
  width:7px;
  height:7px;
  border-radius:999px;
  background:var(--paint-color, currentColor);
  border:1px solid rgba(0,0,0,.18);
  box-shadow:0 0 0 1px rgba(255,255,255,.55);
  pointer-events:none;
}
body.playlists-page.is-dark .playlist-paintDock__action--color::after{
  border-color:rgba(255,255,255,.22);
  box-shadow:0 0 0 1px rgba(0,0,0,.55);
}

/* Let the decorative hero/logo area become paintable only while the brush/eraser is active.
   This keeps normal page controls protected, but removes the oversized invisible logo box
   that was making the top background hard to start painting on. */
body.playlists-page[data-playlist-mode="yngfr"].is-painting-enabled .playlists-hero,
body.playlists-page[data-playlist-mode="yngfr"].is-painting-enabled .playlists-hero .logo-wrap,
body.playlists-page[data-playlist-mode="yngfr"].is-painting-enabled .playlists-hero .site-logo{
  pointer-events:none;
}

@media (max-width:720px){
  .playlist-paintDock__wheel{
    left:44px;
    bottom:-44px;
    width:158px;
    height:158px;
  }
  .playlist-paintDock__action{
    transform:rotate(var(--angle)) translateY(-64px) rotate(calc(var(--angle) * -1));
  }
  .playlist-paintDock__action:hover,
  .playlist-paintDock__action:focus-visible,
  .playlist-paintDock__action.is-active{
    transform:rotate(var(--angle)) translateY(-68px) rotate(calc(var(--angle) * -1)) scale(1.05);
  }
  .playlist-paintDock__action:disabled{
    transform:rotate(var(--angle)) translateY(-64px) rotate(calc(var(--angle) * -1));
  }
  .playlist-paintDock__status{
    left:46px;
    bottom:-32px;
    max-width:132px;
  }
}


/* ============================================================
   YNGF(r) paint guide text — non-breaking text-only patch
   Uses a fixed, non-interactive guide layer under the paint canvas.
   It does not reposition the player, TrainJazz mark, paint button,
   top-right videos, nav, or playlist content.
   ============================================================ */
.playlist-paintGuideLayer{
  display:none;
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
  align-items:center;
  justify-content:center;
  text-align:center;
}
body.playlists-page[data-playlist-mode="yngfr"] .playlist-paintGuideLayer.is-visible{
  display:flex;
}
.playlist-paintGuidePanel{
  width:min(82vw, 430px);
  font-size:clamp(.56rem, .92vw, .74rem);
  line-height:1.5;
  letter-spacing:.07em;
  text-transform:lowercase;
  color:rgba(20,20,20,.32);
  text-shadow:0 1px 0 rgba(255,255,255,.18);
}
.playlist-paintGuidePanel__title{
  font-size:clamp(.68rem, 1.18vw, .92rem);
  letter-spacing:.12em;
  margin-bottom:.34rem;
}
body.playlists-page.is-dark .playlist-paintGuidePanel{
  color:rgba(255,255,255,.30);
  text-shadow:0 1px 0 rgba(0,0,0,.22);
}
@media(max-width:720px){
  .playlist-paintGuidePanel{
    width:min(84vw, 340px);
    font-size:clamp(.52rem, 2.25vw, .68rem);
    line-height:1.44;
  }
  .playlist-paintGuidePanel__title{
    font-size:clamp(.64rem, 3vw, .84rem);
  }
}