:root{--metal-light:#d6d8de;--metal-mid:#9ea3ad;--metal-dark:#4a4e57;--metal-darker:#2b2e35;--lcd-bg:#0b1a14;--lcd-green:#38ff7a;--lcd-dim:#1d6b3a;--accent:#7fb1ff}*{box-sizing:border-box}body,html,#root{color:#ddd;-webkit-user-select:none;user-select:none;background:radial-gradient(at top,#3a3f48 0%,#1a1c22 70%,#0a0b0e 100%);height:100%;margin:0;padding:0;font-family:Roboto Mono,Courier New,monospace}.winamp-root{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:28px 12px 40px;display:flex}.winamp-player{background:linear-gradient(#e8eaef 0%,#b6bac3 8%,#7c818c 50%,#5c606a 90%,#3a3d44 100%);border:1px solid #2a2c32;border-radius:10px;width:100%;max-width:720px;padding:10px;box-shadow:inset 0 1px #fff9,inset 0 -2px #0006,0 12px 30px #0009,0 2px 4px #0006}.titlebar{color:#cfd6e2;letter-spacing:2px;text-shadow:0 1px #000;background:linear-gradient(#6c7280 0%,#3e424b 50%,#2b2e36 100%);border:1px solid #1a1c22;border-radius:4px;align-items:center;gap:8px;height:22px;padding:0 8px;font-size:10px;display:flex;box-shadow:inset 0 1px #ffffff26,inset 0 -1px #00000080}.title-text{font-weight:700}.title-dots{color:#6a7280;text-align:center;flex:1;overflow:hidden}.display,.display *{font-family:Bitcount Grid Single,monospace}.display{background:linear-gradient(#2b2e36,#1a1c22);border:1px solid #111;border-radius:4px;margin-top:8px;padding:3px;box-shadow:inset 0 1px #fff3}.display-inner{background:repeating-linear-gradient(0deg, #00000040 0 1px, transparent 1px 3px), radial-gradient(ellipse at center, #0d2418 0%, var(--lcd-bg) 100%);border:1px solid #000;border-radius:3px;padding:10px 14px;box-shadow:inset 0 0 24px #38ff7a14}.marquee{color:var(--lcd-green);text-shadow:0 0 6px #38ff7ab3,0 0 12px #38ff7a66;letter-spacing:1px;white-space:nowrap;text-overflow:ellipsis;font-family:VT323,Roboto Mono,monospace;font-size:28px;overflow:hidden}.marquee.scrolling{text-overflow:clip}.marquee.scrolling span{padding-left:100%;animation:18s linear infinite marquee-scroll;display:inline-block}@keyframes marquee-scroll{0%{transform:translate(0)}to{transform:translate(-100%)}}.meta{align-items:center;gap:10px;margin-top:6px;font-size:11px;display:flex}.badge{color:var(--lcd-green);text-shadow:0 0 4px #38ff7a99;background:#38ff7a1f;border:1px solid #38ff7a59;border-radius:2px;padding:1px 6px}.statuslamp{letter-spacing:1px;color:#ff5a5a;text-shadow:0 0 8px #ff5a5acc;margin-left:auto}.statuslamp.on{color:var(--lcd-green);text-shadow:0 0 4px #38ff7a80;animation:1.4s infinite blink}.statuslamp.ready{color:var(--lcd-green);text-shadow:0 0 4px #38ff7a80}@keyframes blink{0%,to{opacity:1}50%{opacity:.55}}.controls{background:linear-gradient(#c5c9d2 0%,#8a8f99 100%);border:1px solid #2a2c32;border-radius:4px;align-items:center;gap:6px;margin-top:10px;padding:8px;display:flex;box-shadow:inset 0 1px #ffffffb3,inset 0 -1px #00000059}.btn{color:#1a1c22;cursor:pointer;background:linear-gradient(#f0f2f6 0%,#b8bcc6 45%,#6e7380 95%);border:1px solid #1c1e23;border-radius:4px;width:42px;height:30px;font-size:14px;transition:transform 50ms;box-shadow:inset 0 1px #fffc,inset 0 -2px 2px #0000004d,0 2px 3px #0006}.btn:hover{background:linear-gradient(#fff 0%,#c8ccd5 45%,#7a7f8b 95%)}.btn:active{transform:translateY(1px);box-shadow:inset 0 1px #fff6,inset 0 2px 4px #00000080}.btn.big{color:#6b1414;width:56px;font-size:16px}.vol{align-items:center;gap:8px;margin-left:auto;padding-left:10px;display:flex}.vol-label,.vol-val{color:#1a1c22;text-shadow:0 1px #ffffff80;letter-spacing:1px;font-size:10px}.vol input[type=range]{appearance:none;background:linear-gradient(#2b2e36,#555a66);border:1px solid #1a1c22;border-radius:3px;outline:none;width:160px;height:6px;box-shadow:inset 0 1px 2px #0009}.vol input[type=range]::-webkit-slider-thumb{appearance:none;cursor:pointer;background:linear-gradient(#f0f2f6,#8a8f99 60%,#555a66);border:1px solid #111;border-radius:3px;width:14px;height:18px;box-shadow:inset 0 1px #ffffffb3,0 2px 3px #00000080}.vol input[type=range]::-moz-range-thumb{cursor:pointer;background:linear-gradient(#f0f2f6,#8a8f99 60%,#555a66);border:1px solid #111;border-radius:3px;width:14px;height:18px}.filters{letter-spacing:1px;background:linear-gradient(#5c606a,#3a3d44);border:1px solid #1a1c22;border-radius:4px;align-items:center;gap:12px;margin-top:8px;padding:6px 10px;font-size:11px;display:flex;box-shadow:inset 0 1px #ffffff26}.filters label{color:#cfd6e2;align-items:center;gap:6px;display:flex}.filters .search{margin-left:auto}.filters .search input{font:inherit;letter-spacing:1px;color:#0a0c10;text-shadow:0 1px #ffffff80;background:linear-gradient(#e8eaef 0%,#b6bac3 45%,#7c818c 95%);border:1px solid #0a0c10;border-radius:3px;outline:none;width:140px;height:22px;padding:3px 6px 3px 8px;box-shadow:inset 0 1px #fffc,inset 0 -2px 2px #0000004d,0 1px 2px #0006}.filters .search input::placeholder{color:#3a3d44}.mselect{letter-spacing:1px;font-family:inherit;font-size:11px;position:relative}.mselect-trigger{color:#0a0c10;width:100%;height:22px;font:inherit;cursor:pointer;text-shadow:0 1px #ffffff80;background:linear-gradient(#e8eaef 0%,#b6bac3 45%,#7c818c 95%);border:1px solid #0a0c10;border-radius:3px;justify-content:space-between;align-items:center;gap:6px;padding:3px 6px 3px 8px;display:flex;box-shadow:inset 0 1px #fffc,inset 0 -2px 2px #0000004d,0 1px 2px #0006}.mselect-trigger:hover{background:linear-gradient(#fff 0%,#c8ccd5 45%,#8a8f99 95%)}.mselect.open .mselect-trigger{background:linear-gradient(#8a8f99 0%,#b6bac3 50%,#d0d4dc 95%);box-shadow:inset 0 1px #ffffff4d,inset 0 2px 4px #00000080}.mselect-value{text-overflow:ellipsis;white-space:nowrap;text-align:left;flex:1;overflow:hidden}.mselect-arrow{color:#1a1c22;background:linear-gradient(#f0f2f6 0%,#9ea3ad 90%);border:1px solid #1a1c22;border-radius:2px;justify-content:center;align-items:center;width:14px;height:14px;font-size:8px;display:inline-flex;box-shadow:inset 0 1px #ffffffb3,inset 0 -1px 1px #0000004d}.mselect-menu{z-index:30;background:linear-gradient(#d6d8de 0%,#9ea3ad 100%);border:1px solid #0a0c10;border-radius:4px;max-height:220px;margin:0;padding:3px;list-style:none;position:absolute;top:calc(100% + 3px);left:0;right:0;overflow-y:auto;box-shadow:inset 0 1px #ffffffb3,0 6px 14px #0009}.mselect-menu li{color:#0a0c10;cursor:pointer;text-shadow:0 1px #fff6;border:1px solid #0000;border-radius:2px;padding:4px 8px}.mselect-menu li.hover{color:#fff;text-shadow:0 1px #00000080;background:linear-gradient(#4a6ea8,#2b3a55);border-color:#1a1c22;box-shadow:inset 0 1px #fff3}.mselect-menu li.selected:not(.hover){background:linear-gradient(#c0c4cd,#8a8f99);border-color:#5c606a;box-shadow:inset 0 1px #fff6}.mselect-menu::-webkit-scrollbar{width:12px}.mselect-menu::-webkit-scrollbar-track{background:linear-gradient(#5c606a,#3a3d44)}.mselect-menu::-webkit-scrollbar-thumb{background:linear-gradient(#e8eaef,#7c818c);border:1px solid #1a1c22;border-radius:2px}.playlist{background:#0a0c10;border:1px solid #000;border-radius:4px;margin-top:8px;overflow:hidden;box-shadow:inset 0 1px #ffffff26,inset 0 2px 6px #00000080}.pl-header{color:#cfd6e2;letter-spacing:2px;background:linear-gradient(#5c606a,#3a3d44);border-bottom:1px solid #000;grid-template-columns:40px 1fr 110px 90px;padding:5px 10px;font-size:10px;display:grid}.playlist ul{height:340px;margin:0;padding:4px 0;list-style:none;overflow-y:auto}.playlist li{color:#ffb24a;cursor:pointer;text-shadow:0 0 4px #ffb24a4d;grid-template-columns:40px 1fr 110px 90px;padding:4px 10px;font-size:12px;display:grid}.playlist li:hover{background:#ffffff0a}.playlist li.active{color:#fff;text-shadow:0 0 6px #7fb1ffcc;background:linear-gradient(#2b3a55,#1b2740)}.playlist .num{color:#6a7280}.playlist .tg{color:#6b8e9b;font-size:11px}.playlist li.active .tg{color:#cfe4ff}.playlist ul::-webkit-scrollbar{width:12px}.playlist ul::-webkit-scrollbar-track{background:#0a0c10}.playlist ul::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#6c7280,#3a3d44);border:1px solid #000;border-radius:2px}.footer{color:#6a7280;letter-spacing:2px;margin-top:18px;font-size:10px}