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}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.theme-toggle-button{align-items:center;background:none;border:1px solid var(--border-color);border-radius:8px;color:var(--text-secondary);cursor:pointer;display:flex;font-family:inherit;font-weight:500;gap:8px;transition:all .3s ease}.theme-toggle-button:hover{background:var(--hover-bg);border-color:var(--accent-color);color:var(--text-primary)}.theme-toggle-button:focus{outline:2px solid var(--accent-color);outline-offset:2px}.theme-toggle-button.small{font-size:14px;padding:6px 8px}.theme-toggle-button.medium{font-size:16px;padding:8px 12px}.theme-toggle-button.large{font-size:18px;padding:12px 16px}.theme-toggle-text{font-size:inherit}.theme-toggle-switch{align-items:center;display:flex;gap:12px}.theme-toggle-label{color:var(--text-secondary);font-size:14px;font-weight:500}.theme-switch{cursor:pointer;display:inline-block;position:relative}.theme-switch input{height:0;opacity:0;width:0}.theme-slider{background:var(--switch-bg);border:1px solid var(--border-color);border-radius:28px;display:block;height:28px;position:relative;transition:all .3s ease;width:52px}.theme-slider:before{background:var(--switch-thumb);border-radius:50%;box-shadow:0 2px 4px #0003;content:"";height:20px;left:3px;position:absolute;top:3px;transition:all .3s ease;width:20px}.theme-switch input:checked+.theme-slider{background:var(--accent-color);border-color:var(--accent-color)}.theme-switch input:checked+.theme-slider:before{background:#fff;transform:translateX(24px)}.theme-icon{color:var(--switch-icon-color);font-size:12px;position:absolute;top:50%;transform:translateY(-50%);transition:all .3s ease;z-index:1}.theme-switch input:not(:checked)+.theme-slider .theme-icon{right:6px}.theme-switch input:checked+.theme-slider .theme-icon{color:var(--accent-color);left:6px}.theme-toggle-switch.small .theme-slider{height:24px;width:44px}.theme-toggle-switch.small .theme-slider:before{height:16px;left:3px;top:3px;width:16px}.theme-toggle-switch.small .theme-switch input:checked+.theme-slider:before{transform:translateX(20px)}.theme-toggle-switch.small .theme-icon{font-size:10px}.theme-toggle-switch.large .theme-slider{height:32px;width:60px}.theme-toggle-switch.large .theme-slider:before{height:24px;left:3px;top:3px;width:24px}.theme-toggle-switch.large .theme-switch input:checked+.theme-slider:before{transform:translateX(28px)}.theme-toggle-switch.large .theme-icon{font-size:14px}.theme-switch input:focus+.theme-slider{outline:2px solid var(--accent-color);outline-offset:2px}.theme-icon,.theme-toggle-button i{transition:transform .3s ease}.theme-switch:hover .theme-icon,.theme-toggle-button:hover i{transform:translateY(-50%) scale(1.1)}.top-header{background:var(--header-bg);border-bottom:1px solid var(--border-color);height:60px;position:fixed;top:0;width:100%;z-index:1000}.header-content{height:100%;justify-content:space-between;margin:0 auto;max-width:1400px;padding:0 20px}.header-content,.header-left{align-items:center;display:flex}.header-left{gap:24px}.logo{color:var(--text-primary)}.logo:hover{color:var(--accent-color)}.main-nav ul{display:flex;gap:20px;list-style:none;margin:0;padding:0}.nav-link{background:none;border:none;border-radius:4px;color:var(--text-secondary);cursor:pointer;font-size:14px;font-weight:500;padding:8px 12px;text-decoration:none;transition:all .2s ease}.nav-link:hover{background:var(--bg-hover);color:var(--text-primary)}.nav-link.active{background:var(--accent-light);color:var(--accent-color)}.header-center{flex:1 1;margin:0 40px;max-width:400px}.search-container{position:relative;width:100%}.search-container i{color:var(--input-placeholder);font-size:14px;left:12px;position:absolute;top:50%;transform:translateY(-50%)}.search-container input{background:var(--input-bg);border:1px solid var(--input-border);border-radius:20px;color:var(--text-primary);font-size:14px;outline:none;padding:10px 12px 10px 36px;transition:all .2s ease;width:100%}.search-container input:focus{background:#333;border-color:#ff6b35}.search-container input::placeholder{color:#666}.header-right{align-items:center;display:flex;gap:12px}.btn{border-radius:20px;gap:6px;padding:8px 16px}.btn-secondary{background:#0000;border:1px solid #444;color:#ccc}.btn-secondary:hover{background:#ffffff1a;border-color:#666;color:#fff}.btn-primary{border:1px solid #ff6b35}.btn-primary:hover{background:#e55a2b;border-color:#e55a2b}.user-profile{align-items:center;display:flex;gap:12px;position:relative}.user-info{align-items:flex-end;display:flex;flex-direction:column;text-align:right}.user-name{color:#fff;font-size:14px;font-weight:500}.user-email{color:#999;font-size:12px}.user-avatar{align-items:center;background:#333;border-radius:50%;color:#ccc;display:flex;font-size:20px;height:36px;justify-content:center;width:36px}.user-dropdown{position:relative}.dropdown-toggle{background:none;border:none;border-radius:4px;color:#ccc;cursor:pointer;padding:4px;transition:all .2s ease}.dropdown-toggle:hover{background:#ffffff1a;color:#fff}.dropdown-menu{background:#2a2a2a;border:1px solid #444;border-radius:8px;box-shadow:0 4px 12px #0000004d;margin-top:4px;min-width:180px;position:absolute;right:0;top:100%;z-index:1001}.dropdown-item{align-items:center;background:none;border:none;color:#ccc;cursor:pointer;display:flex;font-size:14px;gap:12px;padding:12px 16px;text-align:left;transition:all .2s ease;width:100%}.dropdown-item:hover{background:#ffffff1a;color:#fff}.dropdown-item:first-child{border-radius:8px 8px 0 0}.dropdown-item:last-child{border-radius:0 0 8px 8px}.dropdown-divider{background:#444;height:1px;margin:4px 0}@media (max-width:768px){.header-content{padding:0 16px}.header-left{gap:16px}.main-nav ul{gap:12px}.nav-link{font-size:13px;padding:6px 8px}.header-center{margin:0 20px;max-width:300px}.user-info{display:none}}@media (max-width:480px){.header-center{margin:0 12px;max-width:200px}.search-container input{font-size:13px;padding:8px 10px 8px 32px}.btn{font-size:13px;padding:6px 12px}}.theme-toggle-item{align-items:center!important;border:none!important;cursor:default!important;display:flex!important;justify-content:space-between!important;padding:8px 16px!important}.theme-toggle-item,.theme-toggle-item:hover{background:none!important}.theme-toggle-item .theme-toggle-switch{margin:0}.theme-toggle-item .theme-toggle-label{color:var(--text-secondary);font-size:14px;margin-right:12px}.music-card{background:#1e1e1e;border:1px solid #0000;border-radius:12px;cursor:pointer;max-width:220px;min-width:180px;padding:16px;position:relative;transition:all .3s ease}.music-card:hover{background:#252525;border-color:#333;box-shadow:0 8px 24px #0000004d;transform:translateY(-2px)}.music-card.now-playing{background:#ff6b351a;border-color:#ff6b35}.card-image-container{aspect-ratio:1;border-radius:8px;margin-bottom:12px;overflow:hidden;position:relative;width:100%}.card-image{height:100%;object-fit:cover;transition:transform .3s ease;width:100%}.music-card:hover .card-image{transform:scale(1.05)}.card-overlay{align-items:center;background:#0009;bottom:0;display:flex;justify-content:center;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.music-card:hover .card-overlay{opacity:1}.overlay-buttons{flex-direction:column;gap:12px}.overlay-buttons,.play-button{align-items:center;display:flex}.play-button{background:#ff6b35;border:none;border-radius:50%;box-shadow:0 4px 12px #ff6b354d;color:#fff;cursor:pointer;font-size:20px;height:48px;justify-content:center;transition:all .2s ease;width:48px}.play-button:hover{background:#e55a2b;transform:scale(1.1)}.secondary-buttons{display:flex;gap:8px}.secondary-button{align-items:center;background:#ffffffe6;border:none;border-radius:50%;color:#333;cursor:pointer;display:flex;font-size:16px;height:36px;justify-content:center;transition:all .2s ease;width:36px}.secondary-button:hover{background:#fff;transform:scale(1.1)}.like-button.liked{background:#ff6b35;color:#fff}.like-button.liked:hover{background:#e55a2b}.now-playing-indicator{height:16px;position:absolute;right:8px;top:8px}.equalizer-bar{border-radius:2px;width:3px}.equalizer-bar:first-child{height:8px}.equalizer-bar:nth-child(2){height:12px}.equalizer-bar:nth-child(3){height:6px}.equalizer-bar:nth-child(4){height:10px}.card-content{text-align:left}.card-title{-webkit-line-clamp:2;color:#fff}.card-subtitle,.card-title{-webkit-box-orient:vertical;display:-webkit-box;line-height:1.3;margin:0 0 4px}.card-subtitle{-webkit-line-clamp:1;color:#999}.card-duration{color:#666;font-size:11px;font-weight:500}@media (max-width:768px){.music-card{max-width:180px;min-width:160px;padding:12px}.play-button{font-size:18px;height:40px;width:40px}.secondary-button{font-size:14px;height:32px;width:32px}.card-title{font-size:13px}.card-subtitle{font-size:11px}}@media (max-width:480px){.music-card{max-width:160px;min-width:140px;padding:10px}.play-button{font-size:16px;height:36px;width:36px}.secondary-button{font-size:12px;height:28px;width:28px}.secondary-buttons{gap:6px}}.music-card:focus{outline:2px solid #ff6b35;outline-offset:2px}.play-button:focus,.secondary-button:focus{outline:2px solid #fff;outline-offset:2px}.music-player{align-items:center;background:var(--player-bg);border-top:1px solid var(--border-color);bottom:0;display:flex;gap:20px;height:70px;left:0;padding:10px 20px;position:fixed;right:0;z-index:1000}.music-player.hidden{display:none}.player-track-info{align-items:center;display:flex;flex:0 0 auto;gap:12px;min-width:200px}.track-image{object-fit:cover}.track-image,.track-image-placeholder{border-radius:8px;height:50px;width:50px}.track-image-placeholder{align-items:center;background:var(--bg-tertiary);color:var(--text-muted);display:flex;font-size:20px;justify-content:center}.track-image-placeholder:before{content:"\f4c3";font-family:bootstrap-icons}.player-title-container{align-items:center;display:flex;gap:8px;margin-bottom:4px}.card-title{color:var(--text-primary);font-size:14px;font-weight:600}.card-subtitle,.card-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-subtitle{color:var(--text-secondary);font-size:12px}.now-playing-indicator{align-items:end;display:flex;gap:2px;height:12px}.equalizer-bar{animation:equalizer 1.5s ease-in-out infinite;background:#ff6b35;border-radius:1px;width:2px}.equalizer-bar:first-child{animation-delay:0s;height:6px}.equalizer-bar:nth-child(2){animation-delay:.2s;height:10px}.equalizer-bar:nth-child(3){animation-delay:.4s;height:4px}.equalizer-bar:nth-child(4){animation-delay:.6s;height:8px}@keyframes equalizer{0%,to{transform:scaleY(1)}50%{transform:scaleY(.3)}}.player-buttons{gap:16px}.player-btn,.player-buttons{align-items:center;display:flex}.player-btn{background:none;border:none;border-radius:50%;color:var(--text-secondary);cursor:pointer;font-size:16px;justify-content:center;padding:8px;transition:all .2s ease}.player-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.player-btn.active,.player-btn[data-active=true]{color:var(--success-color)}.player-btn-main{background:var(--text-primary);border-radius:50%;color:var(--bg-primary);font-size:16px;height:32px;width:32px}.player-btn-main:hover{background:var(--text-secondary);color:var(--bg-primary);transform:scale(1.06)}.progress-container{align-items:center;display:flex;gap:12px;margin:0 auto;max-width:500px;width:100%}.time-display{color:var(--text-secondary);font-size:11px;font-weight:400;min-width:40px;text-align:center}.progress-bar{background:var(--border-color);border-radius:2px;cursor:pointer;flex:1 1;height:4px;position:relative}.progress-fill{background:var(--text-primary);border-radius:2px;height:100%;transition:width .1s ease}.progress-bar:hover .progress-fill{background:var(--success-color)}.player-extra-controls{align-items:center;display:flex;flex:0 0 auto;gap:16px;justify-content:flex-end;min-width:180px}.player-volume{align-items:center;display:flex;gap:8px}.volume-slider{-webkit-appearance:none;appearance:none;background:var(--border-color);border-radius:2px;cursor:pointer;height:4px;outline:none;width:93px}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--text-primary);border-radius:50%;cursor:pointer;height:12px;width:12px}.volume-slider::-moz-range-thumb{background:var(--text-primary);border:none;border-radius:50%;cursor:pointer;height:12px;width:12px}.volume-slider:hover::-webkit-slider-thumb{background:var(--success-color)}.volume-slider:hover::-moz-range-thumb{background:var(--success-color)}@media (max-width:768px){.music-player{gap:12px;height:70px;padding:8px 16px}.player-track-info{min-width:150px}.track-image,.track-image-placeholder{height:40px;width:40px}.card-title{font-size:13px}.card-subtitle{font-size:11px}.player-buttons{gap:12px}.player-btn{font-size:14px;padding:6px}.player-btn-main{font-size:14px;height:28px;width:28px}.progress-container{max-width:300px}.player-extra-controls{min-width:120px}.volume-slider{width:60px}}@media (max-width:480px){.music-player{gap:8px;height:60px;padding:6px 12px}.player-track-info{min-width:120px}.track-image,.track-image-placeholder{height:32px;width:32px}.card-title{font-size:12px}.card-subtitle{font-size:10px}.player-buttons{gap:8px}.player-btn{font-size:12px;padding:4px}.player-btn-main{font-size:12px;height:24px;width:24px}.time-display{font-size:10px;min-width:30px}.progress-container{max-width:200px}.player-extra-controls{min-width:80px}.volume-slider{width:40px}}.player-btn:focus,.progress-bar:focus,.volume-slider:focus{outline:2px solid #ff6b35;outline-offset:2px}.home-page{min-height:100vh;padding-bottom:80px;padding-top:60px}.main-content{margin:0 auto;max-width:1400px;padding:40px 20px}.content-section{margin-bottom:48px}.content-section h2{color:#fff;font-size:24px;font-weight:700;margin:0 0 24px;padding:0}.section-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:24px}.clear-search-btn{background:none;border:none;border-radius:50%;color:#999;cursor:pointer;font-size:18px;padding:8px;transition:all .2s ease}.clear-search-btn:hover{background:#ffffff1a;color:#fff}.search-results-section{animation:slideUp .3s ease-out}.search-no-results{flex-direction:column;padding:60px 20px;text-align:center}.search-no-results,.search-no-results-icon-container{align-items:center;display:flex;justify-content:center}.search-no-results-icon-container{background:#ffffff1a;border-radius:50%;height:80px;margin-bottom:24px;width:80px}.search-no-results-icon{color:#666;font-size:32px}.search-no-results-title{color:#fff;font-size:20px;font-weight:600;margin:0 0 12px}.search-no-results-message{color:#999;font-size:16px;line-height:1.5;margin:0 0 8px}.search-no-results-hint{color:#666;font-size:14px;line-height:1.5;margin:0}@media (max-width:1200px){.music-grid{gap:16px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}}@media (max-width:768px){.main-content{padding:32px 16px}.content-section{margin-bottom:40px}.content-section h2{font-size:20px;margin-bottom:20px}.music-grid{gap:12px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.search-no-results{padding:40px 16px}.search-no-results-icon-container{height:60px;margin-bottom:20px;width:60px}.search-no-results-icon{font-size:24px}.search-no-results-title{font-size:18px}.search-no-results-message{font-size:14px}.search-no-results-hint{font-size:13px}}@media (max-width:480px){.home-page{padding-bottom:60px}.main-content{padding:24px 12px}.content-section{margin-bottom:32px}.content-section h2{font-size:18px;margin-bottom:16px}.music-grid{gap:10px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.search-no-results{padding:32px 12px}.search-no-results-icon-container{height:50px;margin-bottom:16px;width:50px}.search-no-results-icon{font-size:20px}.search-no-results-title{font-size:16px}.search-no-results-message{font-size:13px}.search-no-results-hint{font-size:12px}}.loading-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.loading-card{animation:pulse 1.5s ease-in-out infinite;background:#1e1e1e;border-radius:12px;padding:16px}.loading-card-image{aspect-ratio:1;background:#333;border-radius:8px;margin-bottom:12px;width:100%}.loading-card-title{background:#333;border-radius:4px;height:16px;margin-bottom:8px}.loading-card-subtitle{background:#333;border-radius:4px;height:12px;width:70%}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.clear-search-btn:focus{outline:2px solid #ff6b35;outline-offset:2px}@media (prefers-contrast:high){.search-no-results-icon-container{border:2px solid #fff}.search-no-results-title{color:#fff}.search-no-results-hint,.search-no-results-message{color:#ccc}}.login-page{background:#121212;color:#fff;min-height:100vh}.login-header{background:#1a1a1a;border-bottom:1px solid #333;height:60px;padding:0}.login-header .header-content{align-items:center;display:flex;height:100%;justify-content:space-between;margin:0 auto;max-width:1400px;padding:0 20px}.logo{align-items:center;color:#fff;display:flex;font-size:20px;font-weight:700;gap:8px;text-decoration:none}.logo:hover{color:#ff6b35}.back-link{align-items:center;border-radius:4px;color:#ccc;display:flex;font-size:14px;gap:8px;padding:8px 12px;text-decoration:none;transition:all .2s ease}.back-link:hover{background:#ffffff1a;color:#fff}.login-main{align-items:center;display:flex;justify-content:center;min-height:calc(100vh - 60px);padding:40px 20px}.auth-container{max-width:400px;width:100%}.auth-form{background:#1e1e1e;border:1px solid #333;border-radius:12px;padding:32px}.form-header{margin-bottom:32px;text-align:center}.form-icon{align-items:center;background:#ff6b351a;border-radius:50%;color:#ff6b35;display:flex;font-size:24px;height:60px;justify-content:center;margin:0 auto 16px;width:60px}.form-title{color:#fff;font-size:24px;font-weight:700;margin:0 0 8px}.form-subtitle{color:#999;font-size:14px;margin:0}.form-group{margin-bottom:20px}.form-row{grid-gap:16px;display:grid;gap:16px;grid-template-columns:1fr 1fr}.form-label{color:#fff;display:block;font-size:14px;font-weight:500;margin-bottom:8px}.input-container{position:relative}.input-icon{color:#666;font-size:16px;left:12px;position:absolute;top:50%;transform:translateY(-50%)}.form-input{background:#2a2a2a;border:1px solid #444;border-radius:8px;color:#fff;font-size:14px;outline:none;padding:12px 12px 12px 40px;transition:all .2s ease;width:100%}.form-input:focus{background:#333;border-color:#ff6b35}.form-input::placeholder{color:#666}.password-toggle{background:none;border:none;color:#666;cursor:pointer;font-size:16px;position:absolute;right:12px;top:50%;transform:translateY(-50%);transition:color .2s ease}.password-toggle:hover{color:#fff}.form-options{margin-bottom:24px}.checkbox-container{align-items:center;color:#ccc;cursor:pointer;display:flex;font-size:14px;gap:8px}.checkbox-container input[type=checkbox]{accent-color:#ff6b35;height:16px;width:16px}.checkbox-text{line-height:1.4}.btn{align-items:center;border:none;border-radius:8px;cursor:pointer;display:inline-flex;font-size:14px;font-weight:500;gap:8px;justify-content:center;padding:12px 24px;text-decoration:none;transition:all .2s ease}.btn-primary{background:#ff6b35;color:#fff}.btn-primary:hover:not(:disabled){background:#e55a2b}.btn-primary:disabled{background:#666;cursor:not-allowed}.btn-full{width:100%}.error-message{background:#ef44441a;border:1px solid #ef4444;border-radius:8px;color:#ef4444;font-size:14px;margin-top:16px;padding:12px;text-align:center}.form-footer{border-top:1px solid #333;margin-top:24px;padding-top:24px;text-align:center}.form-footer p{color:#999;font-size:14px;margin:0}.switch-form-btn{background:none;border:none;color:#ff6b35;cursor:pointer;font-size:14px;font-weight:500;text-decoration:underline}.switch-form-btn:hover{color:#e55a2b}@media (max-width:768px){.login-main{padding:20px 16px}.auth-form{padding:24px}.form-row{gap:20px;grid-template-columns:1fr}.form-icon,.form-title{font-size:20px}.form-icon{height:50px;width:50px}}@media (max-width:480px){.login-header .header-content{padding:0 16px}.logo{font-size:18px}.back-link{font-size:13px}.auth-form{padding:20px}.form-title{font-size:18px}.form-subtitle{font-size:13px}}.dashboard-page{background:var(--bg-primary);color:var(--text-primary);min-height:100vh;padding-bottom:80px;padding-top:60px}.dashboard-main{margin:0 auto;max-width:1400px;padding:0}.dashboard-content{padding:40px 20px}.section-header{margin-bottom:32px}.section-header h2{color:var(--text-primary);font-size:28px;font-weight:700;margin:0 0 8px}.section-subtitle{color:var(--text-tertiary);font-size:16px;margin:0}.music-section{margin-bottom:48px}.music-section h3{color:var(--text-primary);font-size:20px;font-weight:600;margin:0 0 20px}.music-grid-wrapper{overflow:hidden;position:relative}.music-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));padding:0}.library-content{display:flex;flex-direction:column;gap:48px}.library-tab-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:24px}.library-tab-header h3{color:#fff;font-size:20px;font-weight:600;margin:0}.library-count{color:#999;font-size:14px;font-weight:500}.library-empty{flex-direction:column;padding:60px 20px;text-align:center}.library-empty,.library-empty-icon{align-items:center;display:flex;justify-content:center}.library-empty-icon{background:#ffffff1a;border-radius:50%;color:#666;font-size:32px;height:80px;margin-bottom:24px;width:80px}.library-empty h3{color:#fff;font-size:18px;font-weight:600;margin:0 0 12px}.library-empty p{color:#999;font-size:14px;line-height:1.5;margin:0}.recent-tracks-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.profile-container{max-width:800px}.profile-card{background:#1e1e1e;border:1px solid #333;border-radius:12px;padding:32px}.profile-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:32px}.profile-avatar-section{align-items:center;display:flex;gap:20px}.profile-avatar{align-items:center;background:#333;border-radius:50%;color:#ccc;display:flex;font-size:40px;height:80px;justify-content:center;width:80px}.profile-basic-info h3{color:#fff;font-size:20px;font-weight:600;margin:0 0 4px}.profile-email{color:#999;font-size:14px;margin:0 0 4px}.profile-join-date{color:#666;font-size:12px;margin:0}.profile-stats{grid-gap:24px;background:#ffffff0d;border-radius:8px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));margin-bottom:32px;padding:24px}.stat-item{text-align:center}.stat-number{color:#ff6b35;font-size:24px;font-weight:700;margin-bottom:4px}.stat-label{color:#999;font-size:12px;font-weight:500}.profile-bio-section,.profile-details-section,.profile-preferences{margin-bottom:24px}.profile-bio-section h4,.profile-details-section h4,.profile-preferences h4{color:#fff;font-size:16px;font-weight:600;margin:0 0 16px}.profile-details-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.profile-detail-item{align-items:center;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:8px;display:flex;gap:12px;padding:12px;transition:all .2s ease}.profile-detail-item:hover{background:#ffffff14;border-color:#ff6b354d}.detail-icon{align-items:center;background:#ff6b351a;border-radius:50%;color:#ff6b35;display:flex;flex-shrink:0;font-size:16px;height:36px;justify-content:center;width:36px}.detail-content{flex:1 1;min-width:0}.detail-label{color:#999;font-size:12px;margin-bottom:2px}.detail-label,.detail-value{display:block;font-weight:500}.detail-value{color:#fff;font-size:14px;word-break:break-word}.profile-bio{color:#ccc;font-size:14px;line-height:1.5;margin:0}.genre-tags{display:flex;flex-wrap:wrap;gap:8px}.genre-tag{background:#ff6b351a;border:1px solid #ff6b354d;border-radius:16px;color:#ff6b35;font-size:12px;font-weight:500;padding:4px 12px}.settings-container{display:flex;flex-direction:column;gap:32px;max-width:800px}.settings-category{background:#1e1e1e;border:1px solid #333;border-radius:12px;padding:24px}.category-title{align-items:center;color:#fff;display:flex;font-size:18px;font-weight:600;gap:12px;margin:0 0 20px}.settings-group{display:flex;flex-direction:column;gap:20px}.setting-item{align-items:center;display:flex;gap:20px;justify-content:space-between}.setting-info{flex:1 1}.setting-title{color:#fff;display:block;font-size:14px;font-weight:500;margin-bottom:4px}.setting-desc{color:#999;font-size:12px;line-height:1.4}.setting-control{align-items:center;display:flex;gap:12px}.theme-toggle{background:#2a2a2a;border-radius:8px;display:flex;gap:4px;padding:4px}.theme-option{align-items:center;background:none;border:none;border-radius:6px;color:#999;cursor:pointer;display:flex;font-size:12px;gap:6px;padding:8px 12px;transition:all .2s ease}.theme-option.active{background:#ff6b35;color:#fff}.setting-slider{-webkit-appearance:none;appearance:none;background:#333;border-radius:2px;cursor:pointer;height:4px;outline:none;width:120px}.setting-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#ff6b35;border-radius:50%;cursor:pointer;height:16px;width:16px}.slider-value{color:#ccc;font-size:12px;font-weight:500;min-width:35px}.toggle-switch{display:inline-block;height:24px;position:relative;width:44px}.toggle-switch input{height:0;opacity:0;width:0}.toggle-slider{background-color:#333;border-radius:24px;bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:.2s}.toggle-slider:before{background-color:#ccc;border-radius:50%;bottom:3px;content:"";height:18px;left:3px;position:absolute;transition:.2s;width:18px}input:checked+.toggle-slider{background-color:#ff6b35}input:checked+.toggle-slider:before{background-color:#fff;transform:translateX(20px)}@media (max-width:768px){.dashboard-content{padding:32px 16px}.music-grid{gap:16px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.profile-header{align-items:flex-start;flex-direction:column;gap:20px}.profile-stats{grid-template-columns:repeat(2,1fr)}.profile-details-grid{gap:12px;grid-template-columns:1fr}.profile-detail-item{padding:10px}.detail-icon{font-size:14px;height:32px;width:32px}.setting-item{align-items:flex-start;flex-direction:column;gap:12px}}@media (max-width:480px){.dashboard-content{padding:24px 12px}.music-grid{gap:12px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.profile-card,.settings-category{padding:20px}.profile-stats{gap:16px;grid-template-columns:1fr}}.feed-content{display:flex;flex-direction:column;gap:48px}.feed-block-title{align-items:center;color:#fff;display:flex;font-size:20px;font-weight:600;gap:12px;margin:0 0 8px}.feed-block-subtitle{color:#999;font-size:14px;margin:0 0 24px}.activity-list{background:#1e1e1e;border:1px solid #333;border-radius:12px;display:flex;flex-direction:column;gap:16px;padding:20px}.activity-item{align-items:center;border-bottom:1px solid #333;display:flex;gap:16px;padding:12px 0}.activity-item:last-child{border-bottom:none;padding-bottom:0}.activity-icon{align-items:center;background:#ff6b351a;border-radius:50%;color:#ff6b35;display:flex;flex-shrink:0;font-size:16px;height:40px;justify-content:center;width:40px}.activity-content{flex:1 1;min-width:0}.activity-text{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:4px}.activity-action{color:#ccc;font-size:14px}.activity-song{color:#fff;font-size:14px;font-weight:500}.activity-artist{color:#999;font-size:14px}.activity-time{color:#666;font-size:12px}.activity-song-preview{flex-shrink:0}.activity-cover{border-radius:6px;height:48px;object-fit:cover;width:48px}.feed-empty-state{background:#1e1e1e;border:1px solid #333;border-radius:12px;flex-direction:column;padding:60px 20px;text-align:center}.feed-empty-icon,.feed-empty-state{align-items:center;display:flex;justify-content:center}.feed-empty-icon{background:#ff6b351a;border-radius:50%;color:#ff6b35;font-size:32px;height:80px;margin-bottom:24px;width:80px}.feed-empty-state h3{color:#fff;font-size:20px;font-weight:600;margin:0 0 12px}.feed-empty-state p{color:#999;font-size:14px;line-height:1.5;margin:0 0 32px;max-width:400px}.feed-empty-suggestions{max-width:600px;width:100%}.feed-empty-suggestions h4{color:#fff;font-size:16px;font-weight:600;margin:0 0 20px}@media (max-width:768px){.feed-content{gap:32px}.activity-list{padding:16px}.activity-item{gap:12px}.activity-icon{font-size:14px;height:36px;width:36px}.activity-cover{height:40px;width:40px}.activity-text{flex-direction:column;gap:2px}.feed-empty-state{padding:40px 16px}.feed-empty-icon{font-size:24px;height:60px;width:60px}}@media (max-width:480px){.feed-block-title{font-size:18px}.activity-list{padding:12px}.activity-item{gap:10px;padding:10px 0}.activity-icon{font-size:12px;height:32px;width:32px}.activity-cover{height:36px;width:36px}.activity-action,.activity-artist,.activity-song{font-size:13px}.activity-time{font-size:11px}}.notification{animation:slideInRight .3s ease-out;border-radius:8px;box-shadow:0 4px 12px #0000004d;max-width:400px;min-width:300px;position:fixed;right:20px;top:80px;z-index:1001}.notification-content{align-items:center;background:#2a2a2a;border-left:4px solid;border-radius:8px;display:flex;gap:12px;padding:16px}.notification-success .notification-content{background:#22c55e1a;border-left-color:#22c55e}.notification-error .notification-content{background:#ef44441a;border-left-color:#ef4444}.notification-warning .notification-content{background:#f59e0b1a;border-left-color:#f59e0b}.notification-info .notification-content{background:#3b82f61a;border-left-color:#3b82f6}.notification-icon{flex-shrink:0;font-size:18px}.notification-success .notification-icon{color:#22c55e}.notification-error .notification-icon{color:#ef4444}.notification-warning .notification-icon{color:#f59e0b}.notification-info .notification-icon{color:#3b82f6}.notification-message{color:#fff;flex:1 1;font-size:14px;line-height:1.4}.notification-close{background:none;border:none;border-radius:4px;color:#999;cursor:pointer;flex-shrink:0;font-size:16px;padding:4px;transition:all .2s ease}.notification-close:hover{background:#ffffff1a;color:#fff}@keyframes slideInRight{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}@keyframes slideOutRight{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100%)}}.notification.closing{animation:slideOutRight .3s ease-in}@media (max-width:768px){.notification{left:16px;max-width:none;min-width:auto;right:16px;top:70px}.notification-content{padding:12px}.notification-message{font-size:13px}.notification-icon{font-size:16px}}@media (max-width:480px){.notification{left:12px;right:12px;top:65px}.notification-content{gap:10px;padding:10px}.notification-message{font-size:12px}.notification-close,.notification-icon{font-size:14px}}.notification-close:focus{outline:2px solid #ff6b35;outline-offset:2px}@media (prefers-contrast:high){.notification-content{border:2px solid #fff}.notification-close,.notification-message{color:#fff}}:root{--bg-primary:#121212;--bg-secondary:#1a1a1a;--bg-tertiary:#1e1e1e;--bg-card:#1e1e1e;--bg-hover:#ffffff0d;--bg-active:#ffffff1a;--text-primary:#fff;--text-secondary:#b3b3b3;--text-tertiary:#999;--text-muted:#666;--border-color:#333;--border-light:#404040;--border-hover:#555;--accent-color:#ff6b35;--accent-hover:#e55a2b;--accent-light:#ff6b351a;--accent-border:#ff6b354d;--success-color:#1db954;--success-light:#1db9541a;--warning-color:#ffa726;--warning-light:#ffa7261a;--error-color:#f44336;--error-light:#f443361a;--info-color:#2196f3;--info-light:#2196f31a;--header-bg:#121212;--sidebar-bg:#121212;--player-bg:#121212;--modal-bg:#1e1e1e;--modal-overlay:#000c;--input-bg:#1e1e1e;--input-border:#333;--input-focus:#ff6b35;--input-placeholder:#666;--shadow-sm:0 1px 3px #0000004d;--shadow-md:0 4px 6px #0000004d;--shadow-lg:0 10px 15px #0000004d;--shadow-xl:0 20px 25px #0006;--switch-bg:#333;--switch-thumb:#fff;--switch-icon-color:#999;--scrollbar-track:#1e1e1e;--scrollbar-thumb:#333;--scrollbar-thumb-hover:#555}:root.theme-light{--bg-primary:#f8f9fa;--bg-secondary:#fff;--bg-tertiary:#fefefe;--bg-card:#fefefe;--bg-hover:#0000000a;--bg-active:#00000014;--text-primary:#212529;--text-secondary:#495057;--text-tertiary:#6c757d;--text-muted:#adb5bd;--border-color:#e9ecef;--border-light:#f1f3f4;--border-hover:#dee2e6;--accent-color:#ff6b35;--accent-hover:#e55a2b;--accent-light:#ff6b3514;--accent-border:#ff6b3533;--success-color:#198754;--success-light:#19875414;--warning-color:#fd7e14;--warning-light:#fd7e1414;--error-color:#dc3545;--error-light:#dc354514;--info-color:#0d6efd;--info-light:#0d6efd14;--header-bg:#fff;--sidebar-bg:#f8f9fa;--player-bg:#fff;--modal-bg:#fff;--modal-overlay:#00000080;--input-bg:#fff;--input-border:#e9ecef;--input-focus:#ff6b35;--input-placeholder:#adb5bd;--shadow-sm:0 1px 3px #0000001a;--shadow-md:0 4px 6px #0000001a;--shadow-lg:0 10px 15px #0000001a;--shadow-xl:0 20px 25px #00000026;--switch-bg:#e9ecef;--switch-thumb:#fff;--switch-icon-color:#6c757d;--scrollbar-track:#f1f3f4;--scrollbar-thumb:#c1c8cd;--scrollbar-thumb-hover:#adb5bd}*{transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease}.theme-transitioning *{transition:none!important}::-webkit-scrollbar{height:8px;width:8px}::-webkit-scrollbar-track{background:#1e1e1e;background:var(--scrollbar-track);border-radius:4px}::-webkit-scrollbar-thumb{background:#333;background:var(--scrollbar-thumb);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555;background:var(--scrollbar-thumb-hover)}*{scrollbar-color:#333 #1e1e1e;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track);scrollbar-width:thin}.App{background:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;min-height:100vh}*{box-sizing:border-box}body{background:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;margin:0;overflow-x:hidden;padding:0}button{font-family:inherit}a{color:inherit;text-decoration:none}:focus{outline:2px solid var(--accent-color);outline-offset:2px}.hidden{display:none!important}.sr-only{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.fade-in{animation:fadeIn .3s ease-in-out}.fade-out{animation:fadeOut .3s ease-in-out}.slide-up{animation:slideUp .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.loading-spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
/*# sourceMappingURL=main.0d099945.css.map*/