:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#f7f8ff;background:#070b18;font-synthesis:none;--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}.app-shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh;padding-bottom:92px}.app-shell>.sidebar{position:fixed;inset:0 auto 92px 0;width:240px;padding:28px 20px;border-right:1px solid #ffffff12;background:#070b18dd;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.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}}