:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f4f1ea;--surface:#fffdf8;--paper:#fffefb;--ink:#1d1b16;--muted:#6d675c;--line:#e3ddd0;--line-strong:#cfc7b6;--accent:#2f6fde;--accent-ink:#fff;--accent-soft:#2f6fde1a;--play:#e8590c;--danger:#c92a2a;--shadow:0 1px 2px #281e0a0f, 0 8px 28px #281e0a12;--font-ui:Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-serif:"Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;--header-height:57px}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#121316;--surface:#1b1d22;--paper:#202329;--ink:#e9e6df;--muted:#9a968c;--line:#2e3138;--line-strong:#3d414a;--accent:#7aa2ff;--accent-ink:#10131a;--accent-soft:#7aa2ff21;--play:#ff9f43;--danger:#ff6b6b;--shadow:0 1px 2px #0000004d, 0 8px 28px #00000040}:root[data-theme=solar]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f5eedb;--surface:#eee8d5;--paper:#fdf6e3;--ink:#073642;--muted:#657b83;--line:#ddd6c1;--line-strong:#c9c1a9;--accent:#268bd2;--accent-ink:#fdf6e3;--accent-soft:#268bd21f;--play:#cb4b16;--danger:#dc322f}@media (prefers-color-scheme:dark){:root:not([data-theme]){--bg:#121316}}*,:before,:after{box-sizing:border-box}body{background:var(--bg);min-width:320px;color:var(--ink);font-family:var(--font-ui);-webkit-font-smoothing:antialiased;margin:0;font-size:15px;line-height:1.5}h1,h2{font-family:var(--font-serif);margin:0;font-weight:600;line-height:1.2}a{color:var(--accent)}button,input,select{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}kbd{border:1px solid var(--line-strong);background:var(--bg);min-width:1.7em;color:var(--ink);font-family:var(--font-ui);text-align:center;border-bottom-width:2px;border-radius:6px;padding:1px 6px;font-size:.78em;font-weight:600;line-height:1.5;display:inline-block}.glyph{font-family:Bravura;font-style:normal;font-weight:400;line-height:1}.button{border:1px solid var(--line-strong);background:var(--surface);height:36px;color:var(--ink);white-space:nowrap;border-radius:9px;align-items:center;gap:7px;padding:0 14px;font-weight:500;transition:border-color .15s,color .15s;display:inline-flex}.button:hover{border-color:var(--accent);color:var(--accent)}.button-primary{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}.button-primary:hover{color:var(--accent-ink);filter:brightness(1.08)}.icon-button{width:36px;height:36px;color:var(--muted);background:0 0;border:0;border-radius:9px;place-items:center;padding:0;transition:background-color .15s,color .15s;display:inline-grid}.icon-button:hover{background:var(--accent-soft);color:var(--ink)}.icon-button.is-danger:hover{background:color-mix(in srgb, var(--danger) 12%, transparent);color:var(--danger)}select{border:1px solid var(--line-strong);background-color:var(--surface);background-image:linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);appearance:none;background-position:calc(100% - 16px) 52%,calc(100% - 11px) 52%;background-repeat:no-repeat;background-size:5px 5px;border-radius:9px;height:36px;padding:0 30px 0 11px}select:hover{border-color:var(--accent)}@media (hover:hover){[data-tip]{position:relative}[data-tip]:hover:after{content:attr(data-tip);z-index:40;background:var(--ink);color:var(--bg);font-family:var(--font-ui);white-space:nowrap;pointer-events:none;border-radius:7px;padding:4px 9px;font-size:12px;font-weight:500;line-height:1.4;animation:.12s .4s both tip-in;position:absolute;top:calc(100% + 7px);left:50%;transform:translate(-50%)}}@keyframes tip-in{0%{opacity:0;translate:0 -3px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-delay:0s!important}}.app{flex-direction:column;min-height:100dvh;display:flex}.app-header{z-index:30;height:var(--header-height);border-bottom:1px solid var(--line);background:color-mix(in srgb, var(--bg) 88%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);align-items:center;gap:20px;padding:0 24px;display:flex;position:sticky;top:0}.brand{color:var(--ink);font-family:var(--font-serif);align-items:center;gap:10px;font-size:1.2rem;font-weight:700;text-decoration:none;display:flex}.brand .logo-mark{color:var(--accent)}.brand .logo-mark g{fill:var(--surface)}.app-nav{gap:2px;display:flex}.app-nav a{color:var(--muted);border-radius:8px;padding:6px 12px;font-weight:500;text-decoration:none;transition:background-color .15s,color .15s}.app-nav a:hover{color:var(--ink)}.app-nav a[aria-current=page]{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink)}.app-header-end{gap:2px;margin-left:auto;display:flex}.editor{flex-direction:column;gap:14px;width:min(1240px,100%);margin:0 auto;padding:24px 24px 72px;display:flex}.score-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 28px;display:flex}.score-titles{flex:300px;min-width:0}.title-input,.composer-input{width:100%;color:var(--ink);font-family:var(--font-serif);text-overflow:ellipsis;background:0 0;border:0;border-radius:7px;margin-left:-7px;padding:1px 7px;transition:box-shadow .15s}.title-input:hover,.composer-input:hover{box-shadow:inset 0 0 0 1px var(--line-strong)}.title-input{font-size:clamp(1.6rem,3.2vw,2.25rem);font-weight:600;line-height:1.25}.subtitle-row{flex-wrap:wrap;align-items:center;gap:4px 14px;display:flex}.composer-input{width:min(280px,100%);color:var(--muted);font-size:1.05rem;font-style:italic}.save-status{color:var(--muted);align-items:center;gap:7px;font-size:.8rem;display:inline-flex}.save-status:before{content:"";opacity:.7;background:currentColor;border-radius:50%;width:6px;height:6px}.score-settings{flex-wrap:wrap;align-items:flex-end;gap:12px;display:flex}.field{flex-direction:column;gap:4px;display:flex}.field-label{color:var(--muted);letter-spacing:.07em;text-transform:uppercase;font-size:.7rem;font-weight:600}.tempo-input{border:1px solid var(--line-strong);background:var(--surface);border-radius:9px;align-items:center;gap:3px;height:36px;padding:0 4px 0 10px;display:inline-flex}.tempo-input:focus-within{border-color:var(--accent)}.tempo-input .glyph{font-size:24px;translate:0 5px}.tempo-input input{appearance:textfield;background:0 0;border:0;outline:none;width:46px;padding:0 2px}.tempo-input input::-webkit-inner-spin-button{appearance:none;margin:0}.tempo-input input::-webkit-outer-spin-button{appearance:none;margin:0}.score-actions{gap:8px;display:flex}.toolbar{top:calc(var(--header-height) + 8px);z-index:20;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow);border-radius:14px;flex-wrap:wrap;align-items:center;gap:8px;padding:7px;display:flex;position:sticky}.play-button{background:var(--accent);height:40px;color:var(--accent-ink);border:0;border-radius:10px;align-items:center;gap:8px;padding:0 18px 0 15px;font-weight:600;transition:background-color .15s,filter .15s;display:inline-flex}.play-button:hover{filter:brightness(1.08)}.play-button.is-playing{background:var(--play)}.tool-group{background:var(--bg);border-radius:11px;gap:2px;padding:2px;display:flex}.tool{width:38px;height:36px;color:var(--ink);background:0 0;border:0;border-radius:9px;place-items:center;padding:0;transition:background-color .12s,color .12s;display:grid}.tool:hover:not(:disabled){background:var(--surface)}.tool[aria-pressed=true]{background:var(--surface);box-shadow:0 0 0 1px var(--line-strong), 0 1px 2px #00000014;color:var(--accent)}.tool:disabled{cursor:default;opacity:.32}.glyph-tool .glyph{font-size:24px;line-height:0;translate:0 .32em}.glyph-tool .glyph-dot{font-size:34px;translate:0 .1em}.tool.is-secondary{width:30px}.tool.is-secondary .glyph{font-size:20px}.toolbar-end{margin-left:auto}.hint{background:var(--accent-soft);border-radius:12px;align-items:center;gap:12px;padding:6px 6px 6px 16px;font-size:.9rem;display:flex}.hint p{flex:1;margin:0}.toast{z-index:50;pointer-events:none;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}.toast span{background:var(--ink);box-shadow:var(--shadow);color:var(--bg);border-radius:10px;padding:10px 18px;font-weight:500;animation:.2s toast-in;display:block}@keyframes toast-in{0%{opacity:0;translate:0 8px}}.paper{border:1px solid var(--line);background:var(--paper);box-shadow:var(--shadow);border-radius:6px;padding:28px clamp(6px,3vw,40px) 36px}.score-canvas{min-height:140px;position:relative}.score-canvas.is-over-note{cursor:pointer}.score-svg{color:var(--ink)}.score-svg svg{display:block}.score-svg .vf-stave,.thumb .vf-stave{opacity:.55}.score-svg .vf-ghost{opacity:.28}.score-svg .is-hover{color:var(--accent);opacity:.75}.score-svg .is-selected{color:var(--accent);opacity:1}.score-svg .is-playing{color:var(--play);opacity:1}.score-loading{color:var(--muted);place-items:center;display:grid;position:absolute;inset:0}.ghost{color:var(--accent);pointer-events:none;position:absolute;top:0;left:0;overflow:visible}.ghost text{fill:currentColor;opacity:.5;font-family:Bravura}.ghost line{stroke:currentColor;stroke-width:1.3px;opacity:.5}.ghost-label{background:var(--surface);box-shadow:0 0 0 1px var(--line);color:var(--accent);white-space:nowrap;pointer-events:none;border-radius:999px;padding:0 7px;font-size:.72rem;font-weight:600;position:absolute}.dialog{background:var(--surface);width:min(560px,100vw - 32px);max-height:min(84dvh,760px);color:var(--ink);border:0;border-radius:16px;padding:0;box-shadow:0 24px 64px #00000047}.dialog::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0a0a0c73}.dialog-body{padding:18px 24px 22px}.dialog-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.dialog-header h2{font-size:1.3rem}.shortcut-list{margin:0}.shortcut{border-bottom:1px solid var(--line);grid-template-columns:130px 1fr;align-items:center;gap:12px;padding:7px 0;display:grid}.shortcut:last-child{border-bottom:0}.shortcut dt{color:var(--muted);align-items:center;gap:4px;display:flex}.shortcut dd{margin:0}.library{flex-direction:column;gap:44px;width:min(1240px,100%);margin:0 auto;padding:32px 24px 72px;display:flex}.library-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:18px;display:flex}.library h1{font-size:2rem}.library h2{font-size:1.5rem}.muted{color:var(--muted);margin:4px 0 0}.empty-state{border:1.5px dashed var(--line-strong);color:var(--muted);text-align:center;border-radius:14px;margin:0;padding:36px 24px}.card-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin:0;padding:0;list-style:none;display:grid}.score-card{border:1px solid var(--line);background:var(--surface);border-radius:14px;transition:border-color .15s,box-shadow .15s,translate .15s;position:relative;overflow:hidden}.score-card:hover{border-color:var(--line-strong);box-shadow:var(--shadow);translate:0 -2px}.score-card.is-current{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.card-open{width:100%;color:inherit;text-align:left;background:0 0;border:0;flex-direction:column;gap:1px;padding:0 0 14px;text-decoration:none;display:flex}.thumb{border-bottom:1px solid var(--line);background:var(--paper);height:150px;color:var(--ink);pointer-events:none;margin-bottom:10px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 70%,#0000);mask-image:linear-gradient(#000 70%,#0000)}.thumb svg{display:block}.card-title,.card-meta{padding:0 16px}.card-title{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.card-meta{color:var(--muted);font-size:.82rem}.card-actions{background:var(--surface);box-shadow:0 0 0 1px var(--line);opacity:0;border-radius:11px;gap:2px;transition:opacity .15s;display:flex;position:absolute;top:8px;right:8px}.score-card:hover .card-actions,.card-actions:focus-within{opacity:1}@media (hover:none){.card-actions{opacity:1}}@media (width<=640px){.app-header{gap:8px;padding:0 12px}.brand span{display:none}.editor,.library{padding-left:12px;padding-right:12px}.toolbar{scrollbar-width:none;flex-wrap:nowrap;overflow-x:auto}.toolbar>*{flex-shrink:0}.score-actions{width:100%}.shortcut{grid-template-columns:100px 1fr}}@font-face{font-family:Academico;font-style:normal;font-display:swap;src:local(Academico),url(/assets/academico-CBNs-hlO.woff2)format("woff2")}@font-face{font-family:Academico;font-style:normal;font-display:swap;font-weight:700;src:local(Academico),url(/assets/academico-bold-CYSRVAc6.woff2)format("woff2")}@font-face{font-family:Bravura;font-style:normal;font-display:block;font-weight:400;src:local(Bravura),url(/assets/bravura-CBWYXOFh.woff2)format("woff2")}
