*{box-sizing:border-box;margin:0;padding:0}:root{--bg-color:#16161d;--text-primary:#f0f0f5;--text-secondary:#9090a2;--accent-color:#0ff;--accent-glow:#0ff6;--glass-bg:#16161da6;--glass-border:#ffffff14}body,html{background-color:var(--bg-color);width:100%;height:100%;color:var(--text-primary);-webkit-font-smoothing:antialiased;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}#visualizer-canvas{z-index:1;width:100%;height:100%;position:absolute;top:0;left:0}.ui-container{z-index:10;pointer-events:none;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:2.5rem;display:flex;position:absolute;top:0;left:0}.ui-container *{pointer-events:auto}.app-header{text-shadow:0 4px 12px #00000080;flex-direction:column;align-items:flex-start;display:flex}.logo-text{letter-spacing:.2rem;color:var(--text-primary);background:linear-gradient(45deg,#0ff,#f0f);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 8px var(--accent-glow));-webkit-background-clip:text;font-family:Syncopate,sans-serif;font-size:1.8rem;font-weight:700}.station-sub{color:var(--text-secondary);letter-spacing:.05rem;margin-top:.25rem;font-size:.85rem;font-weight:400}.intro-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;pointer-events:auto;background:#0a0a0fb3;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .8s,visibility .8s;display:flex;position:absolute;top:0;left:0}.intro-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}.intro-content{text-align:center;max-width:500px;padding:2rem}.intro-content h1{letter-spacing:.3rem;background:linear-gradient(135deg,#0ff,gold);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 10px #00ffff4d);-webkit-background-clip:text;margin-bottom:1rem;font-family:Syncopate,sans-serif;font-size:2.5rem;font-weight:700}.intro-content p{color:var(--text-secondary);margin-bottom:2rem;font-size:1rem;line-height:1.5}.button-wrapper{width:100%;display:inline-block;position:relative}.loader{border:4px solid #ffffff1a;border-top-color:var(--accent-color);border-radius:50%;width:40px;height:40px;margin:1.5rem auto 0;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);box-shadow:0 8px 32px #0000005e}.glass-button{color:var(--text-primary);letter-spacing:.1rem;cursor:pointer;text-shadow:0 1px 2px #00000080;background:#ffffff08;border:1px solid #ffffff1a;border-radius:30px;padding:.75rem 1.5rem;font-size:.85rem;font-weight:600;transition:all .3s cubic-bezier(.16,1,.3,1)}.glass-button:hover{border-color:var(--accent-color);background:#00ffff1a;transform:translateY(-2px);box-shadow:0 0 15px #00ffff40}.play-pulse{animation:2s infinite pulse-glow}@keyframes pulse-glow{0%{box-shadow:0 0 #0ff6}70%{box-shadow:0 0 0 15px #0ff0}to{box-shadow:0 0 #0ff0}}.player-console{border-radius:24px;justify-content:space-between;align-items:center;gap:2rem;width:100%;max-width:900px;margin:0 auto;padding:1.5rem 2rem;transition:transform .5s;display:flex}.track-info-container{flex:1.5;align-items:center;gap:1.25rem;min-width:0;display:flex}.album-art-wrapper{background:#111;border-radius:12px;flex-shrink:0;width:70px;height:70px;position:relative;overflow:hidden;box-shadow:0 4px 15px #00000080}.album-art{object-fit:cover;width:100%;height:100%;transition:transform .5s}.art-glow{pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0;box-shadow:inset 0 0 15px #0009}.track-text{flex-direction:column;gap:.25rem;width:100%;min-width:0;display:flex;overflow:hidden}.marquee-wrapper{width:100%;overflow:hidden}.track-text h2,.track-text p{white-space:nowrap;width:max-content;display:inline-block;transform:translate(0,0)}.track-text h2{letter-spacing:-.01rem;color:var(--text-primary);font-size:1.15rem;font-weight:800}.track-text p{color:var(--text-secondary);font-size:.9rem;font-weight:500}.album-name{color:#707082!important;font-size:.75rem!important}.show-name{color:#8a8a9a!important;font-size:.75rem!important}@keyframes spotifyMarquee{0%,15%{transform:translate(0,0)}85%,to{transform:translate3d(var(--scroll-dist,0px), 0, 0)}}.player-controls{flex:1;justify-content:center;align-items:center;gap:1.5rem;display:flex}.control-btn{cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;transition:all .3s cubic-bezier(.16,1,.3,1);display:flex;box-shadow:0 4px 12px #0000004d}.play-btn{background:var(--text-primary);color:var(--bg-color)}.play-btn:hover{background:#fff;transform:scale(1.08);box-shadow:0 6px 20px #ffffff4d}.play-btn:active{transform:scale(.95)}.volume-container{align-items:center;gap:.75rem;min-width:120px;display:flex}.mute-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;align-items:center;transition:color .2s;display:flex}.mute-btn:hover{color:var(--text-primary)}.volume-slider{-webkit-appearance:none;cursor:pointer;background:#ffffff26;border-radius:2px;outline:none;width:100%;height:4px;transition:background .2s}.volume-slider::-webkit-slider-thumb{appearance:none;background:var(--text-primary);border-radius:50%;width:12px;height:12px;transition:transform .15s,background .15s}.volume-slider::-webkit-slider-thumb:hover{background:var(--accent-color);box-shadow:0 0 8px var(--accent-glow);transform:scale(1.2)}.extra-controls{flex-direction:column;flex:1;align-items:flex-end;gap:.5rem;display:flex}.status-indicator{align-items:center;gap:.5rem;display:flex}.pulse-dot{border-radius:50%;width:8px;height:8px;display:inline-block}.pulse-dot.live{background-color:#39ff14;animation:1.5s infinite alternate dot-pulse;box-shadow:0 0 8px #39ff14cc}.pulse-dot.buffering{background-color:gold;animation:.8s infinite alternate dot-pulse;box-shadow:0 0 8px #ffd700cc}.pulse-dot.idle{box-shadow:none;background-color:#707082}@keyframes dot-pulse{0%{opacity:.5;transform:scale(.9)}to{opacity:1;transform:scale(1.1)}}.status-text{letter-spacing:.05rem;color:var(--text-secondary);font-family:Syncopate,sans-serif;font-size:.65rem;font-weight:700}.mode-btn{border-radius:20px!important;padding:.5rem 1rem!important;font-size:.75rem!important}.hidden{display:none!important}@media (width<=768px){.ui-container{padding:1.5rem}.player-console{flex-direction:column;align-items:stretch;gap:1.25rem;padding:1.5rem}.track-info-container{flex:none}.player-controls{flex:none;justify-content:space-between}.extra-controls{flex-direction:row;flex:none;justify-content:space-between;align-items:center;margin-top:.25rem}.app-header{text-align:center;align-self:center;align-items:center}}.archive-container{z-index:50;flex-direction:column;gap:1.25rem;width:100%;max-width:1100px;height:100%;margin:0 auto;padding:2rem;display:flex;position:absolute;top:0;left:0;right:0;overflow-y:auto}.archive-header{border-radius:20px;justify-content:space-between;align-items:center;padding:1.25rem 2rem;display:flex}.archive-brand{flex-direction:column;gap:.25rem;display:flex}.archive-title{color:var(--text-secondary);font-size:1.1rem;font-weight:600}.archive-toolbar{border-radius:16px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.5rem;display:flex}.search-box{border:1px solid var(--glass-border);min-width:220px;color:var(--text-secondary);background:#ffffff0d;border-radius:20px;flex:1;align-items:center;gap:.5rem;padding:.5rem 1rem;display:flex}.search-box input{color:var(--text-primary);background:0 0;border:none;outline:none;width:100%;font-size:.9rem}.sort-controls{align-items:center;gap:.5rem;display:flex}.sort-label{color:var(--text-secondary);font-size:.8rem;font-weight:600}.sort-btn{color:var(--text-secondary);cursor:pointer;background:#ffffff08;border:1px solid #ffffff1a;border-radius:16px;padding:.4rem .9rem;font-size:.8rem;font-weight:600;transition:all .2s}.sort-btn.active,.sort-btn:hover{background:var(--accent-color);color:var(--bg-color);border-color:var(--accent-color);box-shadow:0 0 10px var(--accent-glow)}.archive-status{color:var(--text-secondary);padding:0 .5rem;font-size:.85rem}.archive-list{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1rem;padding-bottom:7rem;display:grid}.archive-card{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--glass-border);cursor:pointer;background:#16161dbf;border-radius:16px;flex-direction:column;gap:.4rem;padding:1.1rem 1.25rem;transition:all .25s cubic-bezier(.16,1,.3,1);display:flex;position:relative;overflow:hidden}.archive-card:hover{border-color:var(--accent-color);background:#1e1e2ad9;transform:translateY(-2px);box-shadow:0 6px 20px #00ffff26}.archive-card.active{background:#192d1ecc;border-color:#39ff14;box-shadow:0 0 15px #39ff144d}.archive-card-header{justify-content:space-between;align-items:flex-start;gap:.5rem;display:flex}.archive-card-title{color:var(--text-primary);font-size:1.05rem;font-weight:700;line-height:1.3}.archive-card-badge{color:var(--text-secondary);background:#ffffff14;border-radius:10px;flex-shrink:0;padding:.2rem .5rem;font-size:.7rem;font-weight:700}.archive-card.active .archive-card-badge{color:#000;background:#39ff14}.archive-card-dj{color:var(--accent-color);font-size:.85rem;font-weight:600}.archive-card-date{color:var(--text-secondary);margin-top:.2rem;font-size:.75rem}.archive-player-bar{z-index:100;border-radius:20px;justify-content:space-between;align-items:center;gap:1.5rem;width:calc(100% - 4rem);max-width:900px;padding:1rem 1.5rem;display:flex;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%)}.archive-player-info{flex-direction:column;flex:1;gap:.2rem;min-width:0;display:flex}.archive-player-title{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:.95rem;font-weight:700;overflow:hidden}.archive-player-sub{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:.8rem;overflow:hidden}.archive-player-bar audio{filter:invert(.9)hue-rotate(180deg);outline:none;max-width:320px;height:36px}@media (width<=768px){.archive-container{padding:1rem}.archive-player-bar{flex-direction:column;align-items:stretch;width:calc(100% - 2rem);bottom:1rem}.archive-player-bar audio{width:100%;max-width:100%}}