/* Live12.3 channel hierarchy, using the existing controls and event targets.
   Keep this sheet after the shared layout styles. No visual-only controls. */
body .studio .timeline-track-row>.timeline-label,
body .studio .timeline-return-row>.timeline-label {
  --channel-control-height:12px;
  --channel-control-gap:2px;
  --channel-meter-width:6px;
  --channel-icon-width:16px;
  font-family:var(--live-font,'LiveSans',Arial,sans-serif);
  font-size:8px;
}
body .studio .timeline-track-row>.timeline-label {
  grid-template-columns:var(--arrangement-name-width) var(--arrangement-routing-width) minmax(0,1fr) 8px;
  align-items:stretch;
}
body .studio .timeline-track-row .timeline-track-controls {
  gap:var(--channel-control-gap);
  padding:2px 1px;
  align-content:start;
}
body .studio .timeline-track-row .timeline-track-compact {
  grid-template-columns:minmax(24px,1fr) var(--channel-icon-width) var(--channel-icon-width);
  grid-auto-rows:var(--channel-control-height);
  align-items:start;
  gap:var(--channel-control-gap);
}
body .studio .timeline-label .timeline-track-compact>button,
body .studio .timeline-label .timeline-return-controls>button,
body .studio .timeline-label .timeline-return-controls>select {
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  width:100%;
  min-width:0!important;
  height:var(--channel-control-height);
  min-height:0;
  max-height:var(--channel-control-height);
  margin:0;
  padding:0 1px;
  border:1px solid var(--live-frame);
  border-radius:0;
  font:inherit;
  line-height:10px;
}
/* aria-pressed describes Mute, so the numbered activator uses its inverse. */
body .studio .timeline-label button[data-live-mute][aria-pressed=false],
body .studio .track-buttons button[data-mute][aria-pressed=false] {
  background:var(--live-accent);
  color:var(--live-on-text);
}
body .studio .timeline-label button[data-live-mute][aria-pressed=true],
body .studio .track-buttons button[data-mute][aria-pressed=true] {
  background:var(--live-field);
  color:var(--live-muted);
}
body .studio .timeline-label button[data-live-solo][aria-pressed=false],
body .studio .track-buttons button[data-solo][aria-pressed=false] {
  background:var(--live-field);
  color:var(--live-text);
}
body .studio .timeline-label button[data-live-solo][aria-pressed=true],
body .studio .track-buttons button[data-solo][aria-pressed=true] {
  background:var(--live-solo);
  color:var(--live-on-text);
}
body .studio .timeline-label .timeline-track-compact>.track-record-arm {
  font-size:0;
  color:var(--live-muted);
  background:var(--live-field);
  align-self:start;
  height:var(--channel-control-height);
  min-height:0;
  max-height:var(--channel-control-height);
}
body .studio .timeline-label .timeline-track-compact>.track-record-arm::before {
  content:'';
  display:block;
  flex:0 0 5px;
  width:5px;
  height:5px;
  background:currentColor;
  border-radius:50%;
}
body .studio .timeline-mixer-values,
body .studio .timeline-send-controls {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-auto-rows:var(--channel-control-height);
  align-items:start;
  gap:var(--channel-control-gap);
  min-width:0;
}
body .studio .timeline-label .timeline-control-row {
  box-sizing:border-box;
  min-width:0;
  min-height:0;
  height:var(--channel-control-height);
  margin:0;
  padding:0;
}
body .studio .timeline-label [data-mixer-number] {
  display:block;
  box-sizing:border-box;
  width:100%;
  min-width:0;
  max-width:100%;
  height:var(--channel-control-height);
  min-height:0;
  margin:0;
  padding:0 1px;
  font:inherit;
  font-variant-numeric:tabular-nums;
  line-height:10px;
  text-align:center;
  border:1px solid var(--live-frame);
  border-radius:0;
}
body .studio .timeline-label .timeline-send-control>[data-mixer-number] {padding-left:8px}
body .studio .timeline-label .timeline-send-control>span {line-height:10px;top:1px}
body .studio .timeline-label [data-mixer-number]>.mixer-number-editor {
  min-height:0;
  padding:0 1px;
  font:inherit;
  line-height:10px;
}
body .studio .timeline-label>.timeline-signal {
  box-sizing:border-box;
  width:var(--channel-meter-width);
  min-width:var(--channel-meter-width);
  margin:1px 0;
}
/* Returns keep the routing column aligned with the regular track inputs. */
body .studio .timeline-return-row .timeline-return-controls,
body .studio .timeline-return-row.is-collapsed .timeline-return-controls {
  display:grid;
  grid-template-columns:var(--arrangement-routing-width) minmax(20px,1fr) 16px 25px;
  grid-auto-rows:var(--channel-control-height);
  gap:var(--channel-control-gap);
  align-content:start;
  align-items:start;
  padding:1px;
}
body .studio .timeline-return-row .timeline-return-controls>[data-live-mute],
body .studio .timeline-return-row.is-collapsed .timeline-return-controls>[data-live-mute] {grid-column:2;grid-row:1}
body .studio .timeline-return-row .timeline-return-controls>[data-live-solo],
body .studio .timeline-return-row.is-collapsed .timeline-return-controls>[data-live-solo] {grid-column:3;grid-row:1}
body .studio .timeline-return-row .timeline-return-controls>select,
body .studio .timeline-return-row.is-collapsed .timeline-return-controls>select {grid-column:4;grid-row:1;text-align:center}
body .studio .timeline-return-row .timeline-return-controls>[data-mixer-number=volume] {grid-column:2;grid-row:2}
body .studio .timeline-return-row .timeline-return-controls>[data-mixer-number=pan] {grid-column:3 / 5;grid-row:2}
body .studio .timeline-return-row .timeline-return-controls>.timeline-return-route {
  grid-column:1;
  grid-row:1;
  display:block;
  height:var(--channel-control-height);
  min-width:0;
  padding:0 2px;
  border:1px solid var(--live-frame);
  box-sizing:border-box;
  font:inherit;
  line-height:10px;
}
body .studio .timeline-main-row .timeline-return-controls>[data-mixer-number=volume] {grid-column:2 / 5;grid-row:1}
body .studio .track-buttons {gap:2px;align-items:center}
body .studio .track-buttons>button {display:flex;align-items:center;justify-content:center;min-width:0;border-radius:0;line-height:1}
@media(max-width:760px) {
  body .studio .timeline-track-row>.timeline-label,
  body .studio .timeline-return-row>.timeline-label {font-size:8px}
}