/* Key-selection and chord-highlighting rules.

   PROVENANCE, which is mixed — check before hand-editing anything here:

   - The chord-highlight section and the chord-button names at the foot of this
     file are generated by the COMMITTED tools/gen-sevenths.js (`chords` and
     `names`). Edit that generator, not this output.
   - Reveal groups and tonic rules came from gen-keys.js and chord-strip reveal
     rules from gen-chords.js. Both were scratch files and are LOST, so those
     sections are hand-maintained until someone rewrites them.
   - Spelling rules were hand-authored from a plan template.

   gen-chord-rules.js, which originally produced the chord-highlight section, is
   also lost — but it has effectively been recovered: gen-sevenths.js keeps a
   `legacy-dim` mode that reproduces the pre-sevenths form of that section byte
   for byte, which is what proved its derivation before it was allowed to rewrite
   it. Run that diff before trusting any change to the section below.

   See docs/superpowers/plans/2026-07-25-key-selection.md,
   docs/superpowers/plans/2026-07-26-chord-highlighting.md and
   docs/superpowers/specs/2026-07-27-seventh-chords-design.md. */

/* Note reveal: a key shows its 7 tones. Relative major/minor share a set. */

main:has(#key-c-major:checked) .note.tone-c,
main:has(#key-a-minor:checked) .note.tone-c,
main:has(#key-c-major:checked) .note.tone-d,
main:has(#key-a-minor:checked) .note.tone-d,
main:has(#key-c-major:checked) .note.tone-e,
main:has(#key-a-minor:checked) .note.tone-e,
main:has(#key-c-major:checked) .note.tone-f,
main:has(#key-a-minor:checked) .note.tone-f,
main:has(#key-c-major:checked) .note.tone-g,
main:has(#key-a-minor:checked) .note.tone-g,
main:has(#key-c-major:checked) .note.tone-a,
main:has(#key-a-minor:checked) .note.tone-a,
main:has(#key-c-major:checked) .note.tone-b,
main:has(#key-a-minor:checked) .note.tone-b {
  display: grid;
}

main:has(#key-g-major:checked) .note.tone-g,
main:has(#key-e-minor:checked) .note.tone-g,
main:has(#key-g-major:checked) .note.tone-a,
main:has(#key-e-minor:checked) .note.tone-a,
main:has(#key-g-major:checked) .note.tone-b,
main:has(#key-e-minor:checked) .note.tone-b,
main:has(#key-g-major:checked) .note.tone-c,
main:has(#key-e-minor:checked) .note.tone-c,
main:has(#key-g-major:checked) .note.tone-d,
main:has(#key-e-minor:checked) .note.tone-d,
main:has(#key-g-major:checked) .note.tone-e,
main:has(#key-e-minor:checked) .note.tone-e,
main:has(#key-g-major:checked) .note.tone-fs,
main:has(#key-e-minor:checked) .note.tone-fs {
  display: grid;
}

main:has(#key-d-major:checked) .note.tone-d,
main:has(#key-b-minor:checked) .note.tone-d,
main:has(#key-d-major:checked) .note.tone-e,
main:has(#key-b-minor:checked) .note.tone-e,
main:has(#key-d-major:checked) .note.tone-fs,
main:has(#key-b-minor:checked) .note.tone-fs,
main:has(#key-d-major:checked) .note.tone-g,
main:has(#key-b-minor:checked) .note.tone-g,
main:has(#key-d-major:checked) .note.tone-a,
main:has(#key-b-minor:checked) .note.tone-a,
main:has(#key-d-major:checked) .note.tone-b,
main:has(#key-b-minor:checked) .note.tone-b,
main:has(#key-d-major:checked) .note.tone-cs,
main:has(#key-b-minor:checked) .note.tone-cs {
  display: grid;
}

main:has(#key-a-major:checked) .note.tone-a,
main:has(#key-fs-minor:checked) .note.tone-a,
main:has(#key-a-major:checked) .note.tone-b,
main:has(#key-fs-minor:checked) .note.tone-b,
main:has(#key-a-major:checked) .note.tone-cs,
main:has(#key-fs-minor:checked) .note.tone-cs,
main:has(#key-a-major:checked) .note.tone-d,
main:has(#key-fs-minor:checked) .note.tone-d,
main:has(#key-a-major:checked) .note.tone-e,
main:has(#key-fs-minor:checked) .note.tone-e,
main:has(#key-a-major:checked) .note.tone-fs,
main:has(#key-fs-minor:checked) .note.tone-fs,
main:has(#key-a-major:checked) .note.tone-gs,
main:has(#key-fs-minor:checked) .note.tone-gs {
  display: grid;
}

main:has(#key-e-major:checked) .note.tone-e,
main:has(#key-cs-minor:checked) .note.tone-e,
main:has(#key-e-major:checked) .note.tone-fs,
main:has(#key-cs-minor:checked) .note.tone-fs,
main:has(#key-e-major:checked) .note.tone-gs,
main:has(#key-cs-minor:checked) .note.tone-gs,
main:has(#key-e-major:checked) .note.tone-a,
main:has(#key-cs-minor:checked) .note.tone-a,
main:has(#key-e-major:checked) .note.tone-b,
main:has(#key-cs-minor:checked) .note.tone-b,
main:has(#key-e-major:checked) .note.tone-cs,
main:has(#key-cs-minor:checked) .note.tone-cs,
main:has(#key-e-major:checked) .note.tone-ds,
main:has(#key-cs-minor:checked) .note.tone-ds {
  display: grid;
}

main:has(#key-b-major:checked) .note.tone-b,
main:has(#key-gs-minor:checked) .note.tone-b,
main:has(#key-b-major:checked) .note.tone-cs,
main:has(#key-gs-minor:checked) .note.tone-cs,
main:has(#key-b-major:checked) .note.tone-ds,
main:has(#key-gs-minor:checked) .note.tone-ds,
main:has(#key-b-major:checked) .note.tone-e,
main:has(#key-gs-minor:checked) .note.tone-e,
main:has(#key-b-major:checked) .note.tone-fs,
main:has(#key-gs-minor:checked) .note.tone-fs,
main:has(#key-b-major:checked) .note.tone-gs,
main:has(#key-gs-minor:checked) .note.tone-gs,
main:has(#key-b-major:checked) .note.tone-as,
main:has(#key-gs-minor:checked) .note.tone-as {
  display: grid;
}

main:has(#key-fs-major:checked) .note.tone-fs,
main:has(#key-ds-minor:checked) .note.tone-fs,
main:has(#key-fs-major:checked) .note.tone-gs,
main:has(#key-ds-minor:checked) .note.tone-gs,
main:has(#key-fs-major:checked) .note.tone-as,
main:has(#key-ds-minor:checked) .note.tone-as,
main:has(#key-fs-major:checked) .note.tone-b,
main:has(#key-ds-minor:checked) .note.tone-b,
main:has(#key-fs-major:checked) .note.tone-cs,
main:has(#key-ds-minor:checked) .note.tone-cs,
main:has(#key-fs-major:checked) .note.tone-ds,
main:has(#key-ds-minor:checked) .note.tone-ds,
main:has(#key-fs-major:checked) .note.tone-f,
main:has(#key-ds-minor:checked) .note.tone-f {
  display: grid;
}

main:has(#key-db-major:checked) .note.tone-cs,
main:has(#key-bb-minor:checked) .note.tone-cs,
main:has(#key-db-major:checked) .note.tone-ds,
main:has(#key-bb-minor:checked) .note.tone-ds,
main:has(#key-db-major:checked) .note.tone-f,
main:has(#key-bb-minor:checked) .note.tone-f,
main:has(#key-db-major:checked) .note.tone-fs,
main:has(#key-bb-minor:checked) .note.tone-fs,
main:has(#key-db-major:checked) .note.tone-gs,
main:has(#key-bb-minor:checked) .note.tone-gs,
main:has(#key-db-major:checked) .note.tone-as,
main:has(#key-bb-minor:checked) .note.tone-as,
main:has(#key-db-major:checked) .note.tone-c,
main:has(#key-bb-minor:checked) .note.tone-c {
  display: grid;
}

main:has(#key-ab-major:checked) .note.tone-gs,
main:has(#key-f-minor:checked) .note.tone-gs,
main:has(#key-ab-major:checked) .note.tone-as,
main:has(#key-f-minor:checked) .note.tone-as,
main:has(#key-ab-major:checked) .note.tone-c,
main:has(#key-f-minor:checked) .note.tone-c,
main:has(#key-ab-major:checked) .note.tone-cs,
main:has(#key-f-minor:checked) .note.tone-cs,
main:has(#key-ab-major:checked) .note.tone-ds,
main:has(#key-f-minor:checked) .note.tone-ds,
main:has(#key-ab-major:checked) .note.tone-f,
main:has(#key-f-minor:checked) .note.tone-f,
main:has(#key-ab-major:checked) .note.tone-g,
main:has(#key-f-minor:checked) .note.tone-g {
  display: grid;
}

main:has(#key-eb-major:checked) .note.tone-ds,
main:has(#key-c-minor:checked) .note.tone-ds,
main:has(#key-eb-major:checked) .note.tone-f,
main:has(#key-c-minor:checked) .note.tone-f,
main:has(#key-eb-major:checked) .note.tone-g,
main:has(#key-c-minor:checked) .note.tone-g,
main:has(#key-eb-major:checked) .note.tone-gs,
main:has(#key-c-minor:checked) .note.tone-gs,
main:has(#key-eb-major:checked) .note.tone-as,
main:has(#key-c-minor:checked) .note.tone-as,
main:has(#key-eb-major:checked) .note.tone-c,
main:has(#key-c-minor:checked) .note.tone-c,
main:has(#key-eb-major:checked) .note.tone-d,
main:has(#key-c-minor:checked) .note.tone-d {
  display: grid;
}

main:has(#key-bb-major:checked) .note.tone-as,
main:has(#key-g-minor:checked) .note.tone-as,
main:has(#key-bb-major:checked) .note.tone-c,
main:has(#key-g-minor:checked) .note.tone-c,
main:has(#key-bb-major:checked) .note.tone-d,
main:has(#key-g-minor:checked) .note.tone-d,
main:has(#key-bb-major:checked) .note.tone-ds,
main:has(#key-g-minor:checked) .note.tone-ds,
main:has(#key-bb-major:checked) .note.tone-f,
main:has(#key-g-minor:checked) .note.tone-f,
main:has(#key-bb-major:checked) .note.tone-g,
main:has(#key-g-minor:checked) .note.tone-g,
main:has(#key-bb-major:checked) .note.tone-a,
main:has(#key-g-minor:checked) .note.tone-a {
  display: grid;
}

main:has(#key-f-major:checked) .note.tone-f,
main:has(#key-d-minor:checked) .note.tone-f,
main:has(#key-f-major:checked) .note.tone-g,
main:has(#key-d-minor:checked) .note.tone-g,
main:has(#key-f-major:checked) .note.tone-a,
main:has(#key-d-minor:checked) .note.tone-a,
main:has(#key-f-major:checked) .note.tone-as,
main:has(#key-d-minor:checked) .note.tone-as,
main:has(#key-f-major:checked) .note.tone-c,
main:has(#key-d-minor:checked) .note.tone-c,
main:has(#key-f-major:checked) .note.tone-d,
main:has(#key-d-minor:checked) .note.tone-d,
main:has(#key-f-major:checked) .note.tone-e,
main:has(#key-d-minor:checked) .note.tone-e {
  display: grid;
}

/* Tonic highlight: the key root gets the tonic colors */
main:has(#key-c-major:checked) .note.tone-c { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-a-minor:checked) .note.tone-a { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-g-major:checked) .note.tone-g { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-e-minor:checked) .note.tone-e { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-d-major:checked) .note.tone-d { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-b-minor:checked) .note.tone-b { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-a-major:checked) .note.tone-a { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-fs-minor:checked) .note.tone-fs { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-e-major:checked) .note.tone-e { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-cs-minor:checked) .note.tone-cs { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-b-major:checked) .note.tone-b { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-gs-minor:checked) .note.tone-gs { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-fs-major:checked) .note.tone-fs { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-ds-minor:checked) .note.tone-ds { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-db-major:checked) .note.tone-cs { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-bb-minor:checked) .note.tone-as { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-ab-major:checked) .note.tone-gs { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-f-minor:checked) .note.tone-f { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-eb-major:checked) .note.tone-ds { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-c-minor:checked) .note.tone-c { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-bb-major:checked) .note.tone-as { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-g-minor:checked) .note.tone-g { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-f-major:checked) .note.tone-f { background-color: var(--tonic-bg); color: var(--tonic-fg); }
main:has(#key-d-minor:checked) .note.tone-d { background-color: var(--tonic-bg); color: var(--tonic-fg); }

/* Key-aware spelling: flat-spelled keys show only the flat name */
main:has(#key-f-major:checked)  .note b,
main:has(#key-bb-major:checked) .note b,
main:has(#key-eb-major:checked) .note b,
main:has(#key-ab-major:checked) .note b,
main:has(#key-db-major:checked) .note b,
main:has(#key-d-minor:checked)  .note b,
main:has(#key-g-minor:checked)  .note b,
main:has(#key-c-minor:checked)  .note b,
main:has(#key-f-minor:checked)  .note b,
main:has(#key-bb-minor:checked) .note b {
  display: none;
}

main:has(#key-f-major:checked)  .note i,
main:has(#key-bb-major:checked) .note i,
main:has(#key-eb-major:checked) .note i,
main:has(#key-ab-major:checked) .note i,
main:has(#key-db-major:checked) .note i,
main:has(#key-d-minor:checked)  .note i,
main:has(#key-g-minor:checked)  .note i,
main:has(#key-c-minor:checked)  .note i,
main:has(#key-f-minor:checked)  .note i,
main:has(#key-bb-minor:checked) .note i {
  font-size: inherit;
  opacity: 1;
}

/* Sharp-spelled keys hide the flat name */
main:has(#key-g-major:checked)  .note i,
main:has(#key-d-major:checked)  .note i,
main:has(#key-a-major:checked)  .note i,
main:has(#key-e-major:checked)  .note i,
main:has(#key-b-major:checked)  .note i,
main:has(#key-fs-major:checked) .note i,
main:has(#key-e-minor:checked)  .note i,
main:has(#key-b-minor:checked)  .note i,
main:has(#key-fs-minor:checked) .note i,
main:has(#key-cs-minor:checked) .note i,
main:has(#key-gs-minor:checked) .note i,
main:has(#key-ds-minor:checked) .note i {
  display: none;
}

/* Chord strip reveal: one strip per key */
main:has(#key-c-major:checked) #chords-c-major { display: flex; }
main:has(#key-a-minor:checked) #chords-a-minor { display: flex; }
main:has(#key-db-major:checked) #chords-db-major { display: flex; }
main:has(#key-bb-minor:checked) #chords-bb-minor { display: flex; }
main:has(#key-d-major:checked) #chords-d-major { display: flex; }
main:has(#key-b-minor:checked) #chords-b-minor { display: flex; }
main:has(#key-eb-major:checked) #chords-eb-major { display: flex; }
main:has(#key-c-minor:checked) #chords-c-minor { display: flex; }
main:has(#key-e-major:checked) #chords-e-major { display: flex; }
main:has(#key-cs-minor:checked) #chords-cs-minor { display: flex; }
main:has(#key-f-major:checked) #chords-f-major { display: flex; }
main:has(#key-d-minor:checked) #chords-d-minor { display: flex; }
main:has(#key-fs-major:checked) #chords-fs-major { display: flex; }
main:has(#key-ds-minor:checked) #chords-ds-minor { display: flex; }
main:has(#key-g-major:checked) #chords-g-major { display: flex; }
main:has(#key-e-minor:checked) #chords-e-minor { display: flex; }
main:has(#key-ab-major:checked) #chords-ab-major { display: flex; }
main:has(#key-f-minor:checked) #chords-f-minor { display: flex; }
main:has(#key-a-major:checked) #chords-a-major { display: flex; }
main:has(#key-fs-minor:checked) #chords-fs-minor { display: flex; }
main:has(#key-bb-major:checked) #chords-bb-major { display: flex; }
main:has(#key-g-minor:checked) #chords-g-minor { display: flex; }
main:has(#key-b-major:checked) #chords-b-major { display: flex; }
main:has(#key-gs-minor:checked) #chords-gs-minor { display: flex; }

/* Chord highlighting: selecting a chord dims the key's non-chord tones, marks its
   chord tones with their chord-relative degree, and colors the chord root.

   How many tones are dimmed depends on the voicing — four as a triad, three as a
   seventh — so the dim rules come in a MATCHED PAIR, one per voicing radio. That
   is a partition on radio mutual exclusion, not one rule overriding the other,
   and it is why neither carries a :not().

   The R/3/5 markers are deliberately UNGATED. They are identical in both
   voicings, which is what keeps 504 rules in this section untouched by the
   sevenths work. Only the seventh's own 7/b7 marker is gated, and triad mode
   shows no seventh marker by matching nothing at all — the same reset-by-absence
   that makes "All" restore the full key.

   The root rule carries two ids against the tonic rule's one, so it wins the
   cascade when a note is both key tonic and chord root. A note can also be both
   the key tonic and the chord's SEVENTH — C is the b7 of Dm7 in the key of C —
   and that needs no tie-break at all, because the tonic rule owns
   background-color while the marker rule owns content.

   No rule references #chord-<key>-all — checking it stops every rule below from
   matching, which restores the full key. */

/* c-major */
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-1:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-1:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-1:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-1:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-1:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-1:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-1:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-c-major:checked):has(#chord-c-major-1:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-major:checked):has(#chord-c-major-1:checked) .note.tone-c::after { content: "R"; }
main:has(#key-c-major:checked):has(#chord-c-major-1:checked) .note.tone-e::after { content: "3"; }
main:has(#key-c-major:checked):has(#chord-c-major-1:checked) .note.tone-g::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-1:checked) .note.tone-b::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-2:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-2:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-2:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-2:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-2:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-2:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-2:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-c-major:checked):has(#chord-c-major-2:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-major:checked):has(#chord-c-major-2:checked) .note.tone-d::after { content: "R"; }
main:has(#key-c-major:checked):has(#chord-c-major-2:checked) .note.tone-f::after { content: "b3"; }
main:has(#key-c-major:checked):has(#chord-c-major-2:checked) .note.tone-a::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-2:checked) .note.tone-c::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-3:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-3:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-3:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-3:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-3:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-3:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-3:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-c-major:checked):has(#chord-c-major-3:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-major:checked):has(#chord-c-major-3:checked) .note.tone-e::after { content: "R"; }
main:has(#key-c-major:checked):has(#chord-c-major-3:checked) .note.tone-g::after { content: "b3"; }
main:has(#key-c-major:checked):has(#chord-c-major-3:checked) .note.tone-b::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-3:checked) .note.tone-d::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-4:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-4:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-4:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-4:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-4:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-4:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-4:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-c-major:checked):has(#chord-c-major-4:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-major:checked):has(#chord-c-major-4:checked) .note.tone-f::after { content: "R"; }
main:has(#key-c-major:checked):has(#chord-c-major-4:checked) .note.tone-a::after { content: "3"; }
main:has(#key-c-major:checked):has(#chord-c-major-4:checked) .note.tone-c::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-4:checked) .note.tone-e::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-5:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-5:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-5:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-5:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-5:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-5:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-5:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-c-major:checked):has(#chord-c-major-5:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-major:checked):has(#chord-c-major-5:checked) .note.tone-g::after { content: "R"; }
main:has(#key-c-major:checked):has(#chord-c-major-5:checked) .note.tone-b::after { content: "3"; }
main:has(#key-c-major:checked):has(#chord-c-major-5:checked) .note.tone-d::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-5:checked) .note.tone-f::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-6:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-6:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-6:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-6:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-6:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-6:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-6:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-c-major:checked):has(#chord-c-major-6:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-major:checked):has(#chord-c-major-6:checked) .note.tone-a::after { content: "R"; }
main:has(#key-c-major:checked):has(#chord-c-major-6:checked) .note.tone-c::after { content: "b3"; }
main:has(#key-c-major:checked):has(#chord-c-major-6:checked) .note.tone-e::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-6:checked) .note.tone-g::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-7:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-7:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-7:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-c-major:checked):has(#chord-c-major-7:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-7:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-7:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-7:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-c-major:checked):has(#chord-c-major-7:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-major:checked):has(#chord-c-major-7:checked) .note.tone-b::after { content: "R"; }
main:has(#key-c-major:checked):has(#chord-c-major-7:checked) .note.tone-d::after { content: "b3"; }
main:has(#key-c-major:checked):has(#chord-c-major-7:checked) .note.tone-f::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-c-major:checked):has(#chord-c-major-7:checked) .note.tone-a::after { content: "b7"; }

/* a-minor */
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-1:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-1:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-1:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-1:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-1:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-1:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-1:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-1:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-1:checked) .note.tone-a::after { content: "R"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-1:checked) .note.tone-c::after { content: "b3"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-1:checked) .note.tone-e::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-1:checked) .note.tone-g::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-2:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-2:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-2:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-2:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-2:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-2:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-2:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-2:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-2:checked) .note.tone-b::after { content: "R"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-2:checked) .note.tone-d::after { content: "b3"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-2:checked) .note.tone-f::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-2:checked) .note.tone-a::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-3:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-3:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-3:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-3:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-3:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-3:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-3:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-3:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-3:checked) .note.tone-c::after { content: "R"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-3:checked) .note.tone-e::after { content: "3"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-3:checked) .note.tone-g::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-3:checked) .note.tone-b::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-4:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-4:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-4:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-4:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-4:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-4:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-4:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-4:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-4:checked) .note.tone-d::after { content: "R"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-4:checked) .note.tone-f::after { content: "b3"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-4:checked) .note.tone-a::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-4:checked) .note.tone-c::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-5:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-5:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-5:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-5:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-5:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-5:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-5:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-5:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-5:checked) .note.tone-e::after { content: "R"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-5:checked) .note.tone-g::after { content: "b3"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-5:checked) .note.tone-b::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-5:checked) .note.tone-d::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-6:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-6:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-6:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-6:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-6:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-6:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-6:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-6:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-6:checked) .note.tone-f::after { content: "R"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-6:checked) .note.tone-a::after { content: "3"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-6:checked) .note.tone-c::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-6:checked) .note.tone-e::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-7:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-7:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-7:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-a-minor:checked):has(#chord-a-minor-7:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-7:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-7:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-7:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-7:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-minor:checked):has(#chord-a-minor-7:checked) .note.tone-g::after { content: "R"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-7:checked) .note.tone-b::after { content: "3"; }
main:has(#key-a-minor:checked):has(#chord-a-minor-7:checked) .note.tone-d::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-a-minor:checked):has(#chord-a-minor-7:checked) .note.tone-f::after { content: "b7"; }

/* g-major */
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-1:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-1:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-1:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-1:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-1:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-1:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-1:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-g-major:checked):has(#chord-g-major-1:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-major:checked):has(#chord-g-major-1:checked) .note.tone-g::after { content: "R"; }
main:has(#key-g-major:checked):has(#chord-g-major-1:checked) .note.tone-b::after { content: "3"; }
main:has(#key-g-major:checked):has(#chord-g-major-1:checked) .note.tone-d::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-1:checked) .note.tone-fs::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-2:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-2:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-2:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-2:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-2:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-2:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-2:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-g-major:checked):has(#chord-g-major-2:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-major:checked):has(#chord-g-major-2:checked) .note.tone-a::after { content: "R"; }
main:has(#key-g-major:checked):has(#chord-g-major-2:checked) .note.tone-c::after { content: "b3"; }
main:has(#key-g-major:checked):has(#chord-g-major-2:checked) .note.tone-e::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-2:checked) .note.tone-g::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-3:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-3:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-3:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-3:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-3:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-3:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-3:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-g-major:checked):has(#chord-g-major-3:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-major:checked):has(#chord-g-major-3:checked) .note.tone-b::after { content: "R"; }
main:has(#key-g-major:checked):has(#chord-g-major-3:checked) .note.tone-d::after { content: "b3"; }
main:has(#key-g-major:checked):has(#chord-g-major-3:checked) .note.tone-fs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-3:checked) .note.tone-a::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-4:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-4:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-4:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-4:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-4:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-4:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-4:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-g-major:checked):has(#chord-g-major-4:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-major:checked):has(#chord-g-major-4:checked) .note.tone-c::after { content: "R"; }
main:has(#key-g-major:checked):has(#chord-g-major-4:checked) .note.tone-e::after { content: "3"; }
main:has(#key-g-major:checked):has(#chord-g-major-4:checked) .note.tone-g::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-4:checked) .note.tone-b::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-5:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-5:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-5:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-5:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-5:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-5:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-5:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-g-major:checked):has(#chord-g-major-5:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-major:checked):has(#chord-g-major-5:checked) .note.tone-d::after { content: "R"; }
main:has(#key-g-major:checked):has(#chord-g-major-5:checked) .note.tone-fs::after { content: "3"; }
main:has(#key-g-major:checked):has(#chord-g-major-5:checked) .note.tone-a::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-5:checked) .note.tone-c::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-6:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-6:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-6:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-6:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-6:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-6:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-6:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-g-major:checked):has(#chord-g-major-6:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-major:checked):has(#chord-g-major-6:checked) .note.tone-e::after { content: "R"; }
main:has(#key-g-major:checked):has(#chord-g-major-6:checked) .note.tone-g::after { content: "b3"; }
main:has(#key-g-major:checked):has(#chord-g-major-6:checked) .note.tone-b::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-6:checked) .note.tone-d::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-7:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-7:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-7:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-g-major:checked):has(#chord-g-major-7:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-7:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-7:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-7:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-g-major:checked):has(#chord-g-major-7:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-major:checked):has(#chord-g-major-7:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-g-major:checked):has(#chord-g-major-7:checked) .note.tone-a::after { content: "b3"; }
main:has(#key-g-major:checked):has(#chord-g-major-7:checked) .note.tone-c::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-g-major:checked):has(#chord-g-major-7:checked) .note.tone-e::after { content: "b7"; }

/* e-minor */
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-1:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-1:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-1:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-1:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-1:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-1:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-1:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-1:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-1:checked) .note.tone-e::after { content: "R"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-1:checked) .note.tone-g::after { content: "b3"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-1:checked) .note.tone-b::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-1:checked) .note.tone-d::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-2:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-2:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-2:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-2:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-2:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-2:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-2:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-2:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-2:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-2:checked) .note.tone-a::after { content: "b3"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-2:checked) .note.tone-c::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-2:checked) .note.tone-e::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-3:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-3:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-3:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-3:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-3:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-3:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-3:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-3:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-3:checked) .note.tone-g::after { content: "R"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-3:checked) .note.tone-b::after { content: "3"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-3:checked) .note.tone-d::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-3:checked) .note.tone-fs::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-4:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-4:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-4:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-4:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-4:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-4:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-4:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-4:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-4:checked) .note.tone-a::after { content: "R"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-4:checked) .note.tone-c::after { content: "b3"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-4:checked) .note.tone-e::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-4:checked) .note.tone-g::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-5:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-5:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-5:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-5:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-5:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-5:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-5:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-5:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-5:checked) .note.tone-b::after { content: "R"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-5:checked) .note.tone-d::after { content: "b3"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-5:checked) .note.tone-fs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-5:checked) .note.tone-a::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-6:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-6:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-6:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-6:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-6:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-6:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-6:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-6:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-6:checked) .note.tone-c::after { content: "R"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-6:checked) .note.tone-e::after { content: "3"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-6:checked) .note.tone-g::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-6:checked) .note.tone-b::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-7:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-7:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-7:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-e-minor:checked):has(#chord-e-minor-7:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-7:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-7:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-7:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-7:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-minor:checked):has(#chord-e-minor-7:checked) .note.tone-d::after { content: "R"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-7:checked) .note.tone-fs::after { content: "3"; }
main:has(#key-e-minor:checked):has(#chord-e-minor-7:checked) .note.tone-a::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-e-minor:checked):has(#chord-e-minor-7:checked) .note.tone-c::after { content: "b7"; }

/* d-major */
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-1:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-1:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-1:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-1:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-1:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-1:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-1:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-d-major:checked):has(#chord-d-major-1:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-major:checked):has(#chord-d-major-1:checked) .note.tone-d::after { content: "R"; }
main:has(#key-d-major:checked):has(#chord-d-major-1:checked) .note.tone-fs::after { content: "3"; }
main:has(#key-d-major:checked):has(#chord-d-major-1:checked) .note.tone-a::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-1:checked) .note.tone-cs::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-2:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-2:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-2:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-2:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-2:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-2:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-2:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-d-major:checked):has(#chord-d-major-2:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-major:checked):has(#chord-d-major-2:checked) .note.tone-e::after { content: "R"; }
main:has(#key-d-major:checked):has(#chord-d-major-2:checked) .note.tone-g::after { content: "b3"; }
main:has(#key-d-major:checked):has(#chord-d-major-2:checked) .note.tone-b::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-2:checked) .note.tone-d::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-3:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-3:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-3:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-3:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-3:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-3:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-3:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-d-major:checked):has(#chord-d-major-3:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-major:checked):has(#chord-d-major-3:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-d-major:checked):has(#chord-d-major-3:checked) .note.tone-a::after { content: "b3"; }
main:has(#key-d-major:checked):has(#chord-d-major-3:checked) .note.tone-cs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-3:checked) .note.tone-e::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-4:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-4:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-4:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-4:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-4:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-4:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-4:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-d-major:checked):has(#chord-d-major-4:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-major:checked):has(#chord-d-major-4:checked) .note.tone-g::after { content: "R"; }
main:has(#key-d-major:checked):has(#chord-d-major-4:checked) .note.tone-b::after { content: "3"; }
main:has(#key-d-major:checked):has(#chord-d-major-4:checked) .note.tone-d::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-4:checked) .note.tone-fs::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-5:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-5:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-5:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-5:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-5:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-5:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-5:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-d-major:checked):has(#chord-d-major-5:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-major:checked):has(#chord-d-major-5:checked) .note.tone-a::after { content: "R"; }
main:has(#key-d-major:checked):has(#chord-d-major-5:checked) .note.tone-cs::after { content: "3"; }
main:has(#key-d-major:checked):has(#chord-d-major-5:checked) .note.tone-e::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-5:checked) .note.tone-g::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-6:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-6:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-6:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-6:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-6:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-6:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-6:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-d-major:checked):has(#chord-d-major-6:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-major:checked):has(#chord-d-major-6:checked) .note.tone-b::after { content: "R"; }
main:has(#key-d-major:checked):has(#chord-d-major-6:checked) .note.tone-d::after { content: "b3"; }
main:has(#key-d-major:checked):has(#chord-d-major-6:checked) .note.tone-fs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-6:checked) .note.tone-a::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-7:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-7:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-7:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-d-major:checked):has(#chord-d-major-7:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-7:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-7:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-7:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-d-major:checked):has(#chord-d-major-7:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-major:checked):has(#chord-d-major-7:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-d-major:checked):has(#chord-d-major-7:checked) .note.tone-e::after { content: "b3"; }
main:has(#key-d-major:checked):has(#chord-d-major-7:checked) .note.tone-g::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-d-major:checked):has(#chord-d-major-7:checked) .note.tone-b::after { content: "b7"; }

/* b-minor */
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-1:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-1:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-1:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-1:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-1:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-1:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-1:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-1:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-1:checked) .note.tone-b::after { content: "R"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-1:checked) .note.tone-d::after { content: "b3"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-1:checked) .note.tone-fs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-1:checked) .note.tone-a::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-2:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-2:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-2:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-2:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-2:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-2:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-2:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-2:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-2:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-2:checked) .note.tone-e::after { content: "b3"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-2:checked) .note.tone-g::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-2:checked) .note.tone-b::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-3:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-3:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-3:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-3:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-3:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-3:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-3:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-3:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-3:checked) .note.tone-d::after { content: "R"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-3:checked) .note.tone-fs::after { content: "3"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-3:checked) .note.tone-a::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-3:checked) .note.tone-cs::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-4:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-4:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-4:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-4:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-4:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-4:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-4:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-4:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-4:checked) .note.tone-e::after { content: "R"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-4:checked) .note.tone-g::after { content: "b3"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-4:checked) .note.tone-b::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-4:checked) .note.tone-d::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-5:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-5:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-5:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-5:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-5:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-5:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-5:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-5:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-5:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-5:checked) .note.tone-a::after { content: "b3"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-5:checked) .note.tone-cs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-5:checked) .note.tone-e::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-6:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-6:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-6:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-6:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-6:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-6:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-6:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-6:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-6:checked) .note.tone-g::after { content: "R"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-6:checked) .note.tone-b::after { content: "3"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-6:checked) .note.tone-d::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-6:checked) .note.tone-fs::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-7:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-7:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-7:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-b-minor:checked):has(#chord-b-minor-7:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-7:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-7:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-7:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-7:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-minor:checked):has(#chord-b-minor-7:checked) .note.tone-a::after { content: "R"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-7:checked) .note.tone-cs::after { content: "3"; }
main:has(#key-b-minor:checked):has(#chord-b-minor-7:checked) .note.tone-e::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-b-minor:checked):has(#chord-b-minor-7:checked) .note.tone-g::after { content: "b7"; }

/* a-major */
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-1:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-1:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-1:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-1:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-1:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-1:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-1:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-a-major:checked):has(#chord-a-major-1:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-major:checked):has(#chord-a-major-1:checked) .note.tone-a::after { content: "R"; }
main:has(#key-a-major:checked):has(#chord-a-major-1:checked) .note.tone-cs::after { content: "3"; }
main:has(#key-a-major:checked):has(#chord-a-major-1:checked) .note.tone-e::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-1:checked) .note.tone-gs::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-2:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-2:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-2:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-2:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-2:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-2:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-2:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-a-major:checked):has(#chord-a-major-2:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-major:checked):has(#chord-a-major-2:checked) .note.tone-b::after { content: "R"; }
main:has(#key-a-major:checked):has(#chord-a-major-2:checked) .note.tone-d::after { content: "b3"; }
main:has(#key-a-major:checked):has(#chord-a-major-2:checked) .note.tone-fs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-2:checked) .note.tone-a::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-3:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-3:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-3:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-3:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-3:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-3:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-3:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-a-major:checked):has(#chord-a-major-3:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-major:checked):has(#chord-a-major-3:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-a-major:checked):has(#chord-a-major-3:checked) .note.tone-e::after { content: "b3"; }
main:has(#key-a-major:checked):has(#chord-a-major-3:checked) .note.tone-gs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-3:checked) .note.tone-b::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-4:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-4:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-4:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-4:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-4:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-4:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-4:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-a-major:checked):has(#chord-a-major-4:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-major:checked):has(#chord-a-major-4:checked) .note.tone-d::after { content: "R"; }
main:has(#key-a-major:checked):has(#chord-a-major-4:checked) .note.tone-fs::after { content: "3"; }
main:has(#key-a-major:checked):has(#chord-a-major-4:checked) .note.tone-a::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-4:checked) .note.tone-cs::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-5:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-5:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-5:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-5:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-5:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-5:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-5:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-a-major:checked):has(#chord-a-major-5:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-major:checked):has(#chord-a-major-5:checked) .note.tone-e::after { content: "R"; }
main:has(#key-a-major:checked):has(#chord-a-major-5:checked) .note.tone-gs::after { content: "3"; }
main:has(#key-a-major:checked):has(#chord-a-major-5:checked) .note.tone-b::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-5:checked) .note.tone-d::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-6:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-6:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-6:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-6:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-6:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-6:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-6:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-a-major:checked):has(#chord-a-major-6:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-major:checked):has(#chord-a-major-6:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-a-major:checked):has(#chord-a-major-6:checked) .note.tone-a::after { content: "b3"; }
main:has(#key-a-major:checked):has(#chord-a-major-6:checked) .note.tone-cs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-6:checked) .note.tone-e::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-7:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-7:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-7:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-a-major:checked):has(#chord-a-major-7:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-7:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-7:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-7:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-a-major:checked):has(#chord-a-major-7:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-a-major:checked):has(#chord-a-major-7:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-a-major:checked):has(#chord-a-major-7:checked) .note.tone-b::after { content: "b3"; }
main:has(#key-a-major:checked):has(#chord-a-major-7:checked) .note.tone-d::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-a-major:checked):has(#chord-a-major-7:checked) .note.tone-fs::after { content: "b7"; }

/* fs-minor */
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-1:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-1:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-1:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-1:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-1:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-1:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-1:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-1:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-1:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-1:checked) .note.tone-a::after { content: "b3"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-1:checked) .note.tone-cs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-1:checked) .note.tone-e::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-2:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-2:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-2:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-2:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-2:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-2:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-2:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-2:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-2:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-2:checked) .note.tone-b::after { content: "b3"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-2:checked) .note.tone-d::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-2:checked) .note.tone-fs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-3:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-3:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-3:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-3:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-3:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-3:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-3:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-3:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-3:checked) .note.tone-a::after { content: "R"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-3:checked) .note.tone-cs::after { content: "3"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-3:checked) .note.tone-e::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-3:checked) .note.tone-gs::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-4:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-4:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-4:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-4:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-4:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-4:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-4:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-4:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-4:checked) .note.tone-b::after { content: "R"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-4:checked) .note.tone-d::after { content: "b3"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-4:checked) .note.tone-fs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-4:checked) .note.tone-a::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-5:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-5:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-5:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-5:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-5:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-5:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-5:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-5:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-5:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-5:checked) .note.tone-e::after { content: "b3"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-5:checked) .note.tone-gs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-5:checked) .note.tone-b::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-6:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-6:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-6:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-6:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-6:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-6:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-6:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-6:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-6:checked) .note.tone-d::after { content: "R"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-6:checked) .note.tone-fs::after { content: "3"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-6:checked) .note.tone-a::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-6:checked) .note.tone-cs::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-7:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-7:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-7:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-7:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-7:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-7:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-7:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-7:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-minor:checked):has(#chord-fs-minor-7:checked) .note.tone-e::after { content: "R"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-7:checked) .note.tone-gs::after { content: "3"; }
main:has(#key-fs-minor:checked):has(#chord-fs-minor-7:checked) .note.tone-b::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-fs-minor:checked):has(#chord-fs-minor-7:checked) .note.tone-d::after { content: "b7"; }

/* e-major */
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-1:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-1:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-1:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-1:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-1:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-1:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-1:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-e-major:checked):has(#chord-e-major-1:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-major:checked):has(#chord-e-major-1:checked) .note.tone-e::after { content: "R"; }
main:has(#key-e-major:checked):has(#chord-e-major-1:checked) .note.tone-gs::after { content: "3"; }
main:has(#key-e-major:checked):has(#chord-e-major-1:checked) .note.tone-b::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-1:checked) .note.tone-ds::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-2:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-2:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-2:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-2:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-2:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-2:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-2:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-e-major:checked):has(#chord-e-major-2:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-major:checked):has(#chord-e-major-2:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-e-major:checked):has(#chord-e-major-2:checked) .note.tone-a::after { content: "b3"; }
main:has(#key-e-major:checked):has(#chord-e-major-2:checked) .note.tone-cs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-2:checked) .note.tone-e::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-3:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-3:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-3:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-3:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-3:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-3:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-3:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-e-major:checked):has(#chord-e-major-3:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-major:checked):has(#chord-e-major-3:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-e-major:checked):has(#chord-e-major-3:checked) .note.tone-b::after { content: "b3"; }
main:has(#key-e-major:checked):has(#chord-e-major-3:checked) .note.tone-ds::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-3:checked) .note.tone-fs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-4:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-4:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-4:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-4:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-4:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-4:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-4:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-e-major:checked):has(#chord-e-major-4:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-major:checked):has(#chord-e-major-4:checked) .note.tone-a::after { content: "R"; }
main:has(#key-e-major:checked):has(#chord-e-major-4:checked) .note.tone-cs::after { content: "3"; }
main:has(#key-e-major:checked):has(#chord-e-major-4:checked) .note.tone-e::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-4:checked) .note.tone-gs::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-5:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-5:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-5:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-5:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-5:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-5:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-5:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-e-major:checked):has(#chord-e-major-5:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-major:checked):has(#chord-e-major-5:checked) .note.tone-b::after { content: "R"; }
main:has(#key-e-major:checked):has(#chord-e-major-5:checked) .note.tone-ds::after { content: "3"; }
main:has(#key-e-major:checked):has(#chord-e-major-5:checked) .note.tone-fs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-5:checked) .note.tone-a::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-6:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-6:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-6:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-6:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-6:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-6:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-6:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-e-major:checked):has(#chord-e-major-6:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-major:checked):has(#chord-e-major-6:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-e-major:checked):has(#chord-e-major-6:checked) .note.tone-e::after { content: "b3"; }
main:has(#key-e-major:checked):has(#chord-e-major-6:checked) .note.tone-gs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-6:checked) .note.tone-b::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-7:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-7:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-7:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-e-major:checked):has(#chord-e-major-7:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-7:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-7:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-7:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-e-major:checked):has(#chord-e-major-7:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-e-major:checked):has(#chord-e-major-7:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-e-major:checked):has(#chord-e-major-7:checked) .note.tone-fs::after { content: "b3"; }
main:has(#key-e-major:checked):has(#chord-e-major-7:checked) .note.tone-a::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-e-major:checked):has(#chord-e-major-7:checked) .note.tone-cs::after { content: "b7"; }

/* cs-minor */
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-1:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-1:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-1:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-1:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-1:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-1:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-1:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-1:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-1:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-1:checked) .note.tone-e::after { content: "b3"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-1:checked) .note.tone-gs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-1:checked) .note.tone-b::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-2:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-2:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-2:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-2:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-2:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-2:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-2:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-2:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-2:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-2:checked) .note.tone-fs::after { content: "b3"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-2:checked) .note.tone-a::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-2:checked) .note.tone-cs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-3:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-3:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-3:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-3:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-3:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-3:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-3:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-3:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-3:checked) .note.tone-e::after { content: "R"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-3:checked) .note.tone-gs::after { content: "3"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-3:checked) .note.tone-b::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-3:checked) .note.tone-ds::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-4:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-4:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-4:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-4:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-4:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-4:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-4:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-4:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-4:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-4:checked) .note.tone-a::after { content: "b3"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-4:checked) .note.tone-cs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-4:checked) .note.tone-e::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-5:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-5:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-5:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-5:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-5:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-5:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-5:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-5:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-5:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-5:checked) .note.tone-b::after { content: "b3"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-5:checked) .note.tone-ds::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-5:checked) .note.tone-fs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-6:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-6:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-6:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-6:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-6:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-6:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-6:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-6:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-6:checked) .note.tone-a::after { content: "R"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-6:checked) .note.tone-cs::after { content: "3"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-6:checked) .note.tone-e::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-6:checked) .note.tone-gs::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-7:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-7:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-7:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-7:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-7:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-7:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-7:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-7:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-cs-minor:checked):has(#chord-cs-minor-7:checked) .note.tone-b::after { content: "R"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-7:checked) .note.tone-ds::after { content: "3"; }
main:has(#key-cs-minor:checked):has(#chord-cs-minor-7:checked) .note.tone-fs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-cs-minor:checked):has(#chord-cs-minor-7:checked) .note.tone-a::after { content: "b7"; }

/* b-major */
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-1:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-1:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-1:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-1:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-1:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-1:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-1:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-b-major:checked):has(#chord-b-major-1:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-major:checked):has(#chord-b-major-1:checked) .note.tone-b::after { content: "R"; }
main:has(#key-b-major:checked):has(#chord-b-major-1:checked) .note.tone-ds::after { content: "3"; }
main:has(#key-b-major:checked):has(#chord-b-major-1:checked) .note.tone-fs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-1:checked) .note.tone-as::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-2:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-2:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-2:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-2:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-2:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-2:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-2:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-b-major:checked):has(#chord-b-major-2:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-major:checked):has(#chord-b-major-2:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-b-major:checked):has(#chord-b-major-2:checked) .note.tone-e::after { content: "b3"; }
main:has(#key-b-major:checked):has(#chord-b-major-2:checked) .note.tone-gs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-2:checked) .note.tone-b::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-3:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-3:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-3:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-3:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-3:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-3:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-3:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-b-major:checked):has(#chord-b-major-3:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-major:checked):has(#chord-b-major-3:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-b-major:checked):has(#chord-b-major-3:checked) .note.tone-fs::after { content: "b3"; }
main:has(#key-b-major:checked):has(#chord-b-major-3:checked) .note.tone-as::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-3:checked) .note.tone-cs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-4:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-4:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-4:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-4:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-4:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-4:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-4:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-b-major:checked):has(#chord-b-major-4:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-major:checked):has(#chord-b-major-4:checked) .note.tone-e::after { content: "R"; }
main:has(#key-b-major:checked):has(#chord-b-major-4:checked) .note.tone-gs::after { content: "3"; }
main:has(#key-b-major:checked):has(#chord-b-major-4:checked) .note.tone-b::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-4:checked) .note.tone-ds::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-5:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-5:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-5:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-5:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-5:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-5:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-5:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-b-major:checked):has(#chord-b-major-5:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-major:checked):has(#chord-b-major-5:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-b-major:checked):has(#chord-b-major-5:checked) .note.tone-as::after { content: "3"; }
main:has(#key-b-major:checked):has(#chord-b-major-5:checked) .note.tone-cs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-5:checked) .note.tone-e::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-6:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-6:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-6:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-6:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-6:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-6:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-6:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-b-major:checked):has(#chord-b-major-6:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-major:checked):has(#chord-b-major-6:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-b-major:checked):has(#chord-b-major-6:checked) .note.tone-b::after { content: "b3"; }
main:has(#key-b-major:checked):has(#chord-b-major-6:checked) .note.tone-ds::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-6:checked) .note.tone-fs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-7:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-7:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-7:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-b-major:checked):has(#chord-b-major-7:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-7:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-7:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-7:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-b-major:checked):has(#chord-b-major-7:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-b-major:checked):has(#chord-b-major-7:checked) .note.tone-as::after { content: "R"; }
main:has(#key-b-major:checked):has(#chord-b-major-7:checked) .note.tone-cs::after { content: "b3"; }
main:has(#key-b-major:checked):has(#chord-b-major-7:checked) .note.tone-e::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-b-major:checked):has(#chord-b-major-7:checked) .note.tone-gs::after { content: "b7"; }

/* gs-minor */
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-1:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-1:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-1:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-1:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-1:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-1:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-1:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-1:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-1:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-1:checked) .note.tone-b::after { content: "b3"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-1:checked) .note.tone-ds::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-1:checked) .note.tone-fs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-2:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-2:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-2:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-2:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-2:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-2:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-2:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-2:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-2:checked) .note.tone-as::after { content: "R"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-2:checked) .note.tone-cs::after { content: "b3"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-2:checked) .note.tone-e::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-2:checked) .note.tone-gs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-3:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-3:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-3:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-3:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-3:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-3:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-3:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-3:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-3:checked) .note.tone-b::after { content: "R"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-3:checked) .note.tone-ds::after { content: "3"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-3:checked) .note.tone-fs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-3:checked) .note.tone-as::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-4:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-4:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-4:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-4:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-4:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-4:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-4:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-4:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-4:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-4:checked) .note.tone-e::after { content: "b3"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-4:checked) .note.tone-gs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-4:checked) .note.tone-b::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-5:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-5:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-5:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-5:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-5:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-5:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-5:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-5:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-5:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-5:checked) .note.tone-fs::after { content: "b3"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-5:checked) .note.tone-as::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-5:checked) .note.tone-cs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-6:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-6:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-6:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-6:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-6:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-6:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-6:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-6:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-6:checked) .note.tone-e::after { content: "R"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-6:checked) .note.tone-gs::after { content: "3"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-6:checked) .note.tone-b::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-6:checked) .note.tone-ds::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-7:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-7:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-7:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-7:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-7:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-7:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-7:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-7:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-gs-minor:checked):has(#chord-gs-minor-7:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-7:checked) .note.tone-as::after { content: "3"; }
main:has(#key-gs-minor:checked):has(#chord-gs-minor-7:checked) .note.tone-cs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-gs-minor:checked):has(#chord-gs-minor-7:checked) .note.tone-e::after { content: "b7"; }

/* fs-major */
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-1:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-1:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-1:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-1:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-1:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-1:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-1:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-1:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-1:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-1:checked) .note.tone-as::after { content: "3"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-1:checked) .note.tone-cs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-1:checked) .note.tone-f::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-2:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-2:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-2:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-2:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-2:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-2:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-2:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-2:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-2:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-2:checked) .note.tone-b::after { content: "b3"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-2:checked) .note.tone-ds::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-2:checked) .note.tone-fs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-3:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-3:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-3:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-3:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-3:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-3:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-3:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-3:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-3:checked) .note.tone-as::after { content: "R"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-3:checked) .note.tone-cs::after { content: "b3"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-3:checked) .note.tone-f::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-3:checked) .note.tone-gs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-4:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-4:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-4:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-4:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-4:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-4:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-4:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-4:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-4:checked) .note.tone-b::after { content: "R"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-4:checked) .note.tone-ds::after { content: "3"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-4:checked) .note.tone-fs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-4:checked) .note.tone-as::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-5:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-5:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-5:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-5:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-5:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-5:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-5:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-5:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-5:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-5:checked) .note.tone-f::after { content: "3"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-5:checked) .note.tone-gs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-5:checked) .note.tone-b::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-6:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-6:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-6:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-6:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-6:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-6:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-6:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-6:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-6:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-6:checked) .note.tone-fs::after { content: "b3"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-6:checked) .note.tone-as::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-6:checked) .note.tone-cs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-7:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-7:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-7:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-fs-major:checked):has(#chord-fs-major-7:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-7:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-7:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-7:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-7:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-fs-major:checked):has(#chord-fs-major-7:checked) .note.tone-f::after { content: "R"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-7:checked) .note.tone-gs::after { content: "b3"; }
main:has(#key-fs-major:checked):has(#chord-fs-major-7:checked) .note.tone-b::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-fs-major:checked):has(#chord-fs-major-7:checked) .note.tone-ds::after { content: "b7"; }

/* ds-minor */
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-1:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-1:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-1:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-1:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-1:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-1:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-1:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-1:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-1:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-1:checked) .note.tone-fs::after { content: "b3"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-1:checked) .note.tone-as::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-1:checked) .note.tone-cs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-2:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-2:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-2:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-2:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-2:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-2:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-2:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-2:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-2:checked) .note.tone-f::after { content: "R"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-2:checked) .note.tone-gs::after { content: "b3"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-2:checked) .note.tone-b::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-2:checked) .note.tone-ds::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-3:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-3:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-3:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-3:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-3:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-3:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-3:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-3:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-3:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-3:checked) .note.tone-as::after { content: "3"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-3:checked) .note.tone-cs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-3:checked) .note.tone-f::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-4:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-4:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-4:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-4:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-4:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-4:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-4:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-4:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-4:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-4:checked) .note.tone-b::after { content: "b3"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-4:checked) .note.tone-ds::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-4:checked) .note.tone-fs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-5:checked) .note.tone-b,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-5:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-5:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-5:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-5:checked) .note.tone-b,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-5:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-5:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-5:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-5:checked) .note.tone-as::after { content: "R"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-5:checked) .note.tone-cs::after { content: "b3"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-5:checked) .note.tone-f::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-5:checked) .note.tone-gs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-6:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-6:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-6:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-6:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-6:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-6:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-6:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-6:checked) .note.tone-b {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-6:checked) .note.tone-b::after { content: "R"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-6:checked) .note.tone-ds::after { content: "3"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-6:checked) .note.tone-fs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-6:checked) .note.tone-as::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-7:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-7:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-7:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-7:checked) .note.tone-b {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-7:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-7:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-7:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-7:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ds-minor:checked):has(#chord-ds-minor-7:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-7:checked) .note.tone-f::after { content: "3"; }
main:has(#key-ds-minor:checked):has(#chord-ds-minor-7:checked) .note.tone-gs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-ds-minor:checked):has(#chord-ds-minor-7:checked) .note.tone-b::after { content: "b7"; }

/* db-major */
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-1:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-1:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-1:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-1:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-1:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-1:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-1:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-db-major:checked):has(#chord-db-major-1:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-db-major:checked):has(#chord-db-major-1:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-db-major:checked):has(#chord-db-major-1:checked) .note.tone-f::after { content: "3"; }
main:has(#key-db-major:checked):has(#chord-db-major-1:checked) .note.tone-gs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-1:checked) .note.tone-c::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-2:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-2:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-2:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-2:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-2:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-2:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-2:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-db-major:checked):has(#chord-db-major-2:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-db-major:checked):has(#chord-db-major-2:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-db-major:checked):has(#chord-db-major-2:checked) .note.tone-fs::after { content: "b3"; }
main:has(#key-db-major:checked):has(#chord-db-major-2:checked) .note.tone-as::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-2:checked) .note.tone-cs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-3:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-3:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-3:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-3:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-3:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-3:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-3:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-db-major:checked):has(#chord-db-major-3:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-db-major:checked):has(#chord-db-major-3:checked) .note.tone-f::after { content: "R"; }
main:has(#key-db-major:checked):has(#chord-db-major-3:checked) .note.tone-gs::after { content: "b3"; }
main:has(#key-db-major:checked):has(#chord-db-major-3:checked) .note.tone-c::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-3:checked) .note.tone-ds::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-4:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-4:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-4:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-4:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-4:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-4:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-4:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-db-major:checked):has(#chord-db-major-4:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-db-major:checked):has(#chord-db-major-4:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-db-major:checked):has(#chord-db-major-4:checked) .note.tone-as::after { content: "3"; }
main:has(#key-db-major:checked):has(#chord-db-major-4:checked) .note.tone-cs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-4:checked) .note.tone-f::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-5:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-5:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-5:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-5:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-5:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-5:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-5:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-db-major:checked):has(#chord-db-major-5:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-db-major:checked):has(#chord-db-major-5:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-db-major:checked):has(#chord-db-major-5:checked) .note.tone-c::after { content: "3"; }
main:has(#key-db-major:checked):has(#chord-db-major-5:checked) .note.tone-ds::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-5:checked) .note.tone-fs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-6:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-6:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-6:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-6:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-6:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-6:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-6:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-db-major:checked):has(#chord-db-major-6:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-db-major:checked):has(#chord-db-major-6:checked) .note.tone-as::after { content: "R"; }
main:has(#key-db-major:checked):has(#chord-db-major-6:checked) .note.tone-cs::after { content: "b3"; }
main:has(#key-db-major:checked):has(#chord-db-major-6:checked) .note.tone-f::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-6:checked) .note.tone-gs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-7:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-7:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-7:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-db-major:checked):has(#chord-db-major-7:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-7:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-7:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-7:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-db-major:checked):has(#chord-db-major-7:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-db-major:checked):has(#chord-db-major-7:checked) .note.tone-c::after { content: "R"; }
main:has(#key-db-major:checked):has(#chord-db-major-7:checked) .note.tone-ds::after { content: "b3"; }
main:has(#key-db-major:checked):has(#chord-db-major-7:checked) .note.tone-fs::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-db-major:checked):has(#chord-db-major-7:checked) .note.tone-as::after { content: "b7"; }

/* bb-minor */
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-1:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-1:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-1:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-1:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-1:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-1:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-1:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-1:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-1:checked) .note.tone-as::after { content: "R"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-1:checked) .note.tone-cs::after { content: "b3"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-1:checked) .note.tone-f::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-1:checked) .note.tone-gs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-2:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-2:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-2:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-2:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-2:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-2:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-2:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-2:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-2:checked) .note.tone-c::after { content: "R"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-2:checked) .note.tone-ds::after { content: "b3"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-2:checked) .note.tone-fs::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-2:checked) .note.tone-as::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-3:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-3:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-3:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-3:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-3:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-3:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-3:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-3:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-3:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-3:checked) .note.tone-f::after { content: "3"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-3:checked) .note.tone-gs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-3:checked) .note.tone-c::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-4:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-4:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-4:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-4:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-4:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-4:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-4:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-4:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-4:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-4:checked) .note.tone-fs::after { content: "b3"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-4:checked) .note.tone-as::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-4:checked) .note.tone-cs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-5:checked) .note.tone-fs,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-5:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-5:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-5:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-5:checked) .note.tone-fs,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-5:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-5:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-5:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-5:checked) .note.tone-f::after { content: "R"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-5:checked) .note.tone-gs::after { content: "b3"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-5:checked) .note.tone-c::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-5:checked) .note.tone-ds::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-6:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-6:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-6:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-6:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-6:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-6:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-6:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-6:checked) .note.tone-fs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-6:checked) .note.tone-fs::after { content: "R"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-6:checked) .note.tone-as::after { content: "3"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-6:checked) .note.tone-cs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-6:checked) .note.tone-f::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-7:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-7:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-7:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-7:checked) .note.tone-fs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-7:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-7:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-7:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-7:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-minor:checked):has(#chord-bb-minor-7:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-7:checked) .note.tone-c::after { content: "3"; }
main:has(#key-bb-minor:checked):has(#chord-bb-minor-7:checked) .note.tone-ds::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-bb-minor:checked):has(#chord-bb-minor-7:checked) .note.tone-fs::after { content: "b7"; }

/* ab-major */
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-1:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-1:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-1:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-1:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-1:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-1:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-1:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-1:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-1:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-1:checked) .note.tone-c::after { content: "3"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-1:checked) .note.tone-ds::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-1:checked) .note.tone-g::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-2:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-2:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-2:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-2:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-2:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-2:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-2:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-2:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-2:checked) .note.tone-as::after { content: "R"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-2:checked) .note.tone-cs::after { content: "b3"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-2:checked) .note.tone-f::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-2:checked) .note.tone-gs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-3:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-3:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-3:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-3:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-3:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-3:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-3:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-3:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-3:checked) .note.tone-c::after { content: "R"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-3:checked) .note.tone-ds::after { content: "b3"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-3:checked) .note.tone-g::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-3:checked) .note.tone-as::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-4:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-4:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-4:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-4:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-4:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-4:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-4:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-4:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-4:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-4:checked) .note.tone-f::after { content: "3"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-4:checked) .note.tone-gs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-4:checked) .note.tone-c::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-5:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-5:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-5:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-5:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-5:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-5:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-5:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-5:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-5:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-5:checked) .note.tone-g::after { content: "3"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-5:checked) .note.tone-as::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-5:checked) .note.tone-cs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-6:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-6:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-6:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-6:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-6:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-6:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-6:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-6:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-6:checked) .note.tone-f::after { content: "R"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-6:checked) .note.tone-gs::after { content: "b3"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-6:checked) .note.tone-c::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-6:checked) .note.tone-ds::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-7:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-7:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-7:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-ab-major:checked):has(#chord-ab-major-7:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-7:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-7:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-7:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-7:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-ab-major:checked):has(#chord-ab-major-7:checked) .note.tone-g::after { content: "R"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-7:checked) .note.tone-as::after { content: "b3"; }
main:has(#key-ab-major:checked):has(#chord-ab-major-7:checked) .note.tone-cs::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-ab-major:checked):has(#chord-ab-major-7:checked) .note.tone-f::after { content: "b7"; }

/* f-minor */
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-1:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-1:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-1:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-1:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-1:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-1:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-1:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-1:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-1:checked) .note.tone-f::after { content: "R"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-1:checked) .note.tone-gs::after { content: "b3"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-1:checked) .note.tone-c::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-1:checked) .note.tone-ds::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-2:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-2:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-2:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-2:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-2:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-2:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-2:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-2:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-2:checked) .note.tone-g::after { content: "R"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-2:checked) .note.tone-as::after { content: "b3"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-2:checked) .note.tone-cs::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-2:checked) .note.tone-f::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-3:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-3:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-3:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-3:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-3:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-3:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-3:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-3:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-3:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-3:checked) .note.tone-c::after { content: "3"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-3:checked) .note.tone-ds::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-3:checked) .note.tone-g::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-4:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-4:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-4:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-4:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-4:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-4:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-4:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-4:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-4:checked) .note.tone-as::after { content: "R"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-4:checked) .note.tone-cs::after { content: "b3"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-4:checked) .note.tone-f::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-4:checked) .note.tone-gs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-5:checked) .note.tone-cs,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-5:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-5:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-5:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-5:checked) .note.tone-cs,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-5:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-5:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-5:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-5:checked) .note.tone-c::after { content: "R"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-5:checked) .note.tone-ds::after { content: "b3"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-5:checked) .note.tone-g::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-5:checked) .note.tone-as::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-6:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-6:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-6:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-6:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-6:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-6:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-6:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-6:checked) .note.tone-cs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-6:checked) .note.tone-cs::after { content: "R"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-6:checked) .note.tone-f::after { content: "3"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-6:checked) .note.tone-gs::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-6:checked) .note.tone-c::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-7:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-7:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-7:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-f-minor:checked):has(#chord-f-minor-7:checked) .note.tone-cs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-7:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-7:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-7:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-7:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-minor:checked):has(#chord-f-minor-7:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-7:checked) .note.tone-g::after { content: "3"; }
main:has(#key-f-minor:checked):has(#chord-f-minor-7:checked) .note.tone-as::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-f-minor:checked):has(#chord-f-minor-7:checked) .note.tone-cs::after { content: "b7"; }

/* eb-major */
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-1:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-1:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-1:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-1:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-1:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-1:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-1:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-1:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-1:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-1:checked) .note.tone-g::after { content: "3"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-1:checked) .note.tone-as::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-1:checked) .note.tone-d::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-2:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-2:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-2:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-2:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-2:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-2:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-2:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-2:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-2:checked) .note.tone-f::after { content: "R"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-2:checked) .note.tone-gs::after { content: "b3"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-2:checked) .note.tone-c::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-2:checked) .note.tone-ds::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-3:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-3:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-3:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-3:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-3:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-3:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-3:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-3:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-3:checked) .note.tone-g::after { content: "R"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-3:checked) .note.tone-as::after { content: "b3"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-3:checked) .note.tone-d::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-3:checked) .note.tone-f::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-4:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-4:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-4:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-4:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-4:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-4:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-4:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-4:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-4:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-4:checked) .note.tone-c::after { content: "3"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-4:checked) .note.tone-ds::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-4:checked) .note.tone-g::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-5:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-5:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-5:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-5:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-5:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-5:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-5:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-5:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-5:checked) .note.tone-as::after { content: "R"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-5:checked) .note.tone-d::after { content: "3"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-5:checked) .note.tone-f::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-5:checked) .note.tone-gs::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-6:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-6:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-6:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-6:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-6:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-6:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-6:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-6:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-6:checked) .note.tone-c::after { content: "R"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-6:checked) .note.tone-ds::after { content: "b3"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-6:checked) .note.tone-g::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-6:checked) .note.tone-as::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-7:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-7:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-7:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-eb-major:checked):has(#chord-eb-major-7:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-7:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-7:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-7:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-7:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-eb-major:checked):has(#chord-eb-major-7:checked) .note.tone-d::after { content: "R"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-7:checked) .note.tone-f::after { content: "b3"; }
main:has(#key-eb-major:checked):has(#chord-eb-major-7:checked) .note.tone-gs::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-eb-major:checked):has(#chord-eb-major-7:checked) .note.tone-c::after { content: "b7"; }

/* c-minor */
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-1:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-1:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-1:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-1:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-1:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-1:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-1:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-1:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-1:checked) .note.tone-c::after { content: "R"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-1:checked) .note.tone-ds::after { content: "b3"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-1:checked) .note.tone-g::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-1:checked) .note.tone-as::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-2:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-2:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-2:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-2:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-2:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-2:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-2:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-2:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-2:checked) .note.tone-d::after { content: "R"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-2:checked) .note.tone-f::after { content: "b3"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-2:checked) .note.tone-gs::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-2:checked) .note.tone-c::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-3:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-3:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-3:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-3:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-3:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-3:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-3:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-3:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-3:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-3:checked) .note.tone-g::after { content: "3"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-3:checked) .note.tone-as::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-3:checked) .note.tone-d::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-4:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-4:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-4:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-4:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-4:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-4:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-4:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-4:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-4:checked) .note.tone-f::after { content: "R"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-4:checked) .note.tone-gs::after { content: "b3"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-4:checked) .note.tone-c::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-4:checked) .note.tone-ds::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-5:checked) .note.tone-gs,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-5:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-5:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-5:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-5:checked) .note.tone-gs,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-5:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-5:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-5:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-5:checked) .note.tone-g::after { content: "R"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-5:checked) .note.tone-as::after { content: "b3"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-5:checked) .note.tone-d::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-5:checked) .note.tone-f::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-6:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-6:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-6:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-6:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-6:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-6:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-6:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-6:checked) .note.tone-gs {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-6:checked) .note.tone-gs::after { content: "R"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-6:checked) .note.tone-c::after { content: "3"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-6:checked) .note.tone-ds::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-6:checked) .note.tone-g::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-7:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-7:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-7:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-c-minor:checked):has(#chord-c-minor-7:checked) .note.tone-gs {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-7:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-7:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-7:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-7:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-c-minor:checked):has(#chord-c-minor-7:checked) .note.tone-as::after { content: "R"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-7:checked) .note.tone-d::after { content: "3"; }
main:has(#key-c-minor:checked):has(#chord-c-minor-7:checked) .note.tone-f::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-c-minor:checked):has(#chord-c-minor-7:checked) .note.tone-gs::after { content: "b7"; }

/* bb-major */
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-1:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-1:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-1:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-1:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-1:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-1:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-1:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-1:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-1:checked) .note.tone-as::after { content: "R"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-1:checked) .note.tone-d::after { content: "3"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-1:checked) .note.tone-f::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-1:checked) .note.tone-a::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-2:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-2:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-2:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-2:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-2:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-2:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-2:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-2:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-2:checked) .note.tone-c::after { content: "R"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-2:checked) .note.tone-ds::after { content: "b3"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-2:checked) .note.tone-g::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-2:checked) .note.tone-as::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-3:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-3:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-3:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-3:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-3:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-3:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-3:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-3:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-3:checked) .note.tone-d::after { content: "R"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-3:checked) .note.tone-f::after { content: "b3"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-3:checked) .note.tone-a::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-3:checked) .note.tone-c::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-4:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-4:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-4:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-4:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-4:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-4:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-4:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-4:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-4:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-4:checked) .note.tone-g::after { content: "3"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-4:checked) .note.tone-as::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-4:checked) .note.tone-d::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-5:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-5:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-5:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-5:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-5:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-5:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-5:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-5:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-5:checked) .note.tone-f::after { content: "R"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-5:checked) .note.tone-a::after { content: "3"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-5:checked) .note.tone-c::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-5:checked) .note.tone-ds::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-6:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-6:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-6:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-6:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-6:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-6:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-6:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-6:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-6:checked) .note.tone-g::after { content: "R"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-6:checked) .note.tone-as::after { content: "b3"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-6:checked) .note.tone-d::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-6:checked) .note.tone-f::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-7:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-7:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-7:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-bb-major:checked):has(#chord-bb-major-7:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-7:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-7:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-7:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-7:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-bb-major:checked):has(#chord-bb-major-7:checked) .note.tone-a::after { content: "R"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-7:checked) .note.tone-c::after { content: "b3"; }
main:has(#key-bb-major:checked):has(#chord-bb-major-7:checked) .note.tone-ds::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-bb-major:checked):has(#chord-bb-major-7:checked) .note.tone-g::after { content: "b7"; }

/* g-minor */
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-1:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-1:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-1:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-1:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-1:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-1:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-1:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-1:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-1:checked) .note.tone-g::after { content: "R"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-1:checked) .note.tone-as::after { content: "b3"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-1:checked) .note.tone-d::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-1:checked) .note.tone-f::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-2:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-2:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-2:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-2:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-2:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-2:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-2:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-2:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-2:checked) .note.tone-a::after { content: "R"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-2:checked) .note.tone-c::after { content: "b3"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-2:checked) .note.tone-ds::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-2:checked) .note.tone-g::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-3:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-3:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-3:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-3:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-3:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-3:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-3:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-3:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-3:checked) .note.tone-as::after { content: "R"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-3:checked) .note.tone-d::after { content: "3"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-3:checked) .note.tone-f::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-3:checked) .note.tone-a::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-4:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-4:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-4:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-4:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-4:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-4:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-4:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-4:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-4:checked) .note.tone-c::after { content: "R"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-4:checked) .note.tone-ds::after { content: "b3"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-4:checked) .note.tone-g::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-4:checked) .note.tone-as::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-5:checked) .note.tone-ds,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-5:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-5:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-5:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-5:checked) .note.tone-ds,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-5:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-5:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-5:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-5:checked) .note.tone-d::after { content: "R"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-5:checked) .note.tone-f::after { content: "b3"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-5:checked) .note.tone-a::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-5:checked) .note.tone-c::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-6:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-6:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-6:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-6:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-6:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-6:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-6:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-6:checked) .note.tone-ds {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-6:checked) .note.tone-ds::after { content: "R"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-6:checked) .note.tone-g::after { content: "3"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-6:checked) .note.tone-as::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-6:checked) .note.tone-d::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-7:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-7:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-7:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-g-minor:checked):has(#chord-g-minor-7:checked) .note.tone-ds {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-7:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-7:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-7:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-7:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-g-minor:checked):has(#chord-g-minor-7:checked) .note.tone-f::after { content: "R"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-7:checked) .note.tone-a::after { content: "3"; }
main:has(#key-g-minor:checked):has(#chord-g-minor-7:checked) .note.tone-c::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-g-minor:checked):has(#chord-g-minor-7:checked) .note.tone-ds::after { content: "b7"; }

/* f-major */
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-1:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-1:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-1:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-1:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-1:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-1:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-1:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-f-major:checked):has(#chord-f-major-1:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-major:checked):has(#chord-f-major-1:checked) .note.tone-f::after { content: "R"; }
main:has(#key-f-major:checked):has(#chord-f-major-1:checked) .note.tone-a::after { content: "3"; }
main:has(#key-f-major:checked):has(#chord-f-major-1:checked) .note.tone-c::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-1:checked) .note.tone-e::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-2:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-2:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-2:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-2:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-2:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-2:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-2:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-f-major:checked):has(#chord-f-major-2:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-major:checked):has(#chord-f-major-2:checked) .note.tone-g::after { content: "R"; }
main:has(#key-f-major:checked):has(#chord-f-major-2:checked) .note.tone-as::after { content: "b3"; }
main:has(#key-f-major:checked):has(#chord-f-major-2:checked) .note.tone-d::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-2:checked) .note.tone-f::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-3:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-3:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-3:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-3:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-3:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-3:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-3:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-f-major:checked):has(#chord-f-major-3:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-major:checked):has(#chord-f-major-3:checked) .note.tone-a::after { content: "R"; }
main:has(#key-f-major:checked):has(#chord-f-major-3:checked) .note.tone-c::after { content: "b3"; }
main:has(#key-f-major:checked):has(#chord-f-major-3:checked) .note.tone-e::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-3:checked) .note.tone-g::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-4:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-4:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-4:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-4:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-4:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-4:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-4:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-f-major:checked):has(#chord-f-major-4:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-major:checked):has(#chord-f-major-4:checked) .note.tone-as::after { content: "R"; }
main:has(#key-f-major:checked):has(#chord-f-major-4:checked) .note.tone-d::after { content: "3"; }
main:has(#key-f-major:checked):has(#chord-f-major-4:checked) .note.tone-f::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-4:checked) .note.tone-a::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-5:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-5:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-5:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-5:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-5:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-5:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-5:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-f-major:checked):has(#chord-f-major-5:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-major:checked):has(#chord-f-major-5:checked) .note.tone-c::after { content: "R"; }
main:has(#key-f-major:checked):has(#chord-f-major-5:checked) .note.tone-e::after { content: "3"; }
main:has(#key-f-major:checked):has(#chord-f-major-5:checked) .note.tone-g::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-5:checked) .note.tone-as::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-6:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-6:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-6:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-6:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-6:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-6:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-6:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-f-major:checked):has(#chord-f-major-6:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-major:checked):has(#chord-f-major-6:checked) .note.tone-d::after { content: "R"; }
main:has(#key-f-major:checked):has(#chord-f-major-6:checked) .note.tone-f::after { content: "b3"; }
main:has(#key-f-major:checked):has(#chord-f-major-6:checked) .note.tone-a::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-6:checked) .note.tone-c::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-7:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-7:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-7:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-f-major:checked):has(#chord-f-major-7:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-7:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-7:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-7:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-f-major:checked):has(#chord-f-major-7:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-f-major:checked):has(#chord-f-major-7:checked) .note.tone-e::after { content: "R"; }
main:has(#key-f-major:checked):has(#chord-f-major-7:checked) .note.tone-g::after { content: "b3"; }
main:has(#key-f-major:checked):has(#chord-f-major-7:checked) .note.tone-as::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-f-major:checked):has(#chord-f-major-7:checked) .note.tone-d::after { content: "b7"; }

/* d-minor */
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-1:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-1:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-1:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-1:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-1:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-1:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-1:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-1:checked) .note.tone-d {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-1:checked) .note.tone-d::after { content: "R"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-1:checked) .note.tone-f::after { content: "b3"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-1:checked) .note.tone-a::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-1:checked) .note.tone-c::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-2:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-2:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-2:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-2:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-2:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-2:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-2:checked) .note.tone-c {
  opacity: var(--dim-opacity);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-2:checked) .note.tone-e {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-2:checked) .note.tone-e::after { content: "R"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-2:checked) .note.tone-g::after { content: "b3"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-2:checked) .note.tone-as::after { content: "b5"; }
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-2:checked) .note.tone-d::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-3:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-3:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-3:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-3:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-3:checked) .note.tone-g,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-3:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-3:checked) .note.tone-d {
  opacity: var(--dim-opacity);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-3:checked) .note.tone-f {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-3:checked) .note.tone-f::after { content: "R"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-3:checked) .note.tone-a::after { content: "3"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-3:checked) .note.tone-c::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-3:checked) .note.tone-e::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-4:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-4:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-4:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-4:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-4:checked) .note.tone-a,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-4:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-4:checked) .note.tone-e {
  opacity: var(--dim-opacity);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-4:checked) .note.tone-g {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-4:checked) .note.tone-g::after { content: "R"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-4:checked) .note.tone-as::after { content: "b3"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-4:checked) .note.tone-d::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-4:checked) .note.tone-f::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-5:checked) .note.tone-as,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-5:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-5:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-5:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-5:checked) .note.tone-as,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-5:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-5:checked) .note.tone-f {
  opacity: var(--dim-opacity);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-5:checked) .note.tone-a {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-5:checked) .note.tone-a::after { content: "R"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-5:checked) .note.tone-c::after { content: "b3"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-5:checked) .note.tone-e::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-5:checked) .note.tone-g::after { content: "b7"; }
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-6:checked) .note.tone-c,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-6:checked) .note.tone-e,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-6:checked) .note.tone-g,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-6:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-6:checked) .note.tone-c,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-6:checked) .note.tone-e,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-6:checked) .note.tone-g {
  opacity: var(--dim-opacity);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-6:checked) .note.tone-as {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-6:checked) .note.tone-as::after { content: "R"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-6:checked) .note.tone-d::after { content: "3"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-6:checked) .note.tone-f::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-6:checked) .note.tone-a::after { content: "7"; }
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-7:checked) .note.tone-d,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-7:checked) .note.tone-f,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-7:checked) .note.tone-a,
main:has(#voicing-triads:checked):has(#key-d-minor:checked):has(#chord-d-minor-7:checked) .note.tone-as {
  opacity: var(--dim-opacity);
}
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-7:checked) .note.tone-d,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-7:checked) .note.tone-f,
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-7:checked) .note.tone-a {
  opacity: var(--dim-opacity);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-7:checked) .note.tone-c {
  background-color: var(--root-bg);
  color: var(--root-fg);
}
main:has(#key-d-minor:checked):has(#chord-d-minor-7:checked) .note.tone-c::after { content: "R"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-7:checked) .note.tone-e::after { content: "3"; }
main:has(#key-d-minor:checked):has(#chord-d-minor-7:checked) .note.tone-g::after { content: "5"; }
main:has(#voicing-7th:checked):has(#key-d-minor:checked):has(#chord-d-minor-7:checked) .note.tone-as::after { content: "b7"; }

/* ---------- Chord-button names and roman numerals in Sevenths.
   Generated by tools/gen-sevenths.js names.

   No markup change: hiding .rn and .q puts label::before exactly where .rn was
   (block, above the name) and label::after exactly where .q was (inline, after
   it). Replacing rather than appending is required — vii° must become viiø7, not
   °7, because °7 names a fully diminished seventh, a different chord.

   Only 28 content rules are needed because the suffix depends on scale degree and
   mode alone, not on the key: [id$="-major"] separates the two, and every major
   strip's id ends -major while no minor one does. */

main:has(#voicing-7th:checked) .chords li:nth-child(n+2) .rn,
main:has(#voicing-7th:checked) .chords li:nth-child(n+2) .q {
  display: none;
}

main:has(#voicing-7th:checked) .chords li:nth-child(n+2) label::before {
  display: block;
  font-size: 0.75rem;
  color: #888;
}

main:has(#voicing-7th:checked) .chords li:nth-child(n+2):has(input:checked) label::before {
  color: var(--note-fg);
  opacity: 0.7;
}

main:has(#voicing-7th:checked) .chords li:nth-child(n+2) label::after {
  font-size: 0.95rem;
}

/* major keys: roman numerals */
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(2) label::before { content: "Imaj7"; }
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(3) label::before { content: "ii7"; }
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(4) label::before { content: "iii7"; }
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(5) label::before { content: "IVmaj7"; }
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(6) label::before { content: "V7"; }
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(7) label::before { content: "vi7"; }
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(8) label::before { content: "vii\0000f87"; }

/* major keys: chord-name suffixes */
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(2) label::after { content: "maj7"; }
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(3) label::after { content: "m7"; }
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(4) label::after { content: "m7"; }
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(5) label::after { content: "maj7"; }
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(6) label::after { content: "7"; }
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(7) label::after { content: "m7"; }
main:has(#voicing-7th:checked) .chords[id$="-major"] li:nth-child(8) label::after { content: "m7b5"; }

/* minor keys: roman numerals */
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(2) label::before { content: "i7"; }
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(3) label::before { content: "ii\0000f87"; }
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(4) label::before { content: "IIImaj7"; }
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(5) label::before { content: "iv7"; }
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(6) label::before { content: "v7"; }
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(7) label::before { content: "VImaj7"; }
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(8) label::before { content: "VII7"; }

/* minor keys: chord-name suffixes */
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(2) label::after { content: "m7"; }
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(3) label::after { content: "m7b5"; }
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(4) label::after { content: "maj7"; }
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(5) label::after { content: "m7"; }
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(6) label::after { content: "m7"; }
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(7) label::after { content: "maj7"; }
main:has(#voicing-7th:checked) .chords[id$="-minor"] li:nth-child(8) label::after { content: "7"; }