.mix-builder-section{background:transparent}.mix-builder-container{max-width:1200px;margin:0 auto;padding:18px 18px 56px}.mix-header h2{color:var(--ds-gold);font-weight:800;letter-spacing:-.02em}.mix-header p{color:var(--ds-muted)}.mix-builder-layout{gap:20px}.workout-builder>h3,#available-songs-title,.mix-builder-right>h3{color:var(--ds-text);font-weight:700;letter-spacing:-.01em;font-size:18px}.mix-builder-left,.mix-builder-right{background:linear-gradient(180deg,var(--ds-surface),#0c3645);border:1px solid var(--ds-border);border-radius:var(--ds-r);box-shadow:var(--ds-shadow-sm);padding:18px}.workout-slots{display:flex;flex-direction:column;gap:10px}.workout-slot{display:block;background:var(--ds-bg-2);border:1px solid var(--ds-border);border-radius:var(--ds-r-sm);box-shadow:none;padding:12px 14px;transition:border-color .15s ease,background .15s ease,transform .12s ease;overflow:hidden}.workout-slot:hover{border-color:var(--ds-border-strong);background:var(--ds-surface)}.workout-slot.selected{border-color:var(--ds-gold);background:#ffd66b0f;box-shadow:0 0 0 1px var(--ds-gold) inset}.workout-slot.filled{border-color:#19e0ae59}.workout-slot .slot-header{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:10px;margin-bottom:8px;padding:0;width:100%;min-width:0;max-width:none;flex:1 1 auto;flex-wrap:nowrap}.workout-slot .slot-number{flex:0 0 auto;width:26px;height:26px;border-radius:var(--ds-pill);display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--ds-gold),var(--ds-gold-strong));color:#06222d;font-weight:800;font-size:13px;line-height:1;margin:0}.workout-slot .slot-name{color:var(--ds-text);font-weight:700;font-size:14px;letter-spacing:.01em;text-transform:none;display:inline-flex;align-items:center;gap:6px;flex:1 1 auto;min-width:0;width:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}.workout-slot .slot-content{display:block;width:100%;max-width:none;min-width:0;min-height:0;flex:none;padding:0;overflow:visible;align-items:stretch}.workout-slot .drop-placeholder,.workout-slot .slot-placeholder{display:block;width:100%;margin:0;color:var(--ds-faint);font-size:13px;line-height:1.4;background:none;border:0;padding:0;text-align:left;flex:none;white-space:normal;overflow:visible}.slot-placeholder .placeholder-title{color:var(--ds-muted);font-weight:600;font-size:13px;margin-bottom:2px}.slot-placeholder .placeholder-description{color:var(--ds-faint);font-size:12px;line-height:1.4}.workout-slot.drag-over,.slot-content.drag-over{border-color:var(--ds-gold);background:#ffd66b14}.slot-song{display:flex;flex-direction:column;gap:7px}.slot-song-header{display:flex;align-items:flex-start;gap:8px}.slot-song-title{flex:1 1 auto;color:var(--ds-text);font-weight:700;font-size:14px;line-height:1.25;min-width:0}.slot-muscle-badge,.mix-song-muscle-badge{flex:none;display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:var(--ds-text);background:var(--ds-surface-2);border:1px solid var(--ds-border);padding:3px 9px;border-radius:var(--ds-pill);white-space:nowrap;line-height:1.4}.remove-song-btn{flex:none;width:24px;height:24px;border-radius:var(--ds-pill);border:1px solid var(--ds-border);background:var(--ds-surface-2);color:var(--ds-muted);font-size:16px;line-height:1;cursor:pointer;padding:0;display:inline-flex;align-items:center;justify-content:center;transition:.12s ease}.remove-song-btn:hover{background:#ff4e4529;color:#ff6e63;border-color:#ff4e4566}.slot-song-info{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.slot-song-artist{color:var(--ds-muted);font-size:12.5px}.slot-song-difficulty{color:var(--ds-flame);font-size:12.5px;white-space:nowrap}.slot-song-links{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:2px}.slot-song-media-links{display:flex;align-items:center;gap:8px}.song-filters{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}.search-and-clear{display:flex;gap:8px}#mix-search-input{flex:1 1 auto}#mix-search-input,#mix-clear-btn,.mix-filter,#mix-program-filter,#mix-muscle-filter,#mix-difficulty-sort,#mix-genre-filter-btn{background:var(--ds-surface);color:var(--ds-text);border:1px solid var(--ds-border-strong);border-radius:var(--ds-r-sm);padding:9px 12px;font-size:14px;font-weight:500;font-family:var(--ds-font)}#mix-search-input::placeholder{color:var(--ds-faint)}#mix-clear-btn{flex:none;width:auto;cursor:pointer;color:var(--ds-muted)}#mix-clear-btn:hover{background:var(--ds-surface-2);color:var(--ds-text)}.mix-filter:hover,#mix-program-filter:hover,#mix-muscle-filter:hover,#mix-difficulty-sort:hover{border-color:var(--ds-gold)}select.mix-filter{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239FB7C0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:16px;padding-right:34px}.filters-toggle{background:var(--ds-surface);color:var(--ds-text);border:1px solid var(--ds-border-strong);border-radius:var(--ds-r-sm);width:100%;text-align:left;padding:9px 12px;font-weight:600;font-size:14px;display:flex;align-items:center;gap:8px;cursor:pointer;transition:.15s ease;box-shadow:none}.filters-toggle:hover{background:var(--ds-surface-2);border-color:var(--ds-gold);transform:none;box-shadow:none}.filters-toggle:before{content:"";flex:none;width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFD66B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21v-7M4 10V3M12 21v-9M12 8V3M20 21v-5M20 12V3M1 14h6M9 8h6M17 16h6'/%3E%3C/svg%3E") center/contain no-repeat}.filters-toggle .ds-icon{color:var(--ds-gold);font-size:16px}.filters-content{margin-top:0}.filters-content.open,.filters-content{gap:8px}.mix-genre-dropdown{position:relative}.mix-dropdown-content{background:var(--ds-bg-2);border:1px solid var(--ds-border-strong);border-radius:var(--ds-r-sm);box-shadow:var(--ds-shadow)}.mix-genre-list label,.mix-genre-list .genre-option{color:var(--ds-text)}.mobile-select-message{color:var(--ds-muted);background:var(--ds-bg-2);border:1px dashed var(--ds-border-strong);border-radius:var(--ds-r-sm);padding:14px;font-size:13px;text-align:center}.mix-song-list{display:flex;flex-direction:column;gap:8px}.mix-song-item{background:var(--ds-bg-2);border:1px solid var(--ds-border);border-radius:var(--ds-r-sm);padding:11px 13px;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .12s ease;box-shadow:none;display:flex;flex-direction:column;gap:6px}.mix-song-item:hover{border-color:var(--ds-gold);background:var(--ds-surface);transform:translateY(-1px)}.mix-song-item-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.mix-song-item-title{color:var(--ds-text);font-weight:700;font-size:14.5px;line-height:1.25;letter-spacing:-.01em}.mix-song-item-info{display:flex;align-items:center;justify-content:space-between;gap:10px}.mix-song-item-info>span:first-child{color:var(--ds-muted);font-size:12.5px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mix-song-right-column{display:flex;align-items:center;gap:8px;flex:none}.mix-song-flames{color:var(--ds-flame);font-size:13px;line-height:1;letter-spacing:1px}.mix-song-program{font-size:11px;font-weight:700;color:var(--ds-gold);background:#ffd66b1a;border:1px solid rgba(255,214,107,.25);padding:2px 8px;border-radius:var(--ds-pill);line-height:1.5}.mix-song-links{display:flex;align-items:center;gap:8px;margin-top:1px}.mix-song-links a,.slot-song-media-links a{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:var(--ds-pill);background:var(--ds-surface-2);border:1px solid var(--ds-border);transition:transform .12s ease,border-color .15s ease}.mix-song-links a:hover,.slot-song-media-links a:hover{transform:translateY(-1px);border-color:var(--ds-border-strong)}.mix-song-links a .logo-icon,.slot-song-media-links a .logo-icon,.logo-icon{width:16px;height:16px;object-fit:contain;margin:0}.mix-info{background:var(--ds-bg-2);border:1px solid var(--ds-border);border-radius:var(--ds-r-sm);padding:14px;margin-bottom:14px}.mix-stats .stat-row{display:flex;align-items:center;gap:8px;color:var(--ds-muted);font-size:13.5px;margin-bottom:6px}.mix-stats .stat-label{color:var(--ds-faint);font-weight:600}#total-duration,#mix-difficulty{color:var(--ds-text);font-weight:700}.share-mix-btn{width:100%;margin-top:8px;padding:12px 16px;border:0;cursor:pointer;border-radius:var(--ds-pill);font-weight:800;font-size:15px;background:linear-gradient(135deg,var(--ds-gold),var(--ds-gold-strong));color:#06222d;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:transform .12s ease,filter .15s ease;box-shadow:var(--ds-shadow-sm)}.share-mix-btn:hover{transform:translateY(-1px);filter:brightness(1.04)}.share-mix-btn:disabled{opacity:.55;cursor:not-allowed;filter:grayscale(.2)}.empty-workout-guide{background:var(--ds-bg-2);border:1px solid var(--ds-border);border-radius:var(--ds-r);padding:22px;margin-bottom:14px}.empty-workout-guide .guide-icon{font-size:34px}.empty-workout-guide h4{color:var(--ds-gold);font-weight:800}.empty-workout-guide p,.guide-content p{color:var(--ds-muted)}.workout-flow{display:flex;flex-direction:column;gap:10px;margin:14px 0}.flow-item{display:flex;align-items:center;gap:12px}.flow-number{flex:none;min-width:30px;height:30px;padding:0 9px;border-radius:var(--ds-pill);display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--ds-gold),var(--ds-gold-strong));color:#06222d;font-weight:800;font-size:13px}.flow-text{color:var(--ds-text);font-size:14px}.flow-text strong{color:var(--ds-gold)}.guide-tip{background:var(--ds-surface);border:1px solid var(--ds-border);border-left:3px solid var(--ds-gold);border-radius:var(--ds-r-sm);padding:12px 14px;color:var(--ds-muted);font-size:13px}.guide-tip strong{color:var(--ds-text)}.mobile-song-modal{position:fixed;inset:0;z-index:2000;background:#021218a8;align-items:flex-start;justify-content:center}.mobile-song-modal-content{background:var(--ds-bg-2);border:1px solid var(--ds-border-strong);border-radius:var(--ds-r);box-shadow:var(--ds-shadow);width:min(94vw,520px);margin:64px auto 0;max-height:calc(100vh - 88px);display:flex;flex-direction:column;overflow:hidden}.mobile-song-modal-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--ds-border);flex:none}.mobile-song-modal-header h3{color:var(--ds-gold);font-weight:800;font-size:17px;margin:0}.mobile-song-modal-close{flex:none;width:34px;height:34px;border-radius:var(--ds-pill);border:1px solid var(--ds-border-strong);background:var(--ds-surface);color:var(--ds-text);font-size:20px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.mobile-song-modal-close:hover{background:var(--ds-surface-2)}.mobile-song-modal-body{padding:14px 18px 18px;overflow-y:auto;display:flex;flex-direction:column;gap:12px}.mobile-search-container{flex:none}.mobile-search-input{width:100%;background:var(--ds-surface);color:var(--ds-text);border:1px solid var(--ds-border-strong);border-radius:var(--ds-r-sm);padding:11px 14px;font-size:15px}.mobile-search-input::placeholder{color:var(--ds-faint)}.mobile-song-list{display:flex;flex-direction:column;gap:8px}#share-modal.modal-overlay{background:#021218b8;z-index:2000;padding:24px}.share-modal-content,.modal-content.share-modal-content{background:var(--ds-bg-2);border:1px solid var(--ds-border-strong);border-radius:var(--ds-r-lg);box-shadow:var(--ds-shadow);width:min(94vw,760px);max-height:90vh;display:flex;flex-direction:column;overflow:hidden;color:var(--ds-text)}.share-modal-content .modal-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;border-bottom:1px solid var(--ds-border);flex:none}.share-modal-content .modal-close{flex:none;width:34px;height:34px;border-radius:var(--ds-pill);border:1px solid var(--ds-border-strong);background:var(--ds-surface);color:var(--ds-text);font-size:20px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.share-modal-content .modal-close:hover{background:var(--ds-surface-2)}.share-modal-content .modal-body{padding:22px;overflow-y:auto;flex:1 1 auto}.share-modal-content .modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:16px 22px;border-top:1px solid var(--ds-border);flex:none}.share-progress{display:flex;align-items:center;gap:10px}.share-progress .progress-step{display:flex;align-items:center;gap:8px;opacity:.55;transition:opacity .2s ease}.share-progress .progress-step.active,.share-progress .progress-step.completed{opacity:1}.share-progress .step-number{width:26px;height:26px;border-radius:var(--ds-pill);flex:none;display:inline-flex;align-items:center;justify-content:center;background:var(--ds-surface);border:1px solid var(--ds-border-strong);color:var(--ds-muted);font-weight:800;font-size:13px}.share-progress .progress-step.active .step-number{background:linear-gradient(135deg,var(--ds-gold),var(--ds-gold-strong));color:#06222d;border-color:transparent}.share-progress .progress-step.completed .step-number{background:var(--ds-green);color:#06222d;border-color:transparent}.share-progress .step-label{color:var(--ds-muted);font-size:13px;font-weight:600}.share-progress .progress-step.active .step-label{color:var(--ds-text)}.share-step .step-header{text-align:center;margin-bottom:20px}.share-step .step-header h2{color:var(--ds-gold);font-weight:800;font-size:22px;letter-spacing:-.01em;display:inline-flex;align-items:center;gap:9px;justify-content:center}.share-step .step-header h2 .ds-icon{color:var(--ds-gold);font-size:22px}.share-step .step-header p{color:var(--ds-muted);margin-top:4px}.form-layout{display:grid;grid-template-columns:1fr 1fr;gap:22px}.form-group{margin-bottom:16px}.form-group label{display:block;color:var(--ds-text);font-weight:600;font-size:13px;margin-bottom:6px}.form-input,.form-textarea{width:100%;background:var(--ds-surface);color:var(--ds-text);border:1px solid var(--ds-border-strong);border-radius:var(--ds-r-sm);padding:10px 13px;font-size:14px;font-family:var(--ds-font)}.form-input:focus,.form-textarea:focus{outline:none;border-color:var(--ds-gold)}.form-textarea{resize:vertical;min-height:96px}.input-counter{text-align:right;color:var(--ds-faint);font-size:11px;margin-top:4px}.input-feedback{font-size:12px;margin-top:3px;color:var(--ds-muted)}.mix-summary-card,.mix-preview-card{background:var(--ds-surface);border:1px solid var(--ds-border);border-radius:var(--ds-r);padding:18px}.mix-summary-card h3,.mix-preview-card .preview-header h3{color:var(--ds-text);font-weight:700;display:inline-flex;align-items:center;gap:8px;margin:0 0 14px}.mix-summary-card h3 .ds-icon{color:var(--ds-gold)}.summary-stats,.preview-stats{display:flex;gap:10px;flex-wrap:wrap}.summary-stats .stat-item,.preview-stats .stat-item{flex:1 1 0;min-width:90px;display:flex;flex-direction:column;align-items:center;gap:3px;background:var(--ds-bg-2);border:1px solid var(--ds-border);border-radius:var(--ds-r-sm);padding:12px 8px}.stat-item .stat-icon{font-size:18px;line-height:1;color:var(--ds-gold)}.stat-item .stat-icon .ds-icon{font-size:18px;color:var(--ds-gold)}.stat-item .stat-value{color:var(--ds-text);font-weight:800;font-size:18px}.stat-item .stat-label{color:var(--ds-faint);font-size:11px;text-transform:uppercase;letter-spacing:.05em;font-weight:700}.summary-programs{margin-top:12px;display:flex;flex-wrap:wrap;gap:6px}.preview-creator{color:var(--ds-muted);font-size:13px}.preview-description{color:var(--ds-muted);font-size:13.5px;margin-top:6px}.preview-songs{margin-top:14px;display:flex;flex-direction:column;gap:8px}.sharing-grid{display:flex;flex-direction:column;gap:16px}.share-section h3{color:var(--ds-text);font-weight:700;font-size:15px;display:inline-flex;align-items:center;gap:8px;margin:0 0 12px}.share-section h3 .ds-icon{color:var(--ds-gold)}.quick-share-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}.share-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--ds-surface);border:1px solid var(--ds-border-strong);color:var(--ds-text);border-radius:var(--ds-r-sm);padding:11px 14px;font-weight:600;font-size:14px;cursor:pointer;transition:transform .12s ease,border-color .15s ease,background .15s ease}.share-btn:hover{transform:translateY(-1px);background:var(--ds-surface-2);border-color:var(--ds-gold)}.share-btn .share-icon-img{width:18px;height:18px;filter:brightness(0) invert(1);opacity:.92}.share-btn .share-icon{font-size:17px;line-height:1}.share-btn .share-label{font-weight:600}.share-success-message{margin-top:16px;display:flex;align-items:center;gap:10px;background:#19e0ae1a;border:1px solid rgba(25,224,174,.3);border-radius:var(--ds-r-sm);padding:12px 14px;color:var(--ds-text);font-size:13.5px}.share-success-message .success-icon{color:var(--ds-green);font-size:18px}.share-success-message .success-icon .ds-icon{color:var(--ds-green)}.share-modal-content .btn{border-radius:var(--ds-pill);font-weight:700;font-size:14px;padding:10px 20px;cursor:pointer;display:inline-flex;align-items:center;gap:7px;border:1px solid var(--ds-border-strong);transition:transform .12s ease,filter .15s ease,background .15s ease}.share-modal-content .btn:hover{transform:translateY(-1px)}.share-modal-content .btn-secondary{background:var(--ds-surface);color:var(--ds-text)}.share-modal-content .btn-secondary:hover{background:var(--ds-surface-2)}.share-modal-content .btn-primary{background:linear-gradient(135deg,var(--ds-gold),var(--ds-gold-strong));color:#06222d;border-color:transparent}.share-modal-content .btn-primary:hover{filter:brightness(1.05)}.share-modal-content .btn-success{background:var(--ds-green);color:#06222d;border-color:transparent}.share-modal-content .btn.hidden,.share-step.hidden{display:none}@media(max-width:768px){.form-layout{grid-template-columns:1fr;gap:16px}.share-modal-content .modal-body{padding:18px}.share-step .step-header h2{font-size:19px}.mix-builder-left,.mix-builder-right{padding:14px}.workout-slot{padding:12px}.slot-header{margin-bottom:6px}.quick-share-buttons{grid-template-columns:1fr 1fr}}
