.upload-page{background:var(--bg-color);max-width:800px;min-height:100vh;margin:0 auto;padding:80px 20px}.upload-card{background:var(--card-bg-color);border:1px solid var(--border-color);border-radius:16px;padding:32px;box-shadow:0 4px 20px #00000014}.upload-header{align-items:center;gap:16px;margin-bottom:32px;display:flex}.upload-icon{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:56px;height:56px;font-size:28px;display:flex}.upload-header h2{color:var(--text-color);margin:0;font-size:1.8rem;font-weight:700}.upload-subtitle{color:var(--text-secondary);margin:-8px 0 0 72px;font-size:.95rem}.file-upload-area{border:2px dashed var(--border-color);text-align:center;background:var(--bg);cursor:pointer;border-radius:12px;margin-bottom:24px;padding:48px 24px;transition:all .3s;position:relative}.file-upload-area:hover{background:var(--bg-secondary);border-color:#667eea;transform:translateY(-2px)}.file-upload-area.drag-over{background:linear-gradient(135deg,#667eea0d 0%,#764ba20d 100%);border-style:solid;border-color:#667eea}.upload-icon-large{opacity:.6;margin-bottom:16px;font-size:48px}.file-upload-area input[type=file]{display:none}.upload-text-primary{color:var(--text-color);margin-bottom:8px;font-size:1.1rem;font-weight:600}.upload-text-secondary{color:var(--text-secondary);font-size:.9rem}.upload-text-hint{color:var(--text-secondary);opacity:.7;margin-top:8px;font-size:.85rem}.preview-container{background:var(--bg);border:1px solid var(--border-color);border-radius:12px;margin-top:20px;overflow:hidden}.preview-container img,.preview-container video{object-fit:contain;width:100%;max-height:400px;display:block}.preview-header{background:var(--card-bg-color);border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.preview-filename{color:var(--text-color);font-size:.9rem;font-weight:500}.remove-preview-btn{color:#ef4444;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:.9rem;transition:background .2s}.remove-preview-btn:hover{background:#ef44441a}.upload-form{flex-direction:column;gap:24px;display:flex}.form-section{background:var(--bg);border:1px solid var(--border-color);border-radius:12px;padding:24px}.section-title{color:var(--text-color);align-items:center;gap:8px;margin:0 0 16px;font-size:1rem;font-weight:600;display:flex}.form-grid{grid-template-columns:1fr;gap:20px;display:grid}.form-grid-2{grid-template-columns:1fr 1fr}.form-group{flex-direction:column;gap:8px;display:flex}.form-group label{color:var(--text-color);font-size:.9rem;font-weight:500}.form-group input,.form-group textarea,.form-group select{border:1px solid var(--border-color);background:var(--input-bg);color:var(--text-color);border-radius:8px;padding:12px 16px;font-family:inherit;font-size:.95rem;transition:all .2s}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea1a}.form-group textarea{resize:vertical;min-height:100px}.input-hint{color:var(--text-secondary);margin-top:-4px;font-size:.85rem}.submit-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:12px;width:100%;margin-top:8px;padding:16px 24px;font-size:1rem;font-weight:600;transition:transform .2s,box-shadow .3s}.submit-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 24px #667eea66}.submit-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.submit-button:active:not(:disabled){transform:translateY(0)}.success-message{color:#059669;background:linear-gradient(135deg,#10b9811a 0%,#0596691a 100%);border:1px solid #10b981;border-radius:12px;align-items:center;gap:12px;padding:16px 20px;font-weight:500;animation:.3s ease-out slideIn;display:flex}.error-message{color:#dc2626;background:#ef44441a;border:1px solid #ef4444;border-radius:12px;align-items:center;gap:12px;padding:16px 20px;font-weight:500;animation:.3s ease-out slideIn;display:flex}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.upload-page{padding:70px 16px}.upload-card{padding:24px}.upload-header h2{font-size:1.5rem}.upload-icon{width:48px;height:48px;font-size:24px}.upload-subtitle{margin-left:64px;font-size:.9rem}.form-grid-2{grid-template-columns:1fr}.file-upload-area{padding:32px 16px}.upload-text-primary{font-size:1rem}.upload-text-secondary{font-size:.85rem}.upload-text-hint{display:none}}@media (max-width:480px){.upload-page{padding:60px 12px}.upload-card{border-radius:12px;padding:20px}.upload-header{gap:12px}.upload-header h2{font-size:1.3rem}.form-section{padding:16px}.submit-button{padding:14px 20px}}body.dark-mode .file-upload-area{background:#1a1a1a}body.dark-mode .file-upload-area:hover{background:#242424}body.dark-mode .preview-container,body.dark-mode .form-section{background:#1a1a1a}.music-selector{margin-top:20px}.music-selector-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.music-selector-header h3{color:var(--text-color);margin:0;font-size:1.1rem}.remove-music-btn{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:6px;padding:6px 12px;font-size:.85rem;transition:all .2s}.remove-music-btn:hover{background:#dc2626;transform:scale(1.05)}.selected-music-card{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:12px;justify-content:space-between;align-items:center;padding:16px;display:flex}.selected-music-info{align-items:center;gap:12px;display:flex}.music-icon{font-size:2rem}.selected-music-name{font-size:1rem;font-weight:600}.selected-music-artist{opacity:.9;font-size:.85rem}.preview-btn-small{color:#fff;cursor:pointer;background:#fff3;border:1px solid #ffffff4d;border-radius:8px;padding:8px 16px;font-size:1rem;transition:all .2s}.preview-btn-small:hover{background:#ffffff4d}.music-search-form{gap:8px;margin-bottom:16px;display:flex}.music-search-input{border:1px solid var(--border-color);background:var(--input-bg);color:var(--text-color);border-radius:8px;flex:1;padding:12px 16px;font-size:.95rem}.music-search-btn{background:var(--primary-color);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:12px 20px;font-size:1.2rem;transition:all .2s}.music-search-btn:hover{transform:scale(1.05)}.mood-filters{flex-wrap:wrap;gap:8px;margin-bottom:20px;display:flex}.mood-btn{background:var(--card-bg-color);border:1px solid var(--border-color);cursor:pointer;color:var(--text-color);border-radius:20px;padding:8px 16px;font-size:.9rem;transition:all .2s}.mood-btn:hover{border-color:var(--primary-color);transform:translateY(-2px)}.mood-btn.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.music-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;max-height:400px;padding:4px;display:grid;overflow-y:auto}.music-card{background:var(--card-bg-color);border:1px solid var(--border-color);border-radius:12px;padding:16px;transition:all .2s}.music-card:hover{border-color:var(--primary-color);transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.music-card-header{margin-bottom:12px}.music-info{flex:1}.music-name{color:var(--text-color);text-overflow:ellipsis;white-space:nowrap;margin-bottom:4px;font-size:.95rem;font-weight:600;overflow:hidden}.music-artist{color:var(--text-secondary);margin-bottom:4px;font-size:.85rem}.music-duration{color:var(--text-secondary);font-size:.8rem}.music-card-actions{gap:8px;display:flex}.preview-btn,.select-music-btn{cursor:pointer;border:none;border-radius:6px;flex:1;padding:8px 12px;font-size:.85rem;transition:all .2s}.preview-btn{background:var(--card-bg-color);border:1px solid var(--border-color);color:var(--text-color)}.preview-btn:hover{background:var(--bg-secondary)}.select-music-btn{background:var(--primary-color);color:#fff}.select-music-btn:hover{transform:scale(1.05)}.music-loading,.music-error,.no-music{text-align:center;color:var(--text-secondary);padding:32px;font-size:.95rem}.music-error{color:#ef4444}body.dark-mode .music-search-input,body.dark-mode .mood-btn,body.dark-mode .music-card{background:#2a2a2a;border-color:#404040}body.dark-mode .preview-btn{background:#1a1a1a;border-color:#404040}