/* 1022 새 편집기 타임라인 더하기(edv2-tl.js) — 챕터 줄 · 원본 위치 줄 · 원본 시각 말풍선 · 단축키 바꾸기 칸 */
.ev2-tlview[hidden] { display: none; }
/* 챕터 줄 — 지금 챕터 = 청록(흰 글자 5:1 넘음) · 다른 챕터 = 짙은 회색 · 편집 문서 없는 챕터 = 옅게(못 누름) */
.ev2-blk.ev2-chb { background: #374151; font-weight: 600; }
.ev2-blk.ev2-chb.on { background: #0f766e; border-color: #111; box-shadow: 0 0 0 2px #fff inset; }
.ev2-blk.ev2-chb:disabled { background: #e5e7eb; color: #374151; cursor: not-allowed; }
.ev2-blk.ev2-chb:hover:not(:disabled):not(.on) { background: #1f2937; }
/* 원본 위치 줄 — 얇은 줄 · 원본 구간(주황) 아래 옅은 주황 · 원본 들어가는 곳–나오는 곳 */
.ev2-lane.ev2-spl { height: 32px; }
.ev2-spl .ev2-lname { line-height: 32px; font-size: 12px; white-space: nowrap; overflow: hidden; }
html[data-mode="simple"] .ev2-lane.ev2-spl { height: 38px; } html[data-mode="simple"] .ev2-spl .ev2-lname { line-height: 38px; font-size: 13px; }
.ev2-sp { position: absolute; top: 3px; bottom: 3px; min-width: 4px; padding: 0 4px; border: 1px solid #b45309; border-radius: 5px; background: #fdecdc; color: #7c2d12; font: inherit; font-size: 12px; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; cursor: pointer; font-variant-numeric: tabular-nums; }
html[data-mode="simple"] .ev2-sp { font-size: 14px; }
.ev2-sp:hover { background: #fbd5b5; }
.ev2-sp:focus-visible { outline: 3px solid var(--teal); outline-offset: 1px; z-index: 2; }
.ev2-sptip { position: absolute; z-index: 40; display: flex; flex-direction: column; gap: 2px; padding: 6px 10px; border-radius: 8px; background: #111827; color: #fff; font-size: 13px; line-height: 1.3; white-space: nowrap; pointer-events: none; box-shadow: 0 6px 18px rgba(0,0,0,.3); font-variant-numeric: tabular-nums; }
.ev2-sptip b { font-size: 15px; } .ev2-sptip span { color: #e5e7eb; }
.ev2-sptip[hidden] { display: none; }
/* 단축키 바꾸기 칸 — 화면 오른쪽 아래에 뜸(타임라인이 화면 아래라 칸이 잘리지 않게) · 375 = 양옆 16px */
.ev2-pop.ev2-keys { position: fixed; top: auto; left: auto; right: 24px; bottom: 24px; width: min(500px, calc(100vw - 32px)); max-width: none; max-height: min(82vh, 720px); overflow: auto; z-index: 60; padding: 0 14px 12px; }
.ev2-pop.ev2-keys[hidden] { display: none; }
@media (max-width: 640px) { .ev2-pop.ev2-keys { left: 16px; right: 16px; bottom: 16px; width: auto; max-height: 80vh; } }
.ev2-kh { display: flex; align-items: center; justify-content: space-between; gap: 8px; position: sticky; top: 0; z-index: 1; background: var(--surface); padding-top: 8px; }
.ev2-kh h3 { margin: 0; }
.ev2-kx { width: 44px; height: 44px; border: 0; border-radius: 10px; background: transparent; color: var(--ink); font-size: 24px; line-height: 1; cursor: pointer; }
.ev2-kx:hover { background: var(--beige-2, #f3f4f6); } .ev2-kx:focus-visible, .ev2-kb:focus-visible { outline: 3px solid var(--teal); outline-offset: 2px; }
.ev2-khelp { margin: 2px 0 4px; }
.ev2-kmsg { margin: 4px 0 6px; min-height: 1.3em; font-weight: 600; color: var(--ink); }
.ev2-kmsg.warn { color: #b91c1c; } .ev2-kmsg.ok { color: #166534; }
.ev2-kl { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.ev2-kr { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 6px 10px; min-height: 50px; border-bottom: 1px solid var(--line); }
.ev2-kl.fixed .ev2-kr { min-height: 40px; }
.ev2-kn { min-width: 0; overflow-wrap: anywhere; }
.ev2-kk { white-space: nowrap; }
.ev2-kb { min-height: 44px; white-space: nowrap; }
.ev2-kb.wait { background: #fef3c7; border-color: #b45309; color: #7c2d12; }
.ev2-ktag { display: inline-block; font-size: 12px; font-weight: 500; line-height: 1.5; border: 1px solid var(--line-2); border-radius: 6px; padding: 0 5px; color: var(--muted); vertical-align: 1px; }
.ev2-ktag.chg { color: #92400e; border-color: #d97706; }
.ev2-kr.chg kbd { border-color: #d97706; background: #fffbeb; color: #78350f; }
.ev2-kfh { margin: 12px 0 2px; font-size: 14px; }
.ev2-kf { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
@media (max-width: 420px) { .ev2-kr { grid-template-columns: minmax(0, 1fr) auto; } .ev2-kr .ev2-kk { grid-column: 1; } .ev2-kr .ev2-kb { grid-column: 2; grid-row: 1 / span 2; } }