.rhythm-figure-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.rhythm-figure-strip article{display:grid;place-items:center;gap:5px;min-height:145px;padding:13px;border:1px solid #29415d;border-radius:13px;background:#08111f;color:#fff;text-align:center}.rhythm-figure-strip article>b{color:#5cf0ad;font:700 2.25rem/1.1 "Noto Music",serif;white-space:nowrap}.rhythm-figure-strip strong{font-size:.9rem}.rhythm-figure-strip span{color:#43ddea;font-size:.78rem;font-weight:900}.visual-score .rhythm-step{grid-template-rows:14px 30px 14px;min-height:70px}.visual-score .rhythm-step em{color:#69efb0;font-size:.72rem;font-style:normal;font-weight:950}.visual-score .rhythm-step>b{font:700 1.75rem/1 "Noto Music",serif}.visual-score .rhythm-step.rest>b{color:#8fa0b5}.rhythm-articulation-key{display:flex;gap:12px;flex-wrap:wrap;margin-top:9px;color:#9fb0c3;font-size:.72rem}.rhythm-articulation-key b{color:#62efb0;font-size:.9rem}@media(max-width:900px){.rhythm-figure-strip{grid-template-columns:repeat(3,1fr)}}@media(max-width:600px){.rhythm-figure-strip{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:5px}.rhythm-figure-strip article{flex:0 0 145px;scroll-snap-align:start}.visual-score .rhythm-step{min-width:34px}}
.rhythm-pattern-grid:has(.score-card){grid-template-columns:1fr}.score-card{overflow:hidden}.engraved-score{overflow:hidden;margin:0 -4px;padding:8px 4px 12px;border-radius:10px;background:#fff}.engraved-score svg{display:block;width:100%;min-width:0;height:auto}.staff-line{stroke:#26323b;stroke-width:1}.bar-line{stroke:#182128;stroke-width:1.7}.score-clef{fill:#111;font:48px "Noto Music","Times New Roman",serif}.score-meter{fill:#111;font:700 18px Georgia,serif;text-anchor:middle}.note-head{fill:#111;stroke:#111}.note-open{fill:#fff;stroke:#111;stroke-width:2}.note-cross,.note-stem,.note-beam,.note-flag{fill:none;stroke:#111;stroke-width:2.4;stroke-linecap:round}.note-beam{stroke-width:5}.note-beam.thin{stroke-width:3.5}.note-dot{fill:#111}.score-rest{fill:#111;font:28px "Noto Music","Times New Roman",serif}.pick-mark{fill:#111;font:700 13px Arial,sans-serif}.score-measure{transition:opacity .16s ease}.score-measure.playing{filter:drop-shadow(0 0 4px #23df93)}.score-measure.playing .note-head,.score-measure.playing .note-cross,.score-measure.playing .note-stem,.score-measure.playing .note-beam,.score-measure.playing .note-flag,.score-measure.playing .bar-line{stroke:#078858}.score-measure.playing .note-head{fill:#078858}.rhythm-playback-progress{position:relative;height:28px;overflow:hidden;margin:10px 0 0;border:1px solid #24435b;border-radius:999px;background:#07101c}.rhythm-playback-progress i{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,#1cdf8d,#48efba);transition:width .12s linear}.rhythm-playback-progress span{position:relative;z-index:1;display:grid;height:100%;place-items:center;color:#eaf8f2;font-size:.78rem;font-style:normal;font-weight:900}.score-card header span{color:#43ddea}.score-card header strong{margin-bottom:10px}@media(max-width:600px){.engraved-score{margin-inline:-10px;padding-inline:10px}.rhythm-figure-strip{scrollbar-width:none}.rhythm-figure-strip::-webkit-scrollbar{display:none}.score-card .rhythm-card-actions{align-items:stretch;flex-direction:column}.score-card .rhythm-card-actions button{width:100%}.rhythm-playback-progress{height:32px;margin-top:12px}.rhythm-playback-progress span{font-size:.84rem}}
