:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{color:#eef0f5;background:#0b0c11;height:100%;margin:0}#app{width:100vw;height:100vh;display:flex}#app.mode-library{justify-content:center;align-items:center}#app.mode-library #workspace{display:none}#app.mode-library #library{border-right:none;border-radius:16px;width:100%;max-width:640px;max-height:80vh;padding:40px}#app.mode-library #library h1{margin-bottom:24px;font-size:28px}#app.mode-library .song-btn{padding:12px 14px;font-size:15px}#app.mode-library #import-btn{margin-top:16px;padding:12px 14px}#app.mode-player #library,#landing{display:none}#app.mode-landing{justify-content:center;align-items:center}#app.mode-landing #landing{text-align:center;flex-direction:column;align-items:stretch;gap:14px;width:100%;max-width:420px;padding:40px;display:flex}#app.mode-landing #library,#app.mode-landing #workspace{display:none}#landing h1{margin:0;font-size:28px}#landing-subtitle{color:#fff9;margin:0 0 8px}#landing button{color:#eef0f5;cursor:pointer;text-align:left;background:#ffffff0d;border:1px solid #ffffff26;border-radius:10px;flex-direction:column;align-items:flex-start;gap:4px;padding:16px 20px;font-size:16px;font-weight:700;display:flex}#landing button:hover{background:#ffffff17;border-color:#ffffff4d}#landing button span{color:#ffffff8c;font-size:12px;font-weight:400}#library{background:#14161e;border-right:1px solid #ffffff14;flex-shrink:0;width:220px;padding:16px;overflow-y:auto}#library h1{margin:0 0 16px;font-size:18px}#library h2{text-transform:uppercase;letter-spacing:.08em;color:#ffffff80;margin:0 0 8px;font-size:12px}#song-list{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}#song-list li{align-items:center;display:flex}.song-btn{text-align:left;color:#eef0f5;cursor:pointer;text-overflow:ellipsis;white-space:nowrap;background:0 0;border:none;border-radius:6px;flex:1;min-width:0;padding:8px 10px;font-size:14px;overflow:hidden}.song-btn:hover{background:#ffffff14}.song-delete-btn{color:#fff6;cursor:pointer;background:0 0;border:none;border-radius:5px;flex-shrink:0;width:22px;height:22px;font-size:16px;line-height:1}.song-delete-btn:hover{color:#ff3b57;background:#ff3b5733}#import-btn{color:#ffffffbf;cursor:pointer;background:0 0;border:1px dashed #ffffff40;border-radius:6px;width:100%;margin-top:12px;padding:8px 10px;font-size:13px}#import-btn:hover{color:#eef0f5;border-color:#ffffff80}#import-status{color:#ffffff80;min-height:14px;margin-top:6px;font-size:12px}#import-status.error{color:#ff6b7d}#switch-mode-btn{color:#fff6;cursor:pointer;background:0 0;border:none;width:100%;margin-top:10px;padding:6px;font-size:12px;text-decoration:underline}#switch-mode-btn:hover{color:#ffffffb3}#library.drag-over{outline-offset:-2px;outline:2px dashed #4fa8ff}#workspace{flex-direction:column;flex:1;min-width:0;display:flex}#song-header{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:baseline;padding:14px 20px;display:flex}#header-left{align-items:baseline;gap:14px;display:flex}#song-header h2{margin:0;font-size:16px}#library-back-btn{color:#ffffffbf;cursor:pointer;background:0 0;border:1px solid #fff3;border-radius:6px;padding:5px 10px;font-size:12px}#library-back-btn:hover{color:#eef0f5;border-color:#fff6}#header-right{align-items:center;gap:10px;display:flex}#position-display{font-variant-numeric:tabular-nums;color:#fff9;font-size:13px}#play-btn-mini,#stop-btn-mini{color:#ffffffd9;cursor:pointer;background:0 0;border:1px solid #fff3;border-radius:6px;flex-shrink:0;width:34px;height:34px;font-size:15px;line-height:1}#play-btn-mini:hover,#stop-btn-mini:hover{color:#eef0f5;border-color:#fff6}#play-btn-mini:disabled,#stop-btn-mini:disabled{opacity:.35;cursor:default}#settings-toggle-row{border-bottom:1px solid #ffffff14;justify-content:flex-end;padding:2px 10px;display:flex}#settings-toggle{color:#ffffffbf;cursor:pointer;background:#14161e;border:1px solid #fff3;border-top:none;border-radius:0 0 6px 6px;width:44px;height:26px;font-size:13px;line-height:1}#settings-toggle:hover{color:#eef0f5;border-color:#fff6}#settings-panel{transition:max-height .25s;overflow:hidden}#settings-panel.collapsed{max-height:0!important}#parts-panel{border-bottom:1px solid #ffffff14;flex-wrap:wrap;gap:6px;padding:10px 20px;display:flex}.part-row{cursor:pointer;background:#ffffff0d;border-radius:8px;align-items:center;gap:8px;padding:6px 10px;font-size:13px;display:flex}.part-row:hover{background:#ffffff17}.swatch{border-radius:3px;flex-shrink:0;width:10px;height:10px}.part-name{white-space:nowrap}.mix-btn{color:#ffffffb3;cursor:pointer;background:0 0;border:1px solid #ffffff26;border-radius:6px;width:30px;height:34px;font-size:12px;font-weight:700;line-height:1}.mix-btn:hover{border-color:#fff6}.part-row.is-muted .mute-btn{color:#fff;background:#ff3b57;border-color:#ff3b57}.part-row.is-solo .solo-btn{color:#14161e;background:#ffd166;border-color:#ffd166}#transport{border-bottom:1px solid #ffffff14;flex-wrap:wrap;align-items:center;gap:20px;padding:10px 20px;display:flex}#play-btn{color:#06070a;cursor:pointer;background:#4fa8ff;border:none;border-radius:50%;flex-shrink:0;width:40px;height:40px;font-size:15px}#play-btn:disabled{cursor:default;background:#ffffff26}#stop-btn{color:#eef0f5;cursor:pointer;background:0 0;border:1px solid #fff3;border-radius:50%;flex-shrink:0;width:32px;height:32px;font-size:11px}#stop-btn:hover{border-color:#fff6}#stop-btn:disabled{opacity:.35;cursor:default}#metronome-btn,#loop-btn,#view-toggle-btn{color:#eef0f5;cursor:pointer;background:0 0;border:1px solid #fff3;border-radius:6px;padding:7px 12px;font-size:13px}#metronome-btn.active{color:#06070a;background:#4fd6c4;border-color:#4fd6c4}#loop-btn.active{color:#06070a;background:#4fa8ff;border-color:#4fa8ff}#metronome-btn:disabled,#loop-btn:disabled,#view-toggle-btn:disabled{opacity:.4;cursor:default}.transport-group{align-items:center;gap:6px;display:flex}.transport-label{text-transform:uppercase;letter-spacing:.06em;color:#ffffff73;margin-right:4px;font-size:11px}.bpm-btn,.duck-btn,#transpose-down,#transpose-up,#zoom-out,#zoom-in,#measure-go-btn{color:#eef0f5;cursor:pointer;background:0 0;border:1px solid #fff3;border-radius:6px;padding:6px 10px;font-size:13px}#measure-input,#bpm-input{color:#eef0f5;background:0 0;border:1px solid #fff3;border-radius:6px;width:52px;padding:6px 8px;font-size:13px}#measure-go-btn:disabled,#measure-input:disabled{opacity:.4;cursor:default}.inline-edit-input{font:inherit;color:#eef0f5;background:#ffffff14;border:1px solid #ffffff4d;border-radius:4px;max-width:100%;padding:1px 4px}.measure-step-btn{color:#eef0f5;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:0 0;border:1px solid #fff3;border-radius:6px;width:30px;height:30px;font-size:16px;line-height:1}.measure-step-btn:disabled{opacity:.4;cursor:default}.bpm-btn.active,.duck-btn.active{color:#06070a;background:#4fa8ff;border-color:#4fa8ff}#transpose-value,#zoom-value{text-align:center;font-variant-numeric:tabular-nums;min-width:24px;font-size:14px}#zoom-value{min-width:40px}#roll{touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none;will-change:transform;flex:1;width:100%;min-height:0;display:block;transform:translateZ(0)}#roll.dragging{cursor:grabbing}#staff{touch-action:none;-webkit-user-select:none;user-select:none;flex:1;width:100%;min-height:0;display:block}.hidden{display:none!important}@media (width<=720px){#app{flex-direction:column;height:100dvh}#library{border-bottom:1px solid #ffffff14;border-right:none;width:100%;max-height:130px}#app.mode-library #library{max-height:none;padding:32px 20px}#transport{gap:12px}#song-header{flex-direction:column;align-items:stretch;gap:8px}#header-right{justify-content:space-between}}#pin-gate{z-index:1000;background:#0b0c11;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#pin-gate-form{text-align:center;flex-direction:column;align-items:center;gap:10px;width:260px;display:flex}#pin-gate-form h1{margin:0;font-size:20px}#pin-gate-form p{color:#fff9;margin:0 0 6px;font-size:13px}#pin-gate-input{color:#eef0f5;text-align:center;letter-spacing:.2em;background:#14161e;border:1px solid #fff3;border-radius:8px;width:100%;padding:10px 12px;font-size:16px}#pin-gate-form button{color:#06070a;cursor:pointer;background:#4fa8ff;border:none;border-radius:8px;width:100%;padding:10px;font-size:14px;font-weight:600}#pin-gate-form button:disabled{opacity:.6;cursor:default}#pin-gate-error{color:#ff6b7d;min-height:16px;font-size:12px}