[data-music-scene]{width:100%;min-width:0;color:#49335e}
.ms-stage{width:100%;aspect-ratio:4/3;position:relative;isolation:isolate}
.ms-learning-background{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;overflow:visible;font-family:'DM Sans',Arial,sans-serif;pointer-events:none}
.ms-performer{position:absolute;z-index:1;left:0;bottom:0;width:100%;height:80%;object-fit:contain;object-position:center bottom;display:block;pointer-events:none;opacity:0;transition:none}
.ms-performer.is-visible{opacity:1}
.ms-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.ms-scene-caption{text-align:center;font-size:12px;line-height:1.7;color:#816593;margin:0 auto;min-height:3.4em;max-width:430px;padding:0 12px}
.ms-basics-only,.ms-practice-only,.ms-support-only,.ms-feedback-only,.ms-context-only{opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s}
[data-state="basics"] .ms-basics-only,[data-state="practice"] .ms-practice-only,[data-state="support"] .ms-support-only,[data-state="feedback"] .ms-feedback-only,[data-state="context"] .ms-context-only{opacity:1;visibility:visible}

/* The foreground is stable. Movement belongs only to the educational overlays. */
.ms-observation-focus>circle{opacity:.2;transition:opacity .5s,stroke .5s}
[data-state="basics"][data-phase="0"] .ms-observation-focus>circle:nth-child(1),
[data-state="basics"][data-phase="1"] .ms-observation-focus>circle:nth-child(2),
[data-state="basics"][data-phase="2"] .ms-observation-focus>circle:nth-child(3){opacity:1;stroke:#9daf7b;animation:ms-observe 2.4s ease-in-out infinite}
.ms-attempt>circle{transition:fill .6s,stroke .6s}
[data-state="practice"][data-phase="0"] .ms-attempt-0>circle,
[data-state="practice"][data-phase="1"] .ms-attempt-1>circle,
[data-state="practice"][data-phase="2"] .ms-attempt-2>circle{fill:#edf2e5;stroke:#a3b783}
.ms-review-cue{opacity:0;transition:opacity .5s}
[data-state="practice"][data-phase="1"] .ms-review-cue{opacity:1;stroke:#bb597f;stroke-dasharray:4 3;animation:ms-review-focus 2s ease-in-out infinite}
.ms-guide-cursor,.ms-guide-pointer{transition:translate 1.1s ease}
[data-state="support"][data-phase="1"] .ms-guide-cursor,[data-state="support"][data-phase="1"] .ms-guide-pointer{translate:0 10px}
[data-state="support"][data-phase="2"] .ms-guide-cursor,[data-state="support"][data-phase="2"] .ms-guide-pointer{translate:0 20px}
.ms-feedback-first{transition:opacity .6s}
.ms-feedback-next{opacity:.22;stroke-dasharray:123;stroke-dashoffset:123;transition:opacity .8s,stroke-dashoffset 1.2s}
[data-state="feedback"][data-phase="1"] .ms-feedback-first,[data-state="feedback"][data-phase="2"] .ms-feedback-first{opacity:.45}
[data-state="feedback"][data-phase="2"] .ms-feedback-next{opacity:1;stroke-dashoffset:0}
.ms-condition>rect{transition:fill .6s,stroke .6s}
[data-state="context"][data-phase="0"] .ms-condition-0>rect,
[data-state="context"][data-phase="1"] .ms-condition-1>rect,
[data-state="context"][data-phase="2"] .ms-condition-2>rect{fill:#edf2e5;stroke:#aebf92}
[data-music-scene][data-playing="false"] *,[data-music-scene][data-playing="false"] *::before,[data-music-scene][data-playing="false"] *::after{animation-play-state:paused!important}
@keyframes ms-observe{0%,100%{stroke-opacity:.6}50%{stroke-opacity:1}}
@keyframes ms-review-focus{0%,100%{stroke-opacity:.65}50%{stroke-opacity:1}}
@media(max-width:600px){.ms-scene-caption{font-size:11px;max-width:330px;min-height:3.4em}}
@media(prefers-reduced-motion:reduce){[data-music-scene] *,[data-music-scene] *::before,[data-music-scene] *::after{animation:none!important;transition:none!important}.ms-feedback-next{opacity:1;stroke-dashoffset:0}}