:root{--primary: #00E5FF;--primary-glow: rgba(0, 229, 255, .4);--bg-main: #09090b;--bg-surface: #18181b;--bg-card: #27272a;--text-main: #ffffff;--text-sub: #a1a1aa;--border-glass: rgba(255, 255, 255, .1);--glass-bg: rgba(24, 24, 27, .7);--nav-height: 65px}body{margin:0;background-color:var(--bg-main);color:var(--text-main);font-family:Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased;padding-bottom:calc(var(--nav-height) + 10px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}h1{font-size:1.5rem;font-weight:700;margin:0;letter-spacing:-.02em}h2{font-size:1.25rem;font-weight:600;margin:0}h3{font-size:1rem;font-weight:600;margin:0}p{font-size:.875rem;color:var(--text-sub);margin:0}.app-container{min-height:100vh;display:flex;flex-direction:column}.container{padding:16px;flex:1}.glass-header{position:sticky;top:0;z-index:50;background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border-glass);padding:12px 16px;display:flex;align-items:center;justify-content:space-between}.search-wrapper{background:var(--bg-surface);border:1px solid var(--border-glass);border-radius:12px;padding:8px 12px;display:flex;align-items:center;gap:10px;transition:border-color .2s}.search-wrapper:focus-within{border-color:var(--primary)}.search-input{background:transparent;border:none;outline:none;font-size:1rem;color:#fff;width:100%}.track-card{background:var(--bg-card);border-radius:12px;padding:12px;display:flex;align-items:center;gap:12px;margin-bottom:8px;cursor:pointer;transition:transform .1s}.track-card:active{transform:scale(.98);background:var(--bg-surface)}.track-img{width:50px;height:50px;border-radius:8px;object-fit:cover;background:#333}.bottom-nav{position:fixed;bottom:0;left:0;right:0;height:var(--nav-height);background:#09090be6;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-top:1px solid var(--border-glass);display:flex;justify-content:space-around;align-items:center;z-index:100}.nav-item{background:none;border:none;color:var(--text-sub);display:flex;flex-direction:column;align-items:center;gap:4px;font-size:.7rem;font-weight:500;width:60px}.nav-item.active{color:var(--primary)}.animate-spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-fade-in{animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}input[type=range]{width:100%;-webkit-appearance:none;background:transparent}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:16px;width:16px;border-radius:50%;background:var(--primary);margin-top:-6px;box-shadow:0 0 10px var(--primary-glow)}input[type=range]::-webkit-slider-runnable-track{width:100%;height:4px;background:#3f3f46;border-radius:2px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:end}.modal-content{background:#1c1c1c;width:100%;border-top-left-radius:24px;border-top-right-radius:24px;padding:24px;border-top:1px solid var(--border-glass);animation:slideUp .3s cubic-bezier(.2,.8,.2,1)}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}