@font-face{font-family:"Press Start 2P";font-style:normal;font-display:swap;font-weight:400;src:url(/assets/press-start-2p-cyrillic-ext-400-normal-CIYZrvmP.woff2) format("woff2"),url(/assets/press-start-2p-cyrillic-ext-400-normal-B5Ckvkit.woff) format("woff");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:"Press Start 2P";font-style:normal;font-display:swap;font-weight:400;src:url(/assets/press-start-2p-cyrillic-400-normal-DBn7fddJ.woff2) format("woff2"),url(/assets/press-start-2p-cyrillic-400-normal-CbE56R3Y.woff) format("woff");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:"Press Start 2P";font-style:normal;font-display:swap;font-weight:400;src:url(/assets/press-start-2p-greek-400-normal-DQfalijU.woff2) format("woff2"),url(/assets/press-start-2p-greek-400-normal-BR_lG5n9.woff) format("woff");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:"Press Start 2P";font-style:normal;font-display:swap;font-weight:400;src:url(/assets/press-start-2p-latin-ext-400-normal-DpfYvR5A.woff2) format("woff2"),url(/assets/press-start-2p-latin-ext-400-normal-DBgyq7ky.woff) format("woff");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"Press Start 2P";font-style:normal;font-display:swap;font-weight:400;src:url(/assets/press-start-2p-latin-400-normal-_wFEWmAB.woff2) format("woff2"),url(/assets/press-start-2p-latin-400-normal-KLytu4cr.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--bg-0: #08060f;--bg-1: #140b24;--cabinet: #241640;--cabinet-edge: #120a24;--chrome: #d7d7e6;--neon-cyan: #34e3ff;--neon-magenta: #ff3ea5;--neon-amber: #ffb43e;--btn-face: #1b1130;--btn-face-hi: #2c1c50;--text: #e7e3ff;--text-dim: #9b8fce;font-family:"Press Start 2P",Courier New,monospace;-webkit-font-smoothing:none;font-smooth:never}*{box-sizing:border-box}html,body{margin:0;height:100%}body{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px;overflow:hidden;color:var(--text);background:radial-gradient(120% 90% at 50% 0%,var(--bg-1) 0%,var(--bg-0) 70%),repeating-linear-gradient(0deg,rgba(255,255,255,.02) 0 2px,transparent 2px 4px)}img{image-rendering:pixelated}#app{display:flex;align-items:center;justify-content:center;max-width:100%}.cabinet{width:min(94vw,460px);padding:18px 18px 22px;border-radius:14px;background:linear-gradient(180deg,var(--cabinet) 0%,var(--cabinet-edge) 100%);border:3px solid #3a2568;box-shadow:0 0 0 2px #0b0718,0 0 34px #34e3ff2e,0 22px 44px #0009,inset 0 2px #ffffff14}.brand{display:flex;justify-content:center;gap:10px;margin-bottom:14px;font-size:17px;letter-spacing:1px}.brand-wifi{color:var(--neon-cyan);text-shadow:0 0 8px rgba(52,227,255,.8)}.brand-juke{color:var(--neon-magenta);text-shadow:0 0 8px rgba(255,62,165,.8)}.bezel{padding:12px;border-radius:10px;background:#05060a;border:2px solid #000;box-shadow:inset 0 0 14px #000000e6}.grille{margin-top:16px;height:16px;border-radius:6px;background:repeating-linear-gradient(90deg,#191030 0,#191030 4px,#2a1a4d 4px,#2a1a4d 8px);box-shadow:inset 0 1px 3px #000000b3}.pip-unit{display:flex;flex-direction:column;gap:12px;width:100%}.btn{font-family:inherit;font-size:9px;line-height:1;color:var(--neon-cyan);background:linear-gradient(180deg,var(--btn-face-hi),var(--btn-face));border:2px solid #4a2f80;border-radius:6px;padding:8px 9px;min-width:34px;min-height:32px;cursor:pointer;text-shadow:0 0 6px rgba(52,227,255,.4);box-shadow:inset 0 1px #ffffff1f,0 2px #0c0720;transition:transform .03s ease,box-shadow .1s ease,color .1s ease}.btn:hover{color:#fff}.btn:active{transform:translateY(2px);box-shadow:inset 0 1px 4px #00000080}.btn:disabled{opacity:.35;cursor:default;box-shadow:none}.btn.is-on{color:var(--neon-magenta);border-color:var(--neon-magenta);text-shadow:0 0 8px rgba(255,62,165,.8);box-shadow:inset 0 0 8px #ff3ea559,0 2px #0c0720}.controls{display:flex;flex-direction:column;gap:10px}.transport{display:flex;justify-content:center;gap:10px}.btn-play{min-width:48px;min-height:40px}.knobs{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}.vol{display:flex;align-items:center;gap:6px}.vol-slider{width:76px}html[data-view=full] .controls{flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:center;gap:10px}html[data-view=full] .transport{gap:8px}html[data-view=full] .knobs{flex-wrap:nowrap;gap:6px}html[data-view=full] .knobs .btn{font-size:8px;padding:7px 6px;min-width:28px}html[data-view=full] .vol{gap:5px}html[data-view=full] .vol-slider{width:58px}.playlist{margin-top:16px;border-top:2px solid #3a2568;padding-top:12px}.playlist-head{font-size:9px;color:var(--neon-amber);text-shadow:0 0 6px rgba(255,180,62,.6);margin-bottom:8px}.playlist-list{list-style:none;margin:0;padding:0;max-height:168px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--neon-cyan) #120a24}.pl-row{display:grid;grid-template-columns:24px 1fr auto auto;gap:8px;align-items:center;padding:7px 6px;font-size:8px;color:var(--text-dim);border-radius:4px;cursor:pointer}.pl-row:hover{background:#34e3ff14;color:var(--text)}.pl-row.is-current{color:var(--neon-cyan);background:#34e3ff1f;text-shadow:0 0 6px rgba(52,227,255,.5)}.pl-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}.pl-artist{color:var(--text-dim);max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pl-dur{color:var(--text-dim)}.pl-row.is-playing .pl-num{color:var(--neon-magenta)}.playlist-empty{font-size:8px;line-height:1.7;color:var(--text-dim);padding:6px}.pip-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:120px;font-size:8px;line-height:1.7;text-align:center;color:var(--neon-cyan)}.pip-placeholder-glyph{font-size:20px;text-shadow:0 0 10px rgba(52,227,255,.8)}html[data-view=compact] .cabinet{width:auto;max-width:min(96vw,300px);padding:0;background:none;border:0;border-radius:0;box-shadow:none}html[data-view=compact] .bezel{padding:0;background:none;border:0;box-shadow:none}html[data-view=compact] .brand,html[data-view=compact] .playlist,html[data-view=compact] .grille{display:none}html[data-pip-window],html[data-pip-window] body{height:100%}html[data-pip-window] body{padding:8px;background:var(--bg-0)}html[data-pip-window] .pip-unit{max-width:100%}:root{--lcd-fg: #7dff6a;--lcd-dim: #3f8a39;--lcd-bg-0: #123a12;--lcd-bg-1: #071507}.lcd{position:relative;display:flex;gap:10px;padding:12px;border-radius:6px;color:var(--lcd-fg);background:radial-gradient(120% 130% at 50% 0%,var(--lcd-bg-0) 0%,#0a1f0a 65%,var(--lcd-bg-1) 100%);border:2px solid #061206;box-shadow:inset 0 0 18px #000000d9,inset 0 0 30px #7dff6a0f;overflow:hidden}.lcd-scanlines{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;border-radius:inherit;background:repeating-linear-gradient(0deg,rgba(0,0,0,.32) 0 1px,transparent 1px 3px),linear-gradient(180deg,rgba(255,255,255,.06) 0%,transparent 30%);mix-blend-mode:multiply}.lcd-artwork{flex:0 0 auto;width:64px;height:64px;border:2px solid #061206;background:#0a1f0a;box-shadow:inset 0 0 8px #000c}.lcd-cover{width:100%;height:100%;object-fit:cover;display:block}.lcd-readout{position:relative;flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:6px;justify-content:center}.lcd-viz{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;image-rendering:pixelated;opacity:.5;pointer-events:none;z-index:0}.lcd-title,.lcd-artist,.lcd-status,.lcd-seek{position:relative;z-index:1}.lcd-title{overflow:hidden;white-space:nowrap;font-size:11px;line-height:1.3;text-shadow:0 0 8px rgba(125,255,106,.6)}.marquee-text{display:inline-block;will-change:transform}.lcd-title.is-scrolling .marquee-text{animation:marquee 6s ease-in-out infinite alternate}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-55%)}}.lcd-artist{font-size:8px;line-height:1.3;color:var(--lcd-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lcd-status{display:flex;align-items:center;gap:6px;font-size:8px;color:var(--lcd-dim)}.lcd-flags{margin-left:auto;display:flex;gap:6px}.lcd-flag{opacity:.22}.lcd-flag.is-on{opacity:1;color:var(--lcd-fg);text-shadow:0 0 6px rgba(125,255,106,.8)}.lcd-seek{width:100%;margin-top:2px}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:14px;background:transparent;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:6px;background:#0a1f0a;border:1px solid #061206;box-shadow:inset 0 0 4px #000000d9}input[type=range]::-moz-range-track{height:6px;background:#0a1f0a;border:1px solid #061206}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:8px;height:14px;margin-top:-5px;border:0;border-radius:0;background:var(--lcd-fg);box-shadow:0 0 6px #7dff6ae6}input[type=range]::-moz-range-thumb{width:8px;height:14px;border:0;border-radius:0;background:var(--lcd-fg);box-shadow:0 0 6px #7dff6ae6}.vol-slider::-webkit-slider-thumb{background:var(--neon-cyan);box-shadow:0 0 6px #34e3ffe6}.vol-slider::-moz-range-thumb{background:var(--neon-cyan);box-shadow:0 0 6px #34e3ffe6}.btn-icon{display:inline-flex;align-items:center;justify-content:center}.btn-play:before{content:"";width:0;height:0;border-style:solid;border-width:8px 0 8px 13px;border-color:transparent transparent transparent currentColor}.btn-play.is-playing:before{width:14px;height:16px;border:0;background:linear-gradient(90deg,currentColor 0 35%,transparent 35% 65%,currentColor 65% 100%)}.btn-prev:before{content:"";width:3px;height:14px;margin-right:2px;background:currentColor}.btn-prev:after{content:"";width:0;height:0;border-style:solid;border-width:7px 11px 7px 0;border-color:transparent currentColor transparent transparent}.btn-next:before{content:"";width:0;height:0;margin-right:2px;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent currentColor}.btn-next:after{content:"";width:3px;height:14px;background:currentColor}html[data-view=compact] body{padding:6px}html[data-view=compact] .pip-unit{gap:7px;padding:8px;border-radius:6px;color:var(--lcd-fg);background:radial-gradient(120% 140% at 50% 0%,var(--lcd-bg-0) 0%,#0a1f0a 65%,var(--lcd-bg-1) 100%);border:2px solid #061206;box-shadow:inset 0 0 18px #000000d9,inset 0 0 30px #7dff6a0f}html[data-view=compact] .lcd{padding:0;border:0;background:none;box-shadow:none;gap:8px}html[data-view=compact] .lcd-artwork{width:46px;height:46px}html[data-view=compact] .lcd-title{font-size:10px}html[data-view=compact] .knobs{display:none}html[data-view=compact] .controls{gap:0}html[data-view=compact] .transport{gap:6px}html[data-view=compact] .transport .btn{min-width:26px;min-height:20px;padding:3px 6px;color:var(--lcd-fg);background:#00000047;border-color:#2f7a2c;text-shadow:0 0 6px rgba(125,255,106,.5);box-shadow:inset 0 1px #7dff6a1f,0 2px #0006}html[data-view=compact] .transport .btn:hover{color:#eaffe4}html[data-view=compact] .btn-play{min-width:34px;min-height:22px}html[data-view=compact] .btn-play:before{border-width:6px 0 6px 10px}html[data-view=compact] .btn-play.is-playing:before{width:11px;height:12px}html[data-view=compact] .btn-prev:before,html[data-view=compact] .btn-next:after{height:11px}html[data-view=compact] .btn-prev:after{border-width:5px 8px 5px 0}html[data-view=compact] .btn-next:before{border-width:5px 0 5px 8px}@media(prefers-reduced-motion:reduce){.lcd-title.is-scrolling .marquee-text{animation:none}}
