:root{--ink:#0b0d14;--ink-2:#10131d;--ink-3:#171b28;--line:#ffffff17;--text:#e8e9f0;--text-dim:#949aad;--text-faint:#626981;--gold:#ffcf7a;--gold-soft:#f6d9a4;--rec:#ff5f6d;--bar-h:5.6rem;--piano-h:clamp(9rem, 20vh, 13.5rem);--radius:.5rem;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%}body{background:var(--ink);color:var(--text);-webkit-text-size-adjust:100%;overscroll-behavior:none;margin:0;font-family:ui-sans-serif,system-ui,Segoe UI,Inter,Helvetica,Arial,sans-serif;font-size:15px;line-height:1.45;overflow:hidden}button,input,label{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:4px}.app{grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);height:100dvh;display:grid;position:relative}.bar{border-bottom:1px solid var(--line);z-index:5;background:linear-gradient(#12141e,#0d1018)}.bar__row{align-items:center;gap:.75rem;min-width:0;min-height:2.75rem;padding:.5rem .9rem;display:flex}.bar__row--transport{border-top:1px solid #ffffff0d;gap:.6rem}.wordmark{letter-spacing:.14em;text-transform:uppercase;color:var(--gold-soft);white-space:nowrap;margin:0;font-size:1.05rem;font-weight:600}.repertoire{scrollbar-width:none;flex:1;align-items:center;gap:.4rem;min-width:0;padding-bottom:2px;display:flex;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 2.5rem),#0000);mask-image:linear-gradient(90deg,#000 calc(100% - 2.5rem),#0000)}.repertoire::-webkit-scrollbar{display:none}.repertoire__list{gap:.4rem;margin:0;padding:0;list-style:none;display:flex}.bar__tools{flex:none;align-items:center;gap:.5rem;margin-left:auto;display:flex}.chip{border:1px solid var(--line);color:var(--text-dim);white-space:nowrap;cursor:pointer;background:#ffffff09;border-radius:999px;align-items:center;gap:.4rem;padding:.34rem .7rem;font-size:.8rem;transition:color .15s,border-color .15s,background .15s;display:inline-flex}.chip:hover:not(:disabled),.chip:focus-visible{color:var(--text);background:#ffcf7a17;border-color:#ffcf7a73}.chip:disabled{opacity:.4;cursor:default}.chip.is-on{color:var(--ink);background:var(--gold-soft);border-color:var(--gold-soft);font-weight:600}.chip--file{border-style:dashed}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.chip--file:focus-within{outline:2px solid var(--gold);outline-offset:2px;color:var(--text)}.chip strong{color:inherit;font-weight:600}.chip--rec .dot{background:var(--rec);border-radius:50%;width:.55rem;height:.55rem;box-shadow:0 0 #ff5f6d99}.chip--rec.is-recording{color:#fff;border-color:var(--rec);background:#ff5f6d2e}.chip--rec.is-recording .dot{animation:1.1s ease-out infinite pulse}@keyframes pulse{to{box-shadow:0 0 0 .5rem #ff5f6d00}}.segmented{background:#ffffff0a;border:1px solid #ffcf7a47;border-radius:999px;gap:2px;padding:2px;display:inline-flex}.segmented__button{color:var(--text-dim);letter-spacing:.01em;white-space:nowrap;cursor:pointer;background:0 0;border:0;border-radius:999px;align-items:center;gap:.42rem;padding:.4rem .95rem;font-size:.86rem;font-weight:500;transition:background .18s,color .18s;display:inline-flex}.segmented__button:hover:not(:disabled):not(.is-on){color:var(--text);background:#ffcf7a1a}.segmented__button:disabled{opacity:.4;cursor:default}.segmented__dot{opacity:.3;background:currentColor;border-radius:50%;width:.46rem;height:.46rem;transition:opacity .18s,box-shadow .18s}.segmented__button.is-on{background:var(--gold-soft);color:var(--ink);font-weight:700}.segmented__button.is-on .segmented__dot{opacity:1;box-shadow:0 0 0 3px #0b0d1429}.round{width:2.1rem;height:2.1rem;color:var(--gold-soft);cursor:pointer;background:#ffcf7a1f;border:1px solid #ffcf7a66;border-radius:50%;flex:none;place-items:center;transition:background .15s;display:grid}.round:hover:not(:disabled){background:#ffcf7a3d}.round:disabled{opacity:.35;cursor:default}.round__glyph{font-size:.8rem;line-height:1;transform:translate(1px)}.round.is-playing .round__glyph{transform:none}.transport__title{color:var(--text-dim);white-space:nowrap;text-overflow:ellipsis;flex:none;max-width:22ch;font-size:.82rem;overflow:hidden}.transport__time,.transport__tempo{font-variant-numeric:tabular-nums;color:var(--text-faint);white-space:nowrap;flex:none;font-size:.76rem}.transport__tempo{min-width:12ch}.transport__tempo.is-conducted{color:var(--gold)}.transport__rec{flex:none;gap:.4rem;margin-left:auto;display:flex}.scrub{appearance:none;cursor:pointer;background:#ffffff24;border-radius:3px;flex:auto;min-width:4rem;height:3px}.scrub::-webkit-slider-thumb{appearance:none;background:var(--gold-soft);border:0;border-radius:50%;width:.85rem;height:.85rem}.scrub::-moz-range-thumb{background:var(--gold-soft);border:0;border-radius:50%;width:.85rem;height:.85rem}.scrub:disabled{opacity:.35;cursor:default}.stage{background:var(--ink);touch-action:none;min-height:0;position:relative}.stage__canvas{width:100%;height:100%;display:block}.stage__overlay{pointer-events:none;flex-direction:column;justify-content:flex-end;align-items:center;padding:1rem;display:flex;position:absolute;inset:0}.stage__hud{flex-direction:column;align-items:flex-start;gap:.55rem;max-width:60%;display:flex;position:absolute;top:.7rem;left:1rem}.legend{letter-spacing:.03em;color:var(--text-dim);text-shadow:0 1px 8px #0b0d14f2;flex-wrap:wrap;gap:.35rem .9rem;margin:0;padding:0;font-size:.72rem;list-style:none;display:flex}.legend li{align-items:center;gap:.35rem;display:flex}.legend .swatch{border-radius:3px;width:.68rem;height:.68rem}.invite{text-align:center;margin:0 0 clamp(1rem,8vh,5rem);transition:opacity .7s,transform .7s}.app[data-played=true] .invite{opacity:0;transform:translateY(.75rem)}.invite__lead{letter-spacing:.02em;color:var(--gold-soft);text-shadow:0 0 40px #ffcf7a59;margin:0 0 .4rem;font-size:clamp(1.6rem,4.5vw,2.6rem);font-weight:300;animation:4.5s ease-in-out infinite breathe}@keyframes breathe{0%,to{opacity:.82}50%{opacity:1}}.invite__hint{color:var(--text-dim);margin:0;font-size:.85rem}kbd{min-width:1.4em;font:inherit;text-align:center;color:var(--text-dim);background:#ffffff0d;border:1px solid #ffffff29;border-bottom-width:2px;border-radius:3px;margin:0 .08em;padding:.05em .3em;font-size:.9em;display:inline-block}.conduct-hud{margin:0}.conduct-hud__mode{letter-spacing:.22em;text-transform:uppercase;color:var(--gold);text-shadow:0 1px 10px #0b0d14f2;margin:0 0 .15rem;font-size:.66rem;font-weight:600}.conduct-hud__readout{font-variant-numeric:tabular-nums;color:var(--gold-soft);letter-spacing:.01em;text-shadow:0 2px 18px #0b0d14e6;margin:0;font-size:clamp(1.9rem,4.4vw,2.9rem);font-weight:200;line-height:1}.conduct-hud__tempo{letter-spacing:.06em;color:var(--text-dim);text-shadow:0 1px 10px #0b0d14f2;margin:.3rem 0 0;font-size:.74rem}.conduct-prompt{letter-spacing:.03em;color:var(--gold-soft);white-space:nowrap;text-overflow:ellipsis;background:#0b0d14b3;border-radius:999px;max-width:calc(100% - 2rem);margin:0;padding:.35rem .9rem;font-size:.85rem;transition:opacity .5s;position:absolute;top:calc(70% - 2.9rem);left:50%;overflow:hidden;transform:translate(-50%)}.app[data-conducting=true] .conduct-prompt{opacity:0}.status{max-width:min(28rem,55%);color:var(--text-faint);text-align:right;text-shadow:0 1px 10px #0b0d14f2;margin:0;font-size:.76rem;transition:opacity .8s;position:absolute;top:.75rem;right:1rem}.status.is-stale{opacity:0}.status.is-warning{color:#ffb4a2;opacity:1}.drop-hint{color:var(--gold-soft);pointer-events:none;background:#0b0d14d1;border:2px dashed #ffcf7a80;border-radius:.9rem;place-items:center;font-size:1.05rem;display:grid;position:absolute;inset:.6rem}.piano-wrap{padding:0 0 max(0px, env(safe-area-inset-bottom));background:linear-gradient(#05060a,#0b0d14);border-top:1px solid #ffcf7a2e}.piano{height:var(--piano-h);touch-action:none;-webkit-user-select:none;user-select:none;outline-offset:-2px;transition:filter .6s;position:relative}.app[data-state=loading] .piano{filter:brightness(.45)saturate(.4)}.app[data-state=loading-score]{cursor:progress}.app[data-state=loading-score] .repertoire{opacity:.55}.piano-row{pointer-events:none;position:absolute;inset:0}.piano-row--black{height:62%}.piano-key{pointer-events:auto;cursor:pointer;position:absolute;top:0}.piano-key.is-white{background:linear-gradient(#f4f1ea 0%,#fbf9f4 55%,#ded8cb 100%);border-radius:0 0 4px 4px;height:100%;box-shadow:inset -1px 0 #00000038,inset 0 -3px 6px #00000024}.piano-key.is-white.is-c{background:linear-gradient(#f4f1ea 0%,#fbf9f4 55%,#d8d1c1 100%)}.piano-key.is-black{z-index:2;background:linear-gradient(#2b2f3c 0%,#14171f 62%,#0a0c12 100%);border-radius:0 0 3px 3px;height:100%;box-shadow:inset 0 -3px 4px #ffffff14,0 3px 5px #0009}.piano-key.is-lit.is-white{background:linear-gradient(#ffeecd 0%,#ffe2ad 60%,#f0c987 100%)}.piano-key.is-lit.is-black{background:linear-gradient(#8a6a35 0%,#6a4f22 60%,#3d2d13 100%)}.piano-key.is-held.is-white{background:linear-gradient(#ffdc9e 0%,#ffce7a 60%,#e0ab55 100%);transform:translateY(1.5px);box-shadow:inset -1px 0 #00000040,inset 0 -2px 4px #0003,0 0 16px #ffcf7a8c}.piano-key.is-held.is-black{background:linear-gradient(#d19a44 0%,#a8762c 60%,#6d4a16 100%);transform:translateY(1.5px);box-shadow:0 0 14px #ffcf7a73}.piano-key__label{letter-spacing:.02em;color:#14161e52;pointer-events:none;font-size:.6rem;transition:color .2s;position:absolute;bottom:.4rem;left:50%;transform:translate(-50%)}.piano-key.is-black .piano-key__label{color:#ffffff4d}.piano-key.has-binding .piano-key__label{color:#14161e8c}.piano-key.is-black.has-binding .piano-key__label{color:#ffe7be99}.piano-key.is-held .piano-key__label{color:#14161ebf}.piano.is-sustaining:after{content:"pedal";color:#14161e;letter-spacing:.1em;text-transform:uppercase;z-index:4;pointer-events:none;background:#ffcf7ae6;border-radius:999px;padding:.1rem .45rem;font-size:.62rem;position:absolute;top:.35rem;right:.6rem}.panel{right:.75rem;top:calc(var(--bar-h) + .5rem);border:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:20;background:#10131df7;border-radius:.75rem;width:min(20rem,100vw - 1.5rem);padding:1rem 1.1rem 1.1rem;position:absolute;box-shadow:0 24px 60px #0000008c}.panel__title{letter-spacing:.16em;text-transform:uppercase;color:var(--text-faint);margin:0 0 .85rem;font-size:.72rem;font-weight:600}.panel__grid{gap:.85rem;display:grid}.field{grid-template-columns:1fr auto;align-items:center;gap:.15rem .5rem;display:grid}.field label{color:var(--text-dim);font-size:.8rem}.field output{font-variant-numeric:tabular-nums;color:var(--gold-soft);font-size:.75rem}.field input[type=range]{appearance:none;cursor:pointer;background:#ffffff24;border-radius:3px;grid-column:1/-1;width:100%;height:3px}.field input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--gold-soft);border-radius:50%;width:.8rem;height:.8rem}.field input[type=range]::-moz-range-thumb{background:var(--gold-soft);border:0;border-radius:50%;width:.8rem;height:.8rem}.panel__note{color:var(--text-faint);margin:.9rem 0 .75rem;font-size:.72rem;line-height:1.5}.boot{left:50%;bottom:calc(var(--piano-h) + 1.2rem);text-align:center;z-index:10;width:min(18rem,70vw);transition:opacity .5s;position:absolute;transform:translate(-50%)}.app:not([data-state=loading]) .boot{opacity:0;pointer-events:none}.boot__label{letter-spacing:.1em;color:var(--text-faint);margin:0 0 .5rem;font-size:.75rem}.boot__track{background:#ffffff1a;border-radius:2px;height:2px;overflow:hidden}.boot__fill{background:var(--gold-soft);width:0;height:100%;transition:width .2s linear}.app[data-mode=conduct] .stage{cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'><line x1='6' y1='28' x2='27' y2='5' stroke='%23ffcf7a' stroke-width='2.5' stroke-linecap='round'/><circle cx='6' cy='28' r='3' fill='%23f6d9a4'/></svg>") 6 28,crosshair}.conduct-demo{z-index:30;cursor:pointer;background:#0b0d14db;place-items:center;transition:opacity .4s;display:grid;position:absolute;inset:0}.conduct-demo__card{text-align:center;justify-items:center;gap:.6rem;max-width:22rem;padding:1.4rem 1.8rem;display:grid}.conduct-demo__title{letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin:0;font-size:.72rem}.conduct-demo__stage{width:10rem;height:10rem;position:relative}.conduct-demo__line{border-top:2px dashed #ffcf7a66;position:absolute;top:70%;left:0;right:0}.conduct-demo__baton{background:var(--gold-soft);border-radius:50%;width:.6rem;height:.6rem;margin:-.3rem 0 0 -.3rem;animation:1.8s ease-in-out infinite conduct-demo-swing;position:absolute;top:0;left:50%;box-shadow:0 0 12px #ffcf7ab3}@keyframes conduct-demo-swing{0%{top:0%}45%{top:70%}55%{top:70%}to{top:0%}}.conduct-demo__hint{color:var(--text-dim);margin:0;font-size:.85rem}@media (width<=860px){:root{--piano-h:clamp(7rem, 16vh, 10rem)}.transport__title{display:none}.wordmark{font-size:.9rem}.piano-key__label{font-size:.5rem}}@media (width<=620px){.legend{display:none}.transport__tempo{min-width:0}.bar__row{padding:.4rem .6rem}}@media (prefers-reduced-motion:reduce){*{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}