:root{--bg: #fbfaf7;--surface: #ffffff;--paper: #fffdf8;--text: #1f1d1a;--ink: #1f1d1a;--muted: #6f6a62;--line: #e5e1d8;--accent: #28c8c8;--accent-ink: #0d7373;--accent-soft: #dff6f6;--on-accent: #042f2f;--danger: #b3261e;--select: rgba(37, 99, 235, .14);--select-strong: #2563eb;--playing: var(--accent);--toolbar: #eaf3f3;--hover: rgba(0, 0, 0, .06);--tip-bg: #1f2b2b;--tip-text: #f4f7f7;color-scheme:light}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #171614;--surface: #1f1e1b;--paper: #1b1a18;--text: #ece8e1;--ink: #ece8e1;--muted: #a19b91;--line: #34312c;--accent: #28c8c8;--accent-ink: #28c8c8;--accent-soft: #12302f;--on-accent: #042f2f;--danger: #f2b8b5;--select: rgba(96, 165, 250, .22);--select-strong: #60a5fa;--playing: var(--accent);--toolbar: #242b2a;--hover: rgba(255, 255, 255, .08);--tip-bg: #e6eeee;--tip-text: #142020;color-scheme:dark}}:root[data-theme=dark]{--bg: #171614;--surface: #1f1e1b;--paper: #1b1a18;--text: #ece8e1;--ink: #ece8e1;--muted: #a19b91;--line: #34312c;--accent: #28c8c8;--accent-ink: #28c8c8;--accent-soft: #12302f;--on-accent: #042f2f;--danger: #f2b8b5;--select: rgba(96, 165, 250, .22);--select-strong: #60a5fa;--playing: var(--accent);--toolbar: #242b2a;--hover: rgba(255, 255, 255, .08);--tip-bg: #e6eeee;--tip-text: #142020;color-scheme:dark}*{box-sizing:border-box}body{margin:0;accent-color:var(--accent);background:var(--bg);color:var(--text);font-family:Noto Sans TC,-apple-system,PingFang TC,system-ui,sans-serif;-webkit-font-smoothing:antialiased}.legato-tip{position:fixed;z-index:1000;max-width:260px;padding:4px 8px;border-radius:6px;background:var(--tip-bg);color:var(--tip-text);font-size:12px;line-height:1.4;pointer-events:none;opacity:0;transition:opacity .08s}.legato-tip.show{opacity:1}.app{display:flex;flex-direction:column;height:100vh;height:100dvh}.topbar{display:flex;align-items:center;gap:12px;padding:8px 16px;border-bottom:1px solid var(--line);background:var(--surface)}.brand{display:flex;align-items:baseline;gap:12px;min-width:0;flex:1}.name{font-family:Cormorant Garamond,Georgia,serif;font-size:24px;font-weight:600;font-style:italic;color:var(--accent-ink)}.doc-title{font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.controls{display:flex;align-items:center;gap:8px}button{font:inherit;font-size:14px;border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:8px;padding:6px 12px;cursor:pointer}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.6;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);min-width:96px;font-weight:600}button.link{border:none;background:none;padding:0;color:var(--accent-ink);font-size:13px}button.icon{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;font-size:18px;line-height:1}button.chip{display:flex;align-items:center;gap:6px;border-radius:999px;font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}.chip .sep{color:var(--muted)}button.ghost{border-color:transparent;background:none;color:var(--muted)}button.small{padding:2px 6px;font-size:13px}button.danger{border-color:var(--danger);color:var(--danger);background:none}button.toggle,.segmented.small button{padding:4px 8px;font-size:12px}button.toggle.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-ink)}select,input.rename{font:inherit;font-size:14px;padding:5px 6px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text);min-width:0}.workspace{flex:1;display:grid;grid-template-columns:minmax(320px,2fr) 3fr;min-height:0}.editor-pane,.score-pane{display:flex;flex-direction:column;min-height:0;min-width:0}.editor-pane{border-right:1px solid var(--line)}.pane-title{font-size:12px;font-weight:600;letter-spacing:.08em;color:var(--muted);padding:10px 16px 6px}textarea{flex:1;resize:none;border:none;outline:none;padding:8px 16px 16px;background:var(--bg);color:var(--text);font-family:JetBrains Mono,ui-monospace,Menlo,monospace;font-size:13.5px;line-height:1.65;-moz-tab-size:2;tab-size:2}.errors{margin:0;padding:8px 16px 10px 32px;border-top:1px solid var(--line);color:var(--danger);font-size:13px;max-height:120px;overflow:auto}.score-pane{overflow:auto;background:var(--paper)}.hint{margin:10px 16px 0;font-size:12px;color:var(--muted)}.score{padding:4px 8px 80px}.score svg{color:var(--ink)}.score .abcjs-note,.score .abcjs-rest{cursor:pointer}.score .playing,.score .playing path{fill:var(--playing)!important}.score .playing-rest,.score .playing-rest path{fill:var(--playing)!important}.score .playing path{stroke:var(--playing);stroke-width:1.2px}.drawer-root{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;pointer-events:none}.drawer-root.open{pointer-events:auto}.drawer-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000040;opacity:0;transition:opacity .2s}.drawer-root.open .drawer-backdrop{opacity:1}.drawer{position:absolute;top:0;bottom:0;width:min(400px,92vw);background:var(--surface);display:flex;flex-direction:column;box-shadow:0 0 24px #00000026;transition:transform .22s ease}.drawer.left{left:0;transform:translate(-100%)}.drawer.right{right:0;transform:translate(100%)}.drawer-root.open .drawer{transform:none}.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:10px 12px 10px 16px;border-bottom:1px solid var(--line)}.drawer-head h2{margin:0;font-size:16px}.drawer-head button.icon{border-color:transparent;font-size:15px}.drawer-body{flex:1;overflow:auto;padding:12px 16px 24px}.drawer-note,.setting-note{margin:6px 0 0;font-size:12px;color:var(--muted)}.project{margin-top:16px}.project-head{display:flex;align-items:center;gap:6px}.project-head .rename{flex:1}button.project-name{flex:1;text-align:left;border:none;background:none;padding:4px 0;font-weight:600}.score-list{list-style:none;margin:4px 0 0;padding:0}.score-list li{display:flex;align-items:center;gap:2px;border-radius:8px}.score-list li.active{background:var(--accent-soft)}button.score-item{flex:1;min-width:0;text-align:left;border:none;background:none;padding:7px 10px 7px 22px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.score-list li.active button.score-item{color:var(--accent-ink);font-weight:600}button.add{margin:6px 0 0 22px}button.add-project{margin-top:20px;width:100%;border-style:dashed}.setting-group{padding:14px 0;border-bottom:1px solid var(--line)}.setting-group:last-child{border-bottom:none}.setting-group h3{margin:0 0 10px;font-size:13px;letter-spacing:.06em;color:var(--muted)}.group-head{display:flex;align-items:baseline;justify-content:space-between}.tempo,.transpose{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.tempo label{display:flex;align-items:center;gap:4px}.tempo-note{font-size:16px;white-space:nowrap}.tempo input{width:64px;font:inherit;font-size:15px;font-variant-numeric:tabular-nums;text-align:center;padding:5px 4px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text);-moz-appearance:textfield}.tempo input::-webkit-inner-spin-button,.tempo input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.tempo>button:not(.link),.transpose>button{width:34px;padding:6px 0;font-size:16px}.transpose select{flex:1}.transpose small{color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}.check{display:flex;align-items:center;gap:8px;font-size:14px;margin-bottom:8px}.voice-card{padding:10px 0;border-top:1px dashed var(--line)}.voice-card:first-of-type{border-top:none}.voice-name{font-weight:600;margin-bottom:6px}.voice-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.voice-fields label{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--muted)}.voice-fields select{width:100%;min-width:0;color:var(--text);font-size:13px;text-overflow:ellipsis}.voice-mix{display:flex;align-items:center;gap:6px;margin-top:8px}.voice-mix input[type=range]{flex:1;min-width:0}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%);background:var(--text);color:var(--bg);padding:8px 16px;border-radius:8px;font-size:14px;z-index:20}@media(max-width:800px){.app{height:auto;min-height:100dvh}.workspace{grid-template-columns:1fr}.editor-pane{border-right:none;border-bottom:1px solid var(--line)}textarea{min-height:300px}.topbar{padding:8px 12px;gap:8px}.brand .name,button.chip{display:none}button.primary{min-width:0}}.segmented{display:flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;flex-shrink:0}.segmented button{border:none;border-radius:0;padding:6px 12px;font-size:13px;color:var(--muted);background:var(--surface)}.segmented button+button{border-left:1px solid var(--line)}.segmented button.on{background:var(--accent-soft);color:var(--accent-ink);font-weight:600}.workspace.mode-edit,.workspace.mode-view{grid-template-columns:1fr}.workspace.mode-edit .score-pane,.workspace.mode-view .editor-pane{display:none}.workspace.mode-edit .editor-pane{border-right:none}@media(max-width:800px){.segmented button{padding:6px 8px}.doc-title{display:none}.brand{flex:0}.controls{margin-left:auto}}.setting-group .segmented{display:inline-flex}.score .abcjs-bar-number{fill:var(--muted)}button.import{width:100%;margin-bottom:4px;font-weight:600}.busy{position:fixed;top:60px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);padding:10px 16px;border-radius:10px;border:1px solid var(--line);background:var(--surface);box-shadow:0 4px 16px #0000001f;font-size:14px;z-index:15}.spinner{width:16px;height:16px;flex-shrink:0;border:2px solid var(--accent-soft);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.toast{max-width:calc(100vw - 32px)}.range{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:8px}.range label{display:flex;align-items:center;gap:6px;font-size:14px}.range input{width:60px;font:inherit;font-size:15px;text-align:center;padding:5px 4px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text)}.score .legato-selection{fill:var(--select);pointer-events:none}.score .legato-caret{fill:var(--select-strong);pointer-events:none}.selection-bar{display:flex;align-items:center;gap:6px;margin-left:16px;min-width:0}.sel-label{font-size:13px;font-weight:600;color:var(--select-strong);white-space:nowrap}.caret-label{font-weight:500}.score-bar{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 12px 6px 0;background:var(--paper)}.score-bar .hint{margin:0 0 0 16px}.zoom{display:flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;flex-shrink:0}.zoom button{border:none;border-radius:0;padding:4px 10px;font-size:14px;background:var(--surface)}.zoom button+button{border-left:1px solid var(--line)}.zoom .zoom-level{min-width:56px;font-variant-numeric:tabular-nums;font-size:13px}.score{margin:0 auto;user-select:none;-webkit-user-select:none}.score svg{display:block}.score .legato-dim{opacity:.25;transition:opacity .15s}.score-bar{flex-wrap:wrap}.edit-toggle{margin-left:auto;flex-shrink:0}.zoom.floating{position:fixed;right:18px;bottom:18px;z-index:5;border-radius:999px;box-shadow:0 4px 16px #00000024;background:var(--surface)}.zoom.floating button{padding:7px 12px}.workspace.mode-edit .zoom.floating{display:none}.tb-done{flex-shrink:0;margin-left:6px;height:30px;padding:0 14px;border:none;border-radius:999px;background:var(--accent);color:var(--on-accent);font:inherit;font-size:13px;font-weight:600;cursor:pointer}.doc-toolbar{flex-basis:100%;display:flex;align-items:center;gap:1px;margin:2px 0 2px 12px;padding:3px 8px;border-radius:16px;background:var(--toolbar);flex-wrap:wrap;row-gap:2px;white-space:nowrap}.tb-btn{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;gap:2px;height:30px;min-width:30px;padding:0 5px;border:none;border-radius:6px;background:transparent;color:var(--text);font:inherit;font-size:14px;cursor:pointer}.tb-btn:hover:not(:disabled){background:var(--hover)}.tb-btn.on,.tb-btn.open{background:var(--accent-soft);color:var(--accent-ink)}.tb-btn:disabled{opacity:.35;cursor:default}.tb-digit{min-width:26px;font-weight:600;font-variant-numeric:tabular-nums}.tb-add{margin-left:2px;border:1.5px dashed var(--accent);color:var(--accent-ink);font-weight:700}.tb-glyph{font-size:17px}.tb-small{font-size:12px;font-weight:600}.tb-dyn{font-family:Cormorant Garamond,serif;font-style:italic;font-weight:600;font-size:17px;min-width:22px;text-align:center}.tb-dyn.none{opacity:.45}.tb-caret{font-size:10px;opacity:.6}.tb-label{display:inline-flex;align-items:center;gap:4px;font-size:13px}.tb-sep{flex-shrink:0;width:1px;height:20px;margin:0 6px;background:var(--line)}.tb-spacer{flex:1 0 12px}.tb-status{flex-shrink:0;margin-right:4px;font-size:12px;font-weight:600;color:var(--accent-ink)}.tb-popover{position:fixed;z-index:30;min-width:160px;max-width:calc(100vw - 16px);max-height:70vh;overflow:auto;padding:6px;border:1px solid var(--line);border-radius:10px;background:var(--surface);box-shadow:0 8px 28px #00000029}.tb-popover.wide{width:320px}.tb-item{display:flex;align-items:center;gap:10px;width:100%;padding:5px 10px;border:none;border-radius:6px;background:transparent;color:var(--text);font:inherit;font-size:13px;text-align:left;cursor:pointer}.tb-item:hover{background:var(--hover)}.tb-item.on{background:var(--accent-soft);color:var(--accent-ink)}.tb-item.muted{color:var(--muted);border-top:1px solid var(--line);border-radius:0 0 6px 6px;margin-top:4px}.tb-menu-title{margin:2px 4px 8px;font-size:12px;color:var(--muted)}.tb-group{display:grid;grid-template-columns:40px 1fr;gap:6px;align-items:start;padding:4px}.tb-group-name{padding-top:4px;font-size:12px;color:var(--muted)}.tb-chips{display:flex;flex-wrap:wrap;gap:4px}.tb-chip{padding:3px 9px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--text);font:inherit;font-size:12px;cursor:pointer}.tb-chip:hover{border-color:var(--accent);background:var(--accent-soft)}.tb-keys{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:4px 6px;font-size:12px}.tb-keys dt{font-family:JetBrains Mono,monospace;color:var(--accent-ink)}.tb-keys dd{margin:0}@media(max-width:700px){.doc-toolbar{flex-wrap:wrap;border-radius:12px;margin-left:8px;row-gap:2px}.tb-btn{height:36px;min-width:34px}.tb-spacer{display:none}}.score .legato-caret-note,.score .legato-caret-note path{fill:var(--accent)!important}.score .legato-editsel,.score .legato-editsel path{fill:var(--accent)!important}.score .legato-editsel path{stroke:var(--accent);stroke-width:1.5px}@media(max-width:640px){.tool-hint{display:none}.tool-group button.key{min-width:36px}}.score .legato-pending path{fill:transparent!important;stroke:var(--accent);stroke-width:1.8px;stroke-dasharray:3 2}.voice-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.link-danger{border:none;background:none;padding:2px 4px;font:inherit;font-size:12px;color:var(--muted);cursor:pointer}.link-danger:hover,.link-danger.confirm{color:var(--danger)}.link-danger.confirm{font-weight:600}.tb-item.danger{margin-top:6px;border-top:1px solid var(--line);border-radius:0 0 6px 6px;color:var(--danger)}.score .legato-editafter,.score .legato-editafter path{fill:var(--accent)!important;opacity:.5}.score .abcjs-voice-name{cursor:pointer}.score .abcjs-voice-name:hover,.score .abcjs-voice-name:hover path{fill:var(--accent)!important}.voice-menu{position:fixed;z-index:40;width:250px;display:flex;flex-direction:column;gap:10px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 10px 32px #0000002e}.vm-field{display:grid;grid-template-columns:36px 1fr;align-items:center;gap:8px;font-size:12px;color:var(--muted)}.vm-field input,.vm-field select{min-width:0;padding:5px 8px;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--text);font:inherit;font-size:13px}.vm-field input:focus,.vm-field select:focus{outline:2px solid var(--accent);outline-offset:-1px}.vm-row{display:flex;gap:6px}.vm-row .toggle{flex:1}.vm-delete{padding:6px 8px;border:1px solid var(--line);border-radius:6px;background:transparent;color:var(--danger);font:inherit;font-size:13px;cursor:pointer}.vm-delete.confirm{border-color:var(--danger);font-weight:600}.vm-row .toggle:disabled{opacity:.4;cursor:default}.tb-rest{gap:1px;padding:0 6px 0 3px}.tb-rest-label{font-size:12px}.tb-btn.tb-drum{flex-direction:column;gap:0;height:34px;min-width:38px;line-height:1.05}.tb-drum b{font-size:13px}.tb-drum small{font-size:10px;color:var(--muted)}button.import.secondary{margin-top:6px;background:transparent;border-style:dashed}.ext-steps{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:18px}.ext-steps h3{margin:0 0 4px;font-size:14px}.ext-steps p{margin:4px 0;font-size:13px;line-height:1.6}.ext-chats{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 4px}.link-like{border:none;background:none;padding:2px 0;font:inherit;font-size:12px;color:var(--accent-ink);text-decoration:underline;cursor:pointer}.ext-ok{color:var(--accent-ink);font-weight:600}.ext-error{color:var(--danger)}.ext-reply{width:100%;min-height:160px;margin-top:6px;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--text);font-family:JetBrains Mono,monospace;font-size:12px;resize:vertical}.ext-create{margin-top:8px}kbd{padding:1px 5px;border:1px solid var(--line);border-radius:4px;font-family:JetBrains Mono,monospace;font-size:11px;background:var(--surface)}.ext-preview{margin-top:6px;font-size:12px}.ext-preview summary{cursor:pointer;color:var(--accent-ink)}.ext-preview pre{max-height:280px;overflow:auto;margin:6px 0 0;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--paper);font-family:JetBrains Mono,monospace;font-size:11px;line-height:1.5;white-space:pre-wrap;word-break:break-word}.ext-pages{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:8px;font-size:12px;color:var(--muted)}.ext-pages input{width:64px;padding:4px 6px;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--text);font:inherit}.ext-nudge{margin:2px 0 6px;padding:6px 8px;border-left:3px solid var(--accent);background:var(--accent-soft);font-size:12px!important}a.contact{display:inline-block;margin-top:6px;color:var(--accent-ink);font-weight:600;text-decoration:none;word-break:break-all}a.contact:hover{text-decoration:underline}.share-file{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}