.logo,.navbar,.stats{display:flex}.logo,.nav-btn,.pagination a,.related-item{text-decoration:none}.desktop-next-btn,.desktop-prev-btn,.nav-btn,.search-btn{white-space:nowrap}.mobile-nav-btn:hover:not(.disabled),.nav-btn:not(.disabled):hover{background-color:var(--primary-dark)}:root{--primary:#7c3aed;--primary-dark:#6b21a8;--primary-light:#ede9fe;--secondary:#f5f3ff;--accent:#ec4899;--text-primary:#1f2937;--text-secondary:#4b5563;--text-light:#9ca3af;--border:#e5e7eb;--card-bg:#ffffff;--card-shadow:0 4px 12px rgba(0, 0, 0, 0.08);--hover-bg:#f5f5f5}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,'PingFang SC','Microsoft YaHei',sans-serif;line-height:1.6;color:var(--text-primary);background:var(--secondary);min-height:100vh}.container{max-width:1200px;margin:0 auto;padding:0 20px}.header{background:var(--card-bg);border-bottom:1px solid var(--border)}.navbar{justify-content:space-between;align-items:center;padding:1rem 0}.logo{align-items:center;gap:12px;transition:transform .3s}.logo:hover{transform:translateY(-2px)}.logo-icon{font-size:2rem;color:var(--primary)}.logo-text{font-size:1.5rem;font-weight:700;color:var(--text-primary)}.logo-tagline{font-size:.85rem;color:var(--text-secondary);font-weight:500}.stats{gap:1.5rem;align-items:center}.stat-item{text-align:center;padding:.6rem 1.2rem;background:var(--secondary);border-radius:8px}.detail-card,.main-content{background:var(--card-bg);box-shadow:var(--card-shadow)}.stat-number{font-size:1.2rem;font-weight:600;color:var(--primary);display:block;line-height:1.2}.stat-label{font-size:.8rem;color:var(--text-secondary);font-weight:500}.main-content{border-radius:8px;margin:1rem auto;overflow:hidden;padding:1rem}.detail-container{max-width:1000px;margin:0 auto;padding:2rem}.detail-card{border-radius:12px;padding:2rem;margin-bottom:2rem;border:1px solid var(--border)}.detail-header{text-align:center;margin-bottom:3rem}.contact-card h3,.detail-title{margin-bottom:1rem;color:var(--text-primary)}.detail-title{font-size:2.2rem;font-weight:700}.page-subtitle{font-size:1.1rem;line-height:1.8;max-width:700px;margin:0 auto}.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-bottom:4rem}.contact-card{background:var(--secondary);border-radius:12px;padding:2rem;text-align:center;border:1px solid var(--border);transition:transform .3s,box-shadow .3s;display:flex;flex-direction:column;align-items:center}.contact-card:hover{transform:translateY(-5px);box-shadow:var(--card-shadow)}.contact-icon{font-size:2.5rem;color:var(--primary);margin-bottom:1.5rem;width:60px;height:60px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:50%;border:1px solid var(--border)}.commitment-item,.search-section{background:var(--secondary);text-align:center}.contact-card h3{font-size:1.3rem;font-weight:600}.contact-detail{font-size:1.1rem;font-weight:600;color:var(--primary);margin-bottom:.5rem;min-height:24px}.contact-desc{color:var(--text-secondary);font-size:.95rem;line-height:1.6}.service-commitment{margin-top:4rem}.service-commitment h3{color:var(--text-primary);font-size:1.5rem;margin-bottom:2rem;display:flex;align-items:center;gap:.5rem;text-align:center;justify-content:center}.commitment-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}.commitment-item{padding:1.5rem;border-radius:10px;border:1px solid var(--border)}.commitment-item i{font-size:1.5rem;color:var(--primary);margin-bottom:1rem}.commitment-item h4{color:var(--text-primary);margin-bottom:.5rem;font-size:1.1rem}.commitment-item p,.selected-count{color:var(--text-secondary);font-size:.9rem}.search-section{padding:1.5rem 2rem;margin-bottom:1rem;border-radius:8px}.search-container{max-width:600px;margin:0 auto}.search-title{font-size:1.5rem;font-weight:600;color:var(--text-primary);margin-bottom:.5rem}.search-form{display:flex;gap:.8rem;max-width:500px;margin:0 auto}.search-input{flex:1;padding:.9rem 1.2rem;border:1px solid var(--border);border-radius:8px;font-size:1rem;transition:.3s;background:#fff}.batch-actions,.batch-btn{display:flex;align-items:center}.batch-btn,.music-list-item{transition:background .3s;cursor:pointer}.form-control:focus,.search-input:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 3px rgba(124,58,237,.1)}.search-btn{background:var(--primary);font-weight:600}.search-results{padding:1rem 0;color:var(--text-secondary);font-size:.9rem}.batch-actions{padding:1rem 2rem;background:var(--secondary);border-radius:8px;gap:1rem;margin-bottom:1rem}.batch-btn{gap:.5rem;padding:.6rem 1.2rem;background:var(--primary);color:#fff;border:none;border-radius:6px}.music-list-header,.music-list-item{display:grid;grid-template-columns:50px 1fr;padding:1rem}.batch-btn:disabled{background:var(--text-light);cursor:not-allowed}.music-list-header,.music-list-item:hover,.pagination{background:var(--secondary)}.music-list-container{border:1px solid var(--border);border-radius:8px;overflow:hidden}.music-list-header{font-weight:600;color:var(--text-secondary)}.music-list-item{align-items:center;border-bottom:1px solid var(--border);gap:1rem}.music-checkbox,.song-checkbox{width:18px;height:18px;cursor:pointer;accent-color:var(--primary)}.music-info{display:flex;flex-direction:column;gap:.5rem;min-width:0}.music-title{font-weight:600;color:var(--text-primary);font-size:1.1rem;line-height:1.4;word-break:break-word;overflow-wrap:break-word}.empty-state,.music-meta,.playlist-action-btn{color:var(--text-secondary)}.music-meta{font-size:.85rem;display:flex;gap:1rem;flex-wrap:wrap}.music-meta span{display:flex;align-items:center;gap:.3rem}.page-input,.pagination a{color:var(--text-primary)}.pagination{display:flex;justify-content:center;align-items:center;gap:.5rem;border-top:1px solid var(--border);flex-wrap:wrap}.pagination a{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--border);border-radius:6px;font-weight:500;transition:.3s;background:#fff}.pagination a:hover,.pagination-nav a:hover{border-color:var(--primary);color:var(--primary)}.page-input{border:1px solid var(--border)}.music-title-container{width:100%;padding:1rem 0;text-align:center}.music-nav-stats{display:flex;align-items:center;width:100%;gap:2rem;padding:1rem 0;margin-bottom:1.5rem;border-bottom:1px solid var(--border)}.music-stats,.nav-btn{display:flex;align-items:center;font-size:1rem;border-radius:8px}.nav-btn{padding:.8rem 1.5rem;transition:.3s;gap:.5rem;background-color:var(--primary);color:#fff;font-weight:600;min-width:120px;justify-content:center}.music-stats,.player-header h3,.vote-section h3{color:var(--text-primary)}.prev-btn{margin-right:auto}.next-btn{margin-left:auto}.nav-btn:not(.disabled):hover{transform:translateY(-2px)}.music-stats{gap:2rem;flex-wrap:wrap;justify-content:center;background:var(--secondary);padding:1rem 1.5rem;border:1px solid var(--border)}.player-header h3,.stats-item{align-items:center;display:flex;gap:.5rem}.stats-item{font-weight:500}.stats-separator{color:var(--border);font-weight:300}.file-info,.player-loading{color:var(--text-secondary)}.player-section,.vote-section{background:var(--card-bg);border-radius:12px;padding:1.5rem;margin-bottom:2rem;border:1px solid var(--border)}.player-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap;gap:.5rem}.file-info{display:flex;gap:1.5rem;font-size:.9rem}.player-loading{display:none;padding:2rem 0;text-align:center}.loading-spinner{display:inline-block;width:24px;height:24px;border:3px solid var(--border);border-radius:50%;border-top-color:var(--primary);animation:1s ease-in-out infinite spin;margin-right:.8rem;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}.audio-player{width:100%;height:50px;border-radius:8px;margin:1rem 0}.player-controls{display:flex;gap:.8rem;margin-top:1rem;align-items:center;flex-wrap:wrap;justify-content:space-between}.player-controls .btn:not(.nav-btn){flex:1;min-width:100px}.vote-section h3{margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.vote-buttons{display:flex;gap:1rem;margin:1rem 0}.vote-btn{flex:1;padding:1rem;font-size:1rem;border:none;border-radius:8px;cursor:pointer;transition:.3s;display:flex;align-items:center;justify-content:center;gap:.5rem}.playlist-item,.vote-stats{justify-content:space-between}.up-vote{background-color:#f0f9f0;color:#2e7d32}.up-vote:hover{background-color:#e8f5e9}.down-vote{background-color:#fff0f0;color:#c62828}.down-vote:hover{background-color:#ffebee}.vote-count{font-weight:700}.password-input-group,.song-list,.vote-progress{margin-top:1rem}.progress-bar{height:8px;background:#eee;border-radius:4px;overflow:hidden;display:flex;margin-bottom:.5rem}.progress-down,.progress-up{height:100%;transition:width .3s}.progress-up{background:#4caf50}.progress-down{background:#f44336}.vote-stats{display:flex;margin-top:.5rem;font-size:.9rem;color:var(--text-secondary)}.action-buttons{display:flex;gap:1rem;margin:2rem 0;flex-wrap:wrap}.action-buttons .btn{padding:.8rem 1.2rem;flex:1;min-width:120px}.related-music{margin-top:2rem}.related-music h3{margin-bottom:1rem;color:var(--text-primary);display:flex;align-items:center;gap:.5rem}.related-list{max-height:200px;overflow-y:auto;padding:10px;border:1px solid var(--border);border-radius:8px}.related-item{display:block;padding:.8rem;margin-bottom:.5rem;border-radius:4px;color:var(--text-primary);transition:background .3s}.related-item:hover{background-color:var(--hover-bg)}.related-item.current{background:var(--primary-light);border-left:3px solid var(--primary)}.error-state{text-align:center;padding:4rem 2rem}.error-icon{font-size:4rem;color:var(--accent);margin-bottom:1.5rem}.error-title{font-size:2rem;color:var(--text-primary);margin-bottom:1rem}.error-message,.footer-links a,.mobile-player-status{color:var(--text-secondary)}.error-message{margin-bottom:2rem;font-size:1.1rem}.error-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.mobile-player-bar{position:fixed;bottom:0;left:0;right:0;background:rgba(255,255,255,.95);backdrop-filter:blur(20px);border-top:1px solid var(--border);padding:.8rem 1rem;display:flex;align-items:center;gap:1rem;z-index:100;transition:transform .3s;box-shadow:0 -2px 10px rgba(0,0,0,.1)}.footer-links a,.mobile-nav-btn,.pagination-nav a{transition:.3s;text-decoration:none}.playlist-detail,.playlist-list{box-shadow:var(--card-shadow)}.mobile-player-info,.playlist-item-content{flex:1;min-width:0}.mobile-music-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.9rem}.mobile-player-status{font-size:.8rem}.mobile-control-btn{width:40px;height:40px;border-radius:50%;background:var(--primary);color:#fff;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer}.footer,.pagination{border-top:1px solid var(--border)}.mobile-nav-buttons{display:flex;gap:.8rem;margin-bottom:.8rem}.mobile-nav-btn{flex:1;text-align:center;padding:.8rem;border-radius:8px;font-size:.9rem;background-color:var(--primary);color:#fff;font-weight:600}.footer{background:var(--card-bg);margin-top:3rem}.footer-content{padding:2.5rem 0;text-align:center}.footer-logo{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin-bottom:1rem}.footer-links{display:flex;justify-content:center;gap:2rem;margin-bottom:1.5rem;flex-wrap:wrap}.footer-links a:hover,.playlist-item a:hover,.song-play,.user-link:hover{color:var(--primary)}.copyright{color:var(--text-secondary);font-size:.85rem}

/* 修复移动端搜索框样式 */
@media (max-width:768px){
    .navbar,.stats{gap:1rem}
    .action-buttons .btn,.nav-btn{width:100%}
    .file-info,.music-stats,.navbar,.selected-count{text-align:center}
    .action-buttons,.music-nav-stats,.navbar{flex-direction:column}
    .music-list-header,.music-list-item{grid-template-columns:40px 1fr;gap:1rem;align-items:start;padding:1.2rem 1rem}
    .music-info{gap:.6rem}
    .music-title{font-size:1.2rem;font-weight:600;line-height:1.4;word-break:break-word;overflow-wrap:break-word}
    .music-meta{font-size:.9rem;gap:1rem}
    .music-meta span{background:var(--primary-light);padding:.3rem .6rem;border-radius:12px;font-size:.8rem}
    .batch-actions{padding:1rem;flex-wrap:wrap}
    .batch-btn{flex:1;min-width:160px;padding:.9rem 1.2rem;font-size:1rem}
    .selected-count{flex-basis:100%;margin-top:.5rem;font-size:.9rem}
    .detail-container{padding:.5rem}
    .detail-card{padding:1rem}
    .detail-title{font-size:1.5rem}
    .music-nav-stats{gap:1rem;padding:1rem 0;border-bottom:1px solid var(--border)}
    .music-stats{order:1;width:100%;padding:1rem;gap:1rem;flex-direction:column}
    .stats-item{justify-content:center;padding:.5rem;background:#fff;border-radius:6px;border:1px solid var(--border)}
    .stats-separator{display:none}
    .nav-btn{order:2;margin:0!important;padding:1rem}
    .desktop-next-btn,.desktop-prev-btn{display:none!important}
    .file-info{gap:.8rem;font-size:.8rem;flex-wrap:wrap;flex-direction:column}
    .player-controls{flex-wrap:wrap}
    .player-controls .btn:not(.nav-btn){min-width:45%;font-size:.9rem;padding:.7rem 0}
    .vote-btn{padding:.8rem;font-size:.9rem}
    .related-item{padding:.6rem;font-size:.9rem}
    .footer-links{flex-direction:row;flex-wrap:wrap;gap:1rem;justify-content:center}
    .pagination{flex-direction:row;flex-wrap:wrap;gap:5px;padding:1rem .5rem;justify-content:center}
    
    /* 修复移动端搜索框样式 */
    .search-form {
        flex-direction: row;
        gap: 0.5rem;
    }
    
    .search-input-group {
        display: flex;
        gap: 0.5rem;
        width: 100%;
    }
    
    .search-input {
        flex: 1;
        min-width: 0;
        padding: 0.8rem;
        font-size: 16px; /* 防止iOS缩放 */
        width: 100%;
    }
    
    .search-btn {
        width: auto;
        min-width: 80px;
        padding: 0.8rem 1.2rem;
        white-space: nowrap;
    }
}

.playlist-item a,.song-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.page-input,.pagination-nav a{height:36px;font-size:.9rem;color:var(--text-primary)}.pagination{display:flex;flex-direction:column;gap:1rem;padding:1.5rem;background:var(--secondary)}.pagination-row{display:flex;justify-content:center;align-items:center;gap:1rem;flex-wrap:wrap}.pagination-nav{display:flex;align-items:center;gap:.3rem;flex-wrap:wrap;justify-content:center}.pagination-nav a{display:inline-flex;align-items:center;justify-content:center;width:36px;border:1px solid var(--border);border-radius:6px;font-weight:500;background:#fff}.page-input{width:60px;border:1px solid var(--border);border-radius:6px;text-align:center;padding:0 8px}.page-input:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 2px rgba(124,58,237,.1)}.playlist-list h2{border-bottom:1px solid var(--border)}@media (min-width:769px){.mobile-nav-buttons{display:none}.desktop-prev-btn{order:1}#playBtn{order:2}#pauseBtn{order:3}#downloadBtn{order:4}#autoPlayToggle{order:5}.desktop-next-btn{order:6}.music-nav-stats{display:flex;align-items:center;width:100%;gap:2rem;padding:1rem 0;margin-bottom:1.5rem;border-bottom:1px solid var(--border)}.desktop-prev-btn{order:1;margin-right:0!important}.music-stats{order:2;flex:1;display:flex;align-items:center;justify-content:center;gap:2rem;font-size:1rem;color:var(--text-primary);flex-wrap:wrap;background:var(--secondary);padding:1rem 1.5rem;border-radius:8px;border:1px solid var(--border);margin:0 1rem}.nav-btn,.stats-item{display:flex;gap:.5rem;white-space:nowrap}.desktop-next-btn{order:3;margin-left:0!important}.stats-item{align-items:center;font-weight:500}.stats-separator{color:var(--border);font-weight:300}.nav-btn{text-decoration:none;padding:.8rem 1.5rem;border-radius:8px;font-size:1rem;transition:.3s;align-items:center;background-color:var(--primary);color:#fff;font-weight:600;min-width:120px;justify-content:center;flex-shrink:0}.nav-btn:not(.disabled):hover{background-color:var(--primary-dark);transform:translateY(-2px)}}.btn,.username{font-weight:600}.empty-state h3,.user-link,.username{color:var(--text-primary)}.user-actions{display:flex;align-items:center;gap:1.5rem;margin-right:2rem}.user-link{text-decoration:none;display:flex;align-items:center;gap:.3rem;transition:color .3s}.playlist-item{border-bottom:1px solid var(--border-light);display:flex;align-items:center}.playlist-actions,.search-input-group{display:flex;gap:.5rem}.create-form{background:var(--secondary);padding:1.5rem;border-radius:8px;margin-bottom:1.5rem}.empty-icon,.form-group,.play-all-btn{margin-bottom:1rem}.form-control{border:1px solid var(--border)}.song-item{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-light)}.btn,.song-info{align-items:center}.song-info{display:flex}.add-song-form{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border)}.modal-header,.play-controls-header{display:flex;justify-content:between;align-items:center}@media (max-width:768px){.pagination{padding:1rem .5rem;gap:.8rem}.pagination-row{gap:.8rem}.pagination-nav{gap:.2rem}.pagination-nav a{width:32px;height:32px;font-size:.8rem}.page-input{width:50px;height:32px;font-size:.85rem}.music-nav-stats{flex-direction:column;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--border)}.music-stats{order:1;width:100%;padding:1rem;gap:1rem;flex-direction:column;text-align:center}.stats-item{justify-content:center;padding:.5rem;background:#fff;border-radius:6px;border:1px solid var(--border)}.stats-separator,{display:none}.nav-btn{order:2;width:100%;margin:0!important;padding:1rem}.desktop-next-btn,.desktop-prev-btn{display:none!important}.user-actions{gap:1rem;margin-right:0}.playlist-container,.share-options{grid-template-columns:1fr}.playlist-header{flex-direction:column;align-items:flex-start}.playlist-item,.song-result-item{flex-direction:column;align-items:flex-start;gap:.8rem}.add-song-form-inline,.playlist-actions{align-self:flex-end}.edit-form-actions,.play-controls-header,.share-link-group{flex-direction:column}.edit-form-actions .btn{width:100%}.playlist-list{position:static;margin-bottom:1rem}.play-controls-header{align-items:stretch;gap:1rem}.play-controls-actions,.play-mode-selector{justify-content:center}.play-all-btn,.play-selected-btn{flex:1;min-width:140px}.song-item{padding:1rem 0;gap:.8rem}.modal-content{margin:1rem;padding:1.5rem}}@media (max-width:480px){.playlist-container{margin-top:1rem}.play-controls,.playlist-detail,.playlist-list{padding:1rem}.play-mode-selector{flex-wrap:wrap;justify-content:center}.play-mode-btn{flex:1;min-width:100px;text-align:center}.song-info{flex-direction:column;align-items:flex-start;gap:.5rem}.song-title{width:100%}}.empty-state{text-align:center;padding:3rem 2rem;color:var(--text-secondary)}.empty-icon{font-size:4rem;opacity:.3}.empty-state h3{font-size:1.3rem;margin-bottom:.8rem}.alert,.empty-state p{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:600}.form-control{width:100%;padding:.8rem;border:1px solid var(--border);border-radius:6px;font-size:1rem;transition:border-color .3s}.btn{padding:.7rem 1.2rem;border:none;border-radius:6px;text-decoration:none;display:inline-flex;justify-content:center;gap:.5rem;cursor:pointer;transition:.3s;font-size:.9rem;min-width:80px}.btn-primary{background:var(--primary);color:#fff}.btn-secondary,.playlist-item a{color:var(--text-primary)}.btn-primary:hover,.copy-btn:hover,.search-btn:hover{background:var(--primary-dark)}.btn-secondary{background:var(--secondary);border:1px solid var(--border)}.btn-secondary:hover{background:#e9ecef}.btn-sm{min-width:60px}.alert{padding:1rem;border-radius:6px}.alert-success{background-color:#dcfce7;color:#166534;border:1px solid #bbf7d0}.alert-error{background-color:#fee2e2;color:#b91c1c;border:1px solid #fecaca}.playlist-action-btn,.playlist-count,.playlist-item-meta,.song-select-all{color:var(--text-secondary)}.playlist-container{display:grid;grid-template-columns:300px 1fr;gap:2rem;margin-top:2rem}.playlist-list{background:#fff;border-radius:12px;padding:1.5rem;height:fit-content;position:sticky;top:1rem}.playlist-list h2{margin-top:0;padding-bottom:1rem;display:flex;align-items:center;justify-content:space-between}.playlist-count{font-size:.9rem;font-weight:400}.playlist-item{padding:1rem .5rem;border-bottom:1px solid var(--border-light);display:flex;justify-content:space-between;align-items:center;transition:background-color .2s;border-radius:6px;margin:0 -.5rem}.playlist-item:hover,.song-item:hover,.song-result-item:hover{background-color:var(--secondary)}.playlist-item a{text-decoration:none;font-weight:500;display:block}.playlist-item-meta{font-size:.8rem;margin-top:.2rem;display:flex;gap:.8rem}.playlist-privacy-badge{font-size:.7rem;padding:.1rem .4rem;border-radius:10px;background:var(--secondary)}.play-mode-btn,.playlist-action-btn{transition:.3s;font-size:.9rem;cursor:pointer}.playlist-actions{display:flex;gap:.3rem;flex-shrink:0}.playlist-action-btn{background:0 0;border:none;padding:.4rem;border-radius:4px}.edit-playlist-btn:hover,.playlist-action-btn:hover{color:var(--primary);background:var(--secondary)}.playlist-detail{background:#fff;border-radius:12px;padding:1.5rem;min-height:500px}.play-controls{background:var(--secondary);padding:1rem 1.5rem;border-radius:10px;margin-bottom:1.5rem;border:1px solid var(--border)}.play-controls-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;gap:1rem}.play-mode-selector{display:flex;gap:.5rem;align-items:center}.play-mode-btn{padding:.5rem 1rem;border:1px solid var(--border);background:#fff;border-radius:6px}.play-mode-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}.play-controls-actions{display:flex;gap:.8rem;flex-wrap:wrap}.play-all-btn,.play-selected-btn{display:flex;align-items:center;gap:.5rem;padding:.7rem 1.2rem;font-size:.95rem}.song-list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.8rem;border-bottom:2px solid var(--border)}.song-select-all{display:flex;align-items:center;gap:.5rem;font-size:.9rem;cursor:pointer}.song-info,.song-item{gap:1rem;display:flex}.song-item{align-items:center;padding:.8rem 0;border-bottom:1px solid var(--border-light);transition:background-color .2s}.song-info{align-items:center;flex:1;min-width:0}.song-play{color:var(--primary);cursor:pointer;flex-shrink:0}.song-title{flex:1;min-width:0}.song-actions{display:flex;gap:.5rem;flex-shrink:0}.share-section{background:var(--secondary);padding:1.5rem;border-radius:10px;margin:2rem 0;border:1px solid var(--border)}.share-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-top:1rem}.share-option{background:#fff;padding:1.5rem;border-radius:8px;border:1px solid var(--border);text-align:center;cursor:pointer;transition:.3s}.share-option:hover{border-color:var(--primary);transform:translateY(-2px)}.share-icon{font-size:2rem;margin-bottom:.8rem}.share-option-title{font-weight:600;margin-bottom:.5rem}.share-option-desc{font-size:.85rem;color:var(--text-secondary);line-height:1.4}.share-link-container{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border)}.share-link-group{display:flex;gap:.5rem;margin-bottom:1rem}.share-link-input{flex:1;padding:.8rem;border:1px solid var(--border);border-radius:6px;background:#fff;font-size:.9rem}.copy-btn,.search-btn{padding:.8rem 1.2rem;background:var(--primary);color:#fff;border:none;border-radius:6px;cursor:pointer;transition:background-color .3s}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:1000;align-items:center;justify-content:center}.modal-content{background:#fff;border-radius:12px;padding:2rem;max-width:500px;width:90%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 25px -5px rgba(0,0,0,.1)}.edit-playlist-btn,.modal-close{background:0 0;border:none;cursor:pointer}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.modal-title{font-size:1.3rem;font-weight:600;margin:0}.modal-close{font-size:1.5rem;color:var(--text-secondary)}.playlist-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.5rem;gap:1rem}.playlist-info,.search-input,.song-result-info{flex:1}.playlist-title{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.playlist-title-text{font-size:1.5rem;font-weight:600;color:var(--text-primary)}.edit-playlist-btn{color:var(--text-secondary);padding:.3rem;border-radius:4px;transition:.3s}.playlist-meta{color:var(--text-secondary);font-size:.9rem;margin-bottom:.5rem}.playlist-description{color:var(--text-primary);margin-bottom:.5rem;line-height:1.5}.edit-playlist-form{background:var(--secondary);padding:1.5rem;border-radius:8px;margin-bottom:1.5rem;border:1px solid var(--border)}.edit-form-actions{display:flex;gap:.8rem;margin-top:1rem}.song-count-warning{background:#fff3cd;color:#856404;padding:.8rem;border-radius:6px;border:1px solid #ffeaa7;margin-bottom:1rem;font-size:.9rem}.empty-search,.search-hint,.song-count-info{color:var(--text-secondary)}.song-count-info{font-size:.9rem;margin-bottom:1rem;padding:.5rem 0}@media (max-width:768px){.playlist-container{grid-template-columns:1fr;gap:1rem}.playlist-list{position:static;margin-bottom:1rem}.play-controls-header{flex-direction:column;align-items:stretch;gap:1rem}.play-controls-actions,.play-mode-selector{justify-content:center}.play-all-btn,.play-selected-btn{flex:1;min-width:140px}.playlist-item,.share-link-group{flex-direction:column}.song-item{padding:1rem 0;gap:.8rem}.share-options{grid-template-columns:1fr}.modal-content{margin:1rem;padding:1.5rem}.playlist-item{align-items:flex-start;gap:.8rem}.playlist-actions{align-self:flex-end}.playlist-header{flex-direction:column;align-items:flex-start}}@media (max-width:480px){.playlist-container{margin-top:1rem}.play-controls,.playlist-detail,.playlist-list{padding:1rem}.play-mode-selector{flex-wrap:wrap;justify-content:center}.play-mode-btn{flex:1;min-width:100px;text-align:center}.song-info{flex-direction:column;align-items:flex-start;gap:.5rem}.edit-form-actions .btn,.song-title{width:100%}.edit-form-actions{flex-direction:column}}.search-hint{margin-top:.5rem;font-size:.9rem}.recent-songs,.search-results{margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--border-light)}.song-results-list{max-height:400px;overflow-y:auto;border:1px solid var(--border);border-radius:6px}.song-result-item{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;border-bottom:1px solid var(--border-light);transition:background-color .2s}.song-result-item:last-child{border-bottom:none}.song-name{font-weight:500}.add-song-form-inline{margin:0}.btn-sm{padding:.4rem .8rem;font-size:.9rem}.empty-search{text-align:center;padding:2rem}

/* 播放控制栏容器样式 */
.play-controls {
    margin-bottom: 20px;
    padding: 15px;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}

/* 播放控制栏布局 */
.play-controls-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* 统一控制按钮尺寸 */
.btn-control {
    padding: 6px 12px;
    font-size: 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s;
    text-decoration: none;
    display: inline-block;
    text-align: center;
    white-space: nowrap;
}

/* 按钮颜色样式 */
.btn-primary {
    background: var(--primary);
    color: white;
    border-color: var(--primary);
}

.btn-secondary {
    background: #6c757d;
    color: white;
    border-color: #6c757d;
}

.btn-danger {
    background: #dc3545;
    color: white;
    border-color: #dc3545;
}

.btn-primary:hover, .btn-secondary:hover, .btn-danger:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}

/* 随机播放按钮样式 */
.play-mode-btn {
    background: #f8f9fa;
    color: #333;
    border: 1px solid #dee2e6;
    padding: 6px 12px;
    font-size: 12px;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s;
    white-space: nowrap;
}

.play-mode-btn.active {
    background: var(--primary);
    color: white;
    border-color: var(--primary);
}

.play-mode-btn:hover {
    background: #e9ecef;
}

.play-mode-btn.active:hover {
    background: var(--primary-dark);
}

/* 歌曲列表头部样式 */
.song-list-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
}

.song-list-actions {
    display: flex;
    align-items: center;
    gap: 15px;
}

.song-select-all {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    color: var(--text-secondary);
}

.song-select-all input[type="checkbox"] {
    cursor: pointer;
    width: 16px;
    height: 16px;
}

/* 歌曲列表项样式 */
.song-item {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    border-bottom: 1px solid #f0f0f0;
    transition: background-color 0.2s;
    gap: 1rem;
}

.song-item:hover {
    background-color: #f8f9fa;
}

.song-item .song-checkbox {
    margin-right: 10px;
}

.song-info {
    display: flex;
    align-items: center;
    flex: 1;
    gap: 10px;
    min-width: 0;
}

.song-play {
    color: var(--primary);
    cursor: pointer;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background-color 0.2s;
    flex-shrink: 0;
}

.song-play:hover {
    background-color: #e9ecef;
}

.song-title {
    flex: 1;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.song-actions {
    display: flex;
    gap: 5px;
    flex-shrink: 0;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .play-controls-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    
    .play-controls-actions .btn-control {
        flex: 1;
        min-width: 120px;
        text-align: center;
        justify-content: center;
    }
    
    .song-list-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .song-list-actions {
        width: 100%;
        justify-content: space-between;
    }
    
    .song-item {
        padding: 1rem 0;
        gap: .8rem;
        flex-direction: column;
        align-items: flex-start;
    }
    
    .song-info {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .play-controls, .playlist-detail, .playlist-list {
        padding: 1rem;
    }
    
    .play-controls-actions {
        gap: 8px;
    }
    
    .play-controls-actions .btn-control {
        min-width: 100px;
        font-size: 11px;
        padding: 8px 10px;
    }
    
    .song-info {
        flex-direction: column;
        align-items: flex-start;
        gap: .5rem;
    }
    
    .song-title {
        width: 100%;
    }
}

/* 以下是您提供的原有样式保持不变 */
/* 新增样式 - 分享权限状态指示 */
.current-privacy-status {
    background: var(--primary-light);
    padding: 1rem;
    border-radius: 8px;
    margin-bottom: 1.5rem;
    border-left: 4px solid var(--primary);
}

.share-option.active {
    border: 2px solid var(--primary);
    background: var(--primary-light);
}

.share-option .current-selection {
    color: var(--primary);
    font-size: 0.8rem;
    margin-top: 0.5rem;
    font-weight: 600;
}

/* 搜索结果锚点样式 */
.search-results-anchor {
    scroll-margin-top: 20px;
}

/* 加入歌单模态框样式 */
.playlist-option {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-bottom: 0.8rem;
    transition: all 0.3s;
    cursor: pointer;
}

.playlist-option:hover {
    border-color: var(--primary);
    background: var(--primary-light);
}

.playlist-option.selected {
    border-color: var(--primary);
    background: var(--primary-light);
}

.playlist-option-info {
    flex: 1;
}

.playlist-option-name {
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 0.3rem;
}

.playlist-option-meta {
    display: flex;
    gap: 1rem;
    font-size: 0.85rem;
    color: var(--text-secondary);
}

.playlist-option-action {
    flex-shrink: 0;
}

.add-to-playlist-btn {
    padding: 0.4rem 0.8rem;
    font-size: 0.8rem;
}

.playlist-option .playlist-privacy-badge {
    font-size: 0.7rem;
    padding: 0.1rem 0.4rem;
    border-radius: 10px;
    background: var(--secondary);
}

.modal-actions {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
}

.modal-actions .btn {
    flex: 1;
}

/* 批量操作按钮样式 */
.batch-actions {
    display: flex;
    align-items: center;
    padding: 1rem 2rem;
    background: var(--secondary);
    border-radius: 8px;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.batch-btn {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.2rem;
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background .3s;
    font-weight: 600;
}

.batch-btn:disabled {
    background: var(--text-light);
    cursor: not-allowed;
}

.batch-btn:not(:disabled):hover {
    background: var(--primary-dark);
}

.selected-count {
    color: var(--text-secondary);
    font-size: .9rem;
    margin-left: auto;
}

/* 响应式调整 */
@media (max-width: 768px) {
    .batch-actions {
        padding: 1rem;
        flex-wrap: wrap;
    }
    
    .batch-btn {
        flex: 1;
        min-width: 160px;
        padding: .9rem 1.2rem;
        font-size: 1rem;
        justify-content: center;
    }
    
    .selected-count {
        flex-basis: 100%;
        margin-top: .5rem;
        font-size: .9rem;
        text-align: center;
    }
    
    /* 保持原有的播放控制栏响应式样式 */
    .play-controls-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    
    .play-controls-actions .btn-control {
        flex: 1;
        min-width: 120px;
        text-align: center;
        justify-content: center;
    }
}
/* 搜索相关样式 */
.search-loading {
    margin-top: 0.5rem;
    color: var(--primary);
    font-size: 0.9rem;
}

.song-results-list {
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    padding: 0.5rem;
    background: var(--bg-secondary);
}

.song-result-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem;
    border-bottom: 1px solid var(--border-color);
    transition: background-color 0.2s;
}

.song-result-item:hover {
    background-color: var(--hover-color);
}

.song-result-item:last-child {
    border-bottom: none;
}

.song-result-info {
    flex: 1;
    margin-right: 1rem;
}

.song-name {
    font-weight: 500;
    color: var(--text-color);
}

.add-song-form-inline {
    margin: 0;
}

.empty-search {
    text-align: center;
    padding: 2rem;
    color: var(--text-muted);
}

.search-results, .recent-songs {
    margin-top: 1rem;
}

.search-results h4, .recent-songs h4 {
    margin-bottom: 0.75rem;
    color: var(--text-color);
    font-size: 1.1rem;
}
/* 浮动侧边栏样式 */
.floating-sidebar {
    position: fixed;
    right: 20px;
    bottom: 30px;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.floating-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: var(--card-bg);
    border-radius: 24px;
    padding: 16px 12px;
    box-shadow: var(--card-shadow);
    border: 1px solid var(--border);
}

.floating-btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 18px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.floating-btn:not(:disabled):hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

.floating-btn:active:not(:disabled) {
    transform: translateY(0);
}

.floating-btn:disabled {
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
    opacity: 0.6;
}

.selected-indicator {
    background: var(--primary);
    color: white;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
}

.selected-indicator.hidden {
    opacity: 0;
    transform: scale(0);
}

/* 响应式调整 */
@media (max-width: 768px) {
    .floating-sidebar {
        right: 15px;
        bottom: 20px;
    }
    
    .floating-btn {
        width: 44px;
        height: 44px;
        font-size: 16px;
    }
    
    .selected-indicator {
        width: 32px;
        height: 32px;
        font-size: 12px;
    }
}
/* -------------- 电脑端优化：精准压缩间距 -------------- */
/* 1. 整体歌曲项容器：减小内部元素间距 */
.song-item {
    gap: 0.5rem !important; /* 强制缩小整体间距（优先级更高） */
    align-items: center !important; /* 确保元素垂直居中对齐 */
}

/* 2. 复选框：直接减小与播放按钮的间距 */
.song-checkbox-wrap {
    margin-right: 0.2rem !important; /* 复选框右侧间距缩减 */
    padding: 0 !important; /* 清除多余内边距 */
}

/* 3. 播放按钮：减小与标题的间距 */
.song-play {
    margin-right: 0.3rem !important; /* 播放按钮右侧间距缩减 */
    width: 20px !important; /* 固定播放按钮宽度，避免占用多余空间 */
    height: 20px !important;
}

/* 4. 查看次数和日期：恢复默认色，仅微调字号（不改变颜色） */
.song-meta {
    font-size: 0.8rem !important; /* 仅缩小字号，保持默认文本色 */
    gap: 0.8rem !important; /* 减小两个信息项之间的间距 */
}


/* -------------- 手机端修复：彻底解决布局问题 -------------- */
/* 手机端最终布局优化 - 精简版 */
@media (max-width: 768px) {
    /* 1. 歌曲项容器：强制向排列，居中对齐 */
    .music-list-container .song-item {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        padding: 0.7rem 0 !important;
        gap: 4px !important; /* 整体紧凑间距 */
    }

    /* 2. 复选框：固定大小，对齐 */
    .song-item .song-checkbox-wrap input {
        width: 16px !important;
        height: 16px !important;
        margin: 0 !important;
        padding: 0 !important;
        vertical-align: middle !important;
        padding-left: 4px !important; /* 关键：左侧留出4px间距 */
    }

    /* 3. 播放按钮：固定大小，对齐，贴近标题 */
    .song-item .song-play {
        width: 16px !important;
        height: 16px !important;
        margin: 0 2px 0 0 !important; /* 仅右侧留2px间距 */
        padding: 0 !important;
        vertical-align: middle !important;
        color: var(--primary) !important;
    }

    /* 4. 标题区域：占满剩余空间，单行省略 */
    .song-item .song-info {
        flex: 1 1 auto !important; /* 占满剩余宽度 */
        min-width: 0 !important;
        display: block !important;
    }

    .song-item .song-title {
        width: 100% !important; /* 标题占满区域 */
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        font-size: 0.9rem !important;
        margin: 0 !important;
    }

    /* 5. 隐藏查看次数和日期 */
    .song-item .song-meta {
        display: none !important;
    }
}
/*播放页面
/* ======================================
/* ======================================
   播放页面核心样式（基础样式+修复+优化）
====================================== */

/* 1. 缓冲提醒样式 */
.buffering-indicator {
    display: none;
    background: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 12px 20px;
    border-radius: 8px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10000;
    font-size: 14px;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}

.buffering-indicator .spinner {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top-color: #fff;
    animation: spin 1s ease-in-out infinite;
    margin-right: 10px;
}


/* 2. 模态框样式（复用+补充） */
.modal-content {
    background-color: var(--card-bg);
    margin: 15% auto;
    padding: 0;
    border-radius: 8px;
    width: 90%;
    max-width: 500px;
    box-shadow: var(--card-shadow);
    overflow: hidden;
}

.modal-header {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--border);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-title {
    margin: 0;
    font-size: 1.2rem;
    color: var(--text-primary);
}

.modal-close {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: var(--text-secondary);
}

.modal-body {
    padding: 1.5rem;
}

.modal-actions {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
}


/* 3. 歌单选项样式（复用+优化） */
.playlist-option {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem;
    border: 1px solid var(--border);
    border-radius: 6px;
    margin-bottom: 0.5rem;
    cursor: pointer;
    transition: all 0.2s;
}

.playlist-option:hover {
    background-color: var(--secondary);
    border-color: var(--primary);
}

.playlist-option.selected {
    background-color: var(--primary-light);
    border-color: var(--primary);
}

.playlist-option-info {
    flex: 1;
}

.playlist-option-name {
    font-weight: 500;
    color: var(--text-primary);
}

.playlist-option-meta {
    font-size: 0.8rem;
    color: var(--text-secondary);
    margin-top: 0.25rem;
}

.add-to-playlist-btn {
    padding: 0.4rem 0.8rem;
    font-size: 0.8rem;
}


/* 4. 播放器加载状态（复用+补充） */
.player-loading {
    display: none;
    text-align: center;
    padding: 1rem;
    color: var(--text-secondary);
}

.player-loading.show {
    display: block;
}

.loading-spinner {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 2px solid var(--border);
    border-radius: 50%;
    border-top-color: var(--primary);
    animation: spin 1s ease-in-out infinite;
    margin-right: 10px;
}


/* 5. 喜欢/不喜欢按钮（修复变形+图标优化） */
.vote-buttons {
    display: flex !important;
    gap: 1rem !important;
    justify-content: center !important;
}

.vote-btn {
    width: auto !important;
    min-width: 100px !important;
    padding: 0.6rem 1rem !important;
    border: 2px solid var(--border);
    border-radius: 8px;
    background: white;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    font-weight: 500;
    font-size: 0.85rem !important;
}

/* 图标替代文字（需引入FontAwesome） */
.like-btn::before {
    content: "\f004"; /* 心形图标 */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
}

.dislike-btn::before {
    content: "\f057"; /* 叉号图标 */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
}

.like-btn {
    color: var(--text-primary);
}

.like-btn:hover, .like-btn.active {
    background: #ff4757;
    color: white;
    border-color: #ff4757;
}

.dislike-btn {
    color: var(--text-primary);
}

.dislike-btn:hover, .dislike-btn.active {
    background: #747d8c;
    color: white;
    border-color: #747d8c;
}

.vote-count {
    background: rgba(0,0,0,0.1);
    padding: 0.2rem 0.5rem;
    border-radius: 12px;
    font-size: 0.8rem;
    min-width: 24px;
    text-align: center;
}

.like-btn.active .vote-count,
.dislike-btn.active .vote-count {
    background: rgba(255,255,255,0.3);
}


/* 6. 进度条样式 */
.progress-like {
    background: #ff4757;
    height: 8px;
    border-radius: 4px 0 0 4px;
    transition: width 0.3s ease;
}

.progress-dislike {
    background: #747d8c;
    height: 8px;
    border-radius: 0 4px 4px 0;
    transition: width 0.3s ease;
}


/* 7. 移动端底部播放栏 */
.mobile-player-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(255,255,255,.95);
    backdrop-filter: blur(20px);
    border-top: 1px solid var(--border);
    padding: 0.8rem 1rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    z-index: 100;
    transition: transform 0.3s;
    box-shadow: 0 -2px 10px rgba(0,0,0,.1);
}

.mobile-player-info {
    flex: 1;
    min-width: 0;
}

.mobile-music-title {
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.9rem;
}

.mobile-player-status {
    font-size: 0.8rem;
    color: var(--text-secondary);
}

.mobile-control-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}


/* 8. 播放页面样式优化（字体/间距调整） */
/* 标题优化 */
.detail-title {
    font-size: 1.4rem !important;
    margin: 0.8rem 0 !important;
    line-height: 1.3 !important;
}

/* 按钮优化 */
.btn {
    padding: 0.4rem 0.8rem !important;
    font-size: 0.85rem !important;
}

.btn-sm {
    padding: 0.25rem 0.5rem !important;
    font-size: 0.75rem !important;
}

/* 区块标题优化 */
.player-header h3,
.vote-section h3,
.related-music h3 {
    font-size: 1.1rem !important;
    margin: 0.7rem 0 !important;
}

/* 播放控制按钮间距 */
.player-controls {
    gap: 0.6rem !important;
    margin: 0.8rem 0 !important;
}

/* 导航按钮优化 */
.nav-btn {
    padding: 0.3rem 0.6rem !important;
    font-size: 0.8rem !important;
}

/* 操作按钮间距 */
.action-buttons {
    gap: 0.6rem !important;
    margin: 1rem 0 !important;
}

/* 相关音乐项优化 */
.related-item {
    padding: 0.5rem 0.7rem !important;
    font-size: 0.85rem !important;
}


/* 9. 排版修复（播放次数/文件信息等单行显示） */
/* 播放/下载次数：强制单行 */
.music-stats {
    display: flex !important;
    flex-direction: row !important;
    gap: 1rem !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    font-size: 0.8rem !important;
}

.music-stats .stats-item {
    display: flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
    background: none !important; /* 清除多余背景 */
    padding: 0 !important; /* 清除多余内边距 */
    border: none !important; /* 清除多余边框 */
}

/* 文件大小/上传时间：强制单行+图标替代文字 */
.file-info {
    display: flex !important;
    flex-direction: row !important;
    gap: 1.5rem !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    font-size: 0.8rem !important;
}

.file-info span {
    display: flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
}

/* 图标替代文字（需引入FontAwesome） */
.file-info span:first-child::before {
    content: "\f07b"; /* 文件图标 */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-right: 0.3rem;
}

.file-info span:last-child::before {
    content: "\f073"; /* 日历图标 */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-right: 0.3rem;
}


/* 10. 响应式优化 */
@media (max-width: 768px) {
    /* 播放器控制按钮 */
    .player-controls .btn:not(.nav-btn) {
        min-width: 45%;
        font-size: 0.9rem !important;
        padding: 0.7rem 0 !important;
    }

    /* 投票按钮 */
    .vote-btn {
        padding: 0.8rem !important;
        font-size: 0.9rem !important;
        flex: 1 !important;
        min-width: 0 !important;
    }

    /* 模态框标题 */
    .modal-title {
        font-size: 1.1rem !important;
    }

    /* 歌单项 */
    .playlist-option {
        padding: 0.6rem !important;
    }

    .playlist-option-name {
        font-size: 0.9rem !important;
    }

    .playlist-option-meta {
        font-size: 0.75rem !important;
    }

    /* 播放/下载次数（手机端） */
    .music-stats {
        flex-direction: row !important;
        justify-content: flex-start !important;
        gap: 0.8rem !important;
    }

    /* 文件信息（手机端） */
    .file-info {
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 1rem !important;
        font-size: 0.8rem !important;
    }
}
/* ======================================
   歌单页面专属样式
====================================== */
/* 歌曲项基础布局 */
.song-item {
    display: flex !important;
    align-items: center !important;
    padding: 0.8rem 0.5rem !important;
    gap: 0.8rem !important;
    border-bottom: 1px solid var(--border-light) !important;
}

/* 复选框样式 */
.song-checkbox {
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
    margin: 0 !important; /* 清除默认边距 */
}

/* 歌曲编号与标题 */
.song-title {
    flex: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: 0.95rem !important;
    text-align: left !important; /* 强制左对齐 */
    margin: 0 !important;
}

/* 播放按钮 */
.song-play {
    width: 24px !important;
    height: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
    color: var(--text-secondary) !important;
}

.song-play:hover {
    color: var(--primary) !important;
}

/* 歌曲操作区 */
.song-actions {
    flex-shrink: 0 !important;
    display: flex !important;
    gap: 0.5rem !important;
}

/* 搜索结果锚点样式（用于滚动定位） */
.search-results-anchor {
    position: relative !important;
    top: -80px !important; /* 补偿固定头部高度 */
    visibility: hidden !important;
}

/* 搜索结果区域 */
.search-results {
    margin-top: 1rem !important;
    padding-top: 1rem !important;
    border-top: 1px dashed var(--border) !important;
}

/* 全选控件 */
.song-select-all {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    cursor: pointer !important;
}

/* 歌曲列表头部 */
.song-list-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 1rem 0.5rem !important;
    flex-wrap: wrap !important;
    gap: 0.8rem !important;
}

.song-list-actions {
    display: flex !important;
    gap: 1rem !important;
    align-items: center !important;
}

/* 响应式优化 */
@media (max-width: 768px) {
    .song-item {
        padding: 0.6rem 0.3rem !important;
        gap: 0.5rem !important;
    }
    
    .song-title {
        font-size: 0.85rem !important;
    }
    
    .song-list-header {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
    
    .song-list-actions {
        width: 100% !important;
        justify-content: space-between !important;
    }
}
/* ======================================
/* ======================================
   1. 音乐广场/全部歌单/全部歌曲 通用基础样式
====================================== */
/* 页面容器：统一内边距与间距 */
.plaza-container {
    padding: 1.5rem 0;
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

/* 板块通用样式：控制板块间距与内边距 */
.plaza-section {
    background: var(--card-bg);
    border-radius: 12px;
    padding: 1.8rem;
    box-shadow: var(--card-shadow);
    border: 1px solid var(--border);
}

/* 板块头部：标题+按钮布局 */
.section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 1rem;
}

/* 板块标题：统一字体与颜色 */
.section-title {
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

/* 算法标签：区分不同推荐类型 */
.algorithm-badge {
    font-size: 0.7rem;
    padding: 0.2rem 0.6rem;
    border-radius: 12px;
    margin-left: 0.8rem;
    font-weight: 500;
}
.hot-badge { background: #ffebee; color: #c62828; }
.personalized-badge { background: #f3e5f5; color: #8e24aa; }
.trending-badge { background: #fff3e0; color: #e65100; }
.discovery-badge { background: #e0f7fa; color: #00838f; }

/* 板块副标题：统一说明文字样式 */
.section-subtitle {
    font-size: 0.9rem;
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: 1.5rem;
}


/* ======================================
   2. 歌单相关样式（广场+全部歌单）
====================================== */
/* 歌单网格：桌面端多列，移动端1列 */
.playlist-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.5rem;
}

/* 歌单卡片：统一卡片样式 */
.playlist-card {
    background: var(--secondary);
    border-radius: 10px;
    padding: 1.2rem;
    border: 1px solid var(--border);
    transition: transform 0.3s, box-shadow 0.3s;
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.playlist-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--card-shadow);
    border-color: var(--primary-light);
}

/* 歌单卡片头部：标题+统计 */
.playlist-card-header {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

/* 歌单名称：控制换行与颜色 */
.playlist-name {
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.4;
}

.playlist-name .song-link {
    color: var(--text-primary);
    text-decoration: none;
    transition: color 0.3s;
}

.playlist-name .song-link:hover {
    color: var(--primary);
}

/* 歌单统计：播放次数+歌曲数量 */
.playlist-stats {
    display: flex;
    gap: 1.2rem;
    font-size: 0.8rem;
    color: var(--text-secondary);
}

.playlist-stats span {
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

/* 歌单创建者：统一样式 */
.playlist-owner {
    font-size: 0.85rem;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.3rem;
}

/* 歌单描述：控制高度与换行 */
.playlist-description {
    font-size: 0.85rem;
    color: var(--text-secondary);
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 0.5rem;
}


/* ======================================
   3. 歌曲列表相关样式（广场+全部歌曲）
====================================== */
/* 歌曲排名容器：统一列表样式 */
.song-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* 单首歌曲排名项：布局与 hover 效果 */
.song-rank {
    display: flex;
    align-items: center;
    padding: 1rem 1.2rem;
    border-radius: 8px;
    transition: background 0.3s;
    gap: 1.2rem;
}

.song-rank:hover {
    background: var(--secondary);
}

/* 排名数字：突出显示前3名 */
.rank-number {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--secondary);
    color: var(--text-primary);
    font-weight: 600;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.song-rank:nth-child(1) .rank-number,
.song-rank:nth-child(2) .rank-number,
.song-rank:nth-child(3) .rank-number {
    background: var(--primary);
    color: #fff;
}

/* 歌曲信息容器：占满剩余宽度 */
.song-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

/* 歌曲标题：统一链接样式 */
.song-title .song-link {
    color: var(--text-primary);
    text-decoration: none;
    transition: color 0.3s;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.4;
}

.song-title .song-link:hover {
    color: var(--primary);
}

/* 趋势标签：突出趋势歌曲 */
.trend-badge {
    display: inline-block;
    font-size: 0.7rem;
    padding: 0.15rem 0.5rem;
    border-radius: 10px;
    background: #fff3e0;
    color: #e65100;
    margin-left: 0.6rem;
    font-weight: 500;
}

/* 歌曲统计项：播放/点赞/下载 */
.song-stats {
    display: flex;
    gap: 1.5rem;
    font-size: 0.8rem;
    color: var(--text-secondary);
    flex-wrap: wrap;
}

.song-stats span {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

/* 匹配度/热度分：统一样式 */
.match-score {
    color: var(--primary) !important;
    font-weight: 500;
}


/* ======================================
   4. 筛选栏样式（全部歌单+全部歌曲）
====================================== */
/* 筛选栏容器：控制按钮布局 */
.section-filters {
    display: flex;
    gap: 0.8rem;
    padding: 0.5rem;
    background: var(--card-bg);
    border-radius: 8px;
    box-shadow: var(--card-shadow);
    border: 1px solid var(--border);
    flex-wrap: wrap;
}

/* 筛选按钮：默认状态 */
.filter-btn {
    padding: 0.7rem 1.2rem;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-secondary);
    background: var(--secondary);
    transition: all 0.3s;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

/* 筛选按钮：激活状态 */
.filter-btn.active {
    background: var(--primary);
    color: #fff;
}

/* 返回按钮：特殊样式区分 */
.filter-btn.back-btn {
    background: #f8f9fa;
    color: var(--text-primary);
    margin-left: auto;
}

.filter-btn:hover:not(.active):not(.back-btn) {
    background: #e9ecef;
    color: var(--text-primary);
}

.filter-btn.back-btn:hover {
    background: #e2e6ea;
}


/* ======================================
   5. 响应式调整（移动端适配）
====================================== */
@media (max-width: 768px) {
    /* 容器与板块：减小间距与内边距 */
    .plaza-container {
        gap: 1.5rem;
        padding: 1rem 0;
    }

    .plaza-section {
        padding: 1.2rem;
    }

    /* 板块标题：缩小字体 */
    .section-title {
        font-size: 1.2rem;
    }

    /* 歌单网格：改为1列 */
    .playlist-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    /* 歌曲排名项：减小内边距与间距 */
    .song-rank {
        padding: 0.8rem;
        gap: 0.8rem;
    }

    /* 歌曲统计：减小间距，避免换行过多 */
    .song-stats {
        gap: 1rem;
        font-size: 0.75rem;
    }

    /* 筛选栏：按钮允许换行，返回按钮不右对齐 */
    .section-filters {
        gap: 0.6rem;
        padding: 0.5rem 0.8rem;
    }

    .filter-btn {
        padding: 0.6rem 0.9rem;
        font-size: 0.85rem;
    }

    .filter-btn.back-btn {
        margin-left: 0;
        width: 100%;
        justify-content: center;
        margin-top: 0.3rem;
    }

    /* 算法标签：缩小尺寸 */
    .algorithm-badge {
        font-size: 0.65rem;
        padding: 0.15rem 0.4rem;
        margin-left: 0.5rem;
    }
}

@media (max-width: 480px) {
    /* 歌曲标题：缩小字体 */
    .song-title .song-link {
        font-size: 0.9rem;
    }

    /* 筛选按钮：全屏宽度，横向排列 */
    .section-filters {
        flex-direction: row;
        overflow-x: auto;
        padding: 0.5rem;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

    .section-filters::-webkit-scrollbar {
        display: none;
    }

    .filter-btn {
        flex-shrink: 0;
    }

    /* 歌单描述：显示1行 */
    .playlist-description {
        -webkit-line-clamp: 1;
    }
}
/* ======================================
   核心：标题左对齐，统计项靠右对齐
====================================== */
/* 标题+统计项容器：两端对齐（标题左，统计项右） */
.song-info {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important; /* 关键：两端对齐 */
    flex: 1 !important;
    min-width: 0 !important;
    padding: 0 5px !important; /* 轻微内边距避免贴边 */
}

/* 歌曲标题：保持左对齐，占比调整为45%（避免过短） */
.song-title {
    flex: 0 1 45% !important; /* 标题占比提高到45% */
    min-width: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* 统计项容器：靠右对齐，占比55% */
.song-stats {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important; /* 关键：统计项自身靠右 */
    flex: 0 1 55% !important; /* 统计项占比55% */
    gap: 15px !important; /* 统计项之间保留间距 */
    white-space: nowrap !important;
}

/* 手机端保持原有适配，仅调整间距 */
@media (max-width: 768px) {
    .song-stats {
        gap: 10px !important;
    }
}

@media (max-width: 450px) {
    .song-info {
        justify-content: flex-start !important; /* 手机端纵向排列时左对齐 */
    }
}
/* 平板及以下（768px以下）：标题单独一行，统计项在下一行 */
@media (max-width: 768px) {
    /* 歌曲信息容器：纵向排列（标题在上，统计项在下） */
    .song-info {
        flex-direction: column !important;
        align-items: flex-start !important; /* 左对齐 */
        gap: 4px !important; /* 标题与统计项的纵向间距 */
    }

    /* 标题占满宽度 */
    .song-title {
        flex: 1 !important;
        width: 100% !important;
        font-size: 15px !important; /* 标题放大更醒目 */
    }

    /* 统计项容器：横向排列，靠右对齐 */
    .song-stats {
        flex: 1 !important;
        width: 100% !important;
        justify-content: flex-end !important; /* 统计项整体靠右 */
        gap: 12px !important;
        font-size: 13px !important;
    }

    /* 歌曲排名项：调整内边距，避免拥挤 */
    .song-rank {
        padding: 12px 10px !important;
        gap: 8px !important;
    }
}
/* 搜索框聚焦样式（可选，增强体验） */
.search-input:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.2); /* 高亮边框，提示聚焦状态 */
    outline: none;
}

/* 强制覆盖：手机端批量按钮一行显示 */
@media (max-width:768px) {
    .batch-actions {
        padding: 0.8rem !important;
        gap: 0.5rem !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -ms-overflow-style: none !important;
        scrollbar-width: none !important;
        display: flex !important; /* 强制flex布局 */
    }
    
    .batch-actions::-webkit-scrollbar {
        display: none !important;
    }
    
    .batch-btn {
        flex: 1 !important;
        min-width: 80px !important; /* 再缩小宽度 */
        padding: 0.5rem 0.6rem !important;
        font-size: 0.8rem !important;
        justify-content: center !important;
        white-space: nowrap !important;
    }
    
    .selected-count {
        flex-basis: 100% !important;
        margin-top: 0.5rem !important;
    }
}