/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-ease:initial}}}@layer theme{:host,:root{--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--spacing:.25rem;--ease-out:cubic-bezier(0,0,.2,1);--ease-in-out:cubic-bezier(.4,0,.2,1);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-nunito);--default-mono-font-family:var(--font-mono);--font-display:var(--font-fraunces)}}@layer base{*,::backdrop,:after,:before{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}:host,html{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,optgroup,select,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.collapse{visibility:collapse}.invisible{visibility:hidden}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.top-5{top:calc(var(--spacing) * 5)}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.table{display:table}.h-full{height:100%}.shrink{flex-shrink:1}.grow{flex-grow:1}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.resize{resize:both}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.rounded{border-radius:.25rem}.border{border-style:var(--tw-border-style);border-width:1px}.italic{font-style:italic}.ordinal{--tw-ordinal:ordinal;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.line-through{text-decoration-line:line-through}.overline{text-decoration-line:overline}.underline{text-decoration-line:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.shadow,.shadow\/debug{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a)}.ring,.shadow,.shadow\/debug{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.blur{--tw-blur:blur(8px)}.blur,.grayscale{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.grayscale{--tw-grayscale:grayscale(100%)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}}:root{--ink:#3b2460;--ink-soft:#6d5b88;--paper:#fff6ec;--paper-2:#f7e4cf;--card:#fffdf8;--line:#3b24601f;--shadow:0 18px 40px #3b24601f;--note-c:#ee4d4a;--note-d:#f08c2b;--note-e:#f0c93a;--note-f:#3db87a;--note-g:#3b8fe0;--note-a:#6a5ae0;--note-b:#e04aa8;--radius:22px;--header-h:5.15rem}*{box-sizing:border-box}html{height:100%}body{min-height:100dvh;color:var(--ink);font-family:var(--font-nunito),"Nunito",system-ui,sans-serif;background:radial-gradient(1200px 500px at 10% -10%,#ee4d4a29,transparent 55%),radial-gradient(900px 420px at 90% 0,#3b8fe029,transparent 50%),radial-gradient(800px 400px at 70% 110%,#f0c93a2e,transparent 55%),linear-gradient(180deg,#fff8f0 0,var(--paper) 40%,#f8e9d8 100%);flex-direction:column;margin:0;display:flex}main{flex:1}.brand strong,h1,h2,h3{font-family:var(--font-fraunces),"Fraunces",Georgia,serif;letter-spacing:-.03em;font-weight:650;line-height:1.1}h1{margin:0;font-size:clamp(2rem,4.6vw,3.4rem)}h2{margin:0 0 .4rem;font-size:clamp(1.4rem,3vw,2rem)}h3{margin:0 0 .35rem;font-size:1.35rem}p{margin:0}a{color:inherit}.eyebrow{letter-spacing:.16em;text-transform:uppercase;margin:0 0 .55rem;font-size:.78rem;font-weight:800}.eyebrow,.lede{color:var(--ink-soft)}.lede{max-width:38rem;font-size:1.12rem;line-height:1.65}.home{width:min(1120px,100% - 2rem);margin:0 auto;padding:0 0 4rem}.home-below{padding-top:2.5rem}.page-shell{width:min(1120px,100% - 2rem);margin:0 auto;padding:1.5rem 0 4rem}.page-hero{margin-bottom:1.8rem}.page-hero .hero-actions{margin-top:1.2rem}.site-header{z-index:20;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);background:#fff6ecdb;position:sticky;top:0}.rainbow-strip{grid-template-columns:repeat(7,1fr);height:6px;display:grid}.rainbow-strip span:first-child{background:var(--note-c)}.rainbow-strip span:nth-child(2){background:var(--note-d)}.rainbow-strip span:nth-child(3){background:var(--note-e)}.rainbow-strip span:nth-child(4){background:var(--note-f)}.rainbow-strip span:nth-child(5){background:var(--note-g)}.rainbow-strip span:nth-child(6){background:var(--note-a)}.rainbow-strip span:nth-child(7){background:var(--note-b)}.site-header-inner{gap:1.5rem;width:min(1120px,100% - 2rem);margin:0 auto;padding:.95rem 0}.brand,.site-header-inner{align-items:center;display:flex;overflow:visible}.brand{gap:.7rem;text-decoration:none}.brand-mark{object-fit:contain;object-position:center;box-sizing:content-box;flex-shrink:0;width:4.5rem;height:3.375rem;padding:2px;display:block;overflow:visible}.brand strong{font-size:1.05rem;display:block}.brand em{color:var(--ink-soft);font-size:.78rem;font-style:normal;display:block}.site-header nav{gap:.35rem;margin-left:auto;display:flex}.site-header nav a{border-radius:999px;padding:.45rem .8rem;font-size:.92rem;font-weight:800;text-decoration:none}.site-header nav a.is-active,.site-header nav a:hover{background:#fff;box-shadow:0 4px 14px #3b246014}.midi-pill{border:1px solid var(--line);color:var(--ink);font:inherit;cursor:pointer;background:#fff;border-radius:999px;padding:.45rem .85rem;font-size:.82rem;font-weight:800;text-decoration:none}.header-tools{align-items:center;gap:.5rem;margin-left:auto;display:flex}.midi-pill.is-on{background:var(--note-f)}@supports (color:color-mix(in lab,red,red)){.midi-pill.is-on{background:color-mix(in srgb,var(--note-f) 18%,white)}}.midi-pill.is-on{border-color:#0000}.header-midi{max-width:280px}.btn{font:inherit;cursor:pointer;border:0;border-radius:999px;justify-content:center;align-items:center;gap:.4rem;padding:.7rem 1.15rem;font-weight:800;text-decoration:none;transition:transform .15s,box-shadow .15s;display:inline-flex}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-lg{padding:.95rem 1.45rem;font-size:1.05rem}.btn-primary{background:var(--ink);color:#fff8f0;box-shadow:var(--shadow)}.btn-secondary{color:var(--ink);box-shadow:var(--shadow);background:#fff}.btn-ghost{color:var(--ink);background:0 0;border:2px solid #3b24602e}.text-link{border-bottom:2px solid var(--note-d);font-weight:800;text-decoration:none}@supports (color:color-mix(in lab,red,red)){.text-link{border-bottom:2px solid color-mix(in srgb,var(--note-d) 70%,white)}}.hero{min-height:calc(100svh - var(--header-h));box-sizing:border-box;grid-template-columns:minmax(22rem,1fr) minmax(16rem,1fr);justify-content:center;align-items:center;gap:2.25rem;padding:1.25rem 0 2rem;display:grid}.hero-copy{justify-self:center;width:100%;min-width:0;max-width:34rem;padding-top:0}.hero h1 span{background:linear-gradient(90deg,var(--note-c),var(--note-d),var(--note-f),var(--note-g),var(--note-a));color:#0000;-webkit-background-clip:text;background-clip:text;display:block}.hero-copy .lede{margin-top:.85rem}.hero-actions{flex-wrap:wrap;gap:.7rem;margin-top:1rem;display:flex}.hero-art{border:1px solid var(--line);box-shadow:var(--shadow);background:var(--card);aspect-ratio:3/2;border-radius:28px;justify-self:center;width:min(100%,34rem);max-height:28rem;margin-top:0;line-height:0;overflow:hidden}.hero-art img{object-fit:cover;object-position:50% 12%;width:100%;height:100%;display:block}.steps{grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:3rem;display:grid}.steps article{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.3rem}.steps p{color:var(--ink-soft);line-height:1.55}.step-num{color:#fff;border-radius:999px;place-items:center;width:2rem;height:2rem;margin-bottom:.8rem;font-weight:800;display:inline-grid}.section-head{justify-content:space-between;align-items:end;gap:1rem;margin-bottom:1rem;display:flex}.song-grid{grid-template-columns:repeat(3,1fr);gap:1rem;display:grid}.student-games{margin:0 0 2rem}.student-pieces{margin:0 0 1rem}.student-games-title{letter-spacing:-.01em;margin:0 0 .75rem;font-size:1.05rem;font-weight:650}.student-games-links{flex-wrap:wrap;gap:.7rem;display:flex}.games-switch{flex-wrap:wrap;gap:.55rem;margin:0 0 .85rem;display:flex}.games-exercises{margin-top:-.2rem}.games-blurb{color:var(--muted);margin:0 0 1.2rem}body:has(.chords) .games-blurb,body:has(.flashcards) .games-blurb,body:has(.intervals) .games-blurb{display:none}.chord-controls{gap:.35rem;display:grid}.chord-chapter{gap:.45rem;display:grid}.chord-chapter-title{letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin:0;font-size:.72rem;font-weight:800}.chord-choice-name{font-weight:800}.chord-choice-short{color:var(--ink-soft);margin-left:.4rem;font-size:.82em;font-weight:800}.interval-actions,.interval-examples,.intervals-switch{flex-wrap:wrap;gap:.55rem;margin:0 0 1rem;display:flex}.interval-panel{gap:.85rem;max-width:44rem;display:grid}.interval-panel-head h2{margin:.15rem 0}.interval-compare p,.interval-explain,.interval-note,.interval-panel-head p{color:var(--ink-soft);margin:.2rem 0 0}.interval-feedback.is-right{color:#1f7a4d;font-weight:700}.interval-choices{flex-wrap:wrap;gap:.5rem;display:flex}.interval-choice{border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;cursor:pointer;border-radius:999px;padding:.55rem .9rem;font-weight:700}.interval-choice:hover:not(:disabled){border-color:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.interval-choice:hover:not(:disabled){border-color:color-mix(in srgb,var(--note-g) 50%,var(--line))}}.interval-choice.is-right{background:#1f7a4d}@supports (color:color-mix(in lab,red,red)){.interval-choice.is-right{background:color-mix(in srgb,#1f7a4d 12%,var(--card))}}.interval-choice.is-right{border-color:#1f7a4d}.interval-choice.is-wrong{background:#b42318}@supports (color:color-mix(in lab,red,red)){.interval-choice.is-wrong{background:color-mix(in srgb,#b42318 10%,var(--card))}}.interval-choice.is-wrong{border-color:#b42318}.interval-choice:disabled{cursor:default}.interval-choice-mark{text-align:center;min-width:1.1rem;margin-right:.35rem;font-weight:800;display:inline-block}.interval-correct{z-index:3;font-family:var(--font-display),Georgia,serif;color:#1f7a4d;margin:0;font-size:clamp(2rem,5vw,2.7rem);font-weight:800;line-height:1;animation:interval-correct-pop .45s ease-out;position:relative}.interval-stars{z-index:2;border-radius:inherit;pointer-events:none;position:absolute;inset:0;overflow:hidden}.interval-stars span{text-shadow:0 0 10px;opacity:0;font-size:1.85rem;line-height:1;animation:interval-star-burst 2.1s ease-out forwards;position:absolute;top:42%;left:50%}@keyframes interval-correct-pop{0%{transform:scale(.6)}60%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes interval-star-burst{0%{opacity:0;transform:translate(-50%,-50%)scale(.15)rotate(0)}14%{opacity:1}62%{opacity:1;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(1.05) rotate(var(--spin))}to{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(1.2) rotate(var(--spin))}}@media (prefers-reduced-motion:reduce){.interval-correct{animation:none}.interval-stars span{opacity:0;animation:none}}.interval-cloud-stage{align-items:center;min-height:11rem}.flashcards-card .interval-choices{justify-content:center}.interval-stages{grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:.5rem;margin-bottom:1rem;display:grid}.interval-stage{text-align:left;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;cursor:pointer;border-radius:14px;gap:.15rem;padding:.65rem .75rem;display:grid}.interval-stage small{color:var(--ink-soft);font-size:.78rem}.interval-stage.is-current{border-color:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.interval-stage.is-current{border-color:color-mix(in srgb,var(--note-g) 60%,var(--line))}}.interval-stage.is-current{background:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.interval-stage.is-current{background:color-mix(in srgb,var(--note-g) 10%,var(--card))}}.interval-kind,.interval-stat{display:block}.interval-kind{letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);font-size:.72rem}.interval-stat{color:var(--ink-soft);font-size:.78rem;font-weight:650}.interval-stat.is-passed{color:#1f7a4d;font-weight:800}.interval-streak{color:var(--ink-soft);margin:0;font-size:.92rem;font-weight:800}.interval-staff{background:var(--card);border:1px solid var(--line);border-radius:16px;width:min(100%,28rem);height:auto}.interval-example-staff{margin:0}.interval-example-staff figcaption{margin-bottom:.25rem;font-weight:750}.interval-back{justify-self:start}.game-profile-note{color:var(--muted);margin:-.6rem 0 1.4rem;font-size:.95rem}.game-profile-note strong{color:var(--ink);font-weight:650}.song-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;gap:.45rem;padding:1.2rem 1.2rem 1.3rem;display:flex;position:relative}.song-card.has-sticker{padding-right:4.4rem}.piece-sticker{filter:drop-shadow(0 3px 4px #3b246038);line-height:0;display:inline-flex}.piece-sticker-badge{z-index:1;position:absolute;top:.45rem;right:.45rem;transform:rotate(8deg)}.sticker-picker{margin-top:.35rem}.sticker-picker summary{cursor:pointer;color:var(--ink-soft);width:fit-content;font-size:.82rem}.sticker-grid{grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:.35rem;margin-top:.55rem;display:grid}.sticker-grid form{margin:0}.sticker-grid button{cursor:pointer;background:0 0;border:2px solid #0000;border-radius:16px;place-items:center;width:100%;min-height:58px;padding:.15rem;display:grid}.sticker-grid button.is-current,.sticker-grid button:focus-visible,.sticker-grid button:hover{border-color:var(--ink)}.sticker-clear,.sticker-none{color:var(--ink-soft);font-size:.72rem;font-weight:700}.sticker-passoff-dialog{border:1px solid var(--line);background:var(--card);width:min(36rem,100vw - 1.5rem);height:fit-content;max-height:min(85vh,40rem);color:var(--ink);box-shadow:var(--shadow);border-radius:22px;margin:auto;padding:0}.sticker-passoff-dialog::backdrop{background:#2a184073}.sticker-passoff-form{gap:.7rem;max-height:min(85vh,40rem);padding:1.1rem 1.15rem 1.2rem;display:grid;overflow:auto}.sticker-passoff-form h2{margin:0;font-size:1.25rem}.sticker-passoff-form p{color:var(--ink-soft);margin:0}.sticker-passoff-actions{flex-wrap:wrap;gap:.5rem;margin-top:.3rem;display:flex}.song-card-rainbow{border-radius:999px;grid-template-columns:repeat(7,1fr);height:8px;margin-bottom:.5rem;display:grid;overflow:hidden}.song-card-blurb,.song-card-meta{color:var(--ink-soft)}.song-card-blurb{flex:1;line-height:1.5}.song-card .btn{width:fit-content;margin-top:.7rem}.piece-gems,.piece-stars{flex-wrap:wrap;align-items:center;gap:.2rem;margin:.15rem 0 0;display:flex}.piece-gem-icon,.piece-gems svg,.piece-stars svg{flex:none;width:1.45rem;height:1.45rem;display:block}.piece-gems-count,.piece-gems-more,.piece-stars-more{color:#4a78c4;letter-spacing:-.02em;margin-left:.15rem;font-size:.95rem;font-weight:800}.piece-gems-stack{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;align-items:center;margin:0;padding:0;display:inline-flex;position:relative}.piece-gems-pop{z-index:8;width:min(16rem,70vw);padding-top:.4rem;display:none;position:absolute;top:100%;left:0}.piece-gems-pop-card{background:#f4f8ff;border:1px solid #9ec8ff;border-radius:14px;padding:.55rem .6rem;box-shadow:0 12px 28px #3b24602e}.piece-gems-pop-scroll{flex-wrap:wrap;align-items:center;gap:.2rem;max-height:7.4rem;display:flex;overflow-y:auto}.piece-gems-stack:focus .piece-gems-pop,.piece-gems-stack:focus-visible .piece-gems-pop,.piece-gems-stack:hover .piece-gems-pop{display:block}.song-card:has(.piece-gems-stack:focus),.song-card:has(.piece-gems-stack:hover){z-index:4}.piece-gems-keys{margin-top:.05rem}.twelve-keys-badge{overflow:visible}.piece-mastery{margin:.25rem 0 0}.piece-mastery-toggle{font:inherit;cursor:pointer;color:inherit;background:0 0;border:0;flex-wrap:wrap;align-items:center;gap:.45rem;margin:0;padding:.15rem 0;display:inline-flex}.piece-mastery-stars{letter-spacing:.06em;color:#c98412;font-size:1.15rem;font-weight:700}.piece-mastery-stars-empty{color:#cbb38b}.piece-mastery-medal{font-size:1.2rem;line-height:1}.piece-mastery-legend{border-radius:var(--radius);background:var(--card);margin:.35rem 0 0;padding:.55rem .7rem}@supports (color:color-mix(in lab,red,red)){.piece-mastery-legend{background:color-mix(in srgb,var(--card) 88%,#f7e7b8)}}.piece-mastery-legend{font-size:.88rem}.piece-mastery-legend p{margin:.25rem 0 0}.piece-mastery-legend p:first-child{margin-top:0}.practice-reward-backdrop{z-index:80;background:#1a120873;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.practice-reward-card{border-radius:var(--radius);background:var(--card);width:min(100%,28rem);box-shadow:var(--shadow);text-align:center;padding:1.25rem 1.35rem 1.4rem;overflow:visible}.practice-reward-card h2{margin:.2rem 0 0}.practice-reward-heroes{flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:.85rem 1.1rem;min-height:7.5rem;margin:1.15rem 0 .35rem;display:flex}.practice-reward-hero{opacity:0;justify-items:center;gap:.35rem;animation:practice-reward-hero-pop .7s cubic-bezier(.18,1.45,.32,1) forwards;display:grid;position:relative;transform:scale(.35)translateY(18px)}.practice-reward-hero-gem{z-index:2}.practice-reward-hero-gem-svg{filter:drop-shadow(0 10px 18px #3a7fd473)drop-shadow(0 0 18px #9ec8ff8c);width:5.4rem;height:auto;animation:practice-reward-gem-twinkle 1.8s ease-in-out .55s infinite}.practice-reward-hero-burst{pointer-events:none;background:radial-gradient(circle,#cfe6ffb3 0,#7eb8ff59 42%,#0000 72%);border-radius:50%;height:70%;animation:practice-reward-burst .85s ease-out forwards;position:absolute;inset:-18% -10% auto}.practice-reward-hero-stars{letter-spacing:.06em;color:#e0a100;text-shadow:0 2px #8a5a0059,0 0 18px #ffd36a8c;font-size:clamp(1.85rem,6vw,2.45rem);line-height:1}.practice-reward-hero-stars-empty{color:#d5b86d;text-shadow:none}.practice-reward-hero-medal{filter:drop-shadow(0 8px 14px #0000002e);font-size:clamp(2.6rem,8vw,3.4rem);line-height:1}.practice-reward-hero-caption{letter-spacing:.02em;text-transform:uppercase;color:#6b4a14;font-size:.82rem;font-weight:800}.practice-reward-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin:1rem 0 0;display:grid}.practice-reward-stats>div{border-radius:calc(var(--radius) - 2px);background:var(--card);padding:.45rem .3rem}@supports (color:color-mix(in lab,red,red)){.practice-reward-stats>div{background:color-mix(in srgb,var(--card) 70%,#f7e7b8)}}.practice-reward-stats dt{text-transform:uppercase;color:#8a6a2a;margin:0;font-size:.72rem;font-weight:700}.practice-reward-stats dd{color:#7a4e0a;font-variant-numeric:tabular-nums;min-height:1.35em;margin:.15rem 0 0;font-weight:800}.practice-reward-spin{letter-spacing:.02em}.practice-reward-praises{gap:.4rem;margin:.9rem 0 0;padding:0;list-style:none;display:grid}.practice-reward-praises li{border-radius:calc(var(--radius) - 2px);background:#fff3c4;margin:0;padding:.45rem .6rem}@supports (color:color-mix(in lab,red,red)){.practice-reward-praises li{background:color-mix(in srgb,#fff3c4 70%,var(--card))}}.practice-reward-praises li{color:#7a4e0a;opacity:0;font-weight:700;animation:practice-reward-praise-in .55s cubic-bezier(.22,1.35,.36,1) forwards;transform:scale(.86)}.practice-reward-praise-swell{background:linear-gradient(105deg,#ffe08a,#fff6d0,#ffd36a)}@supports (color:color-mix(in lab,red,red)){.practice-reward-praise-swell{background:linear-gradient(105deg,color-mix(in srgb,#ffe08a 78%,var(--card)),color-mix(in srgb,#fff6d0 70%,var(--card)),color-mix(in srgb,#ffd36a 75%,var(--card)))}}.practice-reward-praise-swell{animation-name:practice-reward-praise-swell;box-shadow:0 0 0 1px #d4a01759}.practice-reward-praise-soft{animation-name:practice-reward-praise-in}@keyframes practice-reward-praise-in{0%{opacity:0;transform:scale(.9)translateY(6px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes practice-reward-praise-swell{0%{opacity:0;filter:brightness(1.15);transform:scale(.72)}55%{opacity:1;filter:brightness(1.08);transform:scale(1.08)}to{opacity:1;filter:brightness();transform:scale(1)}}@keyframes practice-reward-hero-pop{0%{opacity:0;transform:scale(.25)translateY(22px)}62%{opacity:1;transform:scale(1.18)translateY(-4px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes practice-reward-burst{0%{opacity:0;transform:scale(.4)}40%{opacity:1}to{opacity:.55;transform:scale(1.15)}}@keyframes practice-reward-gem-twinkle{0%,to{filter:drop-shadow(0 10px 18px #3a7fd473)drop-shadow(0 0 14px #9ec8ff73);transform:rotate(-2deg)scale(1)}50%{filter:drop-shadow(0 12px 22px #3a7fd48c)drop-shadow(0 0 26px #dff0ffb3);transform:rotate(2deg)scale(1.04)}}.practice-reward-coin-note{color:#8a6a2a;margin:.85rem 0 0;font-weight:700}.practice-reward-card .btn{margin-top:1.1rem}.quest-shell{width:min(1180px,100% - 1rem);padding-top:.65rem;padding-bottom:1.25rem}.quest-intro{flex-wrap:wrap;align-items:baseline;gap:.2rem .9rem;margin-bottom:.65rem;display:flex}.quest-intro .eyebrow{margin:0}.quest-intro h1{margin:0;font-size:clamp(1.55rem,2.6vw,2.15rem)}.quest-help{color:var(--ink-soft);font-weight:700}.quest-viewport{height:clamp(440px,100dvh - 11.5rem,700px);box-shadow:var(--shadow);touch-action:pan-y;background:#2f97d4;border-radius:28px;position:relative;overflow:hidden;container-type:size}.quest-scene{transform-origin:0 0;position:absolute;top:0;left:0}.quest-scene.is-pending{transform-origin:50%;transform:translate(-50%,-50%) scale(min(calc(100cqw / var(--world-w)),calc(100cqh / var(--world-h))));top:50%;left:50%}.quest-bg{object-fit:fill;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block;inset:0}.quest-bg,.quest-player,.quest-scenery,.quest-sky-note{pointer-events:none;position:absolute}.quest-scenery{transform:translate(-50%,-100%)}.quest-player-art,.quest-scenery svg,.quest-sky-note svg,.quest-station-art{width:100%;height:auto;display:block}.quest-sky-note{z-index:1;transform:translate(-50%,-50%)}.quest-player{filter:drop-shadow(0 3px 1px #241c0c66);width:84px}.quest-player-art{image-rendering:pixelated}.quest-node{z-index:4;cursor:pointer;width:92px;font:inherit;color:inherit;background:0 0;border:0;padding:0;position:absolute;transform:translate(-50%,-27px)}.quest-node-art{justify-items:center;gap:.12rem;display:grid}.quest-coin{width:54px;height:54px;box-shadow:inset 0 2px 0 #fffc,0 0 0 3px var(--coin,#f0c93a),0 4px 0 #8d5810,0 7px 8px #281c084d;background:radial-gradient(circle at 32% 28%,#fff6d0 0 16%,#f3c44c 38%,#e09618 68%,#a86a10 100%);border:2px solid #fff4c8;border-radius:50%;place-items:center;display:grid;position:relative}.quest-coin:before{content:"";background:radial-gradient(circle at 40% 32%,#fff9e6,#f4dd9a 74%);border-radius:50%;position:absolute;inset:7px;box-shadow:inset 0 1px 2px #78480c47}.quest-coin .quest-glyph{z-index:1;width:1.45rem;height:1.45rem;position:relative}.quest-node-sign{color:#5c3414;background:#fffaecf2;border:2px solid #e6c98a;border-radius:999px;padding:.02rem .42rem;font-size:.74rem;font-weight:800;line-height:1.3;box-shadow:0 2px #5c341429}.quest-node-star{z-index:2;color:#fffdf6;text-shadow:0 1px #6a3a12,0 0 2px #6a3a12;font-size:.95rem;line-height:1;position:absolute;top:-7px;right:-6px}.quest-node.is-here .quest-coin{outline-offset:4px;outline:3px solid #fffdf6}.quest-node.is-future .quest-coin{filter:saturate(.72)brightness(.96)}.quest-node:focus-visible{outline-offset:4px;border-radius:18px;outline:3px solid #fffdf8}.quest-station{cursor:pointer;width:150px;font:inherit;color:inherit;background:0 0;border:0;padding:0;position:absolute;transform:translate(-50%,-100%)}.quest-station.is-future{cursor:default}.quest-station-art{filter:drop-shadow(0 10px 8px #3b246029);transition:transform .15s}.quest-station.is-near .quest-station-art,.quest-station:not(.is-future):hover .quest-station-art{transform:translateY(-6px)}.quest-station:focus-visible{outline:3px solid var(--ink);outline-offset:4px;border-radius:24px}.quest-near-ring{border:3px solid var(--station,var(--ink));border-radius:50%;width:78px;height:22px;animation:quest-pulse 1.15s ease-in-out infinite;position:absolute;bottom:10px;left:50%;transform:translate(-50%)}.quest-float{animation:quest-float 3.4s ease-in-out infinite}.quest-player.is-walking .quest-player-art{animation:quest-bob .32s ease-in-out infinite}.quest-hud-top{z-index:5;pointer-events:none;justify-content:space-between;align-items:center;gap:.5rem;display:flex;position:absolute;top:.7rem;left:.7rem;right:.7rem}.quest-hud-top>*{pointer-events:auto}.quest-cue,.quest-sound,.quest-stars{box-shadow:var(--shadow);background:#fffdf8f0;border-radius:999px}.quest-stars{color:#3b246047;gap:.2rem;margin:0;padding:.35rem .7rem;font-size:1.25rem;display:flex}.quest-stars .is-on{color:var(--note-e)}.quest-sound{font:inherit;color:var(--ink);cursor:pointer;border:0;align-items:center;gap:.35rem;padding:.45rem .8rem;font-weight:800;display:inline-flex}.quest-sound svg{width:1.25rem;height:1.25rem}.quest-sound.is-on{color:var(--note-g)}.quest-cue{z-index:5;font:inherit;color:var(--ink);cursor:pointer;border:0;flex-direction:column;align-items:center;gap:.05rem;max-width:calc(100% - 1.5rem);padding:.55rem 1rem;display:flex;position:absolute;bottom:.85rem;left:50%;transform:translate(-50%)}.quest-cue strong{font-size:1.15rem}.quest-cue span,.quest-cue.is-soon{color:var(--ink-soft);font-size:.92rem;font-weight:800}.quest-cue.is-soon{cursor:default}.quest-pad{right:max(.7rem,env(safe-area-inset-right));bottom:max(.7rem,env(safe-area-inset-bottom));z-index:5;grid-template-columns:1fr 1fr;gap:.4rem;display:none;position:absolute}.quest-pad-btn{min-width:4.4rem;min-height:3.3rem;color:var(--ink);box-shadow:var(--shadow);font:inherit;touch-action:none;cursor:pointer;background:#fffdf8f2;border:0;border-radius:16px;justify-items:center;padding:.3rem .55rem;font-size:.78rem;font-weight:800;line-height:1.1;display:grid}.quest-pad-btn span{font-size:1.15rem;line-height:1}.quest-sr{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.quest-dialog-backdrop{z-index:40;background:#3b246075;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.quest-dialog{background:var(--card);width:min(40rem,100%);max-height:min(92dvh,48rem);box-shadow:var(--shadow);border-radius:28px;outline:none;padding:0 1.1rem 1.25rem;overflow:auto}.quest-dialog.is-roomy{width:min(72rem,100vw - 2rem);max-height:min(94dvh,58rem)}.quest-dialog-stripe{border-radius:28px 28px 0 0;height:8px;margin:0 -1.1rem .9rem}.quest-dialog-bar{align-items:center;gap:.8rem;margin-bottom:.8rem;display:flex}.quest-dialog-bar h2{align-items:center;gap:.45rem;margin:0;font-size:clamp(1.35rem,3vw,1.8rem);display:flex}.quest-glyph{flex:none;width:1.6rem;height:1.6rem}.quest-activity{text-align:center;flex-direction:column;align-items:center;gap:.85rem;display:flex}.quest-prompt{font-size:1.2rem;font-weight:800}.quest-choice-row,.quest-listen-row{flex-wrap:wrap;justify-content:center;gap:.7rem;width:100%;display:flex}.quest-listen{min-width:9rem;min-height:3.4rem;font-size:1.15rem}.quest-choice{min-height:4.6rem;color:var(--ink);box-shadow:var(--shadow);font:inherit;cursor:pointer;background:#fff;border:3px solid #0000;border-radius:22px;flex:9rem;font-size:1.35rem;font-weight:800}.quest-choice span{font-size:1.6rem;line-height:1;display:block}.quest-key,.quest-letter{color:var(--ink);background:linear-gradient(var(--key,var(--note-c)) 0 .7rem,#fffdf8 .7rem)}.quest-letters .quest-choice{flex:5.5rem;font-size:2rem}.quest-keys{grid-template-columns:repeat(7,minmax(0,1fr));gap:.4rem;width:100%;display:grid}.quest-key{min-height:5.2rem;box-shadow:var(--shadow);font:inherit;cursor:pointer;border:0;border-radius:14px 14px 10px 10px;font-size:1.25rem;font-weight:800}.quest-choice:disabled,.quest-key:disabled{cursor:default}.quest-key.is-yes{outline:3px solid var(--note-f)}.quest-target{font-family:var(--font-fraunces),Georgia,serif;margin:0;font-size:clamp(4rem,12vw,6rem);font-weight:700;line-height:.9}.quest-pair{align-items:flex-end;gap:1.4rem;min-height:4.5rem;display:flex}.quest-pair-dot{background:var(--ink);border-radius:50%;width:2.4rem;height:2.4rem;transition:transform .2s}.quest-pair-dot.is-pulse{transform:scale(1.18);box-shadow:0 0 0 6px #3b24601f}.quest-pair-dot.is-high{background:var(--note-e);transform:translateY(-1.4rem)}.quest-pair-dot.is-low{background:var(--note-c)}.quest-feedback{min-height:1.4rem;color:var(--ink-soft);font-weight:800}.quest-dots{gap:.4rem;display:flex}.quest-dots span{background:#3b246029;border-radius:50%;width:.85rem;height:.85rem}.quest-dots .is-on{background:var(--note-f)}.quest-done{justify-items:center;gap:.7rem;padding:.5rem 0 .2rem;display:grid}.quest-done p{font-size:1.45rem;font-weight:800}.quest-done-star{color:var(--note-e);font-size:3.4rem;line-height:1}.quest-songs{gap:.65rem;width:100%;margin:0;padding:0;list-style:none;display:grid}.quest-songs a{min-height:4.4rem;box-shadow:var(--shadow);text-align:left;background:#fff;border-radius:18px;grid-template-columns:auto 1fr auto;align-items:center;gap:.75rem;padding:.7rem .85rem;text-decoration:none;display:grid}.quest-song-swatch{border-radius:999px;width:.7rem;height:2.4rem}.quest-song-copy{display:grid}.quest-song-copy strong{font-size:1.05rem}.quest-song-copy em{color:var(--ink-soft);font-size:.92rem;font-style:normal;font-weight:700}.quest-song-go{color:var(--note-g);font-weight:800}@keyframes quest-bob{50%{transform:translateY(-5px)}}@keyframes quest-float{50%{transform:translateY(-8px)}}@keyframes quest-pulse{50%{opacity:.7;transform:translate(-50%)scaleX(1.12)}}@keyframes quest-shake{25%{transform:translate(-4px)}75%{transform:translate(4px)}}.quest-choice.is-wrong,.quest-key.is-wrong{animation:quest-shake .35s}@media (max-width:900px),(pointer:coarse){.quest-pad{display:grid}.quest-help-keys{display:none}.quest-cue{align-items:flex-start;max-width:none;bottom:.85rem;left:.75rem;right:11rem;transform:none}}@media (max-width:640px){.quest-dialog-backdrop{align-items:end;padding:0}.quest-dialog{border-radius:24px 24px 0 0;width:100%;max-height:92dvh}.quest-keys{gap:.25rem}.quest-key{min-height:4.4rem;font-size:1rem}}@media (prefers-reduced-motion:reduce){.quest-choice.is-wrong,.quest-float,.quest-key.is-wrong,.quest-near-ring,.quest-player.is-walking .quest-player-art{animation:none}.quest-station.is-near .quest-station-art,.quest-station:not(.is-future):hover .quest-station-art{transform:none}.quest-pair-dot,.quest-station-art{transition:none}}.midi-card{background:var(--card);border:1px solid var(--line);border-radius:18px;align-items:center;gap:.8rem;margin:1rem 0;padding:.9rem 1rem;display:flex}.midi-dot{background:#c8b8a2;border-radius:50%;flex-shrink:0;width:10px;height:10px}.midi-card.connected .midi-dot{background:var(--note-f);box-shadow:0 0 0 6px #3db87a2e}.midi-card.error .midi-dot,.midi-card.insecure .midi-dot,.midi-card.unsupported .midi-dot{background:var(--note-c)}.midi-title{margin-bottom:.15rem;font-weight:800}.midi-copy{flex:1}.midi-copy p:not(.midi-title){color:var(--ink-soft);font-size:.92rem}.option-bar{flex-wrap:wrap;gap:.6rem;margin:.4rem 0 1rem;display:flex}.option-chip{text-align:left;border:1px solid var(--line);background:var(--card);font:inherit;cursor:pointer;border-radius:16px;align-items:center;gap:.7rem;padding:.7rem .85rem;display:flex}.option-chip strong{font-size:.95rem;display:block}.option-chip em{color:var(--ink-soft);font-size:.78rem;font-style:normal;display:block}.option-chip-dot{border:2px solid var(--ink);background:0 0;border-radius:50%;width:14px;height:14px}.option-chip.is-on{border-color:#0000;box-shadow:0 8px 20px #3b24601a}.option-bar.is-compact{flex-wrap:nowrap;gap:.28rem;margin:0}.option-bar.is-compact .icon-btn{background:#fff;width:2.05rem;height:2.05rem}.midi-card.is-compact{border-radius:12px;margin:.45rem 0 0;padding:.45rem .7rem}.midi-card.is-compact .midi-title{margin:0;font-size:.82rem}.midi-card.is-compact .midi-copy p:not(.midi-title){font-size:.78rem}.midi-card.is-compact .btn{padding:.28rem .65rem;font-size:.78rem}.score-stage{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:28px;padding:1.2rem 1.2rem .4rem}.score-stage.is-compact{border-radius:16px;grid-template-columns:auto 1fr;align-items:center;gap:.35rem .45rem;padding:.35rem 2.55rem .95rem .4rem;display:grid;position:relative}.score-stage-tools{flex-direction:column;justify-content:center;display:flex}.score-stage-actions{flex-direction:column;gap:.28rem;display:flex;position:absolute;top:.32rem;right:.32rem}.score-stage-progress{max-width:min(70%,22rem);position:absolute;bottom:.28rem;right:.4rem}.score-stage-progress .progress-dots{justify-content:flex-end;margin:0}.score-stage-tools .option-bar{flex-direction:column;margin:0}.score-stage-tools .icon-btn,.score-stage-tools .option-bar.is-compact .icon-btn{width:1.55rem;height:1.55rem;box-shadow:none;background:0 0;border:none;padding:0;overflow:visible}.score-stage-tools .icon-btn:hover:not(:disabled),.score-stage-tools .option-bar.is-compact .icon-btn:hover:not(:disabled){box-shadow:none;background:0 0;border:none}.score-stage-tools .icon-btn.is-on,.score-stage-tools .option-bar.is-compact .icon-btn.is-on{box-shadow:none;color:var(--note-f);background:0 0;border:none}.score-stage-actions .icon-btn{background:#fff;padding:0;overflow:hidden}.score-stage-actions .icon-btn svg,.score-stage-tools .icon-btn svg{width:1.45rem;height:1.45rem}.score-stage.is-compact .score-scroll{min-width:0}.score-stage-head{justify-content:space-between;gap:1rem;margin-bottom:.6rem;display:flex}.score-hint{max-width:22rem;color:var(--ink-soft);font-size:.92rem;line-height:1.45}.score-scroll{padding-bottom:.8rem;overflow-x:auto}.score-stage.is-compact .score-scroll{padding-bottom:.15rem}.score-stage.is-compact .score-scroll svg{height:132px}.page-shell:has(.play-page){padding:.45rem 0 .7rem}body:has(.play-page) .site-footer{display:none}.play-page{flex-direction:column;gap:.4rem;display:flex}.play-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.45rem .75rem;margin-bottom:0;display:flex}.play-title{flex:1;min-width:8rem;margin:0;font-size:1.2rem}.play-actions{gap:.35rem;display:flex}.play-actions .btn{padding:.32rem .7rem;font-size:.8rem}.icon-btn{border:1px solid var(--line);width:2.05rem;height:2.05rem;color:var(--ink);cursor:pointer;background:#fff;border-radius:999px;place-items:center;padding:0;display:grid}.icon-btn svg{width:1.15rem;height:1.15rem;display:block}.icon-btn:hover:not(:disabled){background:var(--card);transform:translateY(-1px)}.icon-btn:disabled{opacity:.45;cursor:not-allowed}.icon-btn.is-on{background:var(--note-f)}@supports (color:color-mix(in lab,red,red)){.icon-btn.is-on{background:color-mix(in srgb,var(--note-f) 18%,white)}}.icon-btn.is-on{border-color:#0000}.play-grid{grid-template-columns:1.3fr .7fr;align-items:start;gap:1rem;margin-top:1rem;display:grid}.play-status{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.4rem .8rem;display:flex}.celebration,.next-note{margin:0;font-size:.95rem}.celebration{background:var(--note-e)}@supports (color:color-mix(in lab,red,red)){.celebration{background:color-mix(in srgb,var(--note-e) 35%,white)}}.celebration{border-radius:12px;padding:.4rem .7rem;font-weight:800}.progress-dots{flex-wrap:wrap;gap:.22rem;margin:0;display:flex}.progress-dots span{background:#3b246029;border-radius:50%;width:8px;height:8px}.progress-dots .is-done{background:var(--note-f)}.progress-dots .is-now{background:var(--note-d);transform:scale(1.3)}.play-note{margin:0;padding:.3rem .55rem;font-size:.82rem}.play-page .piano{border-radius:16px;padding:.5rem .55rem .4rem}.play-page .piano-keys{height:148px}.play-page .piano-key-white{padding-bottom:.45rem}.note-staff{flex-shrink:0;width:auto;height:8rem;display:block}body:has(.playground-page){height:100dvh;overflow:hidden}body:has(.playground-page) .site-footer{display:none}body:has(.playground-page) main{flex-direction:column;min-height:0;display:flex;overflow:hidden}.page-shell:has(.playground-page){flex-direction:column;flex:1;min-height:0;padding:.45rem 0 .7rem;display:flex}.playground-page{flex-direction:column;flex:1;gap:.4rem;min-height:0;display:flex}.playground-toolbar{flex-wrap:wrap;align-items:center;gap:.45rem .75rem;display:flex}.playground-controls{align-items:center;gap:.5rem .75rem;display:flex}.playground-select{color:var(--ink);align-items:center;gap:.35rem;font-size:.85rem;display:flex}.playground-select select{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:.28rem .6rem;font-size:.85rem}.playground-solfege-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;color:#1a1228;align-items:center;gap:.45rem;font-size:.95rem;font-weight:800;display:flex;position:relative}.playground-solfege-toggle input{opacity:0;width:0;height:0;position:absolute}.playground-solfege-track{opacity:.55;background:#1a12280f;border:1.5px solid #1a12282e;border-radius:999px;flex-shrink:0;width:40px;height:22px;transition:background .15s,border-color .15s,opacity .15s;position:relative}.playground-solfege-track:after{content:"";width:16px;height:16px;box-shadow:none;background:#1a122847;border-radius:50%;transition:transform .15s,background .15s;position:absolute;top:2px;left:2px}.playground-solfege-toggle:not(:has(input:checked)) .playground-solfege-label{color:#1a12286b;font-weight:700}.playground-solfege-toggle input:checked+.playground-solfege-track{opacity:1;background:#3b2460;border-color:#2a1845}.playground-solfege-toggle input:checked+.playground-solfege-track:after{background:#fff;transform:translate(18px)}.playground-solfege-label{font-size:.95rem;line-height:1.1}.playground-solfege-label,.playground-solfege-mode,.playground-solfege-volume{color:#1a1228;font-weight:800}.playground-solfege-mode{align-items:center;gap:.4rem;display:flex}.playground-solfege-mode-pills{background:#1a122814;border:1.5px solid #1a122873;border-radius:999px;align-items:center;padding:2px;display:inline-flex}.playground-solfege-mode-pill{appearance:none;color:#1a1228;font:inherit;cursor:pointer;background:0 0;border:0;border-radius:999px;margin:0;padding:.28rem .7rem;font-size:.82rem;font-weight:800;line-height:1.1}.playground-solfege-mode-pill.is-active{color:#fff;background:#3b2460}.playground-voice-loading-banner{z-index:2;color:#f8fafcf2;letter-spacing:.01em;text-align:center;pointer-events:none;white-space:nowrap;background:#0f172a8c;border-radius:999px;margin:0;padding:.45rem 1rem;font-size:.95rem;font-weight:700;position:absolute;top:1rem;left:50%;transform:translate(-50%)}.playground-page.is-immersive .playground-voice-loading-banner{top:max(1rem,env(safe-area-inset-top,0px))}.playground-solfege-volume input[type=range]{accent-color:#3b2460;width:5.5rem}.playground-stage{border:1px solid var(--line);min-height:0;box-shadow:var(--shadow);background:#0b1733;border-radius:16px;flex:1;position:relative;overflow:hidden}.playground-canvas{width:100%;height:100%;display:block}.playground-hint{text-align:center;color:#e2e8f0d9;pointer-events:none;background:#0f172a66;border-radius:999px;width:fit-content;margin:0 auto;padding:.3rem .85rem;font-size:.95rem;transition:opacity .6s;position:absolute;inset:auto 0 1.2rem}.playground-hint.is-hidden{opacity:0}.playground-keys{flex-shrink:0;height:clamp(120px,min(24vh,30vw),240px);display:flex}.playground-keys .piano{border-radius:16px;flex:1;min-height:0;padding:.5rem .55rem .4rem;display:flex}.playground-keys .piano-keys{flex:1;height:auto;min-height:0}.playground-keys .piano-key-white{padding-bottom:.45rem}.playground-page .midi-card.is-compact{flex-shrink:0;margin:0}.playground-start{text-align:center;color:#f8fafc;background:radial-gradient(circle at 50% 42%,#182e5eb8,#060c1ceb);flex-direction:column;justify-content:center;align-items:center;gap:.55rem;padding:1.2rem;display:flex;position:absolute;inset:0}.playground-start-title{letter-spacing:.01em;margin:0;font-size:clamp(1.35rem,5.5vw,1.9rem);font-weight:700}.playground-start-copy{color:#e2e8f0d1;max-width:22rem;margin:0 0 .45rem;font-size:clamp(.9rem,3.4vw,1rem)}.playground-close{top:max(.55rem,env(safe-area-inset-top,0px));right:max(.55rem,env(safe-area-inset-right,0px));z-index:120;border:1px solid var(--line);background:var(--card);border-radius:999px;width:2.75rem;height:2.75rem;position:fixed}@supports (color:color-mix(in lab,red,red)){.playground-close{background:color-mix(in srgb,var(--card) 94%,transparent)}}.playground-close{color:var(--ink);box-shadow:var(--shadow);place-items:center;font-size:1.65rem;font-weight:500;line-height:1;display:grid}.playground-close:active{transform:scale(.96)}.playground-page.is-immersive{z-index:80;background:#0b1733;gap:0;padding:0;position:fixed;inset:0}.playground-page.is-immersive .midi-card,.playground-page.is-immersive .playground-toolbar{display:none}.playground-page.is-immersive .playground-stage{box-shadow:none;border:none;border-radius:0}.playground-page.is-immersive .playground-keys{height:clamp(132px,min(23vh,31vw),224px);padding-bottom:env(safe-area-inset-bottom,0)}.playground-page.is-immersive .playground-keys .piano{border-radius:0}.playground-page.is-immersive .playground-keys{--key-label-size:clamp(.85rem,3vw,1.1rem)}body:has(.playground-page.is-immersive) .site-footer,body:has(.playground-page.is-immersive) .site-header{display:none}body:has(.playground-page.is-immersive) .page-shell{width:100%;max-width:none;margin:0;padding:0}.flashcards{flex-direction:column;gap:.75rem;display:flex}body:has(.flashcards) .page-hero{display:none}.flashcards-bar{flex-wrap:wrap;align-items:center;gap:.5rem .85rem;display:flex}.flashcards-back{border:1px solid var(--line);background:var(--card);color:var(--ink-soft);font:inherit;cursor:pointer;border-radius:999px;padding:.3rem .75rem;font-size:.85rem;font-weight:700}.flashcards-level{align-items:center;gap:.5rem;margin:0;font-weight:800;display:flex}.flashcards-level-index{background:var(--note-g);border-radius:999px;justify-content:center;align-items:center;min-width:1.9rem;padding:.1rem .5rem;display:inline-flex}@supports (color:color-mix(in lab,red,red)){.flashcards-level-index{background:color-mix(in srgb,var(--note-g) 16%,var(--card))}}.flashcards-level-index{color:var(--ink-soft);font-size:.75rem;font-weight:800}.flashcards-progress{background:var(--ink);border-radius:999px;flex:1;min-width:8rem;height:8px}@supports (color:color-mix(in lab,red,red)){.flashcards-progress{background:color-mix(in srgb,var(--ink) 10%,var(--card))}}.flashcards-progress{overflow:hidden}.flashcards-progress span{background:var(--note-f);border-radius:999px;height:100%;transition:width .25s;display:block}.flashcards-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);flex-direction:column;align-items:center;gap:.5rem;padding:1.1rem 1rem .9rem;transition:border-color .18s,background .18s;display:flex;position:relative}.flashcards-card.is-right{border-color:var(--note-f)}@supports (color:color-mix(in lab,red,red)){.flashcards-card.is-right{border-color:color-mix(in srgb,var(--note-f) 55%,var(--line))}}.flashcards-card.is-right{background:var(--note-f)}@supports (color:color-mix(in lab,red,red)){.flashcards-card.is-right{background:color-mix(in srgb,var(--note-f) 7%,var(--card))}}.flashcards-card.is-wrong{border-color:var(--note-c)}@supports (color:color-mix(in lab,red,red)){.flashcards-card.is-wrong{border-color:color-mix(in srgb,var(--note-c) 45%,var(--line))}}.flashcards-card.is-wrong{animation:flashcard-nudge .32s}@keyframes flashcard-nudge{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@media (prefers-reduced-motion:reduce){.flashcards-card.is-wrong{animation:none}}.color-card{gap:.35rem;padding-top:1.4rem}.color-swatch{aspect-ratio:1;border-radius:calc(var(--radius) * 1.4);width:min(52vw,13rem);box-shadow:var(--shadow);border:2px solid #00000024;place-items:center;display:grid}.color-swatch-letter{color:#1b1b1f;background:#fffffff0;border:1px solid #0000001f;border-radius:999px;place-items:center;width:3.4rem;height:3.4rem;font-size:1.75rem;font-weight:700;line-height:1;display:grid}.color-name{letter-spacing:-.01em;margin:.5rem 0 0;font-size:1.5rem;font-weight:700}.color-solfege{color:var(--card-tint,var(--muted));margin:.15rem 0 0}@supports (color:color-mix(in lab,red,red)){.color-solfege{color:color-mix(in srgb,var(--card-tint,var(--muted)) 88%,#1b1b1f)}}.color-solfege{letter-spacing:.1em;text-transform:uppercase;font-size:1.2rem;font-weight:800;line-height:1.15}.color-chip{border:1px solid #00000026;border-radius:999px;flex:none;width:1.1rem;height:1.1rem}.color-chips{flex:none;gap:.2rem;display:flex}.color-chip-all{background:conic-gradient(var(--note-c),var(--note-d),var(--note-e),var(--note-f),var(--note-g),var(--note-a),var(--note-b),var(--note-c))}.color-soft-burst{pointer-events:none;border-radius:inherit;position:absolute;inset:0;overflow:hidden}.color-soft-burst span{opacity:0;border-radius:999px;width:.5rem;height:.5rem;animation-name:color-soft-rise;animation-timing-function:cubic-bezier(.25,.6,.3,1);animation-fill-mode:both;position:absolute;bottom:12%}@keyframes color-soft-rise{0%{opacity:0;transform:translate(0)scale(.5)}25%{opacity:.85}to{transform:translate(var(--drift),-180%) scale(1);opacity:0}}@media (prefers-reduced-motion:reduce){.color-soft-burst span{opacity:.5;animation:none}}.color-graduated{border:1px solid var(--note-f);flex-direction:column;align-items:flex-start;gap:.5rem;padding:1rem 1.1rem;display:flex}@supports (color:color-mix(in lab,red,red)){.color-graduated{border:1px solid color-mix(in srgb,var(--note-f) 45%,var(--line))}}.color-graduated{border-radius:var(--radius);background:var(--note-f)}@supports (color:color-mix(in lab,red,red)){.color-graduated{background:color-mix(in srgb,var(--note-f) 8%,var(--card))}}.color-graduated-title{margin:0;font-size:1.1rem;font-weight:700}.color-graduated-copy{color:var(--muted);margin:0}.ear-prompt{justify-content:center;width:100%;display:flex;position:relative}.dual-ear-prompt{align-items:center;height:11rem;min-height:11rem}.dual-reveal{z-index:1;letter-spacing:.02em;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.02em;margin:0;font-size:clamp(1.85rem,5vw,2.75rem);font-weight:700;line-height:1.05;display:flex;position:absolute;inset:0}.dual-ear-copy{align-content:center;place-items:center;min-height:2.85em;display:grid}.dual-ear .flashcards-card{min-height:17.5rem}.dual-ear .flashcards-card.is-listening{background:var(--card)}@supports (color:color-mix(in lab,red,red)){.dual-ear .flashcards-card.is-listening{background:color-mix(in srgb,var(--card) 72%,#94a3b8 28%)}}.dual-ear .flashcards-card.is-listening{box-shadow:0 0 0 1px #64748b47,var(--shadow)}.dual-listen-badge{z-index:2;pointer-events:none;letter-spacing:.04em;color:#334155;text-shadow:0 1px #ffffff8c;place-items:center;margin:0;font-size:clamp(1.55rem,4.2vw,2.15rem);font-weight:800;display:grid;position:absolute;inset:0}.dual-ear .flashcards-keys.is-listening{opacity:.55;filter:grayscale(.35);pointer-events:none;transition:opacity .2s,filter .2s}.dual-ear .flashcards-keys{--key-label-size:clamp(1.05rem,3.6vw,1.35rem);flex-shrink:0;height:168px;margin-top:-.5rem;padding-top:1.25rem;overflow-y:visible}.dual-ear .piano-key-white.is-expected{z-index:3;box-shadow:inset 0 0 0 5px var(--ink),0 0 0 5px var(--key-tint,#f0c93a),0 0 22px 6px var(--key-tint,#f0c93a)}@supports (color:color-mix(in lab,red,red)){.dual-ear .piano-key-white.is-expected{box-shadow:inset 0 0 0 5px var(--ink),0 0 0 5px color-mix(in srgb,var(--key-tint,#f0c93a) 70%,#fff),0 0 22px 6px color-mix(in srgb,var(--key-tint,#f0c93a) 55%,transparent)}}.dual-ear .piano-key-black.is-expected,.dual-ear .piano-key-white.is-expected{animation:piano-clue-pulse 1.05s ease-in-out infinite}.dual-ear .piano-key-black.is-expected{z-index:4;box-shadow:inset 0 0 0 3px #fffef6,0 0 0 3px #f0c93a,0 0 20px 5px #f0c93abf}.dual-ear .piano-key-black .piano-key-label{font-size:calc(var(--key-label-size) * .88)}.dual-ear .piano-middle-c-letter{font-size:var(--key-label-size)}.ear-cloud{color:#9b8ec9;justify-content:center;align-items:center;transition:opacity .28s,transform .28s;display:flex;position:absolute;inset:0}.ear-cloud.is-hidden{opacity:0;pointer-events:none;transform:translateY(-10%)scale(.94)}.ear-cloud svg{width:min(88%,24rem);height:100%}.ear-cloud-body{fill:#ece7f8;stroke:#b9addd;stroke-width:2px}.ear-cloud.is-tinted .ear-cloud-body{fill:var(--cloud-tint)}@supports (color:color-mix(in lab,red,red)){.ear-cloud.is-tinted .ear-cloud-body{fill:color-mix(in srgb,var(--cloud-tint) 42%,#fff)}}.ear-cloud.is-tinted .ear-cloud-body{stroke:var(--cloud-tint)}.ear-cloud-mark{fill:#6a5688;font-size:46px;font-weight:800}.ear-cloud.is-tinted .ear-cloud-mark{fill:var(--cloud-tint)}@supports (color:color-mix(in lab,red,red)){.ear-cloud.is-tinted .ear-cloud-mark{fill:color-mix(in srgb,var(--cloud-tint) 70%,#2b1f45)}}.ear-cloud-waves path{opacity:0}.ear-cloud.is-sounding .ear-cloud-waves path{animation:ear-wave 1.1s ease-out infinite}@keyframes ear-wave{0%{opacity:0;transform:translate(-6px)}35%{opacity:.85}to{opacity:0;transform:translate(6px)}}.ear-cloud.is-sounding .ear-cloud-body{transform-origin:50%;transform-box:fill-box;animation:ear-hum 1.1s ease-in-out infinite}@keyframes ear-hum{0%,to{transform:scale(1)}50%{transform:scale(1.03)}}.ear-replay{border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;cursor:pointer;border-radius:999px;padding:.4rem 1.1rem;font-weight:600;transition:border-color .15s,background .15s}.ear-replay:hover:not(:disabled){border-color:var(--note-g);background:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.ear-replay:hover:not(:disabled){background:color-mix(in srgb,var(--note-g) 10%,var(--card))}}.ear-replay:disabled{opacity:0;pointer-events:none}.ear-keys{flex-wrap:wrap;justify-content:center;gap:.4rem;display:flex}.ear-key-btn{border:1px solid var(--line);background:var(--card);min-width:3rem;color:var(--ink);font:inherit;cursor:pointer;border-radius:999px;padding:.4rem .6rem;font-weight:700}.ear-key-btn.is-current{border-color:var(--note-g);background:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.ear-key-btn.is-current{background:color-mix(in srgb,var(--note-g) 16%,var(--card))}}.ear-key-btn.is-done{color:var(--note-f)}.ear-key-btn:disabled{opacity:.4;cursor:default}@media (prefers-reduced-motion:reduce){.ear-cloud.is-sounding .ear-cloud-body,.ear-cloud.is-sounding .ear-cloud-waves path{animation:none}}@keyframes flashcard-spark-fly{0%{opacity:1;transform:translate(0)}to{transform:translate(var(--spark-x),var(--spark-y));opacity:0}}.flashcard-spark-dot{animation:flashcard-spark-fly .52s ease-out forwards}@keyframes flashcard-spark-ring{0%{opacity:.7;transform:scale(.45)}to{opacity:0;transform:scale(2.3)}}.flashcard-spark-ring{transform-box:fill-box;transform-origin:50%;animation:flashcard-spark-ring .52s ease-out forwards}.flashcards-confetti{border-radius:inherit;pointer-events:none;position:absolute;inset:0;overflow:hidden}.flashcards-confetti span{opacity:0;border-radius:2px;width:9px;height:14px;animation-name:flashcards-confetti-fall;animation-timing-function:cubic-bezier(.35,.1,.55,1);animation-fill-mode:forwards;position:absolute;top:-12%}@keyframes flashcards-confetti-fall{0%{opacity:0;top:-12%;transform:translate(0)rotate(0)}10%{opacity:1}85%{opacity:1}to{opacity:0;transform:translateX(var(--drift)) rotate(var(--spin));top:108%}}@media (prefers-reduced-motion:reduce){.flashcard-spark-dot,.flashcard-spark-ring,.flashcards-confetti span{opacity:0;animation:none}}.flashcard-staff{width:100%;max-width:min(30rem,calc(var(--staff-aspect,1.5) * min(40vh, 22rem)));height:auto;margin-inline:auto;display:block;overflow:visible}.flashcards-prompt{text-align:center;min-height:1.5rem;color:var(--ink-soft);margin:0;font-weight:700}.flashcards-keys{overscroll-behavior-x:contain;border-radius:16px;height:clamp(120px,min(22vh,28vw),210px);overflow:auto hidden}.flashcards-keys.color-keys{margin-top:-.5rem;padding-top:1.25rem;overflow:auto visible}.flashcards-keys .piano{box-sizing:border-box;border-radius:16px;width:max-content;min-width:100%;height:100%;padding:.5rem .55rem .4rem;display:flex}.flashcards-keys .piano-keys{flex:1;height:auto;min-height:0}.flashcards-keys .piano-slot{min-width:2.1rem}.flashcards-clock{text-align:right;font-variant-numeric:tabular-nums;min-width:3.2rem;color:var(--ink-soft);margin:0;font-weight:800}.flashcards-clock.is-up{color:var(--note-c)}.flashcards-pace{text-align:center;margin:.4rem 0 0;font-weight:700}.flashcards-pace-best{text-align:center;color:var(--note-f);margin:0;font-weight:800}.flashcards-session{border:1px solid var(--line);border-radius:var(--radius);background:var(--card);gap:.45rem;padding:.9rem 1.1rem 1rem;display:grid}.flashcards-session-label{margin:0;font-weight:800}.flashcards-session-choices{flex-wrap:wrap;gap:.4rem;display:flex}.flashcards-session-btn{border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;cursor:pointer;border-radius:999px;padding:.3rem .9rem;font-weight:700}.flashcards-session-btn:hover{border-color:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.flashcards-session-btn:hover{border-color:color-mix(in srgb,var(--note-g) 45%,var(--line))}}.flashcards-session-btn.is-current{border-color:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.flashcards-session-btn.is-current{border-color:color-mix(in srgb,var(--note-g) 60%,var(--line))}}.flashcards-session-btn.is-current{background:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.flashcards-session-btn.is-current{background:color-mix(in srgb,var(--note-g) 12%,var(--card))}}.flashcards-session-note{max-width:40rem;color:var(--ink-soft);margin:0;font-size:.88rem}.flashcards .midi-card.is-compact{margin:0}.flashcards-passed-title{font-family:var(--font-display),Georgia,serif;margin:0;font-size:1.6rem;font-weight:800}.flashcards-passed-copy{color:var(--ink-soft);text-align:center;margin:0}.flashcards-passed-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem;margin-top:.35rem;display:flex}.flashcards-card.is-passed{padding:2.2rem 1.2rem}.flashcards-menu{gap:1rem;display:grid}.flashcards-continue{border:1px solid var(--line);border-radius:var(--radius);background:radial-gradient(220px 140px at 8% 0,#f0c93a2e,transparent 70%),var(--card);box-shadow:var(--shadow);justify-items:start;gap:.3rem;padding:1.3rem 1.4rem 1.45rem;display:grid}.flashcards-continue-label{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);margin:0;font-size:.72rem;font-weight:800}.flashcards-continue-name{font-family:var(--font-display),Georgia,serif;margin:0;font-size:1.45rem;font-weight:800}.flashcards-continue-blurb{max-width:34rem;color:var(--ink-soft);margin:0 0 .6rem}.flashcards-levels{grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.5rem;margin:0;padding:0;list-style:none;display:grid}.flashcards-level-btn{border:1px solid var(--line);background:var(--card);width:100%;color:var(--ink);font:inherit;text-align:left;cursor:pointer;border-radius:14px;align-items:center;gap:.6rem;padding:.6rem .8rem;display:flex}.flashcards-level-btn:hover:not(:disabled){border-color:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.flashcards-level-btn:hover:not(:disabled){border-color:color-mix(in srgb,var(--note-g) 45%,var(--line))}}.flashcards-level-btn.is-current{border-color:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.flashcards-level-btn.is-current{border-color:color-mix(in srgb,var(--note-g) 60%,var(--line))}}.flashcards-level-btn.is-current{background:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.flashcards-level-btn.is-current{background:color-mix(in srgb,var(--note-g) 10%,var(--card))}}.flashcards-level-btn:disabled{opacity:.45;cursor:not-allowed}.flashcards-level-name{flex:1;font-size:.92rem;font-weight:700}.flashcards-level-notes{color:var(--ink-soft);letter-spacing:.06em;font-size:.8rem;font-weight:800}.flashcards-reset{color:var(--ink-soft);font:inherit;cursor:pointer;background:0 0;border:0;justify-self:start;padding:0;font-size:.85rem;text-decoration:underline}.heard-note{align-items:center;gap:.7rem;min-height:3rem;margin:.4rem 0 1rem;font-size:1.15rem;display:flex}.heard-swatch{border-radius:50%;width:1.2rem;height:1.2rem}.note-legend{gap:.8rem;margin:1.2rem 0 0;padding:0;list-style:none;display:flex}.note-legend li{align-items:center;gap:.35rem;font-weight:800;display:flex}.note-legend span{border-radius:50%;width:12px;height:12px}.piano{box-shadow:var(--shadow);background:#2d1b4a;border-radius:28px;padding:1rem .9rem .75rem}.piano-keys{height:190px;display:flex}.piano-slot{flex:1;min-width:0;position:relative}.piano-key{cursor:pointer;font:inherit;touch-action:none;border:0;padding:0;position:relative}.piano-key-white{background:#fffdf8;border-right:1px solid #3b24601f;border-radius:0 0 12px 12px;justify-content:center;align-items:flex-end;width:100%;height:100%;padding-bottom:.7rem;display:flex}.piano-key-white.is-colored{background:linear-gradient(180deg,#fffdf8 38%,var(--key-tint))}@supports (color:color-mix(in lab,red,red)){.piano-key-white.is-colored{background:linear-gradient(180deg,#fffdf8 38%,color-mix(in srgb,var(--key-tint) 58%,#fffdf8))}}.flashcards-keys.color-keys .piano-key-white.is-colored{background:linear-gradient(to top,var(--key-tint) 0,var(--key-tint) 16%,var(--key-tint) 26%,var(--key-tint) 40%,var(--key-tint) 54%,var(--key-tint) 64%,#fffdf8 74%)}@supports (color:color-mix(in lab,red,red)){.flashcards-keys.color-keys .piano-key-white.is-colored{background:linear-gradient(to top,var(--key-tint) 0,var(--key-tint) 16%,color-mix(in srgb,var(--key-tint) 62%,#fffdf8) 26%,color-mix(in srgb,var(--key-tint) 38%,#fffdf8) 40%,color-mix(in srgb,var(--key-tint) 18%,#fffdf8) 54%,color-mix(in srgb,var(--key-tint) 7%,#fffdf8) 64%,#fffdf8 74%)}}.piano-key-black{z-index:2;background:#1d1033;border-radius:0 0 7px 7px;justify-content:center;align-items:flex-end;width:68%;height:58%;padding-bottom:.4rem;display:flex;position:absolute;top:0;right:-34%;box-shadow:inset 0 -8px #ffffff14}.piano-key.is-pressed{filter:brightness(.92);transform:translateY(2px)}.piano-key-white.is-expected{box-shadow:inset 0 0 0 4px var(--ink),0 0 0 4px var(--key-tint)}@supports (color:color-mix(in lab,red,red)){.piano-key-white.is-expected{box-shadow:inset 0 0 0 4px var(--ink),0 0 0 4px color-mix(in srgb,var(--key-tint) 45%,transparent)}}.piano-key-black.is-expected{box-shadow:inset 0 0 0 3px #f0c93a}.flashcards-keys.color-keys .piano-key-white.is-expected{z-index:3;box-shadow:inset 0 0 0 5px var(--ink),0 0 0 5px var(--key-tint,#f0c93a),0 0 22px 6px var(--key-tint,#f0c93a)}@supports (color:color-mix(in lab,red,red)){.flashcards-keys.color-keys .piano-key-white.is-expected{box-shadow:inset 0 0 0 5px var(--ink),0 0 0 5px color-mix(in srgb,var(--key-tint,#f0c93a) 70%,#fff),0 0 22px 6px color-mix(in srgb,var(--key-tint,#f0c93a) 55%,transparent)}}.flashcards-keys.color-keys .piano-key-white.is-expected{animation:piano-clue-pulse 1.05s ease-in-out infinite}.flashcards-keys.color-keys .piano-key-black.is-expected{z-index:4;animation:piano-clue-pulse 1.05s ease-in-out infinite;box-shadow:inset 0 0 0 3px #fffef6,0 0 0 3px #f0c93a,0 0 20px 5px #f0c93abf}@keyframes piano-clue-pulse{0%,to{filter:brightness(1.05);transform:translateY(0)}50%{filter:brightness(1.22);transform:translateY(-2px)}}.piano-key-miss{z-index:8;color:#e11d48;pointer-events:none;text-shadow:0 0 2px #fff,0 1px #fffffff2,0 2px 6px #00000040;background:0 0;border:0;margin:0;padding:0;font-size:1.55rem;font-weight:900;line-height:1;animation:piano-miss-float .75s ease-out forwards;position:absolute;top:42%;left:50%}.piano-key-black .piano-key-miss{text-shadow:0 0 2px #fff,0 1px 2px #000000a6;font-size:1.2rem;top:36%}@keyframes piano-miss-float{0%{opacity:1;transform:translate(-50%,8px)scale(.75)}35%{opacity:1}to{opacity:0;transform:translate(-50%,-42px)scale(1.3)}}@media (prefers-reduced-motion:reduce){.dual-ear .piano-key-black.is-expected,.dual-ear .piano-key-white.is-expected,.flashcards-keys.color-keys .piano-key-black.is-expected,.flashcards-keys.color-keys .piano-key-white.is-expected{animation:none}.piano-key-miss{opacity:1;animation:none;top:28%;transform:translate(-50%)scale(1.15)}}.piano-key.is-disabled{cursor:not-allowed;pointer-events:none}.piano-key-white.is-disabled{filter:none;opacity:.72;background:#d8d4e0;border-right-color:#3b246014}.piano-key-black.is-disabled{filter:none;opacity:.7;background:#7a738a;box-shadow:inset 0 -8px #ffffff0a}.piano-key.is-disabled.is-pressed{filter:none;transform:none}.piano-key.is-middle-c{box-shadow:inset 0 -3px #3b2460}.piano-middle-c{letter-spacing:.02em;text-align:center;white-space:nowrap;color:#3b2460;pointer-events:none;flex-direction:column;align-items:center;gap:.08rem;font-size:.52rem;font-weight:800;line-height:1.05;display:flex;position:absolute;bottom:.28rem;left:50%;transform:translate(-50%)}.piano-middle-c-letter{font-size:var(--key-label-size,.7rem);font-weight:800;line-height:1}.piano-key-white.is-disabled .piano-middle-c{color:#5c5270;opacity:.95}.piano-key-label{font-size:var(--key-label-size,.7rem);text-align:center;color:var(--ink);pointer-events:none;font-weight:800;line-height:1.15}.piano-key-black .piano-key-label{font-size:calc(var(--key-label-size,.7rem) * .82);color:#f4f1fb;letter-spacing:-.02em}.piano-key-sticker{background:linear-gradient(180deg,var(--key-tint) 0,var(--key-tint) 62%);justify-content:center;align-items:center;width:78%;min-height:1.5em;display:flex}@supports (color:color-mix(in lab,red,red)){.piano-key-sticker{background:linear-gradient(180deg,color-mix(in srgb,var(--key-tint) 58%,#fffdf8) 0,var(--key-tint) 62%)}}.piano-key-sticker{color:#fffdf8;-webkit-text-stroke:1.3px #3e384eb8;paint-order:stroke fill;border-radius:5px;box-shadow:0 0 7px #fffdf838,0 1px 3px #08041480}.flashcards-keys.color-keys .piano-key-sticker{aspect-ratio:1;box-sizing:border-box;border-radius:4px;width:86%;height:auto;min-height:0}.site-footer{width:min(1120px,100% - 2rem);color:var(--ink-soft);justify-content:space-between;gap:1rem;margin:0 auto 1.5rem;font-size:.92rem;display:flex}.site-footer-credit{opacity:.85;flex:100%;margin:0;font-size:.78rem;line-height:1.35}.site-footer-credit a{color:inherit;text-underline-offset:2px}.flashcards-midi-row{flex-wrap:wrap;align-items:stretch;gap:.65rem;width:100%;display:flex}.piano-sound-status{background:var(--panel,#fff);border-radius:16px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.55rem .75rem;padding:.65rem .85rem;display:flex}@supports (color:color-mix(in lab,red,red)){.piano-sound-status{background:color-mix(in srgb,var(--panel,#fff) 88%,#d8d2e6)}}.piano-sound-status{box-shadow:inset 0 0 0 1px #3b246014}.piano-sound-status.is-compact{padding:.45rem .7rem}.piano-sound-status-label{color:var(--ink-soft,#5c5470);margin:0;font-size:.82rem;font-weight:700}.piano-sound-status-actions{gap:.3rem;display:inline-flex}.piano-sound-chip{font:inherit;cursor:pointer;color:var(--ink,#2a2140);background:#fffdf8b3;border:0;border-radius:999px;padding:.28rem .7rem;font-size:.78rem;font-weight:800;box-shadow:inset 0 0 0 1px #3b24601f}.piano-sound-chip.is-active{background:var(--note-g,#3b8fe0)}@supports (color:color-mix(in lab,red,red)){.piano-sound-chip.is-active{background:color-mix(in srgb,var(--note-g,#3b8fe0) 22%,#fffdf8)}}.piano-sound-chip.is-active{box-shadow:inset 0 0 0 1.5px var(--note-g,#3b8fe0)}@supports (color:color-mix(in lab,red,red)){.piano-sound-chip.is-active{box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--note-g,#3b8fe0) 55%,#2a2140)}}.studio-actions .piano-sound-status{background:#fffdf8b3;border-radius:999px;padding:.2rem .35rem .2rem .55rem;box-shadow:inset 0 0 0 1px #3b24601a}.studio-actions .piano-sound-status-label{font-size:.72rem}.studio-actions .piano-sound-chip{padding:.18rem .55rem;font-size:.72rem}.form-error{background:var(--note-c)}@supports (color:color-mix(in lab,red,red)){.form-error{background:color-mix(in srgb,var(--note-c) 16%,white)}}.form-error{color:var(--ink);border-radius:14px;padding:.7rem .9rem;font-weight:700}.login-page{min-height:calc(100svh - var(--header-h) - 6rem);place-items:center;padding:1.5rem 0 3rem;display:grid}.login-card{background:var(--card);border:1px solid var(--line);width:min(28rem,100%);box-shadow:var(--shadow);border-radius:28px;padding:1.6rem 1.5rem 1.5rem}.login-card.login-chooser{width:min(34rem,100%)}.login-choice-stack{gap:.85rem;margin-top:1.35rem;display:grid}.login-choice{border:1px solid var(--line);background:var(--paper);border-radius:18px;gap:.35rem;padding:1rem 1.05rem;display:grid}@supports (color:color-mix(in lab,red,red)){.login-choice{background:color-mix(in srgb,var(--paper) 70%,white)}}.login-choice{color:inherit;text-decoration:none;transition:border-color .15s,transform .15s}.login-choice:hover{border-color:var(--accent)}@supports (color:color-mix(in lab,red,red)){.login-choice:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}}.login-choice:hover{transform:translateY(-1px)}.login-choice strong{font-size:1.15rem}.login-choice span{color:var(--ink-soft);font-size:.95rem;line-height:1.35}.login-choice-student{border-color:var(--note-c)}@supports (color:color-mix(in lab,red,red)){.login-choice-student{border-color:color-mix(in srgb,var(--note-c) 35%,var(--line))}}.login-choice-student{background:var(--note-c)}@supports (color:color-mix(in lab,red,red)){.login-choice-student{background:color-mix(in srgb,var(--note-c) 10%,white)}}.login-choice-teacher{border-color:var(--accent)}@supports (color:color-mix(in lab,red,red)){.login-choice-teacher{border-color:color-mix(in srgb,var(--accent) 30%,var(--line))}}.login-callout{background:var(--note-c);border-radius:14px;margin-top:1rem;padding:.85rem .95rem}@supports (color:color-mix(in lab,red,red)){.login-callout{background:color-mix(in srgb,var(--note-c) 12%,white)}}.login-callout{border:1px solid var(--note-c)}@supports (color:color-mix(in lab,red,red)){.login-callout{border:1px solid color-mix(in srgb,var(--note-c) 28%,var(--line))}}.login-callout p{color:var(--ink);margin:0;font-size:.95rem;line-height:1.4}.login-callout p+p{margin-top:.45rem}.login-callout-student{background:#fdf4e0;border-color:#e0a800}@supports (color:color-mix(in lab,red,red)){.login-callout-student{border-color:color-mix(in srgb,#e0a800 35%,var(--line))}}.auth-form{gap:.9rem;margin-top:1.2rem;display:grid}.auth-form label{gap:.35rem;font-size:.9rem;font-weight:800;display:grid}.auth-form label span{color:var(--ink-soft);font-weight:600}.auth-form input{font:inherit;border:1px solid var(--line);color:var(--ink);background:#fff;border-radius:14px;padding:.7rem .85rem}.auth-form input[type=file]{cursor:pointer;border-style:dashed;width:100%;padding:.65rem .85rem}.auth-form input[type=file]::file-selector-button{border:1px solid var(--line);background:var(--card);border-radius:10px;margin-right:.75rem}@supports (color:color-mix(in lab,red,red)){.auth-form input[type=file]::file-selector-button{background:color-mix(in oklab,var(--card) 88%,white)}}.auth-form input[type=file]::file-selector-button{font:inherit;cursor:pointer;padding:.45rem .75rem;font-weight:700}.credential-card{background:var(--note-e)}@supports (color:color-mix(in lab,red,red)){.credential-card{background:color-mix(in srgb,var(--note-e) 28%,white)}}.credential-card{border-radius:20px;margin-bottom:1.25rem;padding:1rem 1.1rem}.credential-hint{color:var(--ink-soft);margin-top:.5rem}.credential-card .btn{margin-top:.85rem}.roster-form{max-width:28rem;margin-bottom:2rem}.roster-list ul{padding-left:1.1rem;line-height:1.8}.roster-view-tabs{flex-wrap:wrap;gap:.5rem;margin:0 0 1.5rem;display:flex}.roster-view-tabs a{border:1px solid var(--line);background:var(--card);border-radius:999px;align-items:center;padding:.45rem .9rem;display:inline-flex}@supports (color:color-mix(in lab,red,red)){.roster-view-tabs a{background:color-mix(in srgb,var(--card) 88%,transparent)}}.roster-view-tabs a{color:var(--ink-soft);font-size:.92rem;font-weight:700;text-decoration:none}.roster-view-tabs a.is-active{color:var(--ink);border-color:var(--accent)}@supports (color:color-mix(in lab,red,red)){.roster-view-tabs a.is-active{border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}}.roster-view-tabs a.is-active{background:var(--accent)}@supports (color:color-mix(in lab,red,red)){.roster-view-tabs a.is-active{background:color-mix(in srgb,var(--accent) 12%,var(--card))}}.publish-updates{border:1px solid var(--line);background:var(--card);border-radius:20px;margin:0 0 1.75rem;padding:1rem 1.1rem}@supports (color:color-mix(in lab,red,red)){.publish-updates{background:color-mix(in oklab,var(--card) 92%,white)}}.publish-updates-row{justify-content:space-between;align-items:center;gap:1rem;display:flex}.publish-updates h2{margin:0 0 .35rem;font-size:1.05rem}.publish-updates p{color:var(--ink-soft);max-width:36rem;margin:0}.catalog-add-form{max-width:36rem}.catalog-add-form,.catalog-section{margin-bottom:2rem}.catalog-list{gap:1rem;margin:0;padding:0;list-style:none;display:grid}.catalog-item{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:20px;padding:1rem 1.1rem}.catalog-item-head p{color:var(--ink-soft);margin-top:.25rem}.catalog-item-forms{border-top:1px solid var(--line);gap:1rem;margin-top:1rem;padding-top:1rem;display:grid}.catalog-edit-form,.catalog-replace-form{gap:.75rem;display:grid}.catalog-replace-form{border-top:1px dashed var(--line);padding-top:.75rem}@media (max-width:720px){.publish-updates-row{flex-direction:column;align-items:stretch}}.student-cards{gap:.8rem;margin:0;padding:0;list-style:none;display:grid}.student-cards li{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:20px;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.1rem;display:flex}.student-card-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.5rem;display:flex}.student-card-actions .remove-student,.student-cards p{color:var(--ink-soft)}.student-cards p{margin-top:.2rem}.assign-page{padding:.45rem 0 .75rem}.assign-head{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.45rem;display:flex}.assign-head .text-link{font-size:.78rem}.assign-head h1{margin-top:.05rem;font-size:1.2rem}.assign-save{box-shadow:none;padding:.28rem .7rem;font-size:.8rem}.assign-songs{gap:.15rem;margin:0;padding:0;list-style:none;display:grid}.assign-song{background:var(--card);border:1px solid var(--line);border-radius:10px;grid-template-columns:minmax(12rem,1.2fr) minmax(8rem,.8fr);align-items:center;gap:.35rem .6rem;padding:.18rem .5rem;display:grid}.assign-song label{cursor:pointer;align-items:center;gap:.4rem;min-width:0;font-weight:800;display:flex}.assign-song input[type=checkbox]{width:.9rem;height:.9rem;accent-color:var(--ink);flex-shrink:0}.assign-song span{flex-wrap:wrap;align-items:baseline;gap:.15rem .5rem;min-width:0;display:flex}.assign-song strong{letter-spacing:-.02em;font-size:.85rem}.assign-song em{color:var(--ink-soft);font-size:.72rem;font-style:normal;font-weight:700}.assign-song input[type=text]{font:inherit;border:1px solid var(--line);color:var(--ink);background:#fff;border-radius:8px;width:100%;padding:.22rem .5rem;font-size:.8rem}.credential-card-compact{border-radius:10px;margin-bottom:.4rem;padding:.4rem .65rem}.save-banner{background:var(--note-f)}@supports (color:color-mix(in lab,red,red)){.save-banner{background:color-mix(in srgb,var(--note-f) 18%,white)}}.save-banner{border-radius:10px;margin-bottom:.4rem;padding:.3rem .6rem;font-size:.82rem;font-weight:800}@media (max-width:720px){.assign-head{flex-wrap:wrap;align-items:start}.assign-song{grid-template-columns:1fr}}.assign-group-title{margin:.75rem 0 .35rem;font-size:.95rem}.assign-library-hint{color:var(--ink-soft);margin-top:.75rem;font-size:.88rem}.assign-student-library{margin-top:1.25rem;padding-top:.35rem}.assign-library-song{grid-template-columns:1fr auto;align-items:center}.assign-library-song span{flex-direction:column;gap:.1rem;display:flex}.assign-library-song .btn{box-shadow:none;padding:.28rem .65rem;font-size:.78rem}@media (max-width:640px){.assign-library-song{grid-template-columns:1fr}}.library-page .page-hero{margin-bottom:1.1rem}.library-upload{max-width:34rem;margin-bottom:2rem}.library-upload h2{margin-bottom:.65rem;font-size:1.15rem}.library-upload-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;display:grid}.library-hint{color:var(--ink-soft);margin-top:.55rem;font-size:.82rem}.library-section{margin-bottom:1.5rem}.library-section h2{margin-bottom:.5rem;font-size:1.1rem}.library-list{gap:.4rem;margin:0;padding:0;list-style:none;display:grid}.library-list li{background:var(--card);border:1px solid var(--line);border-radius:12px;justify-content:space-between;align-items:center;gap:.75rem;padding:.55rem .75rem;display:flex}.library-list p{color:var(--ink-soft);margin:.15rem 0 0;font-size:.82rem}.studio-assigned-done,.studio-assigned-hint{color:var(--ink-soft);margin-top:.15rem;font-size:.8rem;font-weight:700}.studio-assigned-done{color:var(--note-f)}@supports (color:color-mix(in lab,red,red)){.studio-assigned-done{color:color-mix(in srgb,var(--note-f) 70%,var(--ink))}}@media (max-width:720px){.library-upload-row{grid-template-columns:1fr}.library-list li{flex-wrap:wrap}}.pub-pill{letter-spacing:.03em;text-transform:uppercase;background:var(--ink);border-radius:999px;padding:.15rem .45rem;font-size:.72rem;font-weight:800;display:inline-block}@supports (color:color-mix(in lab,red,red)){.pub-pill{background:color-mix(in srgb,var(--ink) 8%,white)}}.pub-pill{border:1px solid var(--line)}.pub-check{align-items:center;gap:.45rem;font-weight:700;flex-direction:row!important;display:flex!important}.pub-check input{width:auto!important}.pub-meta-details{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:1.25rem;padding:.85rem 1rem 1rem}.pub-meta-details summary{cursor:pointer;margin-bottom:.6rem;font-weight:800}.pub-toc{gap:.55rem;margin:0 0 1rem;padding:0;list-style:none;display:grid}.pub-toc-item{background:var(--card);border:1px solid var(--line);border-radius:14px;justify-content:space-between;align-items:start;gap:.75rem;padding:.65rem .75rem;display:flex}.pub-toc-main p{color:var(--ink-soft);margin:.15rem 0 0;font-size:.84rem}.pub-toc-actions{flex-wrap:wrap;justify-content:flex-end;gap:.3rem;display:flex}.pub-toc-actions .btn{padding:.25rem .55rem;font-size:.78rem}.pub-scan-score-form{flex-wrap:wrap;align-items:center;gap:.3rem;display:flex}.pub-scan-score-form input[type=file]{max-width:11rem;font-size:.72rem}.library-attach-mei{flex-wrap:wrap;align-items:end;gap:.4rem;margin-top:.45rem;display:flex}.library-attach-mei label{color:var(--ink-soft);font-size:.72rem;font-weight:800}.library-attach-mei input[type=file]{max-width:14rem;margin-top:.2rem;font-size:.75rem;display:block}.scan-score-page .scan-frame{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);min-height:70vh;box-shadow:var(--shadow);overflow:hidden}.scan-iframe{background:#f7f4ef;border:0;width:100%;min-height:70vh}.converter-help,.converter-mei-preview{background:var(--ink)}@supports (color:color-mix(in lab,red,red)){.converter-help,.converter-mei-preview{background:color-mix(in srgb,var(--ink) 6%,white)}}.converter-help,.converter-mei-preview{border:1px solid var(--line);white-space:pre-wrap;border-radius:12px;max-height:20rem;padding:.75rem .9rem;font-size:.78rem;line-height:1.45;overflow:auto}.converter-page .library-list form{justify-items:end;gap:.35rem;display:grid}.recognition-action-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;display:grid}.recognition-action-grid .auth-form{margin:0}.recognition-action-grid h3{margin:0 0 .5rem;font-size:1rem}.converter-visual-compare,.recognition-side-by-side{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;display:grid}.converter-visual-compare{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:.75rem}.converter-visual-compare.is-notation-only{grid-template-columns:minmax(0,1fr)}.mei-notation-preview-stack{gap:.75rem;display:grid}.mei-notation-page{gap:.35rem;margin:0;display:grid}.mei-notation-page-label{color:var(--ink);font-size:.8rem;font-weight:600}@supports (color:color-mix(in lab,red,red)){.mei-notation-page-label{color:color-mix(in srgb,var(--ink) 70%,transparent)}}.mei-notation-preview{border:1px solid var(--line);background:#fffdf9;border-radius:12px;width:100%;min-height:12rem;max-height:70vh;padding:.5rem;overflow:auto}.mei-notation-preview svg{background:#fffdf9;width:100%;max-width:100%;height:auto;display:block}.converter-raw-mei{margin-top:.85rem}.recognition-pane{align-content:start;gap:.5rem;min-width:0;display:grid}.recognition-pane h3{margin:0;font-size:.95rem}.recognition-source-frame,.recognition-source-image{border:1px solid var(--line);background:#f7f4ef;border-radius:12px;width:100%;min-height:28rem;max-height:70vh}.recognition-metrics{margin:0;padding-left:1.1rem}.recognition-layer-scores{grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr));gap:.65rem 1rem;margin:1rem 0 1.25rem;display:grid}.recognition-layer-scores>div{flex-direction:column;gap:.15rem;display:flex}.recognition-layer-scores span{color:var(--muted,#6b6560);font-size:.8rem}.recognition-layer-scores strong{font-size:.95rem}.recognition-align-list{max-height:12rem;overflow:auto}.recognition-error-groups{flex-direction:column;gap:.5rem;display:flex}.recognition-error-measure{border-top:1px solid var(--line);padding:.35rem 0}.recognition-error-measure>summary{cursor:pointer;font-weight:600}.recognition-error-staff h4{margin:.5rem 0 .25rem;font-size:.9rem}.recognition-error-staff ul{margin:0;padding:0;list-style:none}.recognition-error-btn{text-align:left;cursor:pointer;width:100%;font:inherit;color:inherit;background:0 0;border:none;padding:.35rem 0;display:block}.recognition-error-btn:hover{text-decoration:underline}.recognition-error-detail{border-left:2px solid var(--line);margin:0 0 .65rem .5rem;padding:.5rem .65rem;font-size:.9rem}.corr-toolbar{flex-wrap:wrap;align-items:center;gap:.75rem 1rem;margin-bottom:.5rem;display:flex}.corr-toolbar h2{margin:0 auto 0 0}.corr-align-toggle{align-items:center;gap:.4rem;font-size:.95rem;display:inline-flex}.teaching-annotate-panel{background:#ffffff8c;border:1px solid #0000001f;border-radius:6px;margin:.75rem 0 1rem;padding:.75rem 1rem}.teaching-annotate-header{align-items:center;gap:1rem;display:flex}.teaching-annotate-body{flex-direction:column;gap:.5rem;margin-top:.75rem;display:flex}.teaching-annotate-field{flex-direction:column;gap:.25rem;font-size:.85rem;display:flex}.teaching-annotate-field select,.teaching-annotate-field textarea{font:inherit;border:1px solid #0003;border-radius:4px;max-width:36rem;padding:.4rem .5rem}.teaching-annotate-actions{flex-wrap:wrap;gap:.5rem;display:flex}.teaching-annotate-list{max-height:14rem;margin:.5rem 0 0;padding:0;list-style:none;overflow:auto}.teaching-annotate-item{border-top:1px solid #00000014;padding:.5rem 0;font-size:.85rem}.teaching-annotate-text{white-space:pre-wrap;margin:.25rem 0}.corr-mei-root{position:relative}.corr-mei-annotate{cursor:crosshair}.corr-mei-annotate-overlay{pointer-events:none;z-index:3;width:100%;height:100%;position:absolute;inset:0}.corr-draft-region{fill:#8a3a5c2e;stroke:#8a3a5c;stroke-width:4px;stroke-dasharray:12 8}.corr-draft-region-committed{stroke-dasharray:none;fill:#8a3a5c47}.corr-selection-list{margin:.35rem 0 .75rem}.corr-interactive g.corr-target{cursor:pointer}.corr-interactive g.corr-hl-confirmed .notehead,.corr-interactive g.corr-hl-confirmed .rest{fill:#1f7a3a!important;stroke:#1f7a3a!important}.corr-interactive g.corr-hl-high .notehead,.corr-interactive g.corr-hl-high .rest{fill:#1d4f91!important;stroke:#1d4f91!important}.corr-interactive g.corr-hl-uncertain .notehead,.corr-interactive g.corr-hl-uncertain .rest{fill:#b78100!important;stroke:#b78100!important}.corr-interactive g.corr-hl-conflict .notehead,.corr-interactive g.corr-hl-conflict .rest{fill:#8a3a5c!important;stroke:#8a3a5c!important}.corr-interactive g.corr-unmapped{opacity:.55}.corr-source-wrap{border:1px solid var(--line);background:#f7f4ef;border-radius:12px;min-height:0;line-height:0;position:relative;overflow:hidden}.corr-source-wrap .recognition-source-frame,.corr-source-wrap .recognition-source-image{object-fit:contain;object-position:top left;background:#f7f4ef;border:0;border-radius:0;width:100%;height:auto;min-height:22rem;max-height:70vh;display:block}.corr-source-overlay{pointer-events:none;z-index:2;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.corr-source-overlay .corr-source-rect,.corr-source-overlay .sbe-rect{pointer-events:auto}.corr-source-align .corr-source-overlay{pointer-events:auto;cursor:crosshair}.corr-source-rect{fill:#1d4f9138;stroke:#1d4f91;stroke-width:6px;pointer-events:auto;cursor:pointer}.corr-source-rect.corr-source-hit{fill:#1d4f910f;stroke:#1d4f9159;stroke-width:3px}.corr-source-rect.corr-source-selected{stroke:#111;stroke-width:5px;stroke-dasharray:6 4}.corr-source-rect.corr-hl-high,.corr-source-rect.corr-source-active{fill:#1d4f9159;stroke:#0b3d75;stroke-width:10px;stroke-dasharray:none}.corr-source-rect.corr-hl-confirmed,.corr-source-rect.corr-source-active.corr-hl-confirmed{fill:#1f7a3a66;stroke:#145c2b;stroke-width:12px;stroke-dasharray:none}.corr-source-rect.corr-hl-uncertain,.corr-source-rect.corr-source-active.corr-hl-uncertain{fill:#b7810047;stroke:#8a6200;stroke-width:10px;stroke-dasharray:14 8}.corr-source-rect.corr-source-uncertain{stroke-dasharray:4 3;opacity:.85}.corr-recognition-region-circle{fill:#dc3c3c1f;stroke:#c0392b;stroke-width:2px}.corr-recognition-region-uncertain{stroke-dasharray:5 4;fill:#dc3c3c14}.corr-source-rect.corr-source-unavailable{fill:#b7810014;stroke:#b78100;stroke-width:8px;stroke-dasharray:18 10;pointer-events:none}.corr-source-context-label{fill:#8a6200;pointer-events:none;font-family:ui-sans-serif,system-ui,sans-serif;font-size:22px;font-weight:600}.corr-source-unavailable{color:#8a6200;font-weight:600}.corr-source-hit-msg{color:#145c2b;font-weight:600}.corr-leg.corr-source-unavailable-leg{color:#8a6200;background:#b781001f}.rdp-inspector{background:linear-gradient(#f7f9fc,#eef2f7);border:1px solid #1428462e;max-width:52rem;margin-top:1rem;padding:.85rem 1rem;font-size:.9rem}.rdp-inspector-empty{opacity:.85}.rdp-inspector-header{flex-wrap:wrap;align-items:baseline;gap:.5rem 1rem;margin-bottom:.5rem;display:flex}.rdp-inspector h3{margin:0;font-size:1.05rem}.rdp-inspector h4{text-transform:uppercase;letter-spacing:.04em;color:#445;margin:.65rem 0 .25rem;font-size:.8rem}.rdp-path-id{background:#0000000f;padding:.1rem .35rem;font-size:.78rem}.rdp-demo-banner{background:#b781001a;border-left:3px solid #8a6200;margin:.5rem 0;padding:.5rem .65rem}.rdp-demo-banner ul{margin:.35rem 0 0;padding-left:1.1rem}.rdp-topk{margin:0;padding-left:1.1rem}.rdp-muted{color:#667}.rdp-toggles{flex-wrap:wrap;gap:.5rem 1rem;margin-bottom:.5rem;font-size:.85rem;display:flex}.rdp-heatmap{width:min(100%,320px);height:auto;image-rendering:pixelated;border:1px solid #0000001f;display:block}.rdp-interpretation{margin-top:.75rem;font-style:italic}.rdp-lab-column{gap:.75rem;max-width:52rem;margin-top:1rem;display:grid}.rdp-evidence-controls{background:#f6f8fb;border:1px solid #14284629;padding:.75rem 1rem}.rdp-evidence-controls-title{margin-bottom:.4rem;font-weight:600}.rdp-evidence-toggles{flex-wrap:wrap;gap:.35rem 1rem;font-size:.85rem;display:flex}.rdp-toggle{cursor:pointer;align-items:center;gap:.3rem;display:inline-flex}.rdp-showcase-nav{flex-wrap:wrap;align-items:center;gap:.4rem;margin-top:.55rem;display:flex}.rdp-jump-active{outline:2px solid #1f4a7a}.rdp-primitive-ellipse{fill:#b428b459;stroke:#9b1d9b;stroke-width:1.5px}.rdp-primitive-ellipse.rdp-confirmed{fill:#1f7a3a66;stroke:#1f7a3a;stroke-width:2px}.rdp-primitive-ellipse.rdp-candidate{fill:#dc781452;stroke:#c46a00;stroke-dasharray:5 3}.rdp-primitive-ellipse.rdp-rejected{fill:#8c8c8c33;stroke:#777;stroke-dasharray:3 3}.rdp-primitive-ellipse.rdp-selected,.rdp-region-ellipse.rdp-selected,.rdp-region-rect.rdp-selected{stroke-width:3px;stroke:#0b3d91}.rdp-region-ellipse,.rdp-region-rect{fill:#008cb438;stroke:#087a9c;stroke-width:1.5px;stroke-dasharray:4 3}.rdp-native-bounds{fill:none;stroke:#444;stroke-width:1px;stroke-dasharray:2 2}.rdp-encoder-cell{fill:#ffdc0026;stroke:#c9a000;stroke-width:1px}.rdp-overlay-label{fill:#1a2a3a;pointer-events:none;font-family:ui-sans-serif,system-ui,sans-serif;font-size:11px;font-weight:600}.rdp-evidence-list{margin:0;padding:0;list-style:none}.rdp-evidence-list li{cursor:pointer;border:1px solid #0000;border-radius:4px;padding:.4rem .5rem}.rdp-evidence-list li.rdp-ev-selected,.rdp-evidence-list li:hover{background:#143c780f;border-color:#143c782e}.rdp-action-row{flex-wrap:wrap;gap:.4rem;display:flex}.rdp-resolution-debug{background:#0f28460f;border:1px solid #0f284624;gap:.2rem;margin:.5rem 0;padding:.55rem .65rem;font-size:.82rem;display:grid}.rdp-resolution-badge{color:#0b3d91;background:#0b3d9114;padding:.05rem .3rem;font-weight:700}.rdp-painted-table-wrap{background:#fafbfd;border:1px dashed #14284640;max-width:52rem;margin-top:.75rem;padding:.65rem .75rem}.rdp-painted-table-wrap h4{margin:0 0 .35rem;font-size:.9rem}.rdp-painted-table{border-collapse:collapse;width:100%;font-size:.78rem}.rdp-painted-table td,.rdp-painted-table th{text-align:left;vertical-align:top;border:1px solid #0000001f;padding:.25rem .35rem}.rdp-painted-table th{background:#1428460f}.rdp-legacy-inspector{margin-top:.25rem;font-size:.9rem}.rdp-legacy-inspector summary{cursor:pointer;color:#556}.corr-source-rect.corr-draft,.corr-source-rect.corr-drag{fill:#1f7a3a1f;stroke:#1f7a3a;stroke-dasharray:8 6}.corr-legend{flex-wrap:wrap;gap:.75rem;margin-top:.75rem;font-size:.85rem;display:flex}.corr-leg{border-radius:4px;padding:.15rem .45rem}.corr-leg.corr-hl-confirmed{color:#1f7a3a;background:#1f7a3a26}.corr-leg.corr-hl-high{color:#1d4f91;background:#1d4f9126}.corr-leg.corr-hl-uncertain{color:#8a6200;background:#b7810026;border:1px dashed #b78100}.corr-leg.corr-hl-conflict{color:#a11f1f;background:#a11f1f1f}.corr-leg.corr-unmapped{color:#666;background:#0000000f}.library-upload-advanced{border-top:1px solid var(--line);margin:1.25rem 0 0;padding:.75rem 0 0}.library-upload-advanced>summary{cursor:pointer;margin-bottom:.75rem;font-weight:600}.library-upload-advanced .library-upload{margin-top:.75rem}@media (max-width:960px){.converter-visual-compare,.recognition-side-by-side{grid-template-columns:1fr}}@media (max-width:720px){.pub-toc-item{flex-direction:column}}.work-section{margin-bottom:1.25rem}.work-section h2{margin-bottom:.55rem;font-size:1.15rem}.work-page{padding-top:.9rem;padding-bottom:2rem}.work-page .page-hero{margin-bottom:1rem}.work-page .page-hero h1{font-size:clamp(1.6rem,3vw,2.1rem)}.work-page .lede{max-width:36rem;font-size:.98rem}.work-page .song-grid{gap:.55rem}.song-card-actions{flex-wrap:wrap;align-items:center;gap:.45rem;margin-top:.35rem;display:flex}.song-card-actions form{margin:0}.repertoire-journey-lede{color:var(--ink-soft);max-width:36rem;margin:0 0 .85rem}.music-journey{border:1px solid var(--line);background:radial-gradient(ellipse at 18% 28%,#ff6b9d1a,transparent 55%),radial-gradient(ellipse at 82% 72%,#6bc5ff1a,transparent 50%),linear-gradient(180deg,var(--card),var(--card));border-radius:22px;width:100%;margin:0 0 .5rem;position:relative}@supports (color:color-mix(in lab,red,red)){.music-journey{background:radial-gradient(ellipse at 18% 28%,#ff6b9d1a,transparent 55%),radial-gradient(ellipse at 82% 72%,#6bc5ff1a,transparent 50%),linear-gradient(180deg,color-mix(in srgb,var(--card) 88%,#fffaf2),var(--card))}}.music-journey{aspect-ratio:920/280;overflow:hidden}.music-journey-svg{width:100%;height:100%;display:block}.music-journey-gem-link{color:inherit;cursor:pointer;text-decoration:none}.music-journey-gem-link:focus-visible circle:nth-of-type(2),.music-journey-gem-link:hover circle:nth-of-type(2){stroke-width:3px;filter:brightness(1.05)}.music-journey-gem-label{text-align:center;color:var(--ink);pointer-events:none;justify-items:center;gap:.1rem;font-family:inherit;line-height:1.15;display:grid}.music-journey-gem-label strong{font-size:11px;font-weight:800}.music-journey-gem-label em{color:var(--ink-soft);font-size:10px;font-style:normal}.repertoire-shelf-head{flex-wrap:wrap;justify-content:space-between;align-items:end;gap:.75rem;margin-bottom:.75rem;display:flex}.repertoire-shelf-head h2{margin-bottom:0}.repertoire-search{color:var(--ink-soft);gap:.3rem;min-width:min(100%,16rem);font-size:.85rem;display:grid}.repertoire-search input{font:inherit;color:var(--ink);border:1px solid var(--line);background:var(--card);border-radius:12px;padding:.45rem .7rem}@media (max-width:720px){.music-journey-gem-label strong{font-size:10px}}.song-card.is-compact{border-radius:14px;gap:.18rem;padding:.55rem .7rem .65rem;box-shadow:0 8px 18px #3b24600f}.song-card.is-compact .song-card-rainbow{height:4px;margin-bottom:.2rem}.song-card.is-compact .eyebrow{margin:0 0 .1rem;font-size:.68rem}.song-card.is-compact h3{margin:0;font-size:1.05rem}.song-card.is-compact .song-card-meta{font-size:.78rem}.song-card.is-compact .teacher-note{border-radius:8px;margin-top:.15rem;padding:.28rem .5rem;font-size:.78rem}.song-card.is-compact .btn{margin-top:.35rem;padding:.35rem .75rem;font-size:.8rem}.teacher-note{background:var(--note-e)}@supports (color:color-mix(in lab,red,red)){.teacher-note{background:color-mix(in srgb,var(--note-e) 28%,white)}}.teacher-note{border-radius:14px;padding:.55rem .75rem;font-size:.92rem;font-weight:700}.studio-page{gap:.35rem}.studio-page,.studio-stage{flex-direction:column;flex:1;min-height:0;display:flex}.studio-toolbar{flex-wrap:wrap;flex-shrink:0;justify-content:space-between;align-items:center;gap:.4rem .75rem;display:flex}.studio-toolbar-title{flex:12rem;min-width:0}.studio-toolbar .play-title{margin:0;font-size:clamp(1rem,1.6vw,1.28rem);line-height:1.15}.studio-actions{flex-wrap:wrap;align-items:center;gap:.45rem .65rem;display:flex}.studio-score-zoom{align-items:center;gap:.2rem;display:inline-flex}.studio-score-zoom-btn{min-width:2.1rem;padding-left:.55rem;padding-right:.55rem;font-size:1.05rem;font-weight:800;line-height:1}.studio-score-zoom-label{text-align:center;font-variant-numeric:tabular-nums;min-width:2.75rem;color:var(--ink-soft);font-size:.82rem;font-weight:800}.studio-score-zoom.is-floating{top:max(.55rem,env(safe-area-inset-top,0px));left:max(.55rem,env(safe-area-inset-left,0px));z-index:120;background:var(--card);border-radius:999px;padding:.25rem .35rem;position:fixed}@supports (color:color-mix(in lab,red,red)){.studio-score-zoom.is-floating{background:color-mix(in srgb,var(--card) 92%,transparent)}}.studio-score-zoom.is-floating{box-shadow:var(--shadow)}.studio-mode{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);gap:.15rem;font-size:.68rem;font-weight:800;display:grid}.studio-mode select{border:1px solid var(--line);background:var(--card);min-width:9.5rem;color:var(--ink);font:inherit;letter-spacing:0;text-transform:none;border-radius:999px;padding:.4rem .75rem;font-size:.88rem;font-weight:700}.studio-metronome{flex-wrap:wrap;align-items:end;gap:.65rem .85rem;display:flex}.studio-metronome-toggle{color:var(--ink);padding-bottom:0}.studio-metronome-toggle .nf-toggle-label{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);font-size:.68rem;font-weight:800}.studio-metronome-toggle .nf-toggle-track{background:var(--card);border-color:var(--line)}.studio-metronome-toggle .nf-toggle-track:after{background:var(--ink-soft)}.studio-metronome .studio-mode select{min-width:6.75rem}.studio-settings-toggle{color:var(--ink);padding-bottom:0}.studio-settings-toggle .nf-toggle-label{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);font-size:.68rem;font-weight:800}.studio-settings-toggle .nf-toggle-track{background:var(--card);border-color:var(--line)}.studio-settings-toggle .nf-toggle-track:after{background:var(--ink-soft)}.metro-panel{position:relative}.metro-panel.is-locked-off .metro-trigger{opacity:.55;cursor:not-allowed}.metro-trigger{align-items:center;gap:.4rem;display:inline-flex}.metro-trigger em{opacity:.75;margin-left:.1rem;font-size:.78rem;font-style:normal}.metro-trigger-icon{font-size:.95rem;line-height:1}.metro-popover{z-index:40;border:1px solid var(--line);background:radial-gradient(180px 120px at 20% 0,#f0c93a2e,transparent 70%),radial-gradient(160px 100px at 95% 10%,#3b8fe024,transparent 65%),var(--card);width:min(18.5rem,100vw - 2rem);box-shadow:var(--shadow);border-radius:22px;padding:1rem 1.05rem 1.15rem;position:absolute;top:calc(100% + .55rem);right:0}.metro-popover-head{justify-content:space-between;align-items:start;gap:.75rem;margin-bottom:.55rem;display:flex}.metro-popover-head h3{margin:0;font-size:1.15rem}.metro-popover-head .eyebrow{margin-bottom:.2rem}.metro-popover-tempo .studio-mode select{width:100%;min-width:0}.metro-popover-tempo .studio-tempo-hint{margin-top:.65rem}.metro-close{color:var(--ink-soft);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:.15rem .35rem;font-size:1rem}.metro-close:hover{color:var(--ink);background:#3b24600f}.metro-visual{justify-items:center;gap:.15rem;margin:.2rem 0 .65rem;display:grid}.metro-svg{filter:drop-shadow(0 8px 14px #3b24601a);width:7.5rem;height:auto;display:block;overflow:visible}.metro-pendulum{transform-box:view-box;transform-origin:80px 158px;transform:rotate(calc(var(--metro-angle) * -.35));transition:transform .35s}.metro-visual.is-running .metro-pendulum{animation:metro-swing var(--metro-beat) ease-in-out infinite alternate}@keyframes metro-swing{0%{transform:rotate(calc(var(--metro-angle) * -1))}to{transform:rotate(var(--metro-angle))}}.metro-bpm-readout{color:var(--ink-soft);letter-spacing:.08em;text-transform:uppercase;align-items:baseline;gap:.35rem;font-size:.78rem;font-weight:800;display:flex}.metro-bpm-readout strong{font-family:var(--font-fraunces),Georgia,serif;letter-spacing:-.03em;color:var(--ink);text-transform:none;font-size:1.55rem;font-weight:650}.metro-start{width:100%;margin-bottom:.85rem}.metro-field{gap:.35rem;margin-bottom:.75rem;display:grid}.metro-field:last-child{margin-bottom:0}.metro-field-label{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);justify-content:space-between;align-items:baseline;font-size:.78rem;font-weight:800;display:flex}.metro-field-label strong{font-family:var(--font-fraunces),Georgia,serif;letter-spacing:-.02em;text-transform:none;color:var(--ink);font-size:1rem;font-weight:650}.metro-slider{width:100%;accent-color:var(--note-g);cursor:pointer}.metro-select{border:1px solid var(--line);width:100%;color:var(--ink);font:inherit;background:#fff;border-radius:999px;padding:.5rem .85rem;font-size:.92rem;font-weight:700}.metro-float{z-index:4;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fff8f0eb;border:1px solid #fff8f059;border-radius:16px;padding:.35rem .45rem .3rem;transition:transform .15s,box-shadow .15s;position:absolute;top:.55rem;left:50%;right:auto;transform:translate(-50%);box-shadow:0 10px 24px #0f172a47}.metro-float:hover{transform:translate(-50%)translateY(-1px);box-shadow:0 14px 28px #0f172a57}.metro-visual.is-compact{gap:0;margin:0}.metro-visual.is-compact .metro-svg{filter:drop-shadow(0 4px 8px #3b24601f);width:3.35rem}.metro-float-bpm{text-align:center;font-family:var(--font-fraunces),Georgia,serif;letter-spacing:-.02em;color:var(--ink);margin:0;font-size:.78rem;font-weight:650;line-height:1}.studio-status{color:var(--ink-soft);flex-shrink:0;margin:0;font-size:.88rem;line-height:1.35}.studio-page.is-running .studio-status{display:none}.studio-error{color:#9b1d2c;background:#ee4d4a1f;border-radius:14px;flex-shrink:0;margin:0;padding:.75rem 1rem;font-weight:700}.studio-canvas-wrap{border:1px solid var(--line);width:100%;min-height:0;box-shadow:var(--shadow);background:#faf6ee;border-radius:14px;flex:1;position:relative;overflow:hidden}.studio-settings{position:relative}.studio-settings-trigger{align-items:center;gap:.35rem;display:inline-flex}.studio-settings-gear{flex-shrink:0}.studio-settings-panel{z-index:30;border:1px solid var(--line);background:radial-gradient(160px 100px at 12% 0,#f0c93a29,transparent 70%),var(--card);width:min(19rem,100vw - 1.5rem);max-height:min(28rem,100vh - 8rem);box-shadow:var(--shadow);border-radius:18px;padding:.85rem .9rem .95rem;position:absolute;top:calc(100% + .45rem);right:0;overflow-y:auto}.studio-settings-section+.studio-settings-section{border-top:1px solid var(--line);margin-top:.95rem;padding-top:.8rem}@supports (color:color-mix(in lab,red,red)){.studio-settings-section+.studio-settings-section{border-top:1px solid color-mix(in srgb,var(--line) 75%,transparent)}}.studio-voice-bank-open{border:1px solid var(--line);background:var(--card);border-radius:12px;width:100%;margin-top:.35rem;padding:.55rem .75rem;display:block}@supports (color:color-mix(in lab,red,red)){.studio-voice-bank-open{background:color-mix(in srgb,var(--card) 70%,var(--ink) 4%)}}.studio-voice-bank-open{color:var(--ink);font:inherit;text-align:left;cursor:pointer;font-weight:600}.studio-voice-bank-open:hover{border-color:var(--accent)}@supports (color:color-mix(in lab,red,red)){.studio-voice-bank-open:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}}.voice-bank-window-backdrop{z-index:80;background:#0c101873;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.voice-bank-window{border:1px solid var(--line);background:var(--card);width:min(40rem,100%);max-height:min(44rem,100vh - 2rem);box-shadow:var(--shadow);border-radius:20px;padding:1rem 1.05rem 1.15rem;overflow:auto}.voice-bank-window-header{justify-content:space-between;align-items:flex-start;gap:.75rem;margin-bottom:.85rem;display:flex}.voice-bank-eyebrow{letter-spacing:.06em;text-transform:uppercase;color:var(--ink);margin:0;font-size:.72rem}@supports (color:color-mix(in lab,red,red)){.voice-bank-eyebrow{color:color-mix(in srgb,var(--ink) 55%,transparent)}}.voice-bank-title{margin:.15rem 0 .35rem;font-size:1.2rem}.voice-bank-lead{color:var(--ink);margin:0;font-size:.88rem;line-height:1.4}@supports (color:color-mix(in lab,red,red)){.voice-bank-lead{color:color-mix(in srgb,var(--ink) 72%,transparent)}}.voice-bank-close{border:1px solid var(--line);font:inherit;cursor:pointer;background:0 0;border-radius:999px;flex-shrink:0;padding:.35rem .7rem}.voice-bank-toolbar{flex-wrap:wrap;align-items:end;gap:.65rem 1rem;margin-bottom:.75rem;display:flex}.voice-bank-field{gap:.25rem;font-size:.82rem;display:grid}.voice-bank-field-grow{flex:12rem;min-width:11rem}.voice-bank-field select{font:inherit;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:10px;padding:.35rem .5rem}.voice-bank-range-summary{color:var(--ink);margin:0;font-size:.8rem}@supports (color:color-mix(in lab,red,red)){.voice-bank-range-summary{color:color-mix(in srgb,var(--ink) 62%,transparent)}}.voice-bank-range-summary{padding-bottom:.35rem}.voice-bank-error{color:#b42318;margin:0 0 .65rem;font-size:.88rem}.voice-bank-list{gap:.45rem;margin:0;padding:0;list-style:none;display:grid}.voice-bank-row{border:1px solid var(--line)}@supports (color:color-mix(in lab,red,red)){.voice-bank-row{border:1px solid color-mix(in srgb,var(--line) 85%,transparent)}}.voice-bank-row{border-radius:14px;padding:.55rem .65rem}.voice-bank-row.is-outside-range{background:var(--card);border-style:dashed}@supports (color:color-mix(in lab,red,red)){.voice-bank-row.is-outside-range{background:color-mix(in srgb,var(--card) 92%,#7c5cbf 8%)}}.voice-bank-row-main{flex-wrap:wrap;align-items:baseline;gap:.35rem .65rem;display:flex}.voice-bank-label{min-width:2rem;font-weight:700}.voice-bank-midi{color:var(--ink);font-size:.78rem}@supports (color:color-mix(in lab,red,red)){.voice-bank-midi{color:color-mix(in srgb,var(--ink) 55%,transparent)}}.voice-bank-pill{background:var(--ink);border-radius:999px;margin-left:auto;padding:.12rem .45rem;font-size:.72rem}@supports (color:color-mix(in lab,red,red)){.voice-bank-pill{background:color-mix(in srgb,var(--ink) 8%,transparent)}}.voice-bank-pill.is-ready{background:#34c75938}.voice-bank-pill.is-warn{background:#f0c93a59}.voice-bank-row-actions{flex-wrap:wrap;gap:.35rem;margin-top:.45rem;display:flex}.voice-bank-btn{border:1px solid var(--line);background:var(--card);border-radius:10px}@supports (color:color-mix(in lab,red,red)){.voice-bank-btn{background:color-mix(in srgb,var(--card) 80%,var(--ink) 4%)}}.voice-bank-btn{color:var(--ink);font:inherit;cursor:pointer;padding:.3rem .55rem;font-size:.84rem}.voice-bank-btn:disabled{opacity:.45;cursor:not-allowed}.voice-bank-btn.is-recording{background:#b42318;border-color:#b42318}@supports (color:color-mix(in lab,red,red)){.voice-bank-btn.is-recording{background:color-mix(in srgb,#b42318 16%,var(--card))}}.voice-bank-btn-quiet{opacity:.85}.voice-bank-upload{align-items:center;display:inline-flex;position:relative;overflow:hidden}.voice-bank-upload input[type=file]{opacity:0;cursor:pointer;position:absolute;inset:0}.voice-bank-upload.is-disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.voice-bank-row-msg{color:var(--ink);margin:.35rem 0 0;font-size:.78rem}@supports (color:color-mix(in lab,red,red)){.voice-bank-row-msg{color:color-mix(in srgb,var(--ink) 65%,transparent)}}.voice-bank-trim-panel{border-top:1px dashed var(--line);margin-top:.55rem;padding-top:.45rem}@supports (color:color-mix(in lab,red,red)){.voice-bank-trim-panel{border-top:1px dashed color-mix(in srgb,var(--line) 90%,transparent)}}.voice-bank-trim{gap:.4rem;display:grid}.voice-bank-waveform{background:var(--paper);border-radius:10px;width:100%;height:56px;display:block}@supports (color:color-mix(in lab,red,red)){.voice-bank-waveform{background:color-mix(in srgb,var(--paper) 80%,white)}}.voice-bank-waveform{border:1px solid var(--line)}.voice-bank-trim-sliders{gap:.35rem;display:grid}.voice-bank-trim-sliders label{color:var(--ink);gap:.15rem;font-size:.78rem;font-weight:700;display:grid}@supports (color:color-mix(in lab,red,red)){.voice-bank-trim-sliders label{color:color-mix(in srgb,var(--ink) 78%,transparent)}}.voice-bank-trim-sliders input[type=range]{width:100%}.voice-bank-trim-meta{color:var(--ink);margin:0;font-size:.75rem}@supports (color:color-mix(in lab,red,red)){.voice-bank-trim-meta{color:color-mix(in srgb,var(--ink) 58%,transparent)}}.studio-settings-section .studio-mode select,.studio-tempo-bpm select{width:100%}.studio-tempo-bpm{margin-top:.55rem}.studio-tempo-hint{letter-spacing:0;text-transform:none;color:var(--ink-soft);margin:.5rem 0 0;font-size:.82rem;font-weight:650;line-height:1.35}.studio-settings-section .studio-tempo-hint+.studio-mode{margin-top:.95rem}.studio-solfege-volume{gap:.35rem;margin-top:.55rem;font-size:.86rem;display:grid}.studio-solfege-volume-label{justify-content:space-between;align-items:baseline;gap:.5rem;display:flex}.studio-solfege-volume-value{font-variant-numeric:tabular-nums;color:var(--ink);font-size:1.05rem}.studio-solfege-volume-slider{width:100%;accent-color:var(--ink)}@supports (color:color-mix(in lab,red,red)){.studio-solfege-volume-slider{accent-color:color-mix(in srgb,var(--ink) 70%,#6b4ea8)}}.studio-solfege-volume-scale{color:var(--ink);justify-content:space-between;font-size:.72rem;display:flex}@supports (color:color-mix(in lab,red,red)){.studio-solfege-volume-scale{color:color-mix(in srgb,var(--ink) 48%,transparent)}}.studio-settings-toggle{align-items:center;gap:.5rem;display:flex}.studio-settings-toggle+.studio-settings-toggle{margin-top:.45rem}.studio-settings-section .studio-mode+.studio-settings-toggle,.studio-settings-section .studio-tempo-hint+.studio-settings-toggle{margin-top:.95rem}.studio-settings-details{border-top:1px solid var(--line);gap:.55rem;margin-top:.95rem;padding-top:.85rem;display:grid}@supports (color:color-mix(in lab,red,red)){.studio-settings-details{border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent)}}.studio-settings-details .studio-tempo-hint{margin-top:0}.studio-settings-details .studio-tempo-hint+.studio-mode{margin-top:.4rem}.studio-keys-menu-eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 .55rem;font-size:.72rem;font-weight:800}.studio-keys-menu-styles{gap:.35rem;display:grid}.studio-keys-style-option{text-align:left;background:var(--card);border:1px solid #0000;border-radius:14px;gap:.12rem;margin:0;padding:.55rem .65rem;display:grid}@supports (color:color-mix(in lab,red,red)){.studio-keys-style-option{background:color-mix(in srgb,var(--card) 88%,#efe6d6)}}.studio-keys-style-option{color:var(--ink);font:inherit;cursor:pointer;touch-action:manipulation}.studio-keys-style-option:hover{border-color:var(--line)}@supports (color:color-mix(in lab,red,red)){.studio-keys-style-option:hover{border-color:color-mix(in srgb,var(--line) 80%,transparent)}}.studio-keys-style-option.is-selected{border-color:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.studio-keys-style-option.is-selected{border-color:color-mix(in srgb,var(--note-g) 60%,var(--line))}}.studio-keys-style-option.is-selected{background:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.studio-keys-style-option.is-selected{background:color-mix(in srgb,var(--note-g) 14%,var(--card))}}.studio-keys-style-label{font-size:.92rem;font-weight:750}.studio-keys-style-hint{color:var(--ink-soft);font-size:.75rem;line-height:1.3}.studio-keys-visibility-toggle{border-top:1px solid var(--line);margin-top:.75rem;padding-top:.65rem}@supports (color:color-mix(in lab,red,red)){.studio-keys-visibility-toggle{border-top:1px solid color-mix(in srgb,var(--line) 75%,transparent)}}.studio-key{position:relative}.studio-key-menu{z-index:30;border:1px solid var(--line);background:radial-gradient(160px 100px at 12% 0,#f0c93a29,transparent 70%),var(--card);width:min(15rem,100vw - 1.5rem);max-height:min(24rem,100vh - 8rem);box-shadow:var(--shadow);border-radius:18px;gap:.3rem;padding:.85rem .9rem .95rem;display:grid;position:absolute;top:calc(100% + .45rem);right:0;overflow-y:auto}.studio-key-option{text-align:left;background:var(--card);border:1px solid #0000;border-radius:12px;justify-content:space-between;align-items:baseline;gap:.6rem;margin:0;padding:.45rem .65rem;display:flex}@supports (color:color-mix(in lab,red,red)){.studio-key-option{background:color-mix(in srgb,var(--card) 88%,#efe6d6)}}.studio-key-option{color:var(--ink);font:inherit;cursor:pointer;touch-action:manipulation}.studio-key-option:hover:not(:disabled){border-color:var(--line)}@supports (color:color-mix(in lab,red,red)){.studio-key-option:hover:not(:disabled){border-color:color-mix(in srgb,var(--line) 80%,transparent)}}.studio-key-option.is-selected{border-color:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.studio-key-option.is-selected{border-color:color-mix(in srgb,var(--note-g) 60%,var(--line))}}.studio-key-option.is-selected{background:var(--note-g)}@supports (color:color-mix(in lab,red,red)){.studio-key-option.is-selected{background:color-mix(in srgb,var(--note-g) 14%,var(--card))}}.studio-key-option:disabled{opacity:.45;cursor:not-allowed}.studio-key-option-label{font-size:.95rem;font-weight:750}.studio-key-option-hint{color:var(--ink-soft);font-size:.72rem}.studio-touch-piano{z-index:3;padding:.35rem .3rem max(.4rem,env(safe-area-inset-bottom,0px));pointer-events:auto;background:#f3ede3;flex-shrink:0;position:relative}.studio-touch-piano .piano{pointer-events:auto;background:var(--card);border-radius:16px 16px 0 0;padding:.5rem .4rem .35rem}@supports (color:color-mix(in lab,red,red)){.studio-touch-piano .piano{background:color-mix(in srgb,var(--card) 92%,#d4b896)}}.studio-touch-piano .piano{box-shadow:0 -10px 28px #3b246024}.studio-touch-piano .piano-keys{height:clamp(78px,min(11.25vh,16.5vw),117px)}.studio-touch-piano .piano-key-white{border-radius:0 0 14px 14px;padding-bottom:.55rem}.studio-touch-piano .piano-key-black{border-radius:0 0 8px 8px}.studio-touch-piano{--key-label-size:clamp(.72rem,2.6vw,.95rem)}@media (max-width:1024px) and (orientation:landscape){.studio-touch-piano{padding:.2rem .25rem max(.25rem,env(safe-area-inset-bottom,0px))}.studio-touch-piano .piano{border-radius:12px 12px 0 0;padding:.28rem .3rem .2rem}.studio-touch-piano .piano-keys{height:clamp(72px,min(12vh,15vw),108px)}.studio-touch-piano{--key-label-size:clamp(.58rem,1.8vw,.78rem)}.studio-page.is-practice-immersive .studio-touch-piano .piano-keys{height:clamp(108px,min(18vh,22.5vw),162px)}}.studio-practice-close{top:max(.55rem,env(safe-area-inset-top,0px));right:max(.55rem,env(safe-area-inset-right,0px));z-index:120;border:1px solid var(--line);background:var(--card);border-radius:999px;width:2.75rem;height:2.75rem;position:fixed}@supports (color:color-mix(in lab,red,red)){.studio-practice-close{background:color-mix(in srgb,var(--card) 94%,transparent)}}.studio-practice-close{color:var(--ink);cursor:pointer;pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent;place-items:center;font-size:1.65rem;font-weight:500;line-height:1;display:grid;box-shadow:0 4px 14px #3b246029}.studio-practice-close:active{transform:scale(.96)}.studio-page.is-practice-immersive{z-index:80;background:#faf6ee;gap:0;height:100dvh;padding:0;position:fixed;inset:0}.studio-page.is-practice-immersive .metro-float,.studio-page.is-practice-immersive .studio-error,.studio-page.is-practice-immersive .studio-status,.studio-page.is-practice-immersive .studio-toolbar{display:none}.studio-page.is-practice-immersive .studio-stage{flex:1;min-height:0}.studio-page.is-practice-immersive .studio-canvas-wrap{box-shadow:none;border:none;border-radius:0}.studio-page.is-practice-immersive .studio-touch-piano{border-top:1px solid var(--line)}@supports (color:color-mix(in lab,red,red)){.studio-page.is-practice-immersive .studio-touch-piano{border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent)}}.studio-page.is-practice-immersive .studio-touch-piano .piano-keys{height:clamp(117px,min(16.875vh,24.75vw),176px)}.studio-page.is-practice-immersive .studio-touch-piano{--key-label-size:clamp(.85rem,3vw,1.1rem)}@media (pointer:coarse){.studio-page.is-practice-immersive .studio-touch-piano .piano-keys,.studio-touch-piano .piano-keys{height:clamp(140px,28dvh,210px)}}@media (max-width:1024px) and (orientation:landscape) and (pointer:coarse){.studio-page.is-practice-immersive .studio-touch-piano .piano-keys,.studio-touch-piano .piano-keys{height:clamp(78px,26dvh,118px)}}body:has(.studio-page.is-practice-immersive) .site-footer,body:has(.studio-page.is-practice-immersive) .site-header{display:none}body:has(.studio-page.is-practice-immersive) .page-shell{width:100%;max-width:none;margin:0;padding:0}.studio-canvas-wrap>.studio-canvas{z-index:0;vertical-align:top;width:100%;max-width:none;max-height:none;display:block;position:absolute;inset:0;height:100%!important}.studio-start-overlay{z-index:4;pointer-events:none;background:#1118278c;flex-direction:column;justify-content:center;align-items:center;padding:1.5rem;display:flex;position:absolute;inset:0}.studio-tempo-coach{z-index:5;text-align:center;pointer-events:none;color:#f8fafc;background:#111827b8;place-items:center;padding:1.5rem;animation:studio-tempo-coach-in 1.35s ease-out both;display:grid;position:absolute;inset:0}.studio-tempo-coach-eyebrow{letter-spacing:.08em;text-transform:uppercase;opacity:.72;margin:0;font-size:.85rem;animation:studio-tempo-coach-eyebrow-in .9s ease-out .28s both}.studio-tempo-coach h2{margin:.35rem 0 0;font-size:clamp(1.6rem,4vw,2.4rem);font-weight:800;line-height:1.2;animation:studio-tempo-coach-copy-in .95s ease-out .4s both}.studio-piece-finish{pointer-events:auto;gap:.35rem;animation:studio-piece-finish-in 1.05s ease-out both}.studio-piece-finish-body,.studio-piece-finish-count{opacity:.92;margin:.55rem 0 0;font-size:clamp(1rem,2.4vw,1.2rem);font-weight:650;line-height:1.35}.studio-piece-finish .studio-start-btn{margin-top:0;animation:studio-piece-finish-btn-in .7s ease-out .45s both}.studio-piece-finish-actions{flex-direction:column;align-items:center;gap:.75rem;margin-top:1.25rem;animation:studio-piece-finish-btn-in .7s ease-out .45s both;display:flex}.studio-piece-finish-elsewhere{appearance:none;color:#fff8f0e0;font:inherit;text-underline-offset:.18em;cursor:pointer;background:0 0;border:0;padding:.35rem .5rem;font-size:clamp(.95rem,2.2vw,1.05rem);font-weight:700;text-decoration:underline}.studio-piece-finish-elsewhere:hover{color:#fff}@keyframes studio-tempo-coach-in{0%{opacity:0;background:#11182700}to{opacity:1;background:#111827b8}}@keyframes studio-tempo-coach-copy-in{0%{opacity:0;transform:translateY(.35rem)}to{opacity:1;transform:translateY(0)}}@keyframes studio-tempo-coach-eyebrow-in{0%{opacity:0;transform:translateY(.35rem)}to{opacity:.72;transform:translateY(0)}}@keyframes studio-piece-finish-in{0%{opacity:0;background:#11182700}to{opacity:1;background:#111827b8}}@keyframes studio-piece-finish-btn-in{0%{opacity:0;transform:translateY(.4rem)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.studio-piece-finish,.studio-piece-finish .studio-start-btn,.studio-piece-finish-actions,.studio-play-along-cue,.studio-tempo-coach,.studio-tempo-coach h2,.studio-tempo-coach-eyebrow{animation:none}}.studio-start-btn{pointer-events:auto;appearance:none;min-width:min(280px,72vw);font:inherit;letter-spacing:.02em;color:#fff;cursor:pointer;background:linear-gradient(#34d399,#10b981 48%,#059669);border:0;border-radius:999px;padding:1.15rem 2.75rem;font-size:clamp(1.45rem,3.2vw,2rem);font-weight:800;transition:transform .15s,box-shadow .15s,filter .15s;box-shadow:inset 0 0 0 1px #ffffff2e,0 10px 28px #05966973,0 2px 6px #00000059}.studio-start-btn:hover:not(:disabled){filter:brightness(1.05);transform:translateY(-2px)scale(1.03);box-shadow:inset 0 0 0 1px #ffffff38,0 14px 34px #0596698c,0 3px 8px #00000059}.studio-start-btn:active:not(:disabled){transform:translateY(0)scale(.99)}.studio-start-btn:disabled{opacity:.55;cursor:not-allowed;filter:grayscale(.25)}.studio-hear-btn{font:inherit;background:#fff;padding:.8rem 1.6rem;font-size:clamp(1.05rem,2.2vw,1.3rem);font-weight:700;box-shadow:inset 0 0 0 1px #fff6,0 8px 22px #00000047}.studio-hear-btn,.studio-play-btn{pointer-events:auto;appearance:none;min-width:min(280px,72vw);letter-spacing:.01em;color:#0f172a;cursor:pointer;border:0;border-radius:999px;justify-content:center;align-items:center;gap:.45rem;margin-top:.85rem;display:inline-flex}.studio-play-btn{font:inherit;background:linear-gradient(#fef08a,#fde047 45%,#facc15);padding:.95rem 1.75rem;font-size:clamp(1.2rem,2.6vw,1.55rem);font-weight:800;transition:transform .15s,filter .15s,box-shadow .15s;box-shadow:inset 0 0 0 1px #ffffff59,0 10px 26px #ca8a0466,0 2px 6px #00000047}.studio-play-btn:hover:not(:disabled){filter:brightness(1.04);transform:translateY(-2px)scale(1.02)}.studio-play-btn:disabled{opacity:.55;cursor:not-allowed;filter:grayscale(.2)}.studio-play-btn-compact{gap:.35rem;min-width:0;margin-top:0;padding:.55rem 1.15rem;font-size:.95rem;box-shadow:inset 0 0 0 1px #ffffff59,0 6px 16px #ca8a0459,0 1px 4px #00000038}.studio-play-btn-compact svg{width:16px;height:16px}.studio-kid-play-dock{z-index:5;pointer-events:none;position:absolute;top:.65rem;right:.65rem}.studio-page.is-practice-immersive .studio-kid-play-dock{top:max(3.35rem,calc(env(safe-area-inset-top,0px) + 3.1rem));right:max(.65rem,env(safe-area-inset-right,0px))}.studio-kid-play-btn,.studio-kid-stop-btn{pointer-events:auto;appearance:none;min-height:2.85rem;font:inherit;letter-spacing:.01em;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border:0;border-radius:999px;justify-content:center;align-items:center;gap:.4rem;padding:.7rem 1.25rem;font-size:clamp(1.05rem,2.4vw,1.25rem);font-weight:800;transition:transform .12s,filter .12s;display:inline-flex;box-shadow:inset 0 0 0 1px #ffffff59,0 8px 20px #00000038}.studio-kid-play-btn{color:#0f172a;background:linear-gradient(#fef08a,#fde047 45%,#facc15)}.studio-kid-stop-btn{color:#fff;background:linear-gradient(#fb7185,#f43f5e 48%,#e11d48)}.studio-kid-play-btn:hover,.studio-kid-stop-btn:hover{filter:brightness(1.04);transform:translateY(-1px)scale(1.03)}.studio-kid-play-btn:active,.studio-kid-stop-btn:active{transform:scale(.97)}.studio-kid-play-btn svg{width:1.15rem;height:1.15rem}.studio-play-along-cue h2{font-size:clamp(1.85rem,5vw,2.85rem)}.studio-play-along-thanks{pointer-events:auto}.studio-play-along-thanks .studio-start-btn{min-width:min(220px,62vw);margin-top:1.15rem;padding:.85rem 1.75rem;font-size:clamp(1.15rem,2.6vw,1.45rem)}.studio-hear-btn:hover:not(:disabled){transform:translateY(-1px)}.studio-hear-btn:disabled{opacity:.55;cursor:not-allowed}.studio-confirm-backdrop{z-index:80;background:#11182773;justify-content:center;align-items:center;padding:1.25rem;display:flex;position:fixed;inset:0}.studio-confirm{background:var(--card);border:1px solid var(--line);width:min(100%,26rem);box-shadow:var(--shadow);border-radius:18px;padding:1.35rem 1.4rem 1.2rem}.studio-confirm h2{font-family:var(--font-fraunces),"Fraunces",Georgia,serif;color:var(--ink);margin:0;font-size:1.35rem;font-weight:700}.studio-confirm p{color:var(--ink-soft);margin:.65rem 0 0;line-height:1.45}.studio-confirm-actions{justify-content:flex-end;gap:.65rem;margin-top:1.15rem;display:flex}body:has(.studio-page){height:100dvh;overflow:hidden}body:has(.studio-page) .site-footer{display:none}body:has(.studio-page) main{flex-direction:column;min-height:0;display:flex;overflow:hidden}.page-shell:has(.studio-page){flex-direction:column;flex:1;width:min(100% - 1rem,1800px);min-height:0;margin:0 auto;padding:.3rem .45rem .45rem;display:flex}body:has(.studio-page) .site-header-inner{width:min(100% - 1rem,1800px)}.studio-zoom-hint{border:1px solid #b45309;border-radius:10px;flex-wrap:wrap;flex-shrink:0;align-items:center;gap:.55rem .85rem;margin:0 0 .35rem;padding:.45rem .7rem;display:flex}@supports (color:color-mix(in lab,red,red)){.studio-zoom-hint{border:1px solid color-mix(in srgb,#b45309 35%,var(--line))}}.studio-zoom-hint{background:#f59e0b}@supports (color:color-mix(in lab,red,red)){.studio-zoom-hint{background:color-mix(in srgb,#f59e0b 14%,var(--card))}}.studio-zoom-hint{color:var(--ink);font-size:.88rem;line-height:1.35}.studio-zoom-hint kbd{border:1px solid var(--line);background:#fff;border-radius:6px;padding:.05rem .35rem;font-family:ui-sans-serif,-apple-system,SF Pro Text,Helvetica Neue,Segoe UI Symbol,Arial Unicode MS,sans-serif;font-size:.82rem;font-weight:800;display:inline-block}.studio-zoom-hint-dismiss{border:1px solid var(--line);color:var(--ink);font:inherit;cursor:pointer;background:#fff;border-radius:999px;margin-left:auto;padding:.25rem .7rem;font-size:.78rem;font-weight:800}@media (max-width:900px){.page-shell:has(.studio-page){width:100%;max-width:none;margin:0;padding:.35rem 0 0}.studio-page .studio-error,.studio-page .studio-status,.studio-page .studio-toolbar{padding-left:.75rem;padding-right:.75rem}.studio-canvas-wrap{box-shadow:none;border-left:none;border-right:none;border-radius:0}.hero,.play-grid,.score-stage-head,.song-grid,.steps{grid-template-columns:1fr}.site-header-inner{gap:.7rem}.site-header nav{margin-left:auto}.site-header nav a{padding:.35rem .55rem;font-size:.85rem}.brand em{display:none}.hero{padding:1rem 0 1.5rem}.hero-copy{text-align:center;justify-self:center;max-width:34rem}.hero-actions{justify-content:center}.hero-copy .lede{margin-left:auto;margin-right:auto}.hero-art{justify-self:center;width:min(100%,34rem);max-height:24rem}.play-page .piano-keys{height:150px}.piano{--key-label-size:.58rem}}@media (max-height:760px){.hero-art{max-height:22rem}}@media (max-width:640px){:root{--header-h:7.85rem}.site-header-inner{flex-wrap:wrap}.site-header nav{order:3;width:100%;margin-left:0}.header-tools{margin-left:auto}.student-cards li{flex-direction:column;align-items:stretch}.student-card-actions{justify-content:stretch}.student-card-actions .btn{text-align:center;width:100%}}.dev-panel-toggle{z-index:9000;color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:.45;background:#1e1e28d9;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:18px;transition:opacity .15s;display:flex;position:fixed;bottom:12px;right:12px}.dev-panel-toggle:hover{opacity:1}.dev-panel{z-index:9001;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#ddd;background:#14141cf5;border-left:1px solid #ffffff14;flex-direction:column;width:min(340px,90vw);font-size:13px;display:flex;position:fixed;top:0;bottom:0;right:0;overflow:hidden;box-shadow:-4px 0 24px #00000080}.dev-panel-header{border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:flex-start;gap:8px;padding:10px 14px;display:flex}.dev-panel-subtitle{color:#888;margin:2px 0 0;font-size:11px;font-weight:400}.dev-panel-header button{color:#aaa;cursor:pointer;background:0 0;border:none;font-size:18px}.dev-panel-body{flex:1;padding:10px 14px 20px;overflow-y:auto}.dev-panel-body h4{text-transform:uppercase;letter-spacing:.08em;color:#888;margin:14px 0 6px;font-size:11px}.dev-panel-body h4:first-child{margin-top:4px}.dev-field{flex-direction:column;gap:3px;margin-bottom:8px;display:flex}.dev-field span{font-size:12px}.dev-field code{color:#7af;margin-left:4px;font-size:11px}.dev-field input[type=range],.dev-field select{width:100%}.dev-field select{color:#eee;background:#ffffff14;border:1px solid #ffffff26;border-radius:4px;padding:4px 6px;font-size:12px}.dev-toggle{margin-bottom:6px}.dev-panel-footer{border-top:1px solid #ffffff1a;flex-direction:column;gap:8px;padding:10px 14px;display:flex}.dev-panel-hint{color:#999;margin:0;font-size:11px;line-height:1.4}.nf-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:10px;display:flex;position:relative}.nf-toggle input{opacity:0;width:0;height:0;position:absolute}.nf-toggle-track{background:#ffffff14;border:1px solid #fff3;border-radius:999px;flex-shrink:0;width:34px;height:18px;transition:background .15s,border-color .15s;position:relative}.nf-toggle-track:after{content:"";background:#888;border-radius:50%;width:12px;height:12px;transition:transform .15s,background .15s;position:absolute;top:2px;left:2px}.nf-toggle input:checked+.nf-toggle-track{background:#77aaff47;border-color:#7af}.nf-toggle input:checked+.nf-toggle-track:after{background:#7af;transform:translate(16px)}.nf-toggle-label{color:#ddd;font-size:12px}.dev-reset-btn{color:#aaa;cursor:pointer;background:0 0;border:1px solid #fff3;border-radius:6px;padding:4px 10px;font-size:12px}.ordered-align-debug{border:1px solid color-mix(in oklab,CanvasText 18%,transparent);background:color-mix(in oklab,Canvas 92%,CanvasText 8%);max-width:52rem;margin:.75rem 0;padding:.75rem 1rem;font-size:.85rem}.ordered-align-debug h3{margin:0 0 .4rem;font-size:.95rem}.ordered-align-debug pre{white-space:pre-wrap;background:color-mix(in oklab,Canvas 85%,CanvasText 15%);margin:0 0 .75rem;padding:.5rem .65rem;font-size:.78rem}.ordered-align-debug dl{grid-template-columns:11rem 1fr;gap:.25rem .75rem;margin:0;display:grid}.ordered-align-debug dt{opacity:.8;font-weight:600}.ordered-align-debug dd{margin:0}.direct-chain-controls{flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem;margin:.5rem 0 .25rem;font-size:.85rem;display:flex}.direct-chain-controls select{margin-left:.35rem}.rdp-raw-region{fill:#008cc81f;stroke:#0088c8;stroke-width:2.5px;stroke-dasharray:6 3}.rdp-raw-methodc-candidate{fill:#c88c0014;stroke:#c88800;stroke-width:1.5px}.rdp-raw-methodc-rank1{fill:#00a05024;stroke:#00a050;stroke-width:3px}.rdp-raw-resolver{fill:none;stroke:#c80070;stroke-width:2.5px;stroke-dasharray:4 3}.rdp-raw-manual{fill:none;stroke:#444;stroke-width:2px;stroke-dasharray:2 2}.rdp-raw-label{fill:#1a1a1a;paint-order:stroke;stroke:#ffffffd9;stroke-width:3px;font-size:9px}.rdp-raw-inspector code{word-break:break-all}.assoc-paint-model-primary{fill:#0096462e;stroke:#009646;stroke-width:3px}.assoc-paint-model-candidate{fill:#c88c000f;stroke:#c88800;stroke-width:1.25px;stroke-dasharray:3 2}.assoc-paint-corrected{fill:#2850b429;stroke:#2850b4;stroke-width:3px}.assoc-paint-compare-auto{fill:none;stroke:#009646;stroke-width:2.5px}.assoc-paint-compare-manual{fill:none;stroke:#2850b4;stroke-width:2.5px;stroke-dasharray:5 3}.assoc-paint-label,.assoc-paint-msg{fill:#1a1a1a;font-size:9px}.assoc-paint-inspector{min-height:12rem}.corr-source-hit-msg,.library-hint.corr-source-hit-msg{min-height:2.5rem}.recognition-side-by-side{align-items:flex-start}.element-layers{margin:.35rem 0 .65rem}.element-layers-toggle{align-items:center;gap:.4rem;padding:.28rem .7rem;font-size:.85rem;display:inline-flex}.element-layers-chevron{opacity:.7;font-size:.7rem}.element-layers-panel{background:#f8fafcf2;border:1px solid #0f172a1f;border-radius:8px;flex-direction:column;gap:.55rem;margin-top:.45rem;padding:.55rem .7rem .65rem;display:flex}.element-layers-group{flex-wrap:wrap;align-items:center;gap:.35rem .85rem;display:flex}.element-layers-coming-soon{border-top:1px dashed #0f172a1f;padding-top:.35rem}.element-layers-coming-label{letter-spacing:.03em;text-transform:uppercase;color:#475569bf;flex:0 0 100%;margin-bottom:.1rem;font-size:.72rem;font-weight:600}.element-layers-item{color:#1e293b;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.35rem;font-size:.82rem;display:inline-flex}.element-layers-item input{margin:0}.element-layers-item.is-placeholder{color:#64748b8c;cursor:not-allowed}.element-layers-item.is-placeholder input{opacity:.45}.recognition-pane .mei-notation-preview-stack{contain:layout}.assoc-identity-mismatch{color:#a11f1f;font-weight:600}.assoc-identity-match{color:#1f7a3a;font-weight:600}.sbe-layer{pointer-events:auto}.sbe-rect{fill:#0000;stroke-width:2.2px;vector-effect:non-scaling-stroke;cursor:pointer;opacity:.92}.sbe-rect.sbe-dim{opacity:.18}.sbe-rect.sbe-beam-group{fill:#0e74901f;stroke:#0e7490;stroke-dasharray:6 3}.sbe-rect.sbe-beam-segment{fill:#0891b22e;stroke:#0891b2;stroke-width:2.8px}.sbe-rect.sbe-stem{fill:#b4530933;stroke:#b45309;stroke-width:1.8px}.sbe-rect.sbe-notehead-cv{fill:#65a30d26;stroke:#65a30d}.sbe-rect.sbe-notehead-homr{fill:#be185d24;stroke:#be185d}.sbe-rect.sbe-active{opacity:1;stroke-width:3.2px;filter:none}.sbe-panel{border:1px solid var(--line);background:#f8fafc;border-radius:10px;max-width:42rem;margin-bottom:.75rem;padding:.75rem 1rem}.sbe-panel h3{margin:0 0 .35rem;font-size:.95rem}.sbe-panel h4{margin:.75rem 0 .35rem;font-size:.85rem}.sbe-toggle{align-items:center;gap:.4rem;margin:.4rem 0;font-size:.9rem;display:flex}.sbe-filter{border:1px solid var(--line);border-radius:6px;width:100%;margin:.35rem 0;padding:.3rem .45rem;font-size:.85rem}.sbe-group-list{max-height:10rem;margin:.25rem 0 0;padding:0;list-style:none;overflow:auto}.sbe-group-btn{text-align:left;cursor:pointer;background:0 0;border:0;border-radius:6px;flex-direction:column;align-items:flex-start;gap:.1rem;width:100%;padding:.3rem .35rem;font-size:.8rem;display:flex}.sbe-group-btn-active,.sbe-group-btn:hover{background:#0e74901f}.sbe-inspect{border-top:1px solid var(--line);margin-top:.5rem;padding-top:.5rem;font-size:.82rem}.sbe-trace-list{margin:.25rem 0;padding-left:1rem}.sbe-muted{color:#64748b;font-size:.78rem}.sbe-linkish{cursor:pointer;color:#0e7490;font-size:inherit;background:0 0;border:0;padding:0;text-decoration:underline}.sbe-badge{border-radius:4px;margin:.25rem 0;padding:.15rem .45rem;font-size:.78rem;font-weight:600;display:inline-block}.sbe-badge-none{color:#92400e;background:#fef3c7}.sbe-pred-link{color:#9f1239;font-size:.78rem}.sbe-pred-none{color:#64748b;font-size:.78rem;font-style:italic}.bd-panel{border:1px solid var(--line);background:#f1f5f9;border-radius:10px;max-width:42rem;margin-bottom:.75rem;padding:.75rem 1rem}.bd-panel h3{margin:0 0 .35rem;font-size:.95rem}.bd-coverage{margin:.4rem 0;font-size:.85rem}.bd-cov-row{flex-wrap:wrap;gap:.45rem;margin:.35rem 0;font-size:.78rem;display:flex}.bd-status-ok{color:#166534;font-weight:600}.bd-status-inferred{color:#a16207;font-weight:600}.bd-status-amb{color:#c2410c;font-weight:600}.bd-status-none{color:#64748b;font-weight:600}.bd-status-conflict{color:#be123c;font-weight:700}.bd-chain{color:#475569;word-break:break-all;font-size:.72rem}.helper-page{flex-direction:column;gap:.85rem;display:flex}.helper-page:has(.studio-page){flex:1;gap:.45rem;min-height:0}.helper-page:has(.studio-page)>.helper-bar{flex-shrink:0}.helper-page:has(.studio-page)>.helper-away-backdrop,.helper-page:has(.studio-page)>.helper-bridge,.helper-page:has(.studio-page)>.studio-page{flex:1;min-height:0}.helper-bar{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem 1.2rem;padding:.9rem 1.1rem;display:flex}.helper-bar h1{margin:.1rem 0 0;font-size:1.45rem}.helper-bar p{margin:.2rem 0 0}.helper-bar>div:first-child{flex:18rem;min-width:0}.helper-bar-choose{align-items:flex-start}.helper-bar-choose .helper-length-row{justify-content:flex-start;margin-top:.9rem}.helper-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.5rem;display:flex}.helper-clock{font-variant-numeric:tabular-nums;min-width:3.2rem;margin:0;font-size:1.25rem;font-weight:800}.helper-starting{margin:1.5rem 0;font-weight:800}.helper-bridge{text-align:center;place-items:center;min-height:42vh;padding:2rem 1rem;display:grid}.helper-bridge-with-progress{text-align:left;grid-template-columns:minmax(0,1fr) minmax(11.5rem,15rem);place-items:stretch stretch;gap:1.25rem 1.75rem;width:min(100%,58rem);margin-inline:auto}.helper-bridge-main{text-align:center;align-content:center;justify-items:center;min-width:0;display:grid}.helper-bridge h1{margin:.3rem 0 0;font-size:clamp(1.8rem,4vw,2.6rem)}.helper-progress{background:var(--card);align-self:center;padding:1rem 1.05rem 1.1rem}@supports (color:color-mix(in lab,red,red)){.helper-progress{background:color-mix(in srgb,var(--card) 92%,#fff)}}.helper-progress{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.helper-progress-percent{letter-spacing:.01em;margin:0;font-size:.95rem;font-weight:800}.helper-progress-bar{background:var(--line);border-radius:999px;height:.55rem;margin-top:.55rem}@supports (color:color-mix(in lab,red,red)){.helper-progress-bar{background:color-mix(in srgb,var(--line) 70%,transparent)}}.helper-progress-bar{overflow:hidden}.helper-progress-bar>span{border-radius:inherit;background:#c98412;height:100%;transition:width .35s;display:block}.helper-progress-pieces{gap:.55rem;margin:.85rem 0 0;padding:0;list-style:none;display:grid}.helper-progress-pieces li{gap:.25rem;min-width:0;display:grid}.helper-progress-pieces li.is-active .helper-progress-title{color:#a56b08}.helper-progress-title{text-overflow:ellipsis;white-space:nowrap;font-size:.82rem;font-weight:700;line-height:1.2;overflow:hidden}.helper-progress-marks{flex-wrap:wrap;gap:.28rem;display:flex}.helper-progress-mark{box-sizing:border-box;background:0 0;border:2px solid #c39d5e;border-radius:50%;width:.72rem;height:.72rem}.helper-progress-mark.is-filled{background:#c98412;border-color:#c98412}@media (max-width:720px){.helper-bridge-with-progress{text-align:center;grid-template-columns:1fr}.helper-progress{text-align:left;max-width:18rem;margin-inline:auto}}.helper-choose,.helper-reward{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:52vh;padding:1.5rem 1rem 2.5rem;display:flex}.helper-choose{justify-content:flex-start;min-height:0;padding:.35rem 1rem 1.5rem}.helper-choose-tracker-first{padding-top:0;padding-bottom:.15rem}.helper-choose-tracker-first .helper-streak{width:min(100%,36rem)}.helper-reward h1{margin:.35rem 0 0;font-size:clamp(2rem,5vw,3rem)}.helper-reward p{margin:.45rem 0 0;font-size:1.2rem}.helper-length-row,.helper-reward-actions{flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:1.35rem;display:flex}.helper-streak{background:var(--card);border-radius:var(--radius);width:min(100%,28rem);box-shadow:var(--shadow);margin-bottom:.4rem;padding:1rem 1.4rem 1.15rem}.helper-streak-count{color:#c98412;margin:.2rem 0 0;font-size:2.8rem;font-weight:800;line-height:1}.helper-tracker-streak-label{color:#a56b08;margin:.15rem 0 .55rem;font-weight:700}.helper-tracker-times{grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;margin:1rem 0 0;padding:0;display:grid}.helper-tracker-times>div{text-align:center;background:var(--card);margin:0;padding:.55rem .4rem .6rem}@supports (color:color-mix(in lab,red,red)){.helper-tracker-times>div{background:color-mix(in srgb,var(--card) 70%,#f7e7b8)}}.helper-tracker-times>div{border-radius:calc(var(--radius) - 2px)}.helper-tracker-times dt{letter-spacing:.02em;text-transform:uppercase;color:#8a6a2a;margin:0;font-size:.78rem;font-weight:700}.helper-tracker-times dd{color:#7a4e0a;margin:.2rem 0 0;font-size:1.15rem;font-weight:800}.helper-tracker-times-reward{width:min(100%,22rem);margin-left:auto;margin-right:auto}.helper-streak-pill{color:#a56b08;margin:0;font-weight:800}.helper-tracker-pill{color:#7a4e0a}.practice-tracker-home{width:min(100%,36rem);margin:0 auto 1rem}.practice-tracker-home .helper-streak{width:100%}.practice-tracker-btn-wrap{flex-direction:column;align-items:stretch;gap:.45rem;display:inline-flex;position:relative}.practice-tracker-btn{color:#7a4e0a;border-color:#c98412;align-items:baseline;gap:.4rem;font-weight:800;display:inline-flex}@supports (color:color-mix(in lab,red,red)){.practice-tracker-btn{border-color:color-mix(in srgb,#c98412 35%,var(--line))}}.practice-tracker-btn{background:var(--card)}@supports (color:color-mix(in lab,red,red)){.practice-tracker-btn{background:color-mix(in srgb,var(--card) 70%,#f7e7b8)}}.practice-tracker-btn-count{color:#c98412;font-size:1.35rem;line-height:1}.practice-tracker-btn-label{font-size:.92rem;font-weight:700}.practice-tracker-btn-wrap.is-open .practice-tracker-btn{box-shadow:inset 0 0 0 1px #c9841273}.practice-tracker-panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);width:min(100vw - 2rem,22rem);box-shadow:var(--shadow);z-index:2;padding:.75rem .85rem .9rem}.practice-tracker-panel-status{margin:0 0 .55rem;font-size:.95rem}.practice-tracker-panel .helper-tracker-times{margin-top:0}.helper-star{filter:drop-shadow(0 12px 18px #e09a1659);width:min(220px,54vw);height:auto;margin-bottom:.4rem;animation:helper-star-pop .7s both}@keyframes helper-star-pop{0%{opacity:0;transform:scale(.2)rotate(-18deg)}70%{opacity:1;transform:scale(1.08)rotate(6deg)}to{opacity:1;transform:scale(1)rotate(0)}}@media (prefers-reduced-motion:reduce){.helper-star{animation:none}}.helper-away-backdrop{z-index:90;background:#3b246075;justify-content:center;align-items:center;padding:1.25rem;display:flex;position:fixed;inset:0}.helper-away{text-align:center;background:var(--card);border-radius:var(--radius);width:min(100%,24rem);box-shadow:var(--shadow);padding:2rem 1.6rem 1.7rem}.helper-away h2{margin:0 0 1.2rem;font-size:clamp(1.8rem,4vw,2.4rem)}.align-rainbow-panel{border:1px solid var(--line);background:var(--paper);border-radius:10px;flex-direction:column;gap:.4rem;margin:.4rem 0 .75rem;padding:.55rem .7rem;display:flex}@supports (color:color-mix(in lab,red,red)){.align-rainbow-panel{background:color-mix(in srgb,var(--paper) 88%,white)}}.align-rainbow-panel-row{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.align-rainbow-actions{flex-wrap:wrap;gap:.4rem;display:flex}.align-rainbow-anomalies{margin:0;padding-left:1.1rem;font-size:.85rem}.align-rainbow-anomalies .is-warn{color:#b45309}.align-rainbow-link-list{max-height:12rem;margin:.25rem 0 0;padding-left:0;list-style:none;overflow:auto}.align-rainbow-link-btn{text-align:left;width:100%;font:inherit;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:6px;padding:.2rem .35rem;display:block}.align-rainbow-link-btn.is-pinned{border-color:var(--ink);background:var(--paper-2)}@supports (color:color-mix(in lab,red,red)){.align-rainbow-link-btn.is-pinned{background:color-mix(in srgb,var(--paper-2) 70%,white)}}.corr-source-overlay .align-rainbow-rect{pointer-events:stroke}.corr-source-overlay .align-rainbow-rect.is-active{stroke-width:2.4px}.corr-interactive g.align-rainbow-blue .notehead,.corr-interactive g.align-rainbow-blue .rest,.corr-interactive g.align-rainbow-green .notehead,.corr-interactive g.align-rainbow-green .rest,.corr-interactive g.align-rainbow-orange .notehead,.corr-interactive g.align-rainbow-orange .rest,.corr-interactive g.align-rainbow-pink .notehead,.corr-interactive g.align-rainbow-pink .rest,.corr-interactive g.align-rainbow-red .notehead,.corr-interactive g.align-rainbow-red .rest,.corr-interactive g.align-rainbow-violet .notehead,.corr-interactive g.align-rainbow-violet .rest,.corr-interactive g.align-rainbow-yellow .notehead,.corr-interactive g.align-rainbow-yellow .rest{fill:#111!important}.align-rainbow-gt-circle,.align-rainbow-gt-layer,.align-rainbow-marker{pointer-events:none}.align-rainbow-gt-circle.is-active,.align-rainbow-marker.is-active{stroke-width:2.2px}.align-rainbow-gt-circle.is-subdued,.align-rainbow-marker.is-subdued{opacity:.55}.lsvl-page{flex-direction:column;gap:1rem;max-width:52rem;margin:0 auto;padding:1.25rem 1rem 3rem;display:flex}.lsvl-header h1{font-family:var(--font-fraunces),Georgia,serif;margin:0 0 .35rem;font-size:clamp(1.6rem,3vw,2.1rem)}.lsvl-sub{color:var(--ink-soft);max-width:40rem;margin:0;line-height:1.45}.lsvl-card{background:var(--card)}@supports (color:color-mix(in lab,red,red)){.lsvl-card{background:color-mix(in srgb,var(--card) 92%,white)}}.lsvl-card{border:1px solid var(--line);border-radius:16px;padding:1rem 1.1rem 1.15rem}.lsvl-card h2{margin:0 0 .65rem;font-size:1.05rem}.lsvl-hint{color:var(--ink-soft);margin:.5rem 0 0;font-size:.9rem;line-height:1.4}.lsvl-meta{margin:.55rem 0 0;font-size:.9rem}.lsvl-error{color:#b42318;margin:.55rem 0 0;font-weight:700}.lsvl-dl{grid-template-columns:minmax(9rem,12rem) 1fr;gap:.35rem .75rem;margin:.75rem 0 0;font-size:.92rem;display:grid}.lsvl-dl dt{color:var(--ink-soft);font-weight:700}.lsvl-dl dd{font-variant-numeric:tabular-nums;word-break:break-word;margin:0}.lsvl-check{align-items:center;gap:.5rem;margin:.35rem 0;font-weight:700;display:flex}.lsvl-row{flex-wrap:wrap;gap:.85rem;margin-top:.65rem;display:flex}.lsvl-row label{flex-direction:column;gap:.25rem;font-size:.88rem;font-weight:700;display:flex}.lsvl-row input[type=number],.lsvl-row select{border:1px solid var(--line);min-width:14rem;font:inherit;border-radius:8px;padding:.35rem .45rem;font-weight:600}.lsvl-chips{flex-wrap:wrap;gap:.45rem;display:flex}.lsvl-chips .btn.is-active{outline:2px solid var(--ink);background:var(--paper-2)}@supports (color:color-mix(in lab,red,red)){.lsvl-chips .btn.is-active{background:color-mix(in srgb,var(--paper-2) 65%,white)}}.lsvl-pre{color:#f6eef8;background:#1e1630;border-radius:10px;max-height:12rem;margin:.65rem 0 0;padding:.75rem;font-size:.78rem;line-height:1.35;overflow:auto}.lsvl-ol{margin:0;padding-left:1.2rem;font-size:.92rem;line-height:1.5}.lsvl-ol li+li{margin-top:.35rem}.lsvl-h3{margin:1rem 0 .45rem;font-size:.95rem}.lsvl-slider{gap:.2rem;margin:.45rem 0 .65rem;font-size:.88rem;display:grid}.lsvl-slider-label strong{font-variant-numeric:tabular-nums}.lsvl-slider input[type=range]{width:100%}.lsvl-slider-hint{color:var(--ink-soft);font-size:.8rem}.lsvl-tract-wrap{border:1px solid var(--line);touch-action:none;background:#fff8fc;border-radius:14px;justify-content:center;margin-top:.75rem;display:flex;overflow:hidden}.lsvl-tract-canvas{cursor:crosshair;touch-action:none;width:min(100%,420px);height:auto;display:block}.mei-correction-workspace,.workshop-workspace{grid-template-columns:15.5rem minmax(0,1fr);align-items:start;gap:1rem;display:grid}.workshop-workspace.is-tools-right{grid-template-columns:minmax(0,1fr) 16rem}.workshop-workspace.is-tools-right .workshop-tools{order:2}.workshop-main{min-width:0}.workshop-modes{flex-wrap:wrap;gap:.5rem;margin:0 0 1rem;display:flex}.workshop-import{margin:0 0 1rem}.workshop-import-row{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.workshop-choose-file{position:relative;overflow:hidden}.workshop-choose-file input[type=file]{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;font-size:0;position:absolute;inset:0}.workshop-file-name{color:var(--ink-soft);font-weight:700}.workshop-page-choices{gap:.5rem;max-width:42rem;margin-top:.85rem;display:grid}.workshop-page-choices label{gap:.25rem;font-weight:700;display:grid}.workshop-page-choices input:not([type=checkbox]),.workshop-page-choices input[type=text]{font:inherit;border:1px solid var(--line);border-radius:.5rem;max-width:18rem;padding:.4rem .6rem}.workshop-page-picker{grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:.75rem;max-height:28rem;margin:.25rem 0 0;padding:0;list-style:none;display:grid;overflow:auto}.workshop-page-picker label{border:1px solid #0000;border-radius:.7rem;justify-items:start;gap:.35rem;padding:.45rem;font-weight:700;display:grid}.workshop-page-picker label.is-checked{border-color:var(--plum,#5c3d6e);background:var(--plum,#5c3d6e)}@supports (color:color-mix(in lab,red,red)){.workshop-page-picker label.is-checked{background:color-mix(in srgb,var(--plum,#5c3d6e) 8%,white)}}.workshop-page-picker canvas,.workshop-page-picker img{background:#fff;border-radius:.35rem;width:100%;height:auto}.workshop-page-picker li{gap:.35rem;display:grid}.workshop-page-picker li.is-framing{border-radius:.7rem;outline:2px solid #145aa0}.workshop-crop-editor{gap:.65rem;margin-top:.5rem;display:grid}.workshop-crop-head{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.workshop-crop-head h2{margin:0;font-size:1rem}.workshop-crop-editor .workshop-source-surface{background:#fff;border-radius:.6rem;max-width:42rem}.workshop-crop-list{gap:.4rem;margin:.25rem 0 0;padding-left:1.2rem;display:grid}.workshop-crop-list li{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.4rem;display:flex}.workshop-crop-actions{flex-wrap:wrap;gap:.35rem;display:flex}.workshop-open{margin:0 0 1rem}.workshop-open h2{margin:.75rem 0 .25rem;font-size:1rem}.workshop-open ul{margin:0 0 .5rem;padding:0;list-style:none}.workshop-open li{flex-wrap:wrap;align-items:center;gap:.35rem .75rem;margin:.35rem 0;display:flex}.workshop-stage{gap:.75rem;min-width:0;display:grid}.workshop-stage.panes-1{grid-template-columns:minmax(0,1fr)}.workshop-stage.panes-2{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch}.workshop-original-bar{flex-wrap:wrap;align-items:center;gap:.75rem;margin:0 0 .75rem;display:flex}.workshop-original-bar .library-hint{margin:0}.workshop-original-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;display:flex}.workshop-original-head h2{margin:0}.workshop-original-actions{flex-wrap:wrap;gap:.4rem;display:flex}.workshop-original-popup{z-index:40;background:#24183059;place-items:center;padding:1.5rem;display:grid;position:fixed;inset:0}.workshop-original-popup-card{width:min(52rem,100%);max-height:calc(100vh - 3rem);box-shadow:var(--shadow);background:#fffaf4;border-radius:16px;padding:1rem;overflow:auto}.workshop-page-pairs{gap:1.5rem;display:grid}.workshop-page-pair{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:.75rem;display:grid}.workshop-page-pair.is-with-original{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr)}.workshop-page-pair .mei-notation-preview,.workshop-page-pair .workshop-source-pdf{height:calc(100vh - 14rem);min-height:28rem}.workshop-source-pdf{background:#fff;border:0;width:100%;height:calc(100vh - 13rem);min-height:36rem;display:block}.workshop-source-surface{background:#fff;width:100%;display:block;position:relative}.workshop-source-canvas,.workshop-source-surface img{width:100%;height:auto;display:block}.workshop-source-surface.is-armed{cursor:crosshair;touch-action:none}.workshop-source-mark-layer{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.workshop-source-mark-layer rect{fill:#5a3c9629;stroke:#5a3c96;stroke-width:.004px}.workshop-source-mark-layer rect.is-kept{fill:#1e6e4624;stroke:#1e6e46}.workshop-source-mark-layer rect.is-hot{fill:#b4461433;stroke:#b44614}.workshop-source-mark-layer rect.is-crop{fill:#145aa029;stroke:#145aa0}.workshop-source-marks{gap:.5rem;display:grid}.workshop-source-mark-list{gap:.35rem;margin:0;padding:0;list-style:none;display:grid}.workshop-source-mark-list li{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.workshop-stage .mei-correction-score,.workshop-stage .workshop-source-frame{max-height:none}.workshop-stage .mei-notation-preview{justify-content:center;align-items:flex-start;height:calc(100vh - 16rem);min-height:32rem;max-height:none;display:flex}.workshop-stage .mei-notation-preview svg{width:auto;max-width:100%;height:auto;max-height:100%}.workshop-stage.panes-3{grid-template-columns:minmax(12rem,.85fr) minmax(0,1fr) minmax(0,1fr)}.workshop-original-score svg{pointer-events:none}.workshop-source-frame{border:1px solid var(--line);background:#fff;border-radius:12px;max-height:78vh;position:relative;overflow:auto}.workshop-source-frame img{width:100%;height:auto;display:block}.workshop-source-overlay{width:100%;height:100%;position:absolute;inset:0}.workshop-source-overlay rect{fill:#0000;stroke:#0f766e;stroke-width:1.5px;vector-effect:non-scaling-stroke;cursor:pointer}.workshop-source-overlay rect.is-changed{stroke:#be185d;stroke-width:2.5px;fill:#be185d29}.workshop-source-overlay rect.is-hot{stroke:#6d28d9;stroke-width:3px;fill:#6d28d938}.workshop-entry-grid{grid-template-columns:1fr 1fr;gap:.35rem;display:grid}.mei-correction-tools{border:1px solid var(--line);background:#fffcf8eb;border-radius:16px;gap:1rem;padding:.85rem;display:grid;position:sticky;top:5.25rem}.mei-correction-controls,.mei-correction-toolbar{gap:.65rem;margin:0;display:grid}.studio-draft-preview{color:#9a3412;background:#fff7ed;border-radius:12px;max-width:42rem;margin:.4rem 0 0;padding:.65rem .8rem;font-weight:700}.studio-draft-preview a{color:inherit}.mei-correction-tools .btn{white-space:normal;text-align:center;width:100%}.mei-correction-controls select{width:100%}.mei-correction-controls label,.mei-correction-inspector h2,.mei-correction-scan h2,.mei-correction-score h2{gap:.25rem;font-size:.95rem;display:grid}.mei-correction-inspector h2{margin:0}.mei-correction-layout{grid-template-columns:minmax(12rem,.8fr) minmax(16rem,1.2fr);align-items:start;gap:1rem;display:grid}.mei-correction-layout.is-score-only{grid-template-columns:1fr}.mei-correction-inspector,.mei-correction-meta,.mei-correction-scan{gap:.5rem;display:grid}.mei-correction-scan iframe,.mei-correction-scan img{border:1px solid var(--line);background:#fff;border-radius:12px;width:100%;min-height:24rem}.mei-correction-score .mei-notation-preview svg g.note{cursor:ns-resize}.mei-correction-score .mei-notation-preview svg g.chord,.mei-correction-score .mei-notation-preview svg g.mRest,.mei-correction-score .mei-notation-preview svg g.rest{cursor:pointer}.mei-correction-score .mei-notation-preview svg g.is-selected{filter:drop-shadow(0 0 2px #1d4ed8)}.mei-correction-score .mei-notation-preview svg .mei-rhythm-flag.is-overfull{stroke:#b91c1c;stroke-width:8px}.mei-correction-score .mei-notation-preview svg .mei-rhythm-flag.is-underfull{stroke:#b45309;stroke-width:8px}.mei-correction-warnings{gap:.35rem;margin:.75rem 0 0;padding:0;list-style:none;display:grid}.mei-correction-warnings .is-overfull{color:#991b1b;font-weight:700}.mei-correction-warnings .is-underfull{color:#9a3412;font-weight:700}@media (max-width:900px){.mei-correction-layout,.mei-correction-workspace,.workshop-page-pair,.workshop-page-pair.is-with-original,.workshop-stage,.workshop-workspace,.workshop-workspace.is-tools-right{grid-template-columns:1fr}.mei-correction-tools{position:static}}.rulebook section{margin-bottom:1.6rem}.rulebook-pipeline{gap:.55rem;margin:1rem 0 0;padding:0;list-style:none;display:grid}.rulebook-pipeline li{background:var(--card);border:1px solid var(--line);border-radius:14px;grid-template-columns:2rem 1fr;align-items:start;gap:.7rem;padding:.7rem .85rem;display:grid}.rulebook-pipeline li>span{background:#efe4ff;border-radius:999px;place-items:center;width:2rem;height:2rem;font-weight:800;display:grid}.rulebook-pipeline em,.rulebook-pipeline strong{margin-right:.45rem;display:inline}.rulebook-pipeline em{color:var(--ink-soft);font-size:.82rem;font-style:normal}.rulebook-detail p,.rulebook-pipeline p{margin:.25rem 0 0}.rulebook-filters{gap:.6rem;margin:.8rem 0;display:flex}.rulebook-filters input,.rulebook-filters select{border:1px solid var(--line);color:var(--ink);background:#fff;border-radius:12px;padding:.55rem .7rem}.rulebook-filters input{flex:1}.rulebook-layout{grid-template-columns:minmax(14rem,22rem) 1fr;align-items:start;gap:1rem;display:grid}.rulebook-list{gap:.4rem;margin:0;padding:0;list-style:none;display:grid}.rulebook-list button{text-align:left;border:1px solid var(--line);background:var(--card);width:100%;color:inherit;cursor:pointer;border-radius:12px;padding:.6rem .7rem}.rulebook-list button.is-selected{border-color:#6a5ae0;box-shadow:inset 0 0 0 1px #6a5ae0}.rulebook-list em,.rulebook-list span,.rulebook-list strong{display:block}.rulebook-list em,.rulebook-list span{color:var(--ink-soft);font-size:.8rem;font-style:normal}.rulebook-detail{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:1rem 1.1rem 1.2rem}.rulebook-detail dl{grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:.7rem;margin:.8rem 0;display:grid}.rulebook-detail dt{letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);font-size:.75rem}.rulebook-detail dd{margin:.15rem 0 0}.rulebook-history,.rulebook-notes,.rulebook-paths{margin:.4rem 0 .8rem;padding-left:1.1rem}.rulebook-paths{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem}.rulebook-history code{margin-left:.4rem}@media (max-width:800px){.rulebook-filters,.rulebook-layout{grid-template-columns:1fr;display:grid}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}