.connection-announcer{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.error-boundary{min-height:100vh;padding:var(--space-xl);background:linear-gradient(135deg, var(--color-bg-primary) 0%, var(--color-bg-secondary) 100%);color:var(--color-text-primary);flex-direction:column;justify-content:center;align-items:center;display:flex}.error-boundary h1{margin-bottom:var(--space-md);color:var(--color-error);text-align:center;text-shadow:0 2px 4px #0003;font-size:2rem}.error-boundary p{margin-bottom:var(--space-lg);text-align:center;max-width:600px;color:var(--color-text-secondary);font-size:1.1rem;line-height:1.6}.error-boundary details{margin-bottom:var(--space-lg);padding:var(--space-md);background-color:var(--color-bg-tertiary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-md);width:100%;max-width:600px;box-shadow:var(--shadow-md)}.error-boundary summary{cursor:pointer;margin-bottom:var(--space-sm);color:var(--color-text-primary);transition:color var(--duration-fast);font-weight:600}.error-boundary summary:hover{color:var(--color-node-timeline)}.error-boundary pre{padding:var(--space-sm);background-color:var(--color-bg-secondary);border-radius:var(--radius-sm);color:var(--color-text-secondary);border:var(--border-width-thin) solid var(--color-border);margin:0;font-size:.9rem;line-height:1.5;overflow-x:auto}.error-boundary button{min-width:var(--touch-target-min);min-height:var(--touch-target-min);padding:var(--space-md) var(--space-xl);font-size:var(--font-size-base);font-weight:var(--font-weight-bold);background-color:var(--color-node-generator);color:var(--color-text-primary);border-radius:var(--radius-md);cursor:pointer;transition:all var(--duration-base) var(--ease-out);box-shadow:var(--shadow-md);border:none}.error-boundary button:hover{background-color:var(--color-node-generator);box-shadow:var(--shadow-lg);filter:brightness(1.1);transform:translateY(-2px)}.error-boundary button:active{background-color:var(--color-node-generator);box-shadow:var(--shadow-sm);filter:brightness(.9);transform:translateY(0)}.error-boundary button:focus-visible{outline:var(--border-width-thick) solid var(--color-primary);outline-offset:var(--border-width-thick)}@media (width<=768px){.error-boundary{padding:var(--space-lg)}.error-boundary h1{font-size:1.5rem}.error-boundary p{font-size:1rem}}.instrument-name-dialog-overlay{z-index:var(--z-modal);padding:var(--space-md);animation:fadeIn var(--duration-base) var(--ease-out);background-color:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.instrument-name-dialog{gap:var(--space-lg);padding:var(--space-xl);background:var(--color-bg-elevated);border:var(--border-width-thick) solid var(--color-border);border-radius:var(--radius-md);inline-size:100%;max-inline-size:480px;box-shadow:var(--shadow-lg);animation:slideUp var(--duration-base) var(--ease-out);flex-direction:column;display:flex}@keyframes slideUp{0%{transform:translateY(var(--space-xl));opacity:0}to{opacity:1;transform:translateY(0)}}.instrument-name-dialog__title{font-family:var(--font-family-node);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);color:var(--color-text-primary);margin:0}.instrument-name-dialog__description{font-family:var(--font-family-sans);font-size:var(--font-size-sm);line-height:var(--line-height-base);color:var(--color-text-secondary);margin:0}.instrument-name-dialog__input-group{gap:var(--space-sm);flex-direction:column;display:flex}.instrument-name-dialog__label{font-family:var(--font-family-sans);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-base);color:var(--color-text-primary)}.instrument-name-dialog__input{padding-inline:var(--space-md);padding-block:var(--space-sm);inline-size:100%;font-family:var(--font-family-sans);font-size:var(--font-size-base);line-height:var(--line-height-base);color:var(--color-text-primary);background:var(--color-bg-secondary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-sm);transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out)}.instrument-name-dialog__input::placeholder{color:var(--color-text-muted)}.instrument-name-dialog__input:hover{border-color:var(--color-border-light)}.instrument-name-dialog__input:focus-visible{border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary);outline:none}.instrument-name-dialog__input[aria-invalid=true]{border-color:var(--color-error)}.instrument-name-dialog__input[aria-invalid=true]:focus-visible{box-shadow:0 0 0 2px var(--color-error)}.instrument-name-dialog__error{font-family:var(--font-family-sans);font-size:var(--font-size-xs);line-height:var(--line-height-base);color:var(--color-error)}.instrument-name-dialog__actions{gap:var(--space-md);justify-content:flex-end;display:flex}.instrument-name-dialog__button{cursor:pointer;padding-inline:var(--space-lg);padding-block:var(--space-sm);min-inline-size:96px;font-family:var(--font-family-sans);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-base);border-radius:var(--radius-sm);transition:background-color var(--duration-fast) var(--ease-out), transform var(--duration-fast) var(--ease-out);border:none}.instrument-name-dialog__button:focus-visible{outline:var(--focus-outline-width) solid var(--focus-outline-color);outline-offset:var(--focus-outline-offset)}.instrument-name-dialog__button:active{transform:scale(.98)}.instrument-name-dialog__button--cancel{background:var(--color-bg-tertiary);color:var(--color-text-primary)}.instrument-name-dialog__button--cancel:hover{background:var(--color-bg-elevated)}.instrument-name-dialog__button--confirm{background:var(--color-primary);color:var(--color-text-primary)}.instrument-name-dialog__button--confirm:hover{background:var(--color-primary-hover)}.instrument-name-dialog__button--confirm:active{background:var(--color-primary-active)}@media (width<=768px){.instrument-name-dialog{padding:var(--space-lg);max-inline-size:100%}.instrument-name-dialog__actions{flex-direction:column-reverse}.instrument-name-dialog__button{inline-size:100%}}@media (prefers-reduced-motion:reduce){.instrument-name-dialog-overlay,.instrument-name-dialog{animation:none}}.confirmation-dialog{border:none;border-radius:8px;width:90vw;max-width:400px;padding:0;box-shadow:0 4px 16px #0003}.confirmation-dialog__content{flex-direction:column;gap:16px;padding:24px;display:flex}.confirmation-dialog__title{color:#1a1a1a;margin:0;font-size:18px;font-weight:600}.confirmation-dialog__message{color:#4a4a4a;margin:0;font-size:14px;line-height:1.5}.confirmation-dialog__buttons{justify-content:flex-end;gap:12px;margin-top:8px;display:flex}.confirmation-dialog__button{cursor:pointer;color:#1a1a1a;background-color:#f5f5f5;border:1px solid #ccc;border-radius:4px;padding:8px 16px;font-size:14px;font-weight:500;transition:all .2s}.confirmation-dialog__button:hover:not(:disabled){background-color:#e8e8e8;border-color:#999}.confirmation-dialog__button:focus-visible{outline-offset:2px;outline:2px solid #06c}.confirmation-dialog__button:disabled{opacity:.5;cursor:not-allowed}.confirmation-dialog__button--confirm{color:#fff;background-color:#06c;border-color:#0052a3}.confirmation-dialog__button--confirm:hover:not(:disabled){background-color:#0052a3;border-color:#003d7a}.confirmation-dialog__button--dangerous{background-color:#d32f2f;border-color:#b71c1c}.confirmation-dialog__button--dangerous:hover:not(:disabled){background-color:#b71c1c;border-color:#8b0000}.transport-bar{align-items:center;gap:var(--space-md);font-family:var(--font-family-sans);font-size:var(--font-size-sm);color:var(--color-text-primary);display:flex}.transport-bar__controls{align-items:center;gap:var(--space-xs);display:flex}.transport-bar__play-btn,.transport-bar__stop-btn{justify-content:center;align-items:center;gap:var(--space-xs);min-block-size:var(--touch-target-min);padding-inline:var(--space-md);padding-block:var(--space-xs);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-md);font-family:var(--font-family-sans);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);cursor:pointer;transition:background var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out);display:inline-flex}.transport-bar__play-btn{background:var(--color-bg-tertiary);color:var(--color-success)}.transport-bar__play-btn:hover:not(:disabled){background:var(--color-bg-elevated);border-color:var(--color-success)}.transport-bar__play-btn:active:not(:disabled){background:var(--color-bg-secondary)}.transport-bar__stop-btn{background:var(--color-bg-tertiary);color:var(--color-error)}.transport-bar__stop-btn:hover:not(:disabled){background:var(--color-bg-elevated);border-color:var(--color-error)}.transport-bar__stop-btn:active:not(:disabled){background:var(--color-bg-secondary)}.transport-bar__play-btn:disabled,.transport-bar__stop-btn:disabled{opacity:.4;cursor:not-allowed}.transport-bar__play-btn:focus-visible,.transport-bar__stop-btn:focus-visible{outline:var(--focus-outline-width) solid var(--focus-outline-color);outline-offset:var(--focus-outline-offset)}.transport-bar__bpm-group{align-items:center;gap:var(--space-xs);font-family:var(--font-family-node);font-size:var(--font-size-sm);color:var(--color-text-secondary);display:flex}.transport-bar__bpm-input{inline-size:clamp(3.5rem,8cqi,5rem);min-block-size:var(--touch-target-min);padding-inline:var(--space-sm);padding-block:var(--space-xs);background:var(--color-bg-primary);color:var(--color-text-primary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-md);font-family:var(--font-family-mono);font-size:var(--font-size-sm);text-align:end;appearance:textfield}.transport-bar__bpm-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.transport-bar__bpm-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.transport-bar__bpm-input:focus-visible{outline:var(--focus-outline-width) solid var(--focus-outline-color);outline-offset:var(--focus-outline-offset);border-color:var(--color-primary)}.transport-bar__position{align-items:center;gap:var(--space-sm);padding-inline:var(--space-sm);padding-block:var(--space-xs);background:var(--color-bg-primary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-md);font-family:var(--font-family-mono);font-size:var(--font-size-sm);color:var(--color-text-secondary);white-space:nowrap;display:flex}.transport-bar__beat{color:var(--color-primary)}.transport-bar__time{color:var(--color-text-muted)}.transport-bar__context-state{padding-inline:var(--space-sm);padding-block:var(--space-xs);font-family:var(--font-family-sans);font-size:var(--font-size-xs);color:var(--color-warning);white-space:nowrap}.transport-bar__error{padding-inline:var(--space-sm);padding-block:var(--space-xs);font-family:var(--font-family-sans);font-size:var(--font-size-xs);color:var(--color-error);text-overflow:ellipsis;white-space:nowrap;max-inline-size:clamp(10rem,20cqi,20rem);overflow:hidden}.transport-bar__sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width<=768px){.transport-bar{gap:var(--space-sm)}.transport-bar__position{gap:var(--space-xs)}}@media (width<=480px){.transport-bar{gap:var(--space-xs)}.transport-bar__bpm-group{gap:0}.transport-bar__context-state{display:none}}.import-project-dialog-overlay{z-index:1000;background-color:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0;overflow:auto}.import-project-dialog{background-color:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:8px;width:90%;max-width:400px;padding:24px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 4px 12px #00000026}.import-project-dialog::backdrop{background-color:#00000080}.import-project-dialog-title{color:var(--color-text-primary);margin:0 0 24px;font-size:18px;font-weight:600}.import-project-dialog-selected{margin-bottom:24px}.import-project-dialog-selected-name{color:var(--color-text-primary);word-break:break-all;margin:0 0 12px;font-size:14px}.import-project-dialog-confirmation{color:var(--color-text-secondary);margin:0 0 24px;font-size:14px;line-height:1.5}.import-project-dialog-buttons{justify-content:flex-end;gap:12px;display:flex}.import-project-dialog-button{border:1px solid var(--color-border);cursor:pointer;border-radius:4px;padding:8px 16px;font-size:14px;font-weight:500;transition:all .2s}.import-project-dialog-button:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.import-project-dialog-button:disabled{opacity:.5;cursor:not-allowed}.import-project-dialog-button-primary{background-color:var(--color-button-primary);color:var(--color-button-primary-text);border-color:var(--color-button-primary)}.import-project-dialog-button-primary:hover:not(:disabled){background-color:var(--color-button-primary-hover)}.import-project-dialog-button-secondary{background-color:var(--color-button-secondary);color:var(--color-button-secondary-text);border-color:var(--color-border)}.import-project-dialog-button-secondary:hover:not(:disabled){background-color:var(--color-button-secondary-hover)}.load-project-dialog-overlay{z-index:1000;background-color:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0;overflow:auto}.load-project-dialog{background-color:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:8px;width:90%;max-width:500px;max-height:80vh;padding:24px;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%);box-shadow:0 4px 12px #00000026}.load-project-dialog::backdrop{background-color:#00000080}.load-project-dialog-title{color:var(--color-text-primary);margin:0 0 12px;font-size:18px;font-weight:600}.load-project-dialog-description{color:var(--color-text-secondary);margin:0 0 16px;font-size:14px}.load-project-dialog-message{background-color:var(--color-bg-secondary);color:var(--color-text-secondary);text-align:center;border-radius:4px;margin-bottom:32px;padding:16px;font-size:14px}.load-project-dialog-list{border:1px solid var(--color-border);border-radius:4px;margin:0 0 16px;padding:0;list-style:none;overflow:hidden}.load-project-dialog-item-wrapper{margin:0;padding:0;list-style:none}.load-project-dialog-item{border:none;border-bottom:1px solid var(--color-border);background-color:var(--color-bg-secondary);text-align:left;cursor:pointer;width:100%;padding:12px;font-size:14px;transition:background-color .2s}.load-project-dialog-item:last-child{border-bottom:none}.load-project-dialog-item:hover{background-color:var(--color-bg-tertiary)}.load-project-dialog-item-selected{background-color:var(--color-button-primary);color:var(--color-button-primary-text)}.load-project-dialog-item-name{margin-bottom:4px;font-weight:500}.load-project-dialog-item-meta{opacity:.7;justify-content:space-between;font-size:12px;display:flex}.load-project-dialog-preview{background-color:var(--color-bg-secondary);border-radius:4px;margin-bottom:16px;padding:16px}.load-project-dialog-preview-title{margin:0 0 8px;font-size:14px;font-weight:600}.load-project-dialog-preview-content{font-size:13px;line-height:1.6}.load-project-dialog-preview-content p{margin:4px 0}.load-project-dialog-buttons{justify-content:flex-end;gap:12px;display:flex}.load-project-dialog-button{border:1px solid var(--color-border);cursor:pointer;border-radius:4px;padding:8px 16px;font-size:14px;font-weight:500;transition:all .2s}.load-project-dialog-button:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.load-project-dialog-button:disabled{opacity:.5;cursor:not-allowed}.load-project-dialog-button-primary{background-color:var(--color-button-primary);color:var(--color-button-primary-text);border-color:var(--color-button-primary)}.load-project-dialog-button-primary:hover:not(:disabled){background-color:var(--color-button-primary-hover)}.load-project-dialog-button-secondary{background-color:var(--color-button-secondary);color:var(--color-button-secondary-text)}.load-project-dialog-button-secondary:hover:not(:disabled){background-color:var(--color-button-secondary-hover)}.about-dialog{border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-bg-elevated);box-shadow:var(--shadow-lg);flex-direction:column;width:90vw;max-width:400px;max-height:80vh;padding:0;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.about-dialog:not([open]){display:none}.about-dialog::backdrop{background-color:#00000080}.about-dialog__content{padding:var(--space-lg);gap:var(--space-md);flex-direction:column;display:flex;overflow-y:auto}.about-dialog__title{font-size:var(--font-size-lg);color:var(--color-text-primary);margin:0;font-weight:600}.about-dialog__section{gap:var(--space-sm);flex-direction:column;display:flex}.about-dialog__section-title{font-size:var(--font-size-sm);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px;margin:0;font-weight:600}.about-dialog__version{font-size:var(--font-size-base);color:var(--color-text-primary);margin:0;font-weight:500}.about-dialog__build-info{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0}.about-dialog__credits-list{gap:var(--space-xs);flex-direction:column;margin:0;padding-inline-start:var(--space-md);list-style:outside;display:flex}.about-dialog__credit-item{font-size:var(--font-size-sm);color:var(--color-text-primary);margin:0;line-height:1.4}.about-dialog__license{font-size:var(--font-size-sm);color:var(--color-text-primary);margin:0}.about-dialog__license-link{color:var(--color-primary);font-size:var(--font-size-sm);text-decoration:none;transition:color .15s}.about-dialog__license-link:hover{color:var(--color-primary-hover);text-decoration:underline}.about-dialog__license-link:focus-visible{outline:2px solid var(--color-focus-outline);outline-offset:2px;border-radius:var(--radius-sm)}.about-dialog__actions{gap:var(--space-md);justify-content:flex-end;margin-block-start:var(--space-md);display:flex}.about-dialog__button{padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-bg-secondary);color:var(--color-text-primary);font-size:var(--font-size-base);cursor:pointer;font-weight:500;transition:background-color .15s,border-color .15s}.about-dialog__button:hover{background-color:var(--color-bg-tertiary);border-color:var(--color-border-hover)}.about-dialog__button:focus-visible{outline:2px solid var(--color-focus-outline);outline-offset:2px}.project-info-dialog{border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-bg-elevated);box-shadow:var(--shadow-lg);width:90vw;max-width:400px;padding:0}.project-info-dialog::backdrop{background-color:#00000080}.project-info-dialog__content{padding:var(--space-lg);gap:var(--space-md);flex-direction:column;display:flex}.project-info-dialog__title{font-size:var(--font-size-lg);color:var(--color-text-primary);margin:0;font-weight:600}.project-info-dialog__section{gap:var(--space-sm);flex-direction:column;display:flex}.project-info-dialog__label{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:500}.project-info-dialog__input{padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-bg-secondary);color:var(--color-text-primary);font-size:var(--font-size-base);font-family:inherit}.project-info-dialog__input:focus{outline:2px solid var(--color-focus-outline);outline-offset:2px}.project-info-dialog__metadata{gap:var(--space-xs);padding:var(--space-md);background-color:var(--color-bg-secondary);border-radius:var(--radius-sm);flex-direction:column;display:flex}.project-info-dialog__metadata-row{justify-content:space-between;align-items:center;gap:var(--space-md);display:flex}.project-info-dialog__metadata-label{font-size:var(--font-size-sm);color:var(--color-text-secondary);flex-shrink:0;font-weight:500}.project-info-dialog__metadata-value{font-size:var(--font-size-sm);color:var(--color-text-primary);text-align:right;flex-grow:1}.project-info-dialog__actions{gap:var(--space-md);margin-top:var(--space-md);justify-content:flex-end;display:flex}.project-info-dialog__button{padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-bg-secondary);color:var(--color-text-primary);font-size:var(--font-size-base);cursor:pointer;font-weight:500;transition:background-color .15s,border-color .15s}.project-info-dialog__button:hover{background-color:var(--color-bg-tertiary);border-color:var(--color-border-hover)}.project-info-dialog__button:focus-visible{outline:2px solid var(--color-focus-outline);outline-offset:2px}.project-info-dialog__button--confirm{background-color:var(--color-primary);color:var(--color-text-on-primary);border-color:var(--color-primary)}.project-info-dialog__button--confirm:hover{background-color:var(--color-primary-hover);border-color:var(--color-primary-hover)}.new-project-dialog-overlay{z-index:1000;background-color:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.new-project-dialog{background-color:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:8px;outline:none;width:90%;max-width:400px;padding:24px;box-shadow:0 4px 12px #00000026}.new-project-dialog-title{color:var(--color-text-primary);margin:0 0 12px;font-size:18px;font-weight:600}.new-project-dialog-message{color:var(--color-text-secondary);margin:0 0 24px;font-size:14px;line-height:1.5}.new-project-dialog-buttons{justify-content:flex-end;gap:12px;display:flex}.new-project-dialog-button{border:1px solid var(--color-border);cursor:pointer;border-radius:4px;outline:none;padding:8px 16px;font-size:14px;font-weight:500;transition:all .2s}.new-project-dialog-button:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.new-project-dialog-button:disabled{opacity:.5;cursor:not-allowed}.new-project-dialog-button-primary{background-color:var(--color-button-primary);color:var(--color-button-primary-text);border-color:var(--color-button-primary)}.new-project-dialog-button-primary:hover:not(:disabled){background-color:var(--color-button-primary-hover);border-color:var(--color-button-primary-hover)}.new-project-dialog-button-secondary{background-color:var(--color-button-secondary);color:var(--color-button-secondary-text);border-color:var(--color-border)}.new-project-dialog-button-secondary:hover:not(:disabled){background-color:var(--color-button-secondary-hover)}.new-project-dialog-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.spinner{border:2px solid var(--color-border);border-top-color:var(--color-button-primary);border-radius:50%;width:20px;height:20px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.save-as-dialog-overlay{z-index:1000;background-color:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0;overflow:auto}.save-as-dialog{background-color:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:8px;width:90%;max-width:400px;max-height:80vh;padding:24px;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%);box-shadow:0 4px 12px #00000026}.save-as-dialog::backdrop{background-color:#00000080}.save-as-dialog-title{color:var(--color-text-primary);margin:0 0 12px;font-size:18px;font-weight:600}.save-as-dialog-description{color:var(--color-text-secondary);margin:0 0 24px;font-size:14px;line-height:1.5}.save-as-dialog-form{margin-bottom:24px}.save-as-dialog-label{color:var(--color-text-primary);margin-bottom:8px;font-size:14px;font-weight:500;display:block}.save-as-dialog-input{border:1px solid var(--color-border);background-color:var(--color-bg-secondary);width:100%;color:var(--color-text-primary);box-sizing:border-box;border-radius:4px;padding:8px 12px;font-size:14px;transition:border-color .2s}.save-as-dialog-input:focus{border-color:var(--color-focus);box-shadow:0 0 0 2px var(--color-focus-ring);outline:none}.save-as-dialog-input:disabled{opacity:.5;cursor:not-allowed}.save-as-dialog-input-error{border-color:var(--color-error)}.save-as-dialog-error{color:var(--color-error);margin-top:6px;font-size:12px;line-height:1.4}.save-as-dialog-buttons{justify-content:flex-end;gap:12px;display:flex}.save-as-dialog-button{border:1px solid var(--color-border);cursor:pointer;border-radius:4px;outline:none;padding:8px 16px;font-size:14px;font-weight:500;transition:all .2s}.save-as-dialog-button:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.save-as-dialog-button:disabled{opacity:.5;cursor:not-allowed}.save-as-dialog-button-primary{background-color:var(--color-button-primary);color:var(--color-button-primary-text);border-color:var(--color-button-primary)}.save-as-dialog-button-primary:hover:not(:disabled){background-color:var(--color-button-primary-hover);border-color:var(--color-button-primary-hover)}.save-as-dialog-button-secondary{background-color:var(--color-button-secondary);color:var(--color-button-secondary-text);border-color:var(--color-border)}.save-as-dialog-button-secondary:hover:not(:disabled){background-color:var(--color-button-secondary-hover)}.menu-item{justify-content:space-between;align-items:center;gap:var(--space-lg);padding-block:var(--space-sm);padding-inline:var(--space-md);cursor:pointer;white-space:nowrap;background-color:#0000;list-style:none;transition:background-color .15s ease-in-out;display:flex}.menu-item:hover:not([data-disabled=true]){background-color:var(--color-bg-tertiary)}.menu-item:focus-visible{outline:var(--focus-outline-width) solid var(--focus-outline-color);outline-offset:calc(var(--focus-outline-offset) * -1);background-color:var(--color-bg-tertiary)}.menu-item[data-disabled=true]{opacity:.5;cursor:not-allowed}.menu-item__label{color:var(--color-text-primary);font-size:var(--font-size-sm,.875rem);flex:1}.menu-item__shortcut{color:var(--color-text-secondary);font-size:var(--font-size-xs,.75rem);font-family:var(--font-family-mono,monospace);white-space:nowrap}.menu-separator{margin-block:var(--space-xs);margin-inline:0;padding:0;list-style:none}.menu-separator hr{background-color:var(--color-border);border:none;block-size:1px;margin:0}.menu-panel{position-area:bottom span-right;position-try-fallbacks:flip-block;padding:var(--space-xs) 0;border:1px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-bg-elevated);box-shadow:var(--shadow-lg);opacity:0;min-inline-size:200px;transition:opacity .15s ease-out, transform .15s ease-out, overlay .15s ease-out allow-discrete, display .15s ease-out allow-discrete;margin:0;transform:translateY(-4px)}.menu-panel:popover-open{opacity:1;transform:translateY(0)}@starting-style{.menu-panel:popover-open{opacity:0;transform:translateY(-4px)}}.menu-panel__list{margin:0;padding:0;list-style:none}.menu-button-wrapper{list-style:none}.menu-button{padding:var(--space-sm) var(--space-md);color:var(--color-text-primary);border-radius:var(--radius-sm);font-size:inherit;cursor:pointer;white-space:nowrap;background-color:#0000;border:none;justify-content:center;align-items:center;font-weight:500;transition:background-color .15s ease-in-out;display:inline-flex}.menu-button:hover{background-color:var(--color-bg-tertiary)}.menu-button:focus-visible{outline:var(--focus-outline-width) solid var(--focus-outline-color);outline-offset:var(--focus-outline-offset)}.menu-button[aria-expanded=true]{background-color:var(--color-bg-tertiary)}.menu-bar{z-index:var(--z-menu);background:var(--color-bg-secondary);inline-size:100%;color:var(--color-text-primary);border-block-end:var(--border-width-thick) solid var(--color-primary);box-shadow:var(--shadow-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);flex-direction:column;display:flex;position:fixed;inset-block-start:0;inset-inline:0}.menu-bar__skip-link{padding:var(--space-sm) var(--space-md);background-color:var(--color-primary);color:var(--color-text-primary);font-size:var(--font-size-sm,.875rem);font-weight:var(--font-weight-bold,700);border-radius:0 0 var(--radius-md,4px) 0;z-index:10000;white-space:nowrap;text-decoration:none;position:absolute;inset-block-start:0;inset-inline-start:-9999px}.menu-bar__skip-link:focus{outline:var(--border-width-thick,2px) solid var(--color-primary);outline-offset:var(--border-width-thick,2px);inset-inline-start:0}.menu-bar__menu-row{align-items:center;gap:var(--space-lg);padding-inline:var(--space-lg);padding-block:var(--space-sm);min-block-size:48px;display:flex}.menu-bar__app-title{align-items:center;gap:var(--space-sm);flex-shrink:0;display:flex}.menu-bar__logo{block-size:28px;inline-size:28px;color:var(--color-primary);flex-shrink:0;justify-content:center;align-items:center;display:flex}.menu-bar__logo svg{block-size:100%;inline-size:100%}.menu-bar__title{font-family:var(--font-family-sans);font-size:clamp(.875rem,2vw,1.25rem);font-weight:var(--font-weight-medium);color:var(--color-primary);letter-spacing:.5px;text-transform:uppercase;flex-shrink:0;margin:0}.menu-bar__buttons{align-items:center;gap:var(--space-xs);margin:0;padding:0;list-style:none;display:flex}.menu-bar__transport-row{padding-inline:var(--space-lg);padding-block:var(--space-sm);border-block-start:1px solid var(--color-border);background:var(--color-bg-secondary);justify-content:center;align-items:center;min-block-size:48px;display:flex}.menu-bar__announcements{block-size:1px;inline-size:1px;position:absolute;inset-block-start:-9999px;inset-inline-start:-9999px;overflow:hidden}@media (width<=768px){.menu-bar__menu-row,.menu-bar__transport-row{padding-inline:var(--space-md)}}@media (width<=480px){.menu-bar__menu-row{padding-inline:var(--space-sm);gap:var(--space-sm)}.menu-bar__transport-row{padding-inline:var(--space-sm)}.menu-bar__title{font-size:.875rem}}.node-announcer{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.plugin-error-toast-container{z-index:9999;flex-direction:column;gap:12px;max-width:400px;display:flex;position:fixed;bottom:20px;right:20px}.plugin-error-toast{background-color:#fee;border:1px solid #f88;border-radius:4px;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px;animation:.3s ease-out slideIn;display:flex;box-shadow:0 2px 8px #00000026}@keyframes slideIn{0%{opacity:0;transform:translate(400px)}to{opacity:1;transform:translate(0)}}.plugin-error-content{flex:1;gap:12px;display:flex}.plugin-error-icon{color:#f44;flex-shrink:0;font-size:20px}.plugin-error-message{flex-direction:column;gap:4px;display:flex}.plugin-error-title{color:#333;font-size:14px;font-weight:600}.plugin-error-reason{color:#666;font-size:12px;line-height:1.4}.plugin-error-actions{flex-shrink:0;gap:8px;display:flex}.plugin-error-retry-btn,.plugin-error-close-btn{cursor:pointer;border:none;border-radius:3px;padding:6px 12px;font-size:12px;font-weight:500;transition:all .2s}.plugin-error-retry-btn{color:#fff;background-color:#f44}.plugin-error-retry-btn:hover{background-color:#d33}.plugin-error-retry-btn:active{transform:scale(.98)}.plugin-error-close-btn{color:#666;background-color:#0000;padding:6px 8px}.plugin-error-close-btn:hover{color:#333;background-color:#f0f0f0}@media (width<=480px){.plugin-error-toast-container{max-width:none;bottom:10px;left:10px;right:10px}.plugin-error-toast{flex-direction:column}.plugin-error-actions{width:100%}.plugin-error-retry-btn,.plugin-error-close-btn{flex:1}}.private-browsing-indicator{color:#856404;background-color:#fff3cd;border:1px solid #ffc107;border-radius:4px;align-items:center;gap:8px;margin-bottom:12px;padding:8px 12px;font-size:14px;display:flex}.private-browsing-icon{flex-shrink:0;font-size:16px}.private-browsing-text{font-weight:500}.toast-container{z-index:2000;pointer-events:none;flex-direction:column;gap:12px;max-width:400px;display:flex;position:fixed;bottom:24px;right:24px}.toast{pointer-events:auto;border-radius:4px;justify-content:space-between;align-items:center;padding:12px 16px;font-size:14px;animation:.3s ease-out slideIn;display:flex;box-shadow:0 2px 8px #00000026}.toast-success{background-color:var(--color-success-bg);color:var(--color-success-text);border-left:4px solid var(--color-success)}.toast-error{background-color:var(--color-error-bg);color:var(--color-error-text);border-left:4px solid var(--color-error)}.toast-warning{background-color:var(--color-warning-bg);color:var(--color-warning-text);border-left:4px solid var(--color-warning)}.toast-info{background-color:var(--color-info-bg);color:var(--color-info-text);border-left:4px solid var(--color-info)}.toast-content{flex:1;align-items:center;gap:12px;display:flex}.toast-icon{flex-shrink:0;font-size:16px;font-weight:600}.toast-message{line-height:1.4}.toast-close{color:inherit;cursor:pointer;opacity:.7;background:0 0;border:none;flex-shrink:0;margin-left:12px;padding:0;font-size:20px;transition:opacity .2s}.toast-close:hover{opacity:1}.toast-close:focus-visible{outline-offset:2px;outline:2px solid}@media (width<=480px){.toast-container{max-width:none;bottom:12px;left:12px;right:12px}.toast{font-size:13px}}.app{background-color:var(--color-bg-primary);grid-template-rows:auto 1fr;grid-template-areas:"header""main";block-size:100vh;inline-size:100vw;display:grid;overflow:hidden}.workspace{--sidebar-width:200px;grid-area:main;grid-template-columns:var(--sidebar-width,200px) 1fr;grid-template-areas:"sidebar canvas";margin-block-start:var(--header-height,113px);transition:grid-template-columns .2s ease-out;display:grid;position:relative;overflow:hidden}.workspace--sidebar-collapsed{--sidebar-width:60px}@media (width<=768px){.workspace{grid-template:"sidebar""canvas"1fr/1fr}}.workspace>*{transition:inline-size var(--transition-base), block-size var(--transition-base)}.confirmation-dialog{background-color:#fff;border:none;border-radius:8px;width:90%;max-width:400px;max-height:80vh;padding:24px;overflow-y:auto;box-shadow:0 4px 16px #0003}.confirmation-dialog::backdrop{background-color:#00000080}.confirmation-dialog-title{color:#1a1a1a;margin:0 0 12px;font-size:18px;font-weight:600}.confirmation-dialog-description{color:#4a4a4a;margin:0 0 24px;font-size:14px;line-height:1.5}.confirmation-dialog-buttons{justify-content:flex-end;gap:12px;display:flex}.confirmation-dialog-form{margin:0;padding:0}.confirmation-dialog-button{cursor:pointer;border:1px solid #ccc;border-radius:4px;padding:8px 16px;font-size:14px;font-weight:500;transition:all .2s}.confirmation-dialog-button:hover{background-color:#f5f5f5}.confirmation-dialog-button:focus{outline-offset:2px;outline:2px solid #06c}.confirmation-dialog-cancel{color:#1a1a1a;background-color:#fff}.confirmation-dialog-cancel:hover{background-color:#f5f5f5}.confirmation-dialog-confirm{color:#fff;background-color:#06c;border-color:#06c}.confirmation-dialog-confirm:hover{background-color:#0052a3}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.editor-toolbar{align-items:center;gap:var(--space-md);padding:4px var(--space-md);background-color:var(--color-bg-secondary);border-block-end:var(--border-width-thin) solid var(--color-border);font-family:var(--font-family-sans);font-size:var(--font-size-sm);color:var(--color-text-primary);flex-flow:wrap;min-block-size:32px;display:flex}.editor-toolbar__section{align-items:center;gap:var(--space-xs);flex-direction:row;display:flex}.editor-toolbar__section--record{margin-inline-end:var(--space-sm)}.editor-toolbar__section--edit-step,.editor-toolbar__section--octave{gap:var(--space-xs)}.editor-toolbar__section--beats{gap:var(--space-xs);align-items:center}.editor-toolbar__section--cursor{flex:1;justify-content:flex-end;min-inline-size:180px}.editor-toolbar__section--follow{margin-inline-start:auto}.editor-toolbar__label{font-size:var(--font-size-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;font-weight:var(--font-weight-medium)}.editor-toolbar__record-button{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);background-color:var(--color-bg-tertiary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-family:var(--font-family-sans);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);cursor:pointer;flex-direction:row;transition:background-color .15s,border-color .15s;display:flex}.editor-toolbar__record-button:hover{background-color:var(--color-bg-primary);border-color:var(--color-border-light)}.editor-toolbar__record-button:focus-visible{outline:var(--border-width-thick) solid var(--color-border-focus);outline-offset:2px}.editor-toolbar__record-button[aria-pressed=true]{background-color:color-mix(in srgb, var(--color-error) 15%, transparent);border-color:var(--color-error);color:var(--color-error)}.editor-toolbar__record-indicator{background-color:var(--color-text-muted);border-radius:50%;block-size:8px;inline-size:8px;transition:background-color .15s;display:block}.editor-toolbar__record-indicator--active{background-color:var(--color-error);animation:1s ease-in-out infinite editor-toolbar__pulse}@keyframes editor-toolbar__pulse{0%,to{opacity:1}50%{opacity:.5}}.editor-toolbar__record-label{font-size:var(--font-size-xs);letter-spacing:.1em}.editor-toolbar__spinner{background-color:var(--color-bg-tertiary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-sm);flex-direction:row;align-items:center;display:flex;overflow:hidden}.editor-toolbar__spinner-button{block-size:28px;inline-size:28px;color:var(--color-text-primary);font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);cursor:pointer;background-color:#0000;border:none;justify-content:center;align-items:center;transition:background-color .15s;display:flex}.editor-toolbar__spinner-button:hover{background-color:var(--color-bg-primary)}.editor-toolbar__spinner-button:focus-visible{outline:var(--border-width-thick) solid var(--color-border-focus);outline-offset:-2px}.editor-toolbar__spinner-button:active{background-color:var(--color-border-light)}.editor-toolbar__spinner-value{min-inline-size:32px;padding-inline:var(--space-xs);font-family:var(--font-family-mono);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-text-primary);background-color:var(--color-bg-secondary);border-inline-start:var(--border-width-thin) solid var(--color-border);border-inline-end:var(--border-width-thin) solid var(--color-border);justify-content:center;align-items:center;display:flex}.editor-toolbar__track-count{font-family:var(--font-family-mono);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-text-primary);text-align:center;min-inline-size:24px;display:none}.editor-toolbar__track-button{background-color:var(--color-bg-tertiary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-sm);block-size:28px;inline-size:28px;color:var(--color-text-primary);font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);cursor:pointer;justify-content:center;align-items:center;transition:background-color .15s,border-color .15s;display:none}.editor-toolbar__track-button:hover:not(:disabled){background-color:var(--color-bg-primary);border-color:var(--color-border-light)}.editor-toolbar__track-button:focus-visible{outline:var(--border-width-thick) solid var(--color-border-focus);outline-offset:2px}.editor-toolbar__track-button:active:not(:disabled){background-color:var(--color-border-light)}.editor-toolbar__track-button:disabled{opacity:.5;cursor:not-allowed}.editor-toolbar__beat-selector{padding:var(--space-xs) var(--space-sm);background-color:var(--color-bg-tertiary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-family:var(--font-family-sans);font-size:var(--font-size-sm);cursor:pointer;transition:background-color .15s,border-color .15s}.editor-toolbar__beat-selector:hover{background-color:var(--color-bg-primary);border-color:var(--color-border-light)}.editor-toolbar__beat-selector:focus-visible{outline:var(--border-width-thick) solid var(--color-border-focus);outline-offset:2px}.editor-toolbar__cursor-display{font-family:var(--font-family-mono);font-size:var(--font-size-xs);color:var(--color-text-secondary);padding:var(--space-xs) var(--space-sm);background-color:var(--color-bg-tertiary);border-radius:var(--radius-sm);border:var(--border-width-thin) solid var(--color-border)}.editor-toolbar__follow-button{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);background-color:var(--color-bg-tertiary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-family:var(--font-family-sans);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);cursor:pointer;flex-direction:row;transition:background-color .15s,border-color .15s;display:flex}.editor-toolbar__follow-button:hover{background-color:var(--color-bg-primary);border-color:var(--color-border-light)}.editor-toolbar__follow-button:focus-visible{outline:var(--border-width-thick) solid var(--color-border-focus);outline-offset:2px}.editor-toolbar__follow-button--active{background-color:color-mix(in srgb, var(--color-primary) 15%, transparent);border-color:var(--color-primary);color:var(--color-primary)}.editor-toolbar__follow-icon{block-size:16px;inline-size:16px;display:block}.editor-toolbar__follow-label{font-size:var(--font-size-xs)}@media (width<=640px){.editor-toolbar{padding:var(--space-xs) var(--space-sm);gap:var(--space-sm)}.editor-toolbar__section--cursor{min-inline-size:unset;flex-basis:100%;order:10;justify-content:center;margin-block-start:var(--space-xs)}.editor-toolbar__label{display:none}}@media (prefers-contrast:high){.editor-toolbar__record-indicator{border:1px solid}.editor-toolbar__spinner-value{border-inline-width:2px}.editor-toolbar__cursor-display{border-width:2px}}@media (prefers-reduced-motion:reduce){.editor-toolbar__record-indicator--active{animation:none}.editor-toolbar__record-button,.editor-toolbar__spinner-button,.editor-toolbar__follow-button{transition:none}}.vu-meter{border-radius:var(--radius-sm);background-color:var(--color-bg-tertiary);border:var(--border-width-thin) solid var(--color-border);block-size:80px;inline-size:24px;display:block;overflow:hidden}.vu-meter:focus-visible{outline:var(--border-width-thick) solid var(--color-focus);outline-offset:2px}.vu-meter--error{background-color:var(--color-bg-tertiary);justify-content:center;align-items:center;display:flex}.vu-meter__error-icon{font-size:var(--font-size-lg);color:var(--color-text-muted)}.vu-meter--no-signal{background-color:var(--color-bg-tertiary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-sm);justify-content:center;align-items:center;display:flex}.vu-meter__no-signal-bars{flex-direction:row;align-items:flex-end;gap:4px;block-size:60px;display:flex}.vu-meter__no-signal-bar{background-color:var(--color-text-muted);opacity:.3;border-radius:1px;block-size:4px;inline-size:8px}@media (prefers-contrast:high){.vu-meter{border-width:2px}.vu-meter--no-signal-bar{opacity:1}}@media (prefers-reduced-motion:reduce){.vu-meter{transition:none}}.tone-track-editor{background-color:var(--color-bg-primary);min-block-size:0;inline-size:100%;font-family:var(--font-family-mono);font-size:var(--font-size-xs);color:var(--color-text-primary);flex-direction:column;flex:1;display:flex;overflow:hidden}.tone-track-editor--editor-layer{box-shadow:inset 0 0 0 2px var(--color-primary);outline:none}.tone-track-editor:focus-visible:not(.tone-track-editor--editor-layer){outline:var(--focus-outline-width) solid var(--focus-outline-color);outline-offset:calc(-1 * var(--focus-outline-offset))}.tone-track-editor__status-bar{align-items:center;gap:var(--space-xs);padding-block:0;padding-inline:var(--space-sm);background-color:var(--color-bg-secondary);border-block-start:var(--border-width-thin) solid var(--color-border);block-size:24px;min-block-size:24px;font-family:var(--font-family-mono);font-size:var(--font-size-xs);color:var(--color-text-secondary);-webkit-user-select:none;user-select:none;flex-direction:row;flex-shrink:0;display:flex;overflow:hidden}.tone-track-editor__status-divider{color:var(--color-border-light);padding-inline:var(--space-xs)}.tone-track-editor__status-label{color:var(--color-text-muted);font-size:var(--font-size-xs);letter-spacing:.05em}.tone-track-editor__status-value{font-family:var(--font-family-mono);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);color:var(--color-text-primary);text-align:center;min-inline-size:1.5ch}.tone-track-editor__status-pos{font-family:var(--font-family-mono);font-size:var(--font-size-xs);color:var(--color-text-secondary);margin-inline-start:auto}.tone-track-editor__status-btn{border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-sm);block-size:16px;inline-size:16px;color:var(--color-text-secondary);font-size:var(--font-size-xs);cursor:pointer;transition:background-color var(--transition-fast,.15s) ease;background:0 0;justify-content:center;align-items:center;padding:0;line-height:1;display:flex}.tone-track-editor__status-btn:hover{background-color:var(--color-bg-tertiary);color:var(--color-text-primary)}.tone-track-editor__status-btn:focus-visible{outline:var(--border-width-thick) solid var(--color-focus);outline-offset:1px}.tone-track-editor__status-rec{align-items:center;gap:var(--space-xs);padding-inline:var(--space-xs);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-sm);block-size:16px;color:var(--color-text-muted);font-family:var(--font-family-mono);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);letter-spacing:.05em;cursor:pointer;transition:color var(--transition-fast,.15s) ease, border-color var(--transition-fast,.15s) ease;background:0 0;flex-direction:row;display:flex}.tone-track-editor__status-rec:focus-visible{outline:var(--border-width-thick) solid var(--color-focus);outline-offset:1px}.tone-track-editor__status-rec--active{color:var(--color-error);border-color:var(--color-error)}.tone-track-editor__status-dot{background-color:var(--color-text-muted);border-radius:50%;flex-shrink:0;block-size:6px;inline-size:6px;display:block}.tone-track-editor__status-dot--active{background-color:var(--color-error);animation:1s ease-in-out infinite status-dot-pulse}@keyframes status-dot-pulse{0%,to{opacity:1}50%{opacity:.4}}@media (prefers-reduced-motion:reduce){.tone-track-editor__status-dot--active{animation:none}}.pattern-grid{background-color:var(--color-bg-primary);min-block-size:0;inline-size:100%;font-family:var(--font-family-mono);font-size:var(--font-size-xs);line-height:var(--line-height-tight);color:var(--color-text-primary);flex:1 1 0;position:relative;overflow:auto}.pattern-grid:focus-visible{outline:var(--focus-outline-width) solid var(--focus-outline-color);outline-offset:calc(-1 * var(--focus-outline-offset))}.pattern-grid__grid{inline-size:max-content;min-inline-size:100%;font-family:var(--font-family-mono);font-size:var(--font-size-xs);display:block}.pattern-grid__grid>[role=rowgroup]:first-of-type{z-index:5;position:sticky;inset-block-start:0}.pattern-grid__controls-row{background-color:var(--color-bg-secondary);border-block-end:var(--border-width-thin) solid var(--color-border);z-index:5;gap:0;display:grid;position:sticky;inset-block-start:0}.pattern-grid__controls-corner{background-color:var(--color-bg-secondary);z-index:7;position:sticky;inset-inline-start:0}.pattern-grid__track-controls{block-size:44px;padding-block:var(--space-xs);border-inline-start:var(--border-width-thick) solid var(--color-border);font-weight:var(--font-weight-normal);vertical-align:top;grid-column:span 5;padding-inline:0;position:relative;overflow:visible}.pattern-grid__track-controls-inner{align-items:center;gap:var(--space-xs);padding-inline:var(--space-xs);flex-direction:row;block-size:20px;display:flex}.pattern-grid__track-name{font-family:var(--font-family-sans);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);white-space:nowrap;text-overflow:ellipsis;flex:0 auto;line-height:1;overflow:hidden}.pattern-grid__track-instrument-hint{font-family:var(--font-family-sans);font-size:var(--font-size-xs);font-weight:var(--font-weight-normal);color:var(--color-text-muted);white-space:nowrap;text-overflow:ellipsis;flex:1 1 0;line-height:1;overflow:hidden}.pattern-grid__track-vu{flex-shrink:0;align-items:stretch;block-size:20px;inline-size:12px;display:flex;overflow:hidden}.pattern-grid__track-vu canvas,.pattern-grid__track-vu .vu-meter{block-size:20px;inline-size:12px}.pattern-grid__track-edit-controls{align-items:center;gap:var(--space-xs);padding-inline:var(--space-xs);visibility:hidden;flex-direction:row;block-size:20px;display:flex}.pattern-grid--editing .pattern-grid__track-edit-controls{visibility:visible}.pattern-grid__mute-btn{background-color:var(--color-bg-tertiary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-sm);block-size:18px;color:var(--color-text-secondary);font-family:var(--font-family-sans);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);cursor:pointer;transition:background-color var(--transition-fast,.15s) ease, border-color var(--transition-fast,.15s) ease, color var(--transition-fast,.15s) ease;flex:1;justify-content:center;align-items:center;display:flex}.pattern-grid__mute-btn:hover{background-color:var(--color-bg-primary);border-color:var(--color-border-light);color:var(--color-text-primary)}.pattern-grid__mute-btn:focus-visible{outline:var(--border-width-thick) solid var(--color-focus);outline-offset:2px}.pattern-grid__mute-btn--active{background-color:var(--color-error);border-color:var(--color-error);color:var(--color-bg-primary)}.pattern-grid__mute-btn--active:hover{background-color:color-mix(in srgb, var(--color-error) 80%, white);border-color:color-mix(in srgb, var(--color-error) 80%, white);color:var(--color-bg-primary)}.pattern-grid__solo-btn{background-color:var(--color-bg-tertiary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-sm);block-size:18px;color:var(--color-text-secondary);font-family:var(--font-family-sans);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);cursor:pointer;transition:background-color var(--transition-fast,.15s) ease, border-color var(--transition-fast,.15s) ease, color var(--transition-fast,.15s) ease;flex:1;justify-content:center;align-items:center;display:flex}.pattern-grid__solo-btn:hover{background-color:var(--color-bg-primary);border-color:var(--color-border-light);color:var(--color-text-primary)}.pattern-grid__solo-btn:focus-visible{outline:var(--border-width-thick) solid var(--color-focus);outline-offset:2px}.pattern-grid__solo-btn--active{background-color:var(--color-warning);border-color:var(--color-warning);color:var(--color-bg-primary)}.pattern-grid__solo-btn--active:hover{background-color:color-mix(in srgb, var(--color-warning) 80%, white);border-color:color-mix(in srgb, var(--color-warning) 80%, white);color:var(--color-bg-primary)}.pattern-grid__header-row{background-color:var(--color-bg-tertiary);border-block-end:var(--border-width-thick) solid var(--color-border);z-index:4;gap:0;display:grid;position:sticky;inset-block-start:44px;inset-inline-start:0}.pattern-grid__row-number-header{inline-size:32px;min-inline-size:32px;padding-block:var(--space-sm);padding-inline:var(--space-xs);text-align:center;color:var(--color-text-muted);font-size:var(--font-size-xs);font-weight:var(--font-weight-normal);border-inline-end:var(--border-width-thin) solid var(--color-border);background-color:var(--color-bg-tertiary);z-index:6;position:sticky;inset-inline-start:0}.pattern-grid__track-header{inline-size:calc(16ch + 40px);min-inline-size:calc(16ch + 40px);padding-block:var(--space-sm);border-inline-start:var(--border-width-thick) solid var(--color-border);text-align:start;font-weight:var(--font-weight-normal);font-family:var(--font-family-mono);font-size:var(--font-size-xs);padding-inline:0}.pattern-grid__track-label{padding-inline:var(--space-xs);color:var(--color-text-secondary);font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.05em;padding-block-end:var(--space-xs);display:block}.pattern-grid__column-labels{grid-template-columns:calc(4ch + 8px) calc(3ch + 8px) calc(3ch + 8px) calc(3ch + 8px) calc(3ch + 8px);gap:0;display:grid}.pattern-grid__column-label{font-size:var(--font-size-xs);color:var(--color-text-muted);text-align:center;padding-block:var(--space-xs);white-space:nowrap;padding-inline:0;overflow:hidden}.pattern-grid__row{border-block-end:var(--border-width-thin) solid var(--color-border);gap:0;display:grid}.pattern-grid__row:nth-child(4n+2){background-color:var(--color-bg-secondary)}.pattern-grid__row:nth-child(4n+4){background-color:var(--color-bg-primary)}.pattern-grid__row--playing{background-color:color-mix(in srgb, var(--color-primary) 20%, transparent);position:relative}.pattern-grid__row--playing:before{content:"";background-color:var(--color-primary);z-index:1;block-size:2px;position:absolute;inset-block-start:0;inset-inline:0}.pattern-grid__row-number{inline-size:32px;min-inline-size:32px;padding-block:var(--space-xs);padding-inline:var(--space-xs);text-align:end;color:var(--color-text-muted);background-color:var(--color-bg-secondary);border-inline-end:var(--border-width-thin) solid var(--color-border);font-size:var(--font-size-xs);font-weight:var(--font-weight-normal);white-space:nowrap;-webkit-user-select:none;user-select:none;z-index:2;position:sticky;inset-inline-start:0}.pattern-grid__row:first-of-type .pattern-grid__row-number{color:var(--color-text-secondary);font-weight:var(--font-weight-bold)}.pattern-grid__track-cell{border-inline-start:var(--border-width-thick) solid var(--color-border);inline-size:calc(16ch + 40px);min-inline-size:calc(16ch + 40px);padding-block:0;padding-inline:0}.pattern-grid__track-cell-inner{grid-template-columns:calc(4ch + 8px) calc(3ch + 8px) calc(3ch + 8px) calc(3ch + 8px) calc(3ch + 8px);gap:0;inline-size:100%;display:grid}.pattern-grid__cell{padding-block:var(--space-xs);padding-inline:var(--space-xs);text-align:center;font-family:var(--font-family-mono);font-size:var(--font-size-xs);line-height:var(--line-height-tight);cursor:default;white-space:nowrap;background:0 0;border:none;border-radius:0;justify-content:center;align-items:center;min-inline-size:0;display:flex;position:relative;overflow:hidden}.pattern-grid__cell--note{border-inline-start:var(--border-width-thick) solid var(--color-border);min-inline-size:calc(4ch + 8px)}.pattern-grid__cell--instrument,.pattern-grid__cell--volume,.pattern-grid__cell--panning,.pattern-grid__cell--effect{min-inline-size:calc(3ch + 8px)}.pattern-grid__cell:hover{background-color:color-mix(in srgb, var(--color-bg-elevated) 50%, transparent)}.pattern-grid__cell--drag-preview{background-color:var(--cell-drag-preview-bg,#2563eb33)}.pattern-grid__cell--focused,.pattern-grid__cell--focused:hover{background-color:var(--color-primary);color:var(--color-text-primary);outline:var(--focus-outline-width) solid var(--color-primary);outline-offset:calc(-1 * var(--focus-outline-width));z-index:1}.pattern-grid__cell--selected{background-color:color-mix(in srgb, var(--color-secondary) 25%, transparent);position:relative}.pattern-grid__cell--selected:after{content:"";border:var(--border-width-thin) solid var(--color-secondary);pointer-events:none;position:absolute;inset:0}.pattern-grid__cell--focused.pattern-grid__cell--selected,.pattern-grid__cell--focused.pattern-grid__cell--selected:hover{background-color:var(--color-primary)}.pattern-grid__cell-value{text-align:center;inline-size:100%;display:block}.pattern-grid__cell--note .pattern-grid__cell-value{color:var(--color-primary);font-weight:var(--font-weight-bold);letter-spacing:-.02em}.pattern-grid__cell--instrument .pattern-grid__cell-value{color:var(--color-secondary)}.pattern-grid__cell--volume .pattern-grid__cell-value{color:var(--color-success)}.pattern-grid__cell--panning .pattern-grid__cell-value{color:var(--color-warning)}.pattern-grid__cell--effect .pattern-grid__cell-value{color:var(--color-info);font-weight:var(--font-weight-normal);letter-spacing:.02em}.pattern-grid__cell-value--empty{color:var(--color-text-muted);opacity:.5}.pattern-grid__cell--dangling{background-color:color-mix(in srgb, var(--color-warning) 15%, transparent);position:relative}.pattern-grid__cell--dangling:after{content:"";background-color:var(--color-warning);pointer-events:none;block-size:2px;position:absolute;inset-block-end:0;inset-inline:0}.pattern-grid__cell--dangling .pattern-grid__cell-value{color:var(--color-warning)}.pattern-grid__cell--focused.pattern-grid__cell--dangling .pattern-grid__cell-value,.pattern-grid__cell--focused .pattern-grid__cell-value{color:var(--color-text-primary)}.pattern-grid::-webkit-scrollbar{inline-size:var(--space-sm);block-size:var(--space-sm)}.pattern-grid::-webkit-scrollbar-track{background:var(--color-bg-secondary)}.pattern-grid::-webkit-scrollbar-thumb{background:var(--color-bg-tertiary);border-radius:var(--radius-sm)}.pattern-grid::-webkit-scrollbar-thumb:hover{background:var(--color-border-light)}.pattern-grid__sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.tone-track-node{background-color:var(--color-bg-secondary);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);-webkit-user-select:none;user-select:none;flex-direction:column;display:flex;position:relative}.tone-track-node--error{background-color:color-mix(in srgb, var(--color-error) 10%, transparent);border-color:var(--color-error)}.tone-track-node__error-content{padding:var(--space-md);justify-content:center;align-items:center;gap:var(--space-sm);flex-direction:column;block-size:100%;inline-size:100%;display:flex}.tone-track-node__error-icon{font-size:var(--font-size-xl)}.tone-track-node__error-message{font-size:var(--font-size-xs);color:var(--color-error);text-align:center}.tone-track-node[data-collapsed]{min-block-size:0;overflow:visible}.tone-track-node__viewport{background-color:var(--color-bg-primary);border-block-start:var(--border-width-thin) solid var(--color-border);block-size:400px;inline-size:100%;display:block;overflow:auto}.tone-track-node__grid{border-collapse:collapse;table-layout:fixed;inline-size:100%;font-family:var(--font-family-mono);font-size:var(--font-size-xs);color:var(--color-text-primary)}.tone-track-node__thead{z-index:2;background-color:var(--color-bg-tertiary);position:sticky;inset-block-start:0}.tone-track-node__header-row{background-color:var(--color-bg-tertiary);border-block-end:var(--border-width-thick) solid var(--color-border)}.tone-track-node__row-number-header{padding:var(--space-sm);text-align:center;font-weight:var(--font-weight-bold);inline-size:48px;min-inline-size:48px}.tone-track-node__track-header{inline-size:calc(13ch + 40px);min-inline-size:calc(13ch + 40px);padding-block:var(--space-sm);border-inline-start:var(--border-width-thin) solid var(--color-border);padding-inline:0}.tone-track-node__track-label{color:var(--color-text-secondary);margin-block-end:var(--space-xs);padding-inline-start:var(--space-xs)}.tone-track-node__column-labels{grid-template-columns:calc(3ch + 8px) calc(2ch + 8px) calc(2ch + 8px) calc(2ch + 8px) calc(3ch + 8px);gap:0;display:grid}.tone-track-node__column-label{font-size:var(--font-size-xs);color:var(--color-text-muted);text-align:center}.tone-track-node__row{border-block-end:var(--border-width-thin) solid var(--color-border)}.tone-track-node__row:hover{background-color:var(--color-bg-tertiary)}.tone-track-node__row-number{padding:var(--space-sm);text-align:center;font-weight:var(--font-weight-bold);color:var(--color-text-secondary);background-color:var(--color-bg-secondary);inline-size:48px;min-inline-size:48px}.tone-track-node__track-cell{border-inline-start:var(--border-width-thin) solid var(--color-border);inline-size:calc(13ch + 40px);min-inline-size:calc(13ch + 40px);padding-block:1px;padding-inline:0}.tone-track-node__track-cell-inner{grid-template-columns:calc(3ch + 8px) calc(2ch + 8px) calc(2ch + 8px) calc(2ch + 8px) calc(3ch + 8px);align-items:center;gap:0;display:grid}.tone-track-node__cell-value{text-align:center;font-family:var(--font-family-mono);font-size:var(--font-size-xs);white-space:nowrap;display:block;overflow:hidden}.tone-track-node__cell-value--note{color:var(--color-primary);font-weight:var(--font-weight-bold)}.tone-track-node__cell-value--instrument{color:var(--color-secondary)}.tone-track-node__cell-value--volume{color:var(--color-text-primary)}.tone-track-node__cell-value--panning{color:var(--color-text-secondary)}.tone-track-node__cell-value--effect{color:var(--color-info);font-weight:var(--font-weight-normal)}.tone-track-node__viewport::-webkit-scrollbar{block-size:8px;inline-size:8px}.tone-track-node__viewport::-webkit-scrollbar-track{background:var(--color-bg-secondary)}.tone-track-node__viewport::-webkit-scrollbar-thumb{background:var(--color-bg-tertiary);border-radius:var(--radius-sm)}.tone-track-node__viewport::-webkit-scrollbar-thumb:hover{background:var(--color-border-light)}.tone-track-node__instrument-summary{padding-block:var(--space-xs);padding-inline:var(--space-sm);background-color:var(--color-bg-tertiary);border-block-end:var(--border-width-thin) solid var(--color-border);font-family:var(--font-family-mono);font-size:var(--font-size-xs);color:var(--color-text-secondary);white-space:nowrap;text-overflow:ellipsis;align-items:center;display:flex;overflow:hidden}.tone-track-node__instrument-summary--dangling{border-inline-start:3px solid var(--color-warning)}.tone-track-node__instrument-summary-text{text-overflow:ellipsis;overflow:hidden}@font-face{font-family:JetBrains Mono;src:url(https://cdn.jsdelivr.net/fontsource/fonts/jetbrains-mono@latest/latin-400-normal.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:JetBrains Mono;src:url(https://cdn.jsdelivr.net/fontsource/fonts/jetbrains-mono@latest/latin-700-normal.woff2)format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Space Mono;src:url(https://cdn.jsdelivr.net/fontsource/fonts/space-mono@latest/latin-400-normal.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Space Mono;src:url(https://cdn.jsdelivr.net/fontsource/fonts/space-mono@latest/latin-700-normal.woff2)format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Manrope;src:url(https://cdn.jsdelivr.net/fontsource/fonts/manrope@latest/latin-400-normal.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Manrope;src:url(https://cdn.jsdelivr.net/fontsource/fonts/manrope@latest/latin-600-normal.woff2)format("woff2");font-weight:600;font-style:normal;font-display:swap}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--font-family-sans:"Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-family-node:"Space Mono", "Courier New", Courier, monospace;--font-family-mono:"JetBrains Mono", "Courier New", Courier, monospace;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-md:1.125rem;--font-size-lg:1.25rem;--font-size-xl:1.5rem;--font-size-2xl:2rem;--font-fluid-xs:clamp(.75rem, .5vw + .625rem, .875rem);--font-fluid-sm:clamp(.875rem, .75vw + .75rem, 1rem);--font-fluid-base:clamp(1rem, 1vw + .875rem, 1.125rem);--font-fluid-md:clamp(1.125rem, 1.25vw + 1rem, 1.25rem);--font-fluid-lg:clamp(1.25rem, 1.5vw + 1.125rem, 1.5rem);--font-fluid-xl:clamp(1.5rem, 2vw + 1.25rem, 2rem);--font-fluid-2xl:clamp(2rem, 3vw + 1.5rem, 2.5rem);--font-weight-normal:400;--font-weight-medium:500;--font-weight-bold:700;--line-height-tight:1.2;--line-height-base:1.5;--line-height-relaxed:1.6;--color-primary:#39f;--color-primary-hover:#0080ff;--color-primary-active:#06c;--color-secondary:#0ff;--color-secondary-hover:#0cc;--color-success:#0c0;--color-warning:#f93;--color-error:#ff1a8c;--color-danger:#f65555;--color-danger-hover:#f655551f;--color-info:#a64cff;--color-bg-primary:#16181d;--color-bg-secondary:#21242c;--color-bg-tertiary:#2b303b;--color-bg-elevated:#363d49;--color-text-primary:#f2f2f2;--color-text-secondary:#bfbfbf;--color-text-muted:#8c8c8c;--color-text-disabled:#666;--color-border:#626d84;--color-border-light:#6c7993;--color-border-focus:var(--color-primary);--color-node-machine:#fa3899;--color-node-machine-bg:#ae0459;--color-node-timeline:#39f;--color-node-timeline-bg:#06c;--color-node-effects:#0ff;--color-node-effects-bg:#099;--color-node-generator:#00e600;--color-node-generator-bg:#008f00;--color-node-mixer:#ffff1a;--color-node-mixer-bg:#b3b300;--color-node-output:#f93;--color-node-output-bg:#c60;--color-node-utility:#a651fb;--color-node-utility-bg:#6605c7;--space-unit:.5rem;--space-xs:calc(var(--space-unit) * .5);--space-sm:var(--space-unit);--space-md:calc(var(--space-unit) * 2);--space-lg:calc(var(--space-unit) * 3);--space-xl:calc(var(--space-unit) * 4);--space-2xl:calc(var(--space-unit) * 6);--space-3xl:calc(var(--space-unit) * 8);--space-fluid-sm:clamp(.5rem, 1vw, 1rem);--space-fluid-md:clamp(1rem, 2vw, 2rem);--space-fluid-lg:clamp(1.5rem, 3vw, 3rem);--space-fluid-xl:clamp(2rem, 5vw, 5rem);--touch-target-min:2.75rem;--touch-target-comfortable:3rem;--touch-spacing-min:.5rem;--border-width-thin:1px;--border-width-thick:2px;--radius-none:0;--radius-sm:2px;--radius-md:4px;--radius-lg:6px;--border-bevel-light:inset 1px 1px 0 #ffffff1a;--border-bevel-dark:inset -1px -1px 0 #0000004d;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 2px 4px #0000004d;--shadow-lg:0 4px 8px #0006;--shadow-focus:0 0 0 2px var(--color-border-focus);--duration-instant:50ms;--duration-fast:.15s;--duration-base:.2s;--duration-slow:.3s;--ease-in:cubic-bezier(.4, 0, 1, 1);--ease-out:cubic-bezier(0, 0, .2, 1);--ease-in-out:cubic-bezier(.4, 0, .2, 1);--z-menu:1000;--z-modal:2000;--z-tooltip:3000;--focus-outline-width:2px;--focus-outline-offset:2px;--focus-outline-color:var(--color-primary);font-family:var(--font-family-sans);line-height:var(--line-height-base);font-weight:var(--font-weight-normal);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{box-sizing:border-box;margin:0;padding:0}:before,:after{box-sizing:border-box}body{background-color:var(--color-bg-primary);min-width:320px;min-height:100vh;color:var(--color-text-primary);margin:0;overflow:hidden}#root{width:100%;height:100vh;overflow:hidden}:focus-visible{outline:var(--focus-outline-width) solid var(--focus-outline-color);outline-offset:var(--focus-outline-offset)}::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:var(--color-bg-secondary)}::-webkit-scrollbar-thumb{background:var(--color-bg-tertiary);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--color-border-light)}::selection{background-color:var(--color-accent-primary);color:var(--color-text-primary)}@media (prefers-reduced-motion:reduce){:root{--duration-fast:var(--duration-instant);--duration-base:var(--duration-instant);--duration-slow:var(--duration-instant)}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}