@font-face{font-family:Instrument Sans Variable;font-style:normal;font-display:swap;font-weight:400 700;src:url(/tools/tab-composer/assets/instrument-sans-latin-ext-wght-normal-B5bTHO_g.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Instrument Sans Variable;font-style:normal;font-display:swap;font-weight:400 700;src:url(/tools/tab-composer/assets/instrument-sans-latin-wght-normal-BbzFLZTg.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Hanken Grotesk Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(data:font/woff2;base64,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)format("woff2-variations");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Hanken Grotesk Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/tools/tab-composer/assets/hanken-grotesk-vietnamese-wght-normal-CHiFlh_0.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Hanken Grotesk Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/tools/tab-composer/assets/hanken-grotesk-latin-ext-wght-normal-Dg-wlmqe.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Hanken Grotesk Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/tools/tab-composer/assets/hanken-grotesk-latin-wght-normal-CaVRRdDk.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:JetBrains Mono Variable;font-style:normal;font-display:swap;font-weight:100 800;src:url(data:font/woff2;base64,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)format("woff2-variations");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:JetBrains Mono Variable;font-style:normal;font-display:swap;font-weight:100 800;src:url(/tools/tab-composer/assets/jetbrains-mono-cyrillic-wght-normal-D73BlboJ.woff2)format("woff2-variations");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:JetBrains Mono Variable;font-style:normal;font-display:swap;font-weight:100 800;src:url(/tools/tab-composer/assets/jetbrains-mono-greek-wght-normal-Bw9x6K1M.woff2)format("woff2-variations");unicode-range:U+370-377,U+37A-37F,U+384-38A,U+38C,U+38E-3A1,U+3A3-3FF}@font-face{font-family:JetBrains Mono Variable;font-style:normal;font-display:swap;font-weight:100 800;src:url(/tools/tab-composer/assets/jetbrains-mono-vietnamese-wght-normal-Bt-aOZkq.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:JetBrains Mono Variable;font-style:normal;font-display:swap;font-weight:100 800;src:url(/tools/tab-composer/assets/jetbrains-mono-latin-ext-wght-normal-DBQx-q_a.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:JetBrains Mono Variable;font-style:normal;font-display:swap;font-weight:100 800;src:url(/tools/tab-composer/assets/jetbrains-mono-latin-wght-normal-B9CIFXIH.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Bravura;font-style:normal;font-display:block;font-weight:400;src:local(Bravura),url(/tools/tab-composer/assets/bravura-CBWYXOFh.woff2)format("woff2")}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--font-display:"Instrument Sans Variable", "Instrument Sans", system-ui, -apple-system, sans-serif;--font-body:"Hanken Grotesk Variable", "Hanken Grotesk", system-ui, -apple-system, sans-serif;--font-mono:"JetBrains Mono Variable", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--art:oklch(66.5% .185 47);--art-hover:oklch(60% .185 47);--eng:oklch(58.5% .185 262);--eng-hover:oklch(52% .185 262);--seam:oklch(62% .12 200);--accent-fg:#fff;--bg:#fff;--surface:#fff;--plate:#fff;--ink:#16140f;--ink-soft:#54504a;--muted:#736e65;--line:#ececec;--shadow:0 18px 44px #14120c1f, 0 2px 8px #14120c0f;--shadow-float:0 20px 36px #14120c29;--glass:#ffffffe6;--scale-tint:#3bc4e6;--scale-tint-soft:#d5f1f9;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:18px;--space-5:22px;--space-6:38px;--space-7:56px;--space-8:80px;--radius-0:0px;--radius-pill:999px;--ease:cubic-bezier(.2,.7,.2,1);--dur-fast:.2s;--dur-mid:.35s;--dur-slow:.6s;--content-max:1180px;--gutter:clamp(28px, 9.5vw, 200px);--gutter-lg:clamp(36px, 10vw, 200px)}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0c0c0d;--surface:#141416;--plate:#18181a;--ink:#ecebe5;--ink-soft:#9c9b93;--muted:#85847d;--line:#26262a;--shadow:0 24px 60px #0000008c;--shadow-float:0 26px 50px #0009;--glass:#0c0c0de6;--accent-fg:#0c0c0d;--scale-tint:#2e93ae;--scale-tint-soft:#16343d}.display-l{font-family:var(--font-display);letter-spacing:-.03em;color:var(--ink);font-size:clamp(48px,6.6vw,96px);font-weight:600;line-height:.94}.title{font-family:var(--font-display);letter-spacing:-.01em;color:var(--ink);font-size:23px;font-weight:600;line-height:1.05}.lead{font-family:var(--font-body);color:var(--ink-soft);font-size:19px;font-weight:400;line-height:1.55}.body{font-family:var(--font-body);color:var(--ink);font-size:16px;font-weight:400;line-height:1.6}.body-sm{font-family:var(--font-body);color:var(--ink-soft);font-size:14.5px;font-weight:400;line-height:1.5}.label{font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-size:12.5px;font-weight:500}.label-ink{font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink);font-size:13px;font-weight:500}.caption{font-family:var(--font-mono);letter-spacing:.12em;color:var(--muted);font-size:12px;font-weight:400}*{box-sizing:border-box}html,body{margin:0;overflow-x:hidden}body{font-family:var(--font-body);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}.app{--gutter:var(--space-5);padding:var(--space-4) var(--gutter)}.app-header{justify-content:space-between;align-items:center;gap:var(--space-4);margin:calc(-1 * var(--space-4)) calc(50% - 50vw) var(--space-5);padding:var(--space-4) calc(50vw - 50%);background:var(--surface);border-bottom:1px solid var(--line);flex-wrap:wrap;display:flex}.app-title-block{flex-direction:column;gap:2px;display:flex}.app-title-row{align-items:baseline;gap:var(--space-2);display:flex}.app-title{font-family:var(--font-display);letter-spacing:-.01em;color:var(--ink);margin:0;font-size:26px;font-weight:700}.app-beta-tag{font-family:var(--font-mono);color:var(--ink-soft);font-size:11px}.app-byline{color:var(--ink-soft);font-size:12.5px}.hole-diagram{display:block}.hole{stroke:var(--ink);stroke-width:1.5px}.hole-open{fill:var(--surface)}.hole-covered{fill:var(--ink)}.instrument-body path{stroke:var(--ink);stroke-linejoin:round}.body-line{fill:none}.body-solid{fill:var(--ink)}.body-ground,.body-tint{fill:var(--surface)}.body-tint-on{fill:var(--scale-tint)}.hole-cluster-divider{stroke:var(--ink-soft);stroke-width:1px;opacity:.5}.hand-outline{fill:var(--plate);stroke:var(--ink);stroke-width:1.2px;stroke-linejoin:round}.finger-mark,.hole-map-mark{cursor:pointer}.finger-mark:focus,.hole-map-mark:focus{outline:none}.finger-mark-label{font-family:var(--font-mono);text-anchor:middle;dominant-baseline:central;fill:var(--ink);pointer-events:none;font-weight:600}.finger-mark.is-covered .finger-mark-label{fill:var(--surface)}.finger-mark.is-half .finger-mark-label{paint-order:stroke;stroke:var(--surface);stroke-width:1.2px;stroke-linejoin:round}.hole-map-leader{stroke:var(--ink-soft);stroke-width:.6px;opacity:.6}.hole-map-label{font-family:var(--font-mono);dominant-baseline:central;fill:var(--ink-soft);pointer-events:none;font-weight:600}.mark-ring{fill:none;stroke:var(--ink)}.hole-map-mark.is-active .hole-map-label{fill:var(--ink)}.hole-map-mark.is-active .hole-map-leader{opacity:1}.tab-cell{align-items:center;gap:calc(var(--space-1) * var(--cell-zoom,1));padding:calc(var(--space-2) * var(--cell-zoom,1));border-radius:var(--radius-0);background:var(--surface);border:1px solid var(--line);flex-direction:column;display:flex;position:relative}.tab-cell[draggable=true],.tab-break[draggable=true]{cursor:grab}.tab-cell:hover{box-shadow:0 2px 8px oklch(0% 0 0/.18)}.tab-cell-selected:hover{box-shadow:inset 0 0 0 2px var(--eng), 0 2px 8px oklch(0% 0 0/.18)}.tab-cell-dragging{opacity:.4}.tab-cell-drop-before{box-shadow:inset 3px 0 0 var(--eng)}.tab-cell-drop-after{box-shadow:inset -3px 0 0 var(--eng)}.tab-cell-diatonic{background:color-mix(in oklch, var(--eng) 12%, var(--surface))}.tab-cell-accidental{background:var(--surface)}.tab-cell-out-of-range{opacity:.4;border-style:dashed}.tab-cell-playing{border-color:var(--eng);background:color-mix(in oklch, var(--eng) 24%, var(--surface));transition:background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease)}.tab-cell-selected{box-shadow:inset 0 0 0 2px var(--eng)}.tab-cell-rest{min-width:48px}.tab-cell-row{flex-direction:row}.tab-cell-label{font-family:var(--font-mono);font-size:calc(12px * var(--cell-zoom,1));color:var(--ink-soft)}.degree-label{align-items:baseline;display:inline-flex}.degree-figure{display:inline-block;position:relative}.degree-dots{flex-direction:column;align-items:center;gap:1px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.degree-dots i{background:currentColor;border-radius:50%;width:3px;height:3px;display:block}.degree-dots-above{margin-bottom:2px;bottom:100%}.degree-dots-below{margin-top:2px;top:100%}.degree-accidental{margin-left:1px}.tab-sheet{gap:var(--space-2);flex-wrap:wrap;max-width:100%;display:flex;position:relative;overflow-x:auto}@media (width>=601px){.tab-sheet{max-height:55vh;overflow-y:auto}}.tab-sheet-endless{flex-wrap:nowrap}.tab-sheet-tail{flex:0 0 100%;height:40vh}.tab-sheet-endless .tab-sheet-tail{flex:0 0 40vw;align-self:stretch;height:auto}.tab-sheet-empty{border:1px dashed var(--line);min-height:96px;padding:var(--space-4);justify-content:center;align-items:center}.tab-sheet-empty-hint{text-align:center;max-width:640px;color:var(--ink-soft);margin:0}.staff-sheet-wrap{align-items:flex-start}.staff-sheet{flex:none}.staff-sheet-sticky-header{z-index:1;flex:none;width:0;height:0;position:sticky;top:0;left:0;overflow:visible}.staff-sheet-sticky-header svg{pointer-events:none;position:absolute;top:0;left:0}.tab-break{background:var(--line);width:auto;height:1px;margin:var(--space-1) 0;flex-basis:100%;align-self:auto}.tab-sheet-bars .tab-break-measure{width:2px;height:auto;margin:0 var(--space-1);flex-shrink:0;flex-basis:auto;align-self:stretch}.tab-break-phrase{background:var(--ink-soft);height:2px;margin:var(--space-2) 0}.chart-view-row{gap:var(--space-2);margin-bottom:var(--space-3);flex-wrap:wrap;display:flex}.chart-view-flow{gap:var(--space-2);display:grid}.chart-view-row>.tab-cell{min-width:44px;padding-inline:var(--space-1);flex:none}.chart-view-flow>.tab-cell{min-width:0;padding-inline:var(--space-1)}.chart-view .tab-cell>svg{max-width:100%;height:auto}.instrument-preview{align-items:center;gap:var(--space-2);flex-direction:column;display:flex}.instrument-preview-caption{text-align:center}.chart-preview-label{margin:calc(-1 * var(--space-1)) 0 var(--space-4);font-family:var(--font-mono);color:var(--ink);font-size:20px;font-weight:600;display:block}.charts-controls{gap:var(--space-4);flex-wrap:wrap;display:flex}.charts{gap:var(--space-5);flex-direction:column;display:flex}.charts-masthead{justify-content:space-between;align-items:flex-end;gap:var(--space-4);padding-bottom:var(--space-2);flex-wrap:wrap;display:flex}.charts-masthead-text{min-width:0}.charts-export-btn{flex:none}.charts-export-btn:hover{border-color:var(--eng);color:var(--ink)}.charts-eyebrow{margin-bottom:var(--space-2);display:block}.charts-title.display-l{margin:0;font-size:clamp(32px,4.4vw,54px)}.charts-plate{gap:var(--space-5);padding:var(--space-5);background:var(--plate);border:1px solid var(--line);grid-template-columns:minmax(200px,280px) minmax(180px,280px) minmax(260px,1fr);align-items:stretch;display:grid}.charts-plate-nomap{grid-template-columns:minmax(220px,300px) minmax(0,1fr)}.charts-plate-figure{align-items:center;gap:var(--space-2);flex-direction:column;min-width:0;display:flex;position:relative}.charts-plate-figure svg,.charts-plate-hands>svg{max-width:100%;height:auto;margin-inline:auto;display:block}.charts-figure-toggle{padding:1px var(--space-1);border:1px solid var(--line);color:var(--ink-soft);font-family:var(--font-mono);cursor:pointer;background:0 0;font-size:11px;line-height:1.5;position:absolute;top:0;left:0}.charts-figure-toggle:hover{border-color:var(--eng);color:var(--eng)}.charts-figure-toggle[aria-pressed=true]{border-color:var(--eng);background:var(--eng);color:var(--surface)}.charts-plate-hands{min-width:0;margin-block:calc(var(--space-5) * -1);padding:var(--space-5);border-left:1px solid var(--line);border-right:1px solid var(--line)}.charts-plate-stacked{grid-template-columns:minmax(180px,320px) minmax(260px,1fr)}.charts-plate-stacked .charts-plate-figure{padding-top:var(--space-4);border-top:1px solid var(--line);padding-left:var(--space-5);grid-column:1/-1;align-items:flex-start}.charts-plate-stacked .charts-plate-figure svg,.charts-plate-stacked .chart-preview-label{margin-inline:0}.charts-plate-stacked .charts-plate-hands{border-left:none;margin-bottom:0;padding-left:0}.charts-plate-stacked.charts-plate-nomap{grid-template-columns:minmax(0,1fr)}.charts-plate-side{gap:var(--space-4);flex-direction:column;min-width:0;display:flex}.charts-band-head{align-items:baseline;gap:var(--space-3);margin-bottom:var(--space-3);flex-wrap:wrap;display:flex}.charts-band-note{color:var(--ink-soft)}.charts-grid-panel{padding:var(--space-5);background:var(--plate);border:1px solid var(--line)}.chart-legend{gap:var(--space-2) var(--space-4);margin:0 0 var(--space-4);padding:0 0 var(--space-3);border-bottom:1px solid var(--line);flex-wrap:wrap;list-style:none;display:flex}.chart-legend-item{align-items:center;gap:var(--space-2);display:flex}.chart-legend-swatch{flex:none}.chart-legend-body{fill:var(--surface);stroke:var(--ink-soft);stroke-width:1.2px}.chart-legend-body.is-tinted{fill:var(--scale-tint);stroke:var(--ink)}.chart-view .tab-cell-diatonic,.keyboard-piano-chart .tab-cell-diatonic{background:var(--surface)}@media (width<=1200px){.charts-plate{grid-template-columns:minmax(200px,280px) minmax(0,1fr)}.charts-plate-hands{border-right:none;padding-right:0}.charts-plate-side{padding-top:var(--space-4);border-top:1px solid var(--line);grid-column:1/-1}}@media (width<=900px){.charts-plate,.charts-plate-nomap{grid-template-columns:1fr}.charts-plate-hands{padding:var(--space-4) 0 0;border-left:none;border-top:1px solid var(--line);text-align:center;margin-block:0}.charts-plate-side{border-top:none;order:1;padding-top:0}.charts-plate-hands{order:2}.charts-plate-figure{padding-top:var(--space-4);border-top:1px solid var(--line);order:3}.charts-plate-pair{grid-template-columns:1fr 1fr;column-gap:0}.charts-plate-pair .charts-plate-side{grid-column:1/-1}.charts-plate-pair .charts-plate-hands{padding-right:var(--space-4)}.charts-plate-pair .charts-plate-figure{padding-left:var(--space-4);border-left:1px solid var(--line)}}.browse-filter{align-items:center;gap:var(--space-2);margin-bottom:var(--space-3);cursor:pointer;font-size:.875rem;display:flex}.browse-catalog{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));display:grid}.browse-card{align-items:flex-start;gap:var(--space-1);padding:var(--space-4);text-align:left;background:var(--surface);border:1px solid var(--line);cursor:pointer;flex-direction:column;display:flex}.browse-card:hover{border-color:var(--eng);box-shadow:0 2px 8px oklch(0% 0 0/.18)}.browse-card-title{font-family:var(--font-display);color:var(--ink);font-size:16px;font-weight:600}.browse-card-author{color:var(--ink-soft)}.browse-card-badge{font-family:var(--font-mono);letter-spacing:.06em;color:var(--ink-soft);font-size:11px}.browse-viewer-toolbar{gap:var(--space-2);margin-bottom:var(--space-4);flex-wrap:wrap;display:flex}.browse-viewer-toolbar button{padding:var(--space-2) var(--space-3);border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer}.browse-viewer-toolbar button:hover{border-color:var(--eng)}.charts-range-staff{padding:var(--space-3) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow-x:auto}button.tab-cell,button.tab-break,.keyboard-key{font:inherit;color:inherit;cursor:pointer}button.tab-break{background:var(--line);border:none;padding:0}button.tab-break-phrase{background:var(--ink-soft)}button.tab-break-selected{background:var(--eng)}input,select,button{font-family:var(--font-body)}.app-header-actions{justify-content:flex-end;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.theme-toggle{border:1px solid var(--line);background:var(--surface);width:34px;height:34px;color:var(--ink-soft);cursor:pointer;justify-content:center;align-items:center;padding:0;line-height:1;display:flex}.theme-toggle:hover{border-color:var(--eng)}.icon-menu>summary{justify-content:center;align-items:center;gap:var(--space-1);width:auto;height:34px;padding:0 var(--space-2);border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);display:flex}.menu.icon-menu>summary:after{content:none}.icon-menu>summary:hover{border-color:var(--eng)}.menu-list{gap:var(--space-1);flex-direction:column;min-width:180px;display:flex}.menu-list button{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;text-align:left;white-space:nowrap;padding:var(--space-2) var(--space-3);border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer;font-size:11.5px}.menu-list button:hover{border-color:var(--eng)}.menu-list button:disabled{opacity:.4;cursor:default}.export-dialog-backdrop{z-index:100;padding:var(--space-4);background:#14120c66;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.export-dialog{background:var(--surface);border:1px solid var(--line);width:min(760px,94vw);max-height:min(860px,92vh);box-shadow:var(--shadow-float);flex-direction:column;display:flex}.export-dialog-head{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;display:flex}.export-dialog-head h2{font-family:var(--font-display);color:var(--ink);margin:0;font-size:17px;font-weight:600}.export-dialog-close{color:var(--ink-soft);cursor:pointer;padding:var(--space-1);background:0 0;border:none;font-size:16px;line-height:1}.export-dialog-close:hover{color:var(--ink)}.export-dialog-body{gap:var(--space-3);padding:var(--space-4);flex-direction:column;display:flex;overflow-y:auto}.export-format-list{gap:var(--space-2);flex-direction:column;display:flex}.export-format-list button{align-items:baseline;gap:var(--space-2);padding:var(--space-3);border:1px solid var(--line);background:var(--surface);color:var(--ink);text-align:left;cursor:pointer;display:flex}.export-format-list button:hover:not(:disabled){border-color:var(--eng)}.export-format-list button:disabled{opacity:.4;cursor:default}.export-format-name{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink);font-size:13px;font-weight:500}.export-dialog-loading{padding:var(--space-6) var(--space-4);align-items:center}.export-spinner{border:3px solid var(--line);border-top-color:var(--eng);border-radius:50%;width:28px;height:28px;animation:.8s linear infinite export-spin}@keyframes export-spin{to{transform:rotate(360deg)}}.export-error{color:var(--art)}.export-preview{background:var(--bg);border:1px solid var(--line);justify-content:center;align-items:flex-start;max-height:min(640px,72vh);display:flex;overflow-y:auto}.export-toggle-row{gap:var(--space-4);display:flex}.export-toggle{align-items:center;gap:var(--space-2);color:var(--ink-soft);cursor:pointer;font-size:13px;display:flex}.export-preview-png{max-width:100%;height:auto;display:block}.export-preview-pages{align-items:center;gap:var(--space-2);padding:var(--space-2);flex-direction:column;display:flex}.export-preview-page{max-width:100%;height:auto;box-shadow:var(--shadow);display:block}.export-preview>.export-preview-page{width:auto;max-height:calc(min(640px,72vh) - 2px)}.export-preview-midi{padding:var(--space-6) var(--space-4);text-align:center;color:var(--ink)}.export-preview-midi p{margin:0 0 var(--space-2)}.export-dialog-actions{justify-content:flex-end;gap:var(--space-2);display:flex}.export-dialog-actions button{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;padding:var(--space-2) var(--space-3);border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer;font-size:12px}.export-dialog-actions button:hover{border-color:var(--eng)}.export-dialog-actions .export-download-btn{border-color:var(--eng);background:var(--eng);color:var(--accent-fg)}.export-dialog-actions .export-download-btn:hover{background:var(--eng-hover)}.mode-switch{gap:var(--space-2);display:flex}.mode-switch button{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;padding:var(--space-2) var(--space-3);border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer;font-size:12.5px}.mode-switch button.is-active{color:var(--accent-fg);background:var(--eng);border-color:var(--eng)}.doc-settings{flex:auto;min-width:0}.doc-settings-toggle{align-items:baseline;gap:var(--space-3);font:inherit;text-align:left;padding:var(--space-1) 0;color:var(--ink);cursor:pointer;background:0 0;border:none;display:flex}.doc-settings-summary{align-items:baseline;gap:var(--space-2);flex-wrap:wrap;min-width:0;display:flex}.doc-settings-meta{color:var(--ink-soft);font-size:12.5px}.doc-settings-caret{color:var(--ink-soft);font-size:18px;line-height:1}.doc-settings-body{align-items:flex-end;gap:var(--space-4);margin-top:var(--space-3);flex-wrap:wrap;display:flex}@media (width>=601px){.doc-settings-toggle{display:none}}.doc-settings-readout{font-family:var(--font-display);padding:var(--space-1) 0;color:var(--ink);font-size:19px;font-weight:600}.instrument-fields{align-items:flex-end;gap:var(--space-4);flex-wrap:wrap;display:flex}.field{flex-direction:column;gap:3px;display:flex}.field select{min-width:160px}.field-label{font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);font-size:10.5px}.field-inline{align-items:center;gap:var(--space-2);display:flex}.field-divider{background:var(--line);align-self:stretch;width:1px;margin:2px 0}.title-input{font-family:var(--font-display);border:none;border-bottom:1px solid var(--line);padding:var(--space-1) 0;color:var(--ink);background:0 0;min-width:220px;font-size:19px;font-weight:600}.author-input{border:none;border-bottom:1px solid var(--line);padding:var(--space-1) 0;color:var(--ink-soft);background:0 0;min-width:140px}.title-input:focus,.author-input:focus{border-bottom-color:var(--eng);outline:none}.load-error{color:#b3261e;margin:0 0 var(--space-3)}.tab-strip{margin:var(--space-5) 0;padding:var(--space-5);border:1px solid var(--line);background:var(--surface);min-height:88px;box-shadow:0 -6px 18px #14120c14}.tab-strip-toolbar{align-items:center;gap:var(--space-3);padding-bottom:var(--space-4);margin-bottom:var(--space-4);border-bottom:1px solid var(--line);flex-wrap:wrap;display:flex}.tab-workspace{align-items:flex-start;gap:var(--space-4);display:flex}.tab-canvas{flex:auto;min-width:0}.tab-strip-toolbar button .icon{display:block}.toolbar-group{align-items:center;gap:var(--space-1);display:flex}.toolbar-divider{background:var(--line);align-self:stretch;width:1px}.tempo-control{align-items:center;gap:var(--space-1);font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);font-size:11.5px;display:flex}.tempo-control input[type=range]{width:120px}.tempo-control input[type=number]{width:4.5em;font:inherit;color:inherit;background:var(--surface);border:1px solid var(--line);padding:var(--space-1)}.tempo-control input[type=number]::-webkit-inner-spin-button{margin:0}.tempo-control input[type=number]::-webkit-outer-spin-button{margin:0}.zoom-control{align-items:center;gap:var(--space-1);font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);font-size:11.5px;display:flex}.zoom-control input[type=range]{width:100px}.tab-strip-toolbar button,.tab-strip-toolbar select,.entry-toolbar button,.btn-group button,.charts-export-btn,.menu>summary{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;padding:var(--space-1) var(--space-2);border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer;font-size:11.5px}.tab-strip-toolbar button:disabled,.entry-toolbar button:disabled,.btn-group button:disabled{opacity:.4;cursor:default}.entry-toolbar button.is-danger,.entry-toolbar-clear button:not(:disabled):hover{color:#b3261e;border-color:#b3261e}.entry-toolbar{--toolbar-h:32px;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);padding-bottom:var(--space-3);border-bottom:1px solid var(--line);flex-wrap:wrap;display:flex}.entry-toolbar-icons{gap:1px;display:flex}.entry-toolbar-icons button{min-width:32px;height:var(--toolbar-h);padding:0 var(--space-1);box-sizing:border-box;justify-content:center;align-items:center;display:flex}.entry-toolbar-icons button .icon{display:block}.entry-toolbar-breaks{gap:var(--space-1);display:flex}.entry-toolbar-breaks button{height:var(--toolbar-h);padding:0 var(--space-2);box-sizing:border-box;justify-content:center;align-items:center;display:flex}.break-icon{height:calc(var(--toolbar-h) - 8px);width:auto;display:block}.entry-toolbar-durations{gap:var(--space-1);display:flex}.entry-toolbar-durations .duration-menu{display:flex}.entry-toolbar-durations .duration-menu>summary{height:var(--toolbar-h);box-sizing:border-box;flex:auto;padding-top:0;padding-bottom:0}.entry-toolbar-clear button{height:var(--toolbar-h);box-sizing:border-box}.menu-caret{font-size:13px;line-height:1}.menu{position:relative}.menu>summary{list-style:none}.menu>summary::-webkit-details-marker{display:none}.menu>summary:after{content:" ▾"}.menu[open]>summary{color:var(--accent-fg);background:var(--eng);border-color:var(--eng)}.menu-body{top:calc(100% + var(--space-1));z-index:5;align-items:flex-start;gap:var(--space-3);padding:var(--space-3);background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);flex-direction:column;min-width:220px;display:flex;position:absolute;right:0}.duration-menu .menu-body{top:50%;right:calc(100% + var(--space-2));min-width:0;left:auto;transform:translateY(-50%)}.duration-menu-body{gap:var(--space-1)}.duration-menu-body button{align-items:center;gap:var(--space-2);justify-content:flex-start;width:100%;display:flex}.duration-menu-body .duration-glyph{text-align:center;flex:none;width:1.4em}.duration-menu-name{font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;font-size:11px}.instrument-key-menu>summary{white-space:nowrap}.menu.instrument-key-menu>summary:after,.menu.duration-menu>summary:after{content:none}.btn-group{display:flex}.btn-group button{border-radius:0}.btn-group button+button{border-left:none}.btn-group button.is-active{color:var(--accent-fg);background:var(--eng);border-color:var(--eng)}.btn-group button.is-active+button{border-left:1px solid var(--eng)}.duration-glyph{font-family:Bravura;font-size:20px;line-height:1.4;display:inline-block}.duration-menu>summary{justify-content:center;align-items:center;gap:2px;min-width:56px;display:flex}.entry-toolbar-durations .duration-menu>summary .duration-glyph{transform:translateY(4px)}.tab-strip-toolbar button.is-active{color:var(--accent-fg);background:var(--eng);border-color:var(--eng)}.fingering-monitor{justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-4);border:1px solid var(--line);background:var(--surface);flex-direction:column;flex:0 0 260px;display:flex;box-shadow:0 -6px 18px #14120c14}.fingering-monitor-header{justify-content:space-between;align-items:center;gap:var(--space-3);align-self:stretch;display:flex}.fingering-monitor-meta{font-family:var(--font-mono);letter-spacing:.04em;color:var(--ink-soft);font-size:11.5px}.fingering-monitor-current{align-items:center;gap:var(--space-2);flex-direction:column;justify-content:center;height:137px;display:flex;overflow:hidden}.fingering-monitor-wide{flex:auto;width:100%}.fingering-monitor-wide .fingering-monitor-current{height:auto;min-height:220px}.fingering-monitor-map{justify-content:center;align-items:center;gap:var(--space-4);flex-wrap:wrap;display:flex}.fingering-monitor-mapped .fingering-monitor-current{height:auto;min-height:0}.fingering-monitor-current-row{flex-direction:row}.fingering-monitor-empty{color:var(--ink-soft)}.fingering-monitor-note{font-family:var(--font-mono);color:var(--ink);white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:26px;font-weight:600;overflow:hidden}.fingering-monitor-transport{gap:var(--space-2);flex-direction:column;align-self:stretch;display:flex}.fingering-monitor-progress{background:var(--line);height:4px}.fingering-monitor-progress-fill{background:var(--eng);height:100%;transition:width .12s linear}.fingering-monitor-transport-row{justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.entry-row{align-items:stretch;gap:var(--gutter);margin-top:var(--space-5);display:flex}.keyboard-panel{min-width:0;max-width:min(100%,900px);padding:var(--space-5);border:1px solid var(--line);background:var(--surface);flex:auto;position:sticky;bottom:0;box-shadow:0 -6px 18px #14120c14}.keyboard-panel-label{margin-bottom:var(--space-3);display:block}.keyboard-panel-header{margin-bottom:var(--space-2);align-items:center;display:flex}.keyboard-panel-header .keyboard-panel-label{margin-bottom:0}.keyboard-panel-header-actions{align-items:center;margin-left:auto;display:flex}.keyboard-panel-header-actions .menu>summary{height:var(--toolbar-h);box-sizing:border-box;justify-content:center;align-items:center;gap:2px;display:flex}.keyboard-panel-input.is-locked{opacity:.5;pointer-events:none}@media (width>=601px){.keyboard-panel-input{min-width:600px}}.keyboard{scrollbar-gutter:stable;overflow:auto hidden}.keyboard-scroll{position:relative}.keyboard-accidental-row{min-height:84px;margin-bottom:1px;position:relative}.keyboard-natural-row{display:flex}.keyboard-key-natural-wrap{box-sizing:border-box;flex-direction:column;flex:none;align-items:stretch;margin-left:-1px;display:flex}.keyboard-key-natural-wrap:first-child{margin-left:0}.keyboard-key-natural{width:100%}.keyboard-key-natural-wrap:hover,.keyboard-key-natural-wrap:focus-within{z-index:2}.keyboard-key-natural-wrap:hover .keyboard-key-natural,.keyboard-key-natural-wrap:focus-within .keyboard-key-natural{border-color:var(--eng)}.keyboard-key-accidental-wrap{box-sizing:border-box;z-index:3;flex-direction:column;align-items:stretch;display:flex;position:absolute;top:0;transform:translate(-50%)}.keyboard-key-accidental{width:100%}.keyboard-key-accidental-wrap:hover,.keyboard-key-accidental-wrap:focus-within{z-index:4}.keyboard-key-accidental-wrap:hover .keyboard-key-accidental,.keyboard-key-accidental-wrap:focus-within .keyboard-key-accidental{border-color:var(--eng)}.keyboard .keyboard-key{padding:var(--space-1)}.keyboard-piano-chart .keyboard-key{padding:calc(var(--space-2) * var(--cell-zoom,1))}.keyboard-piano-chart .keyboard-accidental-row{min-height:calc(var(--chart-cell-h,132px) + 48px)}.keyboard-piano-chart.is-squeezed .keyboard-key{padding:2px}.keyboard-piano-chart .keyboard-scroll+.keyboard-scroll{margin-top:var(--space-4)}.keyboard-key:hover{border-color:var(--eng)}.keyboard-key-hint{min-height:1em;font-family:var(--font-mono);text-transform:uppercase;color:var(--ink-soft);text-align:center;font-size:10px;line-height:1;display:block}.keyboard-key-natural-wrap .keyboard-key-hint{margin-top:2px}.keyboard-key-accidental-wrap .keyboard-key-hint{margin-bottom:2px}.piano{scrollbar-gutter:stable;padding-top:12px;overflow:auto hidden}.piano-scroll{position:relative}.piano-white-row{display:flex}.piano-key{padding-bottom:var(--space-1);cursor:pointer;font:inherit;flex-direction:column;justify-content:flex-end;align-items:center;width:100%;height:100%;display:flex;position:relative}.piano-key-white-wrap{box-sizing:border-box;flex-direction:column;flex:none;align-items:stretch;margin-left:-1px;display:flex}.piano-key-white-wrap:first-child{margin-left:0}.piano-key-white{background:var(--surface);border:1px solid var(--muted);height:100px;color:var(--ink)}.piano-key-white-wrap:hover,.piano-key-white-wrap:focus-within{z-index:2}.piano-key-white-wrap:hover .piano-key-white,.piano-key-white-wrap:focus-within .piano-key-white{border-color:var(--eng)}.piano-key-out-of-range{opacity:.35;cursor:default}.piano-key-white-wrap:hover .piano-key-out-of-range,.piano-key-white-wrap:focus-within .piano-key-out-of-range{border-color:var(--muted)}.piano-key-black-wrap{z-index:3;flex-direction:column;align-items:center;width:34px;display:flex;position:absolute;top:-12px;transform:translate(-50%)}.piano-key-black-wrap:hover,.piano-key-black-wrap:focus-within{z-index:4}.piano-key-black{background:var(--ink);border:1px solid var(--ink);height:62px;color:var(--bg)}.piano-key-black-wrap:hover .piano-key-black,.piano-key-black-wrap:focus-within .piano-key-black{border-color:var(--eng)}.piano-key-black .piano-key-label{color:var(--bg)}.piano-key-hint{min-height:1em;font-family:var(--font-mono);text-transform:uppercase;color:var(--ink-soft);text-align:center;margin-top:2px;font-size:10px;line-height:1;display:block}.piano-key-black-wrap .piano-key-hint{margin-top:0;margin-bottom:2px}.piano-key-label{font-family:var(--font-mono);color:var(--ink-soft);font-size:10.5px}.piano-key-label-stacked{line-height:1.15;font-family:var(--font-mono);color:var(--ink-soft);flex-direction:column;align-items:center;font-size:9px;display:flex}.piano-key-black .piano-key-label-stacked{color:var(--bg)}.piano-scale-colors .piano-key-white.piano-key-diatonic,.piano-scale-colors .piano-key-black.piano-key-diatonic{background:color-mix(in oklch, var(--eng) 12%, var(--surface))}.piano-scale-colors .piano-key-white.piano-key-accidental,.piano-scale-colors .piano-key-black.piano-key-accidental{background:var(--surface)}.piano-scale-colors .piano-key-white.piano-key-diatonic,.piano-scale-colors .piano-key-white.piano-key-accidental,.piano-scale-colors .piano-key-black.piano-key-diatonic,.piano-scale-colors .piano-key-black.piano-key-accidental{border-color:var(--muted);color:var(--ink)}.piano-scale-colors .piano-key-black .piano-key-label,.piano-scale-colors .piano-key-black .piano-key-label-stacked{color:var(--ink-soft)}.piano-scale-colors .piano-key-white-wrap:hover .piano-key-white,.piano-scale-colors .piano-key-white-wrap:focus-within .piano-key-white,.piano-scale-colors .piano-key-black-wrap:hover .piano-key-black,.piano-scale-colors .piano-key-black-wrap:focus-within .piano-key-black{border-color:var(--eng)}.piano-scale-colors .piano-key-white-wrap:hover .piano-key-out-of-range,.piano-scale-colors .piano-key-white-wrap:focus-within .piano-key-out-of-range{border-color:var(--muted)}button:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--eng);outline-offset:2px}.title-input:focus-visible,.author-input:focus-visible{outline:none}@media (prefers-reduced-motion:reduce){.tab-cell-playing{transition:none}}@media print{body{color:#000;background:#fff}.app-header-actions,.doc-settings,.load-error,.tab-strip-toolbar,.keyboard-panel,.fingering-monitor{display:none}.tab-strip{border:none;margin:0;padding:0}.tab-cell,.tab-cell-diatonic,.tab-cell-accidental{color:#000;background:#fff;border-color:#999}.tab-cell-label{color:#000}.hole{stroke:#000}.hole-covered{fill:#000}.hole-open{fill:#fff}.hole-cluster-divider,.instrument-body path{stroke:#000}.body-solid{fill:#000}.body-ground,.body-tint{fill:#fff}.body-tint-on{fill:#3bc4e6}}@media (hover:none) and (pointer:coarse){.kbd-hint{display:none}}@media (width<=600px){.app{--gutter:var(--space-1);padding-top:var(--space-3);padding-bottom:var(--space-3)}.app-header{margin:calc(-1 * var(--space-3)) calc(50% - 50vw) var(--space-3);padding:var(--space-3) calc(50vw - 50%)}.app-header-actions{justify-content:flex-start;gap:var(--space-2)}.app-header-actions .theme-toggle{order:2;margin-left:auto}.app-header-actions .mode-switch{flex:100%;order:3}.mode-switch button{min-width:0;padding-inline:var(--space-1);flex:1 1 0}.tab-strip{margin:var(--space-3) 0;padding:var(--space-2)}.tab-strip-toolbar{gap:var(--space-2);padding-bottom:var(--space-2);margin-bottom:var(--space-2)}.fingering-monitor{padding:var(--space-2);flex:none}.keyboard-panel{box-shadow:none;width:auto;padding:var(--space-3);position:static}.entry-row{align-items:stretch;gap:var(--space-3);margin-top:var(--space-3);flex-direction:column-reverse}.app-title{font-size:20px}.doc-settings-body{display:none}.doc-settings-body.is-open{display:flex}.field-divider,.toolbar-divider{display:none}.title-input{width:100%;min-width:0;font-size:17px}.author-input{flex:auto;min-width:0}.menu-list button,.tab-strip-toolbar button,.tab-strip-toolbar select,.entry-toolbar button,.mode-switch button,.menu>summary{min-height:40px;padding:var(--space-1) var(--space-2)}.menu-body{padding:var(--space-2);gap:var(--space-2);min-width:180px}.entry-toolbar{gap:var(--space-2);margin-bottom:var(--space-2);padding-bottom:var(--space-2)}.duration-menu .menu-body{top:calc(100% + var(--space-1));min-width:180px;left:0;right:auto;transform:none}.theme-toggle{width:40px;height:40px}.icon-menu>summary{width:auto;height:40px}.tempo-control,.zoom-control{flex:45%;min-width:0}.tempo-control input[type=range],.zoom-control input[type=range]{flex:1;width:auto;min-width:0;min-height:40px}button.tab-cell{min-width:40px;min-height:40px}.charts-plate,.charts-grid-panel{padding:var(--space-3)}.tab-sheet .hole-diagram{width:40px!important;height:auto!important}.tab-cell-label{font-size:11px}.piano-scroll,.keyboard:not(.keyboard-piano-chart) .keyboard-scroll{width:100%!important}.piano-key-white-wrap,.keyboard:not(.keyboard-piano-chart) .keyboard-key-natural-wrap{flex:1 1 0;min-width:16px}.piano-key-white{height:64px}.piano-key-black-wrap{width:20px}.piano-key-black{height:40px}.keyboard:not(.keyboard-piano-chart) .keyboard-key-accidental-wrap{width:20px!important}.keyboard:not(.keyboard-piano-chart) .keyboard-key{min-height:56px}.keyboard:not(.keyboard-piano-chart) .hole-diagram{width:60%!important;height:auto!important}.piano-key-hint,.piano-key-label,.keyboard-key-hint{font-size:9px}}.technique-mark{color:var(--accent,var(--ink-soft));margin-left:3px;font-size:.85em;font-weight:600}.keyboard-key:disabled{opacity:.35;cursor:not-allowed}.midi-import-panel,.midi-device-panel{margin:0 0 var(--space-4)}.midi-import-body,.midi-device-body{gap:var(--space-3);padding:var(--space-3);border:1px solid var(--line);flex-direction:column;display:flex}.midi-import-meta{align-items:baseline;gap:var(--space-2);flex-wrap:wrap;display:flex}.midi-import-submeta{color:var(--ink-soft)}.midi-import-transpose{align-items:center;gap:var(--space-2);display:flex}.midi-import-transpose-value{font-family:var(--font-mono);text-align:center;min-width:2.5em;font-size:13px}.midi-import-range-readout{margin:var(--space-1) 0 0;color:var(--ink-soft)}.midi-import-preview{border:1px solid var(--line);padding:var(--space-2);overflow-x:auto}.midi-import-actions,.midi-device-actions{gap:var(--space-2);display:flex}.midi-import-actions button,.midi-device-actions button{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;padding:var(--space-1) var(--space-2);border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer;font-size:11.5px}.midi-device-status{color:var(--ink-soft)}.midi-device-last-note{font-family:var(--font-mono)}.shorthand-panel{margin:0 0 var(--space-4)}.shorthand-body{padding:var(--space-3);border:1px solid var(--line)}.shorthand-header{margin-bottom:var(--space-2);justify-content:flex-end;display:flex}.shorthand-help-wrap{position:relative}.shorthand-help-toggle{border:1px solid var(--line);background:var(--surface);width:22px;height:22px;color:var(--ink-soft);font-family:var(--font-mono);cursor:pointer;border-radius:999px;padding:0;font-size:12px;line-height:1}.shorthand-help-toggle[aria-expanded=true]{color:var(--accent-fg);background:var(--eng);border-color:var(--eng)}.shorthand-hint{background:var(--surface);border:1px solid var(--line);width:320px;max-width:80vw;padding:var(--space-2) var(--space-3);z-index:10;position:fixed;box-shadow:0 6px 18px #14120c1f}.shorthand-hint code{font-family:var(--font-mono);background:color-mix(in oklch, var(--eng) 8%, var(--surface));padding:1px 4px;font-size:12px}.shorthand-textarea{width:100%;font-family:var(--font-mono);color:var(--ink);background:var(--surface);border:1px solid var(--line);padding:var(--space-2);resize:vertical;font-size:13px}.shorthand-textarea:focus{border-color:var(--eng);outline:none}.shorthand-error{color:#b3261e;margin:var(--space-2) 0 0}.shorthand-actions{gap:var(--space-2);margin-top:var(--space-2);display:flex}.shorthand-actions button{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;padding:var(--space-1) var(--space-2);border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer;font-size:11.5px}
