/* MIDDERMUSIC Data – all rules scoped under .mmd. Uses the midder theme tokens with fallbacks. 0.1.6: house-style restyle. */
.mmd { --mmd-ink: var(--mm-ink, #0B0B0C); --mmd-paper: var(--mm-paper, #F6F5F1); --mmd-rule: var(--mm-rule, #CFCDC6); --mmd-accent: var(--mm-lilac, #B9A6DB); --mmd-muted: var(--mm-meta, #5A5A5E);
  --mmd-tint: rgba(185, 166, 219, .22); --mmd-mono: var(--mm-font-mono, "IBM Plex Mono", ui-monospace, monospace); --mmd-serif: var(--mm-font-serif, "Newsreader", Georgia, serif);
  --mmd-ease: cubic-bezier(.2, .7, .2, 1); --mmd-year-w: 3.75rem;
  font-family: var(--mm-font-sans, "Arimo", "Liberation Sans", system-ui, sans-serif); color: var(--mmd-ink); margin: 2.5rem 0; container-type: inline-size; }
.mmd *, .mmd *::before, .mmd *::after { box-sizing: border-box; }
/* Editor-only status banners and tags (unchanged look: they must stand out). */
.mmd .mmd-banner { border: 2px dashed var(--mmd-ink); background: #fff7d6; padding: .75rem 1rem; margin: 0 0 1rem; font-family: var(--mmd-mono); font-size: .85rem; }
.mmd .mmd-tag { display: inline-block; font-family: var(--mmd-mono); font-size: .7rem; font-style: normal; font-weight: 500; letter-spacing: .06em; background: #fff7d6; border: 1px solid var(--mmd-ink); padding: 0 .35em; vertical-align: middle; }
.mmd .mmd-note { font-family: var(--mmd-mono); font-size: .8rem; color: var(--mmd-muted); border: 1px dashed var(--mmd-rule); padding: .75rem; }

/* Chart card: masthead-weight top rule, hairline foot, paper ground. */
.mmd .mmd-chart { margin: 0; padding: 1.25rem 0 1rem; background: transparent; border-top: 3px solid var(--mmd-ink); border-bottom: 1px solid var(--mmd-ink); }
.mmd .mmd-chart__title { font-family: var(--mmd-serif); font-style: normal; font-weight: 500; color: var(--mmd-ink); font-size: 1.5rem; line-height: 1.22; letter-spacing: -.012em; margin: 0 0 .9rem; max-width: 34em; text-wrap: balance; }
.mmd .mmd-legend { display: flex; flex-wrap: wrap; gap: .4rem 1.5rem; align-items: center; margin: 0 0 1.1rem; padding-bottom: .9rem; border-bottom: 1px solid var(--mmd-rule); font-size: .875rem; line-height: 1.35; color: var(--mmd-ink); }
.mmd .mmd-legend > span { display: inline-flex; align-items: center; }
.mmd .mmd-key { display: inline-block; flex: none; width: 12px; height: 12px; border-radius: 50%; margin-right: .5rem; border: 1.5px solid var(--mmd-ink); }
.mmd .mmd-key--bna { background: var(--mmd-accent); }
.mmd .mmd-key--other { background: var(--mmd-paper); }
.mmd .mmd-chart__wrap { position: relative; }
.mmd svg { display: block; overflow: visible; }

/* Rows: year label + percentage-positioned SVG track. */
.mmd .mmd-plot { position: relative; }
.mmd .mmd-row, .mmd .mmd-xaxis { display: grid; grid-template-columns: var(--mmd-year-w) minmax(0, 1fr); align-items: center; padding-right: 14px; }
.mmd .mmd-row { position: relative; cursor: pointer; outline: none; }
.mmd .mmd-row::before { content: ""; position: absolute; inset: 2px 0; background: var(--mmd-tint); opacity: 0; transition: opacity .18s ease; pointer-events: none; }
.mmd .mmd-row > * { position: relative; }
.mmd .mmd-year { font-family: var(--mmd-mono); font-size: 13px; font-variant-numeric: tabular-nums; letter-spacing: .02em; color: var(--mmd-muted); padding-left: .25rem; justify-self: start; }
.mmd .mmd-row.is-peak .mmd-year { background: var(--mmd-accent); color: var(--mmd-ink); font-weight: 600; padding: .1rem .35rem; margin-left: -.1rem; }
.mmd .mmd-track { width: 100%; }
.mmd .mmd-grid { stroke: var(--mmd-rule); stroke-width: 1; shape-rendering: crispEdges; }
.mmd .mmd-grid--one { stroke: var(--mmd-ink); stroke-opacity: .45; stroke-dasharray: 2 3; }
.mmd .mmd-axis { font-family: var(--mmd-mono); font-size: 12px; fill: var(--mmd-muted); font-variant-numeric: tabular-nums; }
.mmd .mmd-xaxis { margin-top: .35rem; border-top: 1px solid var(--mmd-ink); padding-top: .15rem; }
.mmd .mmd-link { stroke: var(--mmd-ink); stroke-width: 3; stroke-linecap: round; stroke-opacity: .2; transform-box: fill-box; transform-origin: left center; }
.mmd .mmd-link--rev { transform-origin: right center; }
.mmd .mmd-dot { stroke: var(--mmd-ink); stroke-width: 1.5; transform-box: fill-box; transform-origin: center; }
.mmd .mmd-dot--bna { fill: var(--mmd-accent); }
.mmd .mmd-dot--other { fill: var(--mmd-paper); }
.mmd .mmd-peak-label { font-family: var(--mmd-mono); font-size: 12px; font-weight: 600; fill: var(--mmd-ink); }
.mmd .is-peak .mmd-link { stroke: var(--mmd-accent); stroke-opacity: 1; }
.mmd .is-peak .mmd-dot--bna { transform: scale(1.18); }

/* Emphasis: hover / focus / tap highlights the row and dims the others. */
.mmd .mmd-row:hover::before, .mmd .mmd-row.is-active::before, .mmd .mmd-row:focus-visible::before { opacity: 1; }
.mmd .mmd-plot.has-active .mmd-row:not(.is-active) :is(.mmd-link, .mmd-dot, .mmd-peak-label, .mmd-year) { opacity: .3; }
.mmd .mmd-link, .mmd .mmd-dot, .mmd .mmd-year, .mmd .mmd-peak-label { transition: opacity .18s ease, transform .2s var(--mmd-ease), stroke-opacity .18s ease; }
.mmd .mmd-row.is-active .mmd-dot, .mmd .mmd-row:hover .mmd-dot { transform: scale(1.3); }
.mmd .mmd-row.is-active .mmd-link, .mmd .mmd-row:hover .mmd-link { stroke-opacity: .55; }
.mmd .is-peak.is-active .mmd-link, .mmd .is-peak:hover .mmd-link { stroke-opacity: 1; }
.mmd .mmd-row.is-active .mmd-year, .mmd .mmd-row:hover .mmd-year { color: var(--mmd-ink); }
.mmd .mmd-row:focus-visible { outline: 2px solid var(--mmd-ink); outline-offset: -1px; }

/* Tooltip */
.mmd .mmd-tip { position: absolute; z-index: 3; transform: translate(-50%, calc(-100% - 10px)); width: max-content; max-width: min(19rem, calc(100% - 16px)); background: var(--mmd-ink); color: var(--mmd-paper); padding: .6rem .75rem .65rem; pointer-events: none; font-size: .8125rem; line-height: 1.35; box-shadow: 0 6px 18px rgba(11, 11, 12, .18); }
.mmd .mmd-tip.is-right { transform: translate(-100%, calc(-100% - 10px)); }
.mmd .mmd-tip.is-left { transform: translate(0, calc(-100% - 10px)); }
.mmd .mmd-tip.is-below { transform: translate(-50%, 10px); }
.mmd .mmd-tip.is-below.is-right { transform: translate(-100%, 10px); }
.mmd .mmd-tip.is-below.is-left { transform: translate(0, 10px); }
.mmd .mmd-tip.is-inline { position: static; transform: none; width: auto; max-width: none; margin-top: .75rem; box-shadow: none; font-size: .875rem; }
.mmd .mmd-tip__head { display: block; font-family: var(--mmd-mono); font-size: .75rem; letter-spacing: .04em; text-transform: uppercase; color: var(--mmd-rule); margin-bottom: .35rem; padding-bottom: .3rem; border-bottom: 1px solid rgba(246, 245, 241, .2); }
.mmd .mmd-tip__line { display: grid; grid-template-columns: 10px 1fr auto auto; align-items: baseline; column-gap: .5rem; padding: .12rem 0; }
.mmd .mmd-tip__key { width: 10px; height: 10px; border-radius: 50%; align-self: center; border: 1.5px solid var(--mmd-paper); }
.mmd .mmd-tip__key--bna { background: var(--mmd-accent); }
.mmd .mmd-tip__key--other { background: transparent; }
.mmd .mmd-tip__val { font-family: var(--mmd-mono); font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }
.mmd .mmd-tip__m { font-weight: 400; color: var(--mmd-rule); }
.mmd .mmd-tip__n { font-family: var(--mmd-mono); font-size: .75rem; color: var(--mmd-rule); min-width: 2.6em; }

.mmd .mmd-axis-note { font-size: .8125rem; line-height: 1.45; color: var(--mmd-muted); margin: .9rem 0 0; max-width: 40em; }

/* Chart values table (disclosure) */
.mmd .mmd-chart__data { margin-top: .9rem; font-size: .875rem; }
.mmd .mmd-chart__data summary { display: inline-flex; align-items: center; gap: .5rem; cursor: pointer; list-style: none; font-family: var(--mmd-mono); font-size: .75rem; letter-spacing: .05em; text-transform: uppercase; color: var(--mmd-ink); padding: .4rem .7rem .4rem .6rem; border: 1px solid var(--mmd-ink); }
.mmd .mmd-chart__data summary::-webkit-details-marker { display: none; }
.mmd .mmd-chart__data summary::before { content: "+"; display: inline-block; width: 1ch; text-align: center; font-weight: 600; }
.mmd .mmd-chart__data[open] summary::before { content: "\2212"; }
.mmd .mmd-chart__data summary:hover { background: var(--mmd-tint); }
.mmd .mmd-chart__data summary:focus-visible { outline: 2px solid var(--mmd-ink); outline-offset: 2px; }
.mmd .mmd-chart__data[open] .mmd-table { margin-top: .75rem; }

/* Tables */
.mmd .mmd-tools { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; margin-bottom: .75rem; }
.mmd .mmd-tools[hidden] { display: none; }
.mmd .mmd-tools label { font-family: var(--mmd-mono); font-weight: 500; font-size: .75rem; letter-spacing: .05em; text-transform: uppercase; flex-basis: 100%; }
.mmd .mmd-search { font: inherit; font-size: 1rem; border: 1px solid var(--mmd-ink); padding: .55rem .7rem; min-width: min(100%, 20rem); background: var(--mmd-paper); color: var(--mmd-ink); border-radius: 0; }
.mmd .mmd-count { font-family: var(--mmd-mono); font-size: .75rem; color: var(--mmd-muted); margin: 0; }
.mmd .mmd-scroll { overflow-x: auto; border-top: 3px solid var(--mmd-ink); border-bottom: 1px solid var(--mmd-ink); }
.mmd .mmd-scroll:focus-visible, .mmd .mmd-search:focus-visible, .mmd .mmd-sort:focus-visible, .mmd .mmd-copy:focus-visible { outline: 2px solid var(--mmd-ink); outline-offset: 2px; }
.mmd .mmd-table { width: 100%; border-collapse: collapse; font-size: .875rem; line-height: 1.4; background: transparent; margin: 0; }
.mmd .mmd-table caption { text-align: left; font-family: var(--mmd-serif); font-weight: 500; font-size: 1.125rem; font-style: normal; color: var(--mmd-ink); padding: .65rem 0 .5rem; caption-side: top; }
.mmd .mmd-table th, .mmd .mmd-table td { padding: .55rem .75rem .55rem 0; border-bottom: 1px solid var(--mmd-rule); text-align: left; vertical-align: top; }
.mmd .mmd-table th:last-child, .mmd .mmd-table td:last-child { padding-right: 0; }
.mmd .mmd-table thead th { background: transparent; font-family: var(--mmd-mono); font-size: .75rem; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; border-bottom: 1px solid var(--mmd-ink); vertical-align: bottom; line-height: 1.3; }
.mmd .mmd-table thead th[data-type="num"]:not([data-key="ceremony_year"]) { text-align: right; }
.mmd .mmd-table--compact thead th { white-space: nowrap; }
.mmd .mmd-tablewrap .mmd-table td:nth-child(2) { min-width: 7.5em; }
.mmd .mmd-tablewrap .mmd-table td:nth-child(3) { min-width: 8em; }
.mmd .mmd-tablewrap .mmd-table td:last-child { overflow-wrap: anywhere; min-width: 9em; font-size: .8125rem; }
.mmd .mmd-table tbody th { font-family: var(--mmd-mono); font-weight: 500; }
.mmd .mmd-table tbody tr:hover td, .mmd .mmd-table tbody tr:hover th { background: var(--mmd-tint); }
.mmd .mmd-num { text-align: right; font-family: var(--mmd-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.mmd .mmd-table th.mmd-num, .mmd .mmd-table td.mmd-num { text-align: right; }
.mmd .mmd-table--compact th[scope="col"]:not(:first-child) { text-align: right; }
.mmd .mmd-n { color: var(--mmd-muted); font-size: .75rem; margin-left: .25rem; }
.mmd tr.is-excluded td { color: var(--mmd-muted); }
.mmd .mmd-sort { all: unset; cursor: pointer; font: inherit; letter-spacing: inherit; text-transform: inherit; }
.mmd .mmd-sort:hover { text-decoration: underline; text-underline-offset: 3px; }
.mmd th[aria-sort="ascending"] .mmd-sort::after { content: " ▲"; }
.mmd th[aria-sort="descending"] .mmd-sort::after { content: " ▼"; }
/* Embed */
.mmd .mmd-fallback img { max-width: 100%; height: auto; display: block; }
.mmd .mmd-embed { margin-top: 1rem; }
.mmd .mmd-embed__label { display: block; font-weight: 700; margin-bottom: .35rem; }
.mmd .mmd-embed__code { width: 100%; font-family: var(--mmd-mono); font-size: .78rem; border: 1px solid var(--mmd-ink); padding: .5rem; background: var(--mmd-paper); }
.mmd .mmd-copy { margin-top: .4rem; font: inherit; font-weight: 700; background: var(--mmd-ink); color: var(--mmd-paper); border: 2px solid var(--mmd-ink); padding: .45rem .9rem; cursor: pointer; }

/* Entrance: JS adds .mmd-anim only when motion is allowed, then .is-in once the chart is on screen. */
@keyframes mmd-grow { from { transform: scaleX(0); } }
@keyframes mmd-pop { from { transform: scale(.2); opacity: 0; } }
@keyframes mmd-fade { from { opacity: 0; } }
.mmd .mmd-anim:not(.is-in) .mmd-link, .mmd .mmd-anim:not(.is-in) .mmd-dot, .mmd .mmd-anim:not(.is-in) .mmd-peak-label { opacity: 0; }
.mmd .mmd-anim.is-in .mmd-link { animation: mmd-grow .6s var(--mmd-ease) backwards; animation-delay: calc(var(--i, 0) * 45ms + 120ms); }
.mmd .mmd-anim.is-in .mmd-dot--other { animation: mmd-pop .4s var(--mmd-ease) backwards; animation-delay: calc(var(--i, 0) * 45ms); }
.mmd .mmd-anim.is-in .mmd-dot--bna { animation: mmd-pop .45s var(--mmd-ease) backwards; animation-delay: calc(var(--i, 0) * 45ms + 380ms); }
.mmd .mmd-anim.is-in .mmd-peak-label { animation: mmd-fade .4s ease backwards; animation-delay: calc(var(--i, 0) * 45ms + 700ms); }

/* Narrow columns (phones): bigger touch rows, every other axis label. */
@container (max-width: 520px) {
  .mmd { --mmd-year-w: 3.1rem; }
  .mmd .mmd-chart__title { font-size: 1.3rem; }
  .mmd .mmd-legend { font-size: .8125rem; gap: .35rem 1rem; }
  .mmd .mmd-axis--odd { display: none; }
  .mmd .mmd-year { font-size: 12px; padding-left: 0; }
  .mmd .mmd-row.is-peak .mmd-year { margin-left: 0; }
  .mmd .mmd-dot { transform: scale(.86); }
  .mmd .is-peak .mmd-dot--bna { transform: scale(1); }
  .mmd .mmd-row.is-active .mmd-dot, .mmd .mmd-row:hover .mmd-dot { transform: scale(1.1); }
  .mmd .mmd-table { font-size: .8125rem; }
  .mmd .mmd-table th, .mmd .mmd-table td { padding: .45rem .6rem .45rem 0; }
}
@media (prefers-reduced-motion: reduce) { .mmd *, .mmd *::before { transition: none !important; animation: none !important; } .mmd .mmd-anim .mmd-link, .mmd .mmd-anim .mmd-dot, .mmd .mmd-anim .mmd-peak-label { opacity: 1 !important; } }
@media print { .mmd .mmd-tools, .mmd .mmd-copy, .mmd .mmd-tip { display: none; } .mmd .mmd-row :is(.mmd-link, .mmd-dot, .mmd-peak-label, .mmd-year) { opacity: 1 !important; animation: none !important; } }
