.timeline-editor { margin-top:20px; padding-top:22px; border-top:1px solid #35404b; color:#f5f4fa; min-width:0; }
.timeline-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.timeline-heading .eyebrow { margin:0 0 7px; font-size:9px; letter-spacing:1.6px; }
.timeline-heading h3 { margin:0; font-size:18px; letter-spacing:-.4px; }
.timeline-heading p:last-child { color:#a8a9bd; margin:7px 0 0; font-size:11px; }
.timeline-heading button { flex:none; }
.timeline-editor button { min-height:36px; cursor:pointer; }
.timeline-editor button:disabled { opacity:.4; cursor:default; }
.timeline-transport { display:flex; align-items:center; gap:12px; margin:18px 0 8px; }
.timeline-play { border:1px solid #ff3cac; border-radius:9px; padding:9px 15px; background:#ff3cac; color:#180d18; font-weight:800; font-size:12px; }
.timeline-transport output { font:11px ui-monospace,monospace; color:#e8def1; font-variant-numeric:tabular-nums; }
.timeline-transport span { margin-left:auto; color:#8c91a5; font-size:10px; }
#timelineSeek { width:100%; margin:8px 0; accent-color:#ff3cac; cursor:ew-resize; }
.timeline-track-label { display:flex; gap:14px; color:#b4aac0; font-size:9px; letter-spacing:1.5px; margin:12px 0 9px; }
.timeline-track-label span { margin-left:auto; color:#888c9e; font-size:10px; letter-spacing:0; }
.timeline-scroll { overflow-x:auto; overscroll-behavior-x:contain; padding:2px 2px 12px; scrollbar-color:#73415f #10141d; }
.timeline-clips,.timeline-texts { display:flex; gap:7px; width:max-content; min-width:100%; }
.timeline-clip { position:relative; height:88px; border:2px solid #34303f; padding:0; border-radius:9px; overflow:hidden; flex-shrink:0; background:#1c1825; text-align:left; touch-action:pan-x; }
.timeline-clip img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; opacity:.76; pointer-events:none; }
.timeline-clip::after { content:''; position:absolute; inset:0; background:linear-gradient(#070a0f44,transparent 40%,#070a0fea); pointer-events:none; }
.timeline-clip.selected,.timeline-clip.is-playing { border-color:#ff3cac; box-shadow:0 0 0 2px #ff3cac20; }
.timeline-clip.drop-target { border-color:#fff; }
.timeline-clip-number,.timeline-clip-name { position:absolute; z-index:1; left:8px; right:8px; font-size:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; pointer-events:none; }
.timeline-clip-number { top:7px; font-weight:800; color:white; text-shadow:0 1px 5px black; }
.timeline-clip-name { bottom:8px; color:#f5eaf5; }
.timeline-text-group { flex-shrink:0; display:grid; align-content:start; gap:5px; min-width:0; overflow:hidden; }
.timeline-text-chip { display:block; width:100%; min-height:29px!important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:left; color:#f2c9e3; border:1px solid #713651; background:#341a2d; border-radius:6px; padding:6px 9px; font-size:10px; }
.timeline-text-chip.selected { color:white; border-color:#ff76c4; background:#6a2454; }
.timeline-inspector { margin-top:12px; padding:15px; border:1px solid #383443; border-radius:12px; background:#0b1018; }
.timeline-shot-tools { display:flex; align-items:end; gap:10px; flex-wrap:wrap; }
.timeline-shot-tools strong { font-size:12px; align-self:center; margin-right:auto; }
.timeline-editor label { display:grid; gap:6px; font-size:10px; color:#bfc1d0; }
.timeline-editor input[type=number],.timeline-editor select,.timeline-editor textarea { box-sizing:border-box; border:1px solid #3a3b4e; border-radius:7px; background:#171b28; color:#f5f4fa; padding:8px; font-size:12px; min-width:0; }
.timeline-editor input[type=number] { width:82px; }
.timeline-shot-actions { display:flex; gap:5px; }
.timeline-editor .secondary { padding:8px 11px; font-size:11px; }
.timeline-danger { border:1px solid #684252; color:#ffbdcf; background:#291720; border-radius:7px; padding:7px 9px; font-size:10px; }
#timelineTextPicker,#timelineText { display:block; width:100%; margin-top:10px; }
#timelineText { resize:vertical; min-height:66px; line-height:1.5; }
.timeline-inspector>.field-label { margin-top:16px; }
.timeline-text-settings { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:12px; }
.timeline-text-settings label:first-child { flex:1 1 110px; }
.timeline-text-settings input[type=range] { width:100%; accent-color:#ff3cac; }
.timeline-text-settings input[type=color] { width:40px; height:33px; padding:2px; border:1px solid #494051; border-radius:6px; background:#171b28; }
.timeline-text-settings .timeline-check { display:flex; align-items:center; align-self:end; min-height:34px; }
.timeline-check input { accent-color:#ff3cac; }
.timeline-editor [hidden] { display:none!important; }
.timeline-editor .helper { font-size:11px; line-height:1.6; color:#9ca5b8; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.stage-panel { min-width:0; }
@media(max-width:640px) { .timeline-heading { align-items:start; }.timeline-heading h3 { font-size:15px; }.timeline-heading button { font-size:10px; padding:8px!important; }.timeline-transport { gap:8px; }.timeline-transport span { font-size:9px; }.timeline-inspector { padding:11px; }.timeline-shot-tools strong { flex-basis:100%; }.timeline-shot-actions { width:100%; }.timeline-track-label span { max-width:170px; text-align:right; }.timeline-shot-actions .timeline-danger { margin-left:auto; } }

.photo-library { margin:12px 0; border:1px solid #363544; border-radius:9px; padding:10px; }.photo-library summary { cursor:pointer; font-size:11px; color:#e2d8e5; font-weight:700; }.photo-library[open] summary { margin-bottom:12px; }