:root{--bg:#08090c;--panel:#101218;--text:#f4f5f7;--muted:#9ca3af;--line:#242833;--accent:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 50% -10%,#171a22 0,#08090c 42%);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}header{position:sticky;top:0;z-index:10;background:rgba(8,9,12,.82);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.06)}nav{max-width:1120px;margin:auto;min-height:68px;padding:0 22px;display:flex;align-items:center;gap:28px}.brand{font-size:22px;font-weight:800;letter-spacing:.08em}.navlinks{display:flex;gap:22px;margin-left:auto}.navlinks a,.footerlinks a{color:var(--muted);font-size:14px}.navlinks a:hover,.footerlinks a:hover{color:var(--text)}.invite,.btn{border:1px solid var(--line);border-radius:12px;padding:10px 16px;font-weight:700;font-size:14px}.invite,.primary{background:var(--text);color:#08090c;border-color:var(--text)}main{max-width:1120px;margin:auto;padding:0 22px}.hero{min-height:650px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.eyebrow{font-size:12px;letter-spacing:.18em;color:#8f96a3;margin-bottom:16px}.hero h1{font-size:clamp(72px,14vw,150px);line-height:.9;margin:0 0 25px;letter-spacing:-.08em}.hero p{max-width:620px;color:var(--muted);font-size:19px}.actions{display:flex;gap:12px;margin-top:24px}.secondary{background:var(--panel)}section{padding:90px 0}.sectionhead{display:flex;align-items:baseline;gap:15px;margin-bottom:28px}.sectionhead span{color:#6b7280;font-size:13px}.sectionhead h2{font-size:36px;margin:0;letter-spacing:-.04em}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.grid article,.feature{background:rgba(16,18,24,.8);border:1px solid var(--line);border-radius:18px;padding:26px}.grid h3,.feature h3{margin:0 0 8px;font-size:20px}.grid p,.feature p{margin:0;color:var(--muted)}.feature{display:flex;justify-content:space-between;align-items:center;gap:24px}.status{font-size:13px;color:var(--muted);white-space:nowrap}.status strong{color:#d1d5db;margin-left:5px}.footerlinks{display:flex;gap:24px;border-top:1px solid var(--line);padding:30px 0 50px}footer{border-top:1px solid rgba(255,255,255,.06);padding:25px 22px;color:#6b7280;text-align:center;font-size:12px}@media(max-width:700px){nav{gap:12px}.navlinks{display:none}.invite{margin-left:auto}.hero{min-height:570px}.hero p{font-size:17px}.grid{grid-template-columns:1fr}.feature{align-items:flex-start;flex-direction:column}.actions{flex-direction:column;width:100%}.btn{text-align:center}}

.spotify-import{margin-top:22px}.uploadbox{display:flex;flex-direction:column;gap:7px;border:1px dashed rgba(255,255,255,.24);border-radius:14px;padding:20px;cursor:pointer;background:rgba(255,255,255,.025);transition:.2s}.uploadbox:hover{border-color:rgba(255,255,255,.48);background:rgba(255,255,255,.045)}.uploadtitle{font-weight:700}.uploadhint{font-size:.9rem;opacity:.62;margin-bottom:8px}.privacy-note{font-size:.78rem;opacity:.55;margin-top:9px}.history-result{margin-top:18px;border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:18px;background:rgba(255,255,255,.025)}.history-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:16px}.history-head span{font-size:.78rem;opacity:.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.history-stats div{border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:12px}.history-stats strong,.history-stats span{display:block}.history-stats strong{font-size:1.05rem}.history-stats span{font-size:.72rem;opacity:.55;margin-top:3px}.history-period{font-size:.78rem;opacity:.55;margin:14px 0}.history-columns{display:grid;grid-template-columns:1fr 1fr;gap:22px}.history-columns h4{margin:0 0 9px}.history-columns ol{margin:0;padding-left:20px}.history-columns li{padding:6px 0;display:flex;justify-content:space-between;gap:12px}.history-columns li span{min-width:0}.history-columns small{display:block;opacity:.5;margin-top:2px}.history-columns b{font-size:.75rem;white-space:nowrap}.history-loading,.history-error{padding:10px 0;opacity:.7}@media(max-width:700px){.history-stats{grid-template-columns:repeat(2,1fr)}.history-columns{grid-template-columns:1fr}.history-head{align-items:flex-start;flex-direction:column}}

.account-actions{display:flex;align-items:center;gap:8px;margin-left:auto;margin-right:12px}.account-btn{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:inherit;border-radius:10px;padding:9px 12px;font:inherit;cursor:pointer}.secondary-account{opacity:.75}.account-user{font-size:.88rem;opacity:.9;white-space:nowrap}.spotify-account-box{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:16px;margin-bottom:14px;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:rgba(255,255,255,.035)}.spotify-account-box strong{width:100%}.spotify-account-box span{flex:1;min-width:220px;opacity:.78}.history-sync{margin-top:16px;padding:12px;border-radius:10px;border:1px solid rgba(87,242,135,.25);background:rgba(87,242,135,.07)}
@media(max-width:900px){.account-actions{order:3;width:100%;margin:10px 0 0}.account-user{flex:1}.navlinks{flex-wrap:wrap}}