.rhythm-demo{margin:32px 0;padding:clamp(16px,3vw,32px);background:#181d21;border:1px solid #3a5159;border-radius:20px}.rhythm-demo h3{margin-top:0}.rhythm-grid,.rhythm-score{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px;margin:24px 0}.rhythm-slot,.rhythm-score>div{min-width:0;text-align:center;border:1px solid #42515a;border-radius:8px;padding:14px 2px;background:#101518}.rhythm-slot span,.rhythm-slot b,.rhythm-score small,.rhythm-score strong,.rhythm-score span{display:block}.rhythm-slot b{color:#a6e2dd;font-size:20px}.rhythm-slot.active{background:#244c53;border-color:#bcfff2;box-shadow:inset 0 -3px #a6e2dd}.rhythm-controls{display:flex;flex-wrap:wrap;gap:10px}.rhythm-controls button{font:inherit;font-size:16px;cursor:pointer;padding:12px 16px;border:1px solid #81b5b2;border-radius:99px;color:#ddf7f3;background:#183536}.rhythm-controls button:disabled{opacity:.45;cursor:default}.rhythm-controls button:focus-visible{outline:3px solid white;outline-offset:3px}.rhythm-status{min-height:2em;color:#a6e2dd}.rhythm-caption{font-size:14px!important;line-height:1.7!important;color:#abb6bd}.rhythm-score strong{font-size:18px}.rhythm-score span{font-size:14px}.rhythm-errors dt{font-weight:650;color:#c7eeea;margin-top:22px}.rhythm-errors dd{margin:6px 0 0}.rhythm-lesson section{scroll-margin-top:110px}.rhythm-lesson p{overflow-wrap:anywhere}@media(max-width:480px){.rhythm-grid,.rhythm-score{gap:3px}.rhythm-slot{padding:12px 0}.rhythm-score strong{font-size:16px}.rhythm-score span{font-size:12px}}
