.piano-canvas-editor{color:#182026;background:#fff;font-family:Inter,system-ui,sans-serif}.piano-canvas-editor *{box-sizing:border-box}.piano-canvas-editor{min-width:320px;margin:0}.piano-canvas-editor main{grid-template-rows:auto min(320px,38dvh) minmax(0,1fr);grid-template-columns:minmax(0,1fr);height:min(900px,85dvh);min-height:620px;display:grid}.piano-canvas-editor header{border-bottom:1px solid #dce2e6;justify-content:space-between;align-items:center;gap:16px;min-height:56px;padding:12px 20px;display:flex}.piano-canvas-editor .environment{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;margin-left:auto;display:flex}.piano-canvas-editor .scheme-actions{flex-wrap:wrap;gap:6px;max-width:100%;display:inline-flex}.piano-canvas-editor .scheme-actions button{white-space:nowrap;min-width:88px}.piano-canvas-editor #toggle-fullscreen{min-width:124px}.piano-canvas-editor .project-title{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.piano-canvas-editor .project-title strong{font-size:17px;font-weight:700}.piano-canvas-editor h2{font-family:Inter,system-ui,sans-serif}.piano-canvas-editor #status{color:#64717b;text-align:right;font-size:12px}.piano-canvas-editor #status.ready{color:#087653}.piano-canvas-editor #status.error{color:#b72d27}.piano-canvas-editor .stage-frame{min-height:0;position:relative}.piano-canvas-editor .stage{background:var(--stage-background,#e6eaed);scrollbar-color:#89949b var(--stage-background,#e6eaed);height:100%;min-height:0;padding:18px;display:flex;overflow:auto}.piano-canvas-editor .stage-settings{z-index:2;position:absolute;top:10px;right:12px}.piano-canvas-editor .stage-settings summary{color:#182026;cursor:pointer;background:#fff;border:1px solid #afb9bf;border-radius:4px;place-items:center;width:32px;height:32px;font-size:21px;line-height:1;list-style:none;display:grid}.piano-canvas-editor .stage-settings summary::-webkit-details-marker{display:none}.piano-canvas-editor .stage-settings summary:hover,.piano-canvas-editor .stage-settings[open] summary{background:#eef2f4}.piano-canvas-editor .stage-settings summary:focus-visible{outline-offset:2px;outline:2px solid #2076aa}.piano-canvas-editor .stage-settings-panel{background:#fff;border:1px solid #bcc7ce;border-radius:4px;justify-content:space-between;align-items:center;gap:16px;min-width:180px;margin-top:6px;padding:10px 12px;display:flex;box-shadow:0 4px 12px #18202620}.piano-canvas-editor .canvas-wrap{flex:none;width:max-content;height:max-content;margin:auto}.piano-canvas-editor canvas{background:#fff;width:1016px;height:182px;display:block}.piano-canvas-editor .workspace{grid-template-columns:repeat(3,minmax(300px,1fr));min-height:0;display:grid;overflow:auto hidden}.piano-canvas-editor .panel{scrollbar-gutter:stable;border-right:1px solid #dce2e6;min-width:0;height:100%;padding:20px;overflow:auto}.piano-canvas-editor .panel:last-child{background:#f7f9fa;border-right:0}.piano-canvas-editor .panel h2{margin:0 0 14px;font-size:15px}.piano-canvas-editor .panel h2:not(:first-child){border-top:1px solid #dce2e6;margin-top:26px;padding-top:18px}.piano-canvas-editor .section-head{justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;display:flex}.piano-canvas-editor .section-head h2{margin:0}.piano-canvas-editor .section-head output{color:#ab3930;font:600 12px ui-monospace,monospace}.piano-canvas-editor label{font-size:12px;font-weight:650;display:block}.piano-canvas-editor .field-label{flex-wrap:wrap;justify-content:space-between;gap:4px 8px;margin-bottom:5px;display:flex}.piano-canvas-editor .field-label output{color:#a13730;font:600 12px ui-monospace,monospace}.piano-canvas-editor .field{min-width:0}.piano-canvas-editor input[type=text],.piano-canvas-editor input[type=number],.piano-canvas-editor select{width:100%;min-width:0;height:34px;color:inherit;background:#fff;border:1px solid #bcc7ce;border-radius:4px;padding:0 8px;font:13px ui-monospace,monospace}.piano-canvas-editor input[type=range]{accent-color:#cf4036;width:100%;height:32px;margin:0;display:block}.piano-canvas-editor input[type=color]{background:#fff;border:1px solid #bcc7ce;border-radius:4px;width:40px;height:34px;padding:2px;display:block}.piano-canvas-editor input[type=checkbox]{accent-color:#cf4036;width:17px;height:17px;margin:0}.piano-canvas-editor input:focus-visible,.piano-canvas-editor button:focus-visible,.piano-canvas-editor select:focus-visible{outline-offset:2px;outline:2px solid #2076aa}.piano-canvas-editor button{color:#182026;cursor:pointer;background:#fff;border:1px solid #afb9bf;border-radius:4px;height:34px;padding:0 11px;font:600 12px Inter,system-ui,sans-serif}.piano-canvas-editor button:hover{background:#eef2f4}.piano-canvas-editor button:disabled{opacity:.45;cursor:default}.piano-canvas-editor .add{width:100%;margin-top:10px}.piano-canvas-editor .presets{flex-wrap:wrap;gap:7px;margin:12px 0 16px;display:flex}.piano-canvas-editor .presets button{min-width:88px;padding-inline:16px}.piano-canvas-editor .size-presets{align-self:start;margin-bottom:2px;display:inline-flex}.piano-canvas-editor .size-presets button{border-radius:0;min-width:76px}.piano-canvas-editor .size-presets button+button{margin-left:-1px}.piano-canvas-editor .size-presets button:first-child{border-radius:4px 0 0 4px}.piano-canvas-editor .size-presets button:last-child{border-radius:0 4px 4px 0}.piano-canvas-editor .size-presets button[aria-pressed=true]{z-index:1;color:#9f2c25;background:#fbe9e7;border-color:#b72d27;position:relative}.piano-canvas-editor .batch{gap:12px;margin-bottom:22px;display:grid}.piano-canvas-editor .batch-main{grid-template-columns:minmax(0,1fr) 46px;align-items:end;gap:10px;display:grid}.piano-canvas-editor .batch-main label,.piano-canvas-editor .batch-sliders label{min-width:0}.piano-canvas-editor .batch-sliders{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.piano-canvas-editor .batch .presets{margin:0}.piano-canvas-editor .toggle{justify-content:space-between;align-items:center;gap:12px;padding:2px 0 12px;display:flex}.piano-canvas-editor .pair{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.piano-canvas-editor .settings{gap:12px;display:grid}.piano-canvas-editor .list{gap:0;margin:0;padding:0;list-style:none;display:grid}.piano-canvas-editor .item{border-bottom:1px solid #dce2e6;align-items:end;gap:8px;min-width:0;padding:10px 0 14px;display:grid}.piano-canvas-editor .item label{overflow-wrap:anywhere}.piano-canvas-editor .item label output{color:#a13730;margin-top:3px;font:600 11px ui-monospace,monospace;display:block}.piano-canvas-editor .marker-item{grid-template-columns:40px 94px minmax(75px,1fr) minmax(75px,1fr) 28px}.piano-canvas-editor .curve-item{grid-template-columns:40px minmax(90px,1fr) minmax(80px,.6fr) 28px}.piano-canvas-editor .note-item{grid-template-columns:70px 94px minmax(70px,1fr) minmax(72px,1fr) minmax(72px,1fr) 28px}.piano-canvas-editor .midi-stepper{width:100%;display:flex}.piano-canvas-editor .midi-stepper button{flex:0 0 22px;width:22px;padding:0}.piano-canvas-editor .midi-stepper input{text-align:center;border-radius:0;padding:0 2px}.piano-canvas-editor .midi-stepper button:first-child{border-radius:4px 0 0 4px}.piano-canvas-editor .midi-stepper button:last-child{border-radius:0 4px 4px 0}.piano-canvas-editor .item .delete{color:#b1352e;width:28px;padding:0;font-size:19px;line-height:1}.piano-canvas-editor .note-color{gap:3px;display:grid}.piano-canvas-editor .note-color label{align-items:center;gap:3px;font-size:11px;display:flex}.piano-canvas-editor .note-color input[type=color]:disabled{opacity:.5}.piano-canvas-editor .note-batch-color{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px;display:flex}.piano-canvas-editor .note-batch-color label:last-child{align-items:center;gap:6px;margin-left:auto;display:flex}.piano-canvas-editor .range-row{gap:10px;display:grid}@media (max-width:1050px){.piano-canvas-editor .marker-item{min-width:400px}.piano-canvas-editor .curve-item{min-width:320px}.piano-canvas-editor .note-item{min-width:510px}}@media (max-width:520px){.piano-canvas-editor main{grid-template-rows:auto min(240px,32dvh) minmax(0,1fr)}.piano-canvas-editor header{flex-direction:column;align-items:flex-start;gap:8px;padding:10px 14px}.piano-canvas-editor .environment{justify-content:space-between;width:100%;margin-left:0}.piano-canvas-editor .stage{padding:10px}.piano-canvas-editor .panel{padding:14px}}.piano-canvas-editor:fullscreen{border:0;width:100vw}.piano-canvas-editor:fullscreen main{height:100dvh;min-height:0}@media (max-width:760px){.piano-canvas-editor main{height:780px}}