/* Reused from cakie-frontend/Renderer/electron/detail.css. */
.detail-loading { padding:74px 26px; }
.detail-layout { height:100%; padding:74px 26px 0; overflow:hidden; }
.detail-content { height:100%; display:flex; flex-direction:column; padding:0 8px; margin:0 -8px; }
.detail-media-row { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:22px; flex-shrink:0; }
.detail-player { min-width:0; }
.review-scroll { overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--border-strong) transparent; }
.review-scroll::-webkit-scrollbar { width:3px; height:3px; }
.review-scroll::-webkit-scrollbar-thumb { background:var(--border-strong); border-radius:8px; }
.review-scroll::-webkit-scrollbar-track { background:transparent; }
.review-image { width:100%; aspect-ratio:16/9; background:var(--card-1); overflow:hidden; flex-shrink:0; border-radius:8px; }
.review-image img { width:100%; height:100%; object-fit:contain; }
.review-empty { width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:8px; padding:18px; text-align:center; }
.review-empty .cakie-logo { width:160px; max-width:70%; }
.review-empty p { margin:0; font-size:11px; color:var(--text-tertiary); }
.review-controls .icon-button,.timeline-zoom { color:var(--text-primary); }
.review-controls { height:24px; min-height:24px; margin-top:12px; display:flex; align-items:center; justify-content:space-between; position:relative; }
.review-edit-actions,.review-video-actions { display:flex; align-items:center; gap:8px; }
.review-transport { position:absolute; left:50%; transform:translateX(-50%); display:flex; gap:12px; }
.review-video-actions { gap:12px; }
.timeline-zoom { display:flex; gap:6px; align-items:center; font-size:12px; font-weight:400; }
.timeline-zoom input { width:36px; height:12px; padding:0; margin:0; appearance:none; background:transparent; cursor:pointer; }
.timeline-zoom input::-webkit-slider-runnable-track { height:2px; border-radius:2px; background:var(--border-strong); }
.timeline-zoom input::-webkit-slider-thumb { appearance:none; width:4px; height:4px; margin-top:-1px; border:0; border-radius:50%; background:var(--text-secondary); }
.timeline-zoom input:focus-visible { outline:1px solid var(--text-secondary); outline-offset:3px; border-radius:8px; }
.timeline-shell { position:relative; height:86px; flex-shrink:0; margin-top:24px; padding:12px 0; touch-action:none; user-select:none; cursor:default; }
.timeline-viewport { overflow-x:auto; overflow-y:hidden; height:62px; scrollbar-width:none; }
.timeline-viewport::-webkit-scrollbar { display:none; }
.timeline-track { position:relative; height:62px; touch-action:none; user-select:none; cursor:default; }
.timeline-ruler { height:25px; position:relative; font-size:11px; font-weight:400; color:var(--text-tertiary); }
.timeline-ruler span { position:absolute; top:0; white-space:nowrap; }
.timeline-segments { height:31px; margin-top:6px; position:relative; border-radius:8px; overflow:hidden; }
.timeline-segment { position:absolute; top:0; height:31px; border:1px solid var(--border-strong); border-radius:8px; background:var(--card-2); overflow:hidden; display:flex; align-items:center; justify-content:center; gap:4px; padding:0 6px; font-size:11px; font-weight:400; white-space:nowrap; }
.timeline-segment.ai-selected { background:var(--card-3); }
.timeline-segment-kind { display:inline-flex; align-items:center; gap:4px; color:var(--text-primary); }
.timeline-segment-duration { color:var(--text-primary); font-weight:500; }
.timeline-empty { height:31px; font-size:10px; display:flex; align-items:center; justify-content:center; color:var(--text-tertiary); white-space:nowrap; overflow:hidden; }
.timeline-playhead { pointer-events:none; position:absolute; top:12.5625px; height:64px; width:1px; background:var(--text-primary); }
.timeline-playhead i { width:9px; height:9px; border-radius:50%; background:var(--text-primary); position:absolute; left:-4px; top:-4px; }
.summary-divider { height:1px; min-height:1px; margin:23px 0 24px; background:var(--border-strong); }
.review-summary { min-height:120px; flex:1 0 auto; display:flex; flex-direction:column; padding-bottom:24px; }
.review-summary h2 { height:22px; font-size:16px; font-weight:400; margin:0 0 18px; }
.summary-content { flex:1; border-radius:var(--radius-card); background:var(--card-1); padding:18px; color:var(--text-secondary); font-size:13px; line-height:21px; min-height:80px; }
.summary-content strong { font-size:14px; font-weight:400; }
.summary-content p { margin:12px 0; }
.summary-content ul { padding-left:18px; margin:12px 0 0; }
.detail-transcript { position:absolute; top:0; right:0; bottom:0; width:300px; padding:18px; background:var(--card-1); border-radius:var(--radius-card); color:var(--text-secondary); font-size:13px; font-weight:400; line-height:23px; }
.transcript-passage { position:relative; isolation:isolate; display:grid; grid-template-columns:auto 1fr; column-gap:14px; margin-bottom:18px; white-space:pre-wrap; }
.transcript-passage:last-child { margin-bottom:0; }
.transcript-passage button { all:unset; cursor:pointer; font-size:13px; color:var(--text-tertiary); align-self:start; line-height:23px; }
.transcript-passage[data-active="true"]::before { content:''; position:absolute; z-index:-1; inset:-6px -8px; border-radius:8px; background:var(--state-selected); pointer-events:none; }
.timeline-ruler,.timeline-segment-duration,.transcript-passage button { font-family:var(--font-mono); font-size:11px; font-weight:400; letter-spacing:0.14em; }
.transcript-passage { column-gap:12px; }
.summary-content,.detail-transcript { border:1px solid var(--border-hair); line-height:1.45; }
.timeline-segment.ai-selected { border-style:dashed; }
.timeline-segment.ai-selected .timeline-segment-kind { color:var(--warning); }