/* Notation colours for js/notation.js. The engraving is ink on the page's
   own surface, so it follows the light and dark themes from tokens.css. */
.mtn { display: block; max-width: 100%; height: auto; overflow: visible; color: var(--notation-ink, var(--ink)); }
.mtn .ink { fill: currentColor; }
.mtn .ink-stroke { stroke: currentColor; }
.mtn .staff { stroke: var(--notation-staff, color-mix(in srgb, var(--ink) 62%, transparent)); stroke-width: 1; }
.mtn .ledger { stroke: currentColor; stroke-width: 1.3; }
.mtn .stem { stroke: currentColor; stroke-width: 1.2; }
.mtn .gap { fill: color-mix(in srgb, var(--accent) 8%, transparent); stroke: var(--accent); stroke-width: 1.2; stroke-dasharray: 4 3; }
.mtn .gap-label { fill: var(--accent); font-family: var(--sans); font-weight: 700; font-size: 18px; }