@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;font-stretch:75% 100%;src:url(/assets/bricolage-grotesque-vietnamese-standard-normal-Br4FGdAc.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:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;font-stretch:75% 100%;src:url(/assets/bricolage-grotesque-latin-ext-standard-normal-qp-RdZgh.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:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;font-stretch:75% 100%;src:url(/assets/bricolage-grotesque-latin-standard-normal-C5Lc8Qmc.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:Figtree Variable;font-style:normal;font-display:swap;font-weight:300 900;src:url(/assets/figtree-latin-ext-wght-normal-DCwSJGxG.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:Figtree Variable;font-style:normal;font-display:swap;font-weight:300 900;src:url(/assets/figtree-latin-wght-normal-D_ZTVpCC.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}:root{--font:system-ui, sans-serif;--font-display:var(--font);--chord-stretch:100%;--grain:none;--radius:6px;--radius-card:10px;--pill:99px;--bg:#faf8f3;--surface:#fff;--text:#1f1d1a;--muted:#6f6a62;--line:#e4e0d6;--accent:#9a5b05;--danger:#b3261e;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=stage]{--font:system-ui, sans-serif;--font-display:var(--font);--chord-stretch:100%;--grain:none;--radius:3px;--radius-card:4px;--pill:4px;--bg:#000;--surface:#131211;--text:#fff;--muted:#b3aea5;--line:#3c3a36;--accent:#ffc247;--danger:#ff6050;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--base-size:18px}[data-theme=stage][data-scheme=light]{--bg:#fff;--surface:#f2f1ee;--text:#000;--muted:#4d4943;--line:#bbb7af;--accent:#7a4600;--danger:#b91c1c;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=paper]{--font:"Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;--font-display:var(--font);--chord-stretch:100%;--grain:none;--radius:2px;--radius-card:0;--pill:2px;--bg:#f3eee1;--surface:#fbf8f0;--text:#1f1c18;--muted:#6e675b;--line:#d6ccb8;--accent:#8a5306;--danger:#b0281a;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=paper][data-scheme=dark]{--bg:#1d1913;--surface:#26211a;--text:#ece2cc;--muted:#a3967f;--line:#433a2d;--accent:#e6ad4a;--danger:#e57361;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=brass]{--font:"Figtree Variable", system-ui, sans-serif;--font-display:"Bricolage Grotesque Variable", "Figtree Variable", system-ui, sans-serif;--chord-stretch:88%;--radius:8px;--radius-card:14px;--pill:8px;--bg:#f5f1e8;--surface:#fffcf5;--text:#1f1d1a;--muted:#6c675e;--line:#e2dccd;--accent:#9a5b05;--danger:#b3261e;--grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .14  0 0 0 0 .12  0 0 0 0 .1  0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=brass][data-scheme=dark]{--bg:#121110;--surface:#1c1a17;--text:#eeeae2;--muted:#a39d91;--line:#302d28;--accent:#f0b541;--danger:#ff6b5e;--grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1  0 0 0 0 .95  0 0 0 0 .85  0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root{--device-scale:1;--zoom:calc(var(--scale,1) * var(--device-scale));font-size:calc(var(--base-size,16px) * var(--zoom))}@media (width<=30rem){:root{--device-scale:.78}}:root{--page-pad:1rem;--section-pad:.8rem;--bar:1rem;--gutter:1.6rem}@media (width<=30rem){:root{--page-pad:.6rem;--section-pad:.5rem;--bar:.5rem;--gutter:1.3rem}}*{box-sizing:border-box}html{scrollbar-gutter:stable}body{background:var(--bg) var(--grain);color:var(--text);font:1rem/1.4 var(--font);margin:0}.app{min-height:100vh;display:flex}main{min-width:0;max-width:56rem;padding:var(--page-pad) var(--page-pad) 60vh;flex:1;margin:0 auto}aside{background:var(--surface);border-right:1px solid var(--line);flex:none;width:16rem;height:100vh;padding:.6rem .4rem;position:sticky;top:0;overflow-y:auto}aside.drop{box-shadow:inset 0 0 0 2px var(--accent)}aside>header,aside header{align-items:center;gap:.3rem;padding:0 .4rem .5rem;font-size:.85rem;display:flex}aside header .filter{flex:1;min-width:0}.row{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:6px;align-items:center;gap:.3rem;padding:.1rem .2rem .1rem .5rem;display:flex}.row:hover,.row.drop-into{background:var(--bg)}.row.drop-into{box-shadow:inset 0 0 0 2px var(--accent)}.row.drop-before{box-shadow:inset 0 2px 0 var(--accent)}.row.drop-after{box-shadow:inset 0 -2px 0 var(--accent)}.row.current{background:var(--bg);color:var(--accent);font-weight:600}.row .icon{text-align:center;width:1rem;color:var(--muted);flex:none}.row .label,.row input{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.row input{border-color:var(--accent)}.empty{color:var(--muted);padding:0 .5rem}.backdrop{display:none}@media (width<48rem){aside{z-index:20;width:min(18rem,85vw);position:fixed}.backdrop{z-index:19;background:#0006;display:block;position:fixed;inset:0}}.menu{flex:none;position:relative}.floating{z-index:40;max-width:calc(100vw - 16px);position:fixed;top:0;left:0}.menu-list{background:var(--surface);border:1px solid var(--line);min-width:11rem;max-width:min(20rem,100vw - 16px);color:var(--text);border-radius:8px;padding:.25rem;font-weight:400;box-shadow:0 6px 20px #0000002e}.menu-list button{text-align:left;overflow-wrap:anywhere;background:0 0;border:none;width:100%;display:block}.menu-list button:hover{background:var(--bg)}.menu-list .danger{color:var(--danger)}.menu-heading{color:var(--muted);border-top:1px solid var(--line);margin-top:.25rem;padding:.3rem .6rem .1rem;font-size:.75rem}input,select,textarea,button{font:inherit;color:inherit}input,textarea{border-radius:var(--radius);background:0 0;border:1px solid #0000;min-width:0;padding:.15rem .3rem}input:hover,textarea:hover{border-color:var(--line)}input:focus,textarea:focus{border-color:var(--accent);outline:none}select,button{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;padding:.3rem .6rem}button.ghost{color:var(--muted);background:0 0;border-color:#0000;padding:.3rem .45rem}button.ghost:hover,button.ghost.on{color:var(--accent)}.songhead,section>header,.adders,.keychange,.controls{align-items:center;gap:.4rem;display:flex}nav{flex-wrap:wrap;align-items:center;gap:.2rem .4rem;display:flex}main>nav{z-index:15;margin:calc(-1 * var(--page-pad)) calc(-1 * var(--page-pad)) .5rem;padding:.5rem var(--page-pad);background:var(--bg);border-bottom:1px solid var(--line);position:sticky;top:0}.modes{border-radius:calc(var(--radius) + 2px);grid-template-columns:1fr 1fr;padding:2px;font-size:.9rem;transition:background-color .25s,border-color .25s;display:grid;position:relative}.modes>span:not(.thumb){text-align:center;color:var(--muted);padding:.25rem .65rem;font-weight:600;transition:color .25s;position:relative}.modes>span.on{color:var(--surface)}.modes .thumb{border-radius:var(--radius);background:var(--accent);width:calc(50% - 2px);transition:transform .25s cubic-bezier(.3,.7,.4,1),background-color .25s;position:absolute;top:2px;bottom:2px;left:2px}.modes.editing .thumb{transform:translate(100%)}.reading .modes{background:0 0}.reading .modes .thumb{background:var(--line)}.reading .modes>span.on{color:var(--text)}.nav-end{align-items:center;gap:.4rem;margin-left:auto;display:flex}.help-button{white-space:nowrap;border-radius:99px;align-items:center;min-width:1.7rem;height:1.7rem;padding:0 .5rem;font-size:.85rem;font-weight:700;transition:background-color .25s,color .25s,padding .25s;display:inline-flex}.help-mark{text-align:center;width:.7rem}.help-label{opacity:0;max-width:0;transition:max-width .3s cubic-bezier(.3,.7,.4,1),opacity .2s,margin .3s;overflow:hidden}button.ghost.help-button{border-color:var(--line)}button.ghost.help-button.on{background:var(--accent);border-color:var(--accent);color:var(--surface);padding:0 .8rem}.help-button.on .help-label{opacity:1;max-width:10rem;margin-left:.5rem}.songhead{flex-wrap:wrap;align-items:baseline;gap:.2rem 1.5rem;margin:1rem 0}.songhead:has(>.meta){flex-direction:column;align-items:flex-start}.title{flex:0 auto;max-width:100%;font-size:1.6rem;font-weight:700}.meta{max-width:100%;color:var(--muted);flex-wrap:wrap;flex:none;align-items:baseline;gap:.2rem 1.1rem;font-size:1.35rem;display:flex}.meta label{align-items:baseline;gap:.35rem;display:flex}.meta b,.meta .select>button,.meta input{color:var(--accent);font-weight:700}.meta .select>button,.meta input{padding:.05rem .3rem}.autosize.title{grid-template-columns:minmax(0,1fr)}section{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);padding:.6rem var(--section-pad);margin-bottom:.8rem}section>header{flex-wrap:wrap;margin-bottom:.3rem}.name{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);width:10rem;font-size:.85rem;font-weight:700}.badge{color:var(--accent);border:1px solid;border-radius:99px;padding:0 .5rem;font-size:.75rem}.controls{gap:0;margin-left:auto}.block{align-items:flex-start;gap:.4rem;padding:.3rem 0;display:flex}.block textarea{resize:none;field-sizing:content;flex:1}.slots{flex-wrap:wrap;flex:1;align-items:flex-start;gap:.3rem .5rem;min-width:0;display:flex}.slot{flex-direction:column;max-width:100%;scroll-margin:1rem;display:flex;position:relative}.autosize.lyric{grid-template-columns:minmax(0,1fr);max-width:100%}.slot-head{align-items:center;display:flex;position:relative}.slot-head .autosize{flex:1}.pick.remove{font-size:.7rem}@media (hover:none){.pick.remove{display:none}}.pick{opacity:0;padding:.1rem .2rem}.slot:hover .pick,.slot:focus-within .pick,.pick[aria-expanded=true]{opacity:1}@media (hover:none){.pick{opacity:1}}.hint{z-index:5;white-space:nowrap;color:var(--danger);background:var(--surface);border:1px solid var(--danger);border-radius:6px;padding:.1rem .4rem;font-size:.75rem;display:none;position:absolute;top:100%;left:0}.slot-head:hover .hint,.slot-head:focus-within .hint{display:block}.autosize{display:inline-grid}.autosize:after{content:attr(data-value) " ";visibility:hidden;white-space:pre;border:1px solid #0000;grid-area:1/1;min-width:0;padding:.15rem .3rem;overflow:hidden}.autosize input{grid-area:1/1;width:100%}.chord{min-width:2.5rem;color:var(--accent);font-size:1.15rem;font-weight:700}.lyric{min-width:4rem}.lyric input,.autosize.lyric:after{padding-left:calc(.6rem + 1px)}.lyric input::placeholder{color:#0000}.slot:hover .lyric input::placeholder,.lyric input:focus::placeholder{color:var(--muted)}.slots.wordless{row-gap:2.4rem}.slots.wordless:has(.beats.flags){padding-bottom:1.4rem}.slots.wordless .lyric{z-index:5;opacity:0;min-width:6rem;position:absolute;top:100%;left:0}.slots.wordless .lyric:hover,.slots.wordless .lyric:focus-within{opacity:1}@media (hover:none){.slots.wordless .lyric:not(:focus-within){pointer-events:none}}.slots.wordless .lyric input{background:var(--surface);border-color:var(--line)}.chord input{border:1px solid var(--line);border-radius:var(--pill);padding:.1rem .6rem}.reading b.chord{color:var(--accent);align-self:flex-start;padding:0 .15rem}.autosize.chord:after{padding:.1rem .6rem}.slot.picking .chord input{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 18%, transparent)}.chord.invalid input{color:var(--danger);border-color:var(--danger)}.chord.unknown input{-webkit-text-decoration:underline wavy var(--danger);text-decoration:underline wavy var(--danger);text-underline-offset:.2em}.picker{width:min(21rem,100vw - 16px);padding:.6rem}.picker,.keypad{background:color-mix(in srgb, var(--accent) 9%, var(--bg));border:1px solid color-mix(in srgb, var(--accent) 45%, var(--line));border-top:3px solid var(--accent);border-radius:var(--radius-card);box-shadow:0 2px 6px #0003,0 16px 40px #00000059}.picker button:not(.ghost),.keypad button:not(.ghost){background:var(--surface)}.picker h4{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:.5rem 0 .25rem;font-size:.7rem;font-weight:600}.picker h4:first-child{margin-top:0}.picker-grid{gap:.25rem;display:grid}.picker-grid.scale{grid-template-columns:repeat(7,1fr)}.picker-grid.roots,.picker-grid.types{grid-template-columns:repeat(6,1fr)}.picker-grid button{white-space:nowrap;padding:.35rem 0;font-size:.9rem}.picker-grid.scale button{flex-direction:column;align-items:center;line-height:1.15;display:flex}.picker-grid small{color:var(--muted);font-size:.65rem}.picker button.on{border-color:var(--accent);color:var(--accent)}.picker footer{flex-wrap:wrap;align-items:center;gap:.3rem;margin-top:.6rem;display:flex}.picker footer button{white-space:nowrap}.picker-arrows{grid-template-columns:repeat(4,2.6rem);gap:.3rem;margin-top:.6rem;display:grid}.picker footer label{color:var(--muted);align-items:center;gap:.3rem;margin-right:auto;font-size:.85rem;display:flex}.transition{border:1px dashed var(--accent);border-radius:var(--radius);background:color-mix(in srgb, var(--accent) 6%, transparent);width:100%;padding:.3rem .6rem;display:block}button.transition-add{white-space:nowrap;font-size:.8rem}.adders .transition-add{margin-left:auto}.transition.entry{margin-bottom:.5rem}.transition.exit{margin-top:.5rem}.transition>header{justify-content:space-between;align-items:center;min-height:1.6rem;display:flex}.transition .name{color:var(--accent);width:auto}.right{margin-left:auto}.block.linked{box-shadow:inset 3px 0 0 var(--link);border-radius:3px}.chips{flex-direction:column;flex:none;align-items:flex-end;gap:.2rem;display:flex}.block.spot{background:color-mix(in srgb, var(--link) 16%, transparent);box-shadow:inset 3px 0 0 var(--link), 0 0 0 2px var(--link)}.dot{background:var(--link);border-radius:50%;flex:none;width:.6rem;height:.6rem}.chip{border-color:var(--link);border-radius:99px;flex:none;align-items:center;gap:.3rem;max-width:10rem;padding:.1rem .5rem;font-size:.8rem;display:flex}.chip.on{background:color-mix(in srgb, var(--link) 25%, var(--surface))}.chip-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.chip small,.saved-name small{color:var(--muted)}.link-panel{width:17rem;max-width:80vw}.link-panel input{border-color:var(--line);width:100%;margin-bottom:.25rem}.link-panel p{color:var(--muted);white-space:normal;margin:.3rem .4rem;font-size:.8rem}.link-panel .create{color:var(--accent);white-space:normal}.link-panel kbd{float:right;font:inherit;color:var(--muted);border:1px solid var(--line);border-radius:4px;padding:0 .3rem;font-size:.7rem}.saved-row{align-items:center;display:flex}.menu-list .saved-row button{width:auto}.menu-list .saved-row .saved-name{flex:1;align-items:center;gap:.4rem;min-width:0;display:flex}.saved-name:disabled{cursor:default}button:disabled{opacity:.4;cursor:default}.saved-name:disabled{opacity:1}.keychange{color:var(--muted);flex-wrap:wrap;padding:.3rem 0;font-size:.9rem}.flow>.keychange{padding:0 var(--section-pad) .8rem}.adders{flex-wrap:wrap;margin-top:.4rem}.adders button{color:var(--muted);font-size:.85rem}.adders.song{margin-top:1rem}.handle{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;flex:none}.handle.section{color:var(--muted);padding:.1rem .2rem;font-size:1.2rem;line-height:1}.handle.object{color:var(--line);padding:.2rem .25rem;font-size:.9rem}.handle:hover{color:var(--accent)}.dragging{opacity:.45}.drop-before{box-shadow:0 -3px 0 var(--accent)}.drop-after{box-shadow:0 3px 0 var(--accent)}section{position:relative}section.colored{background:color-mix(in srgb, var(--section) 7%, var(--surface))}.reading section,.reading section.colored{margin-bottom:calc(var(--object-gap,1rem) * 1.2);background:0 0;border:none;border-radius:0;padding:0}.reading section>header{margin-bottom:.1rem}.reading section [data-reorder-list]{gap:calc(var(--object-gap,1rem) * .5)}.reading .transition.entry{margin-bottom:.3rem}.reading .transition.exit{margin-top:.3rem}main:not(.reading) section{padding-left:calc(var(--bar) + var(--section-pad))}.colorbar{width:var(--bar);border-radius:var(--radius-card) 0 0 var(--radius-card);background:var(--section,var(--line));border:none;padding:0;position:absolute;inset:-1px auto -1px -1px}.colorbar:hover{filter:brightness(1.15)}.swatch-pop{background:var(--surface);border:1px solid var(--line);border-radius:99px;padding:.35rem;box-shadow:0 6px 20px #0000002e}section.colored>header .name{color:var(--section)}.swatches{flex-direction:column;gap:.35rem;display:flex}.swatches .swatch{border:none;border-radius:50%;width:1.6rem;height:1.6rem;padding:0;transition:transform .1s}.swatches .swatch:hover{transform:scale(1.12)}.swatches .swatch.on{box-shadow:0 0 0 2px var(--surface), 0 0 0 4px var(--text)}.swatches .swatch.none{background:linear-gradient(135deg, transparent 46%, var(--muted) 46% 54%, transparent 54%), var(--surface);border:1px solid var(--line);margin-top:.15rem}h1.title{line-height:inherit;border:1px solid #0000;margin:0;padding:.15rem .3rem}.reading section>header .name{width:auto;color:var(--text);padding:0;font-size:1rem}.reading section.colored>header .name{color:color-mix(in srgb, var(--section) 75%, var(--text))}.reading .slots{gap:.5rem 1.2rem;padding:.3rem 0}.reading .chord{min-width:0;font-size:1.25rem}.reading .lyric{min-width:0}.text{white-space:pre-wrap;margin:.3rem 0}.meta input.tempo{border-color:var(--line);text-align:center;-moz-appearance:textfield;width:3.6rem}.meta input.tempo::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.meta input.tempo::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.tempo-field{align-items:center;gap:.15rem;display:inline-flex}.tempo-step{padding:.1rem .35rem;font-size:1.2rem;line-height:1}.beat-note{color:var(--text);align-items:flex-end;display:inline-flex}.beat-note .note-icon{width:.8em;height:1.2em}.beat-dot{margin-left:.05em;font-weight:800}.beat-select>button{align-items:center;display:inline-flex}.barline{background:color-mix(in srgb, var(--text) 70%, transparent);border-radius:1.5px;flex:none;align-self:flex-start;width:3px;height:calc(1.81rem + 2px)}.slots:has(.beats.flags) .barline{height:calc(3.21rem + 2px)}.beats{font-variant-numeric:tabular-nums;padding:0 .25rem;font-size:.75rem}.beats.on{color:var(--accent);font-weight:700}sub{color:var(--muted);margin-left:.15em;font-size:.6em;font-weight:400}.lyric.late{padding-left:1.5rem}.melody{border-radius:6px;outline:none;flex:1;min-width:0}.melody.active{box-shadow:0 0 0 1px var(--accent)}.melody-row{align-items:center;gap:.4rem;min-width:0;display:flex;overflow-x:auto}.staff{zoom:var(--zoom,1);-webkit-user-select:none;user-select:none;flex:none;line-height:0}.staff svg *{fill:var(--text);stroke:var(--text)}.staff svg [fill=none]{fill:none}.staff svg [stroke=none]{stroke:none}.staff [data-index]{cursor:pointer}.staff .held{opacity:.45}.staff .current *{fill:var(--accent);stroke:var(--accent)}.staff .current [fill=none]{fill:none}.staff svg .hit{fill:#0000;stroke:none}.staff svg .hit.current{fill:color-mix(in srgb, var(--accent) 10%, transparent)}.staff svg .hit.focus{fill:color-mix(in srgb, var(--accent) 26%, transparent)}.staff{touch-action:manipulation;-webkit-touch-callout:none}.staff svg .label{fill:var(--muted);stroke:none;text-anchor:middle;font-size:10px}.staff svg .caret{fill:var(--accent);stroke:none}.keypad{padding:.5rem}.keypad-keys{flex-direction:column;gap:.3rem;width:min(22rem,100vw - 2rem);display:flex;container-type:inline-size}.keypad-grid{grid-template-columns:repeat(5,1fr);gap:.3rem;display:grid}.keypad-notes{grid-template-columns:repeat(8,1fr);gap:.3rem;display:grid}.keypad button{min-width:0;padding:.35rem .2rem;font-size:min(1rem,4.1cqi);overflow:hidden}.keypad button.arrow{border-color:var(--muted);font-weight:700}.keypad-notes>button{flex-direction:column;align-items:center;line-height:1.1;display:flex}.keypad-notes small{color:var(--muted);font-size:.65rem}.accidentals{flex-direction:column;gap:.15rem;display:flex}.accidentals button{flex:1;line-height:1;padding:0!important}@media (pointer:coarse){.keypad-keys{gap:.4rem;width:min(24rem,100vw - 2rem)}.keypad-grid,.keypad-notes,.keypad-types{gap:.4rem}.keypad button{padding:.65rem .2rem;font-size:min(1.05rem,4.3cqi)}.keypad-types button{white-space:nowrap;font-size:min(.9rem,3.8cqi)}}.view-switch{flex-direction:column;flex:none;align-self:flex-start;gap:.15rem;display:flex}.view-switch button{width:1.9rem;height:1.7rem;color:var(--muted);opacity:.6;place-items:center;padding:0;font-size:.7rem;display:grid}.view-switch button.on{color:var(--accent);opacity:1;background:color-mix(in srgb, var(--accent) 14%, transparent)}.view-switch svg,.note-icon{stroke:currentColor;stroke-width:1.2px;fill:none}.view-switch svg .filled,.note-icon .filled{fill:currentColor;stroke:none}.note-icon .hollow,.note-icon .flag{stroke-width:1.4px}.reading .view-switch button:not(.on){opacity:.35}.staff svg .chord{fill:var(--text);stroke:none;font-size:13px;font-weight:700}.staff.dots svg .dot{fill:var(--accent);stroke:none}.staff.dots .current .dot{fill:var(--text)}.staff.dots svg .tonic{fill:color-mix(in srgb, var(--muted) 18%, transparent);stroke:none}.staff.dots svg .fifth{stroke:var(--line);stroke-width:1px;stroke-dasharray:2 3}.staff.dots svg .bar{stroke:var(--muted);stroke-width:1.5px}.staff.dots svg .rest{stroke:var(--muted);stroke-width:2px;stroke-dasharray:3 3}.staff.dots svg .tie{fill:none;stroke:var(--muted)}.keypad-lengths,.keypad-selection{grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:.3rem;display:grid}.keypad-selection button{font-size:.85rem}.keypad-lengths button{place-items:center;display:grid;padding:.15rem .2rem!important}.keypad button.on{border-color:var(--accent);color:var(--accent)}.other-length{grid-template-columns:2.6rem minmax(0,1fr) 2.6rem;gap:.3rem;margin-top:.3rem;display:grid}.other-length label{color:var(--muted);justify-content:center;align-items:center;gap:.35rem;display:flex}.other-length input{text-align:center;width:4rem;font:inherit;font-variant-numeric:tabular-nums;color:var(--text)}.dot-key{font-size:1.4rem;line-height:1}.keypad sub,.keypad sup{font-size:.6em}.pickup-label{color:var(--muted);font-size:.75rem;font-style:italic}.choices{flex-wrap:wrap;gap:.3rem;display:flex}.choices button.on,.link-panel .saved-name.on{border-color:var(--accent);color:var(--accent)}.staff svg .append{fill:#0000;stroke:none;cursor:copy}.staff svg .append:hover{fill:color-mix(in srgb, var(--accent) 6%, transparent)}.repeat{color:var(--accent);flex:none;align-self:center;padding:0 .4rem;font-size:1.4rem;font-weight:800}.repeated{align-items:flex-start;gap:.4rem;display:flex}.repeated>:first-child{flex:1;min-width:0}.sheet{--chord-row:1.85rem;align-items:start;row-gap:.4rem;padding:0;display:grid}.sheet-bar{min-width:0;display:grid;position:relative}.sheet-bar:before,.sheet-bar.last:after{content:"";width:3px;height:calc(var(--chord-row) - .4rem);background:color-mix(in srgb, var(--text) 75%, transparent);border-radius:1.5px;position:absolute;top:.2rem}.sheet-bar.flags:before,.sheet-bar.flags.last:after{height:calc(var(--chord-row) - .4rem + 1.7rem - .3rem)}.sheet-bar:before{left:0}.sheet-bar.last:after{right:0}.sheet-cell{min-width:0;padding:0 .2rem 0 .45rem}.sheet-chord{height:var(--chord-row);align-items:center;display:flex;position:relative}.sheet .chord{white-space:nowrap}.sheet .slash{color:var(--muted);font-size:1.15rem;position:absolute}.sheet .slash.covered{visibility:hidden}.sheet .lyric{overflow-wrap:break-word;min-width:0;padding-left:calc(.6rem + 1px)}.sheet .lyric.late{padding-left:calc(1.6rem + 1px)}.sheet-lead{max-width:9rem;padding:var(--chord-row) .6rem 0 0;text-align:right}.sheet-lead.above{text-align:left;max-width:none;margin-bottom:-.5rem;padding:0 0 0 calc(1.05rem + 1px)}.sheet-after{height:var(--chord-row);align-items:center;padding-left:.4rem;display:flex}.sheet-words{white-space:pre-wrap}.slashes{color:var(--muted);white-space:pre;letter-spacing:.2rem;margin-left:.15rem;font-weight:400}.tabs{margin:0 .4rem .6rem;display:flex}.tabs button{color:var(--muted);border-radius:0;flex:1}.tabs button:first-child{border-radius:6px 0 0 6px}.tabs button:last-child{border-left:none;border-radius:0 6px 6px 0}.tabs button[aria-selected=true]{background:var(--bg);color:var(--text);font-weight:600}.row .count{text-align:center;min-width:1.2rem;color:var(--muted);flex:none;font-weight:400}.row .label small{color:var(--muted);font-size:.75rem;font-weight:400;display:block}.row button.icon{background:0 0;border:none;padding:0}.row.arrangement{padding-left:1.9rem;font-size:.92rem}.unsaved-dot{background:var(--accent);border-radius:50%;flex:none;width:.45rem;height:.45rem}.sort{color:var(--muted);flex:1;align-items:center;gap:.3rem;display:flex}.setlist-fields{flex-direction:column;gap:.3rem;padding:0 .4rem .6rem;display:flex}.setlist-name{font-size:1.05rem;font-weight:700}.setlist-meta{flex-direction:column;gap:.3rem;display:flex}.setlist-meta input{flex:1;min-width:0}ol.set{margin:0;padding:0;list-style:none}.row .number{font-variant-numeric:tabular-nums;font-size:.8rem}.setlist-adders{flex-wrap:wrap;gap:.3rem;margin:.5rem .4rem;display:flex}.song-picker{border-top:1px solid var(--line);margin-top:.6rem;padding-top:.6rem;scroll-margin-top:.5rem}.song-picker .row.on{background:var(--bg)}.song-picker .row.create .label{color:var(--accent)}.row.one-off .label{font-style:italic}.place-field{position:relative}.place-field input{width:100%}.place-tag{border:1px solid var(--line);background:var(--bg);border-radius:99px;align-items:center;max-width:100%;display:inline-flex}.place-tag button{text-overflow:ellipsis;white-space:nowrap;min-width:0;padding:.1rem .5rem;overflow:hidden}.place-tag button+button{color:var(--muted);padding:.1rem .45rem .1rem 0}.place-options{min-width:0;max-height:14rem;overflow-y:auto}.place-option{border-radius:6px;align-items:center;display:flex}.place-option.on{background:var(--bg)}.place-option button[role=option]{text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}.menu-list .place-option .forget{width:auto;color:var(--muted);flex:none}.default-choice{color:var(--muted);margin-left:.5rem;font-size:.7em}.select-value .default-choice{display:none}.slide-next{animation:.18s ease-out slide-from-right}.slide-previous{animation:.18s ease-out slide-from-left}@keyframes slide-from-right{0%{opacity:.3;transform:translate(2.5rem)}}@keyframes slide-from-left{0%{opacity:.3;transform:translate(-2.5rem)}}@media (prefers-reduced-motion:reduce){.slide-next,.slide-previous{animation:none}}.keypad-types{grid-template-columns:repeat(8,1fr);gap:.3rem;display:grid}.keypad-types.all{grid-template-columns:repeat(6,1fr)}.keypad-length{font-variant-numeric:tabular-nums;color:var(--muted);place-items:center;display:grid}button.row{text-align:left;width:100%;font:inherit;color:inherit;background:0 0;border:none}.row.static{cursor:default}.row.static:hover{background:0 0}.pick-arrangements{flex-wrap:wrap;gap:.25rem;padding:.1rem .4rem .4rem 1.9rem;display:flex}.pick-arrangements button{padding:.1rem .5rem;font-size:.82rem}.save{align-items:center;gap:.35rem;min-width:0;display:flex}.save .arrangement{border:1px solid var(--line);color:var(--muted);white-space:nowrap;text-overflow:ellipsis;border-radius:99px;max-width:10rem;padding:.05rem .5rem;font-size:.8rem;overflow:hidden}.save .unsaved{color:var(--accent);font-size:.8rem}button.primary{background:var(--accent);border-color:var(--accent);color:var(--surface);font-weight:600}.set-nav{color:var(--muted);white-space:nowrap;align-items:center;gap:.1rem;font-size:.85rem;display:flex}.set-nav button{padding:0 .5rem;font-size:1.2rem}.adders .paste{border-style:dashed;border-color:var(--accent);color:var(--accent)}section [data-reorder-list]{gap:var(--object-gap,1rem);flex-direction:column;display:flex}section [data-reorder-list]>*{margin-top:0;margin-bottom:0}main:not(.reading) section{background:color-mix(in srgb, var(--section,var(--muted)) 6%, var(--bg));margin-bottom:calc(var(--object-gap,1rem) * 1.4)}main:not(.reading) section>header{background:color-mix(in srgb, var(--section,var(--muted)) 14%, var(--surface));border-radius:var(--radius);margin-bottom:.5rem;padding:.2rem .3rem}main:not(.reading) section>header .name{color:var(--text);font-size:.95rem}main:not(.reading) section.colored>header .name{color:color-mix(in srgb, var(--section) 70%, var(--text))}main:not(.reading) .handle.section{color:var(--section,var(--muted))}main:not(.reading) .block,main:not(.reading) section .keychange{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);gap:.5rem;padding:.35rem .5rem .35rem 0}main:not(.reading) section .keychange{padding-top:0;padding-bottom:0}.handle.object{width:var(--gutter);border-right:1px solid var(--line);border-radius:var(--radius) 0 0 var(--radius);color:var(--muted);flex-direction:column;align-self:stretch;align-items:center;gap:.25rem;margin:-.35rem 0;padding:.35rem 0;font-size:1rem;line-height:1;display:flex}section .keychange .handle.object{justify-content:center;min-height:2.2rem;margin:0}.handle.object:hover{color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, transparent)}.block-chords>.handle:after,.block-melody>.handle:after,.block-text>.handle:after,.block-scribble>.handle:after{opacity:.75;font-size:.8rem}.block-chords>.handle:after{content:"♯"}.block-melody>.handle:after{content:"♪"}.block-scribble>.handle:after{content:"✎"}.block-text>.handle:after{content:"¶"}main:not(.reading) section .adders button{color:var(--muted);background:0 0;border-color:#0000;padding:.2rem .5rem}main:not(.reading) section .adders button:hover{color:var(--accent);background:var(--surface);border-color:var(--line)}main:not(.reading) section .adders .paste{border-color:var(--accent);color:var(--accent);border-style:dashed}.swatches .swatch.own{cursor:pointer;background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red);display:block;position:relative}.swatch-pop.with-wheel{border-radius:1.15rem;gap:.6rem;display:flex}.color-wheel{gap:.6rem;padding:.2rem .3rem .2rem 0;display:flex}.wheel{background:linear-gradient(rgb(0 0 0/var(--darken)), rgb(0 0 0/var(--darken))), radial-gradient(closest-side, #fff, #fff0), conic-gradient(red, yellow, lime, cyan, blue, magenta, red);cursor:crosshair;touch-action:none;border-radius:50%;align-self:center;width:11rem;height:11rem;position:relative}.wheel-mark{pointer-events:none;border:2px solid #fff;border-radius:50%;width:1rem;height:1rem;margin:-.5rem 0 0 -.5rem;position:absolute;box-shadow:0 0 0 1px #00000080}.wheel-value{writing-mode:vertical-lr;appearance:none;cursor:pointer;direction:rtl;border-radius:99px;width:1rem;height:auto;margin:0}.wheel-value::-webkit-slider-thumb{appearance:none;border:2px solid var(--text);background:#fff;border-radius:50%;width:1.2rem;height:1.2rem}.wheel-value::-moz-range-thumb{border:2px solid var(--text);background:#fff;border-radius:50%;width:1rem;height:1rem}.help-shade,.help-ring{z-index:90;pointer-events:none;position:fixed}.help-shade{background:#0009;animation:.2s fade-in;inset:0;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-composite:xor;mask-composite:exclude}.help-ring{border-radius:var(--radius);box-shadow:0 0 0 2px var(--accent);transition:left .12s,top .12s,width .12s,height .12s}@keyframes fade-in{0%{opacity:0}}.help-card{z-index:92;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);width:min(24rem,100vw - 16px);max-height:calc(100vh - 16px);padding:.6rem .9rem .8rem;font-size:.92rem;position:fixed;top:0;left:0;overflow-y:auto;box-shadow:0 10px 30px #00000059}.help-card header{justify-content:space-between;align-items:center;display:flex}.help-card h3{margin:0;font-size:1.05rem}.help-card p{margin:.4rem 0}.help-card .how{color:var(--muted)}.help-keys{border-top:1px solid var(--line);gap:.25rem;margin:.6rem 0 0;padding-top:.5rem;display:grid}.help-keys>div{grid-template-columns:minmax(7rem,auto) 1fr;align-items:baseline;gap:.6rem;display:grid}.help-keys dt{flex-wrap:wrap;gap:.2rem;display:flex}.help-keys dt>span{align-items:baseline;gap:.2rem;display:inline-flex}.help-keys dd{margin:0}.help-keys .or{color:var(--muted);margin-right:.2rem}kbd{border:1px solid var(--line);background:var(--bg);white-space:nowrap;border-bottom-width:2px;border-radius:4px;padding:0 .35rem;font:600 .78rem/1.5 ui-monospace,monospace}aside{flex-direction:column;display:flex}.aside-foot{background:var(--surface);border-top:1px solid var(--line);align-items:center;gap:.2rem;margin-top:auto;margin-bottom:-.6rem;padding:.5rem .4rem .6rem;display:flex;position:sticky;bottom:-.6rem}.aside-foot .settings-button{flex:none;padding:.3rem .45rem;font-size:1.15rem;line-height:1}.aside-foot .sync-line{text-align:left;flex:1;min-width:0}.modal-backdrop{z-index:60;background:#00000073;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal{background:var(--surface);width:min(40rem,100%);max-height:100%;color:var(--text);border:1px solid var(--line);border-radius:var(--radius-card);padding:.8rem 1.1rem 1.1rem;overflow-y:auto;box-shadow:0 16px 40px #00000059}.modal header{justify-content:space-between;align-items:center;display:flex}.modal h2{margin:0;font-size:1.3rem}.modal h3{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:1rem 0 .5rem;font-size:.8rem}.themes{grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));gap:.7rem;display:grid}.theme-choice{text-align:left;background:var(--bg);flex-direction:column;align-items:stretch;gap:.3rem;padding:.5rem;display:flex}.theme-choice.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.theme-name{font-weight:700}.theme-about{color:var(--muted);font-size:.8rem}.theme-sample{font-family:var(--font);background:var(--bg);color:var(--text);border-radius:var(--radius);border:1px solid var(--line);flex-direction:column;gap:.3rem;padding:.5rem;font-size:14px;display:flex}.sample-title{font-size:1.4em;font-weight:700}.sample-section{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);border-left:4px solid var(--accent);flex-direction:column;gap:.25rem;padding:.35rem .45rem;display:flex}.sample-name{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-size:.75em;font-weight:700}.sample-chords{gap:.3rem;display:flex}.sample-chords .chord{border:1px solid var(--line);border-radius:var(--pill);color:var(--accent);padding:0 .45em}[data-theme=stage] section,[data-theme=stage] .sample-section{border-width:2px}[data-theme=stage] .reading b.chord,[data-theme=stage] .sample-chords .chord{font-weight:800}[data-theme=stage] .sample-chords .chord{border-width:2px}[data-theme=stage] .name,[data-theme=stage] .sample-name{color:var(--text)}[data-theme=stage] .sheet .lyric{font-size:1.05rem}[data-theme=paper] section,[data-theme=paper] .sample-section{border-width:0;border-top:1.5px solid var(--text)}[data-theme=paper] .reading section{border-top:none}[data-theme=paper] section>header .name{text-transform:none;font-variant:small-caps;letter-spacing:.06em;font-size:1.15rem;font-weight:700}[data-theme=paper] .reading b.chord,[data-theme=paper] .sample-chords .chord{border-color:#0000;font-style:italic}[data-theme=paper] .title,[data-theme=paper] .sample-title{font-style:italic;font-weight:600}[data-theme=paper] .name,[data-theme=paper] .sample-name{letter-spacing:.14em}[data-theme=paper] main>nav{border-bottom:3px double var(--line)}main:not(.reading) section>header{flex-wrap:nowrap}main:not(.reading) section>header .name{flex:0 10rem;min-width:2rem}.history{display:flex}section{container-type:inline-size}@container (width<30rem){.wide-only{display:none}}.select{display:inline-flex}.select>button{align-items:baseline;gap:.35rem;display:inline-flex}.select-arrow{color:var(--muted);font-size:.7em}.select-list{min-width:0;max-height:min(30rem,80vh);overflow-y:auto}.menu-list .select-list button,.select-list button{white-space:nowrap}.select-list button.active{background:var(--bg)}.select-list button[aria-selected=true]{color:var(--accent);font-weight:700}.segmented{display:inline-flex}.segmented button{color:var(--muted);border-radius:0}.segmented button+button{border-left:none}.segmented button:first-child{border-radius:var(--radius) 0 0 var(--radius)}.segmented button:last-child{border-radius:0 var(--radius) var(--radius) 0}.segmented button.on{background:var(--accent);border-color:var(--accent);color:var(--surface);font-weight:600}.spacing{color:var(--muted);align-items:center;gap:.6rem;font-size:.85rem;display:flex}.spacing input{max-width:20rem;accent-color:var(--accent);flex:1}aside{transition:margin-left .3s cubic-bezier(.3,.7,.4,1),transform .3s cubic-bezier(.3,.7,.4,1),visibility 0s .3s}aside.open{transition:margin-left .3s cubic-bezier(.3,.7,.4,1),transform .3s cubic-bezier(.3,.7,.4,1),visibility}aside:not(.open){visibility:hidden;margin-left:-16rem}.backdrop{opacity:0;pointer-events:none;transition:opacity .3s}.backdrop.open{opacity:1;pointer-events:auto}@media (width<48rem){aside:not(.open){margin-left:0;transform:translate(-100%)}}@keyframes pop-in{0%{opacity:0;translate:0 -4px;scale:.98}}.floating,.help-card{animation:.14s ease-out pop-in}.modal-backdrop{animation:.2s fade-in}.modal{animation:.2s ease-out pop-in}.morphing main>nav{view-transition-name:top-bar}.morphing .songhead .title{view-transition-name:song-title}.morphing .songhead .meta{view-transition-name:song-meta}.morphing section{view-transition-name:var(--morph-name)}::view-transition-old(top-bar){display:none}::view-transition-new(top-bar){animation:none}.morphing aside{view-transition-name:sidebar}::view-transition-old(sidebar){display:none}::view-transition-new(sidebar){animation:none}::view-transition-old(root){animation:.25s linear both morph-out}::view-transition-new(root){animation:.25s linear both morph-in}::view-transition-old(song-title){display:none}::view-transition-new(song-title){animation:none}::view-transition-group(*){animation-duration:.32s;animation-timing-function:cubic-bezier(.3,.7,.4,1)}::view-transition-old(*){object-fit:none;object-position:top left;height:100%}::view-transition-new(*){object-fit:none;object-position:top left;height:100%}::view-transition-old(*){animation:.12s ease-in both morph-out}::view-transition-new(*){animation:.2s ease-out .1s both morph-in}@keyframes morph-out{to{opacity:0}}@keyframes morph-in{0%{opacity:0}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}::view-transition-group(*){transition:none!important;animation:none!important}::view-transition-old(*){transition:none!important;animation:none!important}::view-transition-new(*){transition:none!important;animation:none!important}}::view-transition-group(*){overflow:clip}.title,.name,.autosize.chord,b.chord,.repeat,.modal h2,.help-card h3,.sample-title,.sample-name,.sample-chords .chord{font-family:var(--font-display)}.autosize.chord,b.chord,.sample-chords .chord{font-stretch:var(--chord-stretch)}.beats,.tempo,.count,.keypad-length,.meta{font-variant-numeric:tabular-nums}button:focus-visible,[role=slider]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.wordmark{padding:calc(2px * var(--zoom,1)) calc(10px * var(--zoom,1)) calc(10px * var(--zoom,1));font-family:Bricolage Grotesque Variable,Figtree Variable,system-ui,sans-serif;font-size:calc(18.4px * var(--zoom,1));letter-spacing:-.01em;color:#1f1d1a;font-style:normal;font-weight:800;font-stretch:100%;line-height:1.4}.wordmark .amp{color:#9a5b05;font-family:Georgia,Iowan Old Style,serif;font-style:italic;font-weight:400}[data-scheme=dark] .wordmark{color:#eeeae2}[data-scheme=dark] .wordmark .amp{color:#f0b541}[data-theme=brass] .title{letter-spacing:-.02em;font-variation-settings:"opsz" 96;font-size:clamp(1.5rem,1rem + 2.5vw,2rem);font-weight:800}[data-theme=brass] .name{letter-spacing:.06em;font-weight:800;font-stretch:100%}[data-theme=brass] .autosize.chord,[data-theme=brass] b.chord{font-weight:700}[data-theme=brass] button:not(.ghost,.modes,.colorbar,.swatch,.chip,.theme-choice,.help-button,[role=option],[role=menuitem]),[data-theme=brass] .chord input,.theme-sample[data-theme=brass] .sample-chords .chord{border-bottom-width:2px;border-bottom-color:color-mix(in srgb, var(--line), var(--text) 22%)}[data-theme=brass] button:not(.ghost,.modes,.colorbar,.swatch,.chip,.theme-choice,.help-button,[role=option],[role=menuitem]):active:not(:disabled){border-bottom-width:1px;margin-bottom:1px;translate:0 1px}[data-theme=brass] .chord input,.theme-sample[data-theme=brass] .sample-chords .chord{background:color-mix(in srgb, var(--accent) 7%, var(--surface))}[data-theme=brass] .chord input:focus{border-color:var(--accent)}[data-theme=brass] main>nav{border-bottom:none}[data-theme=brass] main>nav:after{content:"";background:repeating-linear-gradient(to bottom, var(--line) 0 1px, transparent 1px 3px) top / 100% 13px no-repeat, linear-gradient(var(--bg), color-mix(in srgb, var(--bg) 0%, transparent));pointer-events:none;height:13px;position:absolute;top:100%;left:0;right:0}[data-theme=brass] main:not(.reading) section>header{background:repeating-linear-gradient(-45deg, transparent 0 6px, color-mix(in srgb, var(--section,var(--muted)) 5%, transparent) 6px 7px), color-mix(in srgb, var(--section,var(--muted)) 13%, var(--surface));border-radius:4px}[data-theme=brass] .reading section>header .name{letter-spacing:.06em;font-weight:800;font-stretch:100%}[data-theme=brass] .reading section>header:after{content:"";background:color-mix(in srgb, var(--section,var(--text)) 30%, transparent);flex:1;height:1px;margin-left:.3rem}[data-theme=brass] .repeat,.theme-sample[data-theme=brass] .sample-title{font-weight:800}@container (width<38rem){.block{flex-wrap:wrap}.block>.chips{flex-flow:wrap;flex-basis:100%;order:1;justify-content:flex-end}.block>:not(.handle,.chips,.menu,.repeat){flex:1 1 0;min-width:0}}.scale-small{font-size:.75rem}.scale-large{font-size:1.25rem}.scale-value{font-variant-numeric:tabular-nums;min-width:3rem;color:var(--text)}main>nav{scrollbar-width:none;flex-wrap:nowrap;gap:.35rem;overflow-x:auto}main>nav>*{flex:none}.set-place{display:flex}.set-name{text-overflow:ellipsis;max-width:9rem;overflow:hidden}.nav-short,nav.fit-1 .save .unsaved,nav.fit-2 .nav-long{display:none}nav.fit-2 .nav-short{display:inline}nav.fit-2 .save .menu>button{padding-inline:.5rem}nav.fit-3 .set-name{display:none}nav.fit-3 .set-nav button{padding:0 .3rem}nav.fit-4 .save .arrangement{display:none}nav.fit-5 .modes{grid-template-columns:1fr}nav.fit-5 .modes>span:not(.thumb,.on){display:none}nav.fit-5 .modes .thumb{width:calc(100% - 4px);transform:none}nav.fit-6 .set-count,nav.fit-7 .help-button:not(.on){display:none}.setting-about{color:var(--muted);margin:.35rem 0 0;font-size:.8rem}.aside-foot .sync-line{font-size:.85rem}.sync-line{color:var(--muted);align-items:center;gap:.5rem;display:flex}.sync-line.warn{color:var(--accent);font-weight:600}.sync-mark{opacity:.7;background:currentColor;border-radius:50%;flex:none;width:.5rem;height:.5rem}.sync-line.busy .sync-mark{animation:1s ease-in-out infinite alternate sync-breathe}@keyframes sync-breathe{0%{opacity:.2}}.modal.cloud{width:min(34rem,100%)}.cloud-account{margin:.6rem 0 .2rem}.cloud-url{color:var(--muted);overflow-wrap:anywhere;font-size:.8rem;display:block}.cloud-error{color:var(--danger);margin:.5rem 0 0;font-size:.85rem}.cloud-actions{flex-wrap:wrap;gap:.5rem;margin-top:.9rem;display:flex}.cloud-connect .segmented{margin:.8rem 0 .4rem}.cloud-connect label{gap:.2rem;margin-top:.7rem;display:grid}.cloud-connect label>span{color:var(--muted);font-size:.8rem;font-weight:600}.cloud-connect input{border-color:var(--line);background:var(--bg);padding:.35rem .5rem}.cloud-connect small{color:var(--muted);font-size:.75rem}.clash-file h3{margin-top:1.2rem}.clash{border-top:1px solid var(--line);grid-template-columns:1fr 1fr;gap:.4rem;padding:.5rem 0;display:grid}.clash-where{color:var(--muted);grid-column:1/-1;font-size:.85rem}.clash-side{text-align:left;border:1px solid var(--line);border-radius:var(--radius);background:0 0;justify-items:start;gap:.1rem;padding:.4rem .6rem;display:grid}.clash-side small{text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-size:.7rem}.clash-side span{overflow-wrap:anywhere}.clash-side.on{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.repeat-times{color:var(--muted);align-items:center;gap:.5rem;margin:.4rem .4rem 0;font-size:.8rem;display:flex}.link-panel .repeat-times input{width:4.5rem;margin:0}:root{--inset-top:env(safe-area-inset-top,0px);--inset-right:env(safe-area-inset-right,0px);--inset-bottom:env(safe-area-inset-bottom,0px);--inset-left:env(safe-area-inset-left,0px)}body{padding:var(--inset-top) var(--inset-right) var(--inset-bottom) var(--inset-left)}.app{min-height:calc(100vh - var(--inset-top) - var(--inset-bottom));min-height:calc(100dvh - var(--inset-top) - var(--inset-bottom))}aside{top:var(--inset-top);height:calc(100vh - var(--inset-top) - var(--inset-bottom));height:calc(100dvh - var(--inset-top) - var(--inset-bottom))}main>nav{top:var(--inset-top)}@media (width<48rem){aside{left:var(--inset-left);bottom:var(--inset-bottom);height:auto}}body:before,body:after{content:"";z-index:50;background:var(--bg);pointer-events:none;position:fixed;left:0;right:0}body:before{height:var(--inset-top);top:0}body:after{height:var(--inset-bottom);bottom:0}.modal-backdrop{padding:calc(16px + var(--inset-top)) calc(16px + var(--inset-right)) calc(16px + var(--inset-bottom)) calc(16px + var(--inset-left))}.device-code{border:1px solid var(--line);border-radius:var(--radius-card);flex-wrap:wrap;align-items:center;gap:1rem;margin-top:1rem;padding:.8rem;display:flex}.device-code .qr{border-radius:var(--radius);background:#fff;width:11rem;padding:.4rem}.device-code .qr svg{width:100%;height:auto;display:block}.device-code>div:last-child{flex:12rem}.from-device .cloud-actions{align-items:center;margin-top:.4rem}.from-device input{border:1px solid var(--line);background:var(--bg);flex:10rem;padding:.35rem .5rem}.scanner{z-index:70;color:#fff;background:#000;place-items:center;display:grid;position:fixed;inset:0}.scanner video{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.scanner-frame{aspect-ratio:1;border:3px solid var(--accent);border-radius:var(--radius-card);width:min(70vw,70vh,22rem);position:relative;box-shadow:0 0 0 100vmax #00000073}.scanner p,.scanner button{position:absolute;left:50%;transform:translate(-50%)}.scanner p{top:calc(var(--inset-top) + 1.5rem);text-align:center;text-shadow:0 1px 3px #000c;width:min(90vw,26rem);margin:0;font-weight:600}.scanner button{bottom:calc(var(--inset-bottom) + 1.5rem);min-width:8rem;color:var(--text);background:var(--surface)}.slot.selected .slot-head .chord input{background:color-mix(in srgb, var(--accent) 24%, var(--surface));box-shadow:0 0 0 2px var(--accent)}.slots.selecting{outline:none}.selection-bar{background:var(--surface);border:1px solid var(--line);border-radius:8px;flex-wrap:wrap;align-items:center;gap:.3rem;padding:.35rem;display:flex;box-shadow:0 6px 20px #0000002e}.selection-bar>span{white-space:nowrap;color:var(--muted);padding:0 .4rem;font-size:.85rem}.beats.slashes{letter-spacing:.05em;color:var(--muted)}.beats.flags{align-self:flex-start;place-items:center;height:1.4rem;margin-left:.55rem;padding:0 .15rem;display:grid}.rhythm{stroke:currentColor;stroke-width:1.3px;fill:none;color:var(--muted);overflow:visible}.rhythm .filled{fill:currentColor;stroke:none}.rhythm-beats{color:var(--muted);font-size:.75rem}.sheet-rhythm{height:1.7rem;margin-top:-.3rem;padding-left:.75rem}.sheet-rhythm .rhythm{width:calc(1.1rem * var(--marks,1));height:1.6rem;color:var(--text);stroke-width:1.5px}.settings-pages{border-bottom:1px solid var(--line);gap:.2rem;margin:.6rem 0 .2rem;display:flex}.settings-pages button{color:var(--muted);background:0 0;border:none;border-bottom:2px solid #0000;border-radius:0;padding:.35rem .6rem}.settings-pages button.on{color:var(--text);border-bottom-color:var(--accent);font-weight:600}.settings-page{min-height:18rem}.modal-backdrop.top{align-items:flex-start}.modal-backdrop.top .modal{max-height:calc(100% - min(8vh,4rem));margin-top:min(8vh,4rem)}.sweeping,.sweeping *{-webkit-user-select:none;user-select:none}.loupe{z-index:70;pointer-events:none;background:var(--bg);border:2px solid var(--accent);border-radius:50%;width:12.75rem;height:12.75rem;animation:.12s ease-out loupe-in;position:fixed;overflow:hidden;box-shadow:0 10px 30px #00000059}.loupe-view{transform-origin:0 0;position:absolute;top:0;left:0}.loupe:after{content:"";background:var(--accent);opacity:.7;border-radius:50%;width:6px;height:6px;margin:-3px 0 0 -3px;position:absolute;top:50%;left:50%}@keyframes loupe-in{0%{opacity:0;scale:.6}}.slots{touch-action:manipulation}@media (pointer:coarse){.slot-head .chord input{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}}.key-circle{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);padding:.6rem;box-shadow:0 10px 30px #0000004d}.circle-face{aspect-ratio:1;background:radial-gradient(circle, var(--surface) 0 34%, transparent 34.5%), radial-gradient(circle, color-mix(in srgb, var(--muted) 10%, var(--surface)) 0 60%, transparent 60.5%), color-mix(in srgb, var(--muted) 5%, var(--surface));border-radius:50%;width:min(19rem,100vw - 2.5rem);position:relative;container-type:inline-size}.circle-key{white-space:nowrap;border-radius:999px;min-width:13cqi;height:13cqi;padding:0 .2em;font-size:5.3cqi;font-weight:700;position:absolute;transform:translate(-50%,-50%)}.circle-signature{color:var(--muted);white-space:nowrap;pointer-events:none;font-size:3.6cqi;position:absolute;transform:translate(-50%,-50%)}.circle-key.on{background:var(--accent);border-color:var(--accent);color:var(--surface)}.circle-key.own:not(.on){box-shadow:0 0 0 2px var(--accent)}.circle-key:disabled{opacity:.35}.circle-centre{text-align:center;justify-items:center;display:grid;position:absolute;inset:50% auto auto 50%;translate:-50% -50%}.circle-swap{color:var(--accent);margin-top:.15rem;padding:.05rem .5rem;font-size:.8rem}.circle-centre b{white-space:nowrap;font-size:1.05rem}.circle-centre small{color:var(--muted)}.circle-hint{max-width:min(18rem,100vw - 2.5rem);color:var(--muted);margin:.5rem 0 0;font-size:.75rem}.tap-test{-webkit-user-select:none;user-select:none;width:100%;margin-top:.6rem;padding:1rem}.tap-test.on{border-color:var(--accent);color:var(--accent)}.drop-caret{z-index:65;background:var(--accent);width:3px;box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 30%, transparent);pointer-events:none;border-radius:1.5px;position:fixed}.carrying,.carrying *{cursor:grabbing!important}@media (hover:hover){.slots.selecting .slot.selected .chord input,.melody.active .staff .current,.melody.active .note.on{cursor:grab}}.select-list button.apart{border-top:1px solid var(--line);margin-top:.2rem;padding-top:.35rem}.beats-room{height:1.4rem}.text,.text-editor textarea{font-size:1.25rem;line-height:1.35}.text-small,.text-editor textarea.text-small{font-size:1rem;line-height:1.4}.text-large,.text-editor textarea.text-large{font-size:1.6rem;line-height:1.25}.text-huge,.text-editor textarea.text-huge{font-size:2.1rem;line-height:1.15;font-family:var(--font-display)}.text-bold{font-weight:700}.text-italic{font-style:italic}.text-center{text-align:center}.text-right{text-align:right}.text-editor{flex-direction:column;flex:1;min-width:0;display:flex;position:relative}.text-editor textarea{resize:none;field-sizing:content;margin:0}.text-tools{z-index:6;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);flex-wrap:wrap;align-items:center;gap:.25rem;max-width:100%;padding:.25rem;display:none;position:absolute;bottom:calc(100% + .35rem);right:0;box-shadow:0 4px 14px #00000029}.text-editor:focus-within .text-tools{display:flex}.text-tools button{min-width:2rem;height:2rem;color:var(--muted);place-items:center;padding:0 .4rem;display:inline-grid}.text-tools button.on{border-color:var(--accent);color:var(--accent)}.text-sizes,.text-aligns{gap:.15rem;display:inline-flex}.text-size-small{font-size:.7rem}.text-size-normal{font-size:.9rem}.text-size-large{font-size:1.1rem}.text-size-huge{font-size:1.35rem}.text-b{font-weight:800}.text-i{font-family:Georgia,serif;font-style:italic}.align-icon line{stroke:currentColor;stroke-width:1.6px;stroke-linecap:round}.scribble{width:100%;height:auto;display:block}.scribble path{fill:none;stroke-linecap:round;stroke-linejoin:round}.ink-ink{stroke:var(--text);background:var(--text)}.ink-accent{stroke:var(--accent);background:var(--accent)}.ink-red{stroke:#d23b2c;background:#d23b2c}.ink-blue{stroke:#2f6fd1;background:#2f6fd1}.ink-green{stroke:#2f9a4a;background:#2f9a4a}[data-scheme=dark] .ink-red{stroke:#ff7a6b;background:#ff7a6b}[data-scheme=dark] .ink-blue{stroke:#7fb0ff;background:#7fb0ff}[data-scheme=dark] .ink-green{stroke:#6fd08a;background:#6fd08a}.scribble-editor{flex-direction:column;flex:1;min-width:0;display:flex;position:relative}.scribble-editor .scribble{border:1px dashed var(--line);border-radius:var(--radius);background:repeating-linear-gradient(to bottom, transparent 0 1.6rem, color-mix(in srgb, var(--line) 55%, transparent) 1.6rem calc(1.6rem + 1px));cursor:pointer}.scribble-editor.active .scribble{border-style:solid;border-color:var(--accent);touch-action:none;cursor:crosshair}.scribble-editor.active .scribble.sheet-eraser{cursor:cell}.scribble-hint{fill:var(--muted);font:28px var(--font);text-anchor:middle;dominant-baseline:middle;-webkit-user-select:none;user-select:none;pointer-events:none}.scribble-tools{z-index:6;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);flex-wrap:wrap;align-items:center;gap:.25rem;max-width:100%;padding:.25rem;display:flex;position:absolute;bottom:calc(100% + .35rem);right:0;box-shadow:0 4px 14px #00000029}.scribble-tools button{place-items:center;min-width:2rem;height:2rem;padding:0 .4rem;display:inline-grid}.scribble-tools button.on{border-color:var(--accent);color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.scribble-sep{background:var(--line);width:1px;height:1.4rem;margin:0 .15rem}.ink-dot{border-radius:50%;width:.95rem;height:.95rem}.pen-size{background:currentColor;border-radius:99px;width:1rem}.scribble-clear{margin-left:.3rem}.scribble-stretch{cursor:ns-resize;touch-action:none;background:linear-gradient(var(--line), var(--line)) center / 2.5rem 3px no-repeat;border-radius:99px;height:.7rem;margin-top:-.5rem}.scribble-stretch:hover{background-image:linear-gradient(var(--accent), var(--accent))}.section-note{color:var(--muted);font-style:italic}input.section-note{background:0 0;border-color:#0000;flex:6rem;min-width:3rem;font-size:.95rem}input.section-note:hover,input.section-note:focus{border-color:var(--line);background:var(--surface)}.reading section>header .section-note{margin-left:.5rem;font-size:1rem}.reading section{display:flow-root}@container (width>=34rem){.reading section>header{float:left;width:var(--margin-name,6.5rem);flex-direction:column;align-items:flex-start;gap:0;margin:0;padding-top:.3rem}.reading section>header:after{display:none}.reading section>header .name{white-space:normal}.reading section>header .section-note{margin:0;font-size:.9rem;line-height:1.25}.reading section>:not(header){margin-left:calc(var(--margin-name,6.5rem) + .6rem)}}.reading section.folded{flex-wrap:wrap;align-items:baseline;gap:0 .6rem;display:flex}.reading section.folded>header:after{display:none}.fold{padding:.1rem .3rem;font-size:1rem;font-style:italic}.reading.slim .songhead{flex-flow:wrap;align-items:baseline;gap:.2rem 1rem;margin:.2rem 0 .7rem}.reading.slim .songhead .title{font-size:1.35rem}.reading.slim .meta{font-size:1.05rem}.reader-content{transform-origin:0 0}.reader.paged{touch-action:pan-y pinch-zoom;position:relative;overflow:hidden}.reader.paged .reader-content{column-fill:auto;transition:transform .18s ease-out}@media (prefers-reduced-motion:reduce){.reader.paged .reader-content{transition:none}}.reader-content .songhead,.reader-content section [data-reorder-list]>*,.reader-content .keychange,.reader-content section.folded{break-inside:avoid}.reader-content section>header{break-after:avoid;break-inside:avoid;pointer-events:none;margin-bottom:-4rem;padding-bottom:4rem}main.paged{padding-bottom:0}.page-count{background:color-mix(in srgb, var(--bg) 85%, transparent);color:var(--muted);font-variant-numeric:tabular-nums;pointer-events:none;border-radius:99px;padding:.1rem .5rem;font-size:.85rem;position:absolute;bottom:0;right:.2rem}.play-button{width:3rem;height:2.3rem;color:var(--accent);border-color:var(--accent);border-radius:99px;margin:0 auto;padding:0;font-size:1.15rem}.play-button.on{background:var(--accent);color:var(--bg)}.song-menu-mark{font-size:1.2rem;line-height:1}.scan-head{flex-direction:column;gap:.5rem;margin-bottom:.8rem;display:flex}.scan-head label{align-items:center;gap:.5rem;display:flex}.scan-head label input:not(.tempo){min-width:0;font:inherit;flex:1;font-weight:700}.scan-meta{flex-wrap:wrap;align-items:center;gap:.4rem 1rem;display:flex}.scan-meta input.tempo{width:4rem}.scan-entries{flex-direction:column;gap:.5rem;margin:0 0 .8rem;padding:0;list-style:none;display:flex}.scan-entry{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);padding:.4rem .5rem}.scan-entry.off{opacity:.5}.scan-entry-head{align-items:center;gap:.4rem;display:flex}.scan-name{min-width:0;font:inherit;flex:1;font-weight:700}.scan-chords{white-space:pre-wrap;font-family:var(--font-display);color:var(--accent);margin:.35rem 0 0;font-weight:700}.scan-borrow,.scan-again{color:var(--muted);align-items:center;gap:.4rem;margin-top:.3rem;font-style:italic;display:flex}.scan-problem{color:var(--danger)}.segmented.small{margin-top:.35rem;font-size:.85rem}