.three-step-summary{font-weight:750;color:var(--forest);margin:20px 0 12px}.phrase-scroll{overflow-x:auto;padding:4px 0 12px}.rhythm-phrase{display:grid;gap:14px}.phrase-package{padding:16px 10px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}.phrase-package:nth-child(2){background:#eef4fa}.phrase-package:nth-child(3){background:#f8f0ed}.phrase-package:nth-child(4){background:#f1eef8}.phrase-package h3{font-size:13px;display:flex;justify-content:space-between;gap:10px;margin:0 0 12px}.phrase-package h3 small{font-weight:400}.phrase-track{display:grid;grid-template-columns:repeat(8,minmax(29px,1fr));position:relative}.phrase-track:before{content:"";position:absolute;left:6%;right:6%;top:15px;height:2px;background:#ccd3d1}.phrase-slot{z-index:1;text-align:center;font-size:12px}.step-dot{display:grid;place-items:center;width:30px;height:30px;margin:auto auto 6px;border-radius:50%;color:#687077;background:#f3f3ee}.step-hit .step-dot{background:#235c56;color:white;border:2px solid #122e32;font-weight:800;box-shadow:0 3px 0 #122e32}.step-hit:nth-child(even) .step-dot{background:#865048}.sounding .step-dot{outline:3px solid #d0952d;outline-offset:3px}.sounding.step-hit .step-dot{background:#f4d67e;color:#172f36}.phrase-slot small{white-space:nowrap;font-variant-numeric:tabular-nums}@media(prefers-reduced-motion:no-preference){.step-dot{transition:background .1s}}
.preset-gallery{margin-top:36px}.preset-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.preset-card{border:2px solid var(--line);border-radius:18px;padding:24px;background:var(--paper);min-width:0}.preset-card:nth-child(3n+2){background:#edf3f7}.preset-card:nth-child(3n){background:#f6eee8}.preset-card.selected{border-color:#286e65;box-shadow:0 0 0 2px #286e6520}.preset-card h3{margin:16px 0 22px}.preset-count{margin:16px 0;font-weight:650;letter-spacing:.04em}.preset-card .phrase-track{min-width:250px}.preset-card .btn{width:100%}@media(max-width:800px){.preset-cards{grid-template-columns:1fr}.preset-card{padding:20px 14px}}