/* The drummer's controls, on the front page. */
.drummer-panel { padding: 16px; margin-bottom: 24px; }
.drummer-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.drummer-row label { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); }
.drummer-about { margin: 10px 0 0; font-size: 13px; color: var(--muted); }
.drummer-groups { display: flex; flex-wrap: wrap; gap: 18px 36px; margin-top: 14px; }
.drummer-group h3 { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); margin: 0 0 8px; }

/* The kit, each part lit as it's played. */
.drummer-lights { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.drummer-light { min-width: 56px; padding: 8px; border-radius: 8px; background: var(--bg); border: 1px solid var(--line); text-align: center; font: 600 13px var(--mono); color: var(--muted); transition: background 0.3s, color 0.3s, border-color 0.3s; }
.drummer-light.on { background: var(--accent); border-color: var(--accent); color: #fff; transition: none; }