:root{--bg:#061116;--surface:#0a1a21;--surface2:#0e252d;--cyan:#43ebd1;--cyan2:#13b9c8;--text:#f0faf8;--muted:#8da9ad;--line:rgba(157,220,216,.17)}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;background:var(--bg);color:var(--text);font-family:Manrope,Arial,sans-serif;min-height:100vh;padding-bottom:118px;overflow-x:hidden}.ambient{position:fixed;border-radius:50%;pointer-events:none;filter:blur(5px);opacity:.13}.ambient-one{height:460px;width:460px;top:-250px;right:-100px;background:radial-gradient(circle,#18e4d1,transparent 67%)}.ambient-two{height:330px;width:330px;top:440px;left:-230px;background:radial-gradient(circle,#157b98,transparent 70%)}.site-header,main,footer{position:relative;max-width:1180px;margin:auto}.site-header{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid var(--line)}.brand{font-family:'DM Mono',monospace;font-weight:500;letter-spacing:.11em;font-size:14px;color:var(--text);text-decoration:none;display:flex;align-items:center;gap:11px}.brand-mark{border:1px solid var(--cyan);width:32px;height:28px;display:grid;place-items:center;color:var(--cyan);font-size:11px;letter-spacing:0}.header-status,.stats,footer{font:11px 'DM Mono',monospace;letter-spacing:.1em;color:var(--muted)}.header-status{color:var(--cyan);display:flex;gap:7px;align-items:center}.header-status i{width:7px;height:7px;background:var(--cyan);box-shadow:0 0 12px var(--cyan);border-radius:50%}.hero{padding:104px 32px 78px;border-bottom:1px solid var(--line)}.eyebrow{font:11px 'DM Mono',monospace;letter-spacing:.16em;color:var(--cyan);margin:0 0 18px}.hero h1{font-size:clamp(48px,8vw,100px);line-height:.91;letter-spacing:-.07em;margin:0;font-weight:800}.hero h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1px var(--cyan);text-shadow:0 0 26px rgba(67,235,209,.13)}.intro{max-width:430px;color:var(--muted);line-height:1.75;margin:30px 0}.stats{display:flex;gap:15px;align-items:center}.stats b{color:var(--text)}.stats .line{width:40px;border-top:1px solid var(--cyan)}.library{padding:62px 32px}.library-top{display:flex;justify-content:space-between;gap:25px;align-items:end;margin-bottom:22px}.library h2{font-size:27px;letter-spacing:-.05em;margin:0}.tools{display:flex;gap:10px;align-items:center}.search,.sort{height:42px;border:1px solid var(--line);background:rgba(6,17,22,.7);display:flex;align-items:center}.search{padding:0 12px;gap:8px;color:var(--cyan)}.search input{width:140px;background:transparent;border:0;outline:0;color:var(--text);font:13px Manrope}.search input::placeholder{color:#688287}.sort{padding:0 10px;gap:8px;color:var(--muted);font:11px 'DM Mono',monospace}.sort select{appearance:none;background:transparent;border:0;outline:0;color:var(--text);font:12px Manrope;cursor:pointer}.sort option{background:#10262e}.track-list{border-top:1px solid var(--line)}.track{min-height:82px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:44px 44px 1fr 28px;align-items:center;gap:6px;transition:background .2s,border .2s}.track:hover,.track.active{background:rgba(67,235,209,.06)}.track.active{border-color:rgba(67,235,209,.4)}button{font-family:inherit}.track-play,.main-play{cursor:pointer;border:0;display:grid;place-items:center;color:#02171b;background:var(--cyan);transition:transform .2s,background .2s}.track-play{width:34px;height:34px;border-radius:50%;font-size:11px}.track-play:hover,.main-play:hover{background:#a3fff3;transform:scale(1.07)}.track-number{font:11px 'DM Mono',monospace;color:#698389}.track-details h3{margin:0;font-size:15px;font-weight:700}.track-details p{font:10px 'DM Mono',monospace;margin:4px 0 0;color:var(--muted);letter-spacing:.08em}.track-details p span{color:var(--cyan);margin:0 4px}.track-action{color:var(--cyan);opacity:.5}.empty{border:1px dashed var(--line);padding:62px 20px;text-align:center;color:var(--muted)}.empty span{font-size:30px;color:var(--cyan)}.empty h3{color:var(--text);margin:10px}.empty p{font-size:13px}.empty code{color:var(--cyan)}.hidden{display:none}.player{position:fixed;z-index:5;bottom:0;left:0;right:0;min-height:98px;background:rgba(5,17,22,.94);backdrop-filter:blur(20px);border-top:1px solid rgba(67,235,209,.35);padding:16px max(24px,calc((100vw - 1116px)/2));display:grid;grid-template-columns:50px minmax(160px,280px) 1fr 150px;gap:18px;align-items:center}.main-play{height:48px;width:48px;border-radius:50%;font-size:15px}.now-playing{overflow:hidden}.now-playing p{font:10px 'DM Mono',monospace;color:var(--cyan);letter-spacing:.13em;margin:0 0 5px}.now-playing h2{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px}.progress-area{min-width:100px}.progress-area input,.volume input{appearance:none;width:100%;height:3px;background:#294248;outline:0;cursor:pointer;accent-color:var(--cyan)}input[type=range]::-webkit-slider-thumb{appearance:none;width:11px;height:11px;border-radius:50%;background:var(--cyan)}.times{display:flex;justify-content:space-between;margin-top:9px;color:var(--muted);font:10px 'DM Mono',monospace}.volume{display:flex;align-items:center;gap:9px;color:var(--cyan)}.volume input{width:100px}footer{border-top:1px solid var(--line);padding:24px 32px;display:flex;justify-content:space-between}@media(max-width:670px){body{padding-bottom:154px}.site-header{height:68px;padding:0 20px}.header-status{font-size:9px}.hero{padding:70px 20px 55px}.library{padding:42px 20px}.library-top{align-items:stretch;display:block}.tools{margin-top:21px}.search{flex:1}.search input{width:100%}.sort span{display:none}.track{grid-template-columns:38px 34px 1fr 18px}.track-details h3{font-size:13px}.player{min-height:136px;padding:12px 20px;grid-template-columns:48px 1fr 74px;grid-template-rows:45px 50px;gap:5px 12px}.now-playing{grid-column:2/4}.progress-area{grid-column:1/4;grid-row:2}.volume{display:none}footer{padding:20px;font-size:9px}.stats{font-size:9px}}
