.rests-lesson .rests-scene{flex-direction:column;align-items:center;width:100%;display:flex}.rests-lesson .rests-canvas,.rests-lesson .rests-scene>.engraved-row,.rests-lesson .rests-gap-wrap>.engraved-row{width:100%;height:clamp(260px,42dvh,400px);max-height:none}.rests-lesson .rests-gap-wrap{touch-action:none;width:100%}.rests-lesson .measures-tools{height:52px;min-height:52px;margin:0}.rests-hit{fill:#0000;stroke:#0000;stroke-width:2px;cursor:pointer;touch-action:none;outline:none}:is(.rests-hit:hover,.rests-hit:focus-visible){stroke:#79588e;fill:#eee7f2;fill-opacity:.15}.rests-hit.is-selected{stroke:#79588e;fill:#eee7f2;fill-opacity:.2}.rests-hit.is-right{stroke:#678956;pointer-events:none}.rests-hit.is-inviting,.rests-hit.rests-gap{stroke:#aaa6a0;stroke-dasharray:5 5}.rests-hit.is-inviting{animation:1.6s ease-in-out 2 rests-invite}.rests-count,.rests-caption{text-anchor:middle;fill:#71747e;font-family:inherit;font-size:18px;font-weight:400}.rests-count{font-size:22px;font-weight:500}.rests-pulse{fill:#85868e;transform-box:fill-box;transform-origin:50%;animation:.3s ease-out rests-pulse}.rests-tap{fill:#b65a3c}.rests-tap.is-right{fill:#678956}.rests-connection{stroke:#678956;stroke-width:3px;fill:none;pointer-events:none;stroke-linecap:round}.rests-match{touch-action:none}.rests-span{fill:none;stroke:#85868e;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}.rests-span.is-wrong{stroke:#b65a3c;stroke-width:4px}.rests-span-hit{fill:#0000;stroke:#0000;rx:12px}.rests-split-target[role=button]{cursor:pointer;outline:none}.rests-split-target[role=button] .rests-span-hit{fill:#f3f0e9;fill-opacity:.65}.rests-split-target:focus-visible .rests-span-hit{stroke:#79588e}.rests-split-in{animation:.3s both rests-split}.rests-count-in{animation:.25s both rests-reveal}.rests-drag-ghost{fill:#79588e;opacity:.7;pointer-events:none}@keyframes rests-pulse{0%{transform:scale(.7)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes rests-invite{50%{stroke:#79588e;fill:#eee7f2;fill-opacity:.2}}@keyframes rests-split{0%{opacity:0;translate:0 -18px}to{opacity:1;translate:0}}@keyframes rests-reveal{0%{opacity:0}to{opacity:1}}@media (max-width:700px){.rests-lesson .rests-canvas,.rests-lesson .rests-scene>.engraved-row,.rests-lesson .rests-gap-wrap>.engraved-row{height:clamp(250px,40dvh,360px)}}@media (max-height:600px){.rests-lesson .rests-canvas,.rests-lesson .rests-scene>.engraved-row,.rests-lesson .rests-gap-wrap>.engraved-row{height:240px}}@media (prefers-reduced-motion:reduce){.rests-hit.is-inviting,.rests-pulse,.rests-split-in,.rests-count-in{animation:none}}.rests-return{pointer-events:none;animation:.8s both rests-return}@keyframes rests-return{0%,45%{opacity:.6;transform:none}to{opacity:0;transform:translate(var(--return-x),var(--return-y))}}@media (prefers-reduced-motion:reduce){.rests-return{opacity:0;animation:none}}.rests-hit:hover,.rests-hit.is-selected,.rests-hit.is-right{stroke:#0000;fill:#0000}.rests-hit:focus-visible{stroke:#678956;fill:#0000}.rests-match .rests-hit:hover{fill:#678956;fill-opacity:.05}.rests-selection{fill:none;stroke:#678956;stroke-width:2px;pointer-events:none}.rests-connection.is-drawing{stroke:#678956}.rests-cut{stroke:#b9362e;stroke-width:2px;stroke-dasharray:4 4;pointer-events:none}.rests-cut-hit{fill:#0000;touch-action:none}:is(.rests-split-target:hover .rests-cut,.rests-split-target:focus-visible .rests-cut){stroke-width:3px;stroke-dasharray:none}.rests-split-target{touch-action:none}
