:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#f7f8ff;background:#070b18;--purple:#6c2bff;--pink:#ff3e9d;--cyan:#00ddf9;--panel:#0e1530;--muted:#a7b0c5}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 65% 0,#17205a55,transparent 35%),#070b18}button,input,select{font:inherit}button{color:inherit;cursor:pointer}.app-shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh;padding-bottom:92px}.sidebar{position:fixed;z-index:18;inset:0 auto 92px 0;width:240px;padding:28px 20px;border-right:1px solid #ffffff12;background:#070b18ee;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.logo{width:156px;height:auto;margin:2px 10px 32px}.sidebar nav{display:grid;gap:5px}.sidebar nav button{display:flex;gap:13px;align-items:center;padding:10px 13px;border:0;border-radius:10px;background:transparent;color:var(--muted);text-align:left}.sidebar nav button svg{width:18px}.sidebar nav button:hover,.sidebar nav button.active{color:#fff;background:linear-gradient(90deg,#6c2bff3d,transparent)}.sidebar nav button.active{box-shadow:inset 3px 0 var(--purple)}.nav-title{margin:22px 13px 8px;color:#65708d;font-size:10px;text-transform:uppercase;letter-spacing:.15em}.premium{position:absolute;left:20px;right:20px;bottom:16px;padding:14px;border:1px solid #8b5cf644;border-radius:15px;background:linear-gradient(145deg,#6c2bff28,#ff3e9d0f)}.premium span,.premium strong{display:block}.premium span{font-size:11px;color:#b8a5ff}.premium strong{margin:3px 0 10px}.premium button,.outline{border:1px solid #8b5cf688;background:#ffffff08;border-radius:8px;padding:8px 12px;font-size:12px}main{grid-column:2;padding:22px 36px 44px;max-width:1500px;width:100%;margin:auto}header{display:flex;justify-content:flex-end;gap:14px;align-items:center;margin-bottom:22px}.search{display:flex;align-items:center;gap:10px;width:min(460px,55vw);background:#101831;border:1px solid #ffffff12;border-radius:10px;padding:10px 13px;color:#8390ad}.search input{width:100%;border:0;outline:0;color:#fff;background:transparent}.icon-button{background:#101831;border:1px solid #ffffff12;border-radius:10px;padding:9px}.icon-button svg{width:19px}.avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--pink),var(--purple));font-size:12px;font-weight:800}.hero{display:flex;align-items:center;justify-content:space-between;min-height:340px;padding:48px 60px;border:1px solid #ffffff12;border-radius:24px;overflow:hidden;background:radial-gradient(circle at 75% 50%,#ff3e9d33,transparent 25%),linear-gradient(120deg,#17134a,#080d20 70%);position:relative}.hero:after{content:"";position:absolute;right:5%;width:310px;height:310px;border:1px solid #ff3e9d55;border-radius:50%;box-shadow:0 0 55px #8b5cf666}.hero>div{z-index:2}.hero h1{font-size:clamp(42px,5vw,72px);line-height:.98;margin:12px 0 18px;letter-spacing:-.055em}.hero h1 em{font-style:normal;background:linear-gradient(90deg,var(--pink),var(--purple),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{max-width:530px;color:#b7bfd2;font-size:16px;line-height:1.6}.hero img{width:280px;aspect-ratio:1;object-fit:cover;border-radius:50%;z-index:1;box-shadow:0 0 70px #6c2bff88}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.18em;color:#aa91ff}.cta{display:flex;gap:8px;align-items:center;margin-top:22px;border:0;border-radius:9px;padding:12px 19px;background:linear-gradient(90deg,var(--purple),#9c42ff);font-weight:750;box-shadow:0 9px 28px #6c2bff55}.cta svg{width:17px}.section-title{display:flex;align-items:end;justify-content:space-between;margin:35px 2px 17px}.section-title h2{margin:5px 0 0;font-size:24px}.section-title button{border:0;background:transparent;color:#a994ff;font-size:12px}.card-grid,.skeleton-grid{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr));gap:15px}.track-card{border:0;border-radius:14px;background:#0e153088;padding:11px;text-align:left;transition:.2s}.track-card:hover{transform:translateY(-4px);background:#141d3e}.art-wrap{display:block;position:relative}.track-card img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px}.track-card strong,.track-card>span:last-child{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-card strong{margin:10px 2px 4px;font-size:14px}.track-card>span:last-child{margin:0 2px 5px;color:var(--muted);font-size:12px}.card-play{position:absolute;right:9px;bottom:9px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--purple);opacity:0;transition:.2s}.track-card:hover .card-play{opacity:1}.card-play svg{width:17px}.skeleton-grid i{height:190px;border-radius:14px;background:#141d3e}.lower-grid{display:grid;grid-template-columns:2fr 1fr;gap:24px}.track-list{background:#0e153066;border:1px solid #ffffff0b;border-radius:14px;padding:4px 14px}.track-list button{display:grid;grid-template-columns:28px 42px 1fr 90px 44px 25px;align-items:center;gap:10px;width:100%;padding:9px 6px;border:0;border-bottom:1px solid #ffffff0a;background:transparent;text-align:left}.track-list img{width:40px;height:40px;border-radius:6px;object-fit:cover}.track-list strong,.track-list small{display:block}.track-list small,.track-list>button>span:first-child,.track-list em,.track-list time{color:var(--muted);font-size:11px;font-style:normal}.scene{margin-top:35px;padding:32px;border:1px solid #00ddf933;border-radius:18px;background:linear-gradient(145deg,#00ddf912,#6c2bff20),url(/assets/artwork/moods/night-drive.png) center/cover}.scene p{color:#c1c8d9}.scene-stats{display:flex;gap:25px;margin:25px 0}.scene-stats span{font-size:10px;color:#bac2d2}.scene-stats strong{display:block;color:#fff;font-size:18px}.player{position:fixed;z-index:20;bottom:0;left:0;right:0;height:92px;display:grid;grid-template-columns:1fr minmax(330px,1.3fr) 1fr;align-items:center;padding:10px 24px;border-top:1px solid #ffffff18;background:#080d20ed;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.empty-player{display:flex;justify-content:center;color:var(--muted);font-size:13px}.now{display:flex;align-items:center;gap:12px}.now img{width:58px;height:58px;object-fit:cover;border-radius:8px}.now strong,.now small{display:block}.now small{color:var(--muted);margin-top:4px}.transport{text-align:center}.transport>div{display:flex;justify-content:center;align-items:center;gap:17px}.transport button{border:0;background:transparent}.transport .main-play{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--purple),var(--pink))}.timeline{display:grid;grid-template-columns:32px 1fr 32px;gap:8px;align-items:center;font-size:9px;color:var(--muted)}input[type=range]{height:3px;accent-color:#8b5cf6}.volume{display:flex;justify-content:flex-end;align-items:center;gap:9px}.volume input{width:90px}@media(max-width:1050px){.card-grid,.skeleton-grid{grid-template-columns:repeat(3,1fr)}.hero{padding:35px}.hero img{width:210px}.lower-grid{grid-template-columns:1fr}}@media(max-width:720px){.app-shell{display:block;padding-bottom:140px}.sidebar{z-index:21;inset:auto 0 0;width:auto;height:64px;padding:7px;border:0;border-top:1px solid #ffffff14}.sidebar .logo,.sidebar .nav-title,.sidebar nav:nth-of-type(2),.premium{display:none}.sidebar nav:first-of-type{display:grid;grid-template-columns:repeat(5,1fr);overflow:visible}.sidebar nav:first-of-type button{display:grid;gap:2px;justify-items:center;min-width:0;padding:5px;font-size:9px}.sidebar nav:first-of-type button:nth-child(n+6){display:none}.sidebar nav button.active{box-shadow:none}main{padding:14px}header{margin-bottom:12px}.search{width:100%}.hero{min-height:330px;padding:28px 24px}.hero img{position:absolute;right:-45px;bottom:-40px;width:210px;opacity:.45}.hero h1{font-size:45px}.card-grid,.skeleton-grid{grid-template-columns:repeat(2,1fr)}.lower-grid{display:block}.track-list button{grid-template-columns:23px 40px 1fr 40px}.track-list em,.track-list time{display:none}.player{bottom:64px;height:76px;grid-template-columns:1fr auto;padding:8px 14px}.now img{width:48px;height:48px}.now svg,.timeline,.volume,.transport button:first-child,.transport button:last-child{display:none}.transport .main-play{display:grid}}.home-heading{display:flex;align-items:center;justify-content:space-between;margin:8px 0 18px}.home-heading h1{margin:5px 0 0;font-size:32px;letter-spacing:-.035em}.dj-pill{display:flex;align-items:center;gap:8px;border:1px solid #8b5cf666;border-radius:999px;padding:10px 15px;background:#8b5cf615}.dj-pill svg{width:17px}.filter-chips{display:flex;gap:9px;overflow:auto;padding-bottom:4px}.filter-chips button{white-space:nowrap;border:1px solid #ffffff1c;border-radius:999px;padding:8px 15px;background:#ffffff08;color:#c5cada}.filter-chips button.selected,.filter-chips button:hover{border-color:#8b5cf688;background:#6c2bff;color:#fff}.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0 22px}.quick-grid button{position:relative;display:flex;align-items:center;gap:12px;min-width:0;padding:0 12px 0 0;border:0;border-radius:9px;overflow:hidden;background:#151c36;text-align:left}.quick-grid img{width:62px;height:62px;object-fit:cover}.quick-grid strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.quick-play{display:grid;place-items:center;width:30px;height:30px;margin-left:auto;border-radius:50%;background:#8b5cf6;opacity:0}.quick-grid button:hover .quick-play{opacity:1}.quick-play svg{width:13px}.spotlight{display:grid;grid-template-columns:minmax(180px,300px) 1fr;min-height:255px;border:1px solid #ffffff12;border-radius:18px;overflow:hidden;background:radial-gradient(circle at 85%,#00ddf926,transparent 30%),linear-gradient(120deg,#22103e,#0a1530)}.spotlight>img{width:100%;height:100%;object-fit:cover}.spotlight>div{align-self:center;padding:35px}.spotlight h2{margin:8px 0 9px;font-size:clamp(30px,4vw,50px);letter-spacing:-.04em}.spotlight p{max-width:620px;color:#bac2d4}.spotlight>div>div{display:flex;align-items:center;gap:10px}.spotlight .cta{margin-top:12px}.round-action{display:grid;place-items:center;width:42px;height:42px;margin-top:12px;border:1px solid #ffffff33;border-radius:50%;background:#ffffff0b}.round-action svg{width:18px}.home-bottom{display:grid;grid-template-columns:1fr 300px;gap:22px}.modern-list{border:1px solid #ffffff0e;border-radius:14px;background:#0e153055}.modern-list>button{display:grid;grid-template-columns:26px 48px 1fr 90px 44px 24px;align-items:center;gap:10px;width:100%;padding:9px 12px;border:0;border-bottom:1px solid #ffffff0b;background:transparent;text-align:left}.modern-list>button:hover{background:#ffffff08}.modern-list img{width:46px;height:46px;border-radius:7px;object-fit:cover}.modern-list span,.modern-list strong,.modern-list small{display:block}.modern-list small,.modern-list b,.modern-list em,.modern-list time{color:#8f99b2;font-size:11px;font-style:normal}.modern-list svg{width:15px}.daily-card{align-self:end;min-height:325px;padding:27px;border:1px solid #8b5cf633;border-radius:18px;background:linear-gradient(#10152c99,#10152cee),url(/assets/artwork/moods/night-drive.png) center/cover}.daily-card h2{font-size:28px;margin:8px 0}.daily-card p{color:#bbc3d5}.art-stack{display:flex;margin:25px 0}.art-stack img{width:72px;height:72px;margin-right:-15px;border:3px solid #10152c;border-radius:50%;object-fit:cover}.search-page h1{margin-bottom:25px}.search-page .modern-list{margin-top:25px}@media(max-width:1050px){.quick-grid{grid-template-columns:repeat(2,1fr)}.home-bottom{grid-template-columns:1fr}.daily-card{min-height:230px}}@media(max-width:720px){.home-heading{margin-top:4px}.home-heading h1{font-size:26px}.dj-pill{padding:8px 10px;font-size:11px}.quick-grid{display:flex;overflow:auto}.quick-grid button{min-width:210px}.spotlight{display:block;position:relative;min-height:270px}.spotlight>img{position:absolute;inset:0;width:100%;opacity:.38}.spotlight>div{position:relative;padding:28px}.spotlight h2{font-size:35px}.card-grid{display:flex;overflow:auto}.track-card{min-width:150px}.home-bottom{display:block}.daily-card{margin-top:20px}.modern-list>button{grid-template-columns:22px 44px 1fr 24px}.modern-list em,.modern-list time{display:none}}.feature-page{animation:page-in .35s ease}.feature-page h1{font-size:clamp(38px,5vw,66px);line-height:1;margin:10px 0 18px;letter-spacing:-.05em}.feature-page p{color:var(--muted);line-height:1.65}.ai-dj,.party-hero,.recap,.car-mode{display:flex;align-items:center;justify-content:space-between;min-height:290px;padding:45px;border:1px solid #ffffff15;border-radius:24px;background:radial-gradient(circle at 82% 50%,#ff3e9d44,transparent 28%),linear-gradient(130deg,#161146,#0b1125)}.ai-dj>svg{padding:28px;border-radius:50%;color:#d4c3ff;background:#6c2bff33;box-shadow:0 0 60px #8b5cf677}.prompt-box{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:12px 14px;border:1px solid #8b5cf666;border-radius:14px;background:#101831}.prompt-box input,.message-form input{border:0;outline:0;background:transparent;color:#fff}.prompt-box button,.message-form button,.capability-grid button{border:0;border-radius:8px;padding:10px 15px;background:linear-gradient(90deg,var(--purple),#9c42ff);font-weight:700}.success-note{padding:10px 14px;border:1px solid #30d58a55;border-radius:10px;background:#30d58a14;color:#83efba!important}.feature-columns,.social-grid,.profile-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}.feature-columns>div,.social-grid>div,.profile-grid>div{padding:26px;border:1px solid #ffffff12;border-radius:16px;background:#0e153088}.feature-columns h2{margin-top:0}.party-hero{background:linear-gradient(120deg,#111449,#23103e),url(/assets/artwork/playlist-templates/party-anthems.png) right/contain no-repeat}.avatars{padding:22px;border:1px solid #ffffff22;border-radius:999px;background:#070b18aa;font-weight:800;letter-spacing:.15em}.social-grid{grid-template-columns:1.2fr 1fr}.activity,.concert{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid #ffffff0d}.activity span:nth-child(2),.concert span{flex:1}.activity strong,.activity small,.concert strong,.concert small{display:block}.activity small,.concert small{margin-top:4px;color:var(--muted);font-size:11px}.live-dot{color:#ff5571;font-size:9px;font-weight:800}.message-preview{min-height:120px;margin:16px 0;padding:18px;border-radius:12px;background:#141d3e;color:#c7cde0}.message-form{display:flex;gap:10px;padding:9px 10px;border:1px solid #ffffff18;border-radius:10px}.message-form input{flex:1}.download-list{border:1px solid #ffffff10;border-radius:16px;background:#0e153066}.download-list>div{display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:14px;padding:11px 14px;border-bottom:1px solid #ffffff0c}.download-list img{width:48px;height:48px;object-fit:cover;border-radius:7px}.download-list strong,.download-list small{display:block}.download-list small{margin-top:4px;color:var(--muted)}.download-list button{display:flex;align-items:center;gap:7px;border:1px solid #8b5cf677;border-radius:8px;padding:9px 12px;background:#6c2bff16}.download-list button svg{width:16px}.local-files{display:flex;align-items:center;gap:20px;margin-top:22px;padding:28px;border:1px dashed #00ddf966;border-radius:16px;background:#00ddf908}.local-files div{flex:1}.local-files h2,.local-files p{margin:3px 0}.local-files .outline{cursor:pointer}.capability-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.capability-grid article{padding:25px;border:1px solid #ffffff12;border-radius:16px;background:linear-gradient(145deg,#141d3e,#0b1024)}.capability-grid article>svg{width:32px;height:32px;color:#b494ff}.capability-grid h3{margin:18px 0 8px}.capability-grid button{margin-top:12px}.car-mode{min-height:190px;margin-top:24px;padding:30px 38px;background:linear-gradient(120deg,#061329,#0e2348)}.car-mode>div{flex:1;margin-left:25px}.recap{display:block;text-align:center;padding:58px;background:radial-gradient(circle,#6c2bff55,transparent 45%),url(/assets/artwork/moods/night-drive.png) center/cover}.recap strong{font-size:32px}.recap .cta{margin:22px auto 0}.profile-grid{grid-template-columns:1fr 1.4fr}.badge{display:block;margin:10px 0;padding:12px;border:1px solid #8b5cf655;border-radius:10px;background:#8b5cf612}.player-panel{position:fixed;z-index:25;right:16px;bottom:106px;width:380px;max-height:calc(100vh - 140px);overflow:auto;padding:27px;border:1px solid #8b5cf655;border-radius:18px;background:#0a1024f5;box-shadow:0 24px 80px #000b;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}.panel-close{position:absolute;right:14px;top:14px;border:0;background:transparent}.panel-close svg{width:18px}.player-panel h2{margin:8px 0 18px}.player-panel>label{display:grid;grid-template-columns:1fr auto;gap:8px;margin:17px 0;text-transform:capitalize;color:#c6cce0}.player-panel>label input[type=range]{grid-column:1/-1;width:100%}.switch-row input{accent-color:#8b5cf6}.lyrics p{font-size:18px;color:#6e7894;transition:.25s}.lyrics p.sung{color:#fff}.lyrics small{display:block;margin-top:4px;color:#8b94aa;font-size:11px}.player-panel .outline{display:flex;align-items:center;gap:7px;margin-top:12px}.panel-queue label{display:grid;grid-template-columns:auto 42px 1fr;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #ffffff0d}.panel-queue img{width:40px;height:40px;object-fit:cover;border-radius:6px}.panel-queue span,.panel-queue small{display:block}.panel-queue small{color:var(--muted);font-size:11px}.timer-row{display:flex;align-items:center;gap:8px;margin-top:22px}.timer-row button{border:1px solid #8b5cf666;border-radius:7px;background:#ffffff08;padding:6px 10px}.volume button{display:grid;place-items:center;border:0;background:transparent}.volume label{display:flex;align-items:center;gap:8px}.danger{color:#ff8397;border-color:#ff557155!important}select{padding:9px;border:1px solid #ffffff18;border-radius:8px;background:#101831;color:#fff}@keyframes page-in{0%{opacity:0;transform:translateY(8px)}}@media(max-width:900px){.feature-columns,.capability-grid{grid-template-columns:1fr 1fr}.social-grid,.profile-grid{grid-template-columns:1fr}.ai-dj>svg{display:none}.car-mode{align-items:flex-start}.car-mode>.cta{display:none}}@media(max-width:720px){.app-shell>.sidebar nav:first-of-type{overflow-x:auto;justify-content:flex-start}.feature-columns,.capability-grid{grid-template-columns:1fr}.ai-dj,.party-hero,.recap,.car-mode{padding:27px;min-height:250px}.avatars{display:none}.prompt-box{grid-template-columns:auto 1fr}.prompt-box button{grid-column:1/-1}.player-panel{right:8px;left:8px;bottom:84px;width:auto}.download-list>div{grid-template-columns:42px 1fr}.download-list button{grid-column:2}.local-files{align-items:flex-start;flex-wrap:wrap}.car-mode>div{margin-left:14px}}.collab,.taste-controls{display:flex;align-items:center;gap:22px;margin-top:20px;padding:25px;border:1px solid #ffffff12;border-radius:16px;background:#0e153077}.collab>div:first-child,.taste-controls>div{flex:1}.playlist-note{font-style:italic}.collab-people{color:#b5a1ff;font-size:12px}.media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px}.media-grid article{min-height:245px;padding:26px;border:1px solid #ffffff12;border-radius:16px;background:linear-gradient(145deg,#121a38,#090f22)}.media-grid article label{display:grid;gap:7px;margin:12px 0;color:#b9c0d3;font-size:12px}.media-grid .video-card{background:linear-gradient(#0b102477,#0b1024ee),url(/assets/artwork/playlist-templates/acoustic-sessions.png) center/cover}.media-grid .outline svg{width:15px}.active-snooze{border-color:#30d58a!important;color:#8ef0bd}@media(max-width:900px){.media-grid{grid-template-columns:1fr 1fr}}@media(max-width:720px){.media-grid{grid-template-columns:1fr}.collab,.taste-controls{align-items:flex-start;flex-direction:column}}