@property --tint{syntax:"<color>"; inherits:true; initial-value:#3e3e3e;}@layer site{.playlists-page{--tint:#3e8f4b;position:relative;isolation:isolate;background:#090b0b}@media(prefers-reduced-motion:no-preference){.playlists-page{transition:--tint .8s var(--ease)}}.pl-wash{position:absolute;inset:0 0 auto;height:min(1100px,140vh);z-index:-1;pointer-events:none;background:radial-gradient(80% 62% at 82% 0%,color-mix(in srgb,var(--tint) 58%,transparent),transparent 72%),radial-gradient(60% 48% at 6% 14%,color-mix(in srgb,var(--tint) 26%,transparent),transparent 72%);-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}.pl-masthead h1{margin-top:14px;font:600 clamp(44px,6vw,88px)/.96 var(--serif);letter-spacing:-.028em;text-wrap:balance}.pl-lede{max-width:540px;margin-top:clamp(16px,2vw,26px);font-size:clamp(16px,1.4vw,19px);line-height:1.45;color:#f6f2eacc}.pl-browser{padding-block:clamp(112px,12vw,150px) clamp(56px,7vw,112px)}.pl-wall{margin-top:clamp(28px,3.4vw,48px)}.pl-shelf+.pl-shelf{margin-top:clamp(24px,3vw,40px)}.pl-shelf h2{margin-bottom:14px;font:650 12px/1.2 var(--body);letter-spacing:.2em;text-transform:uppercase;color:#f6f2eab8}.pl-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,28px) clamp(12px,1.6vw,20px)}.pl-tile{display:flex;flex-direction:column;gap:3px;color:#f6f2ea;text-decoration:none}.pl-tile img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:clamp(14px,1.8vw,22px);box-shadow:0 0 0 1px #ffffff1f;margin-bottom:8px}.pl-tile-name{font:600 clamp(16px,1.5vw,20px)/1.12 var(--serif);letter-spacing:-.01em}.pl-tile-short{font-size:13px;line-height:1.3;color:#f6f2eaa3}.pl-tile:focus-visible{outline:2px solid #f0f0de;outline-offset:5px;border-radius:12px}@media(prefers-reduced-motion:no-preference){.pl-tile img{transition:translate .35s var(--ease),box-shadow .35s var(--ease)}.pl-tile:hover img{translate:0 -4px}}.pl-stage{display:grid;gap:clamp(40px,6vw,72px);margin-top:clamp(40px,6vw,72px)}.pl-card{display:grid;gap:clamp(18px,2.4vw,28px);scroll-margin-top:88px}.pl-card-cover{aspect-ratio:3/2;overflow:hidden;border-radius:clamp(20px,2.4vw,30px);box-shadow:0 0 0 1px #ffffff1f}.pl-card-cover img{width:100%;height:100%;object-fit:cover}.pl-short{font:650 12px/1.2 var(--body);letter-spacing:.2em;text-transform:uppercase;color:#f6f2eaa3}.pl-card h3{margin-top:10px;font:600 clamp(44px,6vw,80px)/.96 var(--serif);letter-spacing:-.026em;overflow-wrap:break-word;text-wrap:balance}.pl-purpose{max-width:600px;margin-top:clamp(14px,1.8vw,22px);font:600 clamp(20px,1.9vw,26px)/1.22 var(--serif);letter-spacing:-.01em;color:#f6f2eaf0;text-wrap:balance}.pl-sound{max-width:600px;margin-top:14px;font-size:clamp(16px,1.35vw,18px);line-height:1.5;color:#f6f2eacc}.pl-note{max-width:600px;margin-top:14px;padding-left:14px;border-left:2px solid rgba(246,242,234,.32);font-size:15px;line-height:1.45;color:#f6f2eae0}.pl-keywords{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.pl-keywords li{padding:5px 13px;border:1px solid rgba(246,242,234,.24);border-radius:999px;font-size:13px;color:#f6f2ead1}.pl-on{margin-top:14px;font-size:14px;color:#f6f2eaa8}.pl-on a{color:#f6f2eae6;text-decoration:underline;text-decoration-color:#f0f0de52;text-underline-offset:4px}.pl-on a:hover{text-decoration-color:currentColor}.pl-on a:focus-visible,.pl-moods a:focus-visible{outline:2px solid #f0f0de;outline-offset:3px}@media(min-width:720px){.pl-tiles{grid-template-columns:repeat(5,minmax(0,1fr))}.pl-card{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start;gap:clamp(24px,4vw,56px)}}@media(min-width:1000px){[data-mode=select] .pl-browser{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(40px,5vw,88px);align-items:start}[data-mode=select] .pl-stage{position:sticky;top:96px;margin-top:0}[data-mode=select] .pl-card{display:none;grid-template-columns:1fr;gap:22px}[data-mode=select] .pl-card-cover{aspect-ratio:16/10}[data-mode=select] .pl-card.is-selected{display:grid}[data-mode=select] .pl-card-cover{box-shadow:0 0 0 1px #ffffff24,0 40px 100px -30px color-mix(in srgb,var(--tint) 80%,transparent)}[data-mode=select] .pl-card h3{font-size:clamp(44px,4.6vw,68px)}[data-mode=select] .pl-tile[aria-current=true] img{box-shadow:0 0 0 2px #f6f2ea}[data-mode=select] .pl-tile[aria-current=true] .pl-tile-name{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px}}@media(min-width:1000px)and (prefers-reduced-motion:no-preference){[data-mode=select] .pl-card.is-selected{animation:pl-in .45s var(--out-expo) both}}@keyframes pl-in{0%{opacity:0;translate:0 10px}}.pl-moods{padding-block:clamp(40px,6vw,88px) clamp(72px,9vw,140px);border-top:1px solid rgba(246,242,234,.14)}.pl-moods h2{font:600 clamp(28px,3.4vw,48px)/1.1 var(--serif);letter-spacing:-.018em}.pl-moods ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:clamp(20px,3vw,32px)}.pl-moods li a{display:flex;flex-direction:column;gap:4px;min-height:88px;padding:18px 20px;border:1px solid rgba(246,242,234,.18);border-radius:20px;background:#f6f2ea0d;color:#f6f2ea;text-decoration:none;transition:background-color .3s var(--ease),border-color .3s var(--ease)}.pl-moods li a:hover{background:#f6f2ea1a;border-color:#f6f2ea57}.pl-mood-name{font:600 clamp(24px,2.4vw,32px)/1.05 var(--serif);letter-spacing:-.014em}.pl-mood-line{font-size:14px;color:#f6f2eab3}.pl-moods p{margin-top:clamp(16px,2vw,24px)}@media(min-width:720px){.pl-moods ul{grid-template-columns:repeat(4,minmax(0,1fr))}}}@media(prefers-reduced-motion:reduce){.pl-moods li a{transition:none}}