.scrollbar-hidden{-ms-overflow-style:none;scrollbar-width:none}.scrollbar-hidden::-webkit-scrollbar{display:none}@font-face{font-family:Bravura;src:url(/fonts/Bravura.woff2) format("woff2");font-style:normal;font-weight:400;font-display:block}@font-face{font-family:Bravura Text Symbols;src:url(/fonts/BravuraText.woff2) format("woff2");font-style:normal;font-weight:400;font-display:block;unicode-range:U+2669-266F,U+1D100-1D1FF}@font-face{font-family:Leland;src:url(/fonts/Leland.otf) format("opentype");font-style:normal;font-weight:400;font-display:block}html,body,#root{min-width:0;min-height:100%;margin:0}body{overflow-x:hidden;font-family:Bravura Text Symbols,ui-sans-serif,system-ui,sans-serif}.music-notation-fixed-colors{color-scheme:only light;forced-color-adjust:none}.music-notation-fixed-colors *{forced-color-adjust:none}.music-symbol{font-family:Bravura,Leland,Bravura Text Symbols,serif}@keyframes result-note-land{0%{opacity:0;transform:translateY(30px) scale(.52) rotate(-7deg)}58%{opacity:1;transform:translateY(-5px) scale(1.18) rotate(2deg)}76%{transform:translateY(2px) scale(.96) rotate(-1deg)}to{opacity:1;transform:translateY(0) scale(1) rotate(0)}}@keyframes result-note-sparkle{0%,18%{opacity:0;transform:scale(.2) rotate(-18deg)}45%{opacity:1;transform:scale(1.15) rotate(8deg)}to{opacity:0;transform:scale(1.55) rotate(18deg)}}@keyframes result-staff-shimmer{0%{opacity:0;transform:translate(0) skew(-16deg)}20%{opacity:.9}80%{opacity:.9}to{opacity:0;transform:translate(560px) skew(-16deg)}}.result-golden-note{opacity:0;transform-box:fill-box;transform-origin:center}.result-golden-note[data-visible=true]{animation:result-note-land .68s cubic-bezier(.16,.88,.28,1.2) both}.result-note-sparkles{opacity:0;transform-box:fill-box;transform-origin:center}.result-golden-note[data-visible=true] .result-note-sparkles{animation:result-note-sparkle .82s ease-out .12s both}.result-staff-shimmer{opacity:0}.result-staff-shimmer[data-visible=true] rect{animation:result-staff-shimmer .95s ease-in-out both;transform-box:fill-box;transform-origin:center}@keyframes tone-pulse-marker{0%{transform:scale(1);fill:var(--tone-pulse-base);animation-timing-function:cubic-bezier(.12,.82,.2,1)}18%{transform:scale(1.25);fill:var(--tone-pulse-peak);animation-timing-function:cubic-bezier(.2,.62,.3,1)}to{transform:scale(1);fill:var(--tone-pulse-base)}}@keyframes tone-pulse-label{0%{transform:scale(1);animation-timing-function:cubic-bezier(.12,.82,.2,1)}18%{transform:scale(1.25);animation-timing-function:cubic-bezier(.2,.62,.3,1)}to{transform:scale(1)}}@keyframes tone-pulse-marker-fill{0%{fill:var(--tone-pulse-base);animation-timing-function:cubic-bezier(.12,.82,.2,1)}18%{fill:var(--tone-pulse-peak);animation-timing-function:cubic-bezier(.2,.62,.3,1)}to{fill:var(--tone-pulse-base)}}@keyframes tone-pulse-symbol{0%{transform:scale(1);color:var(--tone-pulse-base);animation-timing-function:cubic-bezier(.12,.82,.2,1)}18%{transform:scale(1.25);color:var(--tone-pulse-peak);animation-timing-function:cubic-bezier(.2,.62,.3,1)}to{transform:scale(1);color:var(--tone-pulse-base)}}.tone-pulse-marker,.tone-pulse-label,.tone-pulse-symbol{animation-duration:var(--tone-pulse-duration);animation-fill-mode:both}.tone-pulse-marker{animation-name:tone-pulse-marker}.tone-pulse-marker-fill{animation-name:tone-pulse-marker-fill;animation-duration:var(--tone-pulse-duration);animation-fill-mode:both}.tone-pulse-label{animation-name:tone-pulse-label}.tone-pulse-symbol{animation-name:tone-pulse-symbol}@media(prefers-reduced-motion:reduce){.result-golden-note[data-visible=true]{opacity:1;animation:none;transform:none}.result-note-sparkles,.result-staff-shimmer{display:none}.tone-pulse-marker,.tone-pulse-marker-fill,.tone-pulse-label,.tone-pulse-symbol{animation:none}}:where(button,select,input,[tabindex]):focus-visible{outline:3px solid #0369a1!important;outline-offset:2px!important}.control-key{border:1.5px solid #737373!important;border-radius:7px!important;background-clip:padding-box!important;background:linear-gradient(to bottom,#f5f5f5,#e5e5e5 48%,#cfcfcf)!important;box-shadow:inset 0 1px #fffffff2,inset 0 -2px #0000001a,0 2px 4px #0000002e!important}.control-key:active{transform:translateY(1px);box-shadow:inset 0 2px 4px #0000002e,0 1px 1px #0000001f!important}.control-key:disabled{border-color:#a3a3a3!important;background:#e5e5e5!important;box-shadow:none!important;transform:none}.choice-active{border:1.5px solid #065f46!important;border-radius:7px!important;color:#fff!important;background-clip:padding-box!important;background:linear-gradient(to bottom,#16a36f,#047857 52%,#056247)!important;box-shadow:inset 0 1px #ffffff4d,inset 0 -2px #00000029,0 2px 3px #00000029!important}@media(hover:hover)and (pointer:fine){.control-key:not(.choice-active):not(:disabled):hover{background:linear-gradient(to bottom,#fff,#eee 52%,#d8d8d8)!important}button:not(:disabled):hover,[role=button].choice-active:hover{filter:brightness(1.07)}}.segmented-control{overflow:visible!important;border:0!important;background:transparent!important}.segmented-control>button{border-radius:0!important}.segmented-control>button+button{border-left-width:0!important}.segmented-control>button:first-child{border-radius:7px 0 0 7px!important}.segmented-control>button:last-child{border-radius:0 7px 7px 0!important}.mobile-learning-workspace{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);grid-auto-flow:row;background:#4b2d1d}.mobile-scale-workspace{grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(3,minmax(0,1fr));grid-auto-flow:row;background:#4b2d1d}.mobile-learning-card{min-height:0;border:0;border-radius:0;box-shadow:none;outline:1px solid rgba(38,28,22,.35);outline-offset:-1px;transition:outline-color .14s ease,filter .14s ease}.mobile-card-titlebar{display:flex;align-items:center;position:relative;z-index:2;flex:0 0 20px;height:20px;min-height:20px;max-height:20px;border-bottom:1px solid rgba(20,13,9,.45);-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.mobile-card-titlebar:before{content:"";position:absolute;z-index:0;top:-3px;right:0;height:28px;left:0;background:transparent}.mobile-card-titlebar>*{position:relative;z-index:1}.mobile-card-titlebar-fit-button:before{content:"";position:absolute;top:50%;left:50%;width:28px;height:28px;transform:translate(-50%,-50%);background:transparent}.mobile-card-titlebar-wood{color:#fff;background:linear-gradient(90deg,#93603df5,#70452cf5)}.mobile-card-titlebar-paper{color:#3f2d14;background:linear-gradient(90deg,#f3e2a9,#e7cc7d)}.mobile-card-dragging{z-index:3;outline:3px solid rgba(24,148,92,.95);filter:brightness(1.08)}.mobile-card-dragging .mobile-card-titlebar{color:#fff;background:linear-gradient(90deg,#168653,#2eaa70);box-shadow:inset 0 0 0 1px #ffffff73}.mobile-card-drop-target{outline:3px solid rgba(235,174,28,.98);outline-offset:-3px}.card-horizontal-zoom-content svg text{transform-box:fill-box;transform-origin:center;scale:var(--card-text-scale-x, 1) var(--card-text-scale-y, 1)}.card-horizontal-zoom-content svg circle{transform-box:fill-box;transform-origin:center;scale:var(--card-round-scale-x, 1) 1}.mobile-layout-splitter{position:absolute;z-index:65;touch-action:none;-webkit-user-select:none;user-select:none}.mobile-layout-splitter:after{content:"";position:absolute;border-radius:999px;background:#f4c44ab8;box-shadow:0 0 0 1px #3d261673,0 1px 4px #0000004d;transition:background .12s ease,transform .12s ease}.mobile-layout-splitter.is-active:after,.mobile-layout-splitter:hover:after{background:#24b169f2}.mobile-layout-splitter-row{left:0;width:100%;height:18px;transform:translateY(-50%);cursor:row-resize}.mobile-layout-splitter-row:after{left:50%;top:7px;width:min(76px,22vw);height:4px;transform:translate(-50%)}.mobile-layout-splitter-row.is-active:after{transform:translate(-50%) scaleY(1.5)}.mobile-layout-staff-expander{z-index:66}.mobile-layout-staff-expander:after{width:min(54px,60%)}.mobile-staff-bottom-collapse{bottom:0;height:18px;cursor:row-resize;z-index:66}.mobile-staff-bottom-collapse:after{left:50%;bottom:3px;width:min(54px,60%);height:4px;transform:translate(-50%)}.mobile-staff-bottom-collapse.is-active:after{transform:translate(-50%) scaleY(1.5)}.mobile-layout-splitter-column{width:18px;transform:translate(-50%);cursor:col-resize}.mobile-layout-splitter-column:after{left:7px;top:50%;width:4px;height:min(76px,22vh);transform:translateY(-50%)}.mobile-layout-splitter-column.is-active:after{transform:translateY(-50%) scaleX(1.5)}.mobile-learning-card [data-card-content]>svg{display:block;width:100%;height:auto;max-height:100%}.mobile-test-card{width:100%;height:100%;border:0;border-radius:0;box-shadow:none;outline:1px solid rgba(38,28,22,.35);outline-offset:-1px}.mobile-test-card-titlebar{flex:0 0 20px;height:20px;min-height:20px;max-height:20px}.mobile-test-workspace{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,44%) minmax(0,56%);background:#4b2d1d}.mobile-test-card-content>svg,.mobile-test-card-content>div>svg{display:block;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important}.mobile-test-card[data-test-view=staff] .mobile-test-card-content>svg{width:100%!important;height:100%!important;max-width:100%!important}.mobile-test-setup select,.mobile-test-setup input,.mobile-test-setup button:not([role=switch]){min-height:46px;font-size:16px!important}.mobile-test-setup select,.mobile-test-setup input{padding-top:.45rem;padding-bottom:.45rem}.mobile-test-setup section .text-sm{font-size:16px!important;line-height:1.4rem!important}.mobile-test-setup section .text-xs{font-size:14px!important;line-height:1.25rem!important}.mobile-test-setup .segmented-control>button{min-height:50px;font-size:15px!important}@media(orientation:landscape){.mobile-test-workspace[data-mobile-pair=with-staff]{grid-template-rows:minmax(0,1fr)}.mobile-test-workspace[data-mobile-pair=with-staff][data-mobile-staff-position=first]{grid-template-columns:minmax(160px,31%) minmax(0,69%)}.mobile-test-workspace[data-mobile-pair=with-staff][data-mobile-staff-position=second]{grid-template-columns:minmax(0,69%) minmax(160px,31%)}.mobile-test-workspace[data-mobile-pair=two-long]{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,1fr)}.mobile-learning-workspace{grid-template-areas:"paired staff" "full full";grid-template-columns:minmax(0,calc(100% - var(--mobile-staff-width, 26.6667%))) minmax(160px,var(--mobile-staff-width, 26.6667%));grid-template-rows:minmax(0,calc(100% - var(--mobile-full-row-height, 50%))) minmax(0,var(--mobile-full-row-height, 50%))}.mobile-learning-workspace[data-mobile-staff-side=left]{grid-template-areas:"staff paired" "full full";grid-template-columns:minmax(160px,var(--mobile-staff-width, 26.6667%)) minmax(0,calc(100% - var(--mobile-staff-width, 26.6667%)))}.mobile-learning-workspace[data-mobile-staff-row=bottom]{grid-template-areas:"full full" "paired staff";grid-template-rows:minmax(0,var(--mobile-full-row-height, 50%)) minmax(0,calc(100% - var(--mobile-full-row-height, 50%)))}.mobile-learning-workspace[data-mobile-staff-row=bottom][data-mobile-staff-side=left]{grid-template-areas:"full full" "staff paired"}.mobile-learning-workspace[data-mobile-staff-span=true]{grid-template-areas:"paired staff" "full staff";grid-template-rows:minmax(0,calc(100% - var(--mobile-full-row-height, 50%))) minmax(0,var(--mobile-full-row-height, 50%))}.mobile-learning-workspace[data-mobile-staff-span=true][data-mobile-staff-side=left]{grid-template-areas:"staff paired" "staff full"}.mobile-learning-card[data-mobile-slot=paired]{grid-area:paired}.mobile-learning-card[data-mobile-slot=staff]{grid-area:staff}.mobile-learning-card[data-mobile-slot=full]{grid-area:full}.mobile-scale-workspace{grid-template-areas:"paired full" "staff full";grid-template-columns:minmax(0,var(--mobile-scale-left-width, 66.6667%)) minmax(0,calc(100% - var(--mobile-scale-left-width, 66.6667%)));grid-template-rows:minmax(0,var(--mobile-scale-top-height, 50%)) minmax(0,calc(100% - var(--mobile-scale-top-height, 50%)))}.mobile-scale-workspace .mobile-learning-card[data-mobile-slot=paired]{grid-area:paired}.mobile-scale-workspace .mobile-learning-card[data-mobile-slot=staff]{grid-area:staff}.mobile-scale-workspace .mobile-learning-card[data-mobile-slot=full]{grid-area:full}}.scale-controls-container{container-type:size}.scale-controls-card{border-color:#b8c4cc52!important;box-shadow:inset 0 1px #ffffff1f,inset 0 -1px #00000094,0 12px 30px #0811186b!important}.scale-controls-card .mobile-card-titlebar-wood{color:#f6f8f9;background-color:#16191b;background-image:linear-gradient(180deg,#ffffff1c,#00000057),url(/practice-control-dark-metal-texture-v1.png);background-size:auto,cover;background-position:center;border-bottom-color:#d2dce238}.scale-controls-layout{box-sizing:border-box;display:grid;grid-template-areas:"status" "panel" "modes" "transport";grid-template-columns:minmax(0,1fr);grid-template-rows:48px minmax(0,1fr) 48px 48px;width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;gap:8px}.scale-controls-status{position:relative;isolation:isolate;box-sizing:border-box;grid-area:status;overflow:hidden;border:1px solid rgba(129,198,199,.42);border-radius:8px;color:#c8fff1;background-color:#062c2f;background-image:repeating-linear-gradient(0deg,#d8fff806 0 1px,#00121407 1px 3px),radial-gradient(ellipse at 50% 42%,#288b8d57,#08464a33 48%,#01181b70),linear-gradient(180deg,#0d4a4d,#07383c 42%,#05282c);box-shadow:0 0 0 2px #010507db,0 0 0 3px #bfd8d826,inset 0 1px #e2fffc61,inset 0 7px 12px #a3ece61a,inset 0 -9px 13px #00080b85,0 3px 7px #0000006b;text-shadow:0 0 4px rgba(133,255,229,.38),0 1px 1px rgba(0,0,0,.75)}.scale-controls-status:before{content:"";position:absolute;z-index:0;inset:1px 2px auto;height:43%;border-radius:6px 6px 55% 55%/6px 6px 22% 22%;pointer-events:none;background:linear-gradient(172deg,rgba(235,255,253,.2) 0%,rgba(187,245,240,.07) 43%,transparent 72%);opacity:.76}.scale-controls-status:after{content:"";position:absolute;z-index:0;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(105deg,transparent 12%,rgba(225,255,252,.055) 30%,transparent 47%),radial-gradient(ellipse at center,transparent 52%,rgba(0,7,9,.3) 100%)}.scale-controls-status>*,.scale-controls-status [data-scale-count-in]>*{position:relative;z-index:1}.scale-controls-modes{grid-area:modes}.scale-controls-transport{grid-area:transport;flex-direction:row}.scale-controls-panel{grid-area:panel}.scale-controls-layout[data-scale-controls-mobile-portrait=true]{grid-template-areas:"modes panel status" "modes panel transport";grid-template-columns:48px minmax(0,1fr) 140px;grid-template-rows:minmax(0,1fr) 44px}.scale-controls-layout[data-scale-controls-mobile-portrait=true] .scale-controls-modes{flex-direction:column}.scale-controls-layout[data-scale-controls-mobile-portrait=true] .scale-controls-transport{flex-direction:row;gap:4px;padding-inline:0}.scale-controls-layout[data-scale-controls-mobile-portrait=true] .scale-controls-transport>button{width:44px;height:44px}.scale-controls-layout[data-scale-controls-mobile-portrait=true] .scale-controls-status{height:48px;align-self:center;align-content:center}.scale-controls-layout[data-scale-controls-mobile-portrait=true] .scale-controls-status>[data-scale-idle-status]{font-size:1rem}.variation-panel{display:grid;width:100%;min-width:0;align-content:start;gap:4px}.variation-row{display:grid;grid-template-columns:minmax(0,1fr) 88px;gap:6px;align-items:center;padding:1px 4px;border:1px solid rgba(255,255,255,.15);border-radius:10px;background:#00000026}.variation-row label{display:flex;align-items:center;gap:6px;min-width:0;color:#fff;font-size:12px;font-weight:600;cursor:pointer}.variation-row input{width:16px;height:16px;flex-shrink:0;accent-color:#8b5cf6}.variation-tile{display:flex;align-items:center;justify-content:center;gap:4px;min-width:0;border:1px solid rgba(255,255,255,.25);border-radius:8px;background:#00000040;color:#e7e0f6;cursor:pointer}.variation-current{width:88px;height:48px}.variation-tile[data-enabled=true],.variation-tile[aria-pressed=true]{background:#6d28d9;border-color:#c4b5fd;color:#fff}.variation-tile:hover{border-color:#ddd6fe;background-color:#4c2873}.variation-tile:focus-visible,.variation-dialog-heading button:focus-visible{outline:2px solid #c4b5fd;outline-offset:2px}.variation-tile:disabled{opacity:.35;cursor:default}.variation-icon{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;font-size:11px;font-weight:600}.variation-icon svg{max-width:64px;height:25px}.variation-repeat{font-size:23px}.variation-rhythm{font-family:Bravura Text,Segoe UI Symbol,serif;font-size:23px;white-space:nowrap;line-height:1.4}.variation-dialog{box-sizing:border-box;width:min(360px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;border:1px solid #77658c;border-radius:14px;color:#fff;background:#19171f;box-shadow:0 12px 45px #000a}.variation-dialog::backdrop{background:#0006}.variation-dialog-body{padding:14px}.variation-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.variation-dialog-heading h3{margin:0;font-size:16px;font-weight:600}.variation-dialog-heading button{width:36px;height:36px;border:1px solid #ffffff40;border-radius:8px;background:#ffffff0c;color:#fff;font-size:24px;cursor:pointer}.variation-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.variation-options .variation-tile{min-height:72px;padding:6px}.scale-print-page{container-type:inline-size;box-sizing:border-box;width:min(210mm,calc(100vw - 32px));aspect-ratio:210 / 297;overflow:hidden;padding:10mm;background:#fff;box-shadow:0 8px 30px #0f172a3d;color:#111}.scale-print-page[data-orientation=landscape]{width:min(297mm,calc(100vw - 32px));aspect-ratio:297 / 210;padding:10mm}.scale-print-page h2{margin:0 0 1.5cqw;text-align:center;font-family:Georgia,Times New Roman,serif;font-size:3.36cqw;line-height:1.15}.scale-print-page[data-orientation=landscape] h2{margin-bottom:1cqw;font-size:2.38cqw}.scale-print-continuation{margin-bottom:1.5cqw;border-bottom:.12cqw solid #aaa;padding-bottom:.7cqw;font-family:Georgia,Times New Roman,serif;font-size:1.65cqw;line-height:1.2}.scale-print-fretboard{display:flex;height:20cqw;align-items:center;margin-bottom:1.5cqw;overflow:hidden}.scale-print-page[data-orientation=landscape] .scale-print-fretboard{height:14cqw;margin-bottom:1cqw}.scale-print-fretboard>svg{max-height:100%}.scale-print-systems{display:grid;gap:1.1cqw}.scale-print-systems-paired{gap:14mm}.scale-print-system{break-inside:avoid;display:grid;gap:.35cqw;overflow:hidden}.scale-print-staff-row,.scale-print-tab-row{display:flex;min-height:0;align-items:flex-start;overflow:hidden}.scale-print-system [data-scale-staff-sequence]{width:100%}.scale-print-system [data-print-mode=true] svg{max-width:none}.scale-print-action{border:1px solid #075985;background:#0369a1}.scale-print-action:hover{background:#075985}.scale-print-action:focus-visible{outline:3px solid rgba(14,165,233,.38);outline-offset:2px}[data-print-appearance] image{display:none}@media print{html,body,#root{margin:0!important;min-height:0!important;background:#fff!important}.scale-print-toolbar{display:none!important}.scale-print-preview-background{display:block!important;padding:0!important;background:#fff!important}.scale-print-page{margin:0!important;width:210mm!important;height:297mm!important;aspect-ratio:auto;box-shadow:none!important;break-after:page;page-break-after:always;print-color-adjust:exact;-webkit-print-color-adjust:exact}.scale-print-page[data-orientation=landscape]{width:297mm!important;height:210mm!important}.scale-print-page:last-child{break-after:auto;page-break-after:auto}}