@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap";@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap";.brand-mark{background:linear-gradient(135deg,#7c3aed,#2563eb 58%,#06b6d4)}.brand>span:last-child span,.hero h1 span{background:linear-gradient(90deg,#a78bfa,#60a5fa 55%,#67e8f9);color:#0000;-webkit-background-clip:text}.spotify-device-panel{background:linear-gradient(115deg,#151b36,#151625 60%,#151b2a);border-color:#3b82f655}.now-playing-panel{background:linear-gradient(120deg,#211c3c,#151827 55%,#14202a)}.transport button:disabled,.play-row-button:disabled{opacity:.35;cursor:not-allowed}.spotify-connect-panel,.spotify-device-panel{background:linear-gradient(115deg,#123b28,#15201b 55%,#171621);border:1px solid #22c55e44;border-radius:22px;align-items:center;gap:18px;margin-bottom:18px;padding:20px;display:flex}.spotify-connect-panel>div:nth-child(2){flex:1}.spotify-connect-panel h2,.spotify-device-panel h3{margin:4px 0;font-family:Manrope}.spotify-connect-panel p{color:var(--muted);margin:0}.spotify-connect-panel small{color:#4ade80;letter-spacing:.12em;font-weight:800}.spotify-icon{color:#07130b;background:#1ed760;border-radius:18px;place-items:center;width:62px;height:62px;display:grid}.spotify-icon svg{width:31px;height:31px}.spotify-button{color:#061109;background:#1ed760}.spotify-device-panel select{color:#fff;background:#0e0e16;border:1px solid #343344;border-radius:12px;flex:1;min-width:210px;padding:12px}.track-image{object-fit:cover;border-radius:11px;flex:none;width:45px;height:45px}.play-row-button{color:#061109;cursor:pointer;background:#1ed760;border:0;border-radius:50%;place-items:center;width:35px;height:35px;display:grid}.play-row-button:disabled{opacity:.35;cursor:not-allowed}.play-row-button svg{width:16px}@media (width<=700px){.spotify-connect-panel,.spotify-device-panel{flex-direction:column;align-items:stretch}.spotify-connect-panel .spotify-button,.spotify-device-panel select{width:100%}}:root{--bg:#090910;--panel:#13131d;--panel2:#191925;--text:#f8f7fb;--muted:#9c9bab;--line:#292838;--purple:#8b5cf6;--pink:#ec4899;--cyan:#22d3ee;--success:#34d399;--danger:#fb7185;--shadow:0 28px 80px #00000061}*{box-sizing:border-box}html{background:var(--bg);color:var(--text);font-family:DM Sans,sans-serif}body{background:radial-gradient(circle at 10% -10%,#8b5cf62b,transparent 33%),radial-gradient(circle at 95% 15%,#ec48991f,transparent 28%),var(--bg);min-width:320px;margin:0}button,input,select{font:inherit}.app-shell{min-height:100vh;position:relative;overflow:hidden}.ambient{filter:blur(90px);opacity:.11;pointer-events:none;border-radius:999px;position:fixed}.ambient-one{background:var(--purple);width:420px;height:420px;top:20%;left:-250px}.ambient-two{background:var(--pink);width:360px;height:360px;top:55%;right:-220px}.topbar{z-index:10;justify-content:space-between;align-items:center;max-width:1240px;height:78px;margin:auto;padding:0 28px;display:flex;position:relative}.brand{color:var(--text);align-items:center;gap:11px;font-family:Manrope;font-size:20px;font-weight:800;text-decoration:none;display:flex}.brand>span:last-child span{color:#b79aff}.brand-mark{background:linear-gradient(135deg,var(--purple),var(--pink));border-radius:13px;place-items:center;width:40px;height:40px;display:grid;box-shadow:0 10px 28px #8b5cf659}.top-actions{gap:8px;display:flex}.icon-link{color:#cbc9d6;border-radius:12px;align-items:center;gap:8px;padding:10px 13px;text-decoration:none;display:flex}.icon-link:hover{color:#fff;background:#ffffff0b}.button-reset{cursor:pointer;background:0 0;border:0}.page-wrap{z-index:1;max-width:1240px;margin:auto;padding:34px 28px 90px;position:relative}.footer{text-align:center;color:#656473;padding:30px;font-size:13px}.hero{grid-template-columns:1.05fr .95fr;align-items:center;gap:72px;min-height:650px;display:grid}.eyebrow{text-transform:uppercase;letter-spacing:.14em;color:#bda8ff;align-items:center;gap:8px;font-size:12px;font-weight:700;display:flex}.hero h1,.dashboard-head h1,.party-header h1,.join-card h1,.guest-header h1{margin:18px 0;font-family:Manrope;font-weight:800;line-height:1.03}.hero h1{letter-spacing:-.055em;font-size:clamp(48px,6vw,76px)}.hero h1 span{background:linear-gradient(90deg,#b99cff,#f391c9);color:#0000;-webkit-background-clip:text}.hero-lede{color:#aaa8b8;max-width:650px;font-size:20px;line-height:1.65}.hero-actions{gap:14px;margin:34px 0;display:flex}.btn{cursor:pointer;border:1px solid #0000;border-radius:13px;justify-content:center;align-items:center;gap:9px;padding:12px 17px;font-weight:700;text-decoration:none;transition:all .2s;display:inline-flex}.btn:hover{transform:translateY(-1px)}.btn-primary{color:#fff;background:linear-gradient(135deg,var(--purple),#a855f7 55%,var(--pink));box-shadow:0 12px 30px #8b5cf645}.btn-secondary{border-color:var(--line);color:#e8e7ef;background:#ffffff09}.btn-lg{border-radius:15px;padding:15px 22px}.btn-block{width:100%}.trust-row{color:#858493;flex-wrap:wrap;gap:24px;font-size:14px;display:flex}.trust-row span{align-items:center;gap:8px;display:flex}.hero-visual{padding:40px;position:relative}.player-card{box-shadow:var(--shadow);background:linear-gradient(#1b1a28,#11111a);border:1px solid #ffffff14;border-radius:30px;padding:22px;transform:rotate(1deg)}.player-top{letter-spacing:.12em;color:#aaa8b8;align-items:center;gap:8px;font-size:11px;display:flex}.player-top span:last-child{letter-spacing:0;text-transform:none;margin-left:auto}.live-dot{background:var(--success);border-radius:50%;width:8px;height:8px;display:inline-block;box-shadow:0 0 0 5px #34d3991c}.album-art{background:linear-gradient(135deg,#312e81,#7c3aed 46%,#db2777);border-radius:22px;place-items:center;height:260px;margin:20px 0;display:grid;overflow:hidden}.vinyl{background:repeating-radial-gradient(circle,#171724 0 5px,#222033 6px 9px);border-radius:50%;place-items:center;width:190px;height:190px;display:grid;box-shadow:0 20px 50px #0008}.vinyl div{background:linear-gradient(135deg,#f472b6,#8b5cf6);border:8px solid #181722;border-radius:50%;width:55px;height:55px}.song-meta{text-align:center}.song-meta small,.now-copy small,.guest-now small{color:#a78bfa;letter-spacing:.13em;font-size:11px;font-weight:800}.song-meta h3{margin:5px 0;font-family:Manrope;font-size:25px}.song-meta p{color:var(--muted);margin:0}.progress{background:#302f40;border-radius:9px;height:4px;margin:20px 0}.progress span{background:linear-gradient(90deg,var(--purple),var(--pink));border-radius:9px;width:43%;height:100%;display:block}.player-controls{justify-content:center;align-items:center;gap:20px;display:flex}.player-controls button,.transport button{color:#b8b6c4;cursor:pointer;background:0 0;border:0}.player-controls .play,.transport .transport-main{color:#fff;background:linear-gradient(135deg,var(--purple),var(--pink));border-radius:50%;place-items:center;width:52px;height:52px;display:grid}.up-next{border-top:1px solid var(--line);margin-top:21px;padding-top:10px}.up-next>div{align-items:center;gap:11px;padding:10px 0;display:flex}.up-next div div{flex-direction:column;flex:1;display:flex}.up-next small{color:var(--muted)}.up-next b{color:#bda8ff}.queue-number{color:#757382}.floating-chip{box-shadow:var(--shadow);background:#20202d;border:1px solid #ffffff18;border-radius:14px;align-items:center;gap:9px;padding:12px 15px;font-size:14px;font-weight:600;display:flex;position:absolute}.chip-one{top:155px;left:0}.chip-two{bottom:105px;right:0}.steps-section{padding:80px 0}.section-heading{text-align:center;max-width:680px;margin:0 auto 38px}.section-heading .eyebrow{justify-content:center}.section-heading h2,.queue-section h2,.guest-queue h2{margin:12px;font-family:Manrope;font-size:36px}.steps-grid{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.steps-grid article{border:1px solid var(--line);background:#ffffff06;border-radius:21px;padding:28px;position:relative}.steps-grid article>span{color:#403e50;font-family:Manrope;font-size:28px;font-weight:800;position:absolute;top:17px;right:22px}.steps-grid svg{color:#ac8cff;width:30px;height:30px}.steps-grid h3{font-family:Manrope;font-size:20px}.steps-grid p,.muted{color:var(--muted);line-height:1.6}.modal-backdrop{z-index:100;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);background:#050509d9;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal-card{width:min(460px,100%);box-shadow:var(--shadow);background:#171620;border:1px solid #ffffff17;border-radius:24px;padding:30px;position:relative}.modal-card h2{margin:12px 0 3px;font-family:Manrope;font-size:28px}.modal-close{color:#bbb9c6;cursor:pointer;background:#ffffff09;border:0;border-radius:10px;padding:7px;position:absolute;top:18px;right:18px}.form-stack{gap:16px;margin-top:24px;display:grid}.form-stack label{color:#d7d5df;gap:8px;font-size:14px;font-weight:600;display:grid}.form-stack input,.form-stack select{color:#fff;background:#0e0e16;border:1px solid #302f3e;border-radius:12px;outline:none;width:100%;padding:13px 14px}.form-stack input:focus,.form-stack select:focus{border-color:#8b5cf6;box-shadow:0 0 0 4px #8b5cf61f}.text-button{color:#aa8cf8;cursor:pointer;background:0 0;border:0;width:100%;margin-top:18px}.error-box,.toast-message{color:#fda4af;background:#fb718519;border:1px solid #fb71853b;border-radius:11px;padding:11px 13px;font-size:14px}.dashboard-head,.party-header,.guest-header{justify-content:space-between;align-items:end;gap:20px;margin-bottom:35px;display:flex}.dashboard-head h1,.party-header h1,.guest-header h1{margin:10px 0;font-size:38px}.empty-state{text-align:center;color:var(--muted);border:1px dashed #343242;border-radius:22px;padding:60px}.empty-state.large{padding:90px 20px}.empty-state h2{color:#fff;font-family:Manrope}.empty-icon{color:#a78bfa;background:#8b5cf61c;border-radius:20px;place-items:center;width:62px;height:62px;margin:auto;display:grid}.party-grid{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.party-tile{text-align:left;color:#fff;border:1px solid var(--line);cursor:pointer;background:linear-gradient(145deg,#181722,#111119);border-radius:21px;padding:22px}.party-tile:hover{border-color:#8b5cf677;transform:translateY(-2px)}.party-tile-top,.party-stats,.party-open,.section-row{justify-content:space-between;align-items:center;display:flex}.party-code{letter-spacing:.1em;color:#aaa8b8;font-family:monospace}.party-tile h3{margin:28px 0;font-family:Manrope;font-size:23px}.party-stats{color:#908e9e;justify-content:flex-start;gap:20px;font-size:13px}.party-stats span{align-items:center;gap:6px;display:flex}.party-stats svg{width:16px}.party-open{border-top:1px solid var(--line);color:#b99cff;margin-top:20px;padding-top:17px}.status-pill{text-transform:uppercase;letter-spacing:.09em;color:#aaa8b8;background:#ffffff0c;border-radius:99px;padding:6px 9px;font-size:11px}.status-pill.active,.status-pill.queued{color:#6ee7b7;background:#34d39914}.switch-row{border:1px solid var(--line);border-radius:13px;align-items:center;padding:13px;gap:12px!important;display:flex!important}.switch-row input{width:18px!important}.switch-row span{flex-direction:column;display:flex}.switch-row small{color:var(--muted);font-weight:400}.modal-actions{justify-content:flex-end;gap:10px;display:flex}.join-wrap{place-items:center;min-height:680px;display:grid}.join-card{text-align:center;border:1px solid var(--line);width:min(480px,100%);box-shadow:var(--shadow);background:#15151f;border-radius:28px;padding:40px}.join-card .eyebrow{justify-content:center}.join-logo{background:linear-gradient(135deg,var(--purple),var(--pink));border-radius:22px;place-items:center;width:68px;height:68px;margin:0 auto 24px;display:grid}.code-input{text-align:center;text-transform:uppercase;letter-spacing:.25em;font-family:monospace!important;font-size:23px!important}.host-layout{grid-template-columns:minmax(0,1fr) 315px;gap:24px;display:grid}.header-actions{gap:10px;display:flex}.now-playing-panel{background:linear-gradient(120deg,#25203e,#171624 55%,#24172a);border:1px solid #ffffff14;border-radius:22px;grid-template-columns:88px 1fr auto;align-items:center;gap:20px;padding:21px;display:grid}.now-art{background:linear-gradient(135deg,var(--purple),var(--pink));border-radius:18px;place-items:center;width:88px;height:88px;display:grid}.now-art svg{width:40px;height:40px}.now-copy h2{margin:5px 0;font-family:Manrope}.now-copy p{color:var(--muted);margin:0}.transport{align-items:center;gap:12px;display:flex}.transport button{padding:10px}.flip{transform:scaleX(-1)}.queue-section{margin-top:35px}.section-row h2{margin:0;font-size:27px}.section-row p{margin:4px 0}.demo-badge{color:#f0abfc;background:#d946ef16;border:1px solid #d946ef35;border-radius:99px;padding:7px 11px;font-size:12px}.empty-queue{text-align:center;color:var(--muted);border:1px dashed #353344;border-radius:18px;padding:65px 20px}.empty-queue svg{color:#7c6ea5;width:36px;height:36px}.empty-queue h3{color:#fff}.queue-list{gap:9px;margin-top:16px;display:grid}.queue-row{border:1px solid var(--line);background:#ffffff05;border-radius:15px;align-items:center;gap:13px;padding:12px;display:flex}.queue-index{text-align:center;color:#747281;width:25px}.track-art{background:linear-gradient(135deg,#393263,#763f76);border-radius:11px;flex:none;place-items:center;width:45px;height:45px;font-family:Manrope;font-weight:800;display:grid}.track-copy{flex-direction:column;flex:1;min-width:0;display:flex}.track-copy strong{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.track-copy span{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.vote-count{color:#bfa7ff;font-weight:700}.danger-icon,.add-button,.vote-button{cursor:pointer;border:0}.danger-icon{color:#8b8997;background:0 0;padding:7px}.danger-icon:hover{color:var(--danger)}.qr-panel,.guest-panel,.mini-stats{border:1px solid var(--line);background:#ffffff05;border-radius:20px;padding:20px}.qr-panel{text-align:center}.qr-panel .eyebrow{justify-content:center}.qr-panel img{border-radius:14px;width:100%;margin:16px 0}.big-code{letter-spacing:.22em;font-family:monospace;font-size:29px;font-weight:800}.qr-panel p{color:var(--muted);font-size:12px}.mini-stats{grid-template-columns:1fr 1fr;margin:14px 0;padding:0;display:grid}.mini-stats div{align-items:center;gap:10px;padding:18px;display:flex}.mini-stats div+div{border-left:1px solid var(--line)}.mini-stats svg{color:#a78bfa}.mini-stats span{color:var(--muted);flex-direction:column;font-size:12px;display:flex}.mini-stats b{color:#fff;font-size:19px}.guest-chip{align-items:center;gap:9px;padding:9px 0;display:flex}.guest-chip span,.guest-avatar{color:#c4b5fd;background:#8b5cf62b;border-radius:50%;place-items:center;width:34px;height:34px;font-weight:800;display:grid}.guest-layout{max-width:800px;margin:auto}.guest-header{align-items:center}.guest-avatar{width:48px;height:48px}.guest-header p{color:var(--muted)}.guest-now{background:linear-gradient(110deg,#282043,#171621);border:1px solid #ffffff12;border-radius:18px;align-items:center;gap:16px;padding:16px;display:flex}.pulse-art{background:linear-gradient(135deg,var(--purple),var(--pink));border-radius:15px;place-items:center;width:62px;height:62px;display:grid}.guest-now h3{margin:4px 0}.guest-now p{color:var(--muted);margin:0;font-size:13px}.search-panel{margin-top:24px}.search-box{background:#171721;border:1px solid #353345;border-radius:16px;align-items:center;gap:11px;padding:6px 7px 6px 15px;display:flex}.search-box input{color:#fff;background:0 0;border:0;outline:none;flex:1;min-width:0;padding:10px}.search-box button{color:#fff;background:#8b5cf6;border:0;border-radius:11px;padding:10px 15px;font-weight:700}.search-results{gap:7px;margin-top:14px;display:grid}.search-results article{border-radius:14px;align-items:center;gap:12px;padding:10px;display:flex}.search-results article:hover{background:#ffffff05}.duration{color:#777584;align-items:center;gap:5px;font-size:12px;display:flex}.duration svg{width:14px}.add-button{color:#fff;background:#8b5cf6;border-radius:11px;place-items:center;width:36px;height:36px;display:grid}.explicit{background:#4d4b58;border-radius:3px;padding:2px 4px;color:#ddd!important;font-size:9px!important}.toast-message{color:#c4b5fd;background:#8b5cf617;border-color:#8b5cf638}.guest-queue{margin-top:35px}.empty-queue.compact{padding:35px}.vote-button{color:#c4b5fd;background:#8b5cf616;border-radius:10px;align-items:center;gap:6px;padding:8px 10px;display:flex}.vote-button svg{width:16px}@media (width<=900px){.hero{grid-template-columns:1fr}.hero-copy{text-align:center}.hero-lede{margin:auto}.hero-actions,.trust-row{justify-content:center}.hero-visual{max-width:580px;margin:auto}.steps-grid,.party-grid,.host-layout{grid-template-columns:1fr}.host-side{grid-template-columns:1fr 1fr;gap:14px;display:grid}.qr-panel{grid-row:span 2}.guest-panel,.mini-stats{margin:0}.dashboard-head,.party-header{align-items:flex-start}}@media (width<=640px){.page-wrap{padding:22px 17px 70px}.topbar{padding:0 17px}.icon-link{font-size:0}.hero{gap:15px;min-height:auto;padding-top:40px}.hero h1{font-size:46px}.hero-actions{flex-direction:column}.hero-visual{padding:18px 0}.floating-chip{display:none}.album-art{height:210px}.steps-section{padding:70px 0}.dashboard-head,.party-header,.guest-header{flex-direction:column;align-items:flex-start}.header-actions{width:100%}.header-actions .btn{flex:1;font-size:12px}.now-playing-panel{grid-template-columns:66px 1fr}.now-art{width:66px;height:66px}.transport{border-top:1px solid var(--line);grid-column:1/-1;justify-content:center;padding-top:14px}.host-side{display:block}.qr-panel,.mini-stats,.guest-panel{margin-bottom:14px}.queue-row .status-pill{display:none}.vote-count{font-size:12px}.join-card{padding:29px 20px}.modal-card{padding:24px 19px}.search-box button{padding:10px}.duration{display:none}.footer{padding:20px 15px}.trust-row{gap:13px;font-size:12px}}