:root{--bg-dark: #0a0a12;--bg-panel: #1a1a2e;--bg-panel-inner: #0d0d1a;--border-outer: #4a4a6a;--border-inner: #2a2a4a;--border-highlight: #6a6a8a;--neon-green: #39ff14;--neon-cyan: #00ffff;--neon-magenta: #ff00ff;--neon-orange: #ff6600;--neon-yellow: #ffff00;--text-primary: #c0c0c0;--text-dim: #606080;--title-bar-bg: linear-gradient(90deg, #000080, #1084d0);--title-bar-text: #ffffff;--button-face: #c0c0c0;--button-highlight: #ffffff;--button-shadow: #808080;--button-dark-shadow: #000000;--font-pixel: "Press Start 2P", monospace;--font-terminal: "VT323", monospace;--font-mono: "Share Tech Mono", monospace}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:var(--bg-dark);color:var(--text-primary);font-family:var(--font-terminal);font-size:16px}.scanlines{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:9999;background:repeating-linear-gradient(0deg,rgba(0,0,0,.3) 0px,rgba(0,0,0,.3) 1px,transparent 1px,transparent 3px)}.crt-flicker{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:9998;animation:flicker .1s infinite;opacity:.06;background:#fff}.crt-glow{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:9997;background:radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.4) 100%)}@keyframes flicker{0%{opacity:.04}25%{opacity:.08}50%{opacity:.03}75%{opacity:.07}to{opacity:.04}}.boot-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:#000008;z-index:1000;cursor:pointer;overflow:hidden}.bios-screen{width:100%;height:100%;padding:38px 50px;display:flex;flex-direction:column;font-family:var(--font-terminal);color:#aaa;font-size:28px;line-height:1.5}.bios-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.bios-header-text{flex:1}.bios-bold{color:#fff}.bios-logo{position:absolute;top:20px;right:40px}.bios-dolphin{width:450px;height:450px}.bios-body{flex:1;color:#aaa}.bios-line{opacity:0;transition:opacity .05s}.bios-ok{color:var(--neon-green)}.bios-mem{color:#fff}.bios-footer{margin-top:auto;padding-top:12px}.bios-footer p{color:#aaa}.bios-click{color:var(--neon-cyan);text-shadow:0 0 10px var(--neon-cyan);margin-top:15px;font-size:30px}.cursor{animation:blink-cursor .7s step-end infinite}@keyframes blink-cursor{50%{opacity:0}}.app{width:100%;height:100vh;position:relative;overflow:hidden}.desktop{position:absolute;top:0;left:0;width:100%;height:100%;background:url(/assets/wallpaper-iseDXsxK.jpg) center/cover no-repeat;z-index:0}.desktop-icons{position:absolute;top:30px;left:16px;display:flex;flex-direction:column;gap:8px;z-index:2}.desktop-icon{display:flex;flex-direction:column;align-items:center;gap:4px;width:100px;padding:6px;cursor:default;-webkit-user-select:none;user-select:none}.desktop-icon:hover{background:#0064c84d;outline:1px dotted rgba(255,255,255,.5)}.desktop-icon-img{font-size:48px;line-height:1;filter:drop-shadow(1px 1px 0 rgba(0,0,0,.5))}.desktop-icon-label{font-family:var(--font-pixel);font-size:10px;color:#fff;text-align:center;text-shadow:1px 1px 1px #000;line-height:1.3;word-break:break-word}.window-chrome{border:2px solid var(--border-outer);border-top-color:var(--border-highlight);border-left-color:var(--border-highlight)}.title-bar{display:flex;justify-content:space-between;align-items:center;height:30px;padding:0 6px 0 10px;background:var(--title-bar-bg);color:var(--title-bar-text);font-family:var(--font-pixel);font-size:10px;-webkit-user-select:none;user-select:none}.window-controls{display:flex;gap:3px}.win-btn{display:inline-flex;align-items:center;justify-content:center;width:22px;height:20px;background:var(--button-face);border:1px solid;border-color:var(--button-highlight) var(--button-dark-shadow) var(--button-dark-shadow) var(--button-highlight);color:#000;font-size:12px;line-height:1;cursor:pointer}.main-window{position:absolute;top:3%;left:50%;transform:translate(-45%);width:1260px;height:900px;max-width:calc(100% - 130px);max-height:calc(100% - 80px);z-index:2;display:flex;flex-direction:column;background:var(--bg-panel);border:2px solid var(--border-outer);border-top-color:var(--border-highlight);border-left-color:var(--border-highlight)}.main-window>.window-chrome{border:none;flex-shrink:0}.main-window-content{flex:1;display:flex;overflow:hidden;min-height:0}.mix-panel{width:275px;min-width:220px;flex-shrink:0;display:flex;flex-direction:column;background:var(--bg-panel-inner);border-right:2px solid var(--border-outer);overflow:hidden}.mix-card-container{position:relative;flex:1;display:flex;align-items:center;justify-content:center;padding:8px;min-height:0;overflow:hidden}.mix-card{width:100%;background:var(--bg-panel-inner);border:2px solid var(--border-inner);border-radius:2px;cursor:grab;transition:transform .1s;-webkit-user-select:none;user-select:none;position:relative}.mix-card.dragging{cursor:grabbing;transition:none}.mix-card.swipe-left{animation:swipeLeft .4s forwards}.mix-card.swipe-right{animation:swipeRight .4s forwards}@keyframes swipeLeft{to{transform:translate(-150%) rotate(-20deg);opacity:0}}@keyframes swipeRight{to{transform:translate(150%) rotate(20deg);opacity:0}}.mix-thumbnail{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;border-bottom:2px solid var(--border-inner);filter:saturate(1.2) contrast(1.1)}.mix-info{padding:8px}.mix-title{font-family:var(--font-pixel);font-size:10px;color:var(--neon-cyan);text-shadow:0 0 8px var(--neon-cyan);line-height:1.6;margin-bottom:5px;max-height:4.8em;overflow:hidden}.mix-channel{font-family:var(--font-mono);font-size:16px;color:var(--text-dim);margin-bottom:5px}.mix-stats{display:flex;gap:12px;font-family:var(--font-mono);font-size:16px}.stat{color:var(--neon-green);text-shadow:0 0 5px rgba(57,255,20,.5)}.genre-tag{background:var(--neon-magenta);color:#000;padding:2px 8px;font-size:14px;font-weight:700;text-shadow:none}.swipe-indicator{position:absolute;top:50%;transform:translateY(-50%);font-family:var(--font-pixel);font-size:12px;padding:6px 12px;opacity:0;transition:opacity .2s;pointer-events:none;z-index:10}.swipe-left-ind{left:12px;color:var(--neon-orange);text-shadow:0 0 10px var(--neon-orange);border:2px solid var(--neon-orange)}.swipe-right-ind{right:12px;color:var(--neon-green);text-shadow:0 0 10px var(--neon-green);border:2px solid var(--neon-green)}.swipe-buttons{display:flex;gap:6px;padding:0 8px 6px;justify-content:center;flex-shrink:0}.btn-retro{font-family:var(--font-pixel);font-size:11px;padding:8px 18px;border:2px solid;border-color:var(--button-highlight) var(--button-dark-shadow) var(--button-dark-shadow) var(--button-highlight);background:var(--bg-panel-inner);cursor:pointer;text-transform:uppercase;transition:all .1s}.btn-retro:active{border-color:var(--button-dark-shadow) var(--button-highlight) var(--button-highlight) var(--button-dark-shadow)}.btn-skip{color:var(--neon-orange);text-shadow:0 0 5px var(--neon-orange)}.btn-load{color:var(--neon-green);text-shadow:0 0 5px var(--neon-green)}.btn-retro:hover{background:var(--bg-panel)}.mix-queue-label{font-family:var(--font-pixel);font-size:9px;color:var(--text-dim);padding:3px 10px 2px;flex-shrink:0}.mix-queue{display:flex;gap:4px;padding:2px 8px 6px;overflow-x:auto;flex-shrink:0}.mix-queue::-webkit-scrollbar{height:4px}.mix-queue::-webkit-scrollbar-track{background:var(--bg-panel-inner)}.mix-queue::-webkit-scrollbar-thumb{background:var(--border-outer)}.queue-item{flex-shrink:0;width:75px;height:42px;border:1px solid var(--border-inner);overflow:hidden;cursor:pointer;opacity:.6;transition:opacity .2s}.queue-item:hover{opacity:1;border-color:var(--neon-cyan)}.queue-item img{width:100%;height:100%;object-fit:cover}.right-area{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}.video-panel{flex:1;position:relative;background:#000;overflow:hidden;min-height:0}#viz-video-container{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;background:#000;z-index:1}#viz-video-container iframe{width:100%;height:100%;position:absolute;top:0;left:0;pointer-events:none;border:none}#visualizer{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;background:transparent;image-rendering:pixelated;z-index:2;cursor:pointer;pointer-events:auto}.player-section{flex-shrink:0;background:var(--bg-panel);border-top:2px solid var(--border-highlight)}.player-section>.window-chrome{border:none}.player-title{background:linear-gradient(90deg,#1a0030,#300060,#1a0030)}.player-controls{padding:6px 12px 10px}.player-display{display:flex;align-items:center;gap:16px;margin-bottom:4px;padding:4px 8px;background:#000;border:1px inset var(--border-inner)}.player-time{font-family:var(--font-mono);font-size:22px;color:var(--neon-green);text-shadow:0 0 8px var(--neon-green);white-space:nowrap;min-width:170px}.player-marquee{flex:1;overflow:hidden;white-space:nowrap}.marquee-text{display:inline-block;font-family:var(--font-pixel);font-size:10px;color:var(--neon-yellow);text-shadow:0 0 5px var(--neon-yellow);animation:marquee 20s linear infinite}@keyframes marquee{0%{transform:translate(100%)}to{transform:translate(-100%)}}.timeline-container{position:relative;height:22px;margin:4px 0}.timeline{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:22px;background:#000;border:1px inset var(--border-inner);outline:none;cursor:pointer;position:relative;z-index:2}.timeline::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:22px;background:var(--neon-cyan);border:1px solid #fff;cursor:pointer;box-shadow:0 0 8px var(--neon-cyan)}.timeline::-moz-range-thumb{width:12px;height:22px;background:var(--neon-cyan);border:1px solid #fff;cursor:pointer;box-shadow:0 0 8px var(--neon-cyan)}.timeline-fill{position:absolute;top:1px;left:1px;height:20px;background:linear-gradient(90deg,var(--neon-magenta),var(--neon-cyan));opacity:.3;pointer-events:none;z-index:1;width:0%}.transport-controls{display:flex;align-items:center;gap:4px;margin-top:4px}.btn-transport{font-size:20px;width:50px;height:38px;background:var(--bg-panel-inner);border:2px solid;border-color:var(--button-highlight) var(--button-dark-shadow) var(--button-dark-shadow) var(--button-highlight);color:var(--text-primary);cursor:pointer;display:flex;align-items:center;justify-content:center}.btn-transport:active{border-color:var(--button-dark-shadow) var(--button-highlight) var(--button-highlight) var(--button-dark-shadow)}.btn-transport:hover{color:var(--neon-cyan);text-shadow:0 0 5px var(--neon-cyan)}.btn-play{width:70px;color:var(--neon-green);text-shadow:0 0 5px var(--neon-green)}.volume-control{display:flex;align-items:center;gap:8px;margin-left:auto}.vol-label{font-family:var(--font-pixel);font-size:9px;color:var(--text-dim)}.volume-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:125px;height:12px;background:#000;border:1px inset var(--border-inner);outline:none}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:8px;height:14px;background:var(--neon-orange);border:1px solid #fff;cursor:pointer}.taskbar{position:absolute;bottom:0;left:0;width:100%;height:50px;background:var(--button-face);border-top:2px solid var(--button-highlight);display:flex;align-items:center;padding:0 6px;gap:5px;z-index:100}.start-btn{display:flex;align-items:center;gap:6px;height:38px;padding:0 14px;background:var(--button-face);border:2px solid;border-color:var(--button-highlight) var(--button-dark-shadow) var(--button-dark-shadow) var(--button-highlight);font-family:var(--font-pixel);font-size:11px;color:#000;cursor:pointer;font-weight:700;flex-shrink:0}.start-btn:active{border-color:var(--button-dark-shadow) var(--button-highlight) var(--button-highlight) var(--button-dark-shadow)}.taskbar-divider{width:2px;height:36px;border-left:1px solid var(--button-shadow);border-right:1px solid var(--button-highlight);flex-shrink:0}.taskbar-item{display:flex;align-items:center;gap:6px;height:38px;padding:0 14px;background:var(--button-face);border:2px solid;border-color:var(--button-dark-shadow) var(--button-highlight) var(--button-highlight) var(--button-dark-shadow);font-family:var(--font-pixel);font-size:11px;color:#000;cursor:pointer;flex-shrink:0;max-width:200px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.taskbar-tray{margin-left:auto;display:flex;align-items:center;gap:6px;height:38px;padding:0 8px;border:2px solid;border-color:var(--button-shadow) var(--button-highlight) var(--button-highlight) var(--button-shadow)}.tray-icon{font-size:16px;cursor:default}.taskbar-clock{display:flex;align-items:center;gap:10px;height:38px;padding:0 14px;border:2px solid;border-color:var(--button-shadow) var(--button-highlight) var(--button-highlight) var(--button-shadow);font-family:var(--font-mono);font-size:18px;color:#000;flex-shrink:0}@media(max-width:768px){.desktop-icons{display:none}.main-window{left:6px;right:6px;top:6px}.main-window-content{flex-direction:column}.mix-panel{width:100%;min-width:0;max-height:45%;border-right:none;border-bottom:2px solid var(--border-outer)}.video-panel{min-height:150px}}::selection{background:var(--neon-magenta);color:#000}