.tone{margin:var(--ds-space-lg) 0;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ds-space-md)}.tone-head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--ds-space-sm);padding:var(--ds-space-md);background:var(--ds-paper);border:var(--ds-rule-hair) solid var(--ds-rule)}.tone-readout{display:flex;align-items:baseline;gap:var(--ds-space-xs);margin:0;font-family:var(--ds-font-mono);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}.tone-readout-hz{font-size:var(--ds-text-lg);font-weight:600;line-height:var(--ds-leading-heading);color:var(--ds-ink)}.tone-readout-note{font-size:var(--ds-text-base);color:var(--ds-muted)}.tone-preview{flex:1 1 8rem;min-width:6rem;height:3rem;color:var(--ds-ink-2);background:var(--ds-paper-2);border:var(--ds-rule-hair) solid var(--ds-rule);border-radius:var(--ds-radius-well);box-shadow:inset 0 2px 4px var(--ds-recess-top),inset 0 -1px 0 var(--ds-recess-lip)}.tone-preview-midline{stroke:var(--ds-rule);stroke-width:1;vector-effect:non-scaling-stroke}.tone-preview-trace{fill:none;stroke:currentColor;stroke-width:2;vector-effect:non-scaling-stroke}.tone-frequency,.tone-presets,.tone-settings,.tone-checks{display:flex;flex-wrap:wrap;align-items:center;gap:var(--ds-space-xs) var(--ds-space-sm);padding:var(--ds-space-md);background:var(--ds-paper);border:var(--ds-rule-hair) solid var(--ds-rule)}.tone-slider{flex:1 1 12rem;min-width:8rem;height:var(--ds-target-min);accent-color:var(--ds-ink)}.tone-frequency-fields{display:flex;align-items:center;gap:var(--ds-space-xs)}.tone-frequency-fields button{min-width:var(--ds-target-min);padding:var(--ds-space-2xs) var(--ds-space-sm);font-family:var(--ds-font-mono)}.tone-hz-input{width:6rem;min-height:var(--ds-target-min);padding:var(--ds-space-2xs) var(--ds-space-xs);background:var(--ds-paper-2);color:var(--ds-ink);border:var(--ds-rule-hair) solid var(--ds-rule);border-radius:var(--ds-radius-control);box-shadow:inset 0 2px 4px var(--ds-recess-top),inset 0 -1px 0 var(--ds-recess-lip);font-family:var(--ds-font-mono);font-size:var(--ds-text-base);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;text-align:right}.tone-preset-row{display:flex;flex-wrap:wrap;gap:var(--ds-space-xs)}.tone-preset-row button{padding:var(--ds-space-2xs) var(--ds-space-sm);font-family:var(--ds-font-mono);font-size:var(--ds-text-sm);font-variant-numeric:tabular-nums}.tone-group{display:inline-flex;flex-wrap:wrap;align-items:center;gap:var(--ds-space-xs)}.tone-field{display:inline-flex;align-items:center;gap:var(--ds-space-xs)}.tone-field>span{font-family:var(--ds-font-mono);font-size:var(--ds-text-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--ds-muted)}.tone-field select{min-width:4.5rem}.tone-field input[type=range]{width:7rem;height:var(--ds-target-min);accent-color:var(--ds-ink)}.tone-field output{min-width:2.6rem;font-family:var(--ds-font-mono);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;font-size:var(--ds-text-base)}.tone .meter-ghost[aria-pressed=true]{background:var(--ds-ink);border-color:var(--ds-ink);color:var(--ds-paper)}.tone-steps{flex:1 0 100%;display:flex;flex-wrap:wrap;align-items:center;gap:var(--ds-space-xs);margin:0;padding:0;list-style:none;font-size:var(--ds-text-sm);color:var(--ds-muted)}.tone-steps li{display:flex;align-items:center;gap:var(--ds-space-xs)}.tone-steps li:not(:last-child):after{content:"→";color:var(--ds-muted)}.tone-steps span{padding:.2rem .55rem;border-radius:var(--ds-radius-chip)}.tone-steps li[data-active=true] span{background:var(--ds-ink);color:var(--ds-paper)}.tone-note{flex:1 0 100%;margin:0}.tone-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--ds-space-xs)}.tone-actions .meter-warn{margin:0}