/* Original decorative editing tracks. No screenshot, font, or third-party asset needed. */
.timeline-scene {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #111719;
  color: #f9f5ed;
}
.timeline-scene > :not(.edit-timeline) { position: relative; z-index: 1; }
.edit-timeline {
  --timeline-shift: 0px;
  --timeline-drift: 0px;
  --timeline-playhead: 37%;
  --timeline-strength: .58;
  --timeline-shade: .72;
  position: absolute;
  z-index: 0;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  contain: layout paint;
}
.edit-timeline *, .edit-timeline *::before, .edit-timeline *::after { pointer-events: none; }
.edit-timeline__canvas {
  position: absolute;
  left: -7%;
  top: -18rem;
  width: 114%;
  height: calc(100% + 40rem);
  min-height: 100rem;
  opacity: var(--timeline-strength);
  transform: translate3d(var(--timeline-drift), 0, 0) rotate(-8deg);
  transform-origin: 50% 40%;
  background: #20272c;
  border: 1px solid #ffffff0f;
  mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent);
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent);
}
.edit-timeline__header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .8rem 1rem;
  border-bottom: 1px solid #cabb9c30;
  color: #cabb9c;
  font: 600 .62rem/1.3 Arial, Helvetica, sans-serif;
  letter-spacing: .12em;
}
.edit-timeline__ruler {
  position: absolute;
  top: 3rem;
  bottom: 0;
  width: 2rem;
  border-right: 1px solid #b59a6d33;
  background: repeating-linear-gradient(to bottom, #c1a6755c 0 1px, transparent 1px 28px);
}
.edit-timeline__ruler span {
  position: absolute;
  color: #bcad92;
  font: .55rem/1 monospace;
  writing-mode: vertical-rl;
  padding-top: .4rem;
}
.edit-timeline__ruler span:nth-child(1) { top: 0; }
.edit-timeline__ruler span:nth-child(2) { top: 20%; }
.edit-timeline__ruler span:nth-child(3) { top: 40%; }
.edit-timeline__ruler span:nth-child(4) { top: 60%; }
.edit-timeline__ruler span:nth-child(5) { top: 80%; }
.edit-timeline__tracks {
  display: grid;
  grid-template-columns: 1.1fr .66fr .88fr 1.15fr .72fr .72fr .7fr;
  gap: .4rem;
  height: calc(100% - 3rem);
  padding: .5rem .5rem 0 2.5rem;
  background: repeating-linear-gradient(to bottom, #ffffff09 0 1px, transparent 1px 7rem);
}
.edit-timeline__lane {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: .42rem;
  padding: 1.5rem .35rem 0;
  border-left: 1px solid #c7a36312;
  border-right: 1px solid #c7a36312;
  transform: translate3d(0, calc(var(--track-offset, 0px) + var(--timeline-shift) * var(--track-rate, .2)), 0);
}
.edit-timeline__track-name {
  position: absolute;
  top: .1rem;
  left: .35rem;
  color: #c5b79e;
  font: 600 .65rem/1 monospace;
}
.edit-clip {
  --clip-color: #786748;
  position: relative;
  flex: 0 0 auto;
  overflow: hidden;
  border-radius: .38rem;
  border: 1px solid #ffffff29;
  background: var(--clip-color);
  box-shadow: inset 0 1px 0 #ffffff34, 0 2px 0 #0008;
}
.edit-clip::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .08;
  background: repeating-linear-gradient(0deg, #000 0 1px, transparent 1px 3px);
}
.edit-clip > span {
  position: absolute;
  z-index: 1;
  top: .7rem;
  left: .65rem;
  max-height: calc(100% - 1.4rem);
  overflow: hidden;
  white-space: nowrap;
  writing-mode: vertical-rl;
  color: #171b1c;
  font: 600 clamp(.57rem, .75vw, .8rem)/1.1 Arial, Helvetica, sans-serif;
  letter-spacing: .025em;
}
.edit-clip--short { height: 8rem; }
.edit-clip--medium { height: 18rem; }
.edit-clip--long { height: 30rem; }
.edit-clip--lavender { --clip-color: #a08045; }
.edit-clip--violet { --clip-color: #455765; }
.edit-clip--yellow { --clip-color: #d7aa51; }
.edit-clip--coral { --clip-color: #c3754f; }
.edit-clip--mint { --clip-color: #639e8b; }
.edit-clip--teal { --clip-color: #447a77; }
.edit-clip--lime { --clip-color: #8f9a4c; }
.edit-clip__frames {
  position: absolute;
  right: 10%;
  top: 1rem;
  bottom: 1rem;
  width: 43%;
  opacity: .13;
  background: repeating-linear-gradient(to bottom, #1a2124 0 4.5rem, transparent 4.5rem 5rem);
}
.edit-clip__wave {
  position: absolute;
  inset: 0 8% 0 45%;
  opacity: .38;
  background:
    repeating-linear-gradient(to bottom, transparent 0 5px, #16382e 5px 6px, transparent 6px 10px),
    repeating-linear-gradient(to bottom, transparent 0 15px, #102b254d 15px 18px, transparent 18px 29px);
  clip-path: polygon(42% 0, 65% 2%, 18% 4%, 76% 7%, 35% 9%, 92% 11%, 11% 14%, 70% 16%, 32% 19%, 89% 22%, 20% 25%, 75% 28%, 40% 31%, 98% 35%, 20% 39%, 80% 42%, 28% 47%, 89% 51%, 20% 56%, 65% 60%, 32% 64%, 99% 68%, 15% 72%, 69% 76%, 24% 80%, 88% 85%, 29% 89%, 65% 94%, 45% 100%, 38% 100%, 30% 94%, 55% 89%, 15% 85%, 72% 80%, 24% 76%, 80% 72%, 12% 68%, 58% 64%, 29% 60%, 75% 56%, 10% 51%, 76% 47%, 28% 42%, 84% 39%, 12% 35%, 66% 31%, 20% 28%, 86% 25%, 19% 22%, 62% 19%, 20% 16%, 84% 14%, 10% 11%, 66% 9%, 20% 7%, 88% 4%, 32% 2%);
}
.edit-timeline__gap { flex: 0 0 auto; }
.edit-timeline__gap--small { height: 6rem; }
.edit-timeline__gap--large { height: 16rem; }
.edit-timeline__playhead {
  position: absolute;
  top: var(--timeline-playhead);
  left: .2rem;
  right: 0;
  height: 1px;
  background: #d8b572;
  box-shadow: 0 0 12px #d8b57277;
}
.edit-timeline__playhead > span {
  position: absolute;
  left: -.1rem;
  top: -.4rem;
  width: .8rem;
  height: .8rem;
  background: #d8b572;
  clip-path: polygon(0 0, 40% 0, 100% 50%, 40% 100%, 0 100%);
}
.edit-timeline__shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to bottom, #111719 0%, transparent 13%, transparent 82%, #111719 100%),
    linear-gradient(90deg, #11171966, rgb(17 23 25 / var(--timeline-shade)) 24%, rgb(17 23 25 / var(--timeline-shade)) 78%, #11171955);
}
@media (max-width: 700px) {
  .edit-timeline { --timeline-strength: .46; --timeline-shade: .78; }
  .edit-timeline__canvas { left: -28%; width: 156%; min-height: 135rem; transform: translate3d(var(--timeline-drift), 0, 0) rotate(-6deg); }
  .edit-timeline__tracks { gap: .28rem; grid-template-columns: 1.1fr .66fr .88fr 1.15fr .72fr .72fr; }
  .edit-timeline__lane:nth-child(7) { display: none; }
  .edit-timeline__lane { padding-left: .18rem; padding-right: .18rem; }
  .edit-clip > span { left: .35rem; font-size: .63rem; }
  .edit-clip--short { height: 7rem; }
  .edit-clip--medium { height: 16rem; }
  .edit-clip--long { height: 26rem; }
}
@media (prefers-reduced-motion: reduce) {
  .edit-timeline { --timeline-shift: 0px !important; --timeline-drift: 0px !important; --timeline-playhead: 37% !important; }
}

.edit-timeline__lane:nth-child(1){--track-rate:.21;--track-offset:-9rem}.edit-timeline__lane:nth-child(2){--track-rate:-.17;--track-offset:-2rem}.edit-timeline__lane:nth-child(3){--track-rate:.13;--track-offset:-16rem}.edit-timeline__lane:nth-child(4){--track-rate:-.24;--track-offset:-10rem}.edit-timeline__lane:nth-child(5){--track-rate:.19;--track-offset:-21rem}.edit-timeline__lane:nth-child(6){--track-rate:-.11;--track-offset:-5rem}.edit-timeline__lane:nth-child(7){--track-rate:.25;--track-offset:-14rem}