/* /charts/ printable sheets, worksheets and PDF download blocks.
   Loaded by layouts/charts/single.html on every chart page, next to extras.css.
   Screen: a sheet is shown as a white page in black ink, so what you see is what comes out of the printer.
   Print: only the h1/lede ("print head"), the sheets and a one-line footer are printed; a sheet with
   data-print-mode set by chart-render.js (or by scripts/make-pdfs.py) prints on its own. */

/* ---- PDF download block -------------------------------------------------- */
.mtp-pdfkit { margin: 0 0 26px; padding: 16px 18px 12px; background: var(--mtp-raised); border: 1px solid var(--mtp-line); border-left: 3px solid var(--mtp-brass); border-radius: 2px; }
.mtp-pdfkit h2 { margin: 0 0 4px; font-size: 24px; }
.mtp-pdfkit-lede { margin: 0 0 10px; color: var(--mtp-muted); font-size: 14px; line-height: 1.5; }
.mtp-pdfkit ul { margin: 0; padding: 0; list-style: none; }
.mtp-pdf { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 18px; padding: 10px 0; border-top: 1px solid var(--mtp-line); }
.mtp-pdf:first-child { border-top: 0; }
.mtp-pdf-meta { flex: 1 1 260px; min-width: 0; }
.mtp-pdf-meta strong { display: block; color: var(--mtp-paper); font-size: 16px; }
.mtp-pdf-meta span { display: block; color: var(--mtp-muted); font-size: 13px; line-height: 1.45; }
.mtp-pdf-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.mtp-pdf-btns .mtp-button { display: inline-block; padding: 9px 14px; font-size: 14px; min-height: 40px; box-sizing: border-box; text-decoration: none; text-align: center; }
.mtp-pdf-btns .mtp-button small { display: block; font-size: 11px; font-weight: 400; opacity: .85; }
.mtp-pdfkit-note { margin: 8px 0 0; color: var(--mtp-muted); font-size: 12px; }

.mtp-print-buttons { display: flex; flex-wrap: wrap; gap: 8px 10px; }
.mtp-print-buttons .mtp-button { cursor: pointer; }

/* ---- the white page on screen --------------------------------------------- */
.mtp-ws {
  box-sizing: border-box; max-width: 860px; margin: 0 0 26px; padding: 26px 30px 22px;
  background: #fff; color: #111; border-radius: 2px; font-size: 15px; line-height: 1.45;
  font-family: "Source Sans 3", -apple-system, "Segoe UI", sans-serif;
}
.mtp-ws h2, .mtp-ws h3, .mtp-ws h4 { color: #111; font-family: "Cormorant Garamond", "Source Sans 3", serif; }
.mtp-ws a { color: #111; }
.mtp-ws table, .mtp-ws thead, .mtp-ws tbody, .mtp-ws tr, .mtp-ws th, .mtp-ws td { background: transparent !important; color: #111; }
.mtp-ws-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 24px; margin: 0 0 12px; padding-bottom: 8px; border-bottom: 2px solid #111; }
.mtp-ws-head h2 { margin: 0; font-size: 30px; font-weight: 600; line-height: 1.1; }
.mtp-ws-head p { margin: 0; font-size: 13px; color: #333; }
.mtp-ws-who { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0 0 12px; font-size: 14px; }
.mtp-ws-who span { display: inline-flex; align-items: flex-end; gap: 6px; flex: 1 1 140px; }
.mtp-ws-who i { flex: 1; border-bottom: 1px solid #111; height: 1.15em; }
.mtp-ws-credit { margin: 14px 0 0; padding-top: 6px; border-top: 1px solid #999; font-size: 10.5px; line-height: 1.4; color: #333; }
.mtp-ws-credit a { text-decoration: underline; }
.mtp-ws h3 { margin: 14px 0 4px; font-size: 19px; font-weight: 700; }
.mtp-ws-tip { margin: 0 0 6px; font-size: 13px; color: #333; }
.mtp-box { display: inline-block; min-width: 3.2em; height: 1.55em; border-bottom: 1.5px solid #111; vertical-align: bottom; }
.mtp-box-wide { min-width: 7em; }

/* ---- dynamics chart ------------------------------------------------------- */
.mtp-dyn-ladder { margin: 4px 0 6px; overflow-x: auto; }
.mtp-dyn-ladder svg { max-width: 100%; height: auto; display: block; }
.mtp-dyn-table { width: 100%; table-layout: fixed; border-collapse: collapse; margin: 6px 0 4px; font-size: 13.5px; }
.mtp-dyn-table col.c-sign { width: 14%; } .mtp-dyn-table col.c-it { width: 22%; } .mtp-dyn-table col.c-mean { width: 36%; } .mtp-dyn-table col.c-use { width: 28%; }
.mtp-dyn-table th, .mtp-dyn-table td { padding: 6px 8px; border-bottom: 1px solid #bbb; text-align: left; vertical-align: middle; }
.mtp-dyn-table thead th { border-bottom: 2px solid #111; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: #333; }
.mtp-dyn-sign { width: 4.2em; font-family: "Cormorant Garamond", serif; font-size: 27px; font-style: italic; font-weight: 700; line-height: 1; white-space: nowrap; }
.mtp-dyn-sign svg { width: 52px; height: 16px; display: block; }
.mtp-dyn-it { font-weight: 700; font-style: italic; }
.mtp-dyn-lit { display: block; color: #222; font-size: .92em; }
.mtp-dyn-mean { color: #222; }
.mtp-dyn-use { font-variant-numeric: tabular-nums; }
.mtp-dyn-use strong { font-size: 14px; }
.mtp-dyn-bar { display: block; margin-top: 3px; height: 6px; width: 100%; min-width: 80px; border: 1px solid #111; box-sizing: border-box; }
.mtp-dyn-bar i { display: block; height: 100%; background: #111; }
.mtp-dyn-insight { margin: 8px 0 0; font-size: 13.5px; }
.mtp-dyn-note { margin: 4px 0 0; font-size: 12px; color: #333; }
.mtp-dyn-table .mtp-play { margin: 0 0 0 6px; padding: 2px 8px; color: #111; border-color: #111; background: #fff; }
.mtp-dyn-table .mtp-play:hover { background: #eee; color: #111; }
.mtp-dyn-actions { margin: 4px 0 0; }
.mtp-dyn-actions .mtp-play { margin: 0 8px 4px 0; color: #111; border-color: #111; background: #fff; padding: 6px 12px; }

/* ---- worksheet parts -------------------------------------------------------- */
.mtp-part { break-inside: avoid; }
.mtp-match { display: grid; grid-template-columns: 1fr 1fr; gap: 0 36px; margin: 4px 0 0; }
.mtp-match ol, .mtp-match ul { margin: 0; padding: 0; list-style: none; }
.mtp-match li { display: flex; align-items: baseline; gap: 8px; padding: 4px 0; border-bottom: 1px dotted #999; }
.mtp-match .mtp-n { width: 1.7em; font-weight: 700; flex: none; }
.mtp-match .mtp-it { font-style: italic; font-weight: 600; flex: 1; }
.mtp-match .mtp-sign { font-family: "Cormorant Garamond", serif; font-size: 22px; font-style: italic; font-weight: 700; }
.mtp-order { display: flex; flex-wrap: wrap; gap: 8px 30px; margin: 2px 0; }
.mtp-order li { list-style: none; }
.mtp-order ol { list-style: none; margin: 0; padding: 0; width: 100%; }
.mtp-order-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 5px 0; }
.mtp-order-row .mtp-n { font-weight: 700; }
.mtp-order-signs { display: inline-flex; gap: 14px; font-family: "Cormorant Garamond", serif; font-size: 23px; font-style: italic; font-weight: 700; padding: 0 12px; border: 1px solid #111; border-radius: 3px; }
.mtp-order-slots { display: inline-flex; gap: 8px; align-items: flex-end; }
.mtp-order-slots i { width: 2.6em; height: 1.6em; border-bottom: 1.5px solid #111; }
.mtp-order-arrow { font-size: 12px; color: #333; }
.mtp-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px 22px; margin: 2px 0; padding: 0; list-style: none; }
.mtp-grid3 li { display: flex; align-items: baseline; gap: 8px; padding: 4px 0; border-bottom: 1px dotted #999; font-size: 14px; }
.mtp-grid3 .mtp-n { font-weight: 700; width: 1.4em; flex: none; }
.mtp-pair { font-family: "Cormorant Garamond", serif; font-size: 23px; font-style: italic; font-weight: 700; }
.mtp-pair b { font-weight: 700; }
.mtp-pair em { font-style: normal; font-family: "Source Sans 3", sans-serif; font-size: 12px; font-weight: 400; margin: 0 5px; }
.mtp-hair { width: 54px; height: 16px; flex: none; align-self: center; }
.mtp-hair-word { font-family: "Cormorant Garamond", serif; font-size: 22px; font-style: italic; font-weight: 700; min-width: 54px; }
.mtp-tick { font-size: 13px; white-space: nowrap; }
.mtp-tick::before { content: ""; display: inline-block; width: 10px; height: 10px; border: 1.3px solid #111; margin-right: 4px; vertical-align: -1px; }
.mtp-answer { font-weight: 700; }
.mtp-ans-grid { columns: 2; column-gap: 34px; }
.mtp-ans-grid .mtp-part { break-inside: avoid; margin-bottom: 4px; }
.mtp-ans-list { margin: 0; padding: 0; list-style: none; font-size: 14px; }
.mtp-ans-list li { padding: 2px 0; border-bottom: 1px dotted #aaa; }
.mtp-ans-list b { font-family: "Cormorant Garamond", serif; font-size: 18px; font-style: italic; }

/* ---- key signature worksheet ------------------------------------------------ */
.mtp-ks-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 30px; margin: 4px 0 0; padding: 0; list-style: none; }
.mtp-ks-item { display: grid; grid-template-columns: 2.1em 1fr; grid-template-areas: "n pic" ". text"; gap: 0 4px; padding: 2px 0 8px; border-bottom: 1px dotted #999; break-inside: avoid; min-width: 0; }
.mtp-ks-n { grid-area: n; font-weight: 700; font-size: 17px; padding-top: 22px; }
.mtp-ks-item .mtp-vex { grid-area: pic; min-width: 0; }
.mtp-ks-item .mtp-vex svg { width: 100% !important; max-width: 260px; height: auto !important; display: block; }
@media print { .mtp-ks-item .mtp-vex svg { max-width: 290px; } .mtp-ks-grid { gap: 2mm 12mm; } .mtp-ks-item { padding-bottom: 4px; } }
.mtp-ks-text { grid-area: text; min-width: 0; font-size: 14px; }
.mtp-ks-text p { margin: 3px 0 0; display: flex; align-items: flex-end; gap: 6px; }
.mtp-ks-text i { flex: 1; border-bottom: 1px solid #111; height: 1.3em; min-width: 3em; }
.mtp-ks-hint { color: #333; font-size: 12.5px; }
.mtp-ks-sources { margin: 0; padding: 0; list-style: none; font-size: 13px; }
.mtp-ks-sources li { margin: 3px 0; }
.mtp-ks-answers { display: grid; grid-template-columns: 1fr 1fr 1.35fr; gap: 0 22px; }
.mtp-ks-answers h3 { margin-top: 4px; font-size: 18px; }

/* ---- blank circle of fifths ------------------------------------------------ */
.mtp-bc { display: flex; justify-content: center; margin: 4px 0 0; }
.mtp-bc svg { width: min(100%, 560px); height: auto; display: block; }
.mtp-bc .bc-ring, .mtp-bc .bc-spoke { fill: none; stroke: #111; stroke-width: 1.6; }
.mtp-bc .bc-major { fill: #111; font-family: "Cormorant Garamond", serif; font-size: 30px; font-weight: 700; }
.mtp-bc .bc-minor { fill: #111; font-family: "Cormorant Garamond", serif; font-size: 23px; font-weight: 600; }
.mtp-bc .bc-sig { fill: #111; font-family: "Source Sans 3", sans-serif; font-size: 17px; font-weight: 600; }
.mtp-bc .bc-major.bc-tight { font-size: 23px; }
.mtp-bc .bc-minor.bc-tight { font-size: 14px; }
.mtp-bc .bc-sig.bc-tight { font-size: 13px; }
.mtp-bc .bc-centre { fill: #333; font-family: "Source Sans 3", sans-serif; font-size: 11.5px; }
.mtp-bc .bc-label { fill: #333; font-family: "Source Sans 3", sans-serif; font-size: 8.5px; letter-spacing: .08em; text-transform: uppercase; }
.mtp-bc .bc-blank { fill: none; stroke: #777; stroke-width: 1; stroke-dasharray: 2 4; }
.mtp-bc-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 20px; margin: 6px 0 0; font-size: 13px; }
.mtp-bc-orders { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 28px; margin: 10px 0 0; font-size: 13.5px; }
.mtp-bc-orders p { margin: 0; }

/* ---- music history timeline (layouts/_partials/charts/timeline.html, history-worksheet.html) -------------------- */
.mtp-answerbox { margin: 0 0 22px; padding: 14px 18px; background: var(--mtp-raised); border: 1px solid var(--mtp-line); border-left: 3px solid var(--mtp-brass); border-radius: 2px; }
.mtp-answerbox h2 { margin: 0 0 4px; font-size: 22px; }
.mtp-answerbox p { margin: 0; max-width: 72ch; color: var(--mtp-muted); font-size: 16px; line-height: 1.6; }
.mtp-answerbox strong { color: var(--mtp-paper); }
.mtp-tl-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.mtp-tl-swipe { display: none; margin: 0 0 6px; font-size: 12.5px; color: #444; }
.mtp-tl {
  display: block; width: 100%; min-width: 660px; max-width: 100%; height: auto; margin: 0 auto;
  font-family: "Source Sans 3", -apple-system, "Segoe UI", sans-serif;
  --c0: #8c6d3f; --c1: #c2791c; --c2: #b3362f; --c3: #c44a8f; --c4: #8a4fb3; --c5: #4a5fc1; --c6: #1f7fb5; --c7: #1d9a8a; --c8: #4a9a3c; --c9: #555;
}
.mtp-tl text { fill: #111; font-size: 7.6px; }
.mtp-tl .tl-lane { font-size: 7.4px; font-weight: 700; fill: #333; letter-spacing: .01em; }
.mtp-tl .tl-axis text { font-size: 7.4px; fill: #444; }
.mtp-tl .tl-axis line { stroke: #555; stroke-width: .6; }
.mtp-tl .tl-grid line { stroke: #e2e0da; stroke-width: .5; }
.mtp-tl .tl-bounds line { stroke: #8a8a8a; stroke-width: .6; stroke-dasharray: 2 2; }
.mtp-tl .tl-legend text { font-size: 8px; }
.mtp-tl .tl-dates { font-size: 6.9px; fill: #222; }
.mtp-tl .tl-n { font-weight: 700; }
.mtp-tl .tl-sw, .mtp-tl .tl-band, .mtp-tl .tl-bar { stroke-width: .7; }
.mtp-tl .tl-sbar { fill: #f1efe9; stroke: #222; stroke-width: .8; }
.mtp-tl .tl-sbar.dl { stroke-dasharray: 3 1.6; }
.mtp-tl .tl-arrow { fill: none; stroke: #222; stroke-width: .9; }
.mtp-tl .tl-spans text { font-size: 7.6px; font-weight: 600; }
.mtp-tl .tl-bandn { font-size: 9px; font-weight: 700; paint-order: stroke; stroke: #fff; stroke-width: 2.4px; stroke-linejoin: round; }
.mtp-tl .tl-bar.living { stroke-dasharray: 3 1.4; }
.mtp-tl .tl-comps text { font-size: 8.1px; }
.mtp-tl a.tl-c { cursor: pointer; }
.mtp-tl a.tl-c:hover text, .mtp-tl a.tl-c:focus text { font-weight: 700; text-decoration: underline; }
.mtp-tl a.tl-c:hover rect, .mtp-tl a.tl-c:focus rect { stroke-width: 1.5; }
.mtp-tl .tl-bg { fill: #fff; }
.mtp-tl .tl-solid { fill: var(--c9); }
.mtp-tl .hz path { fill: none; }
.mtp-tl .hz path:not(.vs) { stroke-width: .9; }
.mtp-tl .hz .dots { stroke-width: 1.6; stroke-linecap: round; stroke-dasharray: 0 3.4; }
.mtp-tl .hz .dots2 { stroke-width: 1.2; stroke-linecap: round; stroke-dasharray: 0 2; }
.mtp-tl .hz .dash { stroke-dasharray: 4 2.4; }
.mtp-tl .hz .vs { stroke-dasharray: 1.1 3.1; }
.mtp-tl .e0 { stroke: var(--c0); } .mtp-tl .e1 { stroke: var(--c1); } .mtp-tl .e2 { stroke: var(--c2); } .mtp-tl .e3 { stroke: var(--c3); } .mtp-tl .e4 { stroke: var(--c4); }
.mtp-tl .e5 { stroke: var(--c5); } .mtp-tl .e6 { stroke: var(--c6); } .mtp-tl .e7 { stroke: var(--c7); } .mtp-tl .e8 { stroke: var(--c8); } .mtp-tl .e9 { stroke: var(--c9); }
.mtp-tl-note { margin: 6px 0 0; font-size: 12px; line-height: 1.4; color: #333; }

/* The two printed pages of the timeline (mtp-tlp, hidden on screen). One user unit = 1 pt on A4, so these sizes are the
   printed sizes: nothing on the page is smaller than 7.8 pt (the notes and the source line are 7.5 pt). */
.mtp-tl.mtp-tlp { min-width: 0; width: 100%; height: auto; }
.mtp-tl.mtp-tlp text, .mtp-tl.mtp-tlp .tl-spans text, .mtp-tl.mtp-tlp .tl-comps text, .mtp-tl.mtp-tlp .tl-legend text { font-size: 8.2px; }
.mtp-tl.mtp-tlp .tl-lane { font-size: 8px; }
.mtp-tl.mtp-tlp .tl-axis text, .mtp-tl.mtp-tlp .tl-dates { font-size: 7.8px; }
.mtp-tl.mtp-tlp .tl-bandn { font-size: 9.6px; stroke-width: 2.8px; }
.mtp-tl.mtp-tlp .tl-sw, .mtp-tl.mtp-tlp .tl-band, .mtp-tl.mtp-tlp .tl-bar { stroke-width: .8; }
.mtp-tl.mtp-tlp .tl-sbar { stroke-width: .9; }
.mtp-tl.mtp-tlp .tl-grid line { stroke: #d9d6ce; }
.mtp-tl.mtp-tlp .hz .dots { stroke-linecap: butt; stroke-width: 1.5; stroke-dasharray: 1.5 2.3; }
.mtp-tl.mtp-tlp .hz .dots2 { stroke-linecap: butt; stroke-width: 1.1; stroke-dasharray: 1.1 1.3; }

.mtp-tl-text h2 { margin-top: 38px; }
.mtp-tl-how { max-width: 74ch; padding-left: 1.3em; line-height: 1.6; }
.mtp-tl-how li { margin: 0 0 8px; }
.mtp-era { margin: 28px 0 0; padding-top: 18px; border-top: 1px solid var(--mtp-line); }
.mtp-era > h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; font-size: 1.7rem; color: var(--mtp-paper); }
.mtp-era-num { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 34px; height: 34px; border: 1px solid var(--mtp-brass); border-radius: 50%; color: var(--mtp-brass-bright); font-size: 1.1rem; font-weight: 600; }
.mtp-era-facts { margin: 0 0 14px; display: grid; gap: 4px 0; font-size: 15px; line-height: 1.55; }
.mtp-era-facts div { display: grid; grid-template-columns: 11.5em 1fr; gap: 0 14px; align-items: baseline; }
.mtp-era-facts dt { margin: 0; color: var(--mtp-muted); font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.mtp-era-facts dd { margin: 0; min-width: 0; }
.mtp-era-facts a { color: var(--mtp-brass-bright); }
.mtp-era .mtp-bg-block { margin: 0 0 16px; padding-top: 0; border-top: 0; }
.mtp-era-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 6px 36px; }
.mtp-era-cols h4 { margin: 8px 0 6px; font-size: 1.1rem; color: var(--mtp-paper); }
.mtp-era-cols h4 small { color: var(--mtp-muted); font-size: .72em; font-weight: 400; }
.mtp-era-list { margin: 0 0 8px; padding: 0; list-style: none; }
.mtp-era-list li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 10px; padding: 5px 0; border-bottom: 1px solid var(--mtp-line); line-height: 1.45; }
.mtp-era-list li > span { color: var(--mtp-muted); font-variant-numeric: tabular-nums; }
.mtp-era-list li > small { flex-basis: 100%; color: var(--mtp-muted); font-size: 12.5px; }
.mtp-era-list a { color: var(--mtp-brass-bright); }

.mtp-match-hist .mtp-it { font-style: normal; }
.mtp-match-hist .mtp-sign { font-family: "Source Sans 3", sans-serif; font-style: normal; font-size: 15px; font-weight: 600; }
.mtp-hist-pool { display: grid; grid-template-columns: 1fr 1fr; gap: 3px 28px; margin: 4px 0 6px; padding: 0; list-style: none; font-size: 14.5px; }
.mtp-hist-pool li { padding: 3px 0; border-bottom: 1px dotted #999; }
.mtp-hist-pool .mtp-n { font-weight: 700; display: inline-block; width: 1.4em; }
.mtp-hist-pool4 li { border-bottom: 0; }
.mtp-hist-slots { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 6px 0 2px; }
.mtp-slot { display: inline-flex; align-items: flex-end; gap: 4px; font-size: 13px; }
.mtp-slot i { display: inline-block; width: 2.6em; height: 1.5em; border-bottom: 1.5px solid #111; }
.mtp-hist-dates { grid-template-columns: repeat(2, 1fr); }
.mtp-hist-dates li, .mtp-hist-names li { border-bottom: 1px dotted #999; }
.mtp-hist-dates li > span, .mtp-hist-names li > span { white-space: nowrap; }
.mtp-hist-answers .mtp-ans-list b { font-family: "Source Sans 3", sans-serif; font-style: normal; font-size: 14.5px; }
.mtp-hist-answers .mtp-ans-list small { font-size: 12px; color: #333; }

@media screen and (max-width: 720px) {
  .mtp-tl-swipe { display: block; }
  .mtp-tl { min-width: 900px; }
  .mtp-era-facts div { grid-template-columns: 1fr; }
  .mtp-hist-pool { grid-template-columns: 1fr; }
}
@media print {
  .mtp-hist-names, .mtp-hist-dates { gap: 2pt 14pt; }
  .mtp-tl-swipe { display: none !important; }
  .mtp-tl-scroll { overflow: visible; }
  .mtp-tl { min-width: 0; width: auto; height: 232mm; max-width: 100%; }
  .mtp-tl.mtp-tlp { width: 100%; height: auto; max-height: 210mm; margin: 0 auto; }
  .mtp-tl-pp .mtp-ws-head { margin: 0 0 5pt; padding-bottom: 3pt; }
  .mtp-tl-pp .mtp-ws-head h2 { font-size: 18pt; }
  .mtp-tl-pp .mtp-ws-head p { font-size: 9pt; }
  .mtp-tl .hz { stroke: #000 !important; }
  .mtp-tl .tl-solid { fill: #222 !important; }
  .mtp-tl .tl-bar, .mtp-tl .tl-band, .mtp-tl .tl-sw { stroke: #000 !important; }
  .mtp-tl text { fill: #000 !important; }
  .mtp-tl-note { font-size: 7.5pt; line-height: 1.3; margin-top: 3pt; }
  .mtp-tl-pp .mtp-ws-credit { margin-top: 4pt; padding-top: 3pt; line-height: 1.3; }
  .mtp-hist-pool { font-size: 10pt; }
  .mtp-hist-pool li { padding: 1.5pt 0; }
  .mtp-slot i { border-bottom-color: #000; }
}

/* ---- sheet footer (browser printing only: the PDFs carry a page footer instead) --- */
.mtp-print-foot { display: none; }

/* ---- print-only sheets (the terms PDF kit) ------------------------------------ */
.mtp-printonly { display: none; }
.mtp-pr { background: #fff; color: #111; }

.mtp-gl { columns: 2; column-gap: 8mm; font-size: 8.2pt; line-height: 1.24; }
.mtp-gl h3 { break-after: avoid; margin: 5pt 0 2pt; padding-bottom: 1pt; border-bottom: 1pt solid #111; font-size: 12pt; font-weight: 700; }
.mtp-gl p { margin: 0 0 3pt; break-inside: avoid; }
.mtp-gl b { font-style: italic; }
.mtp-gl .ab { font-weight: 700; }
.mtp-gl .lit { color: #222; }
.mtp-qr { columns: 2; column-gap: 8mm; font-size: 9.2pt; line-height: 1.3; }
.mtp-qr h3 { column-span: all; margin: 8pt 0 3pt; padding-bottom: 1pt; border-bottom: 1pt solid #111; font-size: 13pt; }
.mtp-qr h3:first-of-type { margin-top: 0; }
.mtp-qr .mtp-qr-item { break-inside: avoid; margin: 0 0 4.5pt; padding-bottom: 3pt; border-bottom: .5pt dotted #888; }
.mtp-qr .mtp-qr-t { font-size: 11pt; font-weight: 700; font-style: italic; }
.mtp-qr .mtp-qr-ab { font-weight: 700; margin-left: 4pt; }
.mtp-qr .mtp-qr-bpm { margin-left: 5pt; font-size: 8pt; border: .5pt solid #111; padding: 0 3pt; }
.mtp-qr .mtp-qr-lit { display: block; color: #222; font-size: 8.4pt; }
.mtp-qr .mtp-qr-n { display: block; color: #333; font-size: 7.8pt; }
.mtp-quiz-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 9mm; }
.mtp-qr-tight { columns: 3; column-gap: 6mm; font-size: 8pt; }
.mtp-qr-tight .mtp-qr-t { font-size: 10pt; }
.mtp-qr-tight .mtp-qr-lit { font-size: 7.4pt; }
.mtp-quiz-q { display: flex; align-items: flex-end; gap: 6px; padding: 6pt 0; font-size: 10.5pt; }
.mtp-quiz-q .mtp-n { font-weight: 700; width: 1.8em; flex: none; }
.mtp-quiz-q .mtp-it { font-style: italic; font-weight: 700; min-width: 6.5em; }
.mtp-quiz-q i.line { flex: 1; border-bottom: 1px solid #111; height: 1.35em; }
.mtp-quiz-q .mtp-clue { min-width: 6.5em; }

/* ---- narrow screens --------------------------------------------------------- */
@media screen and (max-width: 720px) {
  .mtp-ws { padding: 16px 14px 14px; }
  .mtp-ws-head h2 { font-size: 25px; }
  .mtp-dyn-table { display: block; overflow-x: auto; max-width: 100%; table-layout: auto; }
  .mtp-dyn-table col { width: auto !important; }
  .mtp-dyn-table td, .mtp-dyn-table th { min-width: 5.5em; }
  .mtp-match { grid-template-columns: 1fr; }
  .mtp-grid3 { grid-template-columns: 1fr; }
  .mtp-grid3 li { flex-wrap: wrap; }
  .mtp-ks-grid { grid-template-columns: 1fr; }
  .mtp-ks-answers { grid-template-columns: 1fr; }
  .mtp-bc-orders { grid-template-columns: 1fr; }
  .mtp-ans-grid { columns: 1; }
  .mtp-quiz-grid { grid-template-columns: 1fr; }
}

/* ---- print --------------------------------------------------------------------- */
@media print {
  @page { margin: 14mm 14mm 16mm; }
  html, body { background: #fff !important; color-scheme: light !important; }
  :root { color-scheme: light !important; }

  /* Only the print head, the sheets and the footer line are printed. */
  .mtp-chart-page > *:not(.mtp-sheet):not(.mtp-print-head):not(.mtp-print-foot) { display: none !important; }
  .mtp-chart-page[data-print-head="no"] .mtp-print-head { display: none !important; }
  .mtp-print-foot { display: block; margin: 10pt 0 0; font-size: 8pt; color: #333 !important; text-align: center; }
  html[data-pdf] .mtp-print-foot { display: none !important; }
  .mtp-screen-only { display: none !important; }

  /* A page break between sheets. When the reader (or the PDF script) picked sheets, only those are printed. */
  .mtp-sheet ~ .mtp-sheet { break-before: page; }
  html[data-print-mode] .mtp-sheet:not(.mtp-print-target) { display: none !important; }
  html[data-print-mode] .mtp-sheet { break-before: auto; }
  html[data-print-mode] .mtp-print-target ~ .mtp-print-target { break-before: page; }
  .mtp-printonly { display: none !important; }
  html:not([data-print-mode]) .mtp-printonly[data-print-default] { display: block !important; }
  html[data-print-mode] .mtp-printonly.mtp-print-target { display: block !important; }

  .mtp-ws { max-width: none; margin: 0; padding: 0; border-radius: 0; font-size: 10pt; line-height: 1.35; }
  .mtp-ws h3 { margin: 9pt 0 2pt; font-size: 14pt; }
  .mtp-ws-who { margin-bottom: 4pt; }
  .mtp-match li { padding: 2.5pt 0; }
  .mtp-grid3 li { padding: 3pt 0; }
  .mtp-order-row { padding: 3pt 0; }
  .mtp-ws * { color: #000 !important; }
  .mtp-ws-head h2 { font-size: 22pt; }
  .mtp-ws-credit { font-size: 7.5pt; }
  .mtp-dyn-table { font-size: 9pt; }
  .mtp-dyn-table th, .mtp-dyn-table td { padding: 1.2pt 5pt; }
  .mtp-dyn-insight, .mtp-dyn-note { font-size: 8.5pt; margin-top: 3pt; }
  .mtp-dyn-demo { display: none; }
  .mtp-dyn-lit { font-size: .85em; line-height: 1.1; }
  .mtp-dyn-table .mtp-hair { width: 40px; height: 12px; }
  .mtp-dyn-sign { font-size: 18pt; }
  .mtp-dyn-ladder { overflow: visible; }
  .mtp-dyn-ladder svg { width: 50% !important; height: auto !important; margin: 0 auto; }
  .mtp-dyn-bar, .mtp-dyn-bar i { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .mtp-dyn-bar i { background: #000 !important; }
  .mtp-ks-grid { gap: 2mm 10mm; }
  .mtp-ks-n { padding-top: 16px; }
  .mtp-bc .bc-ring, .mtp-bc .bc-spoke { stroke: #000 !important; }
  .mtp-bc .bc-blank { stroke: #666 !important; }
  .mtp-bc text { fill: #000 !important; }
  .mtp-bc .bc-centre, .mtp-bc .bc-label { fill: #333 !important; }
  .mtp-hair { stroke: #000; }
  .mtp-gl, .mtp-qr { color: #000 !important; }
  .mtp-gl *, .mtp-qr * { color: #000 !important; }
}
.mtp-qr .mtp-qr-m { display: block; }

/* Worksheet answer grids: three columns need ~900px; below that the fixed-width
   write-in boxes push the page wider than the screen. */
@media screen and (max-width: 900px) {
  .mtp-grid3, .mtp-hist-dates { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mtp-hist-dates li > span, .mtp-hist-names li > span { white-space: normal; }
  .mtp-grid3 li { flex-wrap: wrap; }
}
@media screen and (max-width: 560px) {
  .mtp-grid3, .mtp-hist-dates { grid-template-columns: minmax(0, 1fr); }
}
