:root{--ink:#242832;--muted:#7d8290;--line:#e5e7ec;--accent:#6556ce;--accent-soft:#efedfa;--panel:#fcfcfd;--canvas:#eef0f3;--danger:#bc405b;font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ink);font-size:13px}*{box-sizing:border-box}body{margin:0;background:var(--canvas);height:100dvh;display:flex;flex-direction:column;overflow:hidden}button,input,select{font:inherit}button{color:inherit;cursor:pointer;border:0;background:none}button:disabled{opacity:.35;cursor:default}button:hover:not(:disabled){background:var(--accent-soft);color:var(--accent)}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}input,select{color:var(--ink)}.app-header{height:76px;flex-shrink:0;display:flex;align-items:center;padding:0 26px;background:white;border-bottom:1px solid var(--line);gap:32px}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);font-size:19px;font-weight:700;letter-spacing:2px;min-width:175px}.brand small{display:block;font-size:8px;letter-spacing:2px;color:var(--muted);margin-top:3px}.brand-icon{background:var(--accent);color:#fff;width:36px;height:40px;display:grid;place-content:center;border-radius:9px;font-family:serif;font-size:30px;letter-spacing:0}.document-name{display:flex;flex-direction:column;gap:6px}.document-name strong{font-size:13px;font-weight:550}.document-name span{font-size:10px;color:var(--muted)}.document-name i,.status-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#72a594;margin-right:5px}.header-actions{margin-left:auto;display:flex;align-items:center;gap:12px}.subtle{padding:9px 11px;border-radius:5px;font-size:12px;white-space:nowrap}.button{padding:10px 18px;border-radius:6px;font-size:12px;font-weight:600}.primary{background:var(--accent);color:white}.primary:hover:not(:disabled){background:#5143b9;color:white}.primary span{margin-left:16px}.icon-button{border-radius:5px;min-width:32px;height:32px;font-size:19px;line-height:1}.header-actions .icon-button{border:1px solid var(--line);border-radius:50%;width:25px;min-width:25px;height:25px;font-size:13px}.command-bar{min-height:52px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:15px;padding:7px 24px;flex-shrink:0}.button-group{display:flex;gap:4px}.separator{height:22px;width:1px;background:var(--line);flex-shrink:0}.segmented{display:flex;padding:3px;background:#f5f5f8;border-radius:7px;gap:3px}.segmented button{padding:7px 12px;border-radius:5px;font-size:12px}.segmented button.active{background:white;color:var(--accent);box-shadow:0 1px 5px #28274515}.segmented kbd{color:#9893b1;margin-left:10px;font-size:10px}.toolbar-spacer{flex:1}.zoom{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--muted)}.zoom button{font-size:17px;padding:5px;border-radius:4px}.workspace{display:grid;grid-template-columns:208px minmax(0,1fr) 216px;flex:1;min-height:0}.palette,.inspector{background:var(--panel);padding:27px 20px;overflow-y:auto}.palette{border-right:1px solid var(--line)}.inspector{border-left:1px solid var(--line)}.section-label{color:#a2a5b0;font-size:9px;letter-spacing:2px;margin-bottom:29px;display:flex;justify-content:space-between}.section-label span{letter-spacing:0;font-size:10px}.palette h2,.inspector h2{font-size:11px;font-weight:600;margin:22px 0 11px}.duration-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.duration-button{height:59px;background:white;border:1px solid var(--line);border-radius:7px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px}.duration-button span{font:25px Georgia,serif;line-height:25px}.duration-button small{font-size:9px;color:var(--muted)}.duration-button.active,.tool.active{background:var(--accent-soft);border-color:#c8c1ed;color:var(--accent)}.toggle-row{display:flex;gap:7px;margin:9px 0}.toggle-row>*{flex:1}.tool{border:1px solid var(--line);background:#fff;border-radius:6px;min-height:34px;font-size:11px;padding:7px 9px}.tool b{margin-left:7px;font-size:17px}.accidental-tools{display:flex;gap:7px}.accidental-tools button{flex:1;font:25px Georgia,serif;height:38px;padding:0}.micro{font-size:10px;color:var(--muted);line-height:1.8}.octave-picker{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:6px;height:34px;background:white;font-size:11px}.octave-picker button{width:30px;height:100%}.palette-divider{height:1px;background:var(--line);margin:23px 0}.staff-tools{display:flex;flex-direction:column;gap:6px}.staff-tools button{text-align:left;padding:10px 12px;border:1px solid var(--line);background:white;border-radius:6px;font-size:11px}.staff-tools button.active{background:var(--accent-soft);border-color:#d2cbf0;color:var(--accent)}.staff-tools b{font:20px Georgia,serif;margin-right:11px}.tip{display:flex;gap:12px;margin:29px 0 5px;color:var(--muted);font-size:10px;line-height:2}.tip>span{font-size:20px}.tip p{margin:0}.tip b{font-weight:500;color:#585d6c}.text-button{color:var(--muted);padding:6px 0;font-size:10px;text-align:left}.canvas{overflow:auto;padding:22px 32px 44px;position:relative;scroll-behavior:smooth}.canvas-topline{display:flex;justify-content:space-between;color:#9298a5;font-size:10px;margin:0 auto 20px;max-width:1120px}.paper{background:#fff;box-shadow:0 3px 18px #303c4e0a;border:1px solid #e6e8ed;border-radius:2px;min-height:610px;width:100%;min-width:590px;max-width:1120px;margin:auto;position:relative;padding-bottom:22px;transform-origin:top left}.paper-heading{padding:44px 52px 0;text-align:center}.eyebrow{font-size:8px;color:#b0b2bc;margin-bottom:16px;letter-spacing:2px}.paper-heading input{border:0;background:none;text-align:center;width:100%;display:block;padding:0}.paper-heading #score-title{font:29px Georgia,'Times New Roman',serif;font-weight:600;letter-spacing:.2px;line-height:1.4}.paper-heading #score-composer{font-size:11px;color:#818592;margin-top:11px}.score-tempo{text-align:left;font:13px Georgia,serif;margin:29px 0 0}#notation{padding:0 20px;min-height:220px}#notation svg{display:block;overflow:visible;width:100%;height:auto}.measure-target{fill:transparent;stroke:none;cursor:pointer}.measure-target:hover{fill:#6556ce06}.active-measure{fill:#6556ce04;stroke:#aaa0e145;stroke-width:1;stroke-dasharray:3 4;pointer-events:none}.note-target{fill:transparent;cursor:pointer}.note-target:hover{fill:#6556ce10}.input-mode .measure-target{cursor:crosshair}.playhead{stroke:#6556ce;stroke-width:2;pointer-events:none}.add-measure-inline{border:1px dashed #dedbe9;border-radius:6px;color:#9892ad;font-size:11px;padding:11px 25px;display:block;margin:5px auto 38px}.paper-footer{margin:0 38px;padding-top:16px;border-top:1px solid #eeeff3;display:flex;justify-content:space-between;color:#babcc4;font-size:8px;letter-spacing:1.3px}.inspector #selection-title{font-size:17px;margin-top:0;font-weight:500}.measure-meter{margin:25px 0}.measure-meter>div:first-child{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.measure-meter b{font-size:11px;font-weight:500;color:var(--accent)}.meter-track{height:4px;background:#eceaf4;margin-top:10px;border-radius:5px;overflow:hidden}.meter-track>div{height:100%;background:#9185db;transition:width .15s}.pitch-chips{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:16px}.pitch-chips span{padding:8px 9px;background:var(--accent-soft);border-radius:5px;color:var(--accent);font-size:13px}.wide{display:block;width:100%;text-align:left;margin-top:8px}.danger{color:var(--danger)}.empty-selection{text-align:center;padding:20px 0;color:#9ba0ad;font-size:11px;line-height:1.9}.empty-selection>span{font:40px Georgia,serif;color:#d2cedf}.inspector-note{font-size:10px;line-height:1.9;color:#9296a3;margin-top:30px}.transport{flex-shrink:0;background:white;border-top:1px solid var(--line);z-index:3}.transport-main{height:62px;display:flex;align-items:center;gap:16px;padding:0 24px}.play-button{background:var(--accent);color:white;width:35px;height:35px;border-radius:50%;font-size:12px}.play-button:hover:not(:disabled){background:#5143b9;color:white}.transport-position{font:14px ui-monospace,monospace;white-space:nowrap}.transport-position small{color:#a0a4af;font-size:11px}.tempo-control{display:flex;align-items:center;gap:8px}.tempo-control span{font-size:8px;color:var(--muted);letter-spacing:1px}.tempo-control input{width:43px;border:0;font-size:14px;background:none;padding:0}.tempo-control small{font-size:8px;color:var(--muted)}.volume-control{display:flex;align-items:center;font-size:10px;color:var(--muted);gap:8px}.volume-control input{width:65px;accent-color:var(--accent)}#context-hint{font-size:10px;color:var(--muted)}.keyboard-panel{height:92px;background:#fafbfc;border-top:1px solid #eff0f4;display:flex;justify-content:center;gap:30px;align-items:center;padding:8px 20px}.keyboard-intro{display:flex;flex-direction:column;gap:8px;font-size:11px}.keyboard-intro b{font-weight:500}.keyboard-intro span{font-size:9px;color:var(--muted)}.piano{position:relative;width:420px;height:75px;display:flex;flex-shrink:0}.piano button{border:1px solid #dcdfe6;background:white;position:relative;flex:1;padding:43px 0 5px;border-radius:0 0 4px 4px;font:9px ui-monospace,monospace;color:#acb0bc;transition:background .08s}.piano button.black{position:absolute;top:0;width:20px;height:46px;background:#333847;border:1px solid #282d3b;padding:0;z-index:1;color:transparent}.piano button:hover,.piano button.pressed{background:#e3dff6;color:var(--accent)}.piano button.black:hover,.piano button.black.pressed{background:#8476d0}.keyboard-hint{font-size:10px;color:#8c91a0;line-height:2}.keyboard-hint small{font-size:9px}.toast{position:fixed;bottom:176px;left:50%;transform:translate(-50%,12px);opacity:0;pointer-events:none;background:#282936;color:white;border-radius:7px;padding:12px 20px;font-size:12px;box-shadow:0 8px 30px #23253220;z-index:10;transition:.2s;max-width:90vw}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{border:1px solid var(--line);border-radius:12px;box-shadow:0 24px 90px #20233330;padding:25px;width:min(470px,92vw);max-height:85vh;overflow:auto}dialog::backdrop{background:#26253440;backdrop-filter:blur(3px)}.modal-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.modal-top h2{font-size:17px;font-weight:600;margin:0}.modal-field{display:flex;flex-direction:column;gap:8px;margin:16px 0;font-size:12px}.modal-field input,.modal-field select{width:100%;border:1px solid #dddfe8;border-radius:6px;background:white;padding:10px}.modal-row{display:flex;gap:15px}.modal-row>*{flex:1}.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:24px}.modal-description{color:var(--muted);font-size:12px;line-height:1.9}.export-option{display:block;text-align:left;border:1px solid var(--line);border-radius:7px;padding:15px;width:100%;margin:9px 0}.export-option b{font-size:13px}.export-option span{display:block;font-size:11px;color:var(--muted);margin-top:6px}.shortcut-list{display:grid;grid-template-columns:130px 1fr;gap:11px;font-size:12px;line-height:1.6}.shortcut-list kbd{color:var(--accent);font-size:11px}.render-error{background:#fff2f4;color:#a12d46;padding:20px;margin:15px 0;border-radius:8px;font-size:13px}[hidden]{display:none!important}@media(max-width:1200px){.workspace{grid-template-columns:190px minmax(0,1fr)}.inspector{display:none}.palette{padding:23px 16px}.canvas{padding:20px}.volume-control,#context-hint{display:none}}@media(max-width:760px){.app-header{height:62px;padding:0 13px;gap:14px}.brand{min-width:0;font-size:17px}.brand small,.document-name,.header-actions .subtle,.header-actions .icon-button{display:none}.header-actions{gap:3px}.command-bar{padding:6px 10px;gap:7px;overflow-x:auto}.command-bar .separator{display:none}.command-bar .subtle{padding:8px}.segmented{flex-shrink:0}.segmented button{padding:6px 8px}.segmented kbd{display:none}.zoom{display:none}.workspace{grid-template-columns:78px minmax(0,1fr)}.palette{padding:14px 8px}.section-label{display:none}.palette h2{font-size:10px;margin:13px 0 7px}.duration-grid{grid-template-columns:repeat(2,1fr);gap:4px}.duration-button{height:47px}.duration-button small{font-size:7px}.duration-button span{font-size:21px}.toggle-row{flex-direction:column}.tool{padding:6px 3px;font-size:9px}.accidental-tools{gap:3px}.accidental-tools button{font-size:18px}.palette .micro,.palette .tip,.palette .text-button,.palette-divider{display:none}.octave-picker{font-size:9px}.octave-picker button{width:14px}#octave-label{font-size:9px}.staff-tools button{padding:6px 4px;font-size:9px}.staff-tools b{display:none}.canvas{padding:13px}.canvas-topline{white-space:nowrap;font-size:9px}.canvas-topline>span:last-child{display:none}.paper{min-width:590px}.transport-main{height:55px;padding:0 12px;gap:10px}.tempo-control span,#metronome,#from-start{display:none}.transport-position{font-size:12px}.tempo-control{gap:3px}.transport-main .separator{display:none}.keyboard-panel{height:85px;justify-content:flex-start;overflow-x:auto;padding:5px 10px;gap:0}.keyboard-intro,.keyboard-hint{display:none}.piano{width:100%;min-width:320px}.toast{bottom:150px}}@media print{@page{size:A4;margin:15mm}body{height:auto;overflow:visible;background:white}.app-header,.command-bar,.palette,.inspector,.transport,.canvas-topline,.add-measure-inline,.toast,dialog{display:none!important}.workspace{display:block}.canvas{padding:0;overflow:visible}.paper{border:0;box-shadow:none;width:100%!important;min-width:0;max-width:none;margin:0;padding:0;zoom:1!important}.paper-heading{padding:10px 20px 0}.paper-heading #score-title{font-size:24px}#notation{padding:0}#notation svg{break-inside:auto}.active-measure,.measure-target,.note-target,.playhead{display:none!important}.paper-footer{margin-top:15px}.paper input{outline:0}.render-error{display:none!important}}

.handbell-range{margin:18px auto 0;font-size:12px;letter-spacing:.5px;color:#55546c;border:1px solid #e5e2ef;padding:9px 16px;width:max-content;max-width:100%;border-radius:4px}.command-bar{overflow-x:auto}.command-bar>button{flex-shrink:0}.staff-tools button{line-height:1.5;word-break:break-word}dialog hr{border:0;border-top:1px solid var(--line);margin:24px 0}
.staff-row{display:flex;gap:3px;align-items:stretch}.staff-row .staff-select{flex:1;min-width:0}.staff-row .staff-move{flex:none;width:26px;padding:4px;text-align:center;font-size:15px}.pitch-chips button{padding:7px 9px;background:#f3f1fb;border:1px solid #ddd8f1;border-radius:5px;color:#6556ce;font-size:12px}.pitch-chips button.active{background:#6556ce;border-color:#6556ce;color:white}@media(max-width:1200px) and (min-width:761px){.workspace{grid-template-columns:176px minmax(0,1fr) 198px}.inspector{display:block;padding:20px 14px}.palette{padding:20px 12px}}@media(max-width:760px){.staff-row .staff-move{width:18px;padding:2px;font-size:12px}}

.handbell-range{border:0;padding:0;width:300px;max-width:100%;margin:14px auto 0}.handbell-range svg{display:block;width:100%;height:auto;overflow:visible}
/* Navigable measures and editable handbell inventory. */
.transport-position{border:1px solid var(--line);border-radius:6px;padding:8px 10px;background:#fff;cursor:pointer}.transport-position:hover{border-color:#b7afea}.bar-step{border:1px solid var(--line);border-radius:5px;width:27px;height:30px;font-size:23px;line-height:24px}.bar-label,.bar-selector{cursor:pointer}.bar-label{fill:#6556ce;font-weight:700}.selected-measure{fill:#6556ce0d;stroke:#6556ce99;stroke-width:1.5;pointer-events:none}.handbell-range{width:100%;max-width:920px;margin:18px auto 0}.bell-toolbar{display:flex;align-items:center;justify-content:center;gap:16px;font-size:11px;color:#5b6070}.bell-toolbar button{border:1px solid var(--line);border-radius:5px;padding:5px 8px;font-size:10px}.bell-drawing{overflow-x:auto;margin-top:7px}.bell-drawing svg{min-width:650px}.bell-target{fill:transparent;cursor:pointer}.bell-target:hover{fill:#6556ce20}@media print{.bell-toolbar{display:none}.bell-target,.bar-selector,.selected-measure{display:none!important}.bell-drawing{overflow:visible}}
.canvas{scroll-behavior:auto}
.workspace-dialog{width:min(820px,calc(100vw - 28px));max-width:820px;max-height:88dvh}.workspace-dialog #modal-body{overflow-wrap:anywhere}.workspace-actions{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:12px 0}.workspace-actions .button{border:1px solid var(--line)}.workspace-actions .primary{border-color:transparent}.workspace-error{background:#fff0f2;border:1px solid #f1c3cf;border-radius:7px;padding:12px;color:#a72c49;font-size:12px;line-height:1.7}.library-card,.merge-card{border:1px solid var(--line);background:#fcfcfe;border-radius:9px;padding:16px;margin:12px 0}.library-card strong{font-size:15px}.merge-card h3{font-size:14px;margin:0 0 7px}.part-checks{display:grid;gap:10px;margin:20px 0}.part-checks label{display:flex;gap:10px;align-items:center}.part-checks small{color:var(--muted)}.check-row{display:flex;align-items:flex-start;gap:10px;line-height:1.7;font-size:12px;margin:15px 0}.check-row input,.part-checks input{width:auto;accent-color:var(--accent);flex:none}.part-map{display:grid;grid-template-columns:minmax(90px,1fr) minmax(130px,2fr);align-items:center;gap:12px;margin:10px 0;font-size:12px}.part-map select{border:1px solid var(--line);border-radius:5px;background:#fff;padding:8px;max-width:100%}.file-drop{display:block;border:1px dashed #b7b0d5;background:#f7f5ff;padding:22px;border-radius:8px;line-height:2;font-size:13px}.file-drop input{display:block;width:100%;margin-top:10px}.merge-report{background:#efedf8;border-radius:8px;padding:12px 16px;font-size:12px;line-height:1.7}.merge-report.has-errors{background:#fff0f2;color:#a72c49}.merge-report p{margin:6px 0}.workspace-dialog .modal-row{gap:14px;align-items:flex-start}.workspace-dialog .modal-row>*{min-width:0;flex:1}.workspace-dialog [hidden]{display:none!important}#draft-audio{width:100%;height:36px;margin:10px 0}.draft-wave svg{display:block;width:100%;height:64px}.draft-wave{margin:12px 0}#draft-preview{background:white;border:1px solid var(--line);border-radius:8px;max-height:420px;overflow:auto;padding:8px}#draft-progress{accent-color:var(--accent);flex:1;min-width:120px}.workspace-dialog input[type=number]{min-width:0}@media(max-width:600px){.workspace-dialog .modal-row{flex-wrap:wrap}.workspace-dialog .modal-row>*{flex-basis:42%}.part-map{grid-template-columns:1fr}.header-actions{gap:3px}.header-actions .subtle{padding:7px 5px}}
.mark-heading{font-size:13px;margin:20px 0 8px}.mark-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0}.mark-grid label{display:flex;align-items:center;gap:7px;padding:8px;border:1px solid var(--line);border-radius:6px;font-size:11px}.mark-grid input{width:auto;flex:none;accent-color:var(--accent)}.score-mark,.score-slur{pointer-events:none}@media(max-width:600px){.mark-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.simple-toggle{border:1px solid #cfc9eb;background:#f4f1ff;color:#5143b9;white-space:nowrap}.simple-panel,.simple-octave-controls{display:none}.simple-mode .app-header{height:58px;padding:0 18px;gap:16px}.simple-mode .brand{min-width:0;font-size:17px}.simple-mode .brand-icon{width:31px;height:34px;font-size:24px}.simple-mode .document-name{display:none}.simple-mode .header-actions{gap:5px}.simple-mode .header-actions .subtle{padding:8px}.simple-mode .command-bar{min-height:44px;padding:5px 16px;gap:9px}.simple-mode .command-bar .segmented,.simple-mode .command-bar .separator,.simple-mode .command-bar [data-action]:not([data-action="add-measure"]):not([data-action="delete-note"]){display:none}.simple-mode .workspace{display:grid;grid-template-columns:minmax(0,1fr)}.simple-mode .palette,.simple-mode .inspector{display:none}.simple-mode .canvas{padding:12px 16px 20px}.simple-mode .canvas-topline{margin-bottom:9px}.simple-mode .paper{min-height:0;max-width:1180px}.simple-mode .paper-heading{padding:18px 34px 0}.simple-mode .paper-heading #score-title{font-size:23px}.simple-mode .score-tempo{margin:13px 0 0}.simple-mode .transport-main{height:48px;padding:0 16px;gap:10px}.simple-mode .transport-main .separator,.simple-mode .volume-control,.simple-mode #context-hint,.simple-mode #keyboard-toggle{display:none}.simple-mode .simple-panel{display:block;background:#f8f7fc;border-top:1px solid #dedbea}.simple-panel-top{height:42px;display:flex;align-items:center;gap:13px;padding:3px 16px}.simple-panel-top strong{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-right:auto}.simple-panel-top label{display:flex;align-items:center;gap:7px;white-space:nowrap;font-size:11px}.simple-panel-top select{max-width:170px;height:34px;border:1px solid #d8d5e7;background:#fff;border-radius:6px;padding:0 9px}.simple-panel-top button{height:36px;min-width:84px;border:1px solid #d6d0ee;background:#fff;border-radius:7px;font-weight:600;font-size:11px}.simple-panel-top button.active{background:#6556ce;color:white;border-color:#6556ce}.simple-tabs{display:flex;gap:5px;overflow-x:auto;padding:0 12px;scrollbar-width:thin;border-bottom:1px solid #e6e3f0}.simple-tabs button{flex:none;min-width:79px;height:42px;padding:0 13px;font-size:12px;font-weight:600;border-bottom:3px solid transparent;white-space:nowrap}.simple-tabs button.active{color:#5143b9;border-color:#6556ce;background:#efecfb}.simple-content{min-height:68px;display:flex;align-items:center;gap:8px;padding:8px 14px;overflow-x:auto;scrollbar-width:thin;overscroll-behavior-x:contain}.simple-content button{flex:none;min-width:58px;min-height:48px;padding:7px 13px;border:1px solid #dcd8ec;border-radius:9px;background:#fff;font-size:13px;font-weight:600;white-space:nowrap;touch-action:manipulation}.simple-content button.active{background:#6556ce;border-color:#6556ce;color:white}.simple-mode .keyboard-panel{height:130px;display:flex;justify-content:stretch;gap:14px;padding:8px 16px;overflow:hidden;background:#f5f6fa}.simple-mode .keyboard-intro,.simple-mode .keyboard-hint{display:none}.simple-mode .simple-octave-controls{display:flex;flex:0 0 140px;flex-direction:column;justify-content:center;gap:8px}.simple-octave-controls>span{font-size:11px;color:#717585}.simple-octave-controls>div{display:flex;align-items:center;gap:4px}.simple-octave-controls button{width:40px;height:46px;border:1px solid #d6d3e5;background:#fff;border-radius:7px;font-size:24px;touch-action:manipulation}.simple-octave-controls b{font:11px ui-monospace,monospace;white-space:nowrap}.simple-mode .piano{width:auto;max-width:none;min-width:0;height:112px;flex:1}.simple-mode .piano button{min-width:0;padding:78px 0 6px;font-size:11px;touch-action:manipulation}.simple-mode .piano button.black{width:calc(100% / 20);height:68px;padding:0;transform:translateX(calc(10px - 50%))}.simple-mode .toast{bottom:350px}@media(max-width:850px){.simple-mode .app-header{padding:0 10px}.simple-mode .header-actions .subtle{display:none}.simple-mode .header-actions .button{padding:9px 11px;font-size:11px}.simple-mode .simple-octave-controls{flex-basis:126px}.simple-mode .keyboard-panel{gap:7px;padding:8px 10px}.simple-panel-top{padding:3px 9px}.simple-panel-top select{max-width:110px}.simple-mode .transport-main{padding:0 9px;gap:6px}.simple-mode #metronome{display:none}}@media(max-width:620px){.simple-mode .brand small{display:none}.simple-mode .brand{font-size:14px}.simple-mode .brand-icon{display:none}.simple-mode .command-bar{padding:4px 8px}.simple-mode .command-bar [data-action="delete-note"]{display:none}.simple-mode .simple-octave-controls{flex-basis:102px}.simple-octave-controls button{width:30px;height:42px}.simple-octave-controls b{font-size:9px}.simple-mode .piano button{font-size:9px}.simple-panel-top strong{font-size:10px}.simple-panel-top button{min-width:69px;padding:0 4px}.simple-panel-top select{max-width:82px}.simple-mode .transport-main{height:44px}}@media(max-height:700px){.simple-mode .keyboard-panel{height:108px}.simple-mode .piano{height:90px}.simple-mode .piano button{padding-top:60px}.simple-mode .piano button.black{height:57px}.simple-mode .simple-content{min-height:57px}.simple-content button{min-height:43px}}@media print{.simple-mode .workspace{display:block}.simple-mode .paper{min-width:0;max-width:none}.simple-mode .paper-heading{padding:10px 20px 0}}
.simple-mode .simple-panel-top{height:46px}.simple-mode .simple-panel-top button{height:42px}.simple-mode .simple-tabs button{height:46px}.simple-mode .bar-step{width:38px;height:38px}.simple-mode .transport-position{min-height:38px}.simple-mode .simple-tabs,.simple-mode .simple-content{-webkit-overflow-scrolling:touch}.simple-mode .keyboard-panel{padding-bottom:max(8px,env(safe-area-inset-bottom))}
.simple-mode .keyboard-panel{height:calc(130px + env(safe-area-inset-bottom))}@media(max-height:700px){.simple-mode .keyboard-panel{height:calc(108px + env(safe-area-inset-bottom))}}
.simple-mode .header-actions [data-action="new"],.simple-mode .header-actions [data-action="open"]{display:inline-flex}@media(max-width:850px){.simple-mode .header-actions [data-action="library"],.simple-mode .header-actions [data-action="help"]{display:none}}@media(max-width:620px){.simple-mode .header-actions [data-action="open"]{display:none}}
/* Cloudflare editor: keep the established Music Studio layout. */
.app-header .document-name input{border:0;background:none;padding:0;font-weight:600;font-size:13px;min-width:180px;width:260px}.document-name span{white-space:nowrap}.command-bar{gap:9px;overflow-x:auto;white-space:nowrap}.command-bar label{display:flex;align-items:center;gap:5px;font-size:11px;flex:none}.command-bar select,.command-bar input{height:31px;border:1px solid var(--line);background:#fff;border-radius:5px;padding:0 6px;font-size:11px}.command-bar #bar-number{width:50px}.command-bar #bar-total{font-size:11px;color:var(--muted)}.command-bar .subtle{flex:none;padding:7px 8px}.duration-grid button{height:58px;background:white;border:1px solid var(--line);border-radius:7px;padding:7px 4px;font:11px Georgia,serif}.duration-grid button.active{background:var(--accent-soft);color:var(--accent);border-color:#c8c1ed}.accidentals{display:flex;gap:4px}.accidentals button{flex:1;min-width:0;padding:0;font:21px Georgia,serif;height:38px}.accidentals button:first-child{font:9px system-ui}.accidentals button.active{background:var(--accent-soft);border-color:#c8c1ed;color:var(--accent)}.palette #staff{width:100%;border:1px solid var(--line);background:#fff;border-radius:6px;padding:9px;font-size:11px}.staff-actions{display:flex;gap:5px;margin-top:7px}.staff-actions button:last-child{flex:1}.palette .wide{width:100%}.paper-heading h1{font:600 29px Georgia,serif;margin:0}.paper-heading p{font-size:11px;color:#818592;margin:11px 0 0}.paper-heading #handbell-range{margin:15px auto}.paper-heading #handbell-range .bell-drawing{overflow-x:auto}.paper-heading #handbell-range svg{max-width:none}.paper{min-height:610px}.paper-footer{margin-top:35px}.inspector #selection-label{font-size:17px;margin-top:0}.inspector .pitch-chips{margin-top:23px}.inspector .pitch-chips button{font-size:11px}.transport-main{height:48px}.transport-main strong{font-size:12px}.transport-main span{font-size:10px;color:var(--muted)}.play-button{flex:none}.mark-tabs{display:flex;gap:5px;overflow-x:auto;padding:0 15px;scrollbar-width:thin;border-top:1px solid #eeecf4;border-bottom:1px solid #e6e3f0;background:#faf9fd}.mark-tabs button{flex:none;min-width:77px;height:38px;padding:0 12px;font-size:11px;font-weight:600;border-bottom:3px solid transparent;white-space:nowrap}.mark-tabs button.active{color:#5143b9;border-color:#6556ce;background:#efecfb}.mark-items{display:flex;align-items:center;gap:7px;min-height:52px;padding:6px 15px;overflow-x:auto;background:#f8f7fc;scrollbar-width:thin}.mark-items button{flex:none;min-height:36px;padding:7px 12px;border:1px solid #dcd8ec;border-radius:7px;background:#fff;font-size:11px;white-space:nowrap}.keyboard-row{height:102px;background:#f5f6fa;display:flex;align-items:center;padding:7px 16px;gap:16px;overflow:hidden}.simple-octave{display:flex;align-items:center;gap:5px;flex:none;font-size:10px;color:var(--muted)}.simple-octave button{width:30px;height:37px;border:1px solid #d6d3e5;border-radius:6px;background:white;font-size:20px}.keyboard-scroll{flex:1;overflow-x:auto;overflow-y:hidden;min-width:0;height:84px}.keyboard{position:relative;display:flex;height:78px;width:max-content;min-width:672px}.keyboard .white{width:48px;height:76px;flex:none;border:1px solid #dcdfe6;background:#fff;border-radius:0 0 4px 4px;padding-top:46px;font:9px ui-monospace,monospace;color:#a1a5ae}.keyboard .white:hover{background:#e3dff6;color:var(--accent)}.keyboard .black{position:absolute;top:0;z-index:1;width:30px;height:48px;background:#333847;border:1px solid #282d3b;color:transparent;padding:0}.keyboard .black:hover{background:#8476d0;color:transparent}.legal{font-size:9px;color:#8b8f99;text-align:center;padding:4px 8px;border-top:1px solid #eff0f4;background:#fff}.legal a{color:#6556ce}.toast{bottom:240px}.canvas .bar-label{cursor:pointer}.canvas .bar-label.selected{fill:#6556ce;font-weight:700}.canvas .note-target.selected{fill:#6556ce22}.canvas .note-target:hover{fill:#6556ce12}dialog{max-width:820px}dialog form{margin:0}dialog header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}dialog header h2{font-size:17px;margin:0}dialog header button{font-size:20px}#dialog-body{font-size:12px;line-height:1.6}#dialog-body label{display:block;margin:10px 0}#dialog-body input,#dialog-body select{max-width:100%;border:1px solid #dddfe8;border-radius:6px;background:white;padding:8px}#dialog-body .row,#dialog-body .actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:12px 0}#dialog-body .actions{justify-content:flex-end}#dialog-body button{border:1px solid var(--line);background:white;border-radius:6px;padding:8px 13px}#dialog-body button.primary{border-color:var(--accent);background:var(--accent);color:#fff}#dialog-body [type=checkbox]{width:auto}.staff-actions .tool{font-size:11px}@media(max-width:1200px){.workspace{grid-template-columns:180px minmax(0,1fr) 190px}.inspector{display:block;padding:20px 13px}.palette{padding:20px 13px}.command-bar{padding:6px 12px}}@media(max-width:850px){.workspace{grid-template-columns:minmax(0,1fr)}.palette,.inspector{display:none}.app-header{height:58px;padding:0 12px;gap:12px}.brand{min-width:0;font-size:17px}.brand-icon{width:32px;height:35px;font-size:24px}.document-name{flex:1}.document-name input{max-width:180px}.header-actions{gap:3px}.header-actions .subtle{display:none}.header-actions #library{display:inline-flex}.command-bar{min-height:47px}.canvas{padding:10px 14px}.paper{min-height:0}.paper-heading{padding:18px 32px 0}.paper-heading h1{font-size:23px}.transport-main{height:42px}.transport-hint,.transport-main>span:last-child{display:none}.mark-tabs button{height:45px;min-width:82px;font-size:12px}.mark-items{min-height:58px}.mark-items button{min-height:43px;font-size:12px}.keyboard-row{height:134px;padding:7px 10px;gap:8px}.keyboard-scroll{height:115px}.keyboard{height:112px;min-width:770px}.keyboard .white{height:110px;width:55px;padding-top:78px;font-size:11px}.keyboard .black{width:31px;height:69px}.simple-octave span{display:none}.simple-octave button{width:36px;height:44px}.toast{bottom:280px}}@media(max-width:620px){.brand small,.document-name{display:none}.app-header .header-actions #library{display:none}.command-bar .separator{display:none}.paper{min-width:590px}.transport-main{padding:0 9px}.keyboard{min-width:672px}.keyboard .white{width:48px}.legal{font-size:8px}}@media print{.app-header,.command-bar,.palette,.inspector,.transport,.legal,#dialog{display:none!important}.workspace{display:block}.canvas{padding:0;overflow:visible}.paper{min-width:0;box-shadow:none;border:0}.paper-heading{padding:8px 20px 0}.paper-footer{display:none}}
:root{--key-width:48px}.command-bar #staff-quick{max-width:135px}.command-bar #staff-quick-up,.command-bar #staff-quick-down{min-width:26px;padding:6px}.mark-items button.active{background:#6556ce;color:#fff;border-color:#6556ce}@media(max-width:850px){:root{--key-width:55px}.command-bar #staff-quick{max-width:110px}}
#pitch-chips-mobile{display:none}@media(max-width:850px){#pitch-chips-mobile:not(:empty){display:flex;gap:6px;align-items:center;overflow-x:auto;padding:5px 12px;border-top:1px solid #eeecf4}#pitch-chips-mobile button{padding:7px 9px;background:#f3f1fb;border:1px solid #ddd8f1;border-radius:5px;color:#6556ce;font-size:11px;flex:none}#pitch-chips-mobile button.active{background:#6556ce;color:white}}
.library-entry{display:flex;align-items:center;flex-wrap:wrap;gap:6px;border:1px solid var(--line);border-radius:8px;background:#fcfcfe;padding:12px;margin:10px 0}.library-entry strong{flex-basis:100%;font-size:13px}.library-entry small{flex-basis:100%;color:var(--muted);font-size:10px}
.import-card{border:1px solid var(--line);background:#fcfcfe;border-radius:8px;padding:13px;margin:12px 0}.import-card h3{font-size:13px;margin:0 0 4px}.import-card p{font-size:10px;color:var(--muted)}.import-card label{display:flex!important;align-items:center;gap:8px;justify-content:space-between}.import-card select,.import-card input{max-width:62%!important}#merge-report{background:#efedf8;border-radius:8px;padding:10px 14px;line-height:1.6}#merge-report p{margin:4px 0}#merge-ack-row{display:flex!important;gap:8px;align-items:center}#merge-ack-row[hidden]{display:none!important}
#zoom-label{font-size:10px;color:var(--muted);min-width:31px;text-align:center}.transport-main #metronome{font-size:10px;padding:7px 9px;border:1px solid var(--line);border-radius:6px}.transport-main #metronome.active{background:var(--accent-soft);color:var(--accent);border-color:#c8c1ed}@media(max-width:850px){.transport-main #metronome{font-size:9px;padding:5px 7px}}
