.am-sidebar { display: flex; flex-direction: column; overflow: hidden; }
.am-sidebar > .trimmer-editor__save-actions { flex-shrink: 0; }
.am-sidebar-scroll { flex: 1; min-height: 0; margin-top: 20px; overflow: auto; scrollbar-width: none; }
.am-sidebar-scroll::-webkit-scrollbar { display: none; }
.am-status { margin: 0 0 12px; color: #ff608a; font-size: 11px; line-height: 1.7; }
.am-status:empty { display: none; }
.am-card { margin: 0 0 20px; padding: 20px; border-radius: 15px; background: #242424; opacity: .4; outline: none; }
.am-card.is-active { opacity: 1; box-shadow: inset 0 0 0 1px #3e3e3e55; }
.am-card:focus-visible { outline: 1px solid #aaa; }
.am-card-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 12px; }
.am-card-heading > span { display: inline-flex; align-items: center; gap: 8px; }
.am-card-heading svg { width: 16px; height: 16px; }
.am-card-heading button { display: grid; place-items: center; width: 40px; height: 30px; border: 0; border-radius: 8px; background: #343434; color: #b8b8bf; cursor: pointer; }
.am-card-heading button svg { width: 13px; height: 13px; }
.am-card-controls { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin-top: 20px; }
.am-card-controls button { width: 100%; height: 38px; padding: 8px; border: 0; border-radius: 8px; background: #363636; color: #c8c9d1; font: inherit; font-size: 10px; font-weight: 500; cursor: pointer; text-align: center; }
.am-card-controls button { display: grid; place-items: center; }
.am-card-controls svg { width: 14px; height: 14px; fill: currentColor; }
.am-card-controls button[aria-pressed=true] { background: #7b75ff; color: #fff; }
.am-card-controls button:hover:not(:disabled):not([aria-pressed=true]), .am-card-heading button:hover:not(:disabled) { color: #fff; background: #444; }
.am-card button:focus-visible, .am-card select:focus-visible { outline: 1px solid #aaa; outline-offset: 2px; }
.am-editor .am-control-popover { position: fixed; z-index: 30; width: 10.2rem; border: 1px solid #303030; border-radius: 0.8rem; background: #292929; transform: none; }
.am-editor .am-control-popover strong { grid-template-columns: minmax(0, 1fr) max-content; justify-content: stretch; margin-bottom: 1.5rem; font-size: 0.7rem; font-weight: 400; text-align: left; }
.am-editor .am-control-popover [data-popover-label] { justify-self: start; }
.am-editor .am-control-popover [data-popover-value] { justify-self: end; }
.am-editor .am-control-popover input[type="range"] { height: 2px; background: linear-gradient(to right, #FFFFFF 0 var(--cut-range-progress), #4A4A4A var(--cut-range-progress) 100%); }
.am-editor .am-control-popover input[type="range"]::-webkit-slider-thumb { width: 16px; height: 16px; }
.am-editor .am-control-popover input[type="range"]::-moz-range-thumb { width: 16px; height: 16px; }
.am-preview { display: grid; place-items: center; padding: 0; isolation: isolate; background: #151515; }
.am-preview audio { display: none; }
.am-visualizer { position: absolute; left: 0; top: 20%; display: block; width: 100%; height: 60%; pointer-events: none; overflow: visible; }
.am-visualizer--bottom { top: 0; height: 100%; overflow: hidden; }
.am-volume { position: absolute; right: 16px; bottom: 16px; z-index: 2; min-width: 48px; box-sizing: border-box; padding: 5px 8px; border-radius: 6px; background: #000a; color: #eee; font-size: 12px; line-height: 1.4; font-variant-numeric: tabular-nums; text-align: center; cursor: ns-resize; user-select: none; opacity: 0; pointer-events: none; }
.am-preview:hover .am-volume, .am-volume:focus-visible { opacity: 1; pointer-events: auto; }
.am-volume:focus-visible { outline: 1px solid #aaa; outline-offset: 2px; }
.am-panel .trimmer-editor__controls { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); grid-template-areas: "history transport zoom"; gap: 12px; }
.am-panel .trimmer-editor__history { position: static; grid-area: history; min-width: 0; }
.am-panel .trimmer-editor__transport { grid-area: transport; }
.am-panel .trimmer-editor__zoom { position: static; grid-area: zoom; justify-content: flex-end; }
/* Reserve the same scrollbar row as Merge Videos; hide only its paint when
   the project fits, never its geometry. */
#amViewport { overflow-x: scroll; }
#amViewport:not(.am-has-overflow)::-webkit-scrollbar-track,
#amViewport:not(.am-has-overflow)::-webkit-scrollbar-thumb { background: transparent; }
@supports not selector(::-webkit-scrollbar) {
  #amViewport:not(.am-has-overflow) { scrollbar-color: transparent transparent; }
}
.am-editor .am-export-dialog { position: absolute; inset: 0; z-index: 60; background: #0009; }
.am-editor .am-export-panel { position: absolute; width: 420px; max-width: calc(100% - 24px); max-height: calc(100% - 24px); overflow-y: auto; padding: 28px; border: 1px solid #303030; border-radius: 20px; background: #202023; box-shadow: 0 20px 70px #0006; }
.am-editor .am-export-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 24px; }
.am-editor .am-export-header h2 { margin: 0; color: #eee; font-size: 20px; line-height: 1.4; font-weight: 600; text-align: left; }
.am-editor .am-export-close { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 8px; background: #2b2b30; color: #93939d; cursor: pointer; }
.am-editor .am-export-close svg { width: 14px; height: 14px; }
.am-editor .am-export-close:hover { color: #fff; background: #34343a; }
.am-editor .am-export-formats { min-width: 0; margin: 0; padding: 0; border: 0; }
.am-editor .am-export-formats legend { padding: 0; margin-bottom: 12px; color: #a1a1aa; font-size: 12px; }
.am-editor .am-export-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.am-editor .am-export-option { min-width: 0; height: 47px; padding: 8px; border: 1px solid #38383d; border-radius: 12px; background: #252529; color: #bfc0c7; font: inherit; font-size: 13px; font-weight: 500; cursor: pointer; }
.am-editor .am-export-option[aria-checked=true] { border-color: #7b75ff; background: #7b75ff1a; color: #b9b5ff; }
.am-editor .am-export-option:hover:not([aria-checked=true]) { border-color: #61616a; color: #fff; }
.am-editor .am-export-status { margin: 16px 0 0; color: #ff608a; font-size: 11px; line-height: 1.7; }
.am-editor .am-export-submit { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 50px; margin-top: 26px; padding: 12px 20px; border: 0; border-radius: 10px; background: #7b75ff; color: #fff; font: inherit; font-size: 14px; font-weight: 500; cursor: pointer; }
.am-editor .am-export-submit svg { width: 20px; height: 20px; }
.am-editor .am-export-submit:hover:not(:disabled) { background: #8b85ff; }
.am-editor .am-export-submit[aria-busy=true] svg { display: none; }
.am-editor .am-export-submit[aria-busy=true] { font-variant-numeric: tabular-nums; }
.am-editor .am-export-dialog button:focus-visible { outline: 2px solid #b9b5ff; outline-offset: 3px; }
#amPlay svg { width: 20px; height: 20px; }
#amPlay.is-playing .trimmer-editor__play-icon { display: none; }
#amPlay.is-playing .trimmer-editor__pause-icon { display: block; }
.am-track { position: relative; height: 90px; margin: 20px 0 0; }
.am-clip { position: absolute; top: 0; height: 60px; min-width: 6px; border: 2px solid #ffdc49; border-radius: 6px; overflow: hidden; background: #242424; cursor: grab; touch-action: none; }
.am-clip.is-active { border-color: #fff0a5; box-shadow: 0 0 0 1px #ffdc49; }
.am-clip canvas { position: absolute; top: 0; display: block; height: 56px; pointer-events: none; }
.am-clip-name { position: absolute; top: 0; left: 0; max-width: 100%; padding: 2px 6px; background: #0008; color: #eee; font-size: 10px; pointer-events: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-timeline-add { position: absolute; top: 0; height: 60px; display: grid; place-items: center; padding: 7px; border: 0; border-radius: 8px; background: #292929; color: #777; cursor: pointer; }
.am-timeline-add svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.am-timeline-add:hover { background: #343434; color: #fff; }
.am-editor.is-busy .am-track, .am-editor.is-busy #amCards { pointer-events: none; opacity: .6; }
.am-editor button:disabled { cursor: default; }
@media(max-width:1100px) { .am-panel .trimmer-editor__controls { grid-template-areas: "history zoom" "transport transport"; grid-template-columns: minmax(0,1fr) auto; gap: 4px; padding: 8px 0; } .am-panel .trimmer-editor__transport { justify-content: center; } }
@media(max-width:700px) { .am-sidebar-scroll { max-height: 240px; margin-top: 10px; } .am-card { padding: 14px; margin-bottom: 10px; } }
@media(max-width:700px), (max-height:540px) { .am-preview { padding: 0; } }
@media(max-width:560px) { .am-volume { right: 8px; bottom: 8px; } }
@media(max-width:560px) { .am-panel .trimmer-editor__controls { grid-template-areas: "history" "transport" "zoom"; grid-template-columns: minmax(0,1fr); } .am-panel .trimmer-editor__history, .am-panel .trimmer-editor__zoom { justify-content: center; margin: 0; } }