:root{--bg:#0d0f15;--panel:#171a23;--panel2:#202431;--text:#f5f7fb;--muted:#9da5b5;--line:#2c3241;--accent:#ffe13b;--accent2:#b7ff4a;--danger:#ff6b77;--radius:22px}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 15% 0,#252015 0,transparent 30%),var(--bg);color:var(--text);font:16px/1.45 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;min-height:100vh}.hidden{display:none!important}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:auto;padding:0 24px}.brand{display:flex;align-items:center;gap:11px;color:var(--text);text-decoration:none;font-size:18px}.brand b{color:var(--accent)}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--accent);color:#111;font-weight:900;transform:rotate(-4deg)}.badge{border:1px solid var(--line);border-radius:999px;padding:7px 12px;color:var(--muted);font-size:13px}main{max-width:1200px;margin:auto;padding:42px 24px 90px}.hero{min-height:70vh;display:grid;grid-template-columns:1.2fr .8fr;gap:72px;align-items:center}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--accent);font-size:12px;font-weight:800;margin:0 0 14px}.hero h1,.room-head h1{font-size:clamp(40px,7vw,78px);line-height:.98;letter-spacing:-.055em;margin:0;max-width:850px}.lead{font-size:20px;color:var(--muted);max-width:680px;margin:25px 0 34px}.steps{display:flex;flex-wrap:wrap;gap:12px}.steps span{background:#151820;border:1px solid var(--line);border-radius:999px;padding:9px 14px;color:#cbd0da}.steps b{color:var(--accent);margin-right:6px}.panel{background:linear-gradient(145deg,#1a1d27,#141720);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 28px 90px #0005}.create-card,.add-panel,.result-panel,.members-panel{padding:28px}.panel h2{margin:0 0 22px;font-size:22px;letter-spacing:-.02em}label{display:block;color:#c9cfda;font-size:14px;margin:15px 0}input,textarea{width:100%;margin-top:7px;background:#0f1118;border:1px solid #333948;border-radius:13px;color:var(--text);padding:13px 14px;font:inherit;outline:none}input:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #ffe13b18}textarea{resize:vertical}.primary,.secondary{border:0;border-radius:13px;padding:13px 17px;font:inherit;font-weight:800;cursor:pointer}.primary{width:100%;background:var(--accent);color:#111;margin-top:12px}.primary:hover{background:#fff06b}.primary:disabled{opacity:.55;cursor:wait}.secondary{background:var(--panel2);color:var(--text);border:1px solid var(--line)}.fine,.muted{color:var(--muted);font-size:14px}.fine{margin:16px 0 0}.room-head{display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:34px}.room-head h1{font-size:clamp(38px,5vw,65px)}.share-box{display:flex;gap:8px;min-width:min(100%,420px)}.share-box input{margin:0}.room-grid{display:grid;grid-template-columns:390px 1fr;gap:22px}.or{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;margin:18px 0}.or:before,.or:after{content:"";height:1px;background:var(--line);flex:1}details{border-top:1px solid var(--line);padding-top:12px}summary{cursor:pointer;color:#d6dbe5}.file-label{border:1px dashed #41495b;border-radius:13px;padding:12px;text-align:center;cursor:pointer}.file-label input{display:none}.status{margin-top:15px;padding:12px;border-radius:12px;background:#263224;color:#d7ffd1}.status.error{background:#392026;color:#ffd4d8}.result-head{display:flex;justify-content:space-between;align-items:start;gap:15px}.result-head h2{margin-bottom:3px}.threshold{background:#10131a;border:1px solid var(--line);border-radius:16px;padding:16px;margin:18px 0}.threshold>div{display:flex;justify-content:space-between}.threshold strong{color:var(--accent)}input[type=range]{padding:0;accent-color:var(--accent);border:0}.text-button{background:none;border:0;color:var(--accent);padding:4px 0;cursor:pointer}.track-list{list-style:none;padding:0;margin:0;max-height:650px;overflow:auto}.track-list li{display:grid;grid-template-columns:38px 1fr auto;gap:12px;align-items:center;padding:12px 7px;border-bottom:1px solid #272c38}.track-num{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#222735;color:var(--muted);font-size:12px}.track-title{font-weight:700}.track-artists{font-size:13px;color:var(--muted)}.track-hit{color:var(--accent2);font-size:12px;white-space:nowrap}.track-link{color:inherit;text-decoration:none}.track-link:hover .track-title{text-decoration:underline}.empty{text-align:center;color:var(--muted);padding:60px 15px}.members-panel{margin-top:22px}.counter{background:var(--accent);color:#111;border-radius:999px;padding:7px 13px;font-weight:900}.member-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}.member{background:#11141c;border:1px solid var(--line);border-radius:15px;padding:15px}.member strong,.member span{display:block}.member span{color:var(--muted);font-size:13px;margin-top:4px}.member-actions{display:flex;align-items:center;justify-content:space-between;margin-top:10px}.member a{color:var(--accent);font-size:12px}.delete-button{border:0;background:none;color:var(--danger);cursor:pointer}.toast{position:fixed;right:20px;bottom:20px;background:#f5f7fb;color:#111;border-radius:13px;padding:12px 17px;font-weight:700;box-shadow:0 20px 60px #0008}footer{text-align:center;padding:28px;color:#687080;font-size:13px}@media(max-width:900px){.hero,.room-grid{grid-template-columns:1fr}.hero{gap:35px}.room-head{display:block}.share-box{margin-top:22px}.create-card{max-width:600px}.result-panel{min-height:420px}}@media(max-width:560px){main{padding:25px 14px 65px}.topbar{padding:0 14px}.badge{display:none}.hero h1{font-size:43px}.room-head h1{font-size:39px}.create-card,.add-panel,.result-panel,.members-panel{padding:20px}.share-box{display:block}.share-box button{width:100%;margin-top:8px}.result-head{align-items:center}.track-list li{grid-template-columns:32px 1fr}.track-hit{grid-column:2}.steps{display:grid}.room-grid{gap:14px}}