:root{--primary-color: #1DB954;--primary-dark: #1AA34A;--secondary-color: #191414;--text-color: #FFFFFF;--background-color: #121212;--card-background: #181818;--border-color: #282828;--hover-color: #282828;--error-color: #E74C3C;--success-color: #2ECC71;--notice-bg: rgba(29, 185, 84, .15);--notice-border: #1DB954;--notice-text: #FFFFFF}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Helvetica Neue,Arial,sans-serif;background-color:var(--background-color);color:var(--text-color);line-height:1.6}.App{min-height:100vh;display:flex;flex-direction:column}.development-notice{background-color:var(--card-background);border:1px solid var(--notice-border);border-left:4px solid var(--notice-border);border-radius:8px;padding:1.5rem;margin-bottom:2rem;text-align:left;box-shadow:0 4px 12px #0003}.development-notice h2{color:var(--primary-color);margin-bottom:1rem;font-size:1.5rem}.development-notice p{color:var(--text-color);margin-bottom:1rem}.account-instructions{background-color:var(--hover-color);border-radius:6px;padding:1.2rem;margin-top:1rem}.account-instructions h3{color:var(--primary-color);margin-bottom:.8rem}.account-instructions ul{list-style-type:none;padding-left:1rem;margin:.8rem 0}.account-instructions li{margin:.5rem 0;position:relative;padding-left:1.2rem;color:var(--text-color)}.account-instructions li:before{content:"•";color:var(--primary-color);position:absolute;left:0}.contact-link{display:inline-block;background-color:var(--primary-color);color:#fff;text-decoration:none;padding:.6rem 1.2rem;border-radius:50px;margin-top:1rem;transition:background-color .2s}.contact-link:hover{background-color:var(--primary-dark)}.App-header{background-color:var(--secondary-color);padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 10px #0000004d}.App-header h1{font-size:1.8rem;font-weight:700;color:var(--primary-color)}.nav-links{display:flex;list-style:none}.nav-links li{margin-left:1.5rem}.nav-links a{color:var(--text-color);text-decoration:none;font-weight:500;transition:color .2s}.nav-links a:hover{color:var(--primary-color)}.logout-button{background-color:transparent;border:1px solid var(--primary-color);color:var(--primary-color);padding:.4rem .8rem;border-radius:50px;font-size:.9rem;transition:background-color .2s,color .2s}.logout-button:hover{background-color:var(--primary-color);color:#fff}.app-container{display:flex;flex:1;width:100%}.sidebar{width:300px;background-color:var(--card-background);border-right:1px solid var(--border-color);padding:1rem;overflow-y:auto;height:calc(100vh - 60px);position:sticky;top:60px}main{flex:1;padding:2rem;max-width:calc(100% - 300px);width:100%}button{background-color:var(--primary-color);color:#fff;border:none;padding:.6rem 1.2rem;border-radius:50px;font-weight:600;cursor:pointer;transition:background-color .2s}button:hover{background-color:var(--primary-dark)}button:disabled{background-color:#555;cursor:not-allowed}.login-button{font-size:1rem;padding:.7rem 1.5rem}.welcome-message{text-align:center;margin-top:4rem}.welcome-message h2{font-size:2.5rem;margin-bottom:1rem}.welcome-message p{font-size:1.2rem;color:#aaa}.auth-instructions{max-width:600px;margin:2rem auto;padding:1.5rem;background-color:var(--card-background);border-radius:10px;text-align:left;box-shadow:0 2px 10px #0000004d}.auth-instructions p{font-size:1rem;margin-bottom:1rem;color:var(--text-color)}.auth-instructions ol{padding-left:1.5rem}.auth-instructions li{margin-bottom:.5rem;color:#ddd}.no-track-message{padding:1.5rem;background-color:var(--card-background);border-radius:10px;margin-top:1rem;box-shadow:0 2px 10px #0000004d}.spotify-instructions{margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--border-color)}.spotify-instructions p{font-size:.9rem;margin-bottom:.5rem}.spotify-instructions ol{padding-left:1.5rem}.spotify-instructions li{margin-bottom:.5rem;font-size:.9rem;color:#aaa}.home-container{text-align:center;padding:2rem 0;max-width:1200px;margin:0 auto}.home-header{margin-bottom:3rem}.home-header h1{font-size:2.5rem;color:var(--primary-color);margin-bottom:1rem}.home-description{font-size:1.2rem;color:#aaa;max-width:800px;margin:0 auto}.features{display:flex;justify-content:space-between;margin-top:3rem;gap:2rem}.feature{background-color:var(--card-background);border-radius:10px;padding:2rem;flex:1;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 6px #0000001a}.feature:hover{transform:translateY(-5px);box-shadow:0 8px 15px #0003}.feature-icon{font-size:2.5rem;margin-bottom:1rem}.feature h3{color:var(--primary-color);margin-bottom:1rem;font-size:1.4rem}.feature p{margin-bottom:1.5rem;color:#ddd;line-height:1.6}.feature-link{display:inline-block;margin-top:.5rem;color:var(--primary-color);text-decoration:none;font-weight:600;padding:.5rem 1rem;border:1px solid var(--primary-color);border-radius:50px;transition:background-color .2s,color .2s}.feature-link:hover{background-color:var(--primary-color);color:#fff}.home-footer{margin-top:4rem;color:#aaa;font-style:italic}.now-playing-container{max-width:800px;margin:0 auto}.sidebar-mode{max-width:100%;margin:0}.sidebar-mode h2{font-size:1.2rem;margin-bottom:1rem}.sidebar-mode .track-info{flex-direction:column;margin-top:1rem;background-color:transparent;border-radius:0}.sidebar-track-header{display:flex;align-items:center;margin-bottom:1rem}.sidebar-album-cover{width:60px;height:60px;border-radius:5px;overflow:hidden;margin-right:1rem}.sidebar-album-cover img{width:100%;height:100%;object-fit:cover}.sidebar-track-info{flex:1;overflow:hidden}.sidebar-track-name{font-size:1rem;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-artist{font-size:.9rem;color:#aaa;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-mode .playback-controls{margin:.5rem 0}.sidebar-mode .control-button{width:32px;height:32px;font-size:.8rem}.sidebar-mode .play-pause-button{width:40px;height:40px;font-size:1rem}.sidebar-tags-container{margin-top:1rem}.sidebar-tags-container h4{font-size:.9rem;margin-bottom:.5rem}.sidebar-tags-list{display:flex;flex-wrap:wrap;gap:.3rem;margin-bottom:1rem}.sidebar-tags-list .tag{font-size:.8rem;padding:.2rem .6rem}.sidebar-mode .add-tag-container{margin-top:.5rem}.sidebar-mode .add-tag input,.sidebar-mode .add-tag button{padding:.4rem .8rem;font-size:.9rem}.track-info{display:flex;margin-top:2rem;background-color:var(--card-background);border-radius:10px;overflow:hidden;box-shadow:0 2px 10px #0000004d}.album-cover{width:200px;height:200px}.album-cover img{width:100%;height:100%;object-fit:cover}.track-details{padding:1.5rem;flex:1}.track-details h3{font-size:1.8rem;margin-bottom:.5rem}.artist,.album{color:#aaa;margin-bottom:.5rem}.progress-container{margin:1rem 0}.progress-bar{width:100%;height:5px;background-color:var(--secondary-color);border-radius:5px;overflow:hidden;margin-bottom:.5rem}.progress-bar-fill{height:100%;background-color:var(--primary-color);border-radius:5px;transition:width .1s linear}.progress-time{display:flex;justify-content:space-between;font-size:.8rem;color:#aaa}.playback-controls{display:flex;justify-content:center;align-items:center;margin:1rem 0;gap:1rem}.control-button{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background-color:var(--secondary-color);color:var(--text-color);font-size:1rem;cursor:pointer;transition:all .2s;padding:0}.control-button:hover{background-color:var(--hover-color);transform:scale(1.05)}.play-pause-button{width:50px;height:50px;background-color:var(--primary-color);font-size:1.2rem}.play-pause-button:hover{background-color:var(--primary-dark)}.tags-container{margin-top:1.5rem}.tags-list{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}.tag{background-color:var(--secondary-color);color:var(--text-color);padding:.3rem .8rem;border-radius:50px;font-size:.9rem;display:flex;align-items:center}.remove-tag-button{background:none;border:none;color:var(--text-color);font-size:.9rem;padding:0 0 0 .3rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;opacity:.7;transition:opacity .2s}.remove-tag-button:hover{opacity:1;background:none}.add-tag-container{position:relative;margin-top:1.5rem}.add-tag{display:flex}.add-tag input{flex:1;padding:.6rem 1rem;border:none;border-radius:50px 0 0 50px;background-color:var(--secondary-color);color:var(--text-color)}.add-tag button{border-radius:0 50px 50px 0}.tag-suggestions{position:absolute;top:100%;left:0;width:100%;max-height:200px;overflow-y:auto;background-color:var(--card-background);border-radius:5px;margin-top:.5rem;box-shadow:0 4px 12px #00000080;z-index:10}.suggested-tag{padding:.8rem 1rem;cursor:pointer;transition:background-color .2s;display:flex;justify-content:space-between;align-items:center}.suggested-tag:hover{background-color:var(--hover-color)}.suggested-tag-name{font-weight:500}.suggested-tag-count{font-size:.8rem;color:#aaa;background-color:var(--secondary-color);padding:.2rem .5rem;border-radius:50px}.default-tags-section{margin-top:1.5rem;border-top:1px solid var(--border-color);padding-top:1rem}.default-tags-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.default-tags-header h4{font-size:.9rem;margin:0}.toggle-default-tags-button{padding:.2rem .6rem;font-size:.8rem;background-color:var(--secondary-color)}.default-tags-list{display:flex;flex-wrap:wrap;gap:.3rem;margin-bottom:1rem}.default-tag{background-color:var(--primary-color);color:var(--text-color);padding:.2rem .6rem;border-radius:50px;font-size:.8rem;display:flex;align-items:center}.remove-default-tag-button{background:none;border:none;color:var(--text-color);font-size:.9rem;padding:0 0 0 .3rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.no-default-tags{color:#aaa;font-size:.8rem;font-style:italic}.default-tag-selector{background-color:var(--card-background);border-radius:5px;padding:.8rem;margin-top:.5rem}.default-tag-help{font-size:.8rem;color:#aaa;margin-bottom:.8rem}.new-default-tag-input{display:flex;margin-bottom:1rem}.new-default-tag-input input{flex:1;padding:.5rem .8rem;border:none;border-radius:50px 0 0 50px;background-color:var(--secondary-color);color:var(--text-color);font-size:.9rem}.new-default-tag-input button{padding:.5rem .8rem;border-radius:0 50px 50px 0;font-size:.9rem}.all-tags-for-default{display:flex;flex-wrap:wrap;gap:.5rem}.tag-for-default{background-color:var(--secondary-color);color:var(--text-color);padding:.3rem .8rem;border-radius:50px;font-size:.8rem;cursor:pointer;transition:background-color .2s;display:flex;justify-content:space-between;align-items:center;margin-bottom:.3rem}.tag-for-default:hover{background-color:var(--hover-color)}.tag-for-default.selected{background-color:var(--primary-color)}.tag-for-default-name{margin-right:.5rem}.tag-for-default-count{font-size:.7rem;color:#aaa;background-color:#0000004d;padding:.1rem .4rem;border-radius:50px}.message{background-color:var(--success-color);color:#fff;padding:.8rem;border-radius:5px;margin:1rem 0}.message.rate-limit-error{background-color:#f39c12}.error-message{background-color:var(--error-color);color:#fff;padding:.8rem;border-radius:5px;margin:1rem 0}.auth-error{background-color:var(--error-color);color:#fff;padding:1.5rem;border-radius:5px;margin:1rem 0;text-align:center;box-shadow:0 2px 10px #0000004d}.auth-error p{margin-bottom:1rem;font-weight:500}.reauth-button{background-color:#fff;color:var(--error-color);font-weight:600;padding:.6rem 1.5rem;border-radius:50px;border:none;cursor:pointer;transition:background-color .2s}.reauth-button:hover{background-color:#f0f0f0}.tagged-tracks-container,.playlist-creator-container{width:100%}.filter-section{margin:2rem 0;padding:1.5rem;background-color:var(--card-background);border-radius:10px;box-shadow:0 2px 10px #0000004d}.tag-search-container{margin-bottom:1rem}.tag-search-input{width:100%;padding:.8rem;border:none;border-radius:5px;background-color:var(--secondary-color);color:var(--text-color);font-size:1rem}.tags-filter{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.show-more-tags,.show-less-tags{margin-top:1rem;background-color:transparent;border:1px solid var(--border-color);color:var(--text-color);padding:.5rem 1rem;font-size:.9rem}.show-more-tags:hover,.show-less-tags:hover{background-color:var(--hover-color)}.tags-filter-help{font-size:.8rem;color:#aaa;margin-bottom:.8rem}.tag-filter{background-color:var(--secondary-color);color:var(--text-color);border-radius:50px;padding:.4rem 1rem;font-size:.9rem;transition:background-color .2s;display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.5rem}.tag-filter.selected{background-color:var(--primary-color)}.tag-filter-name{font-weight:500}.tag-filter-count{font-size:.7rem;color:#aaa;background-color:#0000004d;padding:.1rem .4rem;border-radius:50px}.tag-filter.selected .tag-filter-count{color:#fffc;background-color:#0003}.clear-filters{margin-top:1rem;background-color:transparent;border:1px solid var(--border-color)}.tracks-count-container{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.tracks-count{color:#aaa}.view-toggle-button{background-color:transparent;border:1px solid var(--border-color);color:var(--text-color);padding:.4rem .8rem;font-size:.9rem;border-radius:50px}.view-toggle-button.compact-active{background-color:var(--primary-color);border-color:var(--primary-color)}.selection-header-left{display:flex;align-items:center;gap:1rem}.tracks-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.tracks-list.compact-view{grid-template-columns:1fr;gap:.5rem}.compact-view .track-card{display:flex;align-items:center;padding:.3rem .5rem;height:auto;min-height:40px;margin-bottom:.2rem}.compact-view .track-info{display:flex;flex-direction:row;align-items:center;padding:.2rem;width:100%}.compact-album-cover{width:30px;height:30px;border-radius:4px;overflow:hidden;margin-right:.5rem;flex-shrink:0}.compact-album-cover img{width:100%;height:100%;object-fit:cover}.track-title-container{display:flex;justify-content:space-between;align-items:center;width:40%;min-width:200px}.compact-play-button{width:30px;height:30px;background-color:var(--primary-color);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;cursor:pointer;opacity:.8;transition:opacity .2s,transform .2s;margin-left:.5rem}.compact-play-button:hover{opacity:1;transform:scale(1.1)}.compact-play-button.playing{background-color:var(--error-color)}.compact-view .track-tags{margin:0 0 0 .5rem;display:flex;flex-wrap:wrap;flex:1}.compact-view .tag{font-size:.7rem;padding:.1rem .4rem;margin:.1rem}.track-card{background-color:var(--card-background);border-radius:10px;overflow:hidden;transition:background-color .2s;cursor:pointer;position:relative;box-shadow:0 1px 3px #0003;transition:transform .1s,box-shadow .2s,background-color .2s}.track-card:hover{background-color:var(--hover-color)}.track-card:active{transform:scale(.98)}.track-card.selected{border:2px solid var(--primary-color);box-shadow:0 0 0 2px #1db9544d}.track-image{height:180px;width:100%;position:relative}.play-button{position:absolute;bottom:10px;right:10px;width:40px;height:40px;background-color:var(--primary-color);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;cursor:pointer;opacity:.8;transition:opacity .2s,transform .2s}.play-button:hover{opacity:1;transform:scale(1.1)}.play-button.playing{background-color:var(--error-color)}.no-image{height:100%;display:flex;align-items:center;justify-content:center;background-color:var(--secondary-color);color:#aaa}.track-info{padding:1rem}.track-info h4{font-size:1.1rem;margin-bottom:.3rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-tags{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.5rem}.track-tags .tag{font-size:.8rem;padding:.2rem .6rem}.loading,.no-tracks{text-align:center;padding:3rem;color:#aaa}.playlist-form{margin:2rem 0;padding:1.5rem;background-color:var(--card-background);border-radius:10px;box-shadow:0 2px 10px #0000004d}.form-group{margin-bottom:1rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:500}.form-group input,.form-group textarea{width:100%;padding:.8rem;border:none;border-radius:5px;background-color:var(--secondary-color);color:var(--text-color)}.form-group textarea{min-height:100px;resize:vertical}.selection-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.selection-indicator{position:absolute;top:10px;right:10px;background-color:var(--primary-color);color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center}.compact-view .selection-indicator{position:relative;top:auto;right:auto;width:20px;height:20px;margin-left:.5rem;font-size:.8rem}.track-card{position:relative}.create-playlist-action{margin-top:2rem;text-align:center}.create-playlist-button{padding:.8rem 2rem;font-size:1.1rem}@media (max-width: 768px){.App-header{flex-direction:column;padding:1rem}.App-header h1{margin-bottom:1rem;font-size:1.5rem}.nav-links{width:100%;justify-content:space-between;flex-wrap:wrap}.nav-links li{margin-left:0;margin-bottom:.5rem}main{padding:1rem}.track-info{flex-direction:column}.album-cover{width:100%;height:auto;max-height:200px}.track-details{padding:1rem}.track-details h3{font-size:1.5rem}.tracks-list{grid-template-columns:1fr}.tag-filter{font-size:.8rem;padding:.3rem .7rem}.selection-header{flex-direction:column;align-items:flex-start;gap:.5rem}.selection-header-left{width:100%;justify-content:space-between}.tracks-count-container{flex-direction:column;align-items:flex-start;gap:.5rem}.track-title-container{width:100%}.compact-view .track-info,.sidebar-mode .sidebar-track-header{flex-wrap:wrap}.sidebar-mode .sidebar-album-cover{margin-bottom:.5rem}.playlist-form{padding:1rem}.create-playlist-button{width:100%}}@media (max-width: 480px){.App-header h1{font-size:1.3rem}.nav-links{font-size:.9rem}.nav-links li{margin-right:.5rem}.track-details h3{font-size:1.3rem}.tag{font-size:.7rem;padding:.2rem .5rem}.tag-filter{font-size:.7rem;padding:.3rem .5rem}.add-tag input,.add-tag button{padding:.5rem;font-size:.9rem}.sidebar-mode .control-button{width:28px;height:28px}.sidebar-mode .play-pause-button{width:36px;height:36px}h2{font-size:1.5rem}h3{font-size:1.2rem}}@media (max-width: 768px){.App-header{flex-direction:column;padding:1rem}.App-header h1{margin-bottom:1rem}.nav-links{width:100%;justify-content:space-between}.nav-links li{margin-left:0}main{padding:1rem}.features,.track-info{flex-direction:column}.album-cover{width:100%;height:auto}.tracks-list{grid-template-columns:1fr}}.sidebar-track-container{width:100%;padding:.5rem 0}@media (max-width: 1024px){.app-container{flex-direction:column}.sidebar{width:100%;height:auto;max-height:300px;overflow-y:auto;position:relative;top:0;border-right:none;border-bottom:1px solid var(--border-color)}main{max-width:100%;padding:1rem}.features{flex-direction:column;gap:1rem}.feature{margin-bottom:1rem}}@media (max-width: 768px){.App-header{flex-direction:column;padding:1rem}.App-header h1{margin-bottom:1rem;font-size:1.5rem}.nav-links{width:100%;justify-content:space-between;flex-wrap:wrap}.nav-links li{margin-left:0;margin-bottom:.5rem}main{padding:1rem}.track-info{flex-direction:column}.album-cover{width:100%;height:auto;max-height:200px}.track-details{padding:1rem}.track-details h3{font-size:1.5rem}.tracks-list{grid-template-columns:1fr}.tag-filter{font-size:.8rem;padding:.3rem .7rem}.selection-header{flex-direction:column;align-items:flex-start;gap:.5rem}.selection-header-left{width:100%;justify-content:space-between}.tracks-count-container{flex-direction:column;align-items:flex-start;gap:.5rem}.track-title-container{width:100%}.compact-view .track-info,.sidebar-mode .sidebar-track-header{flex-wrap:wrap}.sidebar-mode .sidebar-album-cover{margin-bottom:.5rem}.playlist-form{padding:1rem}.create-playlist-button{width:100%}.sidebar-track-container{padding:.3rem 0}}@media (max-width: 480px){.App-header h1{font-size:1.3rem}.nav-links{font-size:.9rem}.nav-links li{margin-right:.5rem}.track-details h3{font-size:1.3rem}.tag{font-size:.7rem;padding:.2rem .5rem}.tag-filter{font-size:.7rem;padding:.3rem .5rem}.add-tag input,.add-tag button{padding:.5rem;font-size:.9rem}.sidebar-mode .control-button{width:28px;height:28px}.sidebar-mode .play-pause-button{width:36px;height:36px}h2{font-size:1.5rem}h3{font-size:1.2rem}.sidebar-track-container{padding:.2rem 0}.sidebar-track-name{font-size:.9rem}.sidebar-artist{font-size:.8rem}.add-tag input{font-size:.9rem;padding:.4rem .6rem}.tag-suggestions{max-height:150px}.suggested-tag{padding:.6rem .8rem}.tags-filter{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.3rem}.tag-filter{font-size:.7rem;padding:.3rem .5rem;width:100%;justify-content:center;flex-wrap:wrap}.tag-filter-name{text-align:center;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tag-filter-count{font-size:.6rem}.compact-view .track-tags{flex:100%;margin-top:.3rem;margin-left:0}.compact-view .track-title-container{flex-wrap:wrap}.track-card:active{background-color:var(--hover-color)}.selection-indicator{width:28px;height:28px;font-size:1rem;box-shadow:0 0 5px #00000080}.playback-controls{gap:1.2rem}.mobile-toggle-button{display:block;width:100%;padding:.7rem;margin:.5rem 0;text-align:center}.create-playlist-action{position:sticky;bottom:0;background-color:var(--background-color);padding:1rem 0;margin:0;box-shadow:0 -3px 10px #0000004d;z-index:100}.selection-header h3{font-size:1rem;margin-bottom:.5rem}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--card-background)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}.card-shadow,.filter-section,.playlist-form,.now-playing-container .track-info,.no-track-message,.auth-instructions,.auth-error{box-shadow:0 2px 10px #0000004d}.tag-suggestions{box-shadow:0 4px 12px #00000080}@media (max-width: 480px){button,.nav-links a,.tag-filter,.tag,.compact-play-button,.control-button{min-height:42px;min-width:42px}.compact-view .tag{min-height:28px;margin:2px}}.spotify-web-guide{background:#1db9541a;border-radius:8px;padding:1.5rem;margin-bottom:2rem;text-align:left}.spotify-web-guide h2{color:#1db954;margin-top:0;margin-bottom:1rem}.spotify-web-guide a{color:#1db954;text-decoration:none;font-weight:700}.spotify-web-guide a:hover{text-decoration:underline}.spotify-web-guide{background:#181818;border-radius:8px;padding:1.5rem;margin-bottom:2rem;border-left:4px solid #1DB954}.spotify-web-guide h2{margin:0 0 1rem;color:#333;font-size:1.5rem}.spotify-web-guide p{margin:0;color:#666;line-height:1.6}.spotify-web-guide a{color:#1db954;text-decoration:none;font-weight:600;transition:color .2s ease}.spotify-web-guide a:hover{color:#1ed760;text-decoration:underline}li{list-style:none}#whiten{color:#fff}.tagged-tracks{padding:20px;max-width:1200px;margin:0 auto}.tagged-tracks h2{margin-bottom:20px;font-size:1.8rem;color:#1db954}.tag-filter{background-color:#282828;padding:15px;border-radius:8px;margin-bottom:20px}.tag-filter h3{margin-top:0;margin-bottom:10px;font-size:1.2rem}.available-tags{display:flex;flex-wrap:wrap;gap:8px}.filter-tag{background-color:#333;border:1px solid #555;color:#fff;padding:6px 12px;border-radius:15px;font-size:.9rem;cursor:pointer;transition:all .2s ease}.filter-tag:hover{background-color:#3a3a3a}.filter-tag.selected{background-color:#1db954;border-color:#1db954}.search-filter{margin-bottom:20px}.search-filter input{width:100%;padding:10px 15px;border-radius:20px;border:none;background-color:#333;color:#fff;font-size:1rem}.search-filter input:focus{outline:none;box-shadow:0 0 0 2px #1db95480}.success-message{background-color:#1db954;color:#fff;padding:10px 15px;border-radius:4px;margin-bottom:15px;animation:fadeInOut 3s forwards}@keyframes fadeInOut{0%{opacity:0}10%{opacity:1}90%{opacity:1}to{opacity:0}}.error-message{background-color:#e74c3c;color:#fff;padding:10px 15px;border-radius:4px;margin-bottom:15px;display:flex;justify-content:space-between;align-items:center}.error-message button{background:none;border:none;color:#fff;font-size:1.2rem;cursor:pointer;padding:0 5px}.loading{text-align:center;padding:20px;color:#999;font-style:italic}.no-tracks-message{text-align:center;padding:40px 20px;background-color:#282828;border-radius:8px;color:#999}.no-tracks-message p{margin:10px 0}.tracks-list{display:flex;flex-direction:column;gap:15px}.track-item{display:flex;background-color:#282828;border-radius:8px;overflow:hidden;transition:all .3s ease}.track-item:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0003}.track-item.expanded{margin-bottom:10px}.track-image{width:100px;height:100px;flex-shrink:0;overflow:hidden}.track-image img{width:100%;height:100%;object-fit:cover}.track-info{flex-grow:1;padding:15px;display:flex;flex-direction:column;justify-content:space-between}.track-info h3{margin:0 0 5px;font-size:1.2rem;color:#fff}.track-info .artist{margin:0 0 3px;color:#1db954;font-size:1rem}.track-info .album{margin:0 0 10px;color:#b3b3b3;font-size:.9rem}.tag{background-color:#333;color:#fff;padding:4px 10px;border-radius:12px;font-size:.85rem;display:inline-flex;align-items:center;position:relative;cursor:pointer;transition:background-color .2s ease}.tag:hover{background-color:#444}.tag.selected{background-color:#1db954}.tag.deleting{background-color:#e74c3c;animation:pulse 1.5s infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.7}to{opacity:1}}.remove-tag-button{background:none;border:none;color:#fff9;font-size:.9rem;font-weight:700;cursor:pointer;margin-left:5px;padding:0 2px;transition:color .2s ease}.delete-confirmation{display:flex;margin-left:5px;gap:3px}.confirm-delete,.cancel-delete{background:none;border:none;color:#fff;font-size:.8rem;cursor:pointer;padding:0 2px}.confirm-delete{color:#98fb98}.confirm-delete:hover{color:#fff}.cancel-delete{color:#ffa07a}.cancel-delete:hover{color:#fff}.play-button{background:none;border:none;color:#1db954;font-size:1.5rem;cursor:pointer;padding:0 15px;display:flex;align-items:center;transition:transform .2s ease}.play-button:hover{transform:scale(1.2)}.tag-edit-section{margin-top:10px}.toggle-tag-edit{background-color:transparent;border:1px solid #555;color:#b3b3b3;padding:5px 10px;border-radius:15px;font-size:.8rem;cursor:pointer;transition:all .2s ease}.toggle-tag-edit:hover{background-color:#3a3a3a;color:#fff}.add-tag-form{margin-top:10px;display:flex;flex-direction:column;gap:10px}.add-tag-form input{padding:8px 12px;border-radius:4px;border:none;background-color:#333;color:#fff;font-size:.9rem}.add-tag-form input:focus{outline:none;box-shadow:0 0 0 2px #1db95480}.add-tag-form button{align-self:flex-start;background-color:#1db954;border:none;color:#fff;padding:5px 15px;border-radius:15px;font-size:.9rem;cursor:pointer;transition:all .2s ease}.add-tag-form .suggested-tags{display:flex;flex-wrap:wrap;gap:5px}.add-tag-form .suggested-tag{background-color:#333;color:#ddd;font-size:.8rem;padding:3px 8px;border-radius:10px;cursor:pointer}.add-tag-form .suggested-tag:hover{background-color:#444;color:#fff}@media (max-width: 768px){.track-item{flex-direction:column}.track-image{width:100%;height:200px}.play-button{position:absolute;top:10px;right:10px;background-color:#00000080;border-radius:50%;padding:10px}}.tagged-tracks-container{width:100%;max-width:1200px;margin:0 auto;padding:1rem}.tagged-tracks-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem}.tagged-tracks-header h2{margin:0;font-size:1.8rem;color:#1db954}.filter-controls{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:1.5rem;background-color:#1e1e1e99;padding:1rem;border-radius:8px;box-shadow:0 2px 8px #0003}.filter-group{flex:1;min-width:200px}.filter-group h3{margin-top:0;margin-bottom:.5rem;font-size:1rem;color:#eee}.search-bar{display:flex;width:100%;margin-bottom:1rem}.search-bar input{flex:1;padding:.75rem 1rem;border:none;border-radius:4px 0 0 4px;font-size:1rem;background-color:#ffffff1a;color:#fff}.search-bar button{padding:.75rem 1rem;border:none;border-radius:0 4px 4px 0;background-color:#1db954;color:#fff;cursor:pointer;font-weight:700;transition:background-color .3s}.search-bar button:hover{background-color:#1ed760}.tag-filter-area{display:flex;flex-direction:column;margin-bottom:1rem}.filter-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}.filter-tag{display:flex;align-items:center;padding:.5rem .75rem;background-color:#1db954;border-radius:20px;color:#fff;font-size:.9rem;cursor:pointer;transition:all .2s ease}.filter-tag:hover{background-color:#1ed760;transform:translateY(-2px)}.filter-tag-remove{margin-left:.5rem;font-size:1rem;font-weight:700;border:none;background:transparent;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;width:20px;height:20px;border-radius:50%}.filter-tag-remove:hover{background-color:#0003}.suggested-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}.suggested-tag{padding:.4rem .75rem;background-color:#ffffff1a;border-radius:20px;color:#fff;font-size:.85rem;cursor:pointer;transition:background-color .2s;display:flex;align-items:center;gap:.4rem}.suggested-tag:hover{background-color:#fff3}.suggested-tag-count{font-size:.75rem;background-color:#fff3;padding:.2rem .4rem;border-radius:10px}.sort-controls{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.sort-select{padding:.5rem;border-radius:4px;border:none;background-color:#ffffff1a;color:#fff;font-size:.9rem;cursor:pointer}.sort-select:focus{outline:none;box-shadow:0 0 0 2px #1db95480}.direction-button{background-color:#ffffff1a;border:none;color:#fff;width:32px;height:32px;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.2rem;transition:background-color .2s}.direction-button:hover{background-color:#fff3}.tracks-table-container{width:100%;overflow-x:auto;background-color:#1e1e1e99;border-radius:8px;box-shadow:0 2px 8px #0003}.tracks-table{width:100%;border-collapse:collapse;color:#fff}.tracks-table th{padding:1rem;text-align:left;border-bottom:1px solid rgba(255,255,255,.1);font-weight:600;color:#1db954}.tracks-table td{padding:1rem;border-bottom:1px solid rgba(255,255,255,.05);vertical-align:middle}.tracks-table tr:last-child td{border-bottom:none}.tracks-table tr:hover{background-color:#ffffff0d}.album-art{width:50px;height:50px;border-radius:4px;overflow:hidden}.album-art img{width:100%;height:100%;object-fit:cover}.track-info-cell{max-width:300px}.track-name{font-weight:700;margin-bottom:.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.artist-name{font-size:.9rem;color:#aaa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.album-name{font-size:.8rem;color:#888;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tags-cell{min-width:200px}.track-tags{display:flex;flex-wrap:wrap;gap:.4rem}.track-tag{display:inline-flex;align-items:center;background-color:#1db95433;padding:.3rem .5rem;border-radius:4px;font-size:.85rem;color:#1db954;transition:all .2s}.track-tag:hover{background-color:#1db9544d}.remove-tag-btn{margin-left:.3rem;background:none;border:none;color:#1db954;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;font-size:.9rem;opacity:.7}.remove-tag-btn:hover{opacity:1}.add-tag-cell{min-width:200px}.add-tag-form{display:flex;gap:.5rem}.add-tag-input{flex:1;padding:.5rem;border:1px solid rgba(255,255,255,.1);border-radius:4px;background-color:#ffffff0d;color:#fff;font-size:.9rem}.add-tag-input:focus{outline:none;border-color:#1db954;box-shadow:0 0 0 2px #1db95433}.add-tag-btn{padding:.5rem .75rem;background-color:#1db954;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:.9rem;transition:background-color .2s}.add-tag-btn:hover{background-color:#1ed760}.tag-suggestions-dropdown{position:absolute;background-color:#282828;border-radius:4px;box-shadow:0 4px 12px #0000004d;max-height:200px;overflow-y:auto;z-index:10;width:max-content;min-width:150px}.tag-suggestion-item{padding:.5rem 1rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center}.tag-suggestion-item:hover{background-color:#1db95433}.tag-suggestion-name{color:#fff;font-size:.9rem}.tag-suggestion-count{margin-left:.5rem;background-color:#ffffff1a;padding:.2rem .4rem;border-radius:10px;font-size:.75rem;color:#aaa}.actions-cell{width:100px;text-align:center}.play-button{background:none;border:2px solid #1db954;border-radius:50%;color:#1db954;width:34px;height:34px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.play-button:hover{background-color:#1db954;color:#fff}.play-button i{font-size:1rem}.empty-state{padding:3rem 1rem;text-align:center;color:#aaa}.empty-state h3{margin-top:0;color:#1db954;margin-bottom:1rem}.empty-state p{max-width:500px;margin:0 auto 1rem}.pagination-controls{display:flex;justify-content:center;margin-top:1.5rem;gap:.5rem}.pagination-button{padding:.5rem 1rem;background-color:#ffffff1a;border:none;border-radius:4px;color:#fff;font-size:.9rem;cursor:pointer;transition:background-color .2s}.pagination-button:hover{background-color:#fff3}.pagination-button:disabled{opacity:.5;cursor:not-allowed}.pagination-button.active{background-color:#1db954}.pagination-info{display:flex;align-items:center;color:#aaa;font-size:.9rem}@media (max-width: 768px){.tracks-table th:nth-child(3),.tracks-table td:nth-child(3){display:none}.tagged-tracks-header{flex-direction:column;align-items:flex-start}.filter-controls{flex-direction:column}.track-info-cell{max-width:150px}}@media (max-width: 576px){.tracks-table{display:block}.tracks-table thead{display:none}.tracks-table tbody{display:block}.tracks-table tr{display:block;margin-bottom:1rem;padding:1rem;border-bottom:1px solid rgba(255,255,255,.1)}.tracks-table td{display:block;border:none;padding:.5rem 0}.tracks-table td:before{content:attr(data-label);float:left;font-weight:700;margin-right:.5rem}.album-art{margin:0 auto}}.loading-container{display:flex;justify-content:center;align-items:center;padding:3rem 1rem}.loading-spinner{width:40px;height:40px;border:4px solid rgba(255,255,255,.1);border-radius:50%;border-top-color:#1db954;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-message{background-color:#ff3b3033;border-left:4px solid #ff3b30;padding:1rem;margin-bottom:1rem;border-radius:0 4px 4px 0;color:#ff3b30}.now-playing-row{background-color:#1db9541a!important;position:relative}.now-playing-row:before{content:"▶";position:absolute;left:0;color:#1db954;font-size:1rem;display:flex;align-items:center;height:100%;padding-left:.5rem}.track-tags-area{margin-top:.5rem}.track-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.5rem}.tag{background-color:#f0f0f0;padding:.25rem .5rem;border-radius:4px;display:flex;align-items:center;gap:.25rem;font-size:.9rem}.remove-tag-button{background:none;border:none;padding:0;margin-left:.25rem;color:#666;cursor:pointer;font-size:.8rem;line-height:1;opacity:.7;transition:opacity .2s}.remove-tag-button:hover{opacity:1}.add-tag-form form{display:flex;gap:.5rem}.add-tag-form input{flex:1;padding:.25rem .5rem;border:1px solid #ddd;border-radius:4px;font-size:.9rem}.add-tag-form button{padding:.25rem .75rem;background:#1db954;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:.9rem}.add-tag-form button:hover{background:#1ed760}.tag-suggestions{position:absolute;top:100%;left:0;width:100%;background:#fff;border:1px solid #ddd;border-radius:4px;margin-top:.25rem;box-shadow:0 2px 4px #0000001a;z-index:10}.suggested-tag{padding:.5rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center}.suggested-tag:hover{background:#f5f5f5}.tag-count{color:#666;font-size:.8rem}.track-card{background-color:#282828;border-radius:8px;margin-bottom:10px;box-shadow:0 2px 4px #0003;overflow:hidden}.track-info{display:flex;padding:15px;align-items:flex-start;justify-content:space-between}.track-info-main{flex:0 0 40%;min-width:200px}.track-header{display:flex;align-items:center;margin-bottom:5px}.track-header h3{margin:0;font-size:1.1rem;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.artist{margin:0;color:#1db954;font-size:.9rem}.play-button{background:none;border:none;color:#1db954;font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;margin-left:10px;width:30px;height:30px;border-radius:50%;transition:all .2s ease}.play-button:hover{transform:scale(1.2);background-color:#1db95433}.track-tags-area{flex:1;margin-left:20px;display:flex;flex-direction:column}.track-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}.tag{background-color:#1db95426;color:#1db954;padding:4px 10px;border-radius:12px;font-size:.85rem;display:inline-flex;align-items:center}.tag.selected{background-color:#1db954;color:#fff}.remove-tag-button{background:none;border:none;color:#1db954;font-size:.9rem;font-weight:700;cursor:pointer;margin-left:5px;padding:0 2px;transition:color .2s ease}.remove-tag-button:hover{color:#ffffffe6}.add-tag-form{position:relative}.add-tag-form form{display:flex}.add-tag-form input{flex:1;padding:8px 12px;border-radius:4px 0 0 4px;border:none;background-color:#333;color:#fff;font-size:.9rem}.add-tag-form button{padding:8px 12px;border-radius:0 4px 4px 0;border:none;background-color:#1db954;color:#fff;font-size:.9rem;cursor:pointer}.add-tag-form button:hover{background-color:#1ed760}.tag-suggestions{position:absolute;top:100%;left:0;width:100%;background-color:#282828;border-radius:4px;box-shadow:0 4px 6px #0000004d;overflow:hidden;z-index:10}.suggested-tag{padding:8px 12px;cursor:pointer;display:flex;justify-content:space-between}.suggested-tag:hover{background-color:#333}.tag-name{font-weight:500}.tag-count{color:#999;font-size:.8rem}@media (max-width: 768px){.track-info{flex-direction:column}.track-info-main{flex:0 0 100%;margin-bottom:10px}.track-tags-area{margin-left:0;width:100%}}.search-mode-selector{display:flex;margin:12px 0;flex-wrap:wrap;gap:16px}.search-mode-label{display:flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--text-color);font-size:.9rem;padding:6px 10px;border-radius:5px;background-color:var(--secondary-color);transition:background-color .2s}.search-mode-label:hover{background-color:var(--hover-color)}.search-mode-label input{margin-right:8px;cursor:pointer;accent-color:var(--primary-color)}.search-mode-label span{margin-left:4px}@media (max-width: 768px){.tracks-list{grid-template-columns:1fr}.search-mode-selector{flex-direction:column;gap:8px}}