@import"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css";.visualizer-container[data-v-24d38b80]{position:relative;width:100%;height:calc(100vh - 60px);display:flex;background-color:#f5f5f0;overflow:hidden}.audio-players-panel[data-v-24d38b80]{width:250px;background-color:#fff;border-right:1px solid #e0e0e0;padding:15px;display:flex;flex-direction:column;gap:15px;box-shadow:2px 0 5px #0000000d;z-index:10}.audio-players-panel h3[data-v-24d38b80]{margin-top:0;color:#333;font-size:1.1em;border-bottom:1px solid #eee;padding-bottom:10px}.source-controls[data-v-24d38b80]{display:flex;flex-direction:column;gap:10px}.add-player[data-v-24d38b80]{display:flex;gap:5px}.add-player input[data-v-24d38b80]{flex-grow:1;padding:8px;border:1px solid #ccc;border-radius:4px;font-size:.9em}.add-player button[data-v-24d38b80]{padding:8px 12px;background-color:#4a90e2;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:.9em;transition:background-color .2s ease}.add-player button[data-v-24d38b80]:hover{background-color:#357abd}.player-list[data-v-24d38b80]{display:flex;flex-direction:column;gap:5px;max-height:calc(100vh - 250px);overflow-y:auto}.player-item[data-v-24d38b80]{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;background-color:#f9f9f9;border:1px solid #eee;border-radius:4px;cursor:pointer;transition:background-color .2s ease,border-color .2s ease;font-size:.9em}.player-item[data-v-24d38b80]:hover{background-color:#f0f0f0;border-color:#ddd}.player-item.selected[data-v-24d38b80]{background-color:#e6f7ff;border-color:#91d5ff;font-weight:700}.player-item .remove-btn[data-v-24d38b80]{background:none;border:none;color:#e57373;cursor:pointer;font-size:1.2em;padding:0 5px;transition:color .2s ease}.player-item .remove-btn[data-v-24d38b80]:hover{color:#ef5350}.visualizer[data-v-24d38b80]{flex-grow:1;display:block}.controls[data-v-24d38b80]{position:absolute;top:15px;right:15px;background-color:#ffffffe6;padding:15px;border-radius:8px;box-shadow:0 2px 8px #0000001a;z-index:10;display:flex;flex-direction:column;gap:10px;align-items:flex-start}.controls h3[data-v-24d38b80]{margin:0 0 5px;color:#333;font-size:1.2em}.webgl-notification[data-v-24d38b80]{position:absolute;top:20px;right:20px;background-color:#ffc107e6;color:#856404;padding:8px 12px;border-radius:6px;font-size:.85em;box-shadow:0 2px 8px #00000026;z-index:50;display:flex;align-items:center;gap:6px;transition:opacity .3s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.webgl-notification .notification-icon[data-v-24d38b80]{font-size:1em}.webgl-notification .notification-text[data-v-24d38b80]{font-weight:500}.action-button[data-v-24d38b80]{padding:10px 15px;background-color:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:1em;transition:background-color .2s ease}.action-button[data-v-24d38b80]:hover{background-color:#0056b3}.action-button.small[data-v-24d38b80]{padding:5px 10px;font-size:.8em}.audio-controls[data-v-24d38b80]{display:flex;gap:10px;margin-top:5px}.audio-player[data-v-5b71246a]{position:relative;padding:10px;border-radius:8px;margin-bottom:5px;background-color:#f2f0eb80;transition:all var(--transition-speed) var(--transition-easing);border:1px solid var(--border-color);cursor:pointer}.audio-player[data-v-5b71246a]:hover{background-color:#f2f0ebcc;transform:translateY(-2px)}.player-container[data-v-5b71246a]{display:flex;flex-direction:column;gap:.2rem}.player-controls[data-v-5b71246a]{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:5px}.player-icon[data-v-5b71246a]{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:100px;height:100px;position:relative}.filename-display[data-v-5b71246a]{font-size:1.1rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;padding:0 .1rem;color:var(--text-color)}.name-strip[data-v-5b71246a]{background-color:#f2f0eb80;padding:4px 8px;border-radius:4px;margin-bottom:6px}.audio-icon-large[data-v-5b71246a]{display:inline-block;width:100px;height:100px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%238a9e86' d='M499.1 6.3c8.1 6 12.9 15.6 12.9 25.7v72V368c0 44.2-43 80-96 80s-96-35.8-96-80s43-80 96-80c11.2 0 22 1.6 32 4.6V147L192 223.8V432c0 44.2-43 80-96 80s-96-35.8-96-80s43-80 96-80c11.2 0 22 1.6 32 4.6V200 128c0-14.1 9.3-26.6 22.8-30.7l320-96c9.7-2.9 20.2-1.1 28.3 5z'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center;transition:background-image .3s ease;border-radius:8px}.player-content[data-v-5b71246a]{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;min-width:120px}.bottom-controls[data-v-5b71246a]{display:flex;align-items:center;gap:.8rem;flex-direction:column}.file-header[data-v-5b71246a]{display:flex;align-items:center;margin-bottom:4px}.file-name[data-v-5b71246a]{font-weight:500;word-break:break-word;color:var(--text-color)}.volume-control[data-v-5b71246a]{width:80px;padding:.2rem 0}.volume-slider[data-v-5b71246a]{width:100%;height:4px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--border-color);outline:none;border-radius:2px;transition:all .2s}.volume-slider[data-v-5b71246a]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:var(--primary-color);cursor:pointer}.volume-slider[data-v-5b71246a]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--primary-color);cursor:pointer;border:none}.action-button[data-v-5b71246a]{width:30px;height:30px;display:flex;align-items:center;justify-content:center;background-color:var(--surface-color);color:var(--text-color);border:1px solid var(--border-color);border-radius:50%;cursor:pointer;transition:all var(--transition-speed) var(--transition-easing);opacity:1}.action-button[data-v-5b71246a]:disabled{opacity:.6;cursor:not-allowed}.action-button[data-v-5b71246a]:hover{background-color:var(--primary-color);color:var(--background-color);border-color:var(--primary-color)}.select-button[data-v-5b71246a]{background-color:var(--surface-color-alt)}.select-icon[data-v-5b71246a]{display:inline-block;width:14px;height:14px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%235e503f' d='M40 48C26.7 48 16 58.7 16 72v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V72c0-13.3-10.7-24-24-24H40zM192 64c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zM16 232v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V232c0-13.3-10.7-24-24-24H40c-13.3 0-24 10.7-24 24zM40 368c-13.3 0-24 10.7-24 24v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V392c0-13.3-10.7-24-24-24H40z'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center}.play-icon[data-v-5b71246a],.pause-icon[data-v-5b71246a]{display:inline-block;width:16px;height:16px;background-size:contain;background-repeat:no-repeat;background-position:center}.loading-indicator[data-v-5b71246a]{display:flex;align-items:center;margin-top:0rem;position:absolute;top:0;left:0;right:0;z-index:1000;width:100%;height:100%;background-color:#8a9e8699}.spinner[data-v-5b71246a]{width:25px;height:25px;border:2px solid rgba(138,158,134,.3);border-radius:50%;border-top-color:var(--primary-color);animation:spin-5b71246a 1s infinite linear;margin-right:12px;margin-top:2rem}.button-spinner[data-v-5b71246a]{width:14px;height:14px;border:2px solid rgba(138,158,134,.3);border-radius:50%;border-top-color:var(--primary-color);animation:spin-5b71246a 1s infinite linear}@keyframes spin-5b71246a{to{transform:rotate(360deg)}}.error-message[data-v-5b71246a]{position:absolute;top:-60px;left:0;right:0;z-index:1000;color:var(--error-color);display:flex;align-items:center;font-size:.8rem;background-color:#e639461a;padding:.5rem .8rem;border-radius:6px;box-shadow:0 4px 12px #00000026}.error-icon[data-v-5b71246a]{font-size:1rem;margin-right:10px}.loading-info[data-v-5b71246a]{display:flex;flex-direction:column;flex:1}.progress-bar[data-v-5b71246a]{height:4px;width:100%;background-color:#8a9e8633;border-radius:2px;margin-top:4px;overflow:hidden}.progress-fill[data-v-5b71246a]{height:100%;background-color:#fff;border-radius:2px;transition:width .3s ease}.tags-section[data-v-5b71246a]{margin-top:0;padding:8px 12px;background-color:#ffffff0d;border-radius:8px;border-top:1px solid rgba(255,255,255,.1)}.tag-group[data-v-5b71246a]{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-start;max-height:60px;overflow:hidden}.tag-chip[data-v-5b71246a]{display:inline-block;padding:2px 8px;font-size:.65rem;border-radius:12px;cursor:pointer;transition:all .2s ease;border:1px solid rgba(0,0,0,.1);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.tag-chip[data-v-5b71246a]:hover{transform:translateY(-1px);box-shadow:0 2px 6px #00000014;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.tag-mood[data-v-5b71246a]{background-color:#c8beb466;color:#786450e6;border-color:#c8beb44d}.tag-scene[data-v-5b71246a]{background-color:#bec8b466;color:#647850e6;border-color:#bec8b44d}.tag-tone[data-v-5b71246a]{background-color:#d2c8be66;color:#826e5ae6;border-color:#d2c8be4d}.tag-usage[data-v-5b71246a]{background-color:#dcd2be66;color:#8c785ae6;border-color:#dcd2be4d}.tag-intensity[data-v-5b71246a]{background-color:#c8c3b966;color:#786e5fe6;border-color:#c8c3b94d}.tag-more[data-v-5b71246a]{font-size:.7rem;color:var(--text-color);opacity:.7;font-style:italic}@media (max-width: 768px){.player-controls[data-v-5b71246a]{gap:1rem}.tags-section[data-v-5b71246a]{padding:6px 8px}.tag-group[data-v-5b71246a]{gap:4px}}.audio-tag-filter[data-v-633ab317]{background:var(--surface-color);border-radius:16px;padding:20px;box-shadow:var(--box-shadow-sm);transition:all var(--transition-speed) var(--transition-easing);max-height:600px;overflow-y:scroll}.audio-tag-filter.narrow-mode[data-v-633ab317]{padding:8px;background:var(--surface-alt-color);max-height:none;overflow-y:visible}.filter-header[data-v-633ab317]{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.filter-header h3[data-v-633ab317]{margin:0;font-size:18px;font-weight:500;color:var(--text-color)}.header-buttons[data-v-633ab317]{display:flex;gap:8px;align-items:center}.narrow-layout[data-v-633ab317]{display:flex;flex-direction:column;gap:6px;height:auto}.first-row[data-v-633ab317]{display:flex;align-items:center;gap:8px;padding:4px 0}.second-row[data-v-633ab317]{padding:4px 0}.group-selector-narrow[data-v-633ab317]{flex:1;display:flex;justify-content:center}.custom-select[data-v-633ab317]{position:relative;background:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;cursor:pointer;transition:all var(--transition-speed) var(--transition-easing);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);min-width:120px;z-index:999}.custom-select.wide[data-v-633ab317]{flex:1;border-radius:8px;padding:8px 12px;font-size:14px}.custom-select[data-v-633ab317]:not(.wide){padding:4px 12px;font-size:12px}.custom-select[data-v-633ab317]:hover{border-color:var(--primary-color)}.custom-select.open[data-v-633ab317]{border-color:var(--primary-color);box-shadow:0 0 10px rgba(var(--primary-rgb),.1)}.select-display[data-v-633ab317]{display:flex;justify-content:space-between;align-items:center;color:var(--text-color)}.dropdown-arrow[data-v-633ab317]{transition:transform var(--transition-speed) var(--transition-easing);color:var(--secondary-text);font-size:10px}.dropdown-arrow.open[data-v-633ab317]{transform:rotate(180deg)}.dropdown-options[data-v-633ab317]{position:absolute;top:100%;left:0;right:0;background:var(--surface-color);border:1px solid var(--border-color);border-radius:8px;box-shadow:var(--box-shadow-lg);z-index:1000;max-height:200px;overflow-y:auto;margin-top:2px}.dropdown-option[data-v-633ab317]{padding:8px 12px;cursor:pointer;transition:all var(--transition-speed) var(--transition-easing);color:var(--text-color);font-size:inherit}.dropdown-option[data-v-633ab317]:hover{background:var(--surface-alt-color)}.dropdown-option.selected[data-v-633ab317]{background:var(--primary-color);color:var(--surface-color)}.dropdown-option.selected[data-v-633ab317]:hover{background:var(--accent-color)}.quick-nav-buttons[data-v-633ab317]{display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-start}.nav-btn[data-v-633ab317]{background:var(--surface-color);border:1px solid var(--border-color);border-radius:10px;padding:3px 8px;font-size:11px;color:var(--text-color);cursor:pointer;transition:all var(--transition-speed) var(--transition-easing);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.nav-btn[data-v-633ab317]:hover{background:var(--surface-color);border-color:var(--primary-color);transform:translateY(-1px)}.nav-btn.selected[data-v-633ab317]{background:var(--primary-color);color:var(--surface-color);border-color:var(--primary-color);box-shadow:var(--box-shadow-sm)}.mode-toggle-btn[data-v-633ab317]{background:var(--primary-color);color:var(--surface-color);border:none;border-radius:10px;padding:6px 12px;font-size:11px;cursor:pointer;transition:all var(--transition-speed) var(--transition-easing);box-shadow:var(--box-shadow-sm)}.mode-toggle-btn[data-v-633ab317]:hover{background:var(--accent-color);transform:translateY(-1px);box-shadow:var(--box-shadow-lg)}.mode-toggle-btn.narrow[data-v-633ab317]{background:var(--accent-color);box-shadow:var(--box-shadow-sm)}.mode-toggle-btn.narrow[data-v-633ab317]:hover{background:var(--primary-color);box-shadow:var(--box-shadow-lg)}.clear-all-btn[data-v-633ab317]{background:var(--error-color);color:var(--surface-color);border:none;border-radius:10px;padding:6px 12px;font-size:11px;cursor:pointer;transition:all var(--transition-speed) var(--transition-easing);box-shadow:var(--box-shadow-sm)}.clear-all-btn[data-v-633ab317]:hover:not(:disabled){background:var(--error-color);transform:translateY(-1px);box-shadow:var(--box-shadow-lg);opacity:.9}.clear-all-btn[data-v-633ab317]:disabled{background:var(--border-color);cursor:not-allowed;box-shadow:none}.clear-all-btn.compact[data-v-633ab317]{padding:4px 8px;font-size:10px}.search-container[data-v-633ab317]{margin-bottom:20px}.search-input[data-v-633ab317]{width:100%;padding:12px 16px;border:2px solid var(--border-color);border-radius:12px;font-size:14px;background:var(--surface-color);transition:all var(--transition-speed) var(--transition-easing);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.search-input[data-v-633ab317]:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 10px rgba(var(--primary-rgb),.1)}.group-selector[data-v-633ab317]{margin-bottom:16px;display:flex;align-items:center;gap:8px}.group-selector label[data-v-633ab317]{font-size:14px;font-weight:500;color:var(--text-color);white-space:nowrap}.filter-sections[data-v-633ab317]{margin-bottom:20px}.filter-section[data-v-633ab317]{margin-bottom:16px;border:1px solid var(--border-color);border-radius:12px;overflow:hidden;background:var(--surface-color);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.section-header[data-v-633ab317]{background:var(--surface-color);padding:12px 16px;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all var(--transition-speed) var(--transition-easing)}.section-header[data-v-633ab317]:hover{background:var(--surface-alt-color)}.section-title[data-v-633ab317]{font-weight:500;color:var(--text-color);flex:1}.section-count[data-v-633ab317]{color:var(--secondary-text);font-size:12px}.collapse-icon[data-v-633ab317]{transition:transform var(--transition-speed) var(--transition-easing);color:var(--secondary-text);font-size:12px}.collapse-icon.collapsed[data-v-633ab317]{transform:rotate(-90deg)}.tags-list[data-v-633ab317]{background:var(--surface-color);padding:12px;display:flex;flex-wrap:wrap;gap:8px;border-top:1px solid var(--border-color)}.tag-item[data-v-633ab317]{display:flex;align-items:center;gap:4px;padding:6px 12px;background:var(--surface-alt-color);border:1px solid transparent;border-radius:16px;cursor:pointer;font-size:13px;transition:all var(--transition-speed) var(--transition-easing);-webkit-user-select:none;user-select:none;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.tag-item[data-v-633ab317]:hover{background:var(--surface-color-alt);transform:translateY(-1px)}.tag-item.selected[data-v-633ab317]{background:var(--primary-color);color:var(--surface-color);border-color:var(--primary-color);box-shadow:var(--box-shadow-sm)}.tag-item.selected[data-v-633ab317]:hover{background:var(--accent-color)}.tag-name[data-v-633ab317]{font-weight:400}.tag-count[data-v-633ab317]{font-size:11px;opacity:.8;font-weight:300}.tag-item.selected .tag-count[data-v-633ab317]{opacity:.9}.active-filters[data-v-633ab317]{border-top:1px solid var(--border-color);padding-top:16px}.active-filters h4[data-v-633ab317]{margin:0 0 12px;font-size:14px;font-weight:500;color:var(--text-color)}.active-tags[data-v-633ab317]{display:flex;flex-direction:column;gap:8px}.active-dimension[data-v-633ab317]{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.dimension-label[data-v-633ab317]{font-size:12px;font-weight:500;color:var(--secondary-text);min-width:40px}.active-tag[data-v-633ab317]{background:var(--primary-color);color:var(--surface-color);padding:4px 8px;border-radius:12px;font-size:11px;cursor:pointer;transition:all var(--transition-speed) var(--transition-easing);-webkit-user-select:none;user-select:none;box-shadow:var(--box-shadow-sm)}.active-tag[data-v-633ab317]:hover{background:var(--error-color);transform:scale(1.05);box-shadow:var(--box-shadow-lg)}@media (max-width: 768px){.audio-tag-filter[data-v-633ab317]{padding:12px}.audio-tag-filter.narrow-mode[data-v-633ab317]{padding:6px}.filter-header[data-v-633ab317]{flex-direction:column;align-items:flex-start;gap:12px}.first-row[data-v-633ab317]{flex-wrap:wrap;gap:4px}.group-selector-narrow .custom-select[data-v-633ab317]{font-size:10px;padding:3px 8px;min-width:100px}.nav-btn[data-v-633ab317]{font-size:10px;padding:2px 6px}.mode-toggle-btn[data-v-633ab317],.clear-all-btn.compact[data-v-633ab317]{font-size:10px;padding:3px 6px}.tags-list[data-v-633ab317]{padding:8px;gap:6px}.tag-item[data-v-633ab317]{font-size:12px;padding:4px 8px}.active-dimension[data-v-633ab317]{flex-direction:column;align-items:flex-start}}.audio-player-list[data-v-2245b5ec]{position:relative;width:100%;display:flex;flex-direction:column;gap:.5rem;border:1px solid var(--border-color);border-radius:12px;padding:1rem;background-color:var(--surface-color);box-shadow:0 3px 10px var(--shadow-color);height:100%;overflow:hidden}.empty-state[data-v-2245b5ec]{padding:2rem;text-align:center;color:var(--secondary-text);background-color:#f2f0eb4d;border-radius:8px;font-style:italic}.file-list[data-v-2245b5ec]{display:flex;flex-direction:column;gap:1rem;width:100%;max-height:calc(100vh - 320px);overflow-y:auto;scrollbar-width:thin;padding:10px;scrollbar-color:rgba(156,156,156,.5) transparent}.file-list[data-v-2245b5ec]::-webkit-scrollbar{width:6px;background-color:transparent}.file-list[data-v-2245b5ec]::-webkit-scrollbar-thumb{background-color:#9c9c9c80;border-radius:6px}.file-list[data-v-2245b5ec]::-webkit-scrollbar-thumb:hover{background-color:#9c9c9cb3}.section[data-v-2245b5ec]{display:flex;flex-direction:column;gap:.5rem;width:100%}.audio-type-title[data-v-2245b5ec]{font-size:1.1rem;font-weight:600;color:var(--text-color);margin-bottom:.5rem;padding-bottom:.3rem;border-bottom:1px solid var(--border-color-light)}.grid-container[data-v-2245b5ec]{display:grid;gap:1rem;width:100%}.grid-item[data-v-2245b5ec]{min-width:0}.audio-tags[data-v-2245b5ec]{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.5rem}.tag-dimension[data-v-2245b5ec]{display:flex;gap:.2rem}.audio-tag[data-v-2245b5ec]{font-size:.7rem;padding:.1rem .4rem;border-radius:10px;background-color:#0000001a;color:var(--secondary-text)}.audio-tag.tag-mood[data-v-2245b5ec]{background-color:#ff638433}.audio-tag.tag-scene[data-v-2245b5ec]{background-color:#36a2eb33}.audio-tag.tag-tone[data-v-2245b5ec]{background-color:#ffce5633}.audio-tag.tag-usage[data-v-2245b5ec]{background-color:#4bc0c033}.audio-tag.tag-intensity[data-v-2245b5ec]{background-color:#96f3}.more-tags[data-v-2245b5ec]{font-size:.7rem;color:var(--secondary-text)}.playlist-modal-overlay[data-v-93378af5]{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.playlist-modal[data-v-93378af5]{width:80%;max-width:500px;background-color:var(--background-color);border-radius:8px;box-shadow:0 4px 12px #00000026;display:flex;flex-direction:column;max-height:80vh}.playlist-modal-header[data-v-93378af5]{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid var(--border-color)}.playlist-modal-header h4[data-v-93378af5]{margin:0;font-size:18px;color:var(--primary-text)}.close-btn[data-v-93378af5]{background:none;border:none;font-size:24px;cursor:pointer;color:var(--secondary-text)}.playlist-modal-content[data-v-93378af5]{padding:16px;overflow-y:auto;flex-grow:1}.no-playlists[data-v-93378af5]{text-align:center;color:var(--secondary-text);padding:20px}.hint[data-v-93378af5]{font-size:14px;margin-top:8px;color:var(--tertiary-text)}.playlist-list-container[data-v-93378af5]{display:flex;flex-direction:column;gap:8px}.playlist-list-item[data-v-93378af5]{display:flex;justify-content:space-between;align-items:center;padding:12px;border-radius:6px;border:1px solid var(--border-color);background-color:var(--card-background);transition:all .2s ease}.playlist-list-item[data-v-93378af5]:hover{border-color:var(--primary-color-light)}.playlist-name[data-v-93378af5]{font-weight:500;color:var(--primary-text)}.playlist-actions[data-v-93378af5]{display:flex;gap:8px;max-width:80px}.primary-btn[data-v-93378af5]{background-color:var(--primary-color);color:#fff;border:none;border-radius:4px;padding:6px 12px;cursor:pointer;font-size:14px}.secondary-btn[data-v-93378af5]{background-color:var(--card-background);color:var(--primary-text);border:1px solid var(--border-color);border-radius:4px;padding:6px 12px;cursor:pointer;font-size:14px}.danger-btn[data-v-93378af5]{background-color:var(--danger-color);color:#fff;border:none;border-radius:4px;padding:6px 12px;cursor:pointer;font-size:14px}.playlist-modal-actions[data-v-93378af5]{padding:16px;display:flex;justify-content:flex-end;gap:8px;border-top:1px solid var(--border-color)}.delete-confirm-dialog[data-v-93378af5]{max-width:400px}.warning-text[data-v-93378af5]{color:var(--danger-color);font-size:14px;margin-top:8px}.playlist-group[data-v-93378af5]{margin-bottom:24px}.playlist-group-title[data-v-93378af5]{font-size:16px;margin-top:0;margin-bottom:12px;color:var(--primary-text);font-weight:500;padding-bottom:6px;border-bottom:1px solid var(--border-color-light)}.builtin-playlist[data-v-93378af5]{background-color:var(--card-background);border-left:3px solid var(--primary-color)}.user-playlist[data-v-93378af5]{background-color:var(--card-background);border-left:3px solid var(--secondary-color)}.playlist-info[data-v-93378af5]{display:flex;align-items:center;gap:12px;flex:1}.playlist-icon[data-v-93378af5]{width:40px;height:40px;border-radius:4px;overflow:hidden;flex-shrink:0}.playlist-icon img[data-v-93378af5]{width:100%;height:100%;object-fit:cover}.playlist-details[data-v-93378af5]{display:flex;flex-direction:column;gap:4px}.playlist-description[data-v-93378af5]{margin:0;font-size:12px;color:var(--secondary-text);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.3}.audio-playlist-control[data-v-da16c2ed]{display:flex;flex-direction:column;height:100%;background:var(--surface-color);border-radius:12px;overflow:hidden;box-shadow:var(--box-shadow-sm)}.playlist-header[data-v-da16c2ed]{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;background:var(--surface-color);color:var(--text-color)}.playlist-header h3[data-v-da16c2ed]{margin:0;font-size:1.1rem;font-weight:500;letter-spacing:.5px}.playlist-stats[data-v-da16c2ed]{font-size:.9rem;color:var(--secondary-text);padding:.25rem .75rem;border-radius:20px}.save-playlist-btn[data-v-da16c2ed]{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--secondary-text);padding:.25rem;border-radius:4px;transition:all var(--transition-speed) var(--transition-easing);opacity:.7}.save-playlist-btn[data-v-da16c2ed]:hover:not(:disabled){opacity:1;background:rgba(var(--success-rgb),.1);color:var(--success-color)}.save-playlist-btn[data-v-da16c2ed]:disabled{opacity:.3;cursor:not-allowed}.playlist-manager-btn[data-v-da16c2ed]{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--secondary-text);padding:.25rem;border-radius:4px;transition:all var(--transition-speed) var(--transition-easing);opacity:.7}.playlist-manager-btn[data-v-da16c2ed]:hover{opacity:1;background:rgba(var(--primary-rgb),.1);color:var(--primary-color)}.playlist-content[data-v-da16c2ed]{flex:1;overflow-y:auto;padding:.5rem}.empty-playlist[data-v-da16c2ed]{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;color:var(--secondary-text);text-align:center}.empty-icon[data-v-da16c2ed]{font-size:3rem;margin-bottom:1rem;opacity:.5}.playlist-items[data-v-da16c2ed]{display:flex;flex-direction:column;gap:.5rem;flex:1}.playlist-item[data-v-da16c2ed]{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:var(--surface-alt-color);border-radius:8px;border:1px solid var(--border-color);transition:all var(--transition-speed) var(--transition-easing)}.playlist-item[data-v-da16c2ed]:hover{background:#8a9e8626;box-shadow:var(--box-shadow-sm)}.item-icon[data-v-da16c2ed]{font-size:1.5rem;opacity:.7}.item-info[data-v-da16c2ed]{flex:1;min-width:0}.item-name[data-v-da16c2ed]{font-weight:500;color:var(--text-color);font-size:.9rem;line-height:1.3;word-break:break-all}.item-status[data-v-da16c2ed]{margin-top:.25rem}.status-indicator[data-v-da16c2ed]{font-size:.75rem;padding:.125rem .5rem;border-radius:12px;font-weight:500}.status-indicator.ready[data-v-da16c2ed]{background:#2a9d8f26;color:var(--success-color)}.status-indicator.playing[data-v-da16c2ed]{background:#2a9d8f40;color:var(--primary-color)}.status-indicator.loading[data-v-da16c2ed]{background:#a9846726;color:var(--accent-color)}.status-indicator.error[data-v-da16c2ed]{background:#e6394626;color:var(--error-color)}.remove-btn[data-v-da16c2ed]{background:none;border:none;color:var(--secondary-text);font-size:1.5rem;cursor:pointer;padding:.25rem;border-radius:4px;transition:all var(--transition-speed) var(--transition-easing);opacity:.6}.remove-btn[data-v-da16c2ed]:hover{background:#e639461a;color:var(--error-color);opacity:1}.playlist-controls[data-v-da16c2ed]{padding:1rem 1.25rem;background:var(--surface-color);border-top:1px solid var(--border-color)}.master-controls[data-v-da16c2ed]{margin-bottom:1rem}.play-all-btn[data-v-da16c2ed]{width:100%;padding:.75rem 1rem;background:var(--primary-color);color:#fff;border:none;border-radius:8px;font-size:.9rem;font-weight:500;cursor:pointer;transition:background-color var(--transition-speed) var(--transition-easing);display:flex;align-items:center;justify-content:center;gap:.5rem}.play-all-btn[data-v-da16c2ed]:hover:not(:disabled){background:var(--accent-color);box-shadow:var(--box-shadow-sm)}.play-all-btn[data-v-da16c2ed]:disabled{background:var(--secondary-text);opacity:.5;cursor:not-allowed}.play-all-btn.active[data-v-da16c2ed]{background:var(--accent-color)}.volume-control[data-v-da16c2ed]{display:flex;width:100%;flex-direction:row;align-items:center;gap:.75rem}.volume-label[data-v-da16c2ed]{min-width:60px;font-size:.9rem;align-items:center;color:var(--text-color);font-weight:500;margin-bottom:0}.volume-slider-container[data-v-da16c2ed]{flex-grow:1;display:flex;align-items:center;gap:.75rem}.volume-slider[data-v-da16c2ed]{width:100%;height:4px;background:var(--border-color);border-radius:2px;outline:none;cursor:pointer;-webkit-appearance:none}.volume-slider[data-v-da16c2ed]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:var(--primary-color);border-radius:50%;cursor:pointer;transition:all var(--transition-speed) var(--transition-easing)}.volume-slider[data-v-da16c2ed]::-webkit-slider-thumb:hover{background:var(--accent-color)}.volume-slider[data-v-da16c2ed]::-moz-range-thumb{width:16px;height:16px;background:var(--primary-color);border-radius:50%;cursor:pointer;border:none;transition:all var(--transition-speed) var(--transition-easing)}.volume-slider[data-v-da16c2ed]::-moz-range-thumb:hover{background:var(--accent-color)}.volume-value[data-v-da16c2ed]{font-size:.8rem;color:var(--secondary-text);font-weight:500;width:20px;text-align:right}.playlist-content[data-v-da16c2ed]::-webkit-scrollbar{width:6px}.playlist-content[data-v-da16c2ed]::-webkit-scrollbar-track{background:var(--border-color);border-radius:3px}.playlist-content[data-v-da16c2ed]::-webkit-scrollbar-thumb{background:var(--secondary-text);border-radius:3px}.playlist-content[data-v-da16c2ed]::-webkit-scrollbar-thumb:hover{background:var(--primary-color)}.app-container[data-v-837a58d1]{display:flex;flex-direction:column;min-height:100vh;background-color:var(--background-color);width:100%;margin:0 auto;padding:0;position:relative;overflow:hidden}header[data-v-837a58d1]{padding:1.5rem;text-align:center;margin-bottom:1rem;position:absolute;top:0;left:0;right:0;z-index:10;background-color:transparent}.header-content[data-v-837a58d1]{display:flex;justify-content:flex-start;align-items:center;padding:0 1rem}.language-switcher[data-v-837a58d1]{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background-color:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:20px;color:var(--text-color);font-size:.9rem;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.language-switcher[data-v-837a58d1]:hover{background-color:#fff3;border-color:#ffffff4d;transform:translateY(-1px)}.language-icon[data-v-837a58d1]{font-size:1rem}.language-text[data-v-837a58d1]{font-weight:500}h1[data-v-837a58d1]{font-size:1.8rem;font-weight:300;letter-spacing:1.5px;color:var(--primary-text);margin:0}.visualizer-container[data-v-837a58d1]{position:absolute;top:0;left:0;width:100%;height:100vh;z-index:1}label[data-v-837a58d1]{font-size:.9rem;font-weight:300;letter-spacing:.5px;color:var(--secondary-text);margin-bottom:.3rem}input[type=range][data-v-837a58d1]{margin:0;width:100%;background-color:var(--surface-alt-color);height:5px;border-radius:5px;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;transition:all var(--transition-speed) var(--transition-easing)}input[type=range][data-v-837a58d1]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:15px;height:15px;border-radius:50%;background:var(--primary-color);cursor:pointer;transition:background var(--transition-speed) var(--transition-easing)}input[type=range][data-v-837a58d1]::-moz-range-thumb{width:15px;height:15px;border:none;border-radius:50%;background:var(--primary-color);cursor:pointer;transition:background var(--transition-speed) var(--transition-easing)}input[type=range][data-v-837a58d1]::-webkit-slider-thumb:hover{background:var(--accent-color)}input[type=range][data-v-837a58d1]::-moz-range-thumb:hover{background:var(--accent-color)}@media (max-width: 768px){.language-switcher[data-v-837a58d1]{padding:.4rem .8rem;font-size:.8rem}.language-text[data-v-837a58d1]{display:none}}@media screen and (orientation: portrait){.panel-content[data-v-837a58d1]>:first-child{flex:1}.panel-content[data-v-837a58d1]>:last-child{flex:1}}@media screen and (orientation: landscape){.panel-content[data-v-837a58d1]>:first-child{flex:1}}:root{--primary-color: #8a9e86;--accent-color: #a98467;--background-color: #f8f6f2;--surface-color: #f2f0eb;--surface-alt-color: rgba(138, 158, 134, .1);--text-color: #5e503f;--secondary-text: #6b705c;--primary-text: #5e503f;--border-color: rgba(94, 80, 63, .15);--shadow-color: rgba(0, 0, 0, .06);--transition-speed: .3s;--transition-easing: cubic-bezier(.4, 0, .2, 1);--error-color: #e63946;--success-color: #2a9d8f;--primary-rgb: 138, 158, 134;--success-rgb: 42, 157, 143;--error-rgb: 230, 57, 70;--box-shadow-lg: 0 5px 20px rgba(0, 0, 0, .1);--box-shadow-sm: 0 3px 10px rgba(0, 0, 0, .08);--icon-color: var(--primary-color);--icon-hover-color: var(--accent-color);--icon-size-sm: 16px;--icon-size-md: 24px;--icon-size-lg: 32px;--player-height: 100px;--player-icon-size: 48px;--surface-color-alt: rgba(242, 240, 235, .8)}*{box-sizing:border-box;margin:0;padding:0;transition:color var(--transition-speed) var(--transition-easing),background-color var(--transition-speed) var(--transition-easing),border-color var(--transition-speed) var(--transition-easing),box-shadow var(--transition-speed) var(--transition-easing)}body{font-family:Inter,Helvetica Neue,Arial,sans-serif;background-color:var(--background-color);color:var(--text-color);line-height:1.7;font-weight:300;letter-spacing:.3px}.app-container{position:relative;width:100%;height:100vh;overflow:hidden;margin:0;padding:0}header{padding:1.5rem;text-align:center;margin-bottom:1rem;position:fixed;top:0;left:0;right:0;z-index:10;background-color:transparent}h1{font-size:2rem;color:var(--primary-color);margin-bottom:.7rem;font-weight:300;letter-spacing:1.5px}h2{font-size:1.3rem;margin-bottom:1rem;color:var(--secondary-text);font-weight:300;letter-spacing:1px}h3{font-size:1.1rem;margin-bottom:.8rem;color:var(--secondary-text);font-weight:400;letter-spacing:.5px}.audio-type-title{font-size:1.2rem;color:var(--primary-color);font-weight:500;margin-bottom:1rem;margin-top:0;letter-spacing:.8px;text-align:center;padding-bottom:.5rem;border-bottom:1px solid var(--border-color)}.app-description{font-size:1rem;color:var(--secondary-text);max-width:700px;margin:0 auto;line-height:1.6}main{position:relative;z-index:5}@media (min-width: 768px){main{grid-template-areas:"visualizer controls";grid-template-columns:3fr 1fr;grid-template-rows:1fr}.visualizer-section{grid-area:visualizer;min-height:600px}.controls-section{grid-area:controls}}.audio-section,.controls-section,.visualizer-section{background-color:var(--surface-color);border-radius:12px;padding:1.5rem;box-shadow:0 3px 10px var(--shadow-color)}.audio-type-section{margin-bottom:2rem}.visualizer-section{height:100%;min-height:600px;padding:0;overflow:hidden}.audio-controls{display:flex;flex-direction:column;gap:1.2rem}.source-selector{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}.source-selector select{padding:.5rem .75rem;background-color:#8a9e861a;color:var(--text-color);border:1px solid var(--border-color);border-radius:6px;flex-grow:1;font-size:.9rem;letter-spacing:.5px;font-weight:300}.source-controls{display:grid;grid-template-columns:1fr;gap:1rem;margin-bottom:1rem}@media (min-width: 992px){.source-controls{grid-template-columns:repeat(3,1fr)}}.control-group{display:flex;flex-direction:column}label{margin-bottom:.5rem;color:var(--secondary-text);font-size:.9rem;font-weight:300;letter-spacing:.5px}input[type=range]{width:100%;height:5px;-webkit-appearance:none;background:#8a9e861a;border-radius:5px;outline:none;padding:0}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;border-radius:50%;background:#8a9e86cc;cursor:pointer;transition:background .15s var(--transition-easing)}input[type=range]::-webkit-slider-thumb:hover{background:#8a9e86}input[type=range]::-moz-range-thumb{width:15px;height:15px;border:none;border-radius:50%;background:#8a9e86cc;cursor:pointer;transition:background .15s var(--transition-easing)}input[type=range]::-moz-range-thumb:hover{background:#8a9e86}button{background-color:#8a9e86cc;color:#f8f6f2;border:none;border-radius:6px;padding:.6rem 1rem;cursor:pointer;font-size:.9rem;font-weight:300;letter-spacing:.5px;transition:all var(--transition-speed) var(--transition-easing)}button:hover{background-color:#8a9e86;transform:translateY(-1px)}button:active{transform:translateY(0)}button:disabled{background-color:#6b705c66;cursor:not-allowed;transform:none}.playlist-manager-btn{position:relative;overflow:hidden}.playlist-manager-btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:radial-gradient(circle,rgba(138,158,134,.3) 0%,transparent 70%);transition:width .6s,height .6s,top .6s,left .6s;border-radius:50%;transform:translate(-50%,-50%);z-index:-1}.playlist-manager-btn:hover:before{width:200px;height:200px}.playlist-manager-btn:active{transform:scale(.95)}.button-group{display:flex;gap:.6rem}.muted{background-color:#a98467cc}.muted:hover{background-color:#a98467}a{color:var(--accent-color);text-decoration:none;transition:color var(--transition-speed) var(--transition-easing)}a:hover{color:var(--primary-color)}::selection{background:#8a9e864d;color:var(--text-color)}:focus{outline:2px solid rgba(138,158,134,.4);outline-offset:2px}:focus:not(:focus-visible){outline:none}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--surface-color)}::-webkit-scrollbar-thumb{background-color:#8a9e864d;border-radius:4px}::-webkit-scrollbar-thumb:hover{background-color:#8a9e8680}.visualizer-container{position:fixed;top:0;left:0;width:100%;height:100vh;z-index:1}.visualizer{width:100%;height:100%;display:block}.controls{position:absolute;top:0;left:0;padding:1rem;background-color:#f2f0ebb3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:0 0 12px;z-index:10}.audio-sources-panel{position:absolute;top:0;right:0;width:240px;padding:1rem;background-color:#f2f0ebb3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:0 0 0 12px;z-index:10}.source-list{max-height:200px;overflow-y:auto;margin-top:.8rem;border-top:1px solid var(--border-color);padding-top:.5rem}.source-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem;border-radius:4px;margin-bottom:.3rem;background-color:#ffffff80;cursor:pointer;transition:background-color .2s ease}.source-item:hover{background-color:#8a9e861a}.source-item.selected{background-color:#8a9e8633;font-weight:400}.remove-btn{background:none;color:var(--text-color);padding:.2rem .5rem;font-size:1rem;opacity:.6;border-radius:50%}.remove-btn:hover{background-color:#e639461a;color:var(--error-color);opacity:1}.add-source{display:flex;margin-bottom:.8rem;gap:.5rem}.add-source input{flex-grow:1;padding:.5rem;border:1px solid var(--border-color);border-radius:4px;background-color:#fffc}.upload-area{bottom:1.5rem;left:1.5rem;width:calc(100% - 3rem);max-width:400px;background-color:#f2f0ebcc;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:12px;padding:1.5rem;box-shadow:0 3px 15px #00000014;transition:transform .3s ease,box-shadow .3s ease;z-index:10}.upload-area.active{background-color:#8a9e861a;border:2px dashed var(--primary-color);transform:scale(1.02)}.upload-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;text-align:center}.upload-icon{font-size:2rem;margin-bottom:1rem;color:var(--primary-color)}.upload-button{margin-top:.8rem;padding:.7rem 1.5rem}.hidden-input{display:none}.file-info{padding:.5rem;text-align:center}.file-meta{display:flex;justify-content:center;gap:1rem;margin-bottom:1rem;font-size:.8rem;color:var(--secondary-text)}.loading-indicator{display:flex;flex-direction:column;align-items:center;gap:.8rem;margin:1rem 0}.spinner{width:24px;height:24px;border:3px solid rgba(138,158,134,.3);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-message{display:flex;align-items:center;gap:.5rem;padding:.8rem;color:var(--error-color);background-color:#e639461a;border-radius:8px;margin:.8rem 0}.error-message.centered{flex-direction:column;align-items:center}.error-icon{font-size:1.2rem;color:var(--error-color);margin-bottom:.5rem}.webgl-error .error-icon{font-size:2rem;margin-bottom:1rem;display:inline-block}.action-button.standard{margin:.3rem;min-width:100px;width:auto;height:auto;border-radius:25px;padding:.5rem 1rem;display:inline-block}.small{padding:.4rem .8rem;font-size:.8rem}.webgl-error{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:#f2f0ebf2;padding:1.5rem;border-radius:12px;text-align:center;box-shadow:var(--box-shadow-lg);max-width:80%;z-index:100}.fallback-message{margin-top:1rem;padding:.5rem;background-color:#8a9e861a;border-radius:6px;font-style:italic}.fallback-canvas{width:100%;height:100%;background-color:var(--surface-color);border-radius:12px}.fallback-container{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.fallback-visualizer{width:100%;height:100%;border-radius:12px;overflow:hidden}.floating-panel{position:fixed;bottom:0;left:0;width:100%;height:80%;background-color:#1e1e1ecc;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:12px 12px 0 0;padding:1.5rem;box-shadow:var(--box-shadow-lg);z-index:10;transition:transform .3s ease-in-out,opacity .2s ease;overflow-y:auto}.panel-collapsed{transform:translateY(100%);opacity:.9}.panel-expanded{transform:translateY(0);opacity:1}.settings-button{position:fixed;top:20px;right:20px;z-index:30;background-color:#1e1e1ecc;color:#fff;border:none;border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 10px #0003;transition:transform .3s ease,background-color .3s ease}.settings-button:hover{background-color:#323232e6;transform:scale(1.05)}@keyframes rotate-gear{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.settings-button.rotate{animation:rotate-gear .5s ease forwards}.settings-button:not(.rotate){animation:rotate-gear .5s ease reverse}.panel-content{display:flex;flex-direction:column;gap:1.5rem;height:100%}.audio-playlist-control{flex:0 0 auto;min-height:250px;background:var(--surface-color);border-radius:12px;overflow:hidden;box-shadow:var(--box-shadow-sm)}.grid-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.75rem;width:100%}.grid-item{min-width:0}.section-header{width:100%;grid-column:1 / -1}@media screen and (orientation: portrait){.panel-content{flex-direction:column;gap:1rem;overflow-y:auto}.floating-panel{height:80vh}.grid-container{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.audio-playlist-control{min-height:200px}}@media screen and (orientation: landscape){.panel-content{flex-direction:row;gap:1.5rem}.floating-panel{height:80vh}.grid-container{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.audio-playlist-control{flex:0 0 300px;min-height:220px;min-width:250px;max-width:350px}}.audio-file-container{width:100%;margin-bottom:1.5rem}.audio-file-list{width:100%;display:flex;flex-direction:column;gap:.5rem;margin-top:1rem}.audio-player{width:100%;padding:10px;background-color:#f2f0eb99;border-radius:8px;transition:background-color var(--transition-speed) var(--transition-easing),transform var(--transition-speed) var(--transition-easing),border-color var(--transition-speed) var(--transition-easing);position:relative;overflow:hidden;border:1px solid var(--border-color);margin-bottom:12px}.audio-player:hover{background-color:#f2f0ebe6;transform:translateY(-2px);border-color:var(--border-color)}.audio-player.selected{background-color:#8a9e861a;border:1px solid var(--primary-color)}.audio-player.selected .filename-display{color:var(--primary-color);font-weight:600}.player-container{display:flex;align-items:center;gap:1rem;width:100%}.player-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:60px;height:60px;position:relative;background-color:#8a9e860d;border-radius:8px;overflow:visible}.player-label{position:absolute;bottom:0;left:0;width:100%;text-align:center;font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background-color:#ffffffb3;padding:2px 0;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.audio-icon-large{display:inline-block;width:100%;height:100%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%238a9e86' d='M499.1 6.3c8.1 6 12.9 15.6 12.9 25.7v72V368c0 44.2-43 80-96 80s-96-35.8-96-80s43-80 96-80c11.2 0 22 1.6 32 4.6V147L192 223.8V432c0 44.2-43 80-96 80s-96-35.8-96-80s43-80 96-80c11.2 0 22 1.6 32 4.6V200 128c0-14.1 9.3-26.6 22.8-30.7l320-96c9.7-2.9 20.2-1.1 28.3 5z'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center}.player-content{flex:1;display:flex;flex-direction:column;min-width:180px}.file-header{display:flex;align-items:center;margin-bottom:4px;width:100%}.file-name{font-weight:500;word-break:break-word;color:var(--text-color)}.player-info{display:flex;flex-direction:column;gap:6px;flex:1;padding-right:12px}.volume-control{width:100px;padding:0 .5rem;flex:1}.volume-slider{width:100%;height:4px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--border-color);outline:none;border-radius:2px;transition:all .2s}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:var(--primary-color);cursor:pointer}.volume-slider::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--primary-color);cursor:pointer;border:none}.player-controls{display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center;width:100%}.action-button{width:30px;height:30px;display:flex;align-items:center;justify-content:center;background-color:var(--surface-color);color:var(--text-color);border:1px solid var(--border-color);border-radius:50%;cursor:pointer;transition:all var(--transition-speed) var(--transition-easing);padding:0;min-width:auto}.action-button:hover{background-color:var(--primary-color);color:var(--background-color);border-color:var(--primary-color)}.action-button.select-button{background-color:var(--surface-color-alt)}.select-button.active{background-color:var(--primary-color);color:#fff;border-color:var(--primary-color)}.select-button.active .select-icon{filter:brightness(0) invert(1)}.audio-icon{display:inline-block;width:var(--icon-size-sm);height:var(--icon-size-sm);margin-right:8px;color:var(--primary-color);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%238a9e86' d='M499.1 6.3c8.1 6 12.9 15.6 12.9 25.7v72V368c0 44.2-43 80-96 80s-96-35.8-96-80s43-80 96-80c11.2 0 22 1.6 32 4.6V147L192 223.8V432c0 44.2-43 80-96 80s-96-35.8-96-80s43-80 96-80c11.2 0 22 1.6 32 4.6V200 128c0-14.1 9.3-26.6 22.8-30.7l320-96c9.7-2.9 20.2-1.1 28.3 5z'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center}.play-icon,.pause-icon{display:inline-block;width:16px;height:16px;background-size:contain;background-repeat:no-repeat;background-position:center;transition:transform var(--transition-speed) var(--transition-easing)}.play-icon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='%238a9e86' d='M73 39c-14.8-9.1-33.4-9.4-48.5-.9S0 62.6 0 80V432c0 17.4 9.4 33.4 24.5 41.9s33.7 8.1 48.5-.9L361 297c14.3-8.7 23-24.2 23-41s-8.7-32.2-23-41L73 39z'/%3E%3C/svg%3E")}.pause-icon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%238a9e86' d='M48 64C21.5 64 0 85.5 0 112V400c0 26.5 21.5 48 48 48H80c26.5 0 48-21.5 48-48V112c0-26.5-21.5-48-48-48H48zm192 0c-26.5 0-48 21.5-48 48V400c0 26.5 21.5 48 48 48h32c26.5 0 48-21.5 48-48V112c0-26.5-21.5-48-48-48H240z'/%3E%3C/svg%3E")}.select-icon{display:inline-block;width:14px;height:14px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%235e503f' d='M40 48C26.7 48 16 58.7 16 72v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V72c0-13.3-10.7-24-24-24H40zM192 64c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zM16 232v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V232c0-13.3-10.7-24-24-24H40c-13.3 0-24 10.7-24 24zM40 368c-13.3 0-24 10.7-24 24v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V392c0-13.3-10.7-24-24-24H40z'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center}@keyframes slideDown{0%{transform:translateY(-100%) scale(.8);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.selection-indicator{position:absolute;top:0;left:20px;width:18px;height:35px;background:linear-gradient(135deg,var(--primary-color) 0%,rgba(138,158,134,.8) 100%);clip-path:polygon(0 0,100% 0,100% 70%,50% 85%,0 70%);z-index:2;opacity:0;transform:translateY(-100%) scale(.8);transition:none;box-shadow:0 3px 8px #00000040,0 1px 3px #00000026;animation:none}.selection-indicator:before{content:"";position:absolute;top:8px;left:50%;transform:translate(-50%);width:2px;height:12px;background-color:#fffc;border-radius:1px;box-shadow:0 0 2px #fff9}.selection-indicator.active{opacity:1;transform:translateY(0) scale(1);animation:slideDown .3s ease-out}.audio-player:hover .selection-indicator{box-shadow:0 4px 12px #0000004d,0 2px 6px #0003}.action-button:hover .play-icon,.action-button:hover .pause-icon,.action-button:hover .select-icon{filter:brightness(0) invert(1);transform:scale(1.1)}.audio-file-status{display:flex;align-items:center;margin-top:.5rem;font-size:.8rem}.audio-controls-container{display:flex;align-items:center;gap:.8rem;margin-top:.5rem}.filename-display{font-size:.9rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;padding:0 .5rem;color:var(--text-color);text-align:left;transition:color .2s ease}.name-strip{background-color:#f2f0ebcc;padding:4px 8px;border-radius:4px;margin-bottom:6px}.audio-player:hover .filename-display{color:var(--primary-color)}.bottom-controls{display:flex;align-items:center;justify-content:space-between}.playlist-manager-overlay{animation:modalFadeIn .3s ease-out}.playlist-manager-modal{animation:modalSlideIn .3s ease-out;border:1px solid var(--border-color)}@keyframes modalFadeIn{0%{opacity:0;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}to{opacity:1;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}}@keyframes modalSlideIn{0%{transform:scale(.9) translateY(-20px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.playlist-list-item{transition:all var(--transition-speed) var(--transition-easing);position:relative;overflow:hidden}.playlist-list-item:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(138,158,134,.1),transparent);transition:left .5s ease}.playlist-list-item:hover:before{left:100%}.playlist-list-item:hover{transform:translate(4px);box-shadow:0 2px 8px #0000001a}.load-btn,.delete-btn,.save-btn{position:relative;overflow:hidden;transform:translateY(0);transition:all var(--transition-speed) var(--transition-easing)}.load-btn:hover,.delete-btn:hover,.save-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.load-btn:active,.delete-btn:active,.save-btn:active:not(:disabled){transform:translateY(0)}.playlist-name-input{transition:all var(--transition-speed) var(--transition-easing);position:relative}.playlist-name-input:hover{border-color:#8a9e8680}.playlist-name-input:focus{transform:scale(1.02)}@media screen and (max-width: 768px){.playlist-manager-modal{width:95%;max-height:85vh;margin:0 2.5%}.modal-header{padding:.8rem 1rem}.modal-content{padding:1rem;gap:1rem}.create-form{flex-direction:column;gap:.5rem}.playlist-name-input{min-width:auto}.playlist-actions{flex-direction:column;gap:.3rem}.load-btn,.delete-btn{padding:.4rem .8rem;font-size:.8rem}}@media screen and (max-width: 480px){.playlist-manager-modal{width:98%;max-height:90vh}.modal-header h3{font-size:1rem}.close-btn{font-size:1.5rem}.playlist-list-item{align-items:flex-start;gap:.5rem}.playlist-actions{width:100%;justify-content:space-between}}.playlist-loading{pointer-events:none;opacity:.6;position:relative}.playlist-loading:after{content:"";position:absolute;top:50%;left:50%;width:20px;height:20px;margin:-10px 0 0 -10px;border:2px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}@supports (backdrop-filter: blur(10px)){.playlist-manager-overlay{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}}@supports not (backdrop-filter: blur(10px)){.playlist-manager-overlay{background:#000c}}@media screen and (max-width: 480px){.audio-player{padding:10px 12px}.player-icon{width:50px;height:50px}.action-button{width:28px;height:28px}.player-info{gap:4px}.file-name{font-size:.8rem}.volume-control{width:100%}.filename-display{font-size:.8rem;margin-bottom:4px}.volume-slider{height:3px}.bottom-controls{gap:6px}.name-strip{padding:3px 6px}}.empty-state{padding:2rem;text-align:center;color:var(--secondary-text);background-color:#f2f0eb4d;border-radius:8px;font-style:italic}.floating-navigation-bar{position:fixed;bottom:0;left:0;width:100%;height:40px;background-color:#8a9e8633;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);z-index:20;display:flex;align-items:center;justify-content:center;border-radius:12px}.nav-buttons{display:flex;align-items:center;justify-content:center;gap:1rem;width:100%;max-width:600px;padding:0 1rem}.nav-button{background-color:var(--primary-color);color:#fff;border:none;border-radius:25px;padding:.5rem 1rem;font-size:.8rem;font-weight:500;letter-spacing:.5px;cursor:pointer;transition:all var(--transition-speed) var(--transition-easing);min-width:80px;text-align:center}.nav-button:hover{background-color:var(--accent-color);transform:translateY(-2px);box-shadow:0 4px 12px #8a9e864d}.nav-button:active{transform:translateY(0)}@media screen and (max-width: 768px){.floating-navigation-bar{height:35px}.nav-buttons{gap:.8rem;padding:0 .5rem}.nav-button{padding:.4rem .8rem;font-size:.7rem;min-width:60px}}@media screen and (max-width: 480px){.nav-buttons{gap:.6rem}.nav-button{padding:.3rem .6rem;font-size:.65rem;min-width:50px}}.playlist-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:1000;display:flex;align-items:center;justify-content:center;animation:modalFadeIn .3s ease-out}.playlist-modal{background-color:var(--surface-color);border-radius:12px;box-shadow:var(--box-shadow-lg);max-width:500px;width:90%;max-height:80vh;overflow:hidden;animation:modalSlideIn .3s ease-out;border:1px solid var(--border-color)}.playlist-modal-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;border-bottom:1px solid var(--border-color);background-color:#8a9e860d}.playlist-modal-header h4{margin:0;color:var(--primary-color);font-weight:500;font-size:1.1rem;letter-spacing:.5px}.close-btn{background:none;border:none;font-size:1.8rem;color:var(--secondary-text);cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all var(--transition-speed) var(--transition-easing)}.close-btn:hover{background-color:#e639461a;color:var(--error-color)}.playlist-modal-content{padding:1.5rem;max-height:50vh;overflow-y:auto}.playlist-modal-actions{display:flex;gap:.75rem;justify-content:flex-end;padding:1rem 1.5rem;border-top:1px solid var(--border-color);background-color:#f2f0eb4d}.playlist-input-group{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}.playlist-input-group label{color:var(--secondary-text);font-weight:500;font-size:.9rem}.playlist-name-input{padding:.75rem;border:1px solid var(--border-color);border-radius:6px;background-color:var(--background-color);color:var(--text-color);font-size:.9rem;transition:all var(--transition-speed) var(--transition-easing)}.playlist-name-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #8a9e861a}.playlist-list-container{overflow-y:auto}.playlist-list-item{display:flex;align-items:center;justify-content:space-between;padding:.75rem;border-radius:6px;margin-bottom:.5rem;background-color:#f2f0eb80;transition:all var(--transition-speed) var(--transition-easing)}.playlist-list-item:hover{background-color:#8a9e861a;transform:translate(2px)}.playlist-name{font-weight:500;color:var(--text-color);flex:1}.playlist-actions{display:flex;gap:.5rem}.selected-sources-info{padding:.5rem;background-color:#8a9e861a;border-radius:6px;font-size:.85rem;color:var(--secondary-text);margin-bottom:1rem}.no-playlists{text-align:center;padding:2rem;color:var(--secondary-text)}.no-playlists .hint{font-size:.85rem;opacity:.7}.warning-text{color:var(--error-color);font-size:.85rem;margin-top:.5rem}.delete-confirm-dialog{max-width:400px}.primary-btn{background-color:var(--primary-color);color:#fff;border:none;border-radius:6px;padding:.6rem 1.2rem;font-size:.9rem;font-weight:500;cursor:pointer;transition:all var(--transition-speed) var(--transition-easing);letter-spacing:.3px}.primary-btn:hover:not(:disabled){background-color:#8a9e86e6;transform:translateY(-1px);box-shadow:0 3px 8px #8a9e864d}.primary-btn:disabled{background-color:#6b705c66;cursor:not-allowed;transform:none;opacity:.6}.secondary-btn{background-color:transparent;color:var(--secondary-text);border:1px solid var(--border-color);border-radius:6px;padding:.6rem 1.2rem;font-size:.9rem;font-weight:500;cursor:pointer;transition:all var(--transition-speed) var(--transition-easing);letter-spacing:.3px}.secondary-btn:hover{background-color:#8a9e861a;border-color:var(--primary-color);color:var(--primary-color)}.danger-btn{background-color:var(--error-color);color:#fff;border:none;border-radius:6px;padding:.6rem 1.2rem;font-size:.9rem;font-weight:500;cursor:pointer;transition:all var(--transition-speed) var(--transition-easing);letter-spacing:.3px}.danger-btn:hover{background-color:#e63946e6;transform:translateY(-1px);box-shadow:0 3px 8px #e639464d}@media screen and (max-width: 768px){.playlist-modal{width:95%;max-height:85vh}.playlist-modal-header{padding:.8rem 1rem}.playlist-modal-content{padding:1rem}.playlist-modal-actions{padding:1rem;flex-direction:column}.primary-btn,.secondary-btn,.danger-btn{width:100%}.playlist-actions{flex-direction:column;gap:.3rem}.playlist-list-item{align-items:flex-start;gap:.5rem}.playlist-actions{width:100%;justify-content:space-between;flex-direction:row}}@media screen and (max-width: 480px){.playlist-modal{width:98%;max-height:90vh}.playlist-modal-header h4{font-size:1rem}.close-btn{font-size:1.5rem}.primary-btn,.secondary-btn,.danger-btn{padding:.5rem 1rem;font-size:.8rem}}