.lesson-shell.dt-lesson{--scene-h:clamp(230px,34vh,320px)}.dt-lesson .lesson-scene{min-height:calc(var(--scene-h) + 190px)}.dt-scene-content{flex-direction:column;align-items:center;gap:8px;width:100%;display:flex}.dt-lesson .engraved-row{height:var(--scene-h);min-height:200px}.dt-practice{flex-direction:column;align-items:center;gap:8px;width:100%;display:flex}.dt-practice-controls{flex-direction:column;align-items:center;gap:10px;width:100%;display:flex}.dt-hit{fill:#0000;stroke:none;cursor:default;touch-action:manipulation;-webkit-tap-highlight-color:transparent;outline:none}.dt-hit:focus-visible{stroke:#678956;stroke-width:2px;stroke-dasharray:4 4}.dt-count{font:600 22px var(--font,sans-serif);text-anchor:middle;fill:#85868e;transition:fill .1s}.dt-count.is-lit{fill:#b9362e}.dt-line{stroke:#d9d6cf;stroke-width:2px}.dt-tick{stroke:#b5b1aa;stroke-width:2px;stroke-linecap:round}.dt-tick.is-beat{stroke:#85868e}.dt-tick.is-bar{stroke:#1b1b1f}.dt-tick.is-lit{stroke:#b9362e;stroke-width:4px}.dt-label{font:400 18px var(--font,sans-serif);text-anchor:middle;fill:#71747e}.dt-label.is-done{fill:#46633d;font-weight:600}.dt-bracket{animation:.25s both dt-fade}.dt-bracket path{fill:none;stroke:#85868e;stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round}.dt-bracket text{font:500 17px var(--font,sans-serif);text-anchor:middle;fill:#71747e}.dt-bracket.is-done text{fill:#46633d;font-weight:600}.dt-ruler{stroke:#d9d6cf;stroke-width:2px}.dt-guide{fill:#b5b1aa}.dt-guide.is-missed{fill:none;stroke:#c0502f;stroke-width:2.5px}.dt-tap{fill:#9a9ca3;animation:.12s both dt-fade}.dt-tap.is-on{fill:#678956}.dt-tap.is-early,.dt-tap.is-late{fill:#c0502f}.dt-tap.is-extra{fill:#fff;stroke:#c0502f;stroke-width:2px}.dt-tap-link{stroke:#c0502f;stroke-width:1.5px;stroke-dasharray:3 3}.dt-tap-spot{cursor:default;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;border-radius:24px;outline:none;justify-content:center;align-items:center;gap:14px;width:min(100%,320px);height:104px;display:flex;position:relative}.dt-tap-spot:focus-visible{box-shadow:0 0 0 2px #678956}.dt-cookie-home{justify-content:center;align-items:center;width:96px;height:96px;display:flex}.dt-tap-say{color:#453526;white-space:nowrap;background:#faf5ec;border-radius:16px;padding:8px 14px;font-size:15px;font-weight:500;position:relative}.dt-tap-say small{color:#85868e;font-size:12px;font-weight:400;display:block}@media (hover:none){.dt-tap-say small{display:none}}.dt-tap-say:before{content:"";background:#faf5ec;border-radius:2px;width:12px;height:12px;position:absolute;top:50%;left:-6px;transform:translateY(-50%)rotate(45deg)}.dt-tap-spot:not(:has(.dt-cookie-home:not(:empty))) .dt-tap-say{visibility:hidden}@keyframes dt-fade{0%{opacity:0}}@media (min-width:761px){.studio-route .theory-shell.lesson-shell.dt-lesson{--scene-h:clamp(220px,31vh,300px);padding:68px 32px 12px}.dt-lesson .lesson-talk{padding-bottom:8px}}@media (max-width:760px){.dt-lesson .lesson-scene{min-height:0}.dt-lesson .engraved-row{min-height:170px}.dt-scene-content,.dt-practice{gap:4px}.dt-count{font-size:26px}.dt-label,.dt-bracket text{font-size:23px}.dt-tap-spot{height:84px}.dt-practice-controls{gap:4px}.dt-practice .engraved-row{min-height:150px}}.dt-lesson .lesson-bubble:has(.dt-wide-choices){flex-wrap:wrap;row-gap:10px}.dt-lesson .lesson-bubble:has(.dt-wide-choices)>p{flex:1 0 100%}.dt-lesson .lesson-bubble:has(.dt-wide-choices) .lesson-actions{flex-wrap:wrap;justify-content:flex-end;margin-left:auto}.dt-lesson .dt-wide-choices{flex-wrap:wrap;justify-content:flex-end}.lesson-shell .dt-wide-choices button{white-space:nowrap}@media (prefers-reduced-motion:reduce){.dt-bracket,.dt-tap,.dt-count{transition:none;animation:none}}.dt-note-question{width:100%;min-height:var(--scene-h);justify-content:center;align-items:center;gap:clamp(16px,4vw,64px);display:flex}.lesson-shell .dt-note-question button{color:#292a33;background:0 0;border:0;border-radius:16px;flex-direction:column;flex:0 180px;align-items:center;min-width:0;padding:12px;display:flex}.dt-note-question svg{fill:currentColor;width:100%;max-width:140px;height:150px}.dt-note-question span{font-size:17px}.dt-note-question small{min-height:24px;margin-top:12px;font-size:16px}.lesson-shell .dt-note-question button.is-correct{color:#46633d}.lesson-shell .dt-note-question button.is-wrong{color:#b9362e}.lesson-shell .dt-note-question button:disabled{opacity:1}.dt-note-question button:focus-visible{outline-offset:4px;outline:2px solid #678956}.dt-lesson .dt-equation{color:#292a33;fill:currentColor;width:min(100%,380px);height:100px}.dt-equation text{font:400 28px var(--font,sans-serif);text-anchor:middle}.dt-lesson .lesson-bubble:has(.measures-choices){text-align:center;grid-template-columns:1fr;gap:12px;display:grid}.dt-lesson .lesson-bubble:has(.measures-choices)>p{text-align:center;width:100%;max-width:none}.dt-lesson .lesson-bubble:has(.measures-choices) .lesson-actions{grid-template-columns:1fr;justify-items:center;width:100%;margin:0;display:grid}.dt-lesson .lesson-bubble .measures-choices{justify-content:center}.dt-lesson .lesson-bubble .lesson-action-slot{justify-self:end}.lesson-shell.dt-lesson .dt-note-question button:hover{background:0 0}.dt-dot-reference{flex-wrap:wrap;justify-content:center;gap:20px;width:100%;display:flex}.dt-dot-reference>div{text-align:center;flex-direction:column;flex:0 140px;align-items:center;gap:6px;display:flex}.dt-dot-reference svg{fill:currentColor;width:90px;height:120px}.dt-dot-reference strong{white-space:nowrap;font-size:16px;font-weight:500}.dt-dot-reference small{color:#71747e}.dt-duration-join path{fill:none;stroke:#85868e;stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round}.dt-duration-join text{font:500 19px var(--font,sans-serif);text-anchor:middle;fill:#71747e}.dt-transformed .engraved-row__tie{transform-box:fill-box;animation:.75s both dt-tie-draw}.dt-added-dot{transform-box:fill-box;transform-origin:50%;animation:.5s both dt-dot-in}@keyframes dt-tie-draw{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@keyframes dt-dot-in{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}.dt-transformed .engraved-row__note>circle{transform-box:fill-box;transform-origin:50%;animation:.5s both dt-dot-in}.dt-lesson .lesson-bubble:has(.measures-choices){gap:8px;min-height:106px;padding:14px 18px}.dt-lesson .lesson-bubble:has(.measures-choices) .lesson-actions{grid-template-columns:1fr auto 1fr;align-items:center;gap:8px}.dt-lesson .lesson-bubble .measures-choices{grid-column:2}.dt-lesson .lesson-bubble .lesson-action-slot{grid-column:3}.dt-span-seam{transform-box:fill-box;transform-origin:bottom;transition:transform .55s}.dt-span-bridge{stroke-dasharray:10;stroke-dashoffset:10px;transition:stroke-dashoffset .55s}.is-joined .dt-span-seam{transform:scaleY(0)}.is-joined .dt-span-bridge{stroke-dashoffset:0}.lesson-shell.dt-lesson button:focus:not(:focus-visible){box-shadow:none;outline:none}.lesson-shell.dt-lesson button:focus-visible{outline-offset:3px;outline:2px solid #678956}@media (max-width:600px){.dt-lesson .lesson-bubble:has(.measures-choices) .lesson-actions{grid-template-columns:1fr auto}.dt-lesson .lesson-bubble .measures-choices{grid-column:1}.dt-lesson .lesson-bubble .lesson-action-slot{grid-column:2}}@media (prefers-reduced-motion:reduce){.dt-span-seam,.dt-span-bridge{transition:none}.dt-transformed .engraved-row__tie,.dt-added-dot{animation:none}}.lesson-shell.dt-lesson .lesson-narration{flex:none;height:86px;min-height:86px}.lesson-shell.dt-lesson .lesson-scene{height:calc(var(--scene-h) + 220px);min-height:calc(var(--scene-h) + 220px);flex:none}.lesson-shell.dt-lesson .dt-scene-content{justify-content:flex-start;height:100%}.lesson-shell.dt-lesson .engraved-row{height:var(--scene-h);min-height:var(--scene-h);flex:none}.lesson-shell.dt-lesson .lesson-talk{flex:none;align-items:flex-start;height:140px;min-height:140px;padding-bottom:0}.lesson-shell.dt-lesson #lesson-companion{align-items:center;height:140px}.lesson-shell.dt-lesson .lesson-bubble{box-sizing:border-box;height:140px;min-height:140px}.lesson-shell.dt-lesson .dt-note-question{height:var(--scene-h);min-height:var(--scene-h);flex:none}.dt-duration-join .dt-span-sum{font-size:19px}@media (min-width:761px){.studio-route .theory-shell.lesson-shell.dt-lesson{--scene-h:clamp(220px,28vh,280px)}.lesson-shell.dt-lesson .lesson-narration{height:72px;min-height:72px}.lesson-shell.dt-lesson .lesson-scene{height:calc(var(--scene-h) + 124px);min-height:calc(var(--scene-h) + 124px)}.dt-lesson .dt-practice-controls{grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;height:104px;display:grid}.dt-practice-controls .count-in-pulse{justify-self:center}.dt-practice-controls .lesson-tools{flex-direction:column;gap:6px}.lesson-shell.dt-lesson .lesson-talk,.lesson-shell.dt-lesson #lesson-companion,.lesson-shell.dt-lesson .lesson-bubble{height:120px;min-height:120px}}.lesson-shell .lesson-tools .lesson-playback-button{place-items:center;display:inline-grid}.lesson-playback-button>span{grid-area:1/1}.lesson-shell .rhythm-demo-tools button[aria-pressed]{min-width:76px}
