button.preview-card{text-align:left;width:100%;font:inherit;cursor:pointer;border:0;padding:0}.preview-card--tuner .preview-card__stage{background:var(--tint-green)}.preview-card--metronome .preview-card__stage{background:var(--tint-sand)}.preview-card--drone .preview-card__stage{background:var(--tint-pink)}.tool-demo{box-sizing:border-box;color:#292a33;flex-direction:column;justify-content:center;gap:8px;width:100%;height:100%;padding:14px 22px;display:flex}.tuner-demo__read{justify-content:space-between;align-items:baseline;display:flex}.tuner-demo__read b{letter-spacing:-.03em;font-size:30px;font-weight:760}.tuner-demo__read sup{color:#6b7078;margin-left:1px;font-size:13px;font-weight:600}.tuner-demo__read em{font-variant-numeric:tabular-nums;font-size:14px;font-style:normal;font-weight:650}.tool-demo .is-in{color:#4f8a45}.tool-demo .is-near{color:#c3881f}.tool-demo .is-off{color:#c54a3d}.tuner-demo__ruler{justify-content:space-between;align-items:center;height:22px;display:flex;position:relative}.tuner-demo__ruler i{background:#b9bcc2;width:1px;height:8px}.tuner-demo__ruler i.is-major{background:#8a8d94;height:14px}.tuner-demo__needle{background:currentColor;border-radius:2px;width:3px;margin-left:-1.5px;transition:left .5s cubic-bezier(.2,.8,.2,1);position:absolute;top:-2px;bottom:-2px}.tuner-demo__scale{color:#8a8d94;font-variant-numeric:tabular-nums;justify-content:space-between;font-size:10px;display:flex}.metronome-demo{align-items:center;gap:14px}.metronome-demo__beats{gap:14px;display:flex}.metronome-demo__beats i{background:#e2d7c2;border-radius:50%;width:16px;height:16px;transition:background-color 80ms,transform 80ms}.metronome-demo__beats i.is-accent{width:20px;height:20px;margin-top:-2px}.metronome-demo__beats i.is-on{background:#8a6a2f;transform:scale(1.12)}.metronome-demo p{color:#6b5a39;margin:0;font-size:15px;font-weight:650}.drone-demo{flex-direction:row;align-items:center;gap:16px}.drone-demo b{color:#68466b;font-size:30px;font-weight:760}.drone-demo svg{flex:1;height:40px;overflow:hidden}.drone-demo__wave{fill:none;stroke:#b37ab0;stroke-width:2.5px;stroke-linecap:round}.drone-demo.is-on .drone-demo__wave{animation:1.6s linear infinite drone-wave}@keyframes drone-wave{to{transform:translate(-50px)}}@media (prefers-reduced-motion:reduce){.tuner-demo__needle,.metronome-demo__beats i{transition:none}.drone-demo__wave{animation:none!important}}.preview-card--tendency .preview-card__stage{background:var(--tint-slate)}.tendency-demo{gap:6px}.tendency-demo__cells{grid-template-columns:repeat(12,minmax(0,1fr));gap:4px;display:grid}.tendency-demo__cells i{background:#e3e6ea;border-radius:6px;height:30px;transition:background-color .25s}.tendency-demo__cells i.is-tune{background:#d6e4cf}.tendency-demo__cells i.is-flat{background:color-mix(in srgb,#6b9ae0 calc(var(--lean)*70%),#e6edf7)}.tendency-demo__cells i.is-sharp{background:color-mix(in srgb,#e8925a calc(var(--lean)*70%),#f8ebe0)}.tendency-demo__names{color:#8a8d94;justify-content:space-between;font-size:11px;display:flex}@media (prefers-reduced-motion:reduce){.tendency-demo__cells i{transition:none}}