.lab-button {
  min-height: 42px; padding: 5px 6px; border: 1px solid #cbd3e0; border-radius: 3px;
  background: white; color: #28447a; font-size: 12px; font-weight: 600;
}
.lab-button:hover:not(:disabled) { background: #edf3ff; }
.lab-button[data-held] { background: #e8f0ff; border-color: var(--blue); color: var(--blue-dark); }
.lab-button:disabled { color: #646e7d; background: #f2f3f5; }
.lab-actions { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.lab-actions > * { flex: 1; }
.lab-instruction { margin: 9px 0 0; color: var(--muted); font-size: 12px; }
.hold-meter { display: block; width: 100%; height: 10px; accent-color: var(--blue); }

.slot-machine { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 11px; }
.slot-reel { display: grid; gap: 5px; min-width: 0; }
.slot-digit {
  display: grid; place-items: center; min-height: 57px; border: 1px solid #cbd3e0; border-radius: 3px;
  background: linear-gradient(#ebeff5, #fff 28%, #fff 72%, #ebeff5); font: 700 29px/1 monospace;
}
.slot-reel[data-stopped] .slot-digit { background: #eaf0fd; border-color: #91ace5; }
.slot-sample { text-align: center; padding: 9px; background: #f3f4f7; border: 1px solid #e3e6eb; font: 700 23px/1 monospace; letter-spacing: .25em; }

.hold-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 0 11px; }
.hold-control { min-height: 63px; touch-action: none; user-select: none; }
.hold-control span { display: block; margin-top: 3px; font-size: 10px; font-weight: 400; }
.hold-timing { display: grid; gap: 5px; }
.hold-timing label { font-size: 12px; color: var(--muted); }
.hold-timing .hold-meter { margin-top: 5px; }

.flight-field {
  position: relative;
  aspect-ratio: 320 / 208;
  overflow: hidden;
  border: 1px solid #cdd7e7;
  border-radius: 3px;
  background: radial-gradient(#c5d2e7 1px, #f5f8fd 1px) 0 0 / 13px 13px;
  touch-action: none;
  user-select: none;
}
.flight-tile { position: absolute; box-shadow: 0 0 0 1px #7386a5; background: #eaf0fc; }
.flight-tile img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.flight-tile[data-aimed] { outline: 2px solid #2454c4; outline-offset: 1px; }
.flight-tile[data-selected] img { transform: scale(.83); }
.flight-tile[data-selected]::after {
  content: '✓';
  position: absolute;
  top: 0;
  left: 0;
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border: 1px solid white;
  border-radius: 50%;
  background: var(--blue);
  color: white;
  font-size: 12px;
  font-weight: 700;
}
.flight-field canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.flight-handle {
  position: absolute;
  width: 44px;
  height: 44px;
  transform: translate(-50%, -50%);
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: grab;
}
.flight-handle:active { cursor: grabbing; }
.flight-handle:focus-visible { outline-offset: -3px; }
.flight-controls { display: flex; gap: 5px; justify-content: center; margin-top: 8px; }
.flight-controls .lab-button { min-width: 39px; }
.flight-controls .flight-launch { min-width: 64px; }

.pedestrian-grid {
  width: min(100%, 320px);
  margin: 8px auto;
  transition: rotate 230ms ease;
}

.linked-row { display: grid; gap: 9px; padding: 8px 0; }
.linked-row + .linked-row { border-top: 1px solid #dce4f0; }
.linked-readout { display: grid; grid-template-columns: 53px minmax(0, 1fr); align-items: center; gap: 10px; }
.linked-label { font-size: 12px; font-weight: 700; }
.linked-track { position: relative; height: 22px; margin-inline: 7px; background: linear-gradient(#bac7da, #bac7da) center / 100% 3px no-repeat; }
.linked-mark, .linked-position { position: absolute; transform: translateX(-50%); }
.linked-mark { top: 3px; width: 2px; height: 16px; background: #52647d; }
.linked-position { top: 6px; left: var(--linked-position); width: 10px; height: 10px; border-radius: 50%; background: var(--blue); }
.linked-row[data-aligned] .linked-position { background: var(--green); }
.linked-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.linked-lever {
  position: relative; display: flex; justify-content: space-between; align-items: center; min-height: 42px; padding: 0 10px;
  border: 1px solid #cbd6e7; border-radius: 3px; background: #f5f8fd; color: #3e577c;
  cursor: ew-resize; touch-action: none; user-select: none;
}
.linked-lever i {
  position: absolute; left: var(--linked-drive, 50%); transform: translateX(-50%); display: grid; place-items: center;
  width: 34px; height: 27px; border: 1px solid #8aa6d7; border-radius: 3px; background: #e6efff; font-size: 15px; font-style: normal;
}
.linked-lever[aria-disabled="true"] { opacity: .65; cursor: default; }
.linked-lock { width: 62px; }
.linked-lock[aria-pressed="true"] { color: #254585; background: #e8f0ff; border-color: #8fa9d8; }

.tone-waveforms { display: grid; gap: 8px; }
.tone-waveform {
  display: block; width: 100%; height: auto; border: 1px solid #ccd6e4; border-radius: 4px;
  background: linear-gradient(#dce5f3 1px, transparent 1px) 0 0 / 20px 20px,
    linear-gradient(90deg, #dce5f3 1px, #f5f8fd 1px) 0 0 / 20px 20px;
}
.tone-actions { display: flex; gap: 19px; justify-content: center; align-items: center; margin-top: 14px; }
.tone-dial { position: relative; width: 74px; aspect-ratio: 1; border: 2px solid #a6bad8; border-radius: 50%; background: radial-gradient(circle, white 0 54%, #eaf0fb 56%); cursor: ew-resize; touch-action: none; }
.tone-dial span { position: absolute; inset: 9px; border-radius: 50%; rotate: var(--tone-angle, 0deg); pointer-events: none; }
.tone-dial span::after { content: ''; position: absolute; top: 3px; left: calc(50% - 2px); width: 4px; height: 13px; border-radius: 2px; background: var(--blue); }
.tone-sound { min-width: 86px; }