/* 节拍器工具区样式 */
.metro-card{max-width:720px;margin:14px auto;background:#1f2430;color:#f2f0e9;border-radius:18px;padding:22px 20px 18px;box-shadow:0 10px 30px rgba(20,20,40,.25);text-align:center}
.pulse-wrap{display:flex;justify-content:center;margin:2px 0 4px}
#pulse{width:92px;height:92px;border-radius:50%;background:#2b3245;border:4px solid #3d4763;display:flex;align-items:center;justify-content:center;font-size:13px;color:#aeb8d0;transition:background .05s}
#pulse.beat{background:#e8873a;border-color:#f5a85c;color:#fff}
#pulse.accent{background:#d63c2f;border-color:#ef6a5c;color:#fff}
.bpm-row{display:flex;align-items:center;justify-content:center;gap:10px;margin:4px 0}
.bpm-row button{width:44px;height:44px;border-radius:50%;border:1px solid #4a5470;background:#2b3245;color:#f2f0e9;font-size:18px;cursor:pointer}
.bpm-row button:hover{background:#38415a}
.bpm-num{font-size:64px;font-weight:800;line-height:1;min-width:150px}
.bpm-unit{font-size:16px;color:#aeb8d0;text-align:center}
#tempoTerm{color:#f5a85c;font-size:15px;margin-top:2px}
input[type=range]{accent-color:#e8873a}
#tempo{width:min(520px,88%);height:32px}
.tempo-num-row{display:flex;justify-content:center;align-items:center;gap:8px;margin:2px 0 8px;color:#aeb8d0;font-size:14px}
#tempoNum{width:76px;padding:6px 8px;border-radius:8px;border:1px solid #4a5470;background:#171b26;color:#fff;font-size:16px;text-align:center}
.beat-dots{display:flex;justify-content:center;gap:10px;margin:14px 0 6px;flex-wrap:wrap}
.dot{width:38px;height:38px;border-radius:50%;background:#2b3245;border:2px solid #4a5470;color:#8d97b5;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}
.dot.first{border-color:#ef6a5c}
.dot.on{background:#e8873a;border-color:#f5a85c;color:#fff;transform:scale(1.14)}
.dot.on.sub{background:#7c8db5;border-color:#aeb8d0;transform:scale(1.05)}
.controls-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px 16px;margin:14px auto 6px;max-width:560px;text-align:left}
.controls-grid label{font-size:13px;color:#aeb8d0;display:block;margin-bottom:4px}
.controls-grid select{width:100%;padding:9px;border-radius:8px;border:1px solid #4a5470;background:#171b26;color:#fff;font-size:15px}
.controls-grid input[type=range]{width:100%}
.play-row{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:14px 0 6px}
#playBtn{background:#d63c2f;color:#fff;border:none;font-size:20px;font-weight:700;padding:13px 44px;border-radius:999px;cursor:pointer}
#playBtn:hover{background:#e04a3d}
#playBtn.playing{background:#3d4763}
#tapBtn{background:#2b3245;color:#f5a85c;border:1px solid #e8873a;font-size:16px;padding:13px 22px;border-radius:999px;cursor:pointer}
.presets{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:10px 0 2px}
.preset{background:#171b26;color:#d7dce9;border:1px solid #4a5470;border-radius:999px;padding:6px 13px;cursor:pointer;font-size:13px}
.preset:hover{border-color:#e8873a;color:#f5a85c}
.status{color:#aeb8d0;font-size:14px;margin:8px 0 0}
.status strong{color:#fff}