body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.home-container{align-items:center;background-color:#121212;color:#fff;display:flex;flex-direction:column;justify-content:center;min-height:100vh;padding:20px}h1{color:#1db954;margin-bottom:40px}.feature-buttons{display:flex;flex-direction:column;gap:20px;max-width:400px;width:100%}.feature-button-container{align-items:center;display:flex;gap:10px}.feature-button{background-color:#282828;border:none;border-radius:8px;color:#fff;cursor:pointer;flex:1 1;font-size:1.2rem;padding:20px;text-align:center;text-decoration:none;transition:background-color .3s ease}.feature-button:hover{background-color:#383838}.info-button{align-items:center;background-color:#1db954;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:1.2rem;height:30px;justify-content:center;transition:background-color .3s ease;width:30px}.info-button:hover{background-color:#1ed760}.import-sort-export{background-color:#0a1a2f;color:#fff;min-height:100vh;padding:40px}header{margin-bottom:40px;position:relative;text-align:center}.header-title{align-items:center;display:flex;justify-content:center;margin-bottom:2rem;position:relative}h1{background:linear-gradient(45deg,#0ff,#f0f);-webkit-background-clip:text;background-clip:text;color:#0000;font-size:2.5rem;margin:0;text-shadow:0 0 10px #00ffff4d}.home-button{background-color:#00ffff1a;border:1px solid #00ffff4d;color:#0ff;font-size:1.1rem;left:20px;padding:10px 20px;position:absolute;top:20px;transition:all .3s ease}.home-button:hover{background-color:#0ff3;box-shadow:0 0 15px #00ffff80}.spotify-embed{box-sizing:border-box;display:flex;justify-content:center;margin:0 auto 1rem;max-width:800px;padding:0 1rem;width:100%}.spotify-embed iframe{background:#ff00ff0d;border:2px solid #f0f;border-radius:12px;box-shadow:0 0 20px #f0f3;width:100%}.functionality-section{background-color:#121212;border-radius:8px;margin:0 auto;max-width:1200px;overflow:hidden;padding:20px;position:relative}.functionality-section:before{background:linear-gradient(90deg,#1db95408 1px,#0000 0) 0 0 /40px 40px,linear-gradient(#1db95408 1px,#0000 0) 0 0 /40px 40px;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.search-container{display:flex;flex-direction:column;gap:1rem;margin:1rem 0;max-width:100%;padding:0 1rem}.gel-well-container{background:#0a1a2fb3;border:1px solid #ff00ff4d;border-radius:15px;box-shadow:0 0 20px #ff00ff1a;box-sizing:border-box;margin:0 auto 20px;max-width:800px;padding:20px;position:relative;text-align:center;transition:all .3s ease;width:100%}.gel-well-container:hover{animation:neonPulse 2s infinite;background:#0a1a2fcc}.filter-header,.gel-well-header{justify-content:center;margin-bottom:1.5rem;position:relative;text-align:center}.clear-button{display:none;position:absolute;right:0}.clear-button.visible{display:inline-block}.filter-section{border:1px solid #0ff3;border-radius:15px;box-shadow:0 0 20px #00ffff1a;box-sizing:border-box;margin:0 auto 20px;max-width:800px;padding:20px;width:100%}.filter-toggles{gap:.5rem;justify-content:center;margin-bottom:.75rem}.filter-toggle-button{background:#0000;border:2px solid #0ff;border-radius:8px;color:#0ff;font-weight:700;letter-spacing:1px;min-width:120px;padding:.8rem 1.5rem;text-transform:uppercase;transition:all .3s ease}.filter-toggle-button:hover{background:#00ffff1a}.filter-toggle-button.active{background:#f0f3;border-color:#f0f;box-shadow:0 0 15px #ff00ff4d;color:#f0f}.filter-content{animation:slideDown .3s ease-out;background:#0a1a2fb3;border:1px solid #0ff3;border-radius:8px;margin-top:.75rem;overflow:hidden;padding:1rem}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.filter-section h2{animation:neonTextPulse 2s infinite;color:#0ff;font-size:1.5rem;letter-spacing:2px;margin-bottom:1rem;text-align:center;text-transform:uppercase}.filter-boxes{flex-direction:column;width:33%}.name-filter{box-sizing:border-box;display:flex;flex-direction:column;gap:.5rem;width:100%}.name-title-dropzone{border-radius:4px;box-sizing:border-box;overflow:hidden}.name-title-dropzone input{background-color:#0a1a2fe6;border:1px solid #0ff;border-radius:4px;box-sizing:border-box;color:#fff;font-size:1rem;padding:.75rem;width:100%}.name-title-dropzone .drop-indicator{white-space:nowrap}.name-filter label{animation:neonTextPulse 2s infinite;color:#0ff;font-weight:700;letter-spacing:1px;text-transform:uppercase;white-space:nowrap}.name-filter input{background-color:#121212;border:1px solid #666;border-radius:4px;color:#fff;flex:1 1;font-size:.9rem;padding:.25rem .5rem}.name-filter input:focus{border-color:#0ff;box-shadow:0 0 0 2px #0ff3;outline:none}.filter-section{background:#0a1a2fb3;border-radius:8px;margin-bottom:2rem;padding:1.5rem}.filter-boxes{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:2.5rem;width:100%}.bpm-filter,.genre-filter,.length-filter,.year-filter{align-items:center;background:#0a1a2fb3;border:1px solid #0ff3;border-radius:8px;display:flex;flex:1 1;gap:1rem;min-width:250px;padding:1rem;transition:all .3s ease}.bpm-filter:hover,.genre-filter:hover,.length-filter:hover,.year-filter:hover{animation:neonPulse 2s infinite;background:#0a1a2fcc}.bpm-filter label,.genre-filter label,.length-filter label,.year-filter label{animation:neonTextPulse 2s infinite;color:#0ff;font-weight:700;letter-spacing:1px;text-transform:uppercase}.bpm-inputs,.length-inputs,.year-inputs{gap:.5rem}.bpm-inputs span,.length-inputs span,.year-inputs span{color:#666}.bpm-inputs input,.length-inputs input,.year-inputs input{background-color:#121212;border:1px solid #666;border-radius:4px;color:#fff;padding:.25rem .5rem;text-align:center;width:70px}.genre-input{align-items:center;display:flex}.genre-input input{border:1px solid #ccc;border-radius:4px;padding:.25rem .5rem;text-align:left;width:200px}.bpm-inputs input:focus,.genre-input input:focus,.length-inputs input:focus,.year-inputs input:focus{border-color:#0ff;box-shadow:0 0 0 2px #0ff3;outline:none}.bpm-inputs input::placeholder,.genre-input input::placeholder,.length-inputs input::placeholder,.year-inputs input::placeholder{color:#888}.search-bar{margin-bottom:2rem;margin-left:auto;margin-right:auto;max-width:600px}.general-search{background-color:#121212;border:2px solid #0ff;border-radius:8px;box-sizing:border-box;color:#fff;font-size:1.1rem;padding:.8rem 1rem;width:100%}.general-search::placeholder{color:#888}.general-search:focus{border-color:#0ff;box-shadow:0 0 0 3px #0ff3;outline:none}.gel-well-search{background:#0a1a2fb3;border:2px solid #0ff;border-radius:12px;box-sizing:border-box;margin:0 auto 1rem;max-width:800px;padding:1.5rem;position:relative;text-align:center;transition:all .3s ease}.gel-well-search:hover{animation:neonPulse 2s infinite;background:#0a1a2fcc}.gel-well-search label{animation:neonTextPulse 2s infinite;color:#0ff;display:block;font-size:2rem;font-weight:700;letter-spacing:3px;margin-bottom:1.5rem;text-align:center;text-transform:uppercase}.gel-well-input{background-color:#121212;border:2px solid #0ff;border-radius:8px;box-sizing:border-box;font-size:1.1rem;max-width:800px;padding:1.2rem 1.5rem;transition:all .2s ease-in-out}.gel-well-input::placeholder{color:#888;font-size:1rem;opacity:.8;text-align:center}.gel-well-input:focus{border-color:#0ff;box-shadow:0 0 0 3px #0ff3;transform:translateY(-1px)}.export-buttons{display:flex;gap:1rem;justify-content:center;margin:2rem 0}.export-buttons button{background:#0000;border:2px solid #0ff;border-radius:8px;color:#0ff;cursor:pointer;font-weight:700;letter-spacing:1px;padding:.8rem 1.5rem;text-transform:uppercase;transition:all .3s ease}.export-buttons button:hover{animation:neonPulse 2s infinite;background:#00ffff1a}.table-container{background:#121212e6;border:1px solid #0ff3;box-shadow:0 0 15px #00ffff1a;height:calc(100vh - 400px);margin-top:1rem;position:relative;width:100%}table{border-collapse:initial;border-spacing:0}thead{background:#121212;z-index:10}tbody{height:100%;overflow-y:auto}tr{display:table-row;width:100%}td{border-bottom:1px solid #00ffff1a;color:#e0e0e0;padding:12px 20px;text-align:left}.table-container::-webkit-scrollbar{background:#121212;display:block!important;height:12px!important;width:12px!important}.table-container::-webkit-scrollbar-track{background:#121212;border-radius:8px}.table-container::-webkit-scrollbar-thumb{background:#0ff;border:2px solid #121212;border-radius:8px;min-height:30px}.table-container::-webkit-scrollbar-thumb:hover{background:#0ff}th.sorted-asc,th.sorted-desc{border-bottom:3px solid #2bff7c}th.sorted-asc:after,th.sorted-desc:after{border-left:6px solid #0000;border-right:6px solid #0000;height:0;opacity:1;right:1rem;transition:all .2s ease;width:0}th.sorted-asc:after{border-bottom:6px solid #2bff7c;border-top:none}th.sorted-desc:after{border-bottom:none;border-top:6px solid #2bff7c}th:not(.sorted-asc):not(.sorted-desc):hover:after{border-bottom:6px solid #00ffff4d;border-left:6px solid #0000;border-right:6px solid #0000;content:"";height:0;opacity:.7;position:absolute;right:1rem;top:50%;transform:translateY(-60%);transition:all .2s ease;width:0}th{background-color:#00ffff1a;border-bottom:2px solid #00ffff4d;font-weight:700;letter-spacing:1px;padding:1rem 2rem 1rem 1rem;position:sticky;text-transform:uppercase;top:0;transition:all .3s ease;z-index:10}tr{transition:background-color .3s ease}tr:hover{background-color:#00ffff0d}tr:hover td{color:#0ff}tr:nth-child(2n){background-color:#12121266}.advanced-mode-toggle{align-items:center;display:flex;gap:1rem;justify-content:center;margin:1rem auto;max-width:600px;position:relative;text-align:center}.advanced-mode-button{background:#0000;border:2px solid #0ff;border-radius:8px;color:#0ff;font-weight:700;letter-spacing:1px;padding:.8rem 1.5rem;text-transform:uppercase;transition:all .3s ease;width:100%}.advanced-mode-button:hover{background:#00ffff1a;box-shadow:0 2px 8px #0ff3;transform:translateY(-1px)}.advanced-mode-button.active{animation:neonPulse 2s infinite;background:#f0f3;color:#f0f}@keyframes neonPulse{0%{box-shadow:0 0 5px #0ff,0 0 10px #0ff,0 0 15px #0ff}50%{box-shadow:0 0 10px #0ff,0 0 20px #0ff,0 0 30px #0ff}to{box-shadow:0 0 5px #0ff,0 0 10px #0ff,0 0 15px #0ff}}@keyframes neonTextPulse{0%{text-shadow:0 0 5px #0ff,0 0 10px #0ff}50%{text-shadow:0 0 10px #0ff,0 0 20px #0ff}to{text-shadow:0 0 5px #0ff,0 0 10px #0ff}}.error-message{align-items:center;background-color:#f44;display:flex;justify-content:space-between;margin-bottom:20px;padding:15px}.error-message button{background:none;border:none;color:#fff;cursor:pointer;font-size:1.2rem}.status-message{background-color:#0ff;border-radius:4px;color:#fff;margin-bottom:20px;padding:15px;text-align:center}.selected-track-info{background-color:#1a1a1a;border-left:4px solid #0ff;border-radius:8px;margin-top:20px;padding:15px}.selected-track-info h3{color:#0ff;margin:0 0 10px}.selected-track-info p{color:#b3b3b3;margin:0}.compatible-track{background:#0a1a2f1a}.compatible-track:hover{animation:neonPulse 2s infinite;background:#0a1a2f26}.compatibility-info{color:#0ff;font-size:.9em}.compatibility-info div{margin:2px 0}.error,.loading{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:400px;padding:2rem;text-align:center}.spinner{border:5px solid #f3f3f3;border-top-color:#0ff;height:50px;margin-bottom:1rem;width:50px}.error{color:#e22134}.error button{border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:1rem;margin-top:1rem;padding:.5rem 1rem}.error button,.error button:hover{background-color:#0ff}.input-processing,.input-processing:focus{border-color:#0ff;box-shadow:0 0 0 2px #0ff3}@keyframes pulse{0%{box-shadow:0 0 0 0 #0ff6}70%{box-shadow:0 0 0 6px #0ff0}to{box-shadow:0 0 0 0 #0ff0}}.bpm-inputs input,.gel-well-input,.general-search,.genre-input input,.length-inputs input{transition:all .2s ease-in-out}.bpm-inputs input:focus,.gel-well-input:focus,.general-search:focus,.genre-input input:focus,.length-inputs input:focus{border-color:#0ff;box-shadow:0 0 0 3px #0ff3;outline:none}.bpm-inputs input::placeholder,.genre-input input::placeholder,.length-inputs input::placeholder{color:#888}@media (max-width:768px){.import-sort-export{padding:1rem}.filter-boxes{grid-template-columns:1fr}.export-buttons{flex-direction:column}.export-buttons button{max-width:100%}td,th{padding:.75rem}}@keyframes sortArrowPulse{0%{text-shadow:0 0 5px #0ff,0 0 10px #0ff}50%{text-shadow:0 0 10px #0ff,0 0 20px #0ff}to{text-shadow:0 0 5px #0ff,0 0 10px #0ff}}.table-container{background:#282828;border-radius:8px;margin-top:2rem;overflow:hidden}table{font-size:.9rem}thead{background:#181818;position:sticky;top:0;z-index:1}th{color:#0ff;font-weight:600;padding:1rem;position:relative;text-align:left;transition:all .2s ease}th:hover{background:#303030}td{border-bottom:1px solid #303030;padding:.875rem 1rem}tr:hover{background:#303030}th.sorted-asc:after,th.sorted-desc:after{border-left:4px solid #0000;border-right:4px solid #0000;content:"";position:absolute;right:8px;top:50%}th.sorted-asc:after{border-bottom:4px solid #0ff;transform:translateY(-60%)}th.sorted-desc:after{border-top:4px solid #0ff;transform:translateY(-40%)}.button-group{display:flex;gap:1rem;margin:2rem 0}.primary-button{background:#0ff;border:none;border-radius:24px;color:#fff}.primary-button,.secondary-button{cursor:pointer;font-weight:600;padding:12px 24px;transition:all .2s ease}.secondary-button{background:#0000;border:2px solid #0ff;border-radius:24px;color:#0ff}.primary-button:hover,.secondary-button:hover{box-shadow:0 4px 12px #0ff3;transform:translateY(-2px)}.advanced-mode{align-items:center;display:flex;gap:.5rem;margin:1rem 0}.advanced-mode-button{background:#282828;border:1px solid #404040;border-radius:16px;font-size:.9rem;padding:8px 16px;transition:all .2s ease}.advanced-mode-button.active{background:#0ff;border-color:#0ff}.advanced-tutorial{display:none}.key-column{position:relative}.key-tooltip{border:2px solid #0ff;border-radius:8px;box-shadow:0 4px 12px #0ff3;display:none;padding:1rem;top:calc(100% + 10px);transform:translateX(-50%);width:400px;z-index:100}.key-tooltip,.key-tooltip:before{background:#121212;left:50%;position:absolute}.key-tooltip:before{border-left:2px solid #0ff;border-top:2px solid #0ff;content:"";height:16px;top:-8px;transform:translateX(-50%) rotate(45deg);width:16px}.key-column:hover .key-tooltip{animation:slideDown .3s ease-out;display:block}.key-tooltip-content{text-align:left}.key-tooltip-content h4{color:#0ff;font-size:1rem;margin:0 0 .5rem}.key-tooltip-content p{color:#fff;font-size:.9rem;margin:.5rem 0}.key-order{background:#0a1a2f1a;border-radius:4px;color:#0ff!important;font-family:monospace;overflow-x:auto;padding:.5rem;white-space:nowrap}.advanced-mode-help{display:inline-block;position:relative}.help-icon{align-items:center;background:#0000;border:2px solid #0ff;border-radius:50%;color:#0ff;cursor:help;display:inline-flex;font-weight:700;height:24px;justify-content:center;transition:all .2s ease;width:24px}.help-icon:hover{background:#00ffff1a;box-shadow:0 2px 8px #0ff3;transform:translateY(-1px)}.help-tooltip{border:2px solid #0ff;border-radius:8px;box-shadow:0 4px 12px #0ff3;opacity:0;padding:1.5rem;pointer-events:none;right:-10px;text-align:left;top:calc(100% + 10px);transition:visibility .2s,opacity .2s;visibility:hidden;width:300px;z-index:100}.help-tooltip,.help-tooltip:before{background:#121212;position:absolute}.help-tooltip:before{border-left:2px solid #0ff;border-top:2px solid #0ff;content:"";height:16px;right:15px;top:-8px;transform:rotate(45deg);width:16px}.advanced-mode-help:hover .help-tooltip{opacity:1;pointer-events:auto;visibility:visible}.help-section{margin-bottom:1.5rem}.help-section:last-child{margin-bottom:0}.help-section h4{align-items:center;color:#0ff;display:flex;font-size:1rem;gap:.5rem;margin:0 0 .5rem}.help-section ul{list-style:none;margin:0;padding:0}.help-section li{color:#fff;font-size:.9rem;margin-bottom:.5rem}.help-section li:last-child{margin-bottom:0}.help-section .key-order{color:#0ff;font-family:monospace;padding:.25rem 0}.danceability-bar-container{background:#ffffff1a;border-radius:2px;height:4px;overflow:hidden;position:relative}.danceability-bar{height:100%;left:0;position:absolute;top:0;transition:width .3s ease,background-color .3s ease .1s}tr:hover .danceability-bar{box-shadow:0 0 8px #0ff6;filter:brightness(1.2);transition:width .3s ease,background-color .3s ease .1s,filter .2s ease}.reference-track{background:#0a1a2f1a!important;border-left:4px solid #0ff}.reference-badge{background:#0ff;border-radius:4px;color:#121212;display:inline-block;font-size:.8em;font-weight:700;text-transform:uppercase}.active-filters{margin:.5rem 0;min-height:40px}.active-filters-content{gap:.75rem;padding:.75rem}.filter-group{margin:.25rem 0}.filter-group label{color:#b3b3b3;min-width:80px}.filter-group input{background-color:#282828;border:1px solid #404040;border-radius:4px;color:#fff;padding:8px}.filter-group input[type=text]{width:100px}.filter-group input.search-input{width:200px}.filter-group input:focus{border-color:#0ff;outline:none}.filter-group.gel-well{border-color:#0ff}.filter-group.bpm{border-color:#ff6b6b}.filter-group.genre{border-color:#4ecdc4}.filter-group.length{border-color:#ffd93d}.filter-label{color:#888;font-size:.9em;font-weight:500}.filter-value{color:#fff;font-weight:700}.filter-subtext{color:#888;font-size:.9em;margin-left:.25rem}.filter-detail{border-left:1px solid #00ffff4d;color:#0ff;font-weight:500;margin-left:1rem;padding-left:1rem}.clear-filters{background:#ffffff1a;border:1px solid #fff3;border-radius:4px;color:#fff;cursor:pointer;font-size:.8em;padding:.4rem .8rem;position:absolute;right:.5rem;top:.5rem;transition:all .2s ease}.clear-filters:hover{background:#fff3;border-color:#ffffff4d}.drop-indicator{animation:pulseText 1.5s infinite;background:#121212e6;border:2px solid #0ff;border-radius:8px;color:#0ff;font-size:1.2rem;padding:1rem 2rem;text-align:center;text-shadow:0 0 10px #0ff6;white-space:nowrap;z-index:10}tr[draggable]{cursor:grab;transition:transform .2s ease,box-shadow .2s ease}tr[draggable]:active{cursor:grabbing}tr[draggable]:hover{box-shadow:0 2px 8px #0ff3;transform:translateY(-1px)}@keyframes pulseText{0%{opacity:.6}50%{opacity:1}to{opacity:.6}}::-webkit-scrollbar{height:12px;width:12px}::-webkit-scrollbar-track{background:#181818}::-webkit-scrollbar-thumb{background:#404040;border:3px solid #181818;border-radius:6px}::-webkit-scrollbar-thumb:hover{background:#505050}.year-filter{align-items:center;background:#0a1a2fb3;border:1px solid #0ff3;border-radius:8px;display:flex;flex:1 1;gap:1rem;min-width:250px;padding:1rem;transition:all .3s ease}.year-filter:hover{animation:neonPulse 2s infinite;background:#0a1a2fcc}.year-filter label{animation:neonTextPulse 2s infinite;color:#0ff;font-weight:700;letter-spacing:1px;text-transform:uppercase}.year-inputs{align-items:center;display:flex;flex:1 1;gap:.5rem}.year-inputs span{color:#666;white-space:nowrap}.year-inputs input{background-color:#121212;border:1px solid #666;border-radius:4px;color:#fff;font-size:.9rem;padding:.25rem .5rem;text-align:center;width:70px}.year-inputs input:focus{border-color:#0ff;box-shadow:0 0 0 2px #0ff3;outline:none}.year-inputs input::placeholder{color:#888}.tooltip{position:fixed;right:20px;top:20px;z-index:10000}.tooltip,.tooltip-icon{align-items:center;display:inline-flex}.tooltip-icon{background:#00ffff1a;border:2px solid #0ff;border-radius:50%;box-shadow:0 0 10px #0ff3;color:#0ff;cursor:help;font-size:1rem;height:32px;justify-content:center;transition:all .2s ease;width:32px}.tooltip-icon:hover{background:#0ff3;box-shadow:0 0 15px #00ffff4d;transform:translateY(-1px)}.tooltip-content{background:#121212;border:2px solid #0ff;border-radius:12px;box-shadow:0 4px 12px #0006;color:#fff;font-size:.9rem;opacity:0;padding:1.5rem;position:absolute;right:0;text-align:left;top:calc(100% + 15px);transition:all .3s ease;visibility:hidden;width:400px}.tooltip-content:before{background:#121212;border-left:2px solid #0ff;border-top:2px solid #0ff;content:"";height:14px;position:absolute;right:12px;top:-8px;transform:rotate(45deg);width:14px}.tooltip:hover .tooltip-content{opacity:1;visibility:visible}.tooltip-content h3{color:#0ff;font-size:1.1rem;font-weight:700;margin:0 0 1rem}.tooltip-content ul{list-style:none;margin:0;padding:0}.tooltip-content li{color:#e0e0e0;font-size:.95rem;line-height:1.4;margin-bottom:1rem}.tooltip-content li:last-child{margin-bottom:0}.danceability-cell{overflow:hidden;padding:.5rem 1rem;position:relative;vertical-align:middle}.danceability-value{background:#0000;color:#fff;overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:0}.name-title-dropzone{position:relative;width:100%}.name-title-dropzone.dragging{background-color:#0a1a2f1a;border:2px dashed #0ff}.name-title-dropzone .drop-indicator{background-color:#0ff;border-radius:4px;color:#fff;font-size:14px;left:50%;padding:8px 16px;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:1}td[draggable=true]{cursor:grab}td[draggable=true]:active{cursor:grabbing}td[draggable=true]:hover{background-color:#0a1a2f0d}.filter-header,.gel-well-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1rem}.filter-header h2,.gel-well-header h2{animation:neonTextPulse 2s infinite;color:#0ff;font-size:1.5rem;letter-spacing:2px;margin:0;text-transform:uppercase}.clear-button{background:#0000;border:1px solid #0ff;color:#0ff;font-size:.9rem;padding:.5rem 1rem;transition:all .3s ease}.clear-button:hover:not(:disabled){background:#00ffff1a}.clear-button:disabled{border-color:#666;color:#666}.camelot-notation{color:#0ff;font-size:.85em;margin-left:2px;opacity:.9}.playlist-table-container{height:100%;overflow-y:auto;position:relative}.playlist-table{border-collapse:initial;border-spacing:0;margin:0;padding:0;width:100%}.playlist-table th,.playlist-table thead{background-color:#282828;position:sticky;top:0;z-index:2}.playlist-table th{border-bottom:2px solid #0ff;font-weight:600;padding:12px;text-align:left;white-space:nowrap}.playlist-table td{border-bottom:1px solid #ffffff1a;padding:12px}.playlist-table tbody tr:hover{background-color:#00ffff1a}.playlist-table-container::-webkit-scrollbar{width:12px}.playlist-table-container::-webkit-scrollbar-track{background:#181818;border-radius:6px}.playlist-table-container::-webkit-scrollbar-thumb{background:#404040;border:3px solid #181818;border-radius:6px}.playlist-table-container::-webkit-scrollbar-thumb:hover{background:#505050}.gel-well-button{align-items:center;background:#1db954;border:none;border-radius:4px;box-shadow:0 2px 4px #0003;color:#fff;cursor:pointer;display:flex;font-size:12px;font-weight:700;gap:4px;letter-spacing:.5px;margin-right:8px;opacity:0;padding:6px 12px;text-transform:uppercase;transition:all .1s ease}.gel-well-button:before{content:"+";font-size:14px;margin-right:2px}tr:hover .gel-well-button{opacity:1;transform:translateY(-1px)}.gel-well-button:hover{background:#1ed760;box-shadow:0 4px 8px #0000004d;transform:translateY(-2px)}.import-sort-export-mobile{background-color:#1a1a1a;color:#fff;margin:0 auto;max-width:100%;min-height:100vh;padding:20px}.mobile-header{align-items:center;border-bottom:1px solid #333;display:flex;margin-bottom:30px;padding:10px 0}.home-button{border-radius:4px;color:#1db954;font-size:18px;margin-right:20px;padding:5px 10px;transition:background-color .2s}.home-button:hover{background-color:#1db9541a}.mobile-header h1{color:#1db954;font-size:24px;margin:0}.mobile-content{display:flex;flex-direction:column;gap:20px}.mobile-section{background-color:#282828;border-radius:8px;margin-bottom:15px;padding:15px}.section-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:15px}.section-header h2{color:#1db954;font-size:18px;margin:0}.clear-button{background-color:initial;border:1px solid #1db954;border-radius:4px;color:#1db954;cursor:pointer;font-size:14px;opacity:0;padding:5px 10px;transition:all .2s}.clear-button.visible{opacity:1}.clear-button:hover:not(:disabled){background-color:#1db954;color:#282828}.clear-button:disabled{cursor:not-allowed;opacity:.5}.gel-well-dropzone{border:2px dashed #1db954;border-radius:8px;padding:15px;position:relative;text-align:center;transition:all .2s}.gel-well-dropzone.dragging{background-color:#1db9541a;border-style:solid}.gel-well-input{background-color:#333;border:1px solid #444;border-radius:4px;color:#fff;font-size:16px;padding:10px;width:100%}.gel-well-input:focus{border-color:#1db954;outline:none}.filter-toggles{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:15px}.filter-toggle-button{background-color:#333;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:14px;padding:8px 12px;transition:all .2s}.filter-toggle-button.active{background-color:#1db954;color:#282828}.filter-content{background-color:#333;border-radius:4px;padding:15px}.filter-content label{color:#1db954;display:block;margin-bottom:10px}.filter-content input{background-color:#444;border:1px solid #555;border-radius:4px;color:#fff;margin-bottom:10px;padding:8px;width:100%}.filter-content input:focus{border-color:#1db954;outline:none}.bpm-inputs,.length-inputs,.year-inputs{align-items:center;display:flex;gap:10px}.bpm-inputs span,.length-inputs span,.year-inputs span{color:#888}.advanced-mode-section{text-align:center}.advanced-mode-button{background-color:#333;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;padding:10px 20px;transition:all .2s}.advanced-mode-button.active{background-color:#1db954;color:#282828}.export-section{display:flex;gap:10px;justify-content:center}.export-csv,.export-spotify{border:none;border-radius:4px;cursor:pointer;flex:1 1;font-size:16px;padding:12px;transition:all .2s}.export-csv{background-color:#1db954;color:#282828}.export-spotify{background-color:#333;color:#fff}.export-csv:hover{background-color:#1ed760}.export-spotify:hover{background-color:#444}.table-section{text-align:center}.table-toggle-button{background-color:#333;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;margin-bottom:15px;padding:10px 20px;transition:all .2s}.table-toggle-button.active{background-color:#1db954;color:#282828}.table-container{margin-top:15px;overflow-x:auto}table{background-color:#333;border-collapse:collapse;border-radius:4px;overflow:hidden;width:100%}td,th{border-bottom:1px solid #444;padding:12px;text-align:left}th{background-color:#444;color:#1db954;cursor:pointer;-webkit-user-select:none;user-select:none}th:hover{background-color:#555}.sort-indicator{font-size:12px;margin-left:5px}tr:hover{background-color:#444}.compatible-track{background-color:#1db9541a}.reference-track{background-color:#1db95433}.reference-badge{background-color:#1db954;border-radius:3px;color:#282828;font-size:12px;margin-left:8px;padding:2px 6px}.drop-indicator{background-color:#1db954e6;border-radius:4px;color:#282828;font-weight:700;left:50%;padding:10px 20px;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%)}@media (max-width:480px){.import-sort-export-mobile{padding:10px}.mobile-header h1{font-size:20px}.filter-toggles{flex-direction:column}.filter-toggle-button{width:100%}.export-section{flex-direction:column}.export-csv,.export-spotify{width:100%}td,th{font-size:14px;padding:8px}}.App{background-color:#121212;color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;min-height:100vh;text-align:center}.nav-link{color:#1db954;font-weight:500;margin:0 1rem;text-decoration:none}.nav-link:hover{text-decoration:underline}.auth-callback{align-items:center;background-color:#000000e6;display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100vw;z-index:1000}.auth-loading{background-color:#282828;border-radius:8px;box-shadow:0 4px 12px #00000080;max-width:400px;padding:2rem;text-align:center;width:90%}.auth-loading h2{color:#1db954;font-size:1.5rem;margin-bottom:1rem}.auth-loading p{color:#b3b3b3;font-size:.9rem;margin-top:1rem}.spinner{animation:spin 1s linear infinite;border:3px solid #1db954;border-radius:50%;border-top-color:#0000;height:40px;margin:0 auto 1rem;width:40px}@keyframes spin{to{transform:rotate(1turn)}}button{background-color:#1db954;border:none;border-radius:24px;color:#fff;cursor:pointer;font-size:1rem;font-weight:700;letter-spacing:1px;padding:12px 24px;text-transform:uppercase;transition:all .2s ease}button:hover{background-color:#1ed760;transform:scale(1.02)}button:disabled{background-color:#535353;cursor:not-allowed;transform:none}.playlist-alchemy{margin:0 auto;max-width:1200px;padding:2rem}.search-section{margin-bottom:2rem}.search-form{display:flex;gap:1rem;margin:0 auto;max-width:600px}.search-input{background-color:#282828;border:none;border-radius:24px;color:#fff;flex:1 1;font-size:1rem;padding:12px 20px}.search-input:focus{box-shadow:0 0 0 2px #1db954;outline:none}.results-section{margin-top:2rem}.results-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));margin-top:1rem}.track-card{background-color:#282828;border-radius:8px;padding:1.5rem;transition:transform .2s ease}.track-card:hover{background-color:#333;transform:translateY(-4px)}.track-card h3{color:#fff;font-size:1.1rem;margin:0 0 .5rem}.track-card p{color:#b3b3b3;font-size:.9rem;margin:.25rem 0}.error-message{background-color:#e22134}.error-message,.success-message{border-radius:4px;color:#fff;margin:1rem 0;padding:1rem;text-align:center}.success-message{background-color:#1db954}.home-button{align-items:center;background-color:initial;border:2px solid #1db954;border-radius:20px;color:#fff;display:inline-flex;font-weight:500;gap:.5rem;padding:8px 16px;text-decoration:none;transition:all .2s ease}.home-button:hover{background-color:#1db954;color:#fff}@media (max-width:768px){.playlist-alchemy{padding:1rem}.search-form{flex-direction:column}.search-input,button{width:100%}.results-grid{grid-template-columns:1fr}}.view-toggle-container{position:fixed;right:60px;top:20px;z-index:10}.view-toggle-button{background-color:initial;border:1px solid #1db954;border-radius:4px;color:#1db954;cursor:pointer;font-size:14px;padding:8px 16px;transition:all .2s}.view-toggle-button:hover{background-color:#1db9541a}.view-toggle-button.desktop,.view-toggle-button.mobile{background-color:#1db954;color:#282828}.view-toggle-button.desktop{opacity:.8}.view-toggle-button.auto{background-color:initial;color:#1db954}
/*# sourceMappingURL=main.744f50da.css.map*/