.lab-page{padding:16px 16px 0}.lab{--void:#030817;--glass:#050b1a;--panel:#071326;--raised:#142238;--line:#1c2c47;--line-soft:#142238;--line-strong:#4a5d7c;--cell:color-mix(in srgb, var(--raised) 40%, var(--panel));--cell-beat:color-mix(in srgb, var(--raised) 75%, var(--panel));--meta:#6b7f9e;--muted:#94a7c3;--ink:#f1f5ff;--green:#00f5a0;--green-bright:#66ffc6;--green-rgb:0 245 160;--head-w:240px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;border:1px solid var(--line);background:var(--void);color:var(--ink);border-radius:4px;font-size:.8125rem;line-height:1.4}.lab button{font:inherit;cursor:pointer}.lab button:disabled{opacity:.45;cursor:not-allowed}.lab-label{color:var(--meta);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;font-size:.6875rem}.lab-icon{flex:none;width:16px;height:16px}.lab-icon--small{width:14px;height:14px}.lab-icon--play{fill:currentColor;width:18px;height:18px}.lab-transport{border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:10px 12px;min-height:60px;padding:8px 16px;display:flex}.lab-brand{letter-spacing:.18em;white-space:nowrap;margin:0;font-size:.875rem;font-weight:700}.lab-brand__prefix{color:var(--green)}.lab-transport__main,.lab-transport__side,.lab-transport__group{flex-wrap:wrap;align-items:center;gap:6px;min-width:0;display:flex}.lab-transport__side{margin-left:auto}.lab-transport__side .lab-btn{padding:0 10px}.lab-play{background:var(--green);width:44px;height:44px;color:var(--void);border:0;border-radius:0;flex:none;place-items:center;transition:background-color .12s ease-out;display:grid}.lab-play:hover{background:var(--green-bright)}.lab-field{border:1px solid var(--line);background:var(--void);border-radius:2px;align-items:center;gap:6px;height:36px;padding:0 8px;transition:border-color .12s ease-out;display:inline-flex}.lab-field:hover{border-color:var(--line-strong)}.lab-field:has(:focus-visible){outline:2px solid var(--green);outline-offset:2px}.lab-field__label{color:var(--meta);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;cursor:pointer;font-size:.6875rem}.lab-field__input{min-width:0;height:100%;color:var(--ink);font:inherit;font-variant-numeric:tabular-nums;background:0 0;border:0;padding:0;font-size:.75rem}.lab-field__input:focus-visible{outline:none}.lab-field__input option{background:var(--panel);color:var(--ink)}.lab-field__input--num{width:3.25rem}.lab-field__input--text{border:1px solid var(--line);background:var(--void);border-radius:2px;width:12rem;height:36px;padding:0 10px}.lab-field__input--text:focus-visible{outline:2px solid var(--green);outline-offset:2px}.lab-field__input--text::placeholder{color:var(--meta)}.lab-field__value{min-width:3ch;color:var(--ink);font-variant-numeric:tabular-nums;text-align:right;font-size:.75rem}.lab-range{cursor:pointer;appearance:none;background:0 0;width:56px;height:20px;margin:0}.lab-range:focus-visible{outline:2px solid var(--green);outline-offset:2px}.lab-field .lab-range:focus-visible{outline:none}.lab-range::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--range-fill,var(--ink)) var(--fill,0%), var(--line-strong) var(--fill,0%));height:2px}.lab-range::-webkit-slider-thumb{border:2px solid var(--range-fill,var(--ink));background:var(--void);appearance:none;border-radius:0;width:12px;height:12px;margin-top:-5px}.lab-range::-moz-range-track{background:var(--line-strong);height:2px}.lab-range::-moz-range-progress{background:var(--range-fill,var(--ink));height:2px}.lab-range::-moz-range-thumb{border:2px solid var(--range-fill,var(--ink));background:var(--void);border-radius:0;width:8px;height:8px}.lab-range--hue{--range-fill:var(--hue)}.lab-range--compact{width:72px;height:16px}.lab-btn{border:1px solid var(--line);background:var(--void);height:36px;color:var(--ink);white-space:nowrap;border-radius:2px;flex:none;justify-content:center;align-items:center;gap:6px;padding:0 12px;font-size:.75rem;transition:border-color .12s ease-out,background-color .12s ease-out,color .12s ease-out;display:inline-flex}.lab-btn:hover:not(:disabled){border-color:var(--line-strong)}.lab-btn--primary{border-color:var(--line-strong);background:var(--raised);color:var(--ink)}.lab-btn--primary:hover:not(:disabled){border-color:var(--muted)}.lab-btn--dashed{border-style:dashed;border-color:var(--line-strong);color:var(--muted)}.lab-btn--dashed:hover:not(:disabled){color:var(--ink)}.lab-btn--icon{width:36px;padding:0}.lab-btn--compact{height:28px;padding:0 8px}.lab-btn--icon.lab-btn--compact{width:28px;padding:0}.lab-btn[aria-expanded=true]{border-color:var(--line-strong);background:var(--raised)}.lab-seg{flex-wrap:wrap;display:inline-flex}.lab-seg__btn{border:1px solid var(--line);background:var(--void);height:32px;color:var(--muted);white-space:nowrap;margin-left:-1px;padding:0 12px;font-size:.75rem;position:relative}.lab-seg__btn:first-child{border-radius:2px 0 0 2px;margin-left:0}.lab-seg__btn:last-child{border-radius:0 2px 2px 0}.lab-seg__btn:hover:not(:disabled){z-index:1;border-color:var(--line-strong);color:var(--ink)}.lab-seg__btn[aria-pressed=true]{z-index:2;border-color:var(--line-strong);background:var(--raised);color:var(--ink)}.lab-drawer .lab-seg__btn[aria-pressed=true]{border-color:var(--hue);background:rgb(var(--hue-rgb) / .12);color:var(--ink)}.lab-seg__btn--square{width:32px;padding:0;font-weight:600}.lab-seg__btn:focus-visible{z-index:3}.lab-notice{border-bottom:1px solid var(--line);background:var(--glass);color:var(--muted);margin:0;padding:8px 16px;font-size:.75rem}.lab-status{color:var(--muted);font-size:.75rem}.lab-status:empty{display:none}.lab-confirm{flex-wrap:wrap;align-items:center;gap:8px;display:inline-flex}.lab-confirm[hidden]{display:none}.lab-confirm__text{font-size:.75rem}.lab-saveform{flex-wrap:wrap;align-items:center;gap:6px;display:inline-flex}.lab-saveform[hidden]{display:none}.lab-menu-root{position:relative}.lab-menu{z-index:30;border:1px solid var(--line);background:var(--panel);border-radius:4px;flex-direction:column;gap:4px;min-width:200px;max-width:calc(100vw - 32px);padding:8px;display:flex;position:absolute;top:calc(100% + 6px);left:0;box-shadow:0 18px 40px -18px #000000d9}.lab-menu[hidden]{display:none}.lab-menu--end{left:auto;right:0}#lab-saved-menu{width:300px}.lab-menu__list{margin:0;padding:0;list-style:none}.lab-menu__row{align-items:center;gap:6px;padding:6px 2px;display:flex}.lab-menu__row+.lab-menu__row{border-top:1px solid var(--line)}.lab-menu__name{flex-direction:column;flex:1;min-width:0;display:flex}.lab-menu__title{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;overflow:hidden}.lab-menu__meta{color:var(--muted);font-size:.75rem}.lab-menu__empty{color:var(--muted);margin:0;padding:4px;font-size:.75rem}.lab-menu__action{height:32px;color:var(--ink);text-align:left;background:0 0;border:0;border-radius:2px;align-items:center;gap:8px;padding:0 8px;font-size:.75rem;display:flex}.lab-menu__action:hover:not(:disabled){background:var(--raised)}.lab-menu__action:focus-visible{outline-offset:-2px}.lab-stepper{align-items:center;gap:6px;display:flex}.lab-stepper>.lab-label{margin-right:2px}.lab-stepper__value{min-width:2.5ch;color:var(--ink);font-variant-numeric:tabular-nums;text-align:center;font-size:.75rem}.lab-songstrip{border-bottom:1px solid var(--line);background:var(--glass);flex-direction:column;gap:8px;padding:10px 16px;display:flex}.lab-songstrip__row{flex-wrap:wrap;align-items:center;gap:8px 10px;min-width:0;display:flex}.lab-songstrip__row>.lab-label{margin-left:6px}.lab-songstrip__bars{align-items:center;gap:8px;margin-left:auto;display:flex}.lab-chain{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.lab-bank{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.lab-chip{border:1px solid var(--line);background:var(--void);border-radius:2px;transition:border-color .12s ease-out;display:inline-flex;position:relative}.lab-chip:hover{border-color:var(--line-strong)}.lab-chip__main{height:32px;color:var(--muted);background:0 0;border:0;align-items:center;gap:4px;padding:0 10px;font-size:.75rem;display:inline-flex}.lab-chip__letter{color:var(--ink);font-weight:600}.lab-chip__repeats{font-variant-numeric:tabular-nums}.lab-chip__more{border:0;border-left:1px solid var(--line);width:26px;height:32px;color:var(--muted);background:0 0;place-items:center;display:grid}.lab-chip__more:hover,.lab-chip__more[aria-expanded=true]{color:var(--ink)}.lab-chip:has(.lab-chip__main[aria-pressed=true]){border-color:var(--line-strong);background:var(--raised)}:is(.lab-chip:has(.lab-chip__main[aria-pressed=true]) .lab-chip__main,.lab-chip:has(.lab-chip__main[aria-pressed=true]) .lab-chip__letter){color:var(--ink)}.lab-chip:has(.lab-chip__main[aria-pressed=true]) .lab-chip__more{border-left-color:var(--line-strong)}.lab-chip.is-playing{outline:1px solid var(--green);outline-offset:2px}.lab-chip__main:focus-visible,.lab-chip__more:focus-visible{outline-offset:-2px}.lab-lanes{border-bottom:1px solid var(--line)}.lab-lanes__body{position:relative}.lab-lane{grid-template-columns:var(--head-w) minmax(0, 1fr);border-bottom:1px solid var(--line-soft);height:64px;display:grid;position:relative}.lab-lane.is-selected{z-index:1;outline:1px solid var(--hue);outline-offset:-1px}.lab-lane__head{border-right:1px solid var(--line);background:var(--panel);align-items:center;gap:10px;min-width:0;padding:0 10px 0 16px;display:flex;position:relative}.lab-lane.is-selected .lab-lane__head{background:linear-gradient(rgb(var(--hue-rgb) / .07), rgb(var(--hue-rgb) / .07)), var(--panel)}.lab-lane__swatch{background:var(--hue);flex:none;width:4px;height:36px}.lab-lane__info{flex-direction:column;flex:1;gap:5px;min-width:0;display:flex}.lab-lane__row{align-items:center;gap:4px;min-width:0;display:flex}.lab-lane__name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-weight:600;overflow:hidden}.lab-lane__preset{min-width:0;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:.75rem;overflow:hidden}.lab-lane__confirm-text{text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;overflow:hidden}.lab-toggle{border:1px solid var(--line);background:var(--void);width:24px;height:24px;color:var(--muted);border-radius:2px;flex:none;place-items:center;padding:0;font-size:.6875rem;font-weight:600;transition:border-color .12s ease-out,color .12s ease-out;display:grid}.lab-toggle:hover:not(:disabled){border-color:var(--line-strong);color:var(--ink)}.lab-toggle[aria-pressed=true]{border-color:var(--line-strong);background:var(--raised);color:var(--ink)}.lab-lane__remove{margin-left:2px}.lab-lane__meter{background:rgb(var(--hue-rgb) / .16);height:3px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.lab-lane__meter-fill{background:var(--hue);transform-origin:0;height:100%;display:block;transform:scaleX(0)}.lab-lane__strip{appearance:none;background:0 0;border:0;width:100%;height:100%;padding:0;display:block;position:relative;overflow:hidden}.lab-lane__strip:hover{background:#14223859}.lab-lane__strip:focus-visible{outline-offset:-2px}.lab-grid-line{background:var(--line-soft);width:1px;position:absolute;top:0;bottom:0}.lab-grid-line--bar{background:var(--line-strong);opacity:.6}.lab-mark{background:color-mix(in srgb, var(--hue) 62%, var(--panel));pointer-events:none;border-radius:2px;position:absolute}.lab-mark--tick{height:56%;top:50%;transform:translateY(-50%)}.lab-mark--tick.is-soft{height:24%}.lab-mark--note{height:6px}.lab-mark--note.is-soft{background:color-mix(in srgb, var(--hue) 38%, var(--panel))}.lab-mark--chord{background:color-mix(in srgb, var(--hue) 36%, var(--panel));height:36px;color:var(--ink);text-align:left;white-space:nowrap;align-items:center;padding:0 8px;font-size:.75rem;font-weight:600;display:flex;top:50%;overflow:hidden;transform:translateY(-50%)}.lab-mark.is-hit{background:var(--hue)}.lab-lanes__playhead{top:0;bottom:0;left:calc(var(--head-w) + (100% - var(--head-w)) * var(--pos,0));z-index:2;background:var(--green);pointer-events:none;width:2px;margin-left:-1px;position:absolute}.lab-lanes__playhead[hidden]{display:none}.lab-lanes__add{flex-wrap:wrap;gap:8px;padding:10px 16px;display:flex}.lab-lanes__add .lab-btn{height:32px}.lab-drawer{flex-direction:column;gap:12px;min-width:0;padding:16px 24px 24px;display:flex}.lab-drawer__head{flex-wrap:wrap;align-items:center;gap:10px 12px;display:flex}.lab-drawer__swatch{background:var(--hue);flex:none;width:4px;height:20px}.lab-drawer__title{color:var(--hue-text);white-space:nowrap;margin:0 8px 0 0;font-size:1rem;font-weight:700}.lab-presets{flex-wrap:wrap;gap:6px;display:flex}.lab-preset{border:1px solid var(--line);background:var(--void);height:32px;color:var(--muted);white-space:nowrap;border-radius:2px;padding:0 12px;font-size:.75rem;transition:border-color .12s ease-out,color .12s ease-out}.lab-preset:hover{border-color:var(--line-strong);color:var(--ink)}.lab-preset[aria-checked=true]{border-color:var(--hue);background:rgb(var(--hue-rgb) / .1);color:var(--ink)}.lab-drawer__tools{flex-wrap:wrap;align-items:center;gap:10px 20px;display:flex}.lab-drawer__field{align-items:center;gap:8px;display:flex}.lab-frame{overscroll-behavior-x:contain;border:1px solid var(--line);background:var(--glass);scrollbar-color:var(--line) var(--panel);scrollbar-width:thin;border-radius:2px;max-width:100%;overflow-x:auto}.lab-drums{flex-direction:column;gap:2px;min-width:576px;padding:4px;display:flex}.lab-drums__row{grid-template-columns:96px repeat(16,minmax(28px,1fr));gap:2px;display:grid}.lab-drums__lane{color:var(--muted);white-space:nowrap;align-items:center;padding:0 8px;font-size:.75rem;display:flex}.lab-cell{background:var(--cell);border:0;border-radius:2px;height:32px;padding:0}.lab-cell.is-beat{background:var(--cell-beat)}.lab-cell:hover{background:var(--raised)}.lab-cell[data-value="1"]{background:color-mix(in srgb, var(--hue) 42%, var(--panel))}.lab-cell[data-value="2"]{background:var(--hue)}.lab-cell:focus-visible{outline-offset:-2px}.lab-roll{flex-direction:column;min-width:504px;display:flex}.lab-roll__row{border-bottom:1px solid var(--cell);background:var(--void);grid-template-columns:56px minmax(0,1fr);height:24px;display:grid}.lab-roll__row:nth-child(2n){background:var(--glass)}.lab-roll__row:last-child{border-bottom:0}.lab-roll__row.is-tonic{background:rgb(var(--hue-rgb) / .08)}.lab-roll__label{border-right:1px solid var(--line);color:var(--meta);font-variant-numeric:tabular-nums;align-items:center;padding-left:8px;font-size:.75rem;display:flex}.lab-roll__row.is-tonic .lab-roll__label{color:var(--hue-text)}.lab-roll__cells{grid-template-columns:repeat(16,minmax(28px,1fr));display:grid;position:relative}.lab-roll__cell{border:0;border-left:1px solid var(--cell-beat);background:0 0;height:100%;padding:0}.lab-roll__cell:first-child{border-left:0}.lab-roll__cell.is-beat{border-left-color:var(--line)}.lab-roll__cell:hover{background:rgb(var(--hue-rgb) / .14)}.lab-roll__cell:focus-visible{z-index:3;outline-offset:-2px;position:relative}.lab-roll__note{z-index:2;border:1px solid var(--void);background:var(--hue);cursor:pointer;background-clip:padding-box;border-radius:2px;position:absolute;top:2px;bottom:2px}.lab-roll__note.is-soft{background-color:color-mix(in srgb, var(--hue) 48%, var(--panel))}.lab-roll__note.is-continued{border-left:0;border-radius:0 2px 2px 0}.lab-roll__note.is-resizing{outline:1px solid var(--ink)}.lab-roll__handle{cursor:ew-resize;touch-action:none;width:8px;position:absolute;top:0;bottom:0;right:0}.lab-roll__handle:after{content:"";background:#0308178c;width:2px;position:absolute;top:25%;bottom:25%;right:2px}.lab-cards{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;display:grid}.lab-card{border:1px solid var(--line);background:var(--panel);min-width:0;color:var(--ink);text-align:left;border-radius:4px;flex-direction:column;align-items:flex-start;gap:4px;padding:12px;transition:border-color .12s ease-out;display:flex}.lab-card:hover{border-color:var(--line-strong)}.lab-card[aria-pressed=true]{border-color:var(--hue);background:linear-gradient(rgb(var(--hue-rgb) / .08), rgb(var(--hue-rgb) / .08)), var(--panel)}.lab-card__name{font-size:1.5rem;font-weight:700;line-height:1.1}.lab-card.is-rest .lab-card__name{color:var(--muted)}.lab-card__numeral{min-height:1.2em;color:var(--hue-text);font-size:.8125rem}.lab-card__tones{min-height:1.2em;color:var(--muted);font-size:.75rem}.lab-picker{flex-wrap:wrap;gap:6px;display:flex}.lab-picker__chord{border:1px solid var(--line);background:var(--void);min-width:72px;height:44px;color:var(--ink);border-radius:2px;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:0 10px;transition:border-color .12s ease-out;display:flex}.lab-picker__chord:hover{border-color:var(--line-strong)}.lab-picker__chord[aria-pressed=true]{border-color:var(--hue);background:rgb(var(--hue-rgb) / .1)}.lab-picker__name{font-size:.8125rem;font-weight:600}.lab-picker__numeral{color:var(--muted);font-size:.75rem}.lab-noscript{color:var(--muted);margin:0;padding:24px 16px}@media (pointer:coarse){.lab-toggle{width:32px;height:32px}.lab-roll__handle{width:14px}}@media (width>=48rem){.lab-page{padding:24px 24px 0}.lab-transport{padding:8px 16px 8px 24px}.lab-songstrip{padding:10px 24px}}@media (width<=47.999rem){.lab{--head-w:120px}.lab-brand{flex-basis:100%}.lab-transport__side{margin-left:0}.lab-play,.lab-field,.lab-transport .lab-btn{min-height:44px}.lab-transport .lab-btn--icon{width:44px}.lab-field__input--text{height:44px}.lab-transport{gap:8px;padding:8px 12px 12px}.lab-transport__main,.lab-transport__side{flex-basis:100%}.lab-transport .lab-field{gap:4px;padding:0 6px}.lab-transport .lab-field__label{letter-spacing:.08em}.lab-field__input--num{appearance:textfield;width:2.5rem}.lab-field__input--num::-webkit-inner-spin-button{appearance:none;margin:0}.lab-field__input--num::-webkit-outer-spin-button{appearance:none;margin:0}.lab-field--scale{flex:1 1 0;min-width:0}.lab-field--scale select,.lab-field--starter select{flex:1;width:100%;min-width:0}.lab-transport .lab-field--range{flex:calc(50% - 4px);min-width:0}.lab-field--range .lab-range{flex:1;width:auto;min-width:40px}.lab-transport__side{flex-wrap:nowrap}.lab-transport__group--starter{flex-wrap:wrap;flex:1 1 0;min-width:0}.lab-field--starter{flex:100%;min-width:0}.lab-transport__side>.lab-transport__group--save>.lab-btn,.lab-transport__side>.lab-menu-root>.lab-btn,.lab-transport__side>.lab-btn{width:44px;padding:0}.lab-transport__side .lab-btn__label,.lab-transport__side [data-menu-trigger] .lab-icon--small{display:none}:is(.lab-transport__side:has(.lab-saveform:not([hidden])),.lab-transport__side:has(.lab-confirm:not([hidden])),.lab-transport__side:has(.lab-status:not(:empty))){flex-wrap:wrap}.lab-transport__group--save:has(.lab-saveform:not([hidden])){flex-basis:100%}.lab-saveform .lab-field__input--text{flex:1;width:auto;min-width:0}.lab-status{flex-basis:100%}.lab-drawer__track{margin-left:0}.lab-drawer .lab-field--range{flex:140px}.lab-songstrip__bars{margin-left:0}.lab-lane__head{gap:8px;padding:0 8px 0 10px}.lab-lane__row{flex-wrap:wrap}.lab-lane__name{flex-basis:100%;font-size:.75rem}.lab-lane__row--sub,.lab-lane__remove{display:none}.lab-toggle{width:32px;height:32px}.lab-mark--chord{padding:0 4px}.lab-drawer{padding:12px 16px 20px}.lab-drums{min-width:628px}.lab-drums__row{grid-template-columns:84px repeat(16,minmax(32px,1fr))}.lab-roll{min-width:560px}.lab-roll__row{grid-template-columns:48px minmax(0,1fr);height:32px}.lab-roll__cells{grid-template-columns:repeat(16,minmax(32px,1fr))}}.lab-btn--toggle{height:32px;color:var(--muted)}.lab-btn--toggle[aria-pressed=true]{border-color:var(--line-strong);background:var(--raised);color:var(--ink)}.lab-drawer__track{flex-wrap:wrap;align-items:center;gap:8px;margin-left:auto;display:flex}@media (width<=47.999rem){.lab-transport__group--save .lab-saveform{flex:100%}}.lab-drawer .lab-stepper .lab-btn{border-color:rgb(var(--hue-rgb) / .45);color:var(--hue-text)}.lab-drawer .lab-stepper .lab-btn:hover:not(:disabled){border-color:var(--hue)}.lab-drawer .lab-stepper__value{color:var(--hue-text)}.lab-lock{color:var(--muted);white-space:nowrap;align-items:center;gap:6px;font-size:.75rem;display:inline-flex}.lab-lock .lab-icon{color:var(--hue-text)}.lab-cell.is-now{box-shadow:inset 0 3px 0 var(--green)}.lab-cell.is-now:not([data-value="1"],[data-value="2"]){background:color-mix(in srgb, var(--green) 10%, var(--cell))}.lab-roll__cell.is-now{background:rgb(var(--green-rgb) / .1)}.lab-roll__row:first-child .lab-roll__cell.is-now{box-shadow:inset 0 3px 0 var(--green)}