/* ===== GUEST BANNER (create.html) ===== */
.guest-banner{
    background:var(--neutral-hover-bg);border-bottom:1px solid var(--neutral-border);
    padding:var(--space-sm) var(--space-xl);
    display:flex;align-items:center;justify-content:center;gap:var(--space-md);
    font-size:var(--text-sm);color:var(--neutral);
}
.guest-banner a{color:var(--color-ivory);font-weight:500;text-decoration:underline}


/* ===== SLIDER LIMIT MESSAGE ===== */
.slider-limit-msg{
    margin-top:var(--space-sm);padding:var(--space-sm) var(--space-md);
    background:var(--neutral-hover-bg);border:1px solid var(--neutral-border);
    border-radius:var(--radius-md);font-size:var(--text-xs);
    color:var(--neutral);display:none;
    transition:opacity .3s;
}
.slider-limit-msg.visible{display:block}
.slider-limit-msg a{color:var(--color-ivory);font-weight:500;text-decoration:underline}


/* ===== ADVANCED VIDEO CONTROLS ===== */
/* Control Sections - Collapsible */
.control-section{
    background:var(--bg-card);border:1px solid var(--border);
    border-radius:var(--radius-lg);margin-bottom:var(--space-md);
    overflow:visible;transition:border-color .3s;
}
.control-section:not(.open){overflow:hidden}
.control-section:hover{border-color:var(--border-hover)}
.section-toggle{
    display:flex;align-items:center;gap:var(--space-md);
    padding:var(--space-lg) var(--space-xl);cursor:pointer;
    transition:background .2s;user-select:none;
}
.section-toggle:hover{background:rgba(255,255,255,.02)}
.section-icon{
    display:flex;align-items:center;justify-content:center;
    width:32px;height:32px;border-radius:8px;
    background:rgba(191,164,106,.1);color:#bfa46a;
    flex-shrink:0;
}
.section-icon svg{width:18px;height:18px}

/* Section icon hover micro-interaction (animations removed — too much simultaneous motion) */
.section-icon svg{transition:transform 0.2s var(--ease)}
.section-toggle:hover .section-icon svg{transform:scale(1.12)}

@keyframes iconPulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.1);opacity:1}}
@keyframes iconColorShift{0%,100%{filter:hue-rotate(0deg);opacity:.85}50%{filter:hue-rotate(30deg);opacity:1}}
@keyframes iconGlow{0%,100%{filter:drop-shadow(0 0 0 transparent)}50%{filter:drop-shadow(0 0 6px rgba(191,164,106,.5))}}
@keyframes iconWave{0%,100%{transform:translateY(0)}25%{transform:translateY(-1px)}75%{transform:translateY(1px)}}
@keyframes iconBlink{0%,90%{opacity:.85}95%{opacity:.3}}
@keyframes iconShimmer{0%{opacity:.7}50%{opacity:1;filter:brightness(1.3)}100%{opacity:.7}}
@keyframes iconSway{0%,100%{transform:rotate(0)}25%{transform:rotate(2deg)}75%{transform:rotate(-2deg)}}
@keyframes iconBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
.section-title-text{flex:1;font-weight:500;font-size:var(--text-sm);color:var(--text-primary)}
.toggle-icon{
    display:inline-block;width:8px;height:8px;flex-shrink:0;
    border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
    color:var(--text-muted);transform:rotate(45deg);font-size:0;
    transition:transform .3s var(--ease);
}
.control-section.open .toggle-icon{transform:rotate(-135deg)}
.section-content{
    max-height:0;overflow:hidden;
    transition:max-height .4s var(--ease),padding .3s;
}
.control-section.open .section-content{
    max-height:2000px;padding:var(--space-lg) var(--space-xl) var(--space-xl);
    overflow:visible;
}

/* Subsection Headers */
.subsection-header{
    font-size:var(--text-xs);font-weight:500;text-transform:uppercase;
    letter-spacing:.08em;color:var(--text-muted);
    margin:var(--space-xl) 0 var(--space-md);padding-bottom:var(--space-sm);
    border-bottom:1px solid var(--border);
}
.subsection-header:first-child{margin-top:0}

/* Form Rows - Two columns */
.form-row{display:flex;gap:var(--space-lg)}
.form-group.half{flex:1;min-width:0}
.required{color:var(--error)}

/* Custom Select Dropdown */
.custom-select{position:relative}
.select-trigger{
    display:flex;align-items:center;gap:var(--space-sm);
    padding:.75rem var(--space-lg);
    background:var(--bg-input);border:1px solid var(--border);
    border-radius:var(--radius-md);cursor:pointer;
    transition:all .2s;font-size:var(--text-sm);color:var(--text-primary);
}
.select-trigger:hover{border-color:var(--border-hover)}
.custom-select.open .select-trigger{border-color:var(--color-gold-dim)}
.select-value{flex:1}
.select-arrow{
    display:inline-block;width:7px;height:7px;flex-shrink:0;
    border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
    color:var(--text-muted);transform:rotate(45deg);font-size:0;
    transition:transform .2s;
}
.custom-select.open .select-arrow{transform:rotate(-135deg)}
.select-options{
    position:absolute;top:calc(100% + 4px);left:0;right:0;
    background:var(--bg-elevated);border:1px solid var(--border);
    border-radius:var(--radius-md);padding:var(--space-xs);
    opacity:0;visibility:hidden;transform:translateY(-8px);
    transition:all .2s var(--ease);z-index:1000;
    max-height:220px;overflow-y:auto;
}
.custom-select.open .select-options{opacity:1;visibility:visible;transform:translateY(0)}
.select-option{
    padding:.625rem var(--space-md);border-radius:var(--radius-sm);
    font-size:var(--text-sm);color:var(--text-secondary);
    cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:var(--space-sm);
}
.select-option:hover{background:rgba(255,255,255,.05);color:var(--text-primary)}
.select-option.selected{background:var(--neutral-hover-bg);color:var(--neutral)}
.custom-select.small .select-trigger{padding:.5rem var(--space-md);font-size:var(--text-xs)}
.custom-select.small .select-option{padding:.5rem var(--space-md);font-size:var(--text-xs)}

/* Scrollbar for dropdowns */
.select-options::-webkit-scrollbar{width:6px}
.select-options::-webkit-scrollbar-track{background:transparent}
.select-options::-webkit-scrollbar-thumb{background:var(--border-hover);border-radius:3px}

/* ── Voice Preview Area ───────────────────────────────────────── */
.voice-preview-area {
    margin-top: 12px;
    max-height: 200px;
    overflow-y: auto;
    border-radius: 8px;
}

.voice-preview-area::-webkit-scrollbar { width: 4px; }
.voice-preview-area::-webkit-scrollbar-track { background: transparent; }
.voice-preview-area::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 4px; }

.voice-preview-empty {
    padding: 20px;
    text-align: center;
    color: var(--text-muted, #777);
    font-size: 13px;
}

.voice-preview-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: var(--bg-input, #1a1a2e);
    border: 1px solid var(--border, #2a2a3e);
    border-radius: 8px;
    margin-bottom: 6px;
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s;
}

.voice-preview-item:hover {
    border-color: var(--text-muted, #777);
}

.voice-preview-item.selected {
    border-color: #FF6B00;
    background: rgba(255, 107, 0, 0.06);
}

.voice-preview-name {
    flex: 1;
    font-size: 13px;
    font-weight: 500;
    color: var(--text-primary, #e0e0e0);
    text-transform: capitalize;
}

.voice-preview-tags {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

.voice-preview-tag {
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 10px;
    background: rgba(255,255,255,0.06);
    color: var(--text-muted, #777);
    text-transform: capitalize;
    white-space: nowrap;
}

.voice-preview-btn {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid var(--border, #2a2a3e);
    background: transparent;
    color: var(--text-muted, #777);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    flex-shrink: 0;
}

.voice-preview-btn:hover {
    border-color: #FF6B00;
    color: #FF6B00;
}

.voice-preview-btn.playing {
    border-color: #FF6B00;
    color: #FF6B00;
    animation: voicePulse 1.5s ease-in-out infinite;
}

@keyframes voicePulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 107, 0, 0.3); }
    50% { box-shadow: 0 0 0 6px rgba(255, 107, 0, 0); }
}

.voice-loading-shimmer {
    height: 48px;
    border-radius: 8px;
    margin-bottom: 6px;
    background: linear-gradient(90deg, #1a1a2e 25%, #222240 50%, #1a1a2e 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
}

/* Aspect Ratio Icons */
.ratio-icon{
    display:inline-block;border:1.5px solid currentColor;
    border-radius:2px;margin-right:var(--space-xs);flex-shrink:0;
}
.ratio-21-9{width:21px;height:9px}
.ratio-16-9{width:18px;height:10px}
.ratio-4-3{width:16px;height:12px}
.ratio-1-1{width:14px;height:14px}
.ratio-3-4{width:12px;height:16px}
.ratio-9-16{width:10px;height:18px}

/* Duration Slider - Compact Version */
.duration-compact{
    display:flex;align-items:center;gap:var(--space-md);
    background:var(--bg-input);border:1px solid var(--border);
    border-radius:var(--radius-md);padding:.75rem var(--space-lg);
    transition:border-color .2s;
}
.duration-compact:hover{border-color:var(--border-hover)}
.duration-slider-compact{
    -webkit-appearance:none;flex:1;height:6px;
    background:linear-gradient(90deg,var(--color-gold) 30%,var(--color-black-border) 30%);
    border-radius:var(--radius-full);outline:none;cursor:pointer;
}
.duration-slider-compact::-webkit-slider-thumb{
    -webkit-appearance:none;width:18px;height:18px;
    background:var(--neutral);border:2px solid var(--bg-primary);
    border-radius:50%;cursor:grab;
    transition:transform .15s;
}
.duration-slider-compact::-webkit-slider-thumb:hover{transform:scale(1.1)}
.duration-slider-compact::-moz-range-thumb{
    width:18px;height:18px;background:var(--neutral);
    border:2px solid var(--bg-primary);border-radius:50%;cursor:grab;
}
.duration-value-compact{
    font-size:var(--text-lg);font-weight:500;min-width:28px;
    color:var(--neutral);
}
.duration-unit-compact{
    font-size:var(--text-sm);color:var(--text-muted);
}

/* Toggle Switch */
.toggle-switch{
    position:relative;display:inline-block;
    width:44px;height:24px;flex-shrink:0;
}
.toggle-switch input{opacity:0;width:0;height:0}
.toggle-slider{
    position:absolute;cursor:pointer;inset:0;
    background:var(--bg-input);border:1px solid var(--border);
    border-radius:var(--radius-full);transition:all .3s;
}
.toggle-slider::before{
    content:'';position:absolute;height:18px;width:18px;
    left:2px;bottom:2px;background:var(--text-muted);
    border-radius:50%;transition:all .3s;
}
.toggle-switch input:checked + .toggle-slider{
    background:#bfa46a;border-color:#bfa46a;
}
.toggle-switch input:checked + .toggle-slider::before{
    background:#fff;transform:translateX(20px);
}
.toggle-switch input:focus + .toggle-slider{
    border-color:var(--color-gold-dim);
}

/* Small inline toggle */
.inline-toggle{
    display:flex;align-items:center;gap:var(--space-sm);
    cursor:pointer;
}
.toggle-slider-small{
    position:relative;width:32px;height:18px;flex-shrink:0;
    background:var(--bg-input);border:1px solid var(--border);
    border-radius:var(--radius-full);transition:all .3s;
}
.toggle-slider-small::before{
    content:'';position:absolute;height:12px;width:12px;
    left:2px;top:2px;background:var(--text-muted);
    border-radius:50%;transition:all .3s;
}
.inline-toggle input{position:absolute;opacity:0;width:0;height:0}
.inline-toggle input:checked + .toggle-slider-small{
    background:#bfa46a;border-color:#bfa46a;
}
.inline-toggle input:checked + .toggle-slider-small::before{
    background:#fff;transform:translateX(14px);
}
.toggle-label{font-size:var(--text-sm);color:var(--text-secondary)}

/* Overlay option row (toggle + label + info button) */
.overlay-option{
    display:flex;align-items:center;justify-content:space-between;
    padding:var(--space-sm) 0;
    border-bottom:1px solid var(--border);
}
.overlay-option:last-child{border-bottom:none}

/* Info button with tooltip */
.info-btn{
    width:20px;height:20px;border-radius:50%;
    background:var(--bg-input);border:1px solid var(--border);
    color:var(--text-muted);font-size:11px;font-weight:500;
    cursor:help;position:relative;display:inline-flex;
    align-items:center;justify-content:center;flex-shrink:0;
    transition:all .2s;
}
.info-btn:hover{
    border-color:var(--neutral-border-hover);color:var(--neutral);
}
.info-btn:hover::after{
    content:attr(data-tooltip);
    position:absolute;bottom:calc(100% + 8px);right:0;
    width:260px;padding:var(--space-sm) var(--space-md);
    background:var(--bg-elevated);border:1px solid var(--border);
    border-radius:var(--radius-sm);font-size:var(--text-xs);
    font-weight:400;color:var(--text-secondary);line-height:1.5;
    z-index:100;
    pointer-events:none;
}

/* Muted descriptor on flat toggle rows (Music, Subtitles, Keywords) */
.toggle-row-hint{
    font-size:var(--text-xs);color:var(--text-muted);
    margin-left:var(--space-xs);margin-right:auto;white-space:nowrap;
}

/* CTA Blocks */
.cta-block{
    background:var(--bg-input);border:1px solid var(--border);
    border-radius:var(--radius-md);margin-bottom:var(--space-md);
    overflow:hidden;
}
.cta-block:last-child{margin-bottom:0}
.cta-header{
    display:flex;align-items:center;gap:var(--space-md);
    padding:var(--space-md) var(--space-lg);
}
.cta-title{font-weight:500;font-size:var(--text-sm);color:var(--text-primary)}
.cta-hint{flex:1;font-size:var(--text-xs);color:var(--text-muted)}
.cta-content{
    padding:0 var(--space-lg) var(--space-lg);
    border-top:1px solid var(--border);
    animation:fadeIn .2s ease;
}
.cta-custom-input{margin-top:var(--space-md)}
.voice-cta-row{
    display:flex;align-items:center;gap:var(--space-lg);
    margin-top:var(--space-md);flex-wrap:wrap;
}
.voice-cta-tone{margin:0;flex:1;min-width:150px}

/* Minutes Badge */
.minutes-badge{
    display:inline-flex;align-items:center;gap:var(--space-xs);
    padding:.35rem .85rem;font-size:var(--text-xs);font-weight:500;
    border-radius:var(--radius-full);
    background:var(--neutral-hover-bg);color:var(--neutral);
    border:1px solid var(--neutral-border);
}
.minutes-badge.warning{
    background:rgba(212,136,42,.1);color:var(--gold);
    border-color:rgba(212,136,42,.2);
}
.minutes-badge.danger{
    background:rgba(248,113,113,.1);color:var(--error);
    border-color:rgba(248,113,113,.2);
}
.minutes-badge.loading{
    color:transparent;min-width:120px;
    background:linear-gradient(90deg,var(--neutral-hover-bg) 25%,rgba(255,255,255,.08) 50%,var(--neutral-hover-bg) 75%);
    background-size:200% 100%;animation:shimmer 1.5s infinite;
}

/* Audio Subsections */
.audio-subsection{
    background:var(--bg-input);border:1px solid var(--border);
    border-radius:var(--radius-md);margin-bottom:var(--space-md);
    overflow:hidden;
}
.audio-subsection:last-child{margin-bottom:0}
.subsection-header-toggle{
    display:flex;align-items:center;justify-content:space-between;
    padding:var(--space-md) var(--space-lg);
    font-weight:500;font-size:var(--text-sm);color:var(--text-primary);
}
.audio-subsection-content{
    padding:0 var(--space-lg) var(--space-lg);
    border-top:1px solid var(--border);
}
.audio-subsection-content.hidden{display:none}

/* Branding Subsections */
.branding-subsection{
    background:var(--bg-input);border:1px solid var(--border);
    border-radius:var(--radius-md);margin-bottom:var(--space-md);
    overflow:hidden;
}
.branding-subsection:last-child{margin-bottom:0}
.branding-subsection-content{
    padding:var(--space-lg);
    border-top:1px solid var(--border);
}

/* Brand Video Items */
.brand-video-item{
    background:var(--bg-card);border:1px solid var(--border);
    border-radius:var(--radius-md);margin-bottom:var(--space-md);
    overflow:hidden;
}
.brand-video-item:last-child{margin-bottom:0}
.brand-video-header{
    display:flex;align-items:center;justify-content:space-between;
    padding:var(--space-md) var(--space-lg);
    background:rgba(255,255,255,.02);
}
.brand-video-title{font-weight:500;font-size:var(--text-sm);color:var(--text-secondary)}
.brand-video-upload{padding:var(--space-md)}

/* V3 File Upload Zone */
.file-upload-zone{
    border:1.5px dashed var(--border);
    border-radius:var(--radius-lg);
    background:var(--bg-input);
    transition:border-color 0.2s, background 0.2s;
}
.file-upload-zone.has-files{border-style:solid}
.upload-area{
    padding:var(--space-xl) var(--space-lg);
    display:flex;align-items:center;justify-content:center;
    gap:var(--space-md);cursor:pointer;
    transition:background 0.2s;
    border-radius:var(--radius-lg);
}
.upload-area:hover{background:var(--neutral-hover-bg)}
.upload-area.dragover{background:var(--neutral-hover-bg);border-color:var(--neutral-border-hover)}
.upload-placeholder{display:flex;align-items:center;gap:var(--space-md);color:var(--text-muted)}
.upload-icon-inline{display:flex;align-items:center;opacity:.5}
.upload-icon-inline svg{width:22px;height:22px}
.upload-prompt-text{font-size:var(--text-sm);color:var(--text-secondary)}
.upload-formats{font-size:var(--text-xs);color:var(--text-muted);margin-left:var(--space-xs)}
.form-label-optional{font-size:var(--text-xs);color:var(--text-muted);font-weight:400}

/* Upload Preview Grid */
.upload-preview-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(120px,1fr));
    gap:var(--space-sm);
    padding:0 var(--space-md) var(--space-md);
}
.upload-preview-grid:empty{display:none;padding:0}
/* ─── Upload Card (redesigned: thumb + content area) ─── */
.upload-card{
    position:relative;
    border-radius:var(--radius-md);
    overflow:hidden;
    background:var(--card-bg);
    border:1px solid var(--border);
    display:flex;flex-direction:column;
    animation:fadeInUp 0.3s ease;
    transition:border-color 0.3s ease, box-shadow 0.3s ease;
}
.upload-card:hover{
    border-color:rgba(184,151,46,0.25);
    box-shadow:0 0 12px rgba(184,151,46,0.06);
}
/* Thumbnail wrapper */
.upload-card-thumb{
    position:relative;
    width:100%;height:120px;
    overflow:hidden;flex-shrink:0;
}
.upload-card-thumb img,
.upload-card-thumb video{
    width:100%;height:100%;object-fit:cover;display:block;
}
/* Hover overlay — inside thumb only */
.upload-card-overlay{
    position:absolute;inset:0;
    background:linear-gradient(to top, rgba(0,0,0,0.6) 0%, transparent 50%);
    opacity:0;transition:opacity 0.2s;
    display:flex;align-items:flex-end;justify-content:space-between;
    padding:var(--space-xs);
}
.upload-card:hover .upload-card-overlay{opacity:1}
.upload-card-name{
    font-size:10px;color:#fff;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    max-width:calc(100% - 24px);
}
.upload-card-remove{
    width:20px;height:20px;
    border-radius:50%;border:none;
    background:rgba(255,60,60,0.8);color:#fff;
    font-size:12px;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;
    transition:background 0.2s;
}
.upload-card-remove:hover{background:rgba(255,60,60,1)}

/* Video badge on upload card */
.upload-card-badge{
    position:absolute;top:6px;left:6px;
    background:var(--accent);color:#fff;font-size:9px;font-weight:700;
    padding:2px 6px;border-radius:4px;text-transform:uppercase;
    letter-spacing:0.5px;z-index:2;
}
/* Video duration badge */
.upload-card-duration{
    position:absolute;bottom:6px;right:6px;
    font-size:10px;font-weight:700;color:#fff;
    background:rgba(0,0,0,0.7);padding:1px 5px;
    border-radius:3px;z-index:2;
    font-variant-numeric:tabular-nums;
}
/* Upload progress spinner on card */
.upload-card-spinner{
    position:absolute;inset:0;
    display:flex;align-items:center;justify-content:center;
    background:rgba(11,11,15,0.6);
}
.upload-card-spinner .spinner{
    width:24px;height:24px;border-width:2px;
}
/* Progress bar — inside .upload-card-thumb */
.upload-card-progress-wrap{
    position:absolute;bottom:0;left:0;right:0;
    height:3px;background:rgba(255,255,255,0.12);
    border-radius:0 0 var(--radius-md) var(--radius-md);overflow:hidden;
}
.upload-card-progress-fill{
    height:100%;width:0%;
    background:var(--accent);
    transition:width 0.15s ease;
}
/* Retry overlay shown on failed uploads */
.upload-card-retry{
    position:absolute;inset:0;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
    background:rgba(11,11,15,0.82);
    padding:8px;z-index:3;
}
.upload-error-msg{
    font-size:10px;color:var(--error);text-align:center;
    overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
}
/* AI analysis status — inline strip below thumbnail */
.upload-analyze-badge{
    font-size:10px;font-weight:600;letter-spacing:0.5px;
    padding:6px 10px;
    border-top:1px solid rgba(255,255,255,0.04);
    display:flex;align-items:center;gap:6px;
}
.upload-analyze-badge--analyzing{
    background:linear-gradient(90deg, rgba(184,151,46,0.05) 25%, rgba(184,151,46,0.12) 50%, rgba(184,151,46,0.05) 75%);
    background-size:200% 100%;
    color:var(--color-gold, #b89732);
    animation:shimmer 1.8s ease infinite;
}
.upload-analyze-badge--analyzing::before{
    content:'';width:6px;height:6px;border-radius:50%;
    background:var(--color-gold, #b89732);
    animation:analyzePulse 1.4s ease-in-out infinite;
}
.upload-analyze-badge--done{
    background:rgba(39,174,96,0.06);
    color:#4ade80;
}
.upload-analyze-badge--done::before{
    content:'\2713';font-size:10px;
}
@keyframes analyzePulse{
    0%,100%{opacity:1}
    50%{opacity:0.45}
}
/* Creator label input below thumbnail */
.upload-card-caption{
    padding:6px 8px;
    border-top:1px solid rgba(255,255,255,0.04);
}
.upload-card-caption input{
    width:100%;
    background:rgba(14,14,16,0.6);
    border:1px solid rgba(255,255,255,0.07);
    border-radius:5px;
    padding:6px 8px;
    font-size:11px;
    color:var(--color-ivory,#F5F0E8);
    font-family:inherit;
}
.upload-card-caption input::placeholder{color:rgba(255,255,255,0.28)}
.upload-card-caption input:focus{
    outline:none;
    border-color:rgba(184,151,46,0.4);
}
@media (max-width:768px){
    .upload-card-caption input{font-size:16px} /* <16px makes iOS Safari zoom on focus */
}
/* Description area below thumbnail */
.upload-card-desc{
    font-size:11px;color:rgba(255,255,255,0.55);
    padding:8px 10px;line-height:1.4;
    overflow:hidden;display:-webkit-box;
    -webkit-line-clamp:3;-webkit-box-orient:vertical;
    border-top:1px solid rgba(255,255,255,0.04);
    animation:descFadeIn 0.5s ease;
}
.upload-card-desc.typing{
    border-right:2px solid var(--color-gold, #b89732);
    animation:descTypeCursor 0.6s step-end infinite;
}
/* PDF reference label */
.upload-card-ref-label{
    font-size:10px;color:rgba(255,255,255,0.35);
    padding:6px 10px;line-height:1.3;font-style:italic;
    border-top:1px solid rgba(255,255,255,0.04);
}
/* Video key moments */
.upload-card-moments{
    padding:6px 10px;
    border-top:1px solid rgba(255,255,255,0.04);
}
.upload-card-moments-title{
    font-size:9px;font-weight:700;text-transform:uppercase;
    letter-spacing:0.08em;color:var(--color-gold, #b89732);margin-bottom:4px;
}
.upload-card-moment{
    font-size:10px;color:rgba(255,255,255,0.45);line-height:1.4;
    padding:3px 0 3px 12px;border-left:2px solid rgba(184,151,46,0.25);
    margin-bottom:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.upload-card-moment .moment-time{
    color:var(--color-gold, #b89732);font-weight:600;margin-right:4px;
    font-variant-numeric:tabular-nums;
}
/* Animations */
@keyframes descFadeIn{
    from{opacity:0;transform:translateY(4px)}
    to{opacity:1;transform:translateY(0)}
}
@keyframes descTypeCursor{
    50%{border-right-color:transparent}
}
@media(prefers-reduced-motion:reduce){
    .upload-card-desc,.upload-card-desc.typing{animation:none;border-right:none}
    .upload-analyze-badge--analyzing{animation:none}
}

/* URL Input Row (Phase 7) */
.url-input-row{display:flex;gap:var(--space-sm)}
.url-input-row .form-input{flex:1}
.url-input-row .btn-sm{padding:8px 16px;white-space:nowrap}

/* Reference URL Chips (card layout) */
.reference-url-list{display:flex;flex-direction:column;gap:var(--space-sm, 8px);margin-top:var(--space-sm, 8px)}
.ref-url-chip{
    display:flex;flex-direction:column;gap:4px;
    background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);
    padding:10px 12px;font-size:var(--text-xs);color:var(--text-secondary);
    max-width:100%;animation:fadeInUp 0.2s ease;
    transition:border-color 0.3s;
}
.ref-url-chip:hover{border-color:rgba(184,151,46,0.2)}
.ref-url-header{display:flex;align-items:center;gap:var(--space-xs, 6px)}
.ref-url-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.ref-url-desc{
    font-size:10px;color:rgba(255,255,255,0.4);line-height:1.35;
    overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
}
.ref-url-status{font-size:10px;white-space:nowrap;display:flex;align-items:center;gap:4px;flex-shrink:0}
.ref-url-status.analyzing{color:var(--color-gold, #b89732)}
.ref-url-dot{
    width:5px;height:5px;border-radius:50%;
    background:var(--color-gold, #b89732);
    animation:analyzePulse 1.4s ease-in-out infinite;
}
.ref-url-remove{
    background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:14px;
    padding:0 2px;line-height:1;flex-shrink:0;
}
.ref-url-remove:hover{color:var(--error)}

/* PDF Upload Card — fills the .upload-card-thumb area */
.upload-card-pdf{
    width:100%;height:100%;
    display:flex;align-items:center;justify-content:center;
    background:var(--bg-input, #1a1a2e);color:var(--text-muted);
}

@keyframes fadeInUp{
    from{opacity:0;transform:translateY(8px)}
    to{opacity:1;transform:translateY(0)}
}

/* Compact File Upload */
.file-upload-compact{padding:var(--space-lg)}
.file-upload-compact .upload-icon{font-size:1.5rem;margin-bottom:var(--space-xs)}
.file-upload-compact .upload-text{font-size:var(--text-xs)}

/* Section Toggle Switch in Header */
.section-toggle-switch{margin-left:auto;margin-right:var(--space-md)}

/* File Upload */
.file-upload-area{
    border:2px dashed var(--border);border-radius:var(--radius-md);
    padding:var(--space-2xl);text-align:center;cursor:pointer;
    transition:all .2s;background:var(--bg-input);
}
.file-upload-area:hover{border-color:var(--neutral-border-hover);background:var(--neutral-hover-bg)}
.upload-placeholder{color:var(--text-muted)}
.upload-icon{font-size:2rem;display:block;margin-bottom:var(--space-sm);opacity:.5}
.upload-text{font-size:var(--text-sm)}
.upload-preview{position:relative;display:inline-block}
.upload-preview img{max-width:200px;max-height:100px;border-radius:var(--radius-sm)}
.remove-logo-btn{
    position:absolute;top:-8px;right:-8px;
    width:24px;height:24px;border-radius:50%;
    background:var(--error);color:var(--color-ivory);border:none;
    cursor:pointer;font-size:var(--text-base);
    display:flex;align-items:center;justify-content:center;
    transition:transform .15s;
}
.remove-logo-btn:hover{transform:scale(1.1)}

/* Videos Dashboard View Toggle */

/* Validation error state */
.form-input.error,.form-textarea.error,.custom-select.error .select-trigger{
    border-color:var(--error);
}
.shake{animation:shake .4s ease}
@keyframes shake{
    0%,100%{transform:translateX(0)}
    20%,60%{transform:translateX(-5px)}
    40%,80%{transform:translateX(5px)}
}


/* ===== CREATE PAGE — Progress Steps ===== */
.production-steps {
    margin-top: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.production-step {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    color: var(--text-muted);
    transition: all 0.3s;
}

.production-step.done {
    color: var(--success);
}

.production-step.active {
    color: var(--text-primary);
    background: var(--neutral-hover-bg);
}

.production-step-icon {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.production-step.active .production-step-icon {
    color: var(--accent);
    animation: pulse 1.5s ease-in-out infinite;
}

.production-step-label {
    flex: 1;
}

.production-step-detail {
    font-size: var(--text-xs);
    color: var(--text-muted);
}