/* Strings' controls, for its own page and the front page. */
h2.inline { margin: 0 8px 0 0; }
.sg-panel { padding: 16px; margin-bottom: 24px; }
.sg-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.sg-row label { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); }
.sg-groups { display: flex; flex-wrap: wrap; gap: 18px 36px; }
.sg-group h3 { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); margin: 0 0 8px; }
.knobs { display: flex; flex-wrap: wrap; gap: 8px 4px; }
/* The section's four notes now, low to high. */
.sg-voicing { display: flex; gap: 8px; margin-top: 14px; min-height: 36px; }
.sg-note { font: 600 15px var(--mono); padding: 6px 12px; border-radius: 8px; border: 1px solid var(--accent); background: var(--accent-soft); }