.live-lab {
  --daw-browser: 220px;
  --daw-inspector: 300px;
}

.live-lab .ll-toolbar {
  position: sticky;
  top: 0;
  z-index: 80;
  backdrop-filter: blur(18px);
  background: rgba(5, 10, 27, .94);
  box-shadow: 0 8px 28px rgba(0, 0, 0, .32);
}

.ll-experience {
  display: flex;
  gap: 4px;
  margin-left: auto;
  padding: 3px;
  border: 1px solid rgba(91, 221, 203, .25);
  border-radius: 8px;
}

.ll-experience .active {
  color: #041317;
  background: #55ddcb;
}

.live-lab .ll-workspace {
  display: grid;
  grid-template-columns: var(--daw-browser) minmax(0, 1fr) var(--daw-inspector);
  align-items: stretch;
  gap: 0;
}

.live-lab .ll-main,
.live-lab .ll-side {
  min-width: 0;
}

.ll-daw-browser {
  position: relative;
  top: auto;
  height: 100%;
  max-height: none;
  overflow: auto;
  padding: 10px;
  border: 1px solid rgba(79, 114, 180, .3);
  border-radius: 10px;
  background: #080e20;
}

.ll-browser-head,
.ll-browser-search {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 9px;
}

.ll-browser-head {
  justify-content: space-between;
  color: #55ddcb;
}

.ll-browser-search input {
  min-width: 0;
  width: 100%;
}

.ll-daw-browser nav {
  display: grid;
  gap: 5px;
}

.ll-daw-browser nav button,
.ll-bottom-nav button {
  padding: 9px 10px;
  color: #c6d1ec;
  text-align: left;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  cursor: pointer;
}

.ll-daw-browser nav button:hover,
.ll-bottom-nav button:hover,
.ll-bottom-nav button.active {
  color: #fff;
  border-color: rgba(85, 221, 203, .35);
  background: rgba(85, 221, 203, .1);
}

.ll-daw-browser p {
  margin: 14px 2px 2px;
  color: #77839f;
  font-size: 11px;
  line-height: 1.45;
}

.live-lab .ll-side {
  position: relative;
  top: auto;
  height: 100%;
  max-height: none;
  overflow: auto;
}

.live-lab .ll-central-timeline {
  position: relative;
  top: auto;
  z-index: 45;
  min-height: 0;
  box-shadow: 0 12px 36px rgba(0, 0, 0, .32);
}

.live-lab .ll-arrangement-shell {
  min-height: 0;
  max-height: none;
  overflow: auto;
}

.ll-bottom-nav {
  position: relative;
  bottom: auto;
  z-index: 44;
  display: flex;
  gap: 4px;
  padding: 5px;
  border: 1px solid rgba(79, 114, 180, .3);
  background: rgba(7, 13, 29, .96);
  backdrop-filter: blur(16px);
}

.ll-bottom-nav button {
  flex: 1;
  text-align: center;
}

.live-lab .ll-clip {
  cursor: grab;
}

.live-lab .ll-clip:active {
  cursor: grabbing;
}

.live-lab .ll-clip-handle {
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 6;
  width: 8px;
  border: 0;
  background: rgba(255, 255, 255, .5);
  cursor: ew-resize;
  opacity: 0;
}

.live-lab .ll-clip:hover .ll-clip-handle,
.live-lab .ll-clip.selected .ll-clip-handle {
  opacity: 1;
}

.live-lab .ll-clip-handle.in {
  left: 0;
}

.live-lab .ll-clip-handle.out {
  right: 0;
}

.live-lab .ll-attention {
  animation: ll-attention .85s ease;
}

@keyframes ll-attention {
  50% { box-shadow: 0 0 0 2px #55ddcb, 0 0 36px rgba(85, 221, 203, .35); }
}

.live-lab[data-experience="focus"] .ll-main > .ll-panel {
  display: none !important;
}

.live-lab[data-experience="focus"] main.ll-main > .ll-panel.ll-central-timeline,
.live-lab[data-experience="focus"] main.ll-main > .ll-panel.ll-song-builder,
.live-lab[data-experience="focus"] main.ll-main > .ll-panel.ll-bottom-zone {
  display: block !important;
}

.live-lab[data-experience="focus"] .ll-side > .ll-panel {
  display: none;
}

.live-lab[data-experience="focus"] .ll-side > .ll-panel:has(#ll-inspector),
.live-lab[data-experience="focus"] .ll-side > .ll-panel:has(#ll-state) {
  display: block;
}

.live-lab.ll-browser-collapsed {
  --daw-browser: 46px;
}

.live-lab.ll-browser-collapsed .ll-daw-browser nav,
.live-lab.ll-browser-collapsed .ll-browser-search,
.live-lab.ll-browser-collapsed .ll-daw-browser p,
.live-lab.ll-browser-collapsed .ll-browser-head b {
  display: none;
}

@media (max-width: 1100px) {
  .live-lab {
    --daw-browser: 0px;
    --daw-inspector: 250px;
  }
  .ll-daw-browser {
    display: none;
  }
}

@media (max-width: 780px) {
  .live-lab .ll-workspace {
    display: block;
  }
  .live-lab .ll-side,
  .live-lab .ll-central-timeline {
    position: relative;
    top: auto;
    max-height: none;
  }
}
/* Editable Vigthoria Audio Sync event review */
.sound-event-editor{margin-top:14px;border-top:1px solid rgba(148,163,184,.18);padding-top:10px}
.sound-event-editor summary{cursor:pointer;color:#cbd5e1;font-weight:700}
.sound-event-row{display:grid;grid-template-columns:minmax(120px,.65fr) minmax(220px,2fr) auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(148,163,184,.12)}
.sound-event-row>div{display:flex;flex-direction:column;gap:2px}
.sound-event-row>div span{font-size:11px;color:#94a3b8}
.sound-event-row.needs-review{border-left:2px solid #f59e0b;padding-left:9px}
.sound-event-enable{display:flex;gap:5px;align-items:center;color:#cbd5e1;font-size:12px}
@media(max-width:900px){.sound-event-row{grid-template-columns:1fr}.sound-event-enable{justify-self:start}}
.video-score-preview{position:relative;margin:10px 0;border:1px solid rgba(45,212,191,.35);border-radius:14px;overflow:hidden;background:#050914;aspect-ratio:16/9}
.video-score-preview[hidden]{display:none}
.video-score-preview video{display:block;width:100%;height:100%;object-fit:contain;background:#050914}
.video-score-preview span{position:absolute;left:10px;bottom:10px;padding:5px 9px;border-radius:999px;background:rgba(2,6,23,.82);color:#dbeafe;font-size:11px;backdrop-filter:blur(8px)}
.sound-analysis-visual{display:flex;min-height:190px;flex-direction:column;align-items:center;justify-content:center;gap:9px;border:1px solid rgba(99,102,241,.32);border-radius:14px;background:radial-gradient(circle at 50% 45%,rgba(45,212,191,.12),transparent 52%),#080c18;text-align:center}
.sound-analysis-visual[hidden]{display:none}
.sound-analysis-visual strong{color:#eef2ff;font-size:15px}
.sound-analysis-visual span{color:#94a3b8;font-size:12px}
.sound-analysis-orbit{position:relative;width:76px;height:76px}
.sound-analysis-orbit i{position:absolute;inset:0;border:2px solid transparent;border-top-color:#2dd4bf;border-radius:50%;animation:scoreOrbit 1.35s linear infinite}
.sound-analysis-orbit i:nth-child(2){inset:9px;border-top-color:#818cf8;animation-duration:1s;animation-direction:reverse}
.sound-analysis-orbit i:nth-child(3){inset:20px;border-top-color:#c084fc;animation-duration:.72s}
@keyframes scoreOrbit{to{transform:rotate(360deg)}}
