.moments-panel { margin:18px 0; padding:20px; border:1px solid var(--line-2); border-radius:14px; background:linear-gradient(145deg,rgba(196,167,231,.07),transparent 65%); }
.moments-panel[hidden], .moments-panel [hidden] { display:none !important; }
.moment-heading { display:flex; align-items:center; gap:10px; }
.moment-heading h2 { font-family:var(--display); font-size:21px; margin:0; letter-spacing:-.03em; }
.moment-beta { border:1px solid rgba(196,167,231,.3); border-radius:6px; padding:2px 7px; font-size:10px; color:var(--accent); text-transform:uppercase; letter-spacing:.08em; }
.moment-source { font-size:12px; color:var(--muted); overflow-wrap:anywhere; margin:7px 0 12px; }
.moments-panel textarea { min-height:72px; height:80px; resize:vertical; }
.moments-panel input { background:var(--panel-2); border:1px solid var(--line-2); border-radius:8px; color:var(--text); font:13px var(--font); padding:9px 10px; min-width:0; }
.moment-filters,.moment-range { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.moment-filters > div { min-width:0; }
.moment-filters select { width:100%; }
.moment-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.moment-button { border:1px solid var(--line-2); border-radius:8px; padding:9px 12px; font:500 12px var(--font); color:var(--text); background:var(--panel-2); cursor:pointer; }
.moment-button:hover { border-color:var(--accent); }
.moment-button:focus-visible,.moments-panel input:focus-visible { outline:2px solid var(--accent-2); outline-offset:3px; }
.moment-button:disabled { opacity:.45; cursor:wait; }
.moment-primary,.moment-use { color:var(--ink); background:var(--accent); border-color:var(--accent); }
.moment-status { color:var(--accent-2); font-size:12px; line-height:1.6; margin:12px 0 0; }
.moment-status.error { color:var(--warn); }
.moment-status:empty { display:none; }
.moment-usage { color:var(--muted); font-size:11px; line-height:1.65; margin:12px 0; }
.moment-settings { margin-top:12px; font-size:12px; color:var(--muted); }
.moment-settings summary { cursor:pointer; padding:6px 0; }
.moment-settings input { margin-top:6px; }
.moment-results { display:grid; gap:14px; margin-top:18px; }
.moment-results:empty { margin:0; }
.moment-card { padding:17px; background:var(--panel); border:1px solid var(--line-2); border-radius:12px; }
.moment-eyebrow { color:var(--accent); font-size:10px; letter-spacing:.13em; font-weight:600; }
.moment-card h3 { font-family:var(--display); font-size:19px; font-weight:600; margin:8px 0; line-height:1.25; }
.moment-meta { color:var(--accent-2); font-size:11px; margin:8px 0; }
.moment-reason,.moment-context { font-size:12px; line-height:1.65; color:var(--muted); }
.moment-context { border-left:2px solid var(--accent); padding-left:10px; }
.moment-quote { font-size:13px; line-height:1.9; max-height:165px; overflow-y:auto; margin:14px 0; }
.moment-quote .is-speaking { background:var(--accent); color:var(--ink); border-radius:3px; }
.moment-range label { font-size:10px; color:var(--muted); margin:0; }
.moment-range input { width:100%; margin-top:5px; padding:8px; }
.moment-transcript { max-height:360px; overflow:auto; margin:12px 0; }
.moment-transcript-row { padding:12px 0; border-bottom:1px solid var(--line); }
.moment-transcript-row small { color:var(--accent-2); }
.moment-transcript-row p { margin:5px 0; }
.moment-transcript-row button { margin-right:6px; padding:5px 8px; }
.moment-speaker-row { display:grid; gap:6px; margin:10px 0; }
.moment-speaker-row label { margin:0; }
.moment-selection { padding:12px; color:var(--good); font-size:12px; border:1px solid var(--line-2); border-radius:8px; margin-top:12px; }
@media(max-width:480px) { .moments-panel { padding:14px; } .moment-filters { grid-template-columns:1fr; gap:0; } .moment-card { padding:12px; } }
.moment-launch {margin:16px 0 20px;padding:16px;border:1px solid var(--line-2);border-radius:12px;background:#c4a7e70a}.moment-launch[hidden]{display:none}.moment-launch button{width:100%;display:flex;justify-content:space-between}.moment-launch p{font-size:12px;color:var(--muted)}
dialog.clip-workspace{width:min(1080px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 24px);padding:22px 28px;margin:auto;color:var(--text);background:#111015;border:1px solid #39333f;border-radius:22px;box-shadow:0 30px 100px #0009;overflow:auto;scrollbar-width:thin;scrollbar-color:#45384f #111015}dialog.clip-workspace::backdrop{background:#050409c7;backdrop-filter:blur(9px)}
.workspace-top{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:12px}.workspace-eyebrow{color:#a196ac;font-size:10px;letter-spacing:.15em}.workspace-top h2{margin:5px 0;font:600 25px/1.2 var(--display);letter-spacing:-.035em}.workspace-top .moment-source{margin:0}.workspace-close{width:36px;height:36px;border:1px solid #36303e;border-radius:50%;background:none;color:#c5bdcd;font-size:24px;cursor:pointer;flex-shrink:0}
.workspace-prompt{padding:12px 14px;border:1px solid #302936;border-radius:12px;background:linear-gradient(110deg,#1c1722,#14131a)}.workspace-filters{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:12px}.workspace-filters label{display:flex;align-items:center;gap:7px;margin:0;font-size:11px;color:#aaa0b4;text-transform:none;letter-spacing:0}.workspace-filters select{width:auto;max-width:200px;padding:5px 24px 5px 9px;font-size:11px;height:30px;background-color:#1b1720;border-color:#3a3342}.workspace-analysis-label{font-size:10px;color:#b4a6bd;margin-left:auto}
.workspace-timeline{--selected-color:#efc57c;margin:16px 0;padding:0 3px}.tl-heading{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.1em;color:#a79aae;margin-bottom:8px}.tl-overview{position:relative;height:36px;background:#19161e;border:1px solid #2d2633;border-radius:7px;overflow:hidden}.tl-overview canvas{width:100%;height:36px;display:block}.tl-analysis-progress{position:absolute;bottom:0;left:0;height:2px;background:#8fceb3;pointer-events:none;transition:width .3s}.tl-view-window{position:absolute;top:0;bottom:0;border:1px solid #d9d0e47a;background:#e3d5f009;pointer-events:none}.tl-regions{position:relative;margin-top:7px}.tl-region{position:absolute;min-width:18px;height:20px;border:1px solid var(--moment-color);border-radius:4px;background:color-mix(in srgb,var(--moment-color) 17%,#111015);color:var(--moment-color);font-size:10px;line-height:16px;text-align:left;padding:0 5px;cursor:pointer;overflow:hidden}.tl-region[aria-pressed=true]{background:var(--moment-color);color:#171020;font-weight:700}.tl-axis{display:flex;justify-content:space-between;font-size:10px;color:#a69aad;margin-top:5px;font-variant-numeric:tabular-nums}.tl-detail-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:14px 0 9px}.tl-detail-heading>div:first-child{display:flex;gap:8px;align-items:center;min-width:0}.tl-detail-heading strong{font-size:12px;font-weight:500;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:430px}.tl-dot{width:7px;height:7px;background:var(--selected-color);border-radius:50%;flex-shrink:0}#tlSelectedLength{color:var(--selected-color);font-size:11px;white-space:nowrap}.tl-zoom{display:flex;flex-shrink:0;gap:4px}.tl-zoom button{padding:5px 8px;border:1px solid #38313f;border-radius:5px;background:transparent;font:10px var(--font);color:#c2b7cb;cursor:pointer}
.tl-detail{position:relative;height:90px;border-radius:8px;background:#1c1720;border:1px solid #3c3244;cursor:crosshair;margin:0 10px}.tl-detail canvas{display:block;width:100%;height:90px;border-radius:8px}.tl-selection{position:absolute;top:0;height:100%;background:color-mix(in srgb,var(--selected-color) 13%,transparent);border-top:1px solid var(--selected-color);border-bottom:1px solid var(--selected-color);pointer-events:none}.tl-handle{position:absolute;top:0;bottom:0;width:24px;height:100%;padding:0;border:0;background:transparent;color:#18121c;transform:translateX(-50%);cursor:ew-resize;touch-action:none;z-index:3}.tl-handle::before{content:"";position:absolute;height:100%;width:3px;top:0;left:11px;background:var(--selected-color)}.tl-handle::after{content:"Ⅱ";position:absolute;display:grid;place-items:center;height:30px;width:15px;border-radius:4px;top:calc(50% - 15px);left:5px;background:var(--selected-color);font-size:11px}.tl-playhead{position:absolute;top:0;bottom:0;width:1px;background:white;z-index:2;pointer-events:none}.tl-playhead::before{content:"";position:absolute;top:-1px;left:-3px;width:7px;height:7px;background:white;clip-path:polygon(0 0,100% 0,50% 100%)}.tl-loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:12px;color:#ada1b8}.tl-speakers{position:relative;height:22px;margin:8px 10px 0;font-size:10px;color:#a49aad}.tl-speaker{position:absolute;height:22px;padding:3px 6px;background:#25212b;border-left:2px solid #74667f;border-radius:3px;color:#c3b9cc;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.tl-detail-axis{margin-left:10px;margin-right:10px}.tl-foot{display:flex;justify-content:space-between;gap:15px;margin-top:12px;color:#a89db2;font-size:10px}#tlPlayTime{color:#ece4f3;font-variant-numeric:tabular-nums}
.workspace-edit{display:grid;grid-template-columns:270px minmax(0,1fr);gap:22px;padding-top:20px;border-top:1px solid #302836}.workspace-section-title{display:flex;justify-content:space-between;align-items:center;gap:6px;color:#a89ab4;font-size:10px;letter-spacing:.1em}.workspace-section-title button{font:11px var(--font);color:#c8b2dd;background:none;border:0;cursor:pointer;padding:5px 0}.clip-workspace .moment-results{display:grid;gap:8px;margin-top:12px}.moment-choice{display:flex;align-items:flex-start;gap:10px;width:100%;padding:12px;text-align:left;border:1px solid #302936;border-radius:9px;background:#17131c;color:#d6cddd;cursor:pointer}.moment-choice[aria-pressed=true]{border-color:color-mix(in srgb,var(--moment-color) 65%,transparent);background:color-mix(in srgb,var(--moment-color) 9%,#17131c)}.moment-choice-no{display:grid;place-items:center;flex-shrink:0;width:24px;height:24px;border-radius:6px;background:color-mix(in srgb,var(--moment-color) 13%,transparent);color:var(--moment-color);font-size:11px}.moment-choice-body strong{display:block;font:500 12px/1.45 var(--font)}.moment-choice-body small{display:block;margin-top:6px;color:#a99db5;font-size:10px;font-variant-numeric:tabular-nums}.clip-workspace .moment-detail .moment-card{border:0;background:transparent;padding:0}.clip-workspace .moment-card h3{font-size:21px}.clip-workspace .moment-eyebrow{color:var(--moment-color)}.clip-workspace .moment-quote{font-size:13px;line-height:1.8;max-height:120px;color:#dfd7e6;padding:12px 14px;background:#19151f;border-radius:9px}.moment-final-actions{justify-content:space-between;padding-top:12px;border-top:1px solid #2b2531}.workspace-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;margin-top:20px;border-top:1px solid #2d2633;padding-top:6px}.workspace-bottom details{flex:1;min-width:240px}.workspace-bottom details[open]{flex-basis:100%}.clip-workspace :focus-visible{outline:2px solid #c4a7e7;outline-offset:3px}
.workspace-handoff{position:sticky;bottom:-22px;z-index:5;display:grid;grid-template-columns:1fr minmax(190px,240px) auto;align-items:center;gap:12px 20px;margin:20px -28px -22px;padding:18px 28px;background:#19151f;border-top:1px solid #493b56;box-shadow:0 -12px 30px #0004;border-radius:0 0 22px 22px}.workspace-handoff p{margin:5px 0 0;font-size:12px;color:#c9c2d1}.workspace-handoff label{margin:0;font-size:11px}.workspace-handoff select{margin-top:5px;width:100%}.workspace-handoff #handoffStatus{grid-column:1/-1;margin:0;color:#aba3b7}
.analysis-action-row{display:flex;align-items:center;gap:16px}.analysis-action-row>div{flex:1}.analysis-action-row strong{font-size:14px}.analysis-action-row p{margin:5px 0 0}.analysis-guidance{margin-top:14px}.analysis-guidance summary{cursor:pointer;font-size:12px;color:#c7b0df}.analysis-guidance input{width:100%}
.moment-transport{display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px;position:relative;padding:10px 12px;margin:8px 10px 0;background:#1d1924;border:1px solid #393140;border-radius:12px}.moment-transport label{display:flex;align-items:center;gap:8px;margin:0;font-size:12px;text-transform:none}.moment-transport input{width:auto;margin:0;accent-color:var(--moment-color,#efc57c)}#momentPlaybackTime{font-size:12px;font-variant-numeric:tabular-nums}#momentPlaybackNote{color:#aba3b7;font-size:11px}
.moment-title-button{appearance:none;background:transparent;border:0;padding:2px 0;color:inherit;font:inherit;text-align:left;cursor:pointer;min-height:44px;border-bottom:1px dashed transparent}.moment-title-button:hover{border-bottom-color:var(--moment-color)}.moment-title-button::after{content:"✎";display:inline-block;margin-left:10px;color:var(--moment-color);font-size:18px}.moment-title-input{width:100%;font:inherit;color:inherit;min-height:44px;font-size:max(16px,1em)}.moment-rename-actions{display:flex;gap:8px;margin:4px 0 14px}.moment-rename-actions button{min-height:44px;min-width:76px}
#momentPlayToggle,.moment-card-play{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;min-width:48px;min-height:48px;padding:0;border:0;border-radius:50%;background:var(--moment-color,#efc57c);color:#1a1224;cursor:pointer;flex-shrink:0}.moment-card-player{display:flex;align-items:center;gap:14px;padding:16px;margin:8px 0 18px;background:color-mix(in srgb,var(--moment-color,#efc57c) 8%,#17151a);border:1px solid var(--moment-color,#efc57c);border-radius:14px}.moment-card-player-body{flex:1;min-width:0}.moment-card-player-meta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:#d9d2e1}.moment-card-clock{font-variant-numeric:tabular-nums;white-space:nowrap}.moments-panel .moment-card-seek{width:100%;min-height:32px;margin:5px 0 0;padding:0;accent-color:var(--moment-color,#efc57c);cursor:pointer}
@media(max-width:700px){dialog.clip-workspace{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);padding:20px 16px;border-radius:15px}.workspace-top h2{font-size:24px}.workspace-prompt{padding:12px}.workspace-filters{gap:10px}.workspace-analysis-label{width:100%;margin:0}.workspace-edit{grid-template-columns:1fr;gap:20px}.clip-workspace .moment-results{grid-template-columns:repeat(2,minmax(0,1fr))}.moment-choice{padding:9px}.tl-detail-heading{align-items:flex-start;flex-direction:column}.tl-detail-heading strong{max-width:240px}.tl-foot{flex-wrap:wrap}.workspace-bottom details{min-width:100%}.tl-handle{width:30px}.tl-handle::before{left:14px}.tl-handle::after{left:8px}.workspace-handoff{grid-template-columns:1fr;margin-left:-16px;margin-right:-16px;padding:14px 16px}}
@media(max-width:600px){.analysis-action-row{flex-wrap:wrap}.analysis-action-row>div{flex-basis:100%}}

.waveform-trim-fields { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.moment-transport .waveform-trim-fields label { gap:6px; color:#ddd5e5; }
.moments-panel .waveform-trim-fields input { width:86px; min-height:40px; padding:8px; font-size:16px; font-variant-numeric:tabular-nums; }
.waveform-trim-fields span { color:var(--muted); font-size:11px; }

/* Neutral navigation window; colored handles below still trim the clip. */
.tl-overview { height:44px; overflow:visible; }
.tl-overview canvas { height:44px; border-radius:7px; }
.tl-view-window { pointer-events:auto; border:2px solid #ded8cf; border-radius:7px; background:#ffffff0b; z-index:2; min-width:6px; }
.tl-view-pan { position:absolute; inset:0; width:100%; height:100%; background:transparent; border:0; cursor:grab; touch-action:none; }
.tl-view-pan:active { cursor:grabbing; }
.tl-view-edge { position:absolute; top:-2px; bottom:-2px; width:24px; padding:0; background:transparent; border:0; cursor:ew-resize; touch-action:none; }
.tl-view-start { left:-12px; }.tl-view-end { right:-12px; }
.tl-view-edge::after { content:""; display:block; position:absolute; top:10px; bottom:10px; left:9px; width:6px; border-radius:3px; background:#ded8cf; box-shadow:0 0 0 2px #28242c; }
.tl-navigator-hint { margin:8px 0 0; color:#b5adb9; font-size:11px; }
.tl-view-label { font-size:10px; color:#b5adb9; font-variant-numeric:tabular-nums; }

.tl-view-window { pointer-events:none; border:1px solid #ded8cf80; background:#ffffff08; }
.tl-overview { cursor:pointer; }
.tl-magnification { display:flex; align-items:center; gap:7px; color:#bdb5c5; font-size:11px; flex-shrink:0; }
.tl-magnification button { width:36px; height:36px; border:1px solid #453e4b; border-radius:50%; background:#211d27; color:#e9e3ed; font-size:22px; cursor:pointer; }
.tl-magnification button:disabled { opacity:.35; cursor:default; }
.moments-panel .tl-magnification input { width:100px; min-height:36px; margin:0; padding:0; accent-color:#c7c1ca; background:transparent; border:0; }
.tl-magnification output { min-width:36px; font-variant-numeric:tabular-nums; }
@media(max-width:700px) { .tl-magnification button { width:44px; height:44px; } .moments-panel .tl-magnification input { width:130px; min-height:44px; } }
/* A dub or caption in progress keeps the button bright and shows its step, instead of greying it
   out like a control that did nothing. */
#momentContinue.is-working:disabled{opacity:1;cursor:progress;animation:work-pulse 1.8s ease-in-out infinite}
@keyframes work-pulse{50%{filter:brightness(1.1)}}
@media(prefers-reduced-motion:reduce){#momentContinue.is-working:disabled{animation:none}}