@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=VT323&display=swap";:root{color:#303030;background:#bcbcbc;font-family:Inter,system-ui,Arial,sans-serif}:root:has([data-ui-theme=dark]){background:#1a1a1a}*{box-sizing:border-box}body{color:#303030;background:#bcbcbc;min-width:320px;min-height:100vh;margin:0}body:has([data-ui-theme=dark]){color:#f0f0f0;background:#1a1a1a}button{cursor:pointer;padding:.8rem 1rem;font-size:1rem}main{flex-direction:column;gap:1rem;min-height:100vh;padding:2rem;display:flex}h1,p{margin:0}.app-shell{gap:1.5rem;width:min(100%,82rem);margin:0 auto}.app-shell-header{border-top:2px solid var(--app-color-surface-bright);border-left:2px solid var(--app-color-surface-bright);border-right:2px solid var(--app-color-border-dark);border-bottom:2px solid var(--app-color-border-dark);background:var(--app-color-surface-light);border-radius:10px;justify-content:space-between;align-items:flex-start;gap:1rem;padding:1.25rem;display:flex}.app-shell-eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--app-color-border-dark);margin-bottom:.4rem;font-size:.78rem;display:inline-block}.app-shell-header h1{font-size:clamp(2rem,4vw,3rem)}.app-shell-header p,.app-home-card p{color:var(--app-color-border-dark)}.app-shell-toolbar{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.app-language-switch{align-items:center;gap:.5rem;display:inline-flex}.app-shell-workspace{gap:1rem;display:grid}.app-mode-nav{border-top:2px solid var(--app-color-surface-bright);border-left:2px solid var(--app-color-surface-bright);border-right:2px solid var(--app-color-border-dark);border-bottom:2px solid var(--app-color-border-dark);background:var(--app-color-surface-light);border-radius:10px;flex-wrap:wrap;gap:.75rem;padding:.75rem 1rem;display:flex}.app-mode-summary{border-top:2px solid var(--app-color-surface-bright);border-left:2px solid var(--app-color-surface-bright);border-right:2px solid var(--app-color-border-dark);border-bottom:2px solid var(--app-color-border-dark);background:var(--app-color-surface-light);color:var(--app-color-border-dark);border-radius:10px;justify-content:space-between;gap:1rem;padding:.85rem 1rem;display:flex}.app-view-screen{gap:1rem;display:grid}.app-view-intro,.app-view-panel{border-top:2px solid var(--app-color-surface-bright);border-left:2px solid var(--app-color-surface-bright);border-right:2px solid var(--app-color-border-dark);border-bottom:2px solid var(--app-color-border-dark);background:var(--app-color-surface-light);border-radius:10px;padding:1rem}.app-view-intro h2,.app-view-panel h2{margin:0 0 .6rem}.app-view-panel-feature{min-height:12rem}.app-home-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;display:grid}.app-home-card{border-top:2px solid var(--app-color-surface-bright);border-left:2px solid var(--app-color-surface-bright);border-right:2px solid var(--app-color-border-dark);border-bottom:2px solid var(--app-color-border-dark);background:var(--app-color-surface-light);border-radius:10px;padding:1rem}.app-theme-classic button{color:var(--app-color-text-strong);border-top:2px solid var(--app-color-surface-bright);border-left:2px solid var(--app-color-surface-bright);border-right:2px solid var(--app-color-border-dark);border-bottom:2px solid var(--app-color-border-dark);background:var(--app-color-surface-light);padding:.5rem .8rem}.app-theme-classic button:active,.app-theme-classic .mode-switch-active{border-top:2px solid var(--app-color-border-dark);border-left:2px solid var(--app-color-border-dark);border-right:2px solid var(--app-color-surface-bright);border-bottom:2px solid var(--app-color-surface-bright);background:var(--app-color-surface-mid)}.app-theme-classic select{color:var(--app-color-text-strong);border-top:2px solid var(--app-color-surface-bright);border-left:2px solid var(--app-color-surface-bright);border-right:2px solid var(--app-color-border-dark);border-bottom:2px solid var(--app-color-border-dark);background:var(--app-color-surface-light);padding:.35rem .5rem}.app-home-card h2{margin:0 0 .6rem;font-size:1.1rem}.audio-lab{background:#181818;border:1px solid #343434;border-radius:8px;gap:1rem;width:min(100%,76rem);margin-top:1rem;padding:1rem;display:grid}.timeline-workspace{align-content:start;gap:.85rem;display:grid}.control-group{gap:.4rem;display:grid}.project-summary{grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;display:grid}.project-summary>div{background:#111;border:1px solid #303030;border-radius:6px;gap:.2rem;padding:.75rem;display:grid}.project-label{color:var(--ui-color-text-muted);font-size:.8rem}.project-message{color:var(--ui-color-text-muted);margin:0}.project-editors{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;display:grid}.track-controls{grid-template-columns:minmax(0,1fr) auto auto;align-items:end;gap:.75rem;display:grid}.mode-switch{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;display:grid}.mode-switch button,.recorded-note-remove{color:#f5f5f5;background:#101010;border:1px solid #444;border-radius:6px;padding:.65rem .7rem}.mode-switch-active{border-color:#ff3150;box-shadow:inset 0 -.2rem #ff3150}.control-group label{color:#cfcfcf;font-size:.9rem}select,input,button{font:inherit}select,input[type=text]{color:#f5f5f5;background:#101010;border:1px solid #444;border-radius:6px;width:100%;padding:.65rem .7rem}.actions{flex-wrap:wrap;gap:.75rem;display:flex}.track-envelope{background:#111;border:1px solid #303030;border-radius:6px;gap:.75rem;padding:.75rem;display:grid}.track-envelope h2{margin:0;font-size:1rem;font-weight:600}.track-mix,.track-automation{background:#111;border:1px solid #303030;border-radius:6px;gap:.75rem;padding:.75rem;display:grid}.track-mix h2,.track-automation h2{margin:0;font-size:1rem;font-weight:600}.track-mix-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;display:flex}.track-mix-toggles{flex-wrap:wrap;gap:.5rem;display:flex}.track-mix-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;display:grid}.track-mix input[type=range]{width:100%}.track-envelope-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;display:grid}.note-editor{background:#111;border:1px solid #303030;border-radius:6px;gap:.75rem;padding:.75rem;display:grid}.note-editor h2{margin:0;font-size:1rem;font-weight:600}.note-editor-grid{grid-template-columns:minmax(0,8rem) repeat(2,minmax(0,1fr));align-items:end;gap:.75rem;display:grid}.note-editor-grid>div{gap:.3rem;display:grid}.timeline-tools{flex-wrap:wrap;align-items:center;gap:.6rem;display:flex}.timeline-snap-toggle{color:#cfcfcf;align-items:center;gap:.4rem;font-size:.9rem;display:inline-flex}.timeline-step-label{color:#cfcfcf;font-size:.9rem}.timeline-tools select{min-width:5.8rem}.history-indicator{color:#a8a8a8;font-size:.85rem}.history-shortcuts{color:#b7b7b7;font-size:.85rem}.history-note-status{font-size:.85rem}.history-note-status-modificada{color:#ff9cab}.history-note-status-sin-cambios{color:#9ecb9f}.drag-status{color:#9a9a9a;font-size:.85rem}.drag-status-active{color:#ffb0be}@media (width<=720px){.app-shell-header,.app-mode-summary,.app-home-grid,.project-summary,.project-editors,.track-controls,.note-editor-grid,.timeline-tools{grid-template-columns:minmax(0,1fr)}.app-shell-header{flex-direction:column;display:flex}.app-mode-summary{flex-direction:column}.track-mix-grid,.track-envelope-grid{grid-template-columns:minmax(0,1fr)}.timeline-tools{flex-direction:column;align-items:stretch;display:flex}}button:disabled{cursor:not-allowed;opacity:.55}.plugin-toast{color:#5f5;letter-spacing:.12em;z-index:9999;pointer-events:none;white-space:nowrap;background:#0d2b0d;border:1px solid #3f3;padding:.45rem 1.25rem;font-family:Courier New,Courier,monospace;font-size:.72rem;animation:.15s ease-out plugin-toast-in;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%)}@keyframes plugin-toast-in{0%{opacity:0;transform:translate(-50%)translateY(8px)}to{opacity:1;transform:translate(-50%)translateY(0)}}:root,[data-ui-theme=light]{--ui-color-text:#303030;--ui-color-text-muted:#686868;--ui-color-accent:#c82828;--ui-color-accent-soft:#e24b32;--ui-color-surface:#ffffff85;--ui-color-surface-raised:#f8f8f8f0;--ui-color-surface-inset:#ede8e2d1;--ui-color-border:#b8b0a8b8;--ui-color-border-strong:#9b938ae0;--ui-btn-bg:linear-gradient(180deg, #fafafaf2, #eaeaeafa);--ui-btn-shadow:inset 0 1px 0 #ffffffb8;--ui-btn-active-bg:linear-gradient(180deg, #e1dad0f5, #f6f2ece6);--ui-btn-active-shadow:inset 0 2px 4px #9b938a29, 0 0 0 1px #e24b321f;--ui-toggle-off:#b8b0a8b8;--ui-toggle-on:#34a853;--ui-toggle-thumb:#fff;--ui-smc-accent-kick:#c95d54;--ui-smc-accent-snare:#d2a255;--ui-smc-accent-hat:#88b06b;--ui-smc-accent-clap:#5ba3b9;--ui-smc-accent-perc:#9b938ae0;--ui-radius-sm:.7rem;--ui-radius-md:1rem;--ui-radius-lg:1.35rem;--ui-radius-pill:999px}[data-ui-theme=dark]{--ui-color-text:#f0f0f0;--ui-color-text-muted:#a0a0a0;--ui-color-accent:#ff3150;--ui-color-accent-soft:#ff6b84;--ui-color-surface:#242424f2;--ui-color-surface-raised:#2e2e2efa;--ui-color-surface-inset:#141414eb;--ui-color-border:#444444e0;--ui-color-border-strong:#5c5c5cf5;--ui-btn-bg:linear-gradient(180deg, #363636fa, #262626fa);--ui-btn-shadow:inset 0 1px 0 #ffffff0f;--ui-btn-active-bg:linear-gradient(180deg, #181818fa, #282828f5);--ui-btn-active-shadow:inset 0 2px 4px #00000052, 0 0 0 1px #ff315029;--ui-toggle-off:#484848e0;--ui-toggle-on:#4caf50;--ui-toggle-thumb:#d8d8d8;--ui-smc-accent-kick:#e07060;--ui-smc-accent-snare:#e0b468;--ui-smc-accent-hat:#96c47a;--ui-smc-accent-clap:#6ab8d0;--ui-smc-accent-perc:#787878b8}.ui-badge{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-sm);background:var(--ui-btn-bg);width:2.35rem;height:2.35rem;box-shadow:var(--ui-btn-shadow);color:var(--ui-color-text);letter-spacing:.02em;-webkit-user-select:none;user-select:none;flex-shrink:0;place-items:center;font-size:.8rem;font-weight:700;display:grid}.ui-toggle{cursor:pointer;align-items:center;display:inline-flex;position:relative}.ui-toggle input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.ui-toggle span{border-radius:var(--ui-radius-pill);background:var(--ui-toggle-off);border:1px solid var(--ui-color-border);align-items:center;width:2.6rem;height:1.5rem;padding:.15rem;transition:background .16s,border-color .16s;display:inline-flex}.ui-toggle span:after{content:"";background:var(--ui-toggle-thumb);border-radius:50%;flex-shrink:0;width:1.1rem;height:1.1rem;transition:transform .16s;display:block;box-shadow:0 1px 3px #00000038}.ui-toggle input:checked+span{background:var(--ui-toggle-on);border-color:var(--ui-toggle-on)}.ui-toggle input:checked+span:after{transform:translate(1.1rem)}.ui-toggle input:focus-visible+span{outline:2px solid var(--ui-color-accent);outline-offset:2px}.ui-checkbox{cursor:pointer;justify-content:center;align-items:center;display:inline-flex;position:relative}.ui-checkbox input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.ui-checkbox span{border:1px solid var(--ui-color-border-strong);background:var(--ui-color-surface-raised);border-radius:.28rem;width:1.25rem;height:1.25rem;transition:background .12s}.ui-checkbox input:checked+span{background:linear-gradient(135deg, transparent 43%, var(--ui-color-text) 43%, var(--ui-color-text) 57%, transparent 57%), linear-gradient(45deg, transparent 54%, var(--ui-color-text) 54%, var(--ui-color-text) 68%, transparent 68%), var(--ui-color-surface-raised)}.ui-checkbox input:focus-visible+span{outline:2px solid var(--ui-color-accent);outline-offset:2px}.ui-list-row{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-md);background:var(--ui-color-surface);color:var(--ui-color-text);text-align:left;cursor:pointer;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:.75rem;width:100%;padding:.75rem .85rem;transition:background .12s;display:grid}.ui-list-row:active{background:var(--ui-color-surface-inset)}.ui-list-row-static{cursor:default;grid-template-columns:auto minmax(0,1fr) auto}.ui-list-row-plugin{grid-template-columns:auto minmax(0,1fr) auto auto}.ui-list-row-ext{grid-template-columns:auto minmax(0,1fr) auto auto auto}.ui-icon-btn-danger{color:#e53e3e;opacity:1!important}.ui-icon-btn-danger:hover{color:#c53030}.ui-list-icon{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-sm);background:var(--ui-btn-bg);width:2.35rem;height:2.35rem;box-shadow:var(--ui-btn-shadow);color:var(--ui-color-text);flex-shrink:0;place-items:center;font-size:.95rem;font-weight:700;display:grid}.ui-list-label{color:var(--ui-color-text);font-size:1rem}.ui-list-value{color:var(--ui-color-text-muted);white-space:nowrap;font-size:.9rem}.ui-list-arrow{color:var(--ui-color-text-muted);font-size:1.35rem;line-height:1}.ui-list-section{gap:.45rem;display:grid}.ui-label-muted{letter-spacing:.08em;color:var(--ui-color-text-muted);text-transform:uppercase;font-size:.88rem}.ui-plugin-copy{gap:.1rem;display:grid}.ui-plugin-copy strong{color:var(--ui-color-text);font-size:1rem}.ui-plugin-copy span{color:var(--ui-color-text-muted);font-size:.9rem}.ui-smc-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem;display:grid}.ui-smc-cell{position:relative}.ui-smc-cell .ui-smc-btn{width:100%}.ui-smc-config-btn{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-sm);background:var(--ui-btn-bg);width:1.9rem;height:1.9rem;color:var(--ui-color-text-muted);cursor:pointer;opacity:0;z-index:1;justify-content:center;align-items:center;font-size:1rem;transition:opacity .12s;display:flex;position:absolute;top:.35rem;right:.35rem}.ui-smc-cell:hover .ui-smc-config-btn{opacity:1}.ui-smc-config-btn:hover{color:var(--ui-color-text);background:var(--ui-color-surface-raised)}.ui-pill-btn-active{background:var(--ui-color-accent);color:#fff;border-color:var(--ui-color-accent)}.ui-pad-pager{align-items:center;gap:.25rem;display:flex}.ui-pad-pager-label{color:var(--ui-color-text-muted);text-align:center;font-variant-numeric:tabular-nums;min-width:2.4rem;font-size:.78rem;font-weight:600}.ui-smc-btn{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-md);background:var(--ui-btn-bg);min-height:4.8rem;box-shadow:var(--ui-btn-shadow), inset 0 -.22rem 0 var(--ui-color-border-strong);color:var(--ui-color-text);text-align:left;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;align-content:start;gap:.28rem;padding:.55rem .75rem;transition:transform 90ms,box-shadow 90ms;display:grid}.ui-smc-btn:active{transform:translateY(.1rem)}.ui-smc-btn:disabled{opacity:.45;cursor:not-allowed}.ui-smc-btn:focus-visible{outline:2px solid var(--ui-color-accent);outline-offset:2px}.ui-smc-btn-kick{box-shadow:var(--ui-btn-shadow), inset 0 -.22rem 0 var(--ui-smc-accent-kick)}.ui-smc-btn-snare{box-shadow:var(--ui-btn-shadow), inset 0 -.22rem 0 var(--ui-smc-accent-snare)}.ui-smc-btn-hat{box-shadow:var(--ui-btn-shadow), inset 0 -.22rem 0 var(--ui-smc-accent-hat)}.ui-smc-btn-clap{box-shadow:var(--ui-btn-shadow), inset 0 -.22rem 0 var(--ui-smc-accent-clap)}.ui-smc-btn-perc{box-shadow:var(--ui-btn-shadow), inset 0 -.22rem 0 var(--ui-smc-accent-perc)}.ui-smc-btn-kick:active{box-shadow:var(--ui-btn-active-shadow), inset 0 -.06rem 0 var(--ui-smc-accent-kick)}.ui-smc-btn-snare:active{box-shadow:var(--ui-btn-active-shadow), inset 0 -.06rem 0 var(--ui-smc-accent-snare)}.ui-smc-btn-hat:active{box-shadow:var(--ui-btn-active-shadow), inset 0 -.06rem 0 var(--ui-smc-accent-hat)}.ui-smc-btn-clap:active{box-shadow:var(--ui-btn-active-shadow), inset 0 -.06rem 0 var(--ui-smc-accent-clap)}.ui-smc-btn-perc:active{box-shadow:var(--ui-btn-active-shadow), inset 0 -.06rem 0 var(--ui-smc-accent-perc)}.ui-smc-btn-num{color:var(--ui-color-text-muted);letter-spacing:.06em;text-transform:uppercase;font-size:.68rem;line-height:1}.ui-smc-btn-label{letter-spacing:.04em;text-transform:uppercase;font-size:1rem;font-weight:700;line-height:1}.ui-smc-btn-desc{color:var(--ui-color-text-muted);font-size:.74rem;line-height:1.3}.ui-pill-btn{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-pill);background:var(--ui-btn-bg);box-shadow:var(--ui-btn-shadow);color:var(--ui-color-text);letter-spacing:.02em;cursor:pointer;white-space:nowrap;justify-content:center;align-items:center;gap:.35rem;padding:.52rem .9rem;font-size:.84rem;font-weight:600;transition:background .12s;display:inline-flex}.ui-pill-btn:active,.ui-pill-btn-active{background:var(--ui-btn-active-bg);box-shadow:var(--ui-btn-active-shadow)}.ui-pill-btn-accent{color:var(--ui-color-accent)}.ui-icon-btn{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-pill);background:var(--ui-btn-bg);width:2.35rem;height:2.35rem;box-shadow:var(--ui-btn-shadow);color:var(--ui-color-text);cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:background .12s;display:inline-flex}.ui-icon-btn:active{background:var(--ui-btn-active-bg);box-shadow:var(--ui-btn-active-shadow)}.ui-icon-btn svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.85px;width:1.35rem;height:1.35rem}.ui-counter{grid-template-columns:auto auto auto;align-items:center;gap:.28rem;display:inline-grid}.ui-counter-btn{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-pill);background:var(--ui-btn-bg);width:2rem;height:2rem;box-shadow:var(--ui-btn-shadow);color:var(--ui-color-text);cursor:pointer;justify-content:center;align-items:center;padding:0;font-size:1rem;line-height:1;display:inline-flex}.ui-counter-btn:active{background:var(--ui-btn-active-bg);box-shadow:var(--ui-btn-active-shadow)}.ui-counter-value{text-align:center;min-width:1.5rem;color:var(--ui-color-text);font-size:.9rem;font-weight:700}.ui-track-pill{grid-template-columns:auto minmax(5.5rem,auto) auto;align-items:center;gap:.28rem;display:inline-grid}.ui-track-pill-display{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-md);background:var(--ui-color-surface);box-shadow:var(--ui-btn-shadow);color:var(--ui-color-text);white-space:nowrap;letter-spacing:.02em;place-items:center;padding:.42rem .72rem;font-size:.9rem;font-weight:700;display:grid}.ui-select{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-md);color:var(--ui-color-text);letter-spacing:.02em;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23686868' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"),linear-gradient(#fafafaf2,#eaeaeafa);background-position:right .5rem center,0 0;background-repeat:no-repeat,no-repeat;background-size:1rem,100%;padding:.48rem 2rem .48rem .72rem;font-size:.84rem;font-weight:600;box-shadow:inset 0 1px #ffffffb8}.ui-surface-card{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-lg);background:var(--ui-color-surface);padding:.75rem;overflow:hidden}input[type=range]{accent-color:var(--ui-color-accent);cursor:pointer}.ui-toggle-group{border-radius:var(--ui-radius-pill);background:#00000012;align-items:center;gap:0;padding:.18rem;display:inline-flex}.ui-toggle-group>button{letter-spacing:.06em;border-radius:var(--ui-radius-pill);box-shadow:none;color:var(--ui-color-text-muted);white-space:nowrap;cursor:pointer;background:0 0;border:none;padding:.26rem .72rem;font-size:.7rem;font-weight:700}.ui-toggle-group>button[aria-pressed=true]{color:var(--ui-color-text);background:#fff;box-shadow:0 1px 3px #00000024}[data-ui-theme=dark] .ui-toggle-group>button[aria-pressed=true]{background:var(--ui-color-surface-raised);color:var(--ui-color-text);box-shadow:0 1px 3px #00000052}.ui-chip{border:1px solid var(--ui-color-border-strong);border-radius:var(--ui-radius-pill);background:var(--ui-color-surface-inset);color:var(--ui-color-text-muted);white-space:nowrap;align-items:center;padding:.2rem .5rem;font-size:.75rem;display:inline-flex}.ui-divider{background:var(--ui-color-border);height:1px}.ui-empty-state{color:var(--ui-color-text-muted);text-align:center;flex-direction:column;align-items:center;gap:.35rem;padding:1rem;display:flex}.app-dialog-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:40;background:#50404857;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.app-dialog{color:#303030;background:linear-gradient(#f8f8f8f5,#ebebebfa);border:1px solid #efefeff5;border-radius:1.1rem;flex-direction:column;gap:.9rem;width:min(100%,22rem);max-height:calc(100dvh - 2rem);padding:1rem;display:flex;overflow:hidden;box-shadow:inset 0 1px #ffffffc7,0 .8rem 1.8rem #5a4a5229}.app-dialog-body{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;flex:1;min-height:0;overflow:hidden auto}.app-dialog-copy{gap:.35rem;display:grid}.app-dialog-copy strong{font-size:1.1rem}.app-dialog-copy p{color:var(--ui-color-text-muted);margin:0}.app-dialog-actions{justify-content:flex-end;gap:.45rem;display:flex}.app-dialog-confirm{color:#7b211a}.app-dialog .ui-pill-btn-active{color:#fff;box-shadow:none;background:#1a1a1a}[data-ui-theme=dark] .app-dialog{border-color:var(--ui-color-border);background:var(--ui-color-surface-raised);color:#f0f0f0;box-shadow:inset 0 1px #ffffff0a,0 .8rem 1.8rem #0006}[data-ui-theme=dark] .app-dialog .ui-pill-btn-active{color:#1a1a1a;background:#e0e0e0}[data-ui-theme=dark] .app-dialog-confirm{color:#ff8080}@media (width<=640px){.ui-smc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ui-smc-btn{min-height:5.5rem}}.app-theme-classic{color:var(--app-color-text-strong);font-family:var(--app-font-primary)}.app-shell{gap:.7rem;width:min(100%,96rem);min-height:100dvh;margin:0 auto;padding:.45rem .7rem 1rem}.app-shell.app-theme-classic{flex-direction:column;height:100dvh;display:flex;overflow:hidden}.app-shell-live-content{gap:.55rem;min-height:calc(100dvh - 1rem);display:grid}.app-shell.app-theme-classic>.app-shell-live-content{flex-direction:column;flex:1 1 0;min-height:0;display:flex;overflow:hidden}.app-shell-portrait-blocker{text-align:center;border:1px solid var(--app-color-border-soft);background:linear-gradient(180deg, #ffffffe0, #f3efe9f2), var(--app-color-surface-paper);border-radius:1.35rem;align-content:center;place-items:center;gap:.75rem;min-height:calc(100dvh - 1rem);padding:1.5rem;display:none;box-shadow:inset 0 1px #ffffffb8,0 .9rem 2.4rem #9b938a14}.app-shell-portrait-blocker strong{text-transform:lowercase;font-size:1.2rem}.app-shell-portrait-blocker p{max-width:16rem;color:var(--app-color-text-muted);margin:0}.app-shell-header{justify-content:space-between;align-items:center;gap:.8rem;padding:0 .1rem;display:flex}.app-shell-header-copy{gap:.15rem;display:grid}.app-shell-title{letter-spacing:-.02em;text-transform:lowercase;font-size:.92rem}.app-shell-subtitle{max-width:30rem;color:var(--app-color-text-muted);margin:0;font-size:.78rem}.app-shell-toolbar{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.45rem;display:flex}.app-language-switch{color:var(--app-color-text-muted);align-items:center;gap:.5rem;display:inline-flex}.app-shell-workspace{gap:.55rem;min-height:0;display:grid}.app-shell.app-theme-classic .app-shell-workspace{flex:1 1 0;grid-template-rows:1fr;min-height:0;overflow:hidden}.app-mode-window,.app-home-card,.app-mock-screen{background:linear-gradient(180deg, #f8f8f8f0, #e7e7e7f5), var(--app-color-surface-paper);border:1px solid #efefeff5;border-radius:1.35rem;box-shadow:inset 0 1px #ffffffb8}.app-mode-window{grid-template-rows:auto minmax(0,1fr);display:grid;overflow:hidden}.app-mode-window-header{background:linear-gradient(#efefefeb,#efefefdb);border-bottom:1px solid #e8e8e8f5;justify-content:space-between;align-items:center;gap:1rem;padding:.55rem .85rem .5rem;display:flex}.app-mode-header-actions{align-items:center;gap:.4rem;display:flex}.app-mode-window-brand{letter-spacing:-.04em;font-size:1.2rem;font-weight:600}.app-mode-nav{background:0 0;border:none;flex-wrap:wrap;align-items:center;gap:.1rem;padding:.1rem 0;display:flex}.app-mode-nav button,.app-mode-fullscreen-toggle{border-radius:.85rem;justify-content:center;align-items:center;width:2.85rem;height:2.45rem;padding:0;display:inline-flex}.app-mode-fullscreen-toggle svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.85px;width:1.25rem;height:1.25rem}.app-mode-nav button svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.85px;width:1.3rem;height:1.3rem}.app-theme-classic .app-mode-nav button{box-shadow:none;background:0 0;border:1px solid #0000;border-bottom-width:2px;border-radius:.5rem .5rem 0 0}.app-theme-classic .app-mode-nav button:active{box-shadow:none;background:#0000000d}.app-theme-classic .app-mode-nav .mode-switch-active{box-shadow:none;background:0 0;border-color:#0000 #0000 #c82828;border-bottom-style:solid;border-bottom-width:2px}.app-mode-window-content,.app-view-screen,.app-mock-screen{gap:.85rem;display:grid}.app-mode-window-content{min-height:0;padding:.45rem .7rem .7rem;overflow-y:auto}.app-mock-screen{box-shadow:none;background:0 0;border:0;border-radius:0;align-content:start;padding:0}.app-mock-toolbar{scrollbar-width:none;background:#ffffff85;border:1px solid #efefeff5;border-radius:1.15rem;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:.55rem;padding:.45rem .55rem;display:flex;overflow:auto hidden}.app-mock-toolbar::-webkit-scrollbar{display:none}.app-mock-toolbar .ui-icon-btn{border-radius:.75rem;width:2.15rem;height:2.15rem;padding:0}.app-mock-toolbar .ui-icon-btn svg{width:1.45rem!important;height:1.45rem!important}.app-mock-toolbar select{padding:.3rem .55rem}.app-mock-toolbar-copy{align-items:baseline;gap:.35rem;display:flex}.app-mock-toolbar-copy strong{letter-spacing:.06em;text-transform:uppercase;font-size:.88rem}.app-mock-toolbar-copy span{color:var(--app-color-text-muted);font-size:.8rem}.app-mock-toolbar-actions{flex-wrap:wrap;gap:.6rem;display:flex}.app-mock-toolbar-controls{flex-wrap:nowrap;align-items:center;gap:.6rem;display:flex}.app-mode-window-content:has(.app-edit-lab){flex-direction:column;display:flex;overflow:hidden}.app-mode-window-content:has(.app-edit-lab)>.app-mock-screen{flex-direction:column;flex:1 1 0;min-height:0;display:flex}.app-mode-window-content:has(.app-plugin-workspace-body){flex-direction:column;display:flex;overflow:hidden}.app-mode-window-content:has(.app-plugin-workspace-body)>.app-mock-screen{flex-direction:column;flex:1 1 0;min-height:0;display:flex}.app-plugin-workspace-body{flex-direction:column;flex:1 1 0;min-height:0;display:flex;overflow:hidden}.app-plugin-workspace-empty{color:var(--app-color-text-muted);text-align:center;opacity:.65;margin:auto;padding:2rem 1rem;font-size:.82rem;line-height:1.5}.app-edit-lab .timeline-workspace{flex-direction:column;flex:1 1 0;min-height:0;display:flex}.app-edit-lab .track-timeline-preview,.app-edit-lab .timeline-preview{flex:1 1 0;align-content:start;min-height:0;overflow-y:auto}.edit-note-chip{letter-spacing:.04em;color:var(--app-color-text-strong);white-space:nowrap;background:#00000012;border-radius:999px;padding:.2rem .6rem;font-size:.72rem;font-weight:700}.edit-duration-label{color:var(--app-color-text-muted);white-space:nowrap;text-align:center;min-width:3.2rem;font-size:.75rem;font-weight:600}.edit-note-input{width:4.2rem;color:var(--app-color-text-strong);text-align:right;background:#fff;border:1px solid #00000026;border-radius:6px;padding:.22rem .4rem;font-size:.72rem}.edit-note-input:disabled{opacity:.45}.edit-track-name-input{text-align:left;width:7rem}.edit-mute-solo-btn{letter-spacing:.04em;min-width:1.9rem;min-height:1.9rem;padding:0 .55rem;font-size:.72rem;font-weight:700}.edit-mute-solo-btn-active,.app-theme-classic .edit-mute-solo-btn-active{color:#fff;box-shadow:none;background:#1a1a1a;border-color:#1a1a1a}.edit-settings-track-section{border-top:1px solid #00000014;gap:.6rem;margin-top:.25rem;padding-top:.75rem;display:grid}.edit-settings-track-row{grid-template-columns:4.5rem 1fr 3rem;align-items:center;gap:.5rem;display:grid}.edit-settings-track-label{color:var(--app-color-text-muted);white-space:nowrap;font-size:.82rem}.edit-settings-track-value{color:var(--app-color-text-muted);text-align:right;font-size:.78rem;font-weight:600}.edit-settings-track-row input[type=range]{width:100%}.edit-settings-track-toggles{gap:.4rem;display:flex}.app-edit-lab{flex-direction:column;flex:1 1 0;min-height:0;display:flex;overflow:hidden}.app-project-lab{gap:.8rem;min-height:0;display:grid;overflow:hidden}.app-plugin-list,.app-settings-groups{gap:.8rem;padding-top:.85rem;display:grid}.app-settings-groups{margin-top:.2rem}.app-devtools-section{border-top:1px solid var(--ui-color-border);margin-top:.5rem}.app-devtools-summary{letter-spacing:.06em;text-transform:uppercase;color:var(--app-color-text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;padding:.55rem 1rem;font-size:.75rem;font-weight:600}.app-devtools-summary::-webkit-details-marker{display:none}.app-devtools-summary:before{content:"▸ ";font-size:.7rem}details[open] .app-devtools-summary:before{content:"▾ "}.app-devtools-body{flex-direction:column;gap:.6rem;padding:.4rem 1rem .8rem;display:flex}.app-devtools-warn{color:var(--app-color-text-muted);margin:0;font-size:.75rem;line-height:1.4}.app-settings-toolbar-dark-toggle{min-height:2.15rem;color:var(--app-color-text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.5rem;font-size:.82rem;display:flex}.app-settings-row-volume{cursor:default;grid-template-columns:auto minmax(0,1fr) auto}.app-settings-volume-slider-row{padding-inline:.75rem}.app-settings-volume-slider{width:100%}.app-theme-classic button,.app-theme-classic select{font-family:var(--app-font-primary);border:1px solid var(--app-color-border-soft);background:var(--ui-btn-bg), var(--app-color-surface-paper);box-shadow:var(--ui-btn-shadow);border-radius:.95rem}.app-theme-classic button{color:var(--app-color-text-strong);padding:.58rem .82rem}.app-theme-classic .app-mode-nav button{min-width:0}.app-theme-classic .ui-toggle-group>button{box-shadow:none;color:var(--app-color-text-muted);background:0 0;border:none;padding:.26rem .72rem}.app-theme-classic .ui-toggle-group>button[aria-pressed=true]{color:var(--app-color-text-strong);background:#fff;box-shadow:0 1px 3px #00000024}.app-theme-classic [data-ui-theme=dark] .ui-toggle-group>button[aria-pressed=true]{background:var(--ui-color-surface-raised);color:var(--ui-color-text);box-shadow:0 1px 3px #00000052}.app-theme-classic button:active,.app-theme-classic .mode-switch-active{background:var(--ui-btn-active-bg), var(--app-color-surface-paper-alt);box-shadow:var(--ui-btn-active-shadow)}.app-theme-classic select{color:var(--app-color-text-strong);padding:.48rem .7rem}.app-surface-window{background:radial-gradient(circle at 0 0,#ffffffe0,#0000 34%),linear-gradient(#efefeff5,#eaeaeafa);border:1px solid #efefeff5;border-radius:1.6rem;box-shadow:inset 0 1px #ffffffd1}.app-surface-title-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;display:flex}.app-surface-eyebrow{color:var(--app-color-text-muted);letter-spacing:.08em;text-transform:uppercase;font-size:.86rem}.project-export-body{flex-direction:column;gap:1.6rem;padding:1.2rem 1rem;display:flex;overflow-y:auto}.project-compact-body{align-content:start;gap:.85rem;padding:.85rem .9rem;display:grid}.project-compact-name-row{gap:.3rem;display:grid}.project-compact-label{letter-spacing:.08em;text-transform:uppercase;color:var(--ui-color-text-muted);font-size:.68rem;font-weight:700}input.project-compact-name-input{background:var(--ui-color-surface-raised);border:1px solid var(--ui-color-border);color:var(--ui-color-text);border-radius:.6rem;outline:none;width:100%;padding:.45rem .6rem;font-size:1rem;font-weight:700;box-shadow:inset 0 1px 2px #0000000a}input.project-compact-name-input:focus{border-color:var(--ui-color-accent);box-shadow:0 0 0 2.5px #c828281f}.project-compact-stats{color:var(--ui-color-text-muted);letter-spacing:.01em;margin:0;font-size:.72rem}.project-compact-divider{background:var(--ui-color-border);opacity:.6;height:1px}.project-compact-grid{grid-template-columns:1fr 1fr;gap:.4rem;display:grid}.project-compact-btn-wide{grid-column:span 1}.project-compact-btn-full{grid-column:span 2}.project-export-section{flex-direction:column;gap:.6rem;display:flex}.project-export-name-input{color:var(--app-color-text-strong);background:0 0;border:none;border-bottom:2px solid #0000001f;outline:none;width:100%;padding:.3rem 0;font-size:1.1rem;font-weight:700}.project-export-name-input:focus{border-bottom-color:var(--app-color-accent,#e05)}.project-export-message{color:var(--app-color-text-muted);margin:0;font-size:.78rem}.project-export-actions{flex-direction:column;gap:.5rem;display:flex}.project-export-btn{border-radius:var(--ui-radius-sm);border:1px solid var(--ui-color-border);background:var(--ui-btn-bg);box-shadow:var(--ui-btn-shadow);color:var(--ui-color-text);cursor:pointer;justify-content:center;align-items:center;gap:.45rem;padding:.6rem .85rem;font-size:.8rem;font-weight:600;transition:opacity .1s;display:flex}.project-export-btn svg{opacity:.65;flex-shrink:0}.project-export-btn:hover:not(:disabled){background:var(--ui-btn-active-bg)}.project-export-btn:disabled{opacity:.38;cursor:default}.project-export-btn-play{background:var(--ui-color-text,#303030);color:#fff;border-color:#0000;box-shadow:0 1px 3px #0000002e}.project-export-btn-play svg{opacity:.85}.project-export-btn-primary{background:var(--ui-color-surface-inset);border-color:var(--ui-color-border-strong);color:var(--ui-color-text)}.project-export-btn-reset{border-color:var(--ui-color-border);color:var(--ui-color-text-muted);box-shadow:none;background:0 0}.app-surface-status{color:var(--app-color-text-muted);background:#ffffff8c;border:1px solid #b8b0a8d1;border-radius:999px;padding:.55rem .85rem}.app-surface-note{color:var(--app-color-text-muted)}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}[data-ui-theme=dark]{--app-color-text-strong:var(--ui-color-text);--app-color-text-muted:var(--ui-color-text-muted);--app-color-border-soft:var(--ui-color-border);--app-color-surface-paper:var(--ui-color-surface-raised);--app-color-surface-paper-alt:var(--ui-color-surface-inset);--app-color-accent:var(--ui-color-accent)}[data-ui-theme=dark].app-mode-window{border-color:var(--ui-color-border);background:var(--ui-color-surface-raised);box-shadow:inset 0 1px #ffffff0a}[data-ui-theme=dark] .app-mode-window-header{border-bottom-color:var(--ui-color-border);background:var(--ui-color-surface-inset);color:var(--ui-color-text)}[data-ui-theme=dark] .app-mode-window-brand{color:var(--ui-color-text)}[data-ui-theme=dark] .app-mock-toolbar{border-color:var(--ui-color-border);background:var(--ui-color-surface)}[data-ui-theme=dark] .app-mock-toolbar .ui-toggle-group>button[aria-pressed=true]{color:#fff!important;box-shadow:none!important;background:#ffffff2e!important}[data-ui-theme=dark] .app-surface-status{border-color:var(--ui-color-border);background:var(--ui-color-surface);color:var(--ui-color-text-muted)}[data-ui-theme=dark] .edit-note-input{border-color:var(--ui-color-border);background:var(--ui-color-surface-inset);color:var(--ui-color-text)}[data-ui-theme=dark] .edit-settings-track-section{border-top-color:var(--ui-color-border)}[data-ui-theme=dark] .edit-mute-solo-btn-active,[data-ui-theme=dark] .app-theme-classic .edit-mute-solo-btn-active{color:#1a1a1a;background:#e0e0e0;border-color:#e0e0e0}[data-ui-theme=dark] .app-shell-portrait-blocker{border-color:var(--ui-color-border);background:var(--ui-color-surface-raised);box-shadow:none}@media (width<=900px){.app-shell{width:100%}.app-shell-header,.app-shell-toolbar{flex-direction:column;justify-content:flex-start;align-items:flex-start}.app-mode-window-header{flex-direction:column;align-items:flex-start}.app-mode-header-actions{justify-content:space-between;width:100%}}@media (width<=720px){.app-shell{padding:.35rem .45rem .8rem}.app-mode-window,.app-mock-screen,.app-mode-nav button{border-radius:1.1rem}.app-mode-window-content{padding:.6rem .7rem .7rem}.app-plugin-row,.app-settings-row{grid-template-columns:auto minmax(0,1fr)}.app-plugin-toggle,.app-plugin-arrow,.app-settings-row-value,.app-settings-row-arrow{justify-self:start}.app-shell-subtitle{display:none}}@media (width<=720px) and (orientation:portrait){.app-shell-live-content,.app-shell.app-theme-classic>.app-shell-live-content{display:none}.app-shell-portrait-blocker{display:grid}}@media (height<=430px) and (orientation:landscape){.app-shell{padding:.22rem .35rem .35rem}.app-shell-live-content{gap:.35rem;min-height:calc(100dvh - .57rem)}.app-shell-header{gap:.45rem}.app-shell-title{font-size:.8rem}.app-shell-subtitle{display:none}.app-shell-toolbar button{min-height:2.1rem;padding:.42rem .72rem}.app-mode-window-header{padding:.55rem .8rem .5rem}.app-mode-window-brand{font-size:1.25rem}.app-mode-nav{gap:.28rem}.app-mode-nav button,.app-mode-fullscreen-toggle{width:2.7rem;height:2.35rem}.app-mode-window-content{padding:.45rem .6rem .55rem}.app-mock-toolbar{padding-bottom:.45rem}}.perform-workspace{gap:.35rem;min-height:0;display:grid}.perform-workspace-shell{min-height:0;overflow:hidden}.perform-workspace-body{grid-template-columns:minmax(0,1fr);gap:.45rem;min-height:0;padding:0;display:grid}.perform-workspace-primary,.perform-workspace-secondary{align-content:start;gap:.45rem;min-height:0;display:grid}.perform-workspace-secondary{grid-template-rows:auto auto auto 1fr}.perform-workspace-secondary-hidden{display:none}.perform-workspace-card{background:#ffffff85;border:1px solid #efefeff5;border-radius:1.15rem;padding:.55rem}.perform-mode-toolbar-card{padding:.45rem .55rem}.perform-mode-toolbar-bar{justify-content:flex-start;padding:.45rem .55rem}.perform-mode-toolbar{grid-template-columns:auto max-content max-content max-content;justify-content:space-between;align-items:center;gap:.55rem;display:grid}.perform-mode-transport-group{align-items:center;gap:.55rem;display:inline-flex}.perform-mode-transport-divider{background:#0000001a;flex-shrink:0;width:1px;height:1.4rem;display:inline-block}.perform-mode-transport{grid-template-columns:repeat(2,auto);gap:.35rem;display:inline-grid}.perform-mode-arp-toggle{letter-spacing:.04em;color:var(--app-color-text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;align-self:center;align-items:center;gap:.35rem;font-size:.72rem;font-weight:700;display:inline-flex}.perform-mode-transport-button{color:#575757;border-radius:999px;justify-content:center;align-items:center;width:2.25rem;height:2.25rem;padding:0;display:inline-flex}.perform-mode-transport-icon{justify-content:center;align-items:center;width:1.35rem;height:1.35rem;display:inline-flex}.perform-mode-transport-glyph{line-height:1;display:inline-block;transform:translateY(-.02rem)}.perform-mode-transport-glyph-record{color:#c82828;font-size:1.15rem}.perform-mode-transport-glyph-stop{color:#575757;font-size:.9rem}.perform-mode-transport-glyph-play{color:#575757;font-size:1.1rem;transform:translate(.08rem)}.perform-mode-transport-button-active{background:linear-gradient(180deg, #e4ded6fa, #f7f3eef0), var(--app-color-surface-paper-alt)}.perform-workspace-card h3{margin:0 0 .35rem;font-size:1.05rem}.perform-workspace-card p{color:var(--app-color-text-muted);margin:0}.perform-mode-track-strip{grid-template-columns:auto minmax(0,1fr) auto auto auto;align-items:center;gap:.75rem;display:grid}.perform-mode-track-strip-primary{grid-template-columns:2.15rem minmax(6.8rem,7.8rem) 2.15rem;justify-self:auto;align-items:center;gap:.35rem}.perform-mode-track-strip-primary>button{border-radius:.75rem;justify-self:center;width:2.15rem;height:2.15rem;padding:0}.perform-mode-track-display{background:#ffffff9e;border:1px solid #d2cec9e0;border-radius:1rem;justify-items:center;gap:.18rem;padding:.8rem 1rem;display:grid}.perform-mode-track-display span{color:var(--app-color-text-muted);letter-spacing:.06em;text-transform:uppercase;font-size:.88rem}.perform-mode-track-display strong{font-size:1.15rem;line-height:1}.perform-mode-track-display-compact{width:100%;min-height:2.25rem;padding:.42rem .72rem}.perform-mode-track-display-compact strong{font-size:.9rem}.perform-mode-instrument-button,.perform-mode-add-track{letter-spacing:.02em;min-height:2.25rem;padding-inline:.8rem;font-size:.78rem;line-height:1}.perform-mode-track-actions{grid-template-columns:auto auto auto;align-items:center;gap:.32rem;display:inline-grid}.perform-mode-instrument-button{text-overflow:ellipsis;white-space:nowrap;max-width:8.6rem;overflow:hidden}.perform-mode-remove-track{color:#595959;border-radius:.75rem;justify-content:center;align-items:center;width:2.25rem;min-width:2.25rem;min-height:2.25rem;padding:0;display:inline-flex}.perform-mode-remove-track svg{width:1.1rem;height:1.1rem}.app-theme-classic .perform-mode-remove-track{color:#595959;border-radius:.75rem;padding:0}.perform-mode-octave-cluster{grid-template-columns:auto auto;align-self:center;align-items:center;gap:.35rem;min-width:max-content;display:inline-grid}.perform-mode-octave-label{color:var(--app-color-text-muted);letter-spacing:.08em;font-size:.66rem}.perform-mode-octave-controls{grid-template-columns:auto auto auto;align-items:center;gap:.28rem;display:inline-grid}.perform-mode-octave-controls button{border-radius:.75rem;width:2.15rem;height:2.15rem;padding:0}.perform-mode-octave-controls strong{text-align:center;min-width:1.1rem;font-size:.9rem}.perform-workspace-card-piano{padding:.5rem}.perform-instrument-dialog-v{gap:1rem;display:grid}.perform-instrument-dialog-section{gap:.45rem;display:grid}.perform-instrument-dialog-tabs{flex-wrap:wrap;gap:.4rem;display:flex}.perform-instrument-dialog-title{color:var(--app-color-text-muted);letter-spacing:.08em;text-transform:uppercase;font-size:.76rem}.perform-instrument-dialog-list{gap:.4rem;display:grid}.perform-instrument-dialog-list-scroll{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;min-height:0;max-height:11rem;padding-right:.25rem;overflow:hidden auto}.perform-instrument-dialog-note{color:var(--app-color-text-muted);margin:0;font-size:.88rem}.perform-instrument-dialog-list button{text-align:left;flex-direction:column;align-items:flex-start;gap:.1rem;display:flex}.instrument-dialog-name{font-size:.9rem;font-weight:600}.instrument-dialog-source{color:var(--app-color-text-muted);letter-spacing:.02em;font-size:.72rem;font-weight:400}.perform-workspace-web{display:grid}.perform-settings-dialog-v{gap:1.1rem;display:grid}.perform-settings-dialog-section{gap:.45rem;display:grid}.perform-settings-dialog-row{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.perform-settings-gate-row{align-items:center;gap:.55rem;display:flex}.perform-settings-gate-input{flex:1;min-width:0}.perform-settings-gate-value{color:var(--app-color-text-muted);text-align:right;min-width:2.4rem;font-size:.78rem;font-weight:600}.perform-settings-latch-row{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.55rem;display:flex}.perform-workspace .mode-switch,.perform-workspace .actions{gap:.6rem}.perform-workspace .control-group,.perform-workspace .track-automation{background:#ffffff85;border:1px solid #b8b0a8d1;border-radius:1.15rem;padding:.95rem}.perform-workspace .track-automation{background:linear-gradient(#ffffff7a,#efe9e1e6)}.perform-workspace .control-group label,.perform-workspace .timeline-snap-toggle,.perform-workspace .timeline-step-label,.perform-workspace .project-message,.perform-workspace .history-indicator,.perform-workspace .history-shortcuts,.perform-workspace .drag-status,.perform-workspace .midi-event-empty{color:var(--app-color-text-muted)}.perform-workspace .piano-preview{min-height:14rem;padding-top:0}.perform-workspace .piano-natural-keys{min-height:13rem}.perform-workspace .piano-key-natural{background:linear-gradient(#fff,#f4efe8);border-color:#58534e47;height:13rem}.perform-workspace .piano-key-sharp{color:#f5f5f5;background:linear-gradient(#151515,#2f2f2f);border-color:#18181885}.perform-workspace .piano-key-selected{border-color:var(--app-color-accent);box-shadow:inset 0 -.42rem 0 var(--app-color-accent)}.perform-workspace .piano-key-active{box-shadow:none}.perform-workspace .piano-key-natural.piano-key-active,.perform-workspace .piano-key-natural:active{color:#f4f4f4;background:#202020;border-color:#58534e57}.perform-workspace .piano-key-sharp.piano-key-active,.perform-workspace .piano-key-sharp:active{color:#1f1f1f;background:linear-gradient(#fff,#f4efe8);border-color:#a89f957a;box-shadow:inset 0 -.2rem #0000001a}.perform-workspace .smc-pad{background:0 0;border:0;padding:0}.perform-workspace .smc-pad-header{display:none}.perform-workspace .smc-pad-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.perform-workspace .smc-pad-button{min-height:7.8rem;color:var(--app-color-text-strong);background:linear-gradient(#ffffffeb,#ece7e0f5);border:1px solid #b8b0a8d1;border-radius:1rem;box-shadow:inset 0 1px #ffffffb8}.perform-workspace .smc-pad-description{color:var(--app-color-text-muted)}.perform-workspace .smc-pad-accent-kick,.perform-workspace .smc-pad-accent-snare,.perform-workspace .smc-pad-accent-hat,.perform-workspace .smc-pad-accent-clap{box-shadow:inset 0 -.18rem #2b2b2b24}.perform-workspace .actions{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.perform-workspace .midi-event-log{height:100%}.perform-workspace .midi-event-list{max-height:16rem}@media (width<=1180px){.perform-mode-toolbar{gap:.5rem}}@media (width<=820px){.perform-mode-toolbar{grid-template-columns:auto max-content max-content max-content;justify-content:space-between;align-items:center;gap:.32rem;display:grid}.perform-mode-track-strip-primary,.perform-mode-track-actions,.perform-mode-octave-cluster{justify-self:auto}.perform-workspace .piano-natural-keys{min-height:11rem}.perform-workspace .piano-key-natural{height:11rem;font-size:.82rem}}@media (height<=760px) and (orientation:landscape){.perform-workspace{gap:.3rem}.perform-mode-toolbar-card{padding:.45rem .55rem}.perform-workspace-card-piano{padding:.35rem}.perform-mode-transport-button{width:2rem;height:2rem}.perform-mode-track-strip-primary>button{border-radius:.65rem;width:1.95rem;height:1.95rem}.perform-mode-track-display-compact{min-height:2rem;padding:.24rem .56rem}.perform-mode-track-strip-primary{grid-template-columns:1.95rem minmax(5.6rem,6.6rem) 1.95rem}.perform-mode-add-track{min-height:2rem;padding-inline:.56rem;font-size:.72rem}.perform-mode-instrument-button{max-width:6.9rem}.perform-mode-remove-track{border-radius:.65rem;width:2rem;min-width:2rem;min-height:2rem}.perform-mode-octave-label{font-size:.58rem}.perform-mode-octave-controls strong{font-size:.78rem}.perform-mode-octave-controls button{border-radius:.65rem;width:1.95rem;height:1.95rem}.perform-workspace .piano-preview{min-height:11.2rem}.perform-workspace .piano-natural-keys{min-height:10.2rem}.perform-workspace .piano-key-natural{height:10.2rem;font-size:.76rem}.perform-instrument-dialog-list-scroll{max-height:40vh}}[data-ui-theme=dark] .perform-workspace-card,[data-ui-theme=dark] .perform-workspace .control-group{border-color:var(--ui-color-border);background:var(--ui-color-surface)}[data-ui-theme=dark] .perform-workspace .track-automation{background:var(--ui-color-surface-inset)}[data-ui-theme=dark] .perform-workspace .piano-key-natural{color:#909090;background:linear-gradient(#2e2e2e,#242424);border-color:#58534e47}[data-ui-theme=dark] .perform-workspace .piano-key-sharp{color:#1a1a1a;background:linear-gradient(#ccc,#b8b8b8);border-color:#c8c8c885}[data-ui-theme=dark] .perform-workspace .piano-key-natural.piano-key-active,[data-ui-theme=dark] .perform-workspace .piano-key-natural:active{color:#1a1a1a;background:silver;border-color:#c8c8c857}[data-ui-theme=dark] .perform-workspace .piano-key-sharp.piano-key-active,[data-ui-theme=dark] .perform-workspace .piano-key-sharp:active{color:silver;background:linear-gradient(#181818,#282828);border-color:#58534e7a;box-shadow:inset 0 -.2rem #ffffff0f}[data-ui-theme=dark] .perform-workspace .smc-pad-button{color:var(--ui-color-text);border-color:var(--ui-color-border);background:var(--ui-color-surface-raised);box-shadow:var(--ui-btn-shadow)}.audio-sampler-screen{flex-direction:column;gap:0!important;display:flex!important}.audio-sampler-body{flex-direction:column;flex:1 1 0;gap:.6rem;min-height:0;padding:.1rem .85rem .85rem;display:flex;overflow:hidden}.audio-sampler-panel{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-lg);background:var(--ui-color-surface);flex-direction:column;min-height:0;display:flex;overflow:hidden}.audio-sampler-panel-label{border-bottom:1px solid var(--ui-color-border);letter-spacing:.1em;color:var(--ui-color-text-muted);text-transform:uppercase;opacity:.7;background:var(--ui-color-surface-raised);flex:none;padding:.38rem .8rem;font-size:.62rem;font-weight:700;line-height:1}.audio-sampler-panel-label-row{opacity:1;justify-content:space-between;align-items:center;display:flex}.audio-sampler-panel-label-trim{letter-spacing:.07em;color:var(--ui-color-text-muted);opacity:.8;font-size:.6rem;font-weight:600}.audio-sampler-panel-label-trim-val{color:var(--ui-color-accent);font-variant-numeric:tabular-nums}.audio-sampler-panel-editor{flex:1 1 0;min-height:4.5rem}.audio-sampler-editor-body{flex-direction:row;flex:1 1 0;min-height:0;display:flex}.audio-sampler-waveform-area{background:var(--ui-color-surface-inset);flex:2 1 0;justify-content:center;align-items:center;min-width:0;min-height:0;display:flex;position:relative;overflow:hidden}.audio-sampler-waveform-loading{opacity:.5}.audio-sampler-canvas{touch-action:none;width:100%;height:100%;display:block}.audio-sampler-playhead{pointer-events:none;will-change:left;background:#fff;width:2px;display:none;position:absolute;top:0;bottom:0;transform:translate(-50%);box-shadow:0 0 4px #00000080}.audio-sampler-waveform-empty{color:var(--ui-color-text-muted);flex-direction:column;align-items:center;gap:.35rem;display:flex}.audio-sampler-waveform-empty svg{opacity:.3}.audio-sampler-waveform-empty span{font-size:.85rem}.audio-sampler-waveform-hint{opacity:.65;text-align:center;font-size:.72rem!important}.audio-sampler-panel-slots{flex:none}.audio-sampler-slots{grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem;padding:.65rem;display:grid}.audio-sampler-slot{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-md);background:var(--ui-color-surface);box-shadow:var(--ui-btn-shadow);text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;gap:.12rem;padding:.5rem .65rem;transition:background .1s,box-shadow 90ms,transform 90ms;display:grid}.audio-sampler-slot:active{box-shadow:var(--ui-btn-active-shadow);transform:translateY(.06rem)}.audio-sampler-slot-active{border-color:var(--ui-color-accent);box-shadow:0 0 0 1.5px var(--ui-color-accent), var(--ui-btn-shadow)}.audio-sampler-slot-num{letter-spacing:.06em;color:var(--ui-color-text-muted);font-size:.65rem;font-weight:700;line-height:1}.audio-sampler-slot-name{color:var(--ui-color-text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:.78rem;font-weight:600;line-height:1.1;overflow:hidden}.audio-sampler-slot-filled .audio-sampler-slot-name{color:var(--ui-color-text)}.audio-sampler-slot-duration{color:var(--ui-color-accent);font-size:.68rem;line-height:1}.audio-sampler-slot-empty{color:var(--ui-color-text-muted);opacity:.45;font-size:.68rem;line-height:1}.audio-sampler-panel-sequencer{flex:1 1 0;min-height:8rem}.audio-sampler-seq-controls{border-bottom:1px solid var(--ui-color-border);background:var(--ui-color-surface-raised);flex:none;align-items:center;gap:.45rem;padding:.35rem .65rem;display:flex}.audio-sampler-seq-view-switch{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-sm);display:flex;overflow:hidden}.audio-sampler-seq-view-btn{letter-spacing:.08em;background:var(--ui-color-surface);color:var(--ui-color-text-muted);cursor:pointer;border:none;padding:.22rem .55rem;font-size:.58rem;font-weight:700;transition:background 80ms,color 80ms}.audio-sampler-seq-view-btn[aria-pressed=true]{background:var(--ui-color-accent);color:#fff}.audio-sampler-seq-sep{background:var(--ui-color-border);align-self:stretch;width:1px;margin:0 .1rem}.audio-sampler-seq-ctrl-group{align-items:center;gap:.28rem;display:flex}.audio-sampler-seq-ctrl-label{letter-spacing:.08em;color:var(--ui-color-text-muted);text-transform:uppercase;font-size:.58rem;font-weight:700}.audio-sampler-seq-bpm-val{color:var(--ui-color-text);text-align:center;font-variant-numeric:tabular-nums;min-width:2rem;font-size:.78rem;font-weight:700}.audio-sampler-seq-small-btn{background:var(--ui-color-surface-inset);border:1px solid var(--ui-color-border);cursor:pointer;color:var(--ui-color-text-muted);border-radius:.3rem;padding:.18rem .42rem;font-size:.62rem;font-weight:700;line-height:1;transition:background 80ms,color 80ms}.audio-sampler-seq-small-btn:hover{background:var(--ui-color-surface-raised);color:var(--ui-color-text)}.audio-sampler-seq-small-btn-on{background:var(--ui-color-accent);color:#fff;border-color:var(--ui-color-accent)}.audio-sampler-seq-play-btn{margin-left:auto}.audio-sampler-step-grid{flex-direction:column;flex:1;gap:.35rem;padding:.5rem .65rem;display:flex;overflow:hidden auto}.audio-sampler-step-row{align-items:center;gap:.5rem;height:2rem;display:flex}.audio-sampler-step-row-label{color:var(--ui-color-text-muted);text-overflow:ellipsis;white-space:nowrap;border-right:1px solid var(--ui-color-border);flex:0 0 4.5rem;padding-right:.4rem;font-size:.63rem;font-weight:600;overflow:hidden}.audio-sampler-step-cells{flex:1;gap:.3rem;min-width:0;height:100%;display:flex}.audio-sampler-step-group{flex:1;gap:.12rem;height:100%;display:flex}.audio-sampler-step-btn{cursor:pointer;-webkit-tap-highlight-color:transparent;flex:1;min-width:0;height:100%;padding:0;transition:background 60ms,border-color 60ms;border:1px solid var(--ui-color-border)!important;background:var(--ui-color-surface-inset)!important;border-radius:.22rem!important}.audio-sampler-step-btn:hover{background:var(--ui-color-surface-raised)!important}.audio-sampler-step-btn:focus,.audio-sampler-step-btn:focus-visible{outline:none}.audio-sampler-step-btn-on{background:var(--ui-color-accent)!important;border-color:var(--ui-color-accent)!important}.audio-sampler-step-btn-on:hover,.audio-sampler-step-btn-on:focus,.audio-sampler-step-btn-on:focus-visible{opacity:.82;background:var(--ui-color-accent)!important}.audio-sampler-step-playhead-row{pointer-events:none;height:.45rem}.audio-sampler-step-ph{background:var(--ui-color-border);border-radius:.1rem;flex:1;height:100%;transition:background 60ms}.audio-sampler-step-ph-active{background:var(--ui-color-accent)}.audio-sampler-step-empty{color:var(--ui-color-text-muted);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.25rem;font-size:.78rem;display:flex}.audio-sampler-canvas-trim{cursor:ew-resize}.audio-sampler-cal-panel{border-left:1px solid var(--ui-color-border);background:var(--ui-color-surface-raised);flex-direction:column;flex:1 0 0;gap:.5rem;min-width:0;padding:.6rem .8rem;display:flex;overflow-y:auto}.audio-sampler-cal-empty{color:var(--ui-color-text-muted);opacity:.5;flex:1;justify-content:center;align-items:center;font-size:.75rem;display:flex}.audio-sampler-cal-divider{background:var(--ui-color-border);height:1px;margin:.1rem 0}.audio-sampler-cal-row{justify-content:space-between;align-items:center;gap:.4rem;display:flex}.audio-sampler-cal-row-slider{flex-direction:column;align-items:stretch;gap:.25rem}.audio-sampler-cal-row-header{justify-content:space-between;align-items:center;display:flex}.audio-sampler-cal-row-header-actions{align-items:center;gap:.4rem;display:flex}.audio-sampler-cal-row-label{letter-spacing:.09em;color:var(--ui-color-text-muted);text-transform:uppercase;font-size:.58rem;font-weight:700}.audio-sampler-cal-row-value{color:var(--ui-color-accent);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.68rem;font-weight:600}.audio-sampler-cal-slider-full{width:100%;height:.22rem}.audio-sampler-cal-gain-row{align-items:center;gap:.4rem;display:flex}.audio-sampler-cal-slider-gain{flex:1;width:0;min-width:0}.audio-sampler-cal-btn-norm{border-radius:.35rem;flex:none;justify-content:center;align-items:center;padding:.3rem .5rem;display:flex}.audio-sampler-cal-btn{letter-spacing:.07em;color:var(--ui-color-text-muted);background:var(--ui-color-surface-inset);border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-sm);cursor:pointer;padding:.22rem .6rem;font-size:.6rem;font-weight:700;transition:background 80ms,color 80ms}.audio-sampler-cal-btn-full{width:100%}.audio-sampler-cal-btn:hover{background:var(--ui-color-accent);color:#fff;border-color:var(--ui-color-accent)}.audio-sampler-cal-tune-hints{color:var(--ui-color-text-muted);opacity:.5;justify-content:space-between;margin-top:-.1rem;font-size:.52rem;display:flex}.audio-sampler-file-input{display:none}.audio-sampler-toolbar-trim{white-space:nowrap;align-items:center;gap:.35rem;display:flex}.audio-sampler-toolbar-trim-val{color:var(--ui-color-accent);font-variant-numeric:tabular-nums;font-size:.68rem}.audio-sampler-trim-btn{letter-spacing:.07em;text-transform:uppercase;border:1px solid var(--ui-color-border,#444);color:var(--ui-color-text-muted);cursor:pointer;background:0 0;border-radius:4px;padding:.2rem .45rem;font-size:.62rem;font-weight:700;transition:background .15s,color .15s,border-color .15s}.audio-sampler-trim-btn.active{background:var(--ui-color-accent);color:var(--ui-color-bg,#111);border-color:var(--ui-color-accent)}.audio-sampler-slot-nav{background:var(--ui-color-surface-inset);border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-md);flex:none;align-items:center;gap:.3rem;width:8rem;padding:.15rem .3rem;display:flex}.audio-sampler-slot-nav-btn{color:var(--ui-color-text-muted);cursor:pointer;border-radius:var(--ui-radius-sm);background:0 0;border:none;flex:none;padding:.1rem .25rem;font-size:.6rem;line-height:1;transition:background 80ms}.audio-sampler-slot-nav-btn:hover{background:var(--ui-color-surface-raised);color:var(--ui-color-text)}.audio-sampler-slot-nav-label{flex:1;justify-content:center;align-items:baseline;gap:.3rem;min-width:0;display:flex;overflow:hidden}.audio-sampler-slot-nav-num{color:var(--ui-color-text-muted);flex:none;font-size:.6rem;font-weight:700}.audio-sampler-slot-nav-name{color:var(--ui-color-text);white-space:nowrap;text-overflow:ellipsis;font-size:.75rem;font-weight:600;overflow:hidden}.audio-sampler-toolbar-rename{color:var(--ui-color-text);border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-md);background:0 0;outline:none;flex:1 1 0;min-width:5rem;max-width:12rem;padding:.2rem .6rem;font-size:.78rem;font-weight:600;line-height:1.2;transition:border-color 80ms,background 80ms}.audio-sampler-toolbar-rename:focus{background:var(--ui-color-surface-inset);border-color:var(--ui-color-accent)}.audio-sampler-slot-rename-input{color:var(--ui-color-text);background:var(--ui-color-surface-inset);border:1px solid var(--ui-color-accent);border-radius:var(--ui-radius-sm);outline:none;width:100%;padding:.05rem .3rem;font-size:.78rem;font-weight:600;line-height:1.1}.audio-sampler-settings{gap:.85rem;display:grid}.audio-sampler-modal-summary{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-md);background:var(--ui-color-surface);align-items:center;gap:.5rem;padding:.45rem .85rem;display:flex}.audio-sampler-modal-summary-slots{color:var(--ui-color-text-muted);flex:1;font-size:.78rem}.audio-sampler-modal-summary-slots strong{color:var(--ui-color-text);font-weight:700}.audio-sampler-modal-seq-card{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-md);background:var(--ui-color-surface);flex-direction:column;gap:.55rem;padding:.75rem .85rem;display:flex}.audio-sampler-modal-seq-card-header{align-items:baseline;gap:.5rem;display:flex}.audio-sampler-modal-seq-card-label{letter-spacing:.05em;color:var(--ui-color-text-muted);text-transform:uppercase;flex:1;font-size:.72rem;font-weight:700}.audio-sampler-modal-seq-card-value{color:var(--ui-color-accent);font-size:.82rem;font-weight:700}.audio-sampler-modal-bpm-ctrl{align-items:center;gap:.5rem;display:flex}.audio-sampler-modal-bpm-slider{flex:1;min-width:0}.audio-sampler-modal-bpm-input{text-align:center;border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-sm);background:var(--ui-color-surface-inset);width:3rem;color:var(--ui-color-text);padding:.2rem .25rem;font-family:inherit;font-size:.75rem;font-weight:700}.audio-sampler-modal-bpm-input:focus{border-color:var(--ui-color-accent);outline:none}.audio-sampler-modal-steps-ctrl{flex-wrap:wrap;gap:.3rem;display:flex}.audio-sampler-modal-slots-card{grid-template-columns:repeat(3,1fr);gap:.3rem;display:grid}.audio-sampler-modal-slot-row{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-sm);background:var(--ui-color-surface);flex-direction:column;align-items:flex-start;gap:.3rem;padding:.4rem .5rem;display:flex}.audio-sampler-modal-slot-name{color:var(--ui-color-text);white-space:nowrap;text-overflow:ellipsis;width:100%;font-size:.68rem;font-weight:600;overflow:hidden}@media (width<=640px){.audio-sampler-slots{grid-template-columns:repeat(2,minmax(0,1fr))}}.rec-mic-body{flex-direction:row;align-items:stretch;gap:1rem;min-height:7rem;display:flex}.rec-mic-left{border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-lg);background:var(--ui-color-surface-raised);flex:1 1 0;justify-content:center;align-items:center;min-width:0;padding:.75rem;display:flex;overflow:hidden}.rec-mic-status-msg{text-align:center;justify-content:center;align-items:center;padding:.5rem;display:flex}.rec-mic-status-text{color:var(--ui-color-text);text-align:center;font-size:.8rem;line-height:1.5}.rec-mic-status-text-error{color:var(--ui-color-accent)}.rec-mic-recording-view{flex-direction:column;align-items:center;gap:.6rem;width:100%;display:flex}.rec-mic-bars{align-items:center;gap:3px;height:2.4rem;display:flex}.rec-mic-bar{background:var(--ui-color-accent);transform-origin:bottom;border-radius:2px;width:4px;min-height:4px;animation:.7s ease-in-out infinite alternate rec-mic-bar-bounce}@keyframes rec-mic-bar-bounce{0%{opacity:.4;height:4px}to{opacity:1;height:2rem}}.rec-mic-timer{font-variant-numeric:tabular-nums;align-items:baseline;gap:.15rem;display:flex}.rec-mic-timer-elapsed{color:var(--ui-color-text);letter-spacing:.04em;font-size:1.15rem;font-weight:700}.rec-mic-timer-sep{color:var(--ui-color-text-muted);font-size:.8rem}.rec-mic-timer-remain{color:var(--ui-color-text-muted);letter-spacing:.02em;font-size:.78rem}.rec-mic-waveform-wrap{flex-direction:column;align-items:stretch;gap:.3rem;width:100%;height:100%;display:flex}.rec-mic-waveform-canvas{border-radius:var(--ui-radius-sm);flex:1 1 0;width:100%;min-height:3rem}.rec-mic-done-duration{color:var(--ui-color-text);font-variant-numeric:tabular-nums;text-align:right;padding-top:.15rem;font-size:.72rem;font-weight:600}.rec-mic-right{flex:none;justify-content:center;align-items:center;display:flex}.rec-mic-btn{letter-spacing:.04em;cursor:pointer;text-transform:uppercase;border:2px solid #0000;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:.45rem;width:5.5rem;height:5.5rem;font-size:.72rem;font-weight:600;transition:background .15s,opacity .15s,transform .1s;display:flex}.rec-mic-btn:active:not(:disabled){transform:scale(.95)}.rec-mic-btn:disabled{opacity:.5;cursor:not-allowed}.rec-mic-btn-record{background:var(--ui-color-surface-inset);border-color:var(--ui-color-border);color:var(--ui-color-text)}.rec-mic-btn-record:hover:not(:disabled){border-color:var(--ui-color-accent)}.rec-mic-btn-stop{background:var(--ui-color-accent);border-color:var(--ui-color-accent);color:#fff}.rec-mic-btn-stop:hover:not(:disabled){opacity:.85}.rec-mic-dot{background:var(--ui-color-accent);border-radius:50%;flex-shrink:0;width:14px;height:14px}.rec-mic-dot-pulse{animation:1s ease-in-out infinite rec-mic-dot-pulse}@keyframes rec-mic-dot-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.75)}}.rec-mic-play-action{border-radius:var(--ui-radius-md,.5rem);border:1px solid var(--ui-color-border);color:var(--ui-color-text);cursor:pointer;background:0 0;align-items:center;gap:.3rem;padding:.3rem .65rem;font-size:.82rem;font-weight:500;transition:border-color .12s,color .12s;display:flex}.rec-mic-play-action:hover,.rec-mic-play-action-active{border-color:var(--ui-color-accent);color:var(--ui-color-accent)}.midi-event-log{gap:.75rem;display:grid}.midi-event-log h2,.midi-event-empty{margin:0}.midi-event-log h2{font-size:1rem;font-weight:600}.midi-event-empty{color:var(--ui-color-text-muted)}.midi-event-list{gap:.4rem;max-height:10rem;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}.midi-event-item{border:1px solid var(--ui-color-border-strong);background:var(--ui-color-surface-inset);border-radius:6px;grid-template-columns:5.5rem 1fr 4rem;align-items:center;gap:.5rem;padding:.5rem .6rem;display:grid}.midi-event-item span{color:var(--ui-color-text)}.piano-preview{--natural-key-count:8;width:100%;min-height:9rem;padding-top:.25rem;position:relative;overflow:hidden}.piano-natural-keys{grid-template-columns:repeat(var(--natural-key-count), minmax(0, 1fr));min-height:8.75rem;display:grid}.piano-sharp-keys{pointer-events:none;position:absolute;inset:0}.piano-sharp-key-slot{--sharp-key-position:1;top:.25rem;left:calc((100% / var(--natural-key-count)) * var(--sharp-key-position));width:calc(100% / var(--natural-key-count));pointer-events:none;justify-content:center;height:5.75rem;display:flex;position:absolute;transform:translate(-50%)}.piano-key{border:1px solid var(--ui-color-border-strong);appearance:none;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border-radius:0 0 6px 6px;outline:none;justify-content:center;align-items:flex-end;padding:.5rem .2rem;display:flex}.piano-key:hover,.piano-key:focus-visible{border-color:var(--ui-color-accent);box-shadow:none;outline:none}.piano-key:focus,.piano-key:active{box-shadow:none;outline:none}.piano-key-natural{color:#2d2d2d;background:#efefef;width:100%;min-width:0;height:8.75rem}.piano-key-sharp{color:#f5f5f5;pointer-events:auto;z-index:1;background:#222;width:min(72%,3rem);height:5.75rem}.piano-key-selected{border-color:var(--ui-color-accent);box-shadow:inset 0 -.35rem 0 var(--ui-color-accent)}.piano-key-active{box-shadow:none}.piano-key-natural.piano-key-active,.piano-key-natural:active{color:#f4f4f4;background:#1f1f1f;border-color:#8c8379}.piano-key-sharp.piano-key-active,.piano-key-sharp:active{color:#1f1f1f;background:#efefef;border-color:#8c8379;box-shadow:inset 0 -.18rem #0000001f}[data-ui-theme=dark] .piano-key-natural{color:#a0a0a0;background:#2e2e2e;border-color:#555}[data-ui-theme=dark] .piano-key-sharp{color:#1a1a1a;background:#c8c8c8;border-color:#999}[data-ui-theme=dark] .piano-key-natural.piano-key-active,[data-ui-theme=dark] .piano-key-natural:active{color:#1a1a1a;background:silver;border-color:#888}[data-ui-theme=dark] .piano-key-sharp.piano-key-active,[data-ui-theme=dark] .piano-key-sharp:active{color:#c8c8c8;background:#222;border-color:#444;box-shadow:inset 0 -.18rem #ffffff14}[data-show-key-labels=false] .piano-key-label{visibility:hidden}.mss-grid{box-sizing:border-box;flex-direction:column;gap:2px;width:100%;height:100%;min-height:9rem;padding:.15rem 0;display:flex}.mss-row{flex:1;align-items:stretch;gap:2px;min-height:0;display:flex}.mss-key-label{-webkit-user-select:none;user-select:none;letter-spacing:.01em;box-sizing:border-box;border-radius:0 3px 3px 0;flex-shrink:0;justify-content:flex-end;align-items:center;width:2.8rem;padding-right:.3rem;font-family:monospace;font-size:.58rem;display:flex}.mss-key-natural{color:#666;border-right:3px solid #bbb;background:#f0ece4!important}.mss-key-sharp{color:#ccc;border-right:3px solid #555;background:#2a2520!important}[data-ui-theme=dark] .mss-key-natural{color:#ccc;border-right-color:#888;background:#555!important}[data-ui-theme=dark] .mss-key-sharp{color:#888;border-right-color:#333;background:#111!important}.mss-cell{cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border-radius:4px;flex:1;min-width:0;padding:0;transition:background 60ms,border-color 60ms;border:1px solid var(--ui-color-border)!important;background:var(--ui-color-surface-inset)!important}.mss-cell:focus,.mss-cell:focus-visible{outline:none}.mss-cell-on{background:var(--ui-color-accent)!important;border-color:var(--ui-color-accent)!important}.mss-cell-on:hover,.mss-cell-on:active{opacity:.85;background:var(--ui-color-accent)!important}.mss-cell-beat-start{margin-left:4px}.mss-cell-cursor{border-color:var(--ui-color-accent-soft,var(--ui-color-accent))!important;background:#c8282826!important}.mss-cell-on-cursor{opacity:.9;background:var(--ui-color-accent)!important;border-color:#fff!important}[data-ui-theme=dark] .mss-cell-cursor{border-color:var(--ui-color-accent)!important;background:#ff31502e!important}[data-ui-theme=dark] .mss-cell-on-cursor{border-color:#fff6!important}.pbs-grid{box-sizing:border-box;flex-direction:column;gap:2px;width:100%;height:100%;min-height:9rem;padding:.15rem 0;display:flex}.pbs-row{flex:1;align-items:stretch;gap:2px;min-height:0;display:flex}.pbs-sound-label{letter-spacing:.04em;text-transform:uppercase;-webkit-user-select:none;user-select:none;box-sizing:border-box;background:var(--ui-color-surface,#f0ece4);width:4.2rem;color:var(--ui-color-text-muted,#444);border-right:3px solid #ccc;border-radius:0 3px 3px 0;flex-shrink:0;justify-content:flex-end;align-items:center;padding-right:.35rem;font-family:monospace;font-size:.52rem;font-weight:700;display:flex}[data-ui-theme=dark] .pbs-sound-label{background:var(--ui-color-surface,#1a1a1a);color:#888;border-right-color:#444}.pbs-sound-kick{color:#cc2010!important;border-right-color:#cc2010!important}.pbs-sound-snare{color:#28a028!important;border-right-color:#28a028!important}.pbs-sound-hat{color:#3050c0!important;border-right-color:#3050c0!important}.pbs-sound-open-hat{color:#1880c0!important;border-right-color:#1880c0!important}.pbs-sound-clap{color:#a020a0!important;border-right-color:#a020a0!important}.pbs-sound-rimshot{color:#803888!important;border-right-color:#803888!important}.pbs-sound-tom{color:#a09010!important;border-right-color:#a09010!important}.pbs-sound-crash{color:#c05010!important;border-right-color:#c05010!important}.pbs-sound-floor-tom{color:#608010!important;border-right-color:#608010!important}.pbs-sound-hi-tom{color:#a0a010!important;border-right-color:#a0a010!important}.pbs-sound-ride{color:#109898!important;border-right-color:#109898!important}.pbs-sound-sub{color:#c01040!important;border-right-color:#c01040!important}.pbs-sound-conga{color:#c06808!important;border-right-color:#c06808!important}.pbs-sound-cowbell{color:#b89008!important;border-right-color:#b89008!important}.pbs-sound-shaker{color:#10a878!important;border-right-color:#10a878!important}.pbs-sound-woodblock{color:#907840!important;border-right-color:#907840!important}[data-ui-theme=dark] .pbs-sound-kick{color:#ff5040!important;background:#1a0808!important;border-right-color:#cc2010!important}[data-ui-theme=dark] .pbs-sound-snare{color:#50e050!important;background:#081a08!important;border-right-color:#28a028!important}[data-ui-theme=dark] .pbs-sound-hat{color:#6080ff!important;background:#08081a!important;border-right-color:#3050c0!important}[data-ui-theme=dark] .pbs-sound-open-hat{color:#40b0ff!important;background:#081018!important;border-right-color:#1880c0!important}[data-ui-theme=dark] .pbs-sound-clap{color:#e060e0!important;background:#180818!important;border-right-color:#a020a0!important}[data-ui-theme=dark] .pbs-sound-rimshot{color:#c050c8!important;background:#140814!important;border-right-color:#803888!important}[data-ui-theme=dark] .pbs-sound-tom{color:#d0c040!important;background:#181408!important;border-right-color:#a09010!important}[data-ui-theme=dark] .pbs-sound-crash{color:#ff8030!important;background:#181008!important;border-right-color:#c05010!important}[data-ui-theme=dark] .pbs-sound-floor-tom{color:#98d040!important;background:#101808!important;border-right-color:#608010!important}[data-ui-theme=dark] .pbs-sound-hi-tom{color:#e0e040!important;background:#181808!important;border-right-color:#a0a010!important}[data-ui-theme=dark] .pbs-sound-ride{color:#30d8d8!important;background:#081818!important;border-right-color:#109898!important}[data-ui-theme=dark] .pbs-sound-sub{color:#ff3060!important;background:#1a0808!important;border-right-color:#c01040!important}[data-ui-theme=dark] .pbs-sound-conga{color:#ff9820!important;background:#180e08!important;border-right-color:#c06808!important}[data-ui-theme=dark] .pbs-sound-cowbell{color:#e8c030!important;background:#1a1608!important;border-right-color:#b89008!important}[data-ui-theme=dark] .pbs-sound-shaker{color:#40d8a8!important;background:#081818!important;border-right-color:#10a878!important}[data-ui-theme=dark] .pbs-sound-woodblock{color:#c8a860!important;background:#100e08!important;border-right-color:#907840!important}.pbs-cell{cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border-radius:4px;flex:1;min-width:0;padding:0;transition:background 60ms,border-color 60ms;border:1px solid var(--ui-color-border)!important;background:var(--ui-color-surface-inset)!important}.pbs-cell:focus,.pbs-cell:focus-visible{outline:none}.pbs-cell-on{background:var(--ui-color-accent)!important;border-color:var(--ui-color-accent)!important}.pbs-cell-on:hover,.pbs-cell-on:active{opacity:.85;background:var(--ui-color-accent)!important}.pbs-cell-beat-start{margin-left:4px}.pbs-cell-cursor{border-color:var(--ui-color-accent-soft,var(--ui-color-accent))!important;background:#c8282826!important}.pbs-cell-on-cursor{opacity:.9;background:var(--ui-color-accent)!important;border-color:#fff!important}[data-ui-theme=dark] .pbs-cell-cursor{border-color:var(--ui-color-accent)!important;background:#ff31502e!important}[data-ui-theme=dark] .pbs-cell-on-cursor{border-color:#fff6!important}.smc-pad{border:1px solid var(--ui-color-border-strong);background:radial-gradient(circle at top left, #ff6e8c14, transparent 42%), var(--ui-color-surface-inset);border-radius:10px;gap:.9rem;padding:1rem;display:grid}.smc-pad-header{gap:.35rem;display:grid}.smc-pad-eyebrow{color:var(--ui-color-accent-soft);letter-spacing:.08em;text-transform:uppercase;font-size:.72rem;font-weight:700}.smc-pad-header-row{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.smc-pad-header h2{margin:0;font-size:1.05rem;font-weight:700}.smc-pad-header p{color:var(--ui-color-text-muted);font-size:.9rem}.smc-pad-badge{border:1px solid var(--ui-color-border-strong);color:var(--ui-color-text-muted);background:var(--ui-color-surface-raised);border-radius:999px;padding:.28rem .55rem;font-size:.74rem}.smc-pad-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;display:grid}.smc-pad-button{border:1px solid var(--ui-color-border-strong);text-align:left;min-height:7.2rem;color:var(--ui-color-text);background:var(--ui-color-surface-raised);border-radius:14px;gap:.45rem;padding:1rem;transition:transform .12s,border-color .12s,box-shadow .12s,background .12s;display:grid}.smc-pad-button:hover{transform:translateY(-1px);box-shadow:0 .35rem 1rem #0000001f}.smc-pad-button:active{transform:translateY(1px)scale(.99)}.smc-pad-button:focus-visible{outline:2px solid var(--ui-color-accent);outline-offset:2px}.smc-pad-label{font-size:1.1rem;font-weight:700}.smc-pad-description{color:var(--ui-color-text-muted);max-width:18ch;font-size:.84rem;line-height:1.35}.smc-pad-accent-kick{border-color:var(--ui-smc-accent-kick);box-shadow:inset 0 -.24rem 0 var(--ui-smc-accent-kick)}.smc-pad-accent-snare{border-color:var(--ui-smc-accent-snare);box-shadow:inset 0 -.24rem 0 var(--ui-smc-accent-snare)}.smc-pad-accent-hat{border-color:var(--ui-smc-accent-hat);box-shadow:inset 0 -.24rem 0 var(--ui-smc-accent-hat)}.smc-pad-accent-clap{border-color:var(--ui-smc-accent-clap);box-shadow:inset 0 -.24rem 0 var(--ui-smc-accent-clap)}@media (width<=720px){.smc-pad-header-row{flex-direction:column;align-items:start}.smc-pad-grid{grid-template-columns:minmax(0,1fr)}}.track-timeline-preview{border:1px solid var(--ui-color-border-strong);background:var(--ui-color-surface-inset);border-radius:.9rem;gap:.85rem;padding:.9rem;display:grid}.track-timeline-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:.75rem;display:flex}.track-timeline-header h2{margin:0 0 .2rem;font-size:1rem;font-weight:600}.track-timeline-lanes{gap:.6rem;display:grid;position:relative}.track-timeline-time-ruler{padding-bottom:.1rem;grid-template-columns:minmax(11rem,14rem) minmax(0,1fr);gap:.85rem;padding-inline:calc(.75rem + 1px);display:grid}.track-timeline-time-ruler-track{height:1.25rem;position:relative}.track-timeline-time-ruler-tick{letter-spacing:.02em;color:var(--ui-color-text-muted);font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none;font-size:.6rem;font-weight:500;line-height:1;position:absolute;top:.35rem}.track-timeline-time-ruler-tick:before{content:"";background:var(--ui-color-border-strong);width:1px;height:.3rem;position:absolute;top:-.35rem;left:50%;transform:translate(-50%)}.track-timeline-lane{border:1px solid var(--ui-color-border);background:var(--ui-color-surface);border-radius:.8rem;grid-template-columns:minmax(11rem,14rem) minmax(0,1fr);align-items:center;gap:.85rem;padding:.75rem;transition:border-color .14s,transform .14s,background .14s;display:grid}.track-timeline-lane:hover{border-color:var(--ui-color-border-strong);transform:translateY(-1px)}.track-timeline-lane-active{background:#dc64500a;border-color:#dc64508c;box-shadow:inset 0 0 0 1px #dc64501a}.track-timeline-meta{text-align:left;gap:.28rem;display:grid}.track-timeline-badge-muted{color:#ffb432;background:#ffb43226;border-color:#ffb43266}.track-timeline-lane-muted .track-timeline-track{opacity:.35}.track-timeline-badges{flex-wrap:wrap;gap:.35rem;display:flex}.track-timeline-badge{border:1px solid var(--ui-color-border-strong);color:var(--ui-color-text-muted);background:var(--ui-color-surface-inset);border-radius:999px;padding:.18rem .45rem;font-size:.75rem}.track-timeline-track{border:1px solid var(--ui-color-border);background:linear-gradient(90deg, var(--ui-color-border) 1px, transparent 1px), var(--ui-color-surface-inset);background-size:12.5% 100%,100% 100%;border-radius:.7rem;min-height:3rem;position:relative;overflow:hidden}.track-timeline-clip{--track-clip-duration:0;--track-clip-start:0;inset-block:.38rem;left:calc(var(--track-clip-start) * 100%);width:max(calc(var(--track-clip-duration) * 100%), .8rem);border:1px solid var(--ui-color-border-strong);background:var(--ui-color-surface-raised);cursor:grab;touch-action:none;border-radius:.75rem;position:absolute;overflow:hidden}.track-timeline-clip:active{cursor:grabbing}.track-timeline-clip-empty{color:var(--ui-color-text-muted);place-items:center;font-size:.75rem;display:grid;position:absolute;inset:0}.track-timeline-note-marker{--track-marker-duration:0;--track-marker-start:0;top:.35rem;bottom:.35rem;left:calc(var(--track-marker-start) * 100%);width:max(calc(var(--track-marker-duration) * 100%), .18rem);background:linear-gradient(#ff8e63,#ff6459);border-radius:999px;position:absolute}.track-timeline-note-marker-smc{background:linear-gradient(#7fd0ff,#4da4ff)}.track-timeline-lane-mix{cursor:default;background:#5078dc0f;border-color:#5078dc73}.track-timeline-lane-mix:hover{border-color:#5a7accb3}.track-timeline-lane-mix-active{background:#5078dc1f;border-color:#7a9fffcc;box-shadow:inset 0 0 0 1px #7a9fff40}.track-timeline-clip-mix{background:var(--ui-color-surface-raised);cursor:grab;border-color:#5078dc59;align-items:center;padding:0 .5rem;display:flex}.track-timeline-mix-label{color:var(--ui-color-text-muted);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:.68rem;font-weight:700;overflow:hidden}.track-timeline-clip-selected{box-shadow:0 0 0 2px #ffffff40,inset 0 0 0 1px #ffffff26;border-color:var(--ui-color-border-strong)!important}.track-timeline-clip-playing{box-shadow:inset 0 0 0 1px #ffdc644d;border-color:#ffdc64b3!important}.track-timeline-playhead-overlay{pointer-events:none;z-index:8;grid-template-rows:1fr;grid-template-columns:minmax(11rem,14rem) minmax(0,1fr);gap:.85rem;padding-inline:calc(.75rem + 1px);display:grid;position:absolute;inset:0}.track-timeline-playhead-overlay-track{position:relative}.track-timeline-global-playhead{pointer-events:none;background:#1414148c;width:2px;position:absolute;top:0;bottom:0;transform:translate(-50%);box-shadow:0 0 0 .5px #0000001f}.track-timeline-mix-name-input{background:var(--ui-color-surface-raised);color:inherit;font-size:inherit;border:1px solid #5a7accb3;border-radius:.35rem;outline:none;width:100%;padding:.1rem .35rem;font-weight:600}.track-timeline-mix-name-input:focus{border-color:#7a9fffe6;box-shadow:0 0 0 2px #7a9fff33}.track-timeline-mix-remove{color:var(--ui-color-text-muted);border:1px solid var(--ui-color-border);cursor:pointer;background:0 0;border-radius:.25rem;margin-top:.25rem;padding:.1rem .35rem;font-size:.65rem;line-height:1}.track-timeline-mix-remove:hover{color:#ff6459;border-color:#ff6459}[data-ui-theme=dark] .track-timeline-clip{background:linear-gradient(#ff966e85,#ff5a4b61),#ff5a4b33;border-color:#ffffff1a}[data-ui-theme=dark] .track-timeline-lane-active{background:#ff6a4e1a}[data-ui-theme=dark] .track-timeline-clip-mix{background:linear-gradient(#78a0ff6b,#5078dc4d),#5078dc2e;border-color:#78a0ff59}[data-ui-theme=dark] .track-timeline-mix-label{color:#a0c8ffe6}[data-ui-theme=dark] .track-timeline-global-playhead{background:#ffffffbf;box-shadow:0 0 5px 1px #ffffff2e}@media (width<=720px){.track-timeline-lane{grid-template-columns:minmax(0,1fr)}}.timeline-preview{gap:.75rem;display:grid}.timeline-preview h2,.timeline-empty{margin:0}.timeline-preview h2{color:var(--ui-color-text);font-size:1rem;font-weight:600}.timeline-empty{color:var(--ui-color-text-muted)}.timeline-ruler{grid-template-columns:3.25rem 1fr;gap:.6rem;padding-bottom:.1rem;display:grid}.timeline-ruler-track{height:1.25rem;position:relative}.timeline-ruler-tick{letter-spacing:.02em;color:var(--ui-color-text-muted);font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none;font-size:.6rem;font-weight:500;line-height:1;position:absolute;top:.35rem}.timeline-ruler-tick:before{content:"";background:var(--ui-color-border-strong);width:1px;height:.3rem;position:absolute;top:-.35rem;left:50%;transform:translate(-50%)}.timeline-actions{justify-content:flex-end;display:flex}.timeline-actions button{border:1px solid var(--ui-color-border);color:var(--ui-color-text);background:var(--ui-color-surface-raised);border-radius:6px;padding:.45rem .7rem}.timeline-lanes{gap:.45rem;display:grid}.timeline-lane{grid-template-columns:3.25rem 1fr;align-items:center;gap:.6rem;display:grid}.timeline-note-label{color:var(--ui-color-text);font-size:.78rem;font-weight:700}.timeline-track{border:1px solid var(--ui-color-border);background:linear-gradient(90deg, var(--ui-color-border) 1px, transparent 1px), var(--ui-color-surface-inset);background-size:25% 100%,100% 100%;border-radius:6px;height:1.6rem;position:relative;overflow:hidden}.timeline-note-block{--note-duration:0;--note-start:0;inset-block:.25rem;left:calc(var(--note-start) * 100%);width:max(calc(var(--note-duration) * 100%), .5rem);cursor:pointer;touch-action:none;background:#ff3150;border:0;border-radius:4px;padding:0;position:absolute}.timeline-note-handle{cursor:ew-resize;background:#ffffff26;border-left:1px solid #ffffffa6;width:.4rem;height:100%;position:absolute;top:0;right:0}.timeline-note-block-selected{background:#ff5f79;box-shadow:inset 0 0 0 1px #ffffff4d}.timeline-playhead{pointer-events:none;z-index:2;background:#14141480;width:2px;position:absolute;inset-block:0;transform:translate(-50%)}[data-ui-theme=dark] .timeline-playhead{background:#ffffffd9}.catalog-page{min-height:100dvh;font-family:var(--app-font-primary,"IBM Plex Mono", monospace);color:var(--ui-color-text,#303030);background:#d4d4d4;padding:2rem 1.5rem 4rem}.catalog-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:2.5rem;display:flex}.catalog-header-copy h1{letter-spacing:-.03em;color:#303030;margin:0 0 .25rem;font-size:1.6rem}.catalog-header-copy p{color:#686868;margin:0;font-size:.9rem}.catalog-header-controls{align-items:center;gap:.75rem;display:flex}.catalog-theme-toggle{letter-spacing:.02em;cursor:pointer;color:#303030;background:linear-gradient(#fafafaf2,#eaeaeafa);border:1px solid #b8b0a8b8;border-radius:999px;align-items:center;gap:.5rem;padding:.5rem .85rem;font-family:inherit;font-size:.82rem;font-weight:600;display:inline-flex;box-shadow:inset 0 1px #ffffffb8}.catalog-back-btn{letter-spacing:.02em;cursor:pointer;color:#303030;background:linear-gradient(#fafafaf2,#eaeaeafa);border:1px solid #b8b0a8b8;border-radius:999px;align-items:center;gap:.5rem;padding:.5rem .85rem;font-family:inherit;font-size:.82rem;font-weight:600;text-decoration:none;display:inline-flex;box-shadow:inset 0 1px #ffffffb8}.catalog-sections{gap:2.5rem;display:grid}.catalog-section{gap:1rem;display:grid}.catalog-section-header{border-bottom:2px solid #9b938a7a;align-items:baseline;gap:.75rem;padding-bottom:.5rem;display:flex}.catalog-section-header h2{letter-spacing:.04em;text-transform:uppercase;color:#303030;margin:0;font-size:1rem}.catalog-section-tag{color:#686868;letter-spacing:.04em;font-size:.75rem}.catalog-row{flex-wrap:wrap;align-items:flex-start;gap:.85rem;display:flex}.catalog-item{gap:.45rem;display:grid}.catalog-item-label{color:#686868;letter-spacing:.06em;text-transform:uppercase;font-size:.72rem}.catalog-preview{background:linear-gradient(#f8f8f8f0,#e7e7e7f5);border:1px solid #b8b0a8b8;border-radius:1.35rem;padding:1.25rem;box-shadow:inset 0 1px #ffffffb8}.catalog-preview-dark{background:linear-gradient(#202020fa,#161616fa);border-color:#444444e0;box-shadow:inset 0 1px #ffffff0a}.catalog-list-demo{gap:.5rem;width:min(100%,28rem);display:grid}.catalog-smc-demo{width:min(100%,34rem)}.catalog-toolbar-demo{width:min(100%,36rem)}.catalog-token-grid{grid-template-columns:repeat(auto-fill,minmax(7rem,1fr));gap:.65rem;display:grid}.catalog-token-swatch{gap:.35rem;display:grid}.catalog-token-color{border:1px solid #9b938a7a;border-radius:.7rem;height:3rem}.catalog-token-name{color:#686868;word-break:break-all;font-size:.7rem}.catalog-token-value{color:#303030;font-size:.7rem;font-weight:600}.tutorial-root{pointer-events:none;z-index:200;position:fixed;inset:0}.tutorial-backdrop{pointer-events:none;position:absolute;inset:0}.tutorial-spotlight{border:2px solid var(--ui-color-accent,#c82828);pointer-events:none;border-radius:10px;transition:top .22s,left .22s,width .22s,height .22s;position:absolute;box-shadow:0 0 0 9999px #00000085}.tutorial-modal{pointer-events:auto;z-index:201;background:var(--ui-color-surface-raised,#f8f8f8f7);border:1px solid var(--ui-color-border,#b8b0a8b8);border-radius:var(--ui-radius-lg,1.35rem);width:min(28rem,92vw);color:var(--ui-color-text,#303030);flex-direction:column;gap:.65rem;padding:1rem 1.25rem;display:flex;position:fixed;bottom:1.25rem;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #0003}.tutorial-skip-btn{color:var(--ui-color-text-muted,#686868);cursor:pointer;background:0 0;border:none;padding:.2rem .3rem;font-size:.71rem;line-height:1;position:absolute;top:.55rem;right:.75rem}.tutorial-skip-btn:hover{color:var(--ui-color-accent,#c82828)}.tutorial-modal-content{flex-direction:column;gap:.25rem;padding-right:5rem;display:flex}.tutorial-step-title{color:var(--ui-color-text,#303030);font-size:.95rem;font-weight:700}.tutorial-step-text{color:var(--ui-color-text,#303030);margin:0;font-size:.85rem;line-height:1.5}.tutorial-modal-footer{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.tutorial-step-counter{color:var(--ui-color-text-muted,#686868);font-variant-numeric:tabular-nums;flex-shrink:0;font-size:.72rem}.tutorial-modal-actions{flex-shrink:0;align-items:center;gap:.45rem;display:flex}.tutorial-btn-primary{background:var(--ui-color-accent,#c82828);color:#fff;border-radius:var(--ui-radius-md,1rem);cursor:pointer;border:none;padding:.4rem 1rem;font-size:.82rem;font-weight:600;transition:opacity .15s}.tutorial-btn-primary:hover{opacity:.85}.tutorial-btn-secondary{border:1px solid var(--ui-color-border,#b8b0a8b8);border-radius:var(--ui-radius-md,1rem);color:var(--ui-color-text,#303030);cursor:pointer;background:0 0;padding:.4rem .75rem;font-size:.82rem;transition:border-color .12s}.tutorial-btn-secondary:hover{border-color:var(--ui-color-accent,#c82828)}.tutorial-modal-lang{text-align:center;align-items:center}.tutorial-lang-title{color:var(--ui-color-text,#303030);margin:0;font-size:1rem;font-weight:700}.tutorial-lang-sub{color:var(--ui-color-text-muted,#686868);margin:0;font-size:.8rem}.tutorial-lang-buttons{justify-content:center;gap:.75rem;margin-top:.25rem;display:flex}.tutorial-lang-btn{background:var(--ui-color-surface-inset,#ede8e2d1);border:1px solid var(--ui-color-border,#b8b0a8b8);border-radius:var(--ui-radius-md,1rem);color:var(--ui-color-text,#303030);cursor:pointer;padding:.55rem 1.4rem;font-size:.9rem;font-weight:600;transition:border-color .12s}.tutorial-lang-btn:hover{border-color:var(--ui-color-accent,#c82828)}