#tone-deaf .td-q { min-height: 1.3em; }
#tone-deaf .td-fb { min-height: 3em; margin-top: 4px; }
#tone-deaf .td-stats { display: flex; justify-content: center; gap: 24px; margin-top: 8px; font-size: 15px; color: #d6d3d1; }
#tone-deaf .td-stats b { color: #fff; font-variant-numeric: tabular-nums; }
#tone-deaf .td-actions { margin-top: 14px; }
#tone-deaf .td-answers { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; max-width: 520px; }
#tone-deaf .td-ans { min-height: 64px; font-size: 18px; }
#tone-deaf .td-keys { margin: 10px 0 0; }
#tone-deaf .td-result { margin-top: 16px; border-top: 1px solid var(--line); }
#tone-deaf .td-h { margin: 16px 0 6px; }
#tone-deaf .td-big { font: 600 40px/1.1 var(--sans); color: var(--ink); margin: 6px 0; font-variant-numeric: tabular-nums; }
#tone-deaf .td-fig { margin: 12px 0 0; }
#tone-deaf .td-chart { width: 100%; max-width: 640px; height: auto; display: block; }
#tone-deaf .td-grid { stroke: var(--line); stroke-width: 1; }
#tone-deaf .td-ax { fill: var(--muted); font: 500 13px var(--sans); text-anchor: end; dominant-baseline: central; }
#tone-deaf .td-th { stroke: var(--ok); stroke-width: 2; stroke-dasharray: 6 4; }
#tone-deaf .td-line { fill: none; stroke: var(--line-strong); stroke-width: 1.5; }
#tone-deaf .td-dot { fill: var(--card); stroke: var(--ink); stroke-width: 1.5; }
#tone-deaf .td-dot.ok { fill: var(--ink); }