:root{--bg:#060610;--surface:#0d0d1c;--card:#0f0f1e;--card-hover:#141428;--border:#ffffff12;--border-hover:#ffffff24;--text:#f2f0ff;--text2:#b0a8d8;--muted:#534f6e;--accent:#ff2d87;--accent2:#7c3aed;--font-body:"Inter", system-ui, sans-serif;--font-display:"Bricolage Grotesque", "Inter", sans-serif;--font-data:"Space Mono", ui-monospace, monospace}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}a{color:inherit;text-decoration:none}button{font-family:inherit}button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.appRoot{background:var(--bg);height:100dvh;display:flex;overflow:hidden}.appSidebar{border-right:1px solid var(--border);background:#04040e;flex-direction:column;flex-shrink:0;width:220px;min-height:100dvh;max-height:100dvh;display:flex;position:sticky;top:0;overflow-y:auto}.sidebarItem{color:var(--muted);cursor:pointer;text-align:left;background:0 0;border:none;border-radius:10px;align-items:center;gap:10px;width:100%;padding:9px 10px;font-size:13.5px;font-weight:500;transition:all .15s;display:flex;position:relative}.sidebarItem:hover{color:var(--text2);background:#ffffff0a}.sidebarItemActive{color:var(--text);background:#ffffff0f;font-weight:700}.sidebarEmoji{text-align:center;flex-shrink:0;width:20px;font-size:16px}.sidebarDot{border-radius:50%;flex-shrink:0;width:6px;height:6px;margin-left:auto}.sidebarUploadBtn{background:linear-gradient(135deg, var(--accent), #c4206d);color:#fff;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:10px 14px;font-size:13px;font-weight:700;transition:opacity .15s;display:flex;box-shadow:0 4px 16px #ff2d8740}.sidebarUploadBtn:hover{opacity:.88}.appMain{flex-direction:column;flex:1;min-width:0;height:100dvh;display:flex;overflow-y:auto}.appHeader{z-index:20;-webkit-backdrop-filter:blur(24px);border-bottom:1px solid var(--border);background:#060610f5;padding:14px 20px 12px;position:sticky;top:0}.mobileLogo{font-family:var(--font-display);letter-spacing:-.03em;align-items:baseline;gap:1px;margin-bottom:12px;font-size:22px;font-weight:800;display:none}.headerRow{align-items:center;gap:10px;display:flex}.searchWrap{background:var(--surface);border:1px solid var(--border);border-radius:12px;flex:1;align-items:center;gap:8px;min-width:0;padding:10px 14px;transition:border-color .15s,box-shadow .15s;display:flex}.searchWrap:focus-within{border-color:#ff2d8766;box-shadow:0 0 0 3px #ff2d8714}.uploadBtn{background:linear-gradient(135deg, var(--accent), #c4206d);color:#fff;white-space:nowrap;border-radius:10px;flex-shrink:0;align-items:center;gap:6px;padding:9px 16px;font-size:13px;font-weight:700;transition:opacity .15s;display:flex;box-shadow:0 4px 14px #ff2d874d}.uploadBtn:hover{opacity:.88}.mobileChips{scrollbar-width:none;-ms-overflow-style:none;flex-wrap:nowrap;gap:6px;margin-top:10px;padding-bottom:2px;display:none;overflow-x:auto}.mobileChips::-webkit-scrollbar{display:none}.chip{cursor:pointer;border:1px solid var(--border);color:var(--muted);white-space:nowrap;background:#ffffff08;border-radius:999px;flex-shrink:0;align-items:center;padding:6px 14px;font-size:12.5px;font-weight:600;transition:all .15s;display:inline-flex}.chip:hover{border-color:var(--border-hover);color:var(--text2)}.soundList{flex-direction:column;gap:4px;padding:12px 12px 120px;display:flex}.soundRow{border:1px solid var(--border);cursor:pointer;background:var(--card);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;border-radius:14px;align-items:center;gap:12px;padding:12px 14px;transition:background .15s,border-color .15s,box-shadow .2s,transform .15s;display:flex;position:relative;overflow:hidden}.soundRow:before{content:"";background:0 0;border-radius:14px 0 0 14px;width:3px;transition:background .2s;position:absolute;top:0;bottom:0;left:0}.soundRow:hover{background:var(--card-hover);border-color:var(--border-hover);transform:translateY(-1px);box-shadow:0 6px 24px #00000059}.soundRow:active{transform:scale(.99)}.soundRow:hover .avatarOverlay{opacity:1}.soundRow.isPlaying{background:var(--card-hover);border-color:#ffffff1a}.rowAvatar{border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:46px;height:46px;transition:box-shadow .2s;display:flex;position:relative}.avatarOverlay{opacity:0;background:#0009;border-radius:12px;justify-content:center;align-items:center;transition:opacity .15s;display:flex;position:absolute;inset:0}.rowInfo{flex:1;min-width:0;overflow:hidden}.rowName{text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-size:14px;font-weight:700;line-height:1.3;transition:color .15s;overflow:hidden}.rowCat{opacity:.85;align-items:center;gap:4px;margin-top:3px;font-size:11.5px;font-weight:600;display:inline-flex}.rowWaveform{flex-shrink:0;overflow:hidden}.rowDur{color:var(--muted);font-size:11px;font-family:var(--font-data);flex-shrink:0}.rowActions{flex-shrink:0;align-items:center;gap:2px;margin-left:4px;display:flex}.actionBtn{color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;gap:3px;min-width:36px;padding:7px 8px;transition:all .15s;display:flex}.actionBtn:hover{color:var(--text2);background:#ffffff12}.actionCount{font-size:11px;font-family:var(--font-data);font-weight:700;line-height:1}.dlBtn{background:linear-gradient(135deg, var(--accent), #c4206d);cursor:pointer;border:none;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;transition:opacity .15s,transform .15s;display:flex;box-shadow:0 3px 12px #ff2d874d}.dlBtn:hover{opacity:.88;transform:scale(1.05)}.dlBtn:active{transform:scale(.95)}.playerBar{-webkit-backdrop-filter:blur(28px);border-top:1px solid var(--border);z-index:30;background:#04040ef7;align-items:center;gap:14px;height:70px;padding:0 20px;display:flex;position:fixed;bottom:0;left:220px;right:0}.playerAvatar{border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:42px;height:42px;display:flex}.playerInfo{flex-shrink:0;min-width:0;max-width:160px}.playerName{text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:700;overflow:hidden}.playerCat{color:var(--muted);margin-top:2px;font-size:11px}.playerCanvas{flex:1;min-width:0;height:36px}.playerStop{cursor:pointer;border:none;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;transition:opacity .15s,transform .15s;display:flex}.playerStop:hover{opacity:.85;transform:scale(1.06)}.waveBar{transform-origin:50%;animation:.75s ease-in-out infinite waveAnim}@keyframes waveAnim{0%,to{transform:scaleY(.2)}50%{transform:scaleY(1)}}@keyframes glowPulse{0%,to{box-shadow:0 0 #0000}50%{box-shadow:var(--playing-glow,0 0 20px #ff2d8740)}}input[type=range]{appearance:none;cursor:pointer;background:#ffffff1a;border-radius:4px;height:4px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent);cursor:pointer;border-radius:50%;width:14px;height:14px;box-shadow:0 0 6px #ff2d8780}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff14;border-radius:6px}@media (max-width:900px){.appSidebar{width:180px}.playerBar{left:180px}}@media (max-width:768px){.appSidebar{display:none}.mobileLogo,.mobileChips{display:flex}.playerBar{left:0}.playerInfo{max-width:120px}.volSliderWrap{display:none}}@media (max-width:600px){.appHeader{padding:12px 14px 10px}.soundList{gap:3px;padding:8px 8px 110px}.soundRow{gap:10px;padding:11px 12px}.rowWaveform,.rowDur{display:none}.rowAvatar{width:42px;height:42px}.rowName{font-size:13.5px}.hideOnMobile{display:none!important}.playerBar{gap:10px;height:64px;padding:0 14px}.playerInfo{max-width:110px}.dlBtn{border-radius:9px;width:34px;height:34px}.rowActions{gap:0}.actionBtn{min-width:32px;padding:6px}}@media (max-width:420px){.soundRow{gap:9px;padding:10px}.uploadBtn{padding:8px 12px;font-size:12px}}@media (prefers-reduced-motion:reduce){.waveBar{animation:none}.soundRow{transition:none}}