.studio-page {
  --studio-rule: #c6c5b9;
}
.studio-page .skip-link {
  position: absolute;
  left: 16px;
  top: -80px;
  padding: 14px;
  background: var(--ink);
  color: var(--paper);
  z-index: 10;
}
.studio-page .skip-link:focus {
  top: 12px;
}
.studio-header {
  max-width: 1440px;
  margin: auto;
  padding: 28px 40px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
}
.studio-header span {
  color: var(--muted);
  font-weight: 400;
}
.studio-header > a:last-child {
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
}
.studio-page main {
  max-width: 1440px;
  padding: 0 40px;
  margin: auto;
}
.studio-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 48px;
  padding: 58px 0 42px;
}
.studio-intro h1 {
  font-size: clamp(42px, 5.5vw, 76px);
  letter-spacing: -0.055em;
  line-height: 0.97;
  font-weight: 500;
  margin: 0;
}
.studio-intro h1 em {
  font-family: InstrumentSerif, Georgia, serif;
  font-weight: 400;
  color: var(--copper);
}
.studio-intro > p {
  width: 340px;
  line-height: 1.7;
  font-size: 14px;
  margin: 0 0 3px;
  color: var(--muted);
}
.studio-page .eyebrow {
  font: 10px/1.4 var(--mono);
  letter-spacing: 0.13em;
  margin-bottom: 15px;
}
.studio-page button,
.studio-page input {
  touch-action: manipulation;
}
.studio-page button {
  border: 1px solid var(--studio-rule);
  background: transparent;
  color: var(--ink);
  border-radius: 3px;
  min-height: 36px;
}
.studio-page button:hover {
  background: #deded1;
}
.studio-page button:focus-visible,
.studio-page a:focus-visible,
.studio-page input:focus-visible,
.studio-page summary:focus-visible {
  outline: 2px solid var(--copper);
  outline-offset: 4px;
}
.studio-page button[aria-pressed="true"] {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}
.session-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--ink);
}
.session-tabs button {
  border: 1px solid transparent;
  border-radius: 0;
  padding: 19px 24px;
  flex: 1;
  display: flex;
  gap: 18px;
  align-items: center;
  text-align: left;
}
.session-tabs span {
  font: 11px var(--mono);
  opacity: 0.65;
}
.session-tabs strong {
  font-size: 17px;
  font-weight: 500;
  letter-spacing: -0.02em;
}
.session-tabs small {
  margin-left: auto;
  font: 11px var(--mono);
  opacity: 0.7;
}
.session-tabs button[aria-pressed="true"] {
  background: #d9ddcb;
  color: var(--ink);
  border: 1px solid var(--ink);
  border-bottom: 0;
}
.console {
  border: 1px solid var(--studio-rule);
  border-top: 0;
  background: #f5f2eb;
}
.transport {
  display: flex;
  align-items: center;
  gap: 28px;
  padding: 22px 24px 14px;
  position: sticky;
  top: 0;
  z-index: 3;
  background: #f5f2eb;
  border-bottom: 1px solid #c6c5b966;
}
.transport-buttons {
  display: flex;
  gap: 6px;
}
.transport button {
  padding: 9px 16px;
}
.transport .play-button {
  background: var(--ink);
  color: var(--paper);
  border-color: var(--ink);
  min-width: 160px;
}
.time-display {
  font: 12px var(--mono);
  color: var(--muted);
  white-space: nowrap;
}
.time-display output {
  color: var(--ink);
  font-size: 24px;
  letter-spacing: -0.04em;
}
.master-label {
  margin-left: auto;
  display: grid;
  grid-template-columns: auto 100px 58px;
  align-items: center;
  gap: 12px;
  font: 11px var(--mono);
}
.studio-page input[type="range"] {
  width: 100%;
  height: 24px;
  margin: 0;
  accent-color: var(--copper);
  cursor: pointer;
}
.master-label output {
  text-align: right;
}
.status-bar {
  padding: 0 24px 18px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--line);
  font: 10px/1.5 var(--mono);
  color: var(--muted);
}
.status-bar p {
  margin: 0;
}
.status-bar .error {
  color: #972c22;
}
.audition-bar {
  padding: 16px 24px;
  display: flex;
  align-items: center;
  gap: 18px;
  border-bottom: 1px solid var(--line);
}
.audition-bar > span,
.markers > span {
  font: 9px var(--mono);
  letter-spacing: 0.07em;
  color: var(--muted);
  white-space: nowrap;
}
.audition-bar > div {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.audition-bar button {
  font-size: 11px;
  padding: 7px 12px;
  min-height: 34px;
}
.audition-bar #reset-mix {
  margin-left: auto;
  border: 0;
  white-space: nowrap;
}
.rig-comparison {
  padding: 24px;
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 32px;
  align-items: center;
  border-bottom: 1px solid var(--line);
}
.rig-comparison p {
  font-size: 13px;
  margin: 8px 0 0;
  line-height: 1.55;
}
.rig-comparison p span {
  color: var(--muted);
  font-size: 11px;
}
.rig-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
#rig-status {
  display: block;
  color: var(--muted);
  font: 10px var(--mono);
  margin-top: 12px;
}
.channel-preset {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px 28px;
  padding: 18px 24px 24px;
}
.channel-preset label {
  display: grid;
  gap: 8px;
  font: 10px var(--mono);
}
.channel-preset select {
  font:
    13px InstrumentSans,
    sans-serif;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 2px;
  padding: 10px 32px 10px 12px;
  min-height: 44px;
}
.channel-preset p {
  margin: 0;
  font-size: 13px;
}
.channel-preset p span {
  display: block;
  color: #b7bea6;
  font: 11px var(--mono);
  margin-top: 8px;
  overflow-wrap: anywhere;
}
.rig-switch button {
  display: flex;
  padding: 13px 15px;
  align-items: center;
  gap: 15px;
  text-align: left;
  min-height: 66px;
}
.rig-switch b {
  font:
    22px InstrumentSerif,
    Georgia,
    serif;
  font-style: italic;
}
.rig-switch span {
  font-size: 13px;
  font-weight: 500;
}
.rig-switch small {
  display: block;
  font:
    10px/1.4 InstrumentSans,
    sans-serif;
  margin-top: 7px;
  opacity: 0.65;
}
.rig-switch button[aria-pressed="true"] {
  background: var(--copper);
  border-color: var(--copper);
}
.timeline-heading {
  display: grid;
  grid-template-columns: 215px minmax(100px, 1fr) 226px;
  padding: 15px 18px 10px 0;
  gap: 0;
  font: 8px var(--mono);
  letter-spacing: 0.08em;
  color: var(--muted);
}
.timeline-heading > span:first-child {
  padding-left: 24px;
}
.timeline-heading > span:last-child {
  text-align: right;
}
.ruler {
  display: flex;
  justify-content: space-between;
}
.stem-row {
  display: grid;
  grid-template-columns: 215px minmax(100px, 1fr) 226px;
  min-height: 67px;
  border-top: 1px solid #d6d6ca;
  position: relative;
}
.stem-row:last-child {
  border-bottom: 1px solid #d6d6ca;
}
.stem-row.selected {
  background: #e6e8da;
}
.stem-row.selected::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--copper);
}
.stem-row .stem-name {
  display: flex;
  border: 0;
  border-radius: 0;
  padding: 12px 10px 12px 20px;
  gap: 15px;
  align-items: center;
  text-align: left;
  background: transparent;
  color: var(--ink);
}
.stem-name strong {
  display: block;
  font-size: 12px;
  font-weight: 500;
}
.stem-name small {
  display: block;
  font: 8px var(--mono);
  letter-spacing: 0.055em;
  color: var(--muted);
  margin-top: 6px;
}
.studio-page .stem-name[aria-pressed="true"] small,
.studio-page .stem-name[aria-pressed="true"] .track-number {
  color: #bec5b1;
}
.track-number {
  font: 9px var(--mono);
  color: var(--muted);
}
.stem-lane {
  position: relative;
  display: flex;
  align-items: center;
  cursor: crosshair;
  overflow: hidden;
  border-inline: 1px solid #d6d6ca;
  background: repeating-linear-gradient(
    to right,
    transparent 0,
    transparent calc(25% - 1px),
    #d6d6ca calc(25% - 1px),
    #d6d6ca 25%
  );
}
.stem-lane svg {
  width: 100%;
  height: 48px;
  max-width: none;
  fill: #8e9677;
  opacity: 0.85;
  pointer-events: none;
}
.stem-row[data-track="guitars"] .stem-lane svg {
  fill: #a75b3e;
}
.stem-row[data-track="midi"] .stem-lane svg {
  fill: #b19758;
}
.stem-row[data-track="bass"] .stem-lane svg {
  fill: #647e83;
}
.stem-row[data-track="leads"] .stem-lane svg,
.stem-row[data-track="clean"] .stem-lane svg {
  fill: #897c6a;
}
.stem-row.inaudible .stem-lane svg {
  opacity: 0.18;
}
.lane-playhead {
  position: absolute;
  inset: 0 auto 0 0;
  width: 1px;
  background: #4b281b;
  pointer-events: none;
}
.stem-controls {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 10px 12px;
}
.stem-controls > button {
  min-width: 30px;
  min-height: 30px;
  padding: 4px;
  font: 10px var(--mono);
}
.stem-controls [data-solo][aria-pressed="true"] {
  background: #b59640;
  border-color: #b59640;
  color: #201e14;
}
.stem-controls [data-mute][aria-pressed="true"] {
  background: #975543;
  border-color: #975543;
}
.fader {
  flex: 1;
  min-width: 60px;
  padding: 0 5px;
  display: grid;
}
.fader output {
  font: 8px var(--mono);
  text-align: center;
  color: var(--muted);
}
.track-meter {
  width: 4px;
  height: 32px;
  background: #dedfd3;
  display: flex;
  align-items: flex-end;
}
.track-meter i {
  display: block;
  background: #65805e;
  width: 100%;
  height: 0;
}
.seek-row {
  padding: 12px 24px;
  display: grid;
  grid-template-columns: 70px 1fr 42px;
  gap: 16px;
  align-items: center;
  font: 10px var(--mono);
}
.seek-row output {
  text-align: right;
}
.markers {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  padding: 0 24px 20px;
}
.markers button {
  padding: 5px 10px;
  font-size: 10px;
  min-height: 30px;
  border-color: transparent;
}
.markers small {
  font: 9px var(--mono);
  color: var(--muted);
  margin-left: 6px;
}
#inspector {
  margin: 0 16px 16px;
  background: #242923;
  color: #e4e6d8;
  border-radius: 5px;
  box-shadow:
    inset 0 1px 0 #53584b,
    0 2px 3px #1d241b20;
}
.inspector-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
  padding: 22px 28px 18px;
  border-bottom: 1px solid #4e5549;
}
.inspector-label .eyebrow {
  color: #b8c1a8;
  font-size: 8px;
  margin: 0 0 6px;
}
.inspector-label h2 {
  color: #eeeede;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -0.025em;
  margin: 0 0 6px;
}
.inspector-label p:last-child {
  font: 10px var(--mono);
  margin: 0;
  color: #acb59e;
}
.pan-control {
  width: 180px;
}
.pan-control label {
  display: flex;
  justify-content: space-between;
  font: 10px var(--mono);
}
.pan-control button {
  color: #b6bea9;
  border: 0;
  padding: 2px 0;
  min-height: 26px;
  font-size: 10px;
}
.pan-control button:hover {
  background: transparent;
  color: white;
}
.hardware-strip {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  padding: 20px 24px 12px;
}
.hardware-control {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 20px;
  gap: 7px;
  border-left: 1px solid #41483d;
}
.hardware-control:first-child {
  border: 0;
}
.knob-label {
  font-size: 11px;
  font-weight: 500;
}
.dial {
  height: 55px;
  width: 55px;
  margin: 5px 0;
  border: 1px solid #141913;
  border-radius: 50%;
  background: radial-gradient(
    circle at 43% 30%,
    #5b6254,
    #30372c 66%,
    #1c231a 68%
  );
  box-shadow:
    0 3px 4px #11160e,
    inset 0 1px 1px #88917d;
  position: relative;
  transform: rotate(var(--turn));
  cursor: ns-resize;
  touch-action: none;
}
.dial i {
  position: absolute;
  width: 2px;
  height: 13px;
  top: 4px;
  left: calc(50% - 1px);
  background: #c8d1b5;
}
.hardware-control input {
  max-width: 90px;
  accent-color: #c6cca7 !important;
}
.hardware-control output {
  font: 11px var(--mono);
  color: #e0e5cf;
}
.hardware-control small {
  font: 8px var(--mono);
  color: #aeb8a0;
  white-space: nowrap;
}
.strip-note {
  text-align: center;
  font: 9px/1.5 var(--mono);
  color: #a9b29c;
  margin: 0;
  padding: 8px 24px 20px;
}
.session-notes {
  margin: 28px 0 0;
  border-block: 1px solid var(--line);
  padding: 20px 0;
  font-size: 12px;
  color: var(--muted);
}
.session-notes summary {
  cursor: pointer;
  color: var(--ink);
}
#provenance {
  max-width: 850px;
  line-height: 1.8;
  padding-top: 20px;
}
#provenance a {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.studio-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 28px 0 40px;
  font-size: 12px;
  color: var(--muted);
  gap: 24px;
}
.studio-footer p {
  margin: 0;
}
.studio-page .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
@media (min-width: 1500px) {
  .studio-intro {
    padding-top: 70px;
  }
}
@media (max-width: 1000px) {
  .studio-header {
    padding: 22px 24px;
  }
  .studio-page main {
    padding: 0 24px;
  }
  .transport {
    gap: 16px;
  }
  .master-label {
    grid-template-columns: 80px 52px;
  }
  .master-label > input {
    grid-column: 1;
  }
  .master-label {
    font-size: 0;
  }
  .master-label output {
    font-size: 10px;
  }
  .audition-bar {
    gap: 10px;
    padding-inline: 16px;
  }
  .audition-bar > span {
    display: none;
  }
  .stem-row,
  .timeline-heading {
    grid-template-columns: 185px minmax(80px, 1fr) 210px;
  }
  .stem-name strong {
    font-size: 11px;
  }
  .stem-row .stem-name {
    padding-left: 14px;
    gap: 9px;
  }
  .rig-comparison {
    gap: 16px;
  }
  .rig-switch button {
    padding: 10px;
    gap: 8px;
  }
  .rig-switch span {
    font-size: 11px;
  }
  .rig-switch small {
    font-size: 9px;
  }
  .hardware-control {
    padding-inline: 12px;
  }
}
@media (max-width: 740px) {
  .studio-header {
    padding: 20px 16px;
    font-size: 10px;
  }
  .studio-header span {
    display: none;
  }
  .studio-header > a:last-child {
    font-size: 10px;
  }
  .studio-page main {
    padding: 0 12px;
  }
  .studio-intro {
    padding: 36px 8px 28px;
    gap: 22px;
    align-items: flex-start;
    flex-direction: column;
  }
  .studio-intro h1 br {
    display: none;
  }
  .studio-intro h1 {
    max-width: 400px;
    font-size: 48px;
  }
  .studio-intro > p {
    max-width: 440px;
    width: auto;
    font-size: 12px;
  }
  .studio-intro > p br {
    display: none;
  }
  .session-tabs button {
    padding: 14px 8px;
    gap: 7px;
    flex-wrap: wrap;
  }
  .session-tabs strong {
    font-size: 12px;
  }
  .session-tabs small {
    margin-left: 0;
    width: 100%;
    padding-left: 19px;
    font-size: 9px;
  }
  .session-tabs span {
    font-size: 9px;
  }
  .transport {
    gap: 12px;
    flex-wrap: wrap;
    padding: 16px 12px 12px;
    justify-content: space-between;
  }
  .transport-buttons {
    gap: 4px;
  }
  .transport button {
    padding: 8px 10px;
    min-height: 44px;
  }
  .transport .play-button {
    min-width: 133px;
    font-size: 12px;
  }
  .transport #loop {
    font-size: 11px;
  }
  .time-display {
    font-size: 9px;
  }
  .time-display output {
    font-size: 20px;
  }
  .master-label {
    width: 100%;
    margin: 0;
    font-size: 10px;
    grid-template-columns: auto 1fr 56px;
  }
  .master-label > input {
    grid-column: auto;
  }
  .status-bar {
    padding: 0 12px 12px;
    font-size: 9px;
  }
  .status-bar p:last-child {
    display: none;
  }
  .audition-bar {
    align-items: flex-start;
    padding: 12px;
    flex-wrap: wrap;
  }
  .audition-bar > div {
    flex: 1;
  }
  .audition-bar button {
    min-height: 38px;
    font-size: 10px;
    padding: 7px 9px;
  }
  .audition-bar #reset-mix {
    font-size: 10px;
    padding-inline: 0;
  }
  .rig-comparison {
    grid-template-columns: 1fr;
    padding: 18px 12px;
    gap: 12px;
  }
  .rig-comparison p br {
    display: none;
  }
  .rig-comparison p {
    font-size: 11px;
  }
  .rig-comparison p span {
    display: block;
    margin-top: 3px;
    font-size: 10px;
  }
  .rig-comparison .eyebrow {
    font-size: 9px;
  }
  .rig-switch button {
    min-height: 66px;
    padding: 12px;
  }
  .rig-switch span {
    font-size: 11px;
  }
  .rig-switch b {
    font-size: 24px;
  }
  .rig-switch small {
    font-size: 9px;
  }
  .timeline-heading {
    grid-template-columns: 150px 1fr;
    padding-right: 12px;
    font-size: 7px;
  }
  .timeline-heading > span:first-child {
    padding-left: 12px;
  }
  .timeline-heading > span:last-child {
    display: none;
  }
  .stem-row {
    grid-template-columns: 150px minmax(100px, 1fr);
    min-height: 92px;
    padding-right: 12px;
  }
  .stem-row .stem-name {
    grid-row: 1/3;
    padding-left: 12px;
    gap: 8px;
  }
  .stem-name small {
    font-size: 7px;
  }
  .stem-name strong {
    font-size: 11px;
  }
  .stem-lane {
    height: 48px;
    border-right: 0;
    margin-top: 6px;
  }
  .stem-lane svg {
    height: 40px;
  }
  .stem-controls {
    grid-column: 2;
    padding: 0 0 6px 4px;
  }
  .stem-controls > button {
    min-width: 40px;
    min-height: 44px;
  }
  .fader output {
    font-size: 7px;
  }
  .track-meter {
    height: 24px;
  }
  .seek-row {
    padding: 12px;
    grid-template-columns: 1fr 40px;
    gap: 8px;
  }
  .seek-row > label {
    display: none;
  }
  .markers {
    padding: 0 10px 14px;
    gap: 4px;
  }
  .markers > span {
    width: 100%;
    padding: 5px;
  }
  .markers button {
    min-height: 36px;
    padding: 5px 7px;
    font-size: 9px;
  }
  .markers small {
    font-size: 8px;
  }
  #inspector {
    margin: 0 8px 8px;
  }
  .inspector-label {
    padding: 20px 16px;
    gap: 18px;
  }
  .inspector-label h2 {
    font-size: 18px;
  }
  .inspector-label p:last-child {
    font-size: 8px;
    line-height: 1.6;
  }
  .pan-control {
    width: 100px;
    flex-shrink: 0;
  }
  .pan-control label {
    font-size: 8px;
  }
  .hardware-strip {
    grid-template-columns: repeat(3, 1fr);
    padding: 18px 8px 4px;
    row-gap: 22px;
  }
  .hardware-control {
    padding-inline: 8px;
  }
  .hardware-control:nth-child(4) {
    border: 0;
  }
  .dial {
    width: 51px;
    height: 51px;
  }
  .hardware-control input {
    max-width: 78px;
  }
  .hardware-control small {
    font-size: 7px;
  }
  .strip-note {
    padding: 14px 18px 20px;
    font-size: 8px;
  }
  .session-notes {
    margin: 22px 8px 0;
    font-size: 11px;
  }
  .studio-footer {
    padding: 24px 8px;
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    font-size: 10px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .studio-page {
    scroll-behavior: auto;
  }
  .studio-page * {
    transition: none !important;
  }
}

/* Selected take, native chain evidence and optional browser NAM. */
.session-chain{border-bottom:1px solid var(--studio-rule);padding:0 0 28px;margin-bottom:28px;min-width:0}
.chain-heading{display:flex;justify-content:space-between;align-items:start;gap:24px}.chain-heading h3{font-size:21px;margin:8px 0;max-width:620px}.chain-heading label{font-size:12px;min-width:180px}.chain-heading select{display:block;width:100%;max-width:340px;padding:9px;margin-top:8px;background:var(--paper);border:1px solid var(--studio-rule)}
.chain-provenance{font-size:12px;color:var(--muted);line-height:1.6}.chain-provenance a{text-decoration:underline}
.signal-chain{display:flex;gap:8px;align-items:center;overflow-x:auto;padding:12px 0 22px}.signal-block{background:#dcded2;border:1px solid #9b9f8c;padding:14px 16px;text-align:left;min-width:130px;border-radius:4px;min-height:82px}.signal-block strong{display:block;margin-top:12px;font-size:13px}.signal-block small{font:9px var(--mono);letter-spacing:.04em}.signal-amp{background:#363a31;color:#f0eee6;border-color:#363a31;min-width:180px}.signal-block[aria-pressed=true]{outline:2px solid var(--copper);outline-offset:2px}.signal-arrow{color:#838777}
.chain-device{background:#d3d5c8;border:1px solid #8c927d;border-radius:4px;padding:22px 28px}.amp-device{background:#30372d;color:#efeee3;border:8px solid #22271f;box-shadow:inset 0 1px #737762}.device-caption{display:flex;justify-content:space-between;gap:24px;align-items:center;border-bottom:1px solid #909580;padding-bottom:15px}.device-caption>span{font-family:InstrumentSerif,Georgia,serif;font-size:27px}.device-caption small{font:10px var(--mono);text-transform:uppercase;max-width:60%;line-height:1.6}.device-controls{display:flex;flex-wrap:wrap;gap:22px;padding:22px 0}.device-controls label{display:grid;justify-items:center;gap:10px;width:105px;text-transform:capitalize;font-size:12px}.device-controls input{width:100%;accent-color:var(--copper)}.device-controls output{font:11px var(--mono)}.device-controls input:disabled{opacity:.55}.chain-device>p{font-size:11px;opacity:.8;margin:0}.chain-edit-actions,.live-controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.chain-edit-actions button,.live-controls button,.live-disclosure>button{padding:9px 12px;border:1px solid #909580;border-radius:3px;background:var(--paper);color:var(--ink);font-size:12px}.live-controls [aria-pressed=true]{background:var(--ink);color:var(--paper)}.live-disclosure{margin-top:22px;font-size:13px;line-height:1.65}.live-disclosure summary{cursor:pointer;font-weight:600;min-height:30px}.live-disclosure p{max-width:850px}.model-file{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin:18px 0}.model-file input{max-width:100%;font:12px Instrument,sans-serif}.live-controls{margin-top:20px}.live-controls label{display:grid;gap:6px;min-width:150px}.live-controls output{font:11px var(--mono)}.session-chain button:focus-visible,.session-chain input:focus-visible,.session-chain select:focus-visible,.session-chain summary:focus-visible{outline:2px solid var(--copper);outline-offset:3px}.session-chain button:disabled{opacity:.45;cursor:default}
@media(max-width:700px){.chain-heading{display:block}.chain-heading label{display:block;margin-top:16px}.chain-heading select{max-width:100%}.chain-device{padding:16px}.device-caption{display:block}.device-caption small{display:block;max-width:100%;margin-top:10px}.device-controls{gap:16px}.device-controls label{width:calc(33.333% - 12px)}.live-controls label{min-width:120px}}
.session-chain{padding:28px;margin-bottom:0;scroll-margin-top:110px;border-bottom-color:#53584b;color:#e4e6d8}
.session-chain .eyebrow,.session-chain .chain-provenance{color:#c1c7b8}
.session-chain .chain-heading select{color:#242923}
.session-chain .signal-block{background:#dcded2;color:#242923;border-color:#9b9f8c}
.session-chain .signal-amp{background:#363d33;color:#f0eee6;border-color:#909b82}
.session-chain .signal-block[aria-pressed=true]{border-color:#d69970;outline-color:#d69970}
.session-chain .pedal-device{color:#242923}
.session-chain .chain-edit-actions button,.session-chain .live-controls button,.session-chain .live-disclosure>button{min-height:42px}
.session-chain .live-controls [aria-pressed=true]{color:#fff4e8;background:#934526;border-color:#d69970}
.session-chain .model-file input::file-selector-button{padding:9px 14px;margin-right:12px;background:#e4e6d8;color:#242923;border:1px solid #909b82;border-radius:3px;font:inherit}
@media(max-width:700px){.session-chain{padding:20px 16px}.session-chain .device-controls label{min-width:76px}.chain-heading h3{overflow-wrap:anywhere}}
/* Readable hardware labels and keyboard/touch targets at every inspector size. */
.session-chain .device-controls input,.session-chain .live-controls input{min-height:28px}
.session-chain .signal-chain{padding-inline:4px;scroll-padding-inline:4px}
.session-chain .chain-heading{min-width:0}.session-chain .chain-heading>div{min-width:0}
.session-chain .device-caption small{overflow-wrap:anywhere}.session-chain .live-controls label{flex:1 1 150px;max-width:280px}
.session-chain :focus-visible{outline-color:#e6b48c}
@media(max-width:700px){.session-chain .live-controls button{flex:1 1 auto;min-height:44px}.session-chain .device-controls{column-gap:14px}.session-chain .device-controls label{font-size:11px}.session-chain .device-caption>span{font-size:24px}}