:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f4f0e8;font-synthesis:none;text-rendering:optimizelegibility;background:#101217;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:linear-gradient(#ffffff0a,#0000 32%),#101217;min-width:320px;min-height:100vh;margin:0}button{min-height:42px;font:inherit;cursor:pointer;border:0;border-radius:6px;padding:0 18px;font-weight:700}button svg{stroke-width:2.25px;width:20px;height:20px;display:block}select{color:#f4f0e8;min-height:42px;font:inherit;background:#171d27;border:1px solid #ffffff24;border-radius:6px;padding:0 36px 0 12px;font-weight:700}input[type=number]{color:#f4f0e8;width:96px;min-height:40px;font:inherit;background:#171d27;border:1px solid #ffffff24;border-radius:6px;padding:0 10px;font-weight:700}input[type=range]{accent-color:#47bda8;width:100%;min-width:0}#previous-runs{max-width:220px}button:disabled{cursor:not-allowed;opacity:.48}.app-shell{grid-template-rows:auto 1fr;height:100vh;display:grid}.topbar{background:#101217e0;border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;gap:18px;padding:18px clamp(16px,4vw,40px);display:flex}h1{letter-spacing:0;margin:0;font-size:clamp(22px,3vw,34px);line-height:1.08}h1 a{color:inherit;text-decoration:none}h1 a:focus-visible{outline-offset:4px;outline:2px solid #47bda8}p{color:#aab0ba;margin:7px 0 0;font-size:14px}.controls{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;display:flex}.primary-button{color:#07110f;background:#47bda8;min-width:116px}.secondary-button{color:#171006;background:#f5b142}.icon-text-button{justify-content:center;align-items:center;gap:8px;display:inline-flex}.record-button{color:#f4f0e8;background:#242a34}.record-button.is-recording{color:#170706;background:#ff6b5f}.icon-button{color:#f4f0e8;background:#242a34;place-items:center;width:42px;min-width:42px;padding:0;display:inline-grid}.download-button{color:#171006;background:#f5b142}.file-input{display:none}.text-button{min-width:188px}.roll-panel{min-height:0;padding:0;position:relative;overflow:hidden}.roll-panel.is-dragover:after{content:"Drop MIDI";color:#f4f0e8;pointer-events:none;background:#101217b8;place-items:center;font-size:22px;font-weight:800;display:grid;position:absolute;inset:0}#piano-roll{touch-action:manipulation;cursor:crosshair;width:100%;height:100%;display:block;position:absolute;inset:0}.settings-dialog{color:#f4f0e8;background:0 0;border:0;width:min(520px,100vw - 32px);max-height:min(680px,100vh - 32px);padding:0}.settings-dialog::backdrop{background:#06080cb8}.settings-card{max-height:inherit;background:#171d27;border:1px solid #ffffff24;border-radius:8px;grid-template-rows:auto minmax(0,1fr) auto;margin:0;display:grid;overflow:hidden;box-shadow:0 24px 80px #0000006b}.settings-header{border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;gap:16px;padding:16px 18px;display:flex}.settings-header h2{letter-spacing:0;margin:0;font-size:20px;line-height:1.15}.settings-grid{gap:18px;padding:18px;display:grid;overflow:auto}.setting-control{gap:8px;display:grid}.setting-label{color:#f4f0e8;justify-content:space-between;align-items:center;gap:12px;font-size:14px;font-weight:800;display:flex}.setting-label output{color:#aab0ba;font-variant-numeric:tabular-nums}.setting-inputs{grid-template-columns:minmax(0,1fr) 96px;align-items:center;gap:12px;display:grid}.range-setting-inputs{grid-template-columns:minmax(0,1fr) 200px;align-items:center;gap:12px;display:grid}.range-number-inputs{grid-template-columns:1fr 1fr;gap:8px;display:grid}.range-slider{--range-start:0%;--range-end:100%;align-items:center;height:40px;display:grid;position:relative}.range-slider:before{content:"";background:linear-gradient(to right, #303844 0 var(--range-start), #47bda8 var(--range-start) var(--range-end), #303844 var(--range-end) 100%);border-radius:999px;height:6px;position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}.range-slider input[type=range]{pointer-events:none;appearance:none;accent-color:#0000;background:0 0;width:100%;height:40px;margin:0;position:absolute;top:0}.range-slider input[type=range]:first-child{z-index:2}.range-slider input[type=range]:last-child{z-index:3}.range-slider input[type=range]::-webkit-slider-runnable-track{background:0 0;height:6px}.range-slider input[type=range]::-moz-range-track{background:0 0;height:6px}.range-slider input[type=range]::-webkit-slider-thumb{cursor:pointer;pointer-events:auto;appearance:none;background:#f4f0e8;border:3px solid #47bda8;border-radius:50%;width:18px;height:18px;margin-top:-6px}.range-slider input[type=range]::-moz-range-thumb{cursor:pointer;pointer-events:auto;background:#f4f0e8;border:3px solid #47bda8;border-radius:50%;width:14px;height:14px}.settings-actions{background:#131820;border-top:1px solid #ffffff1a;justify-content:flex-end;gap:10px;padding:16px 18px;display:flex}@media (width<=720px){.topbar{flex-direction:column;align-items:stretch}.controls{justify-content:flex-start}button{flex:1 1 0;min-width:0;padding-inline:12px}.icon-button{flex:0 0 42px;padding:0}.text-button{flex:100%}select{flex:100%;max-width:none}.setting-inputs,.range-setting-inputs{grid-template-columns:1fr}input[type=number]{width:100%}}