/* ✂️ Монтаж клипа «Автоклипа» (docs/contracts/klipy_editor.md): «Тёплая сцена» как у «Клипов»; текст ≥14px, кнопки ≥44px; 360 + ПК */
.ke-ov { position: fixed; inset: 0; z-index: 1900; overflow-y: auto; -webkit-overflow-scrolling: touch; background: radial-gradient(120% 60% at 50% 0, #3a1018 0, #130709 62%), #130709; color: #fbf1de; }
.ke-body { max-width: 1080px; margin: 0 auto; padding: calc(12px + env(safe-area-inset-top, 0px)) 14px calc(118px + env(safe-area-inset-bottom, 0px)); font: 500 16px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.ke-top { display: flex; align-items: center; gap: 10px; min-height: 48px; margin-bottom: 10px; }
.ke-player { position: relative; height: 40vh; max-width: 100%; aspect-ratio: 9 / 16; margin: 0 auto 8px; border-radius: 16px; overflow: hidden; background: #000; }
.ke-v { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #000; }
.ke-sv { z-index: 1; }
.ke-pctl { position: absolute; z-index: 2; left: 8px; right: 8px; bottom: 8px; display: flex; align-items: center; gap: 10px; }
.ke-time { white-space: nowrap; padding: 2px 8px; border-radius: 8px; background: rgba(0,0,0,.55); font: 700 14px/1.4 ui-monospace, Menlo, monospace; }
.ke-ov .k2-btn.sm { min-width: 44px; }
.ke-zoom { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin: 10px 0 6px; font-size: 14px; color: #d9c7aa; }
.ke-tl { position: relative; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; padding: 0 0 6px; border-radius: 12px; background: rgba(255,238,208,.04); }
.ke-tli { position: relative; height: 112px; min-width: 100%; }
.ke-ruler { position: absolute; left: 0; top: 0; height: 26px; border-bottom: 1px solid rgba(242,196,109,.25); cursor: pointer; }
.ke-ruler span { position: absolute; top: 0; height: 26px; border-left: 1px solid rgba(242,196,109,.35); padding-left: 3px; font-size: 14px; line-height: 26px; color: #d9c7aa; white-space: nowrap; }
.ke-row { position: absolute; left: 0; }
.ke-scenes { top: 32px; height: 72px; }
.ke-sc { position: absolute; top: 0; height: 72px; min-width: 44px; padding: 0; box-sizing: border-box; border: 2px solid #130709; border-radius: 8px; background: #4a2a1e left center / auto 100% repeat-x; overflow: hidden; cursor: pointer; color: #fbf1de; }
.ke-sc.film { background-color: #2d3550; }
.ke-sc.on { border-color: #7ec8ff; box-shadow: 0 0 0 2px #7ec8ff; z-index: 2; }
.ke-sc i { position: absolute; left: 3px; top: 3px; z-index: 1; padding: 0 5px; border-radius: 6px; background: rgba(0,0,0,.65); font: 700 14px/1.35 system-ui, sans-serif; font-style: normal; }
.ke-sc.cov { border-color: #f2c46d; }
.ke-sc.on.cov { border-color: #fff; box-shadow: 0 0 0 2px #f2c46d; }
.ke-covi { position: absolute; inset: 0; background: rgba(242,196,109,.55) left center / auto 100% repeat-x; box-shadow: inset 0 0 0 999px rgba(242,196,109,.22); }   /* перекрытие поверх куска — золото */
.ke-ph { position: absolute; top: 0; bottom: 0; width: 2px; margin-left: -1px; z-index: 4; background: #fff; pointer-events: none; box-shadow: 0 0 4px rgba(0,0,0,.6); }
.ke-pick { margin-top: 12px; }
.ke-spares { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 6px; -webkit-overflow-scrolling: touch; }
.ke-spare { position: relative; flex: none; width: 96px; margin: 0; }
.ke-spb { position: relative; display: block; width: 96px; aspect-ratio: 9 / 16; padding: 0; border: 2px solid rgba(242,196,109,.35); border-radius: 12px; overflow: hidden; background: #2d3550; cursor: pointer; }
.ke-spb[aria-disabled="true"] { opacity: .7; }
.ke-spare.on .ke-spb { border-color: #f2c46d; box-shadow: 0 0 0 2px #f2c46d; }
.ke-spare.used .ke-spb img { opacity: .45; }
.ke-spb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ke-spb i { position: absolute; left: 4px; right: 4px; bottom: 4px; padding: 1px 5px; border-radius: 6px; background: rgba(0,0,0,.7); color: #fbf1de; font: 700 14px/1.3 system-ui, sans-serif; font-style: normal; text-align: center; }
.ke-noimg { display: grid; place-items: center; height: 100%; font-size: 28px; }
.ke-spv { position: absolute; right: 4px; top: 4px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; font-size: 16px; cursor: pointer; }
.ke-spare figcaption { margin-top: 4px; font-size: 14px; line-height: 1.25; color: #d9c7aa; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.ke-res { margin-top: 14px; }
.ke-sp { height: 20px; }
.ke-ov .k2-bar .k2-btn { flex-direction: column; gap: 0; }
.ke-ov .k2-bar .k2-btn small { display: block; font-size: 14px; font-weight: 600; opacity: .8; }
@media (min-width: 900px) { .ke-player { height: 56vh; } .ke-tli { height: 120px; } }