:root {
  --mdm-ground: #e3e3f5;
  --mdm-ink: #222f27;
  --mdm-accent: #852d48;
  --mdm-support: #e2c5cf;
  --mdm-surface: #fafafc;
  color-scheme: light;
  font-family: 'Varta', 'Trebuchet MS', sans-serif;
  color: var(--mdm-ink);
  background: var(--mdm-surface);
  font-synthesis: none;
}
* { box-sizing: border-box; }
body { margin: 0; font-size: 20px; line-height: 1.6; }
img { display: block; max-width: 100%; }
a { color: var(--mdm-accent); text-underline-offset: 5px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 3px; }
a:focus-visible { outline: 3px solid var(--mdm-accent); outline-offset: 5px; }
::selection { background: var(--mdm-support); color: var(--mdm-ink); }
h1, h2, h3, blockquote { font-family: 'Eczar', Georgia, serif; font-weight: 500; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: clamp(42px, 4.65vw, 67px); line-height: 1.08; letter-spacing: -.035em; text-wrap: balance; }
h2 { font-size: clamp(30px, 3vw, 42px); line-height: 1.2; letter-spacing: -.025em; text-wrap: balance; }
h3 { font-size: 25px; line-height: 1.3; }
p + p { margin-top: 22px; }
.mdm-jump { position: absolute; top: 8px; left: 12px; z-index: 20; padding: 10px 16px; background: var(--mdm-surface); transform: translateY(-150%); }
.mdm-jump:focus { transform: translateY(0); }

/* The inset stays at the upper centre, its entire link list at its left. */
.mdm-inset-masthead { position: relative; z-index: 2; padding: 16px 20px 24px; background: var(--mdm-ground); }
.mdm-square-wordmark { display: flex; width: 116px; height: 116px; margin: auto; position: relative; align-items: center; justify-content: center; background: var(--mdm-surface); box-shadow: 8px 8px 0 var(--mdm-support), 9px 9px 0 var(--mdm-accent); }
.mdm-name { font-family: 'Eczar', Georgia, serif; font-weight: 500; font-size: 21px; line-height: 1.24; color: var(--mdm-ink); text-decoration: none; }
.mdm-name span { display: block; }
.mdm-name:hover { color: var(--mdm-accent); }
.mdm-left-links { position: absolute; right: calc(100% + 25px); top: 50%; transform: translateY(-50%); width: 143px; }
.mdm-left-links ul { list-style: none; padding: 0; margin: 0; }
.mdm-left-links li { height: 27px; }
.mdm-left-links a { font-size: 17px; line-height: 27px; display: flex; align-items: center; gap: 9px; text-decoration: none; color: var(--mdm-ink); }
.mdm-left-links a:hover, .mdm-left-links a[aria-current='page'] { color: var(--mdm-accent); text-decoration: underline; text-underline-offset: 3px; }
.mdm-glyph { display: inline-block; flex: 0 0 auto; width: 20px; height: 20px; vertical-align: -.2em; stroke-width: 1.6; font-style: normal; }
.mdm-glyph > svg { display: block; width: 100%; height: 100%; }
.mdm-left-links .mdm-glyph { width: 17px; height: 17px; }

/* Separate opaque reading fields leave the actual photograph exposed. */
.mdm-opening { position: relative; isolation: isolate; padding: 34px max(36px, calc((100vw - 1328px) / 2)) 46px; background: var(--mdm-ground) url('rain-field.webp') center 53% / cover; }
.mdm-first-sheet { position: relative; max-width: 1328px; margin: auto; }
.mdm-title-field { max-width: 1100px; margin: 0 auto; padding: 25px 44px 29px; background: var(--mdm-surface); box-shadow: 12px 12px 0 var(--mdm-ground); }
.mdm-title-field h1 { max-width: 1012px; }
.mdm-opening-spread { display: grid; grid-template-columns: minmax(0, 1fr) 260px minmax(0, 1fr); gap: 36px; align-items: center; margin-top: 48px; }
.mdm-welcome { grid-column: 1; grid-row: 1; padding: 24px 26px 26px; max-width: 340px; align-self: center; background: var(--mdm-surface); }
.mdm-welcome p { font-size: 21px; line-height: 1.45; }
.mdm-welcome .mdm-welcome-line { font-size: 16px; line-height: 1.4; margin-bottom: 14px; color: var(--mdm-accent); }
.mdm-welcome p + p { margin-top: 0; }
.mdm-promise-field { grid-column: 3; grid-row: 1; width: 100%; max-width: 400px; justify-self: end; padding: 25px 27px 28px; background: var(--mdm-surface); }
.mdm-graduated-mention { margin: 0; color: var(--mdm-ink); cursor: text; }
.mdm-mention-name { display: block; font-family: 'Eczar', Georgia, serif; font-size: 25px; font-weight: 500; line-height: 1.2; }
.mdm-mention-prescription { display: block; font-size: 19px; line-height: 1.35; margin: 10px 0 0 16px; }
.mdm-mention-qualifications { display: block; font-size: 16px; line-height: 1.42; margin: 11px 0 0 32px; }
.mdm-detail-field { grid-column: 2; grid-row: 1; padding: 14px 0; }
.mdm-stone-orbit { position: relative; width: 260px; height: 260px; margin: 0; isolation: isolate; filter: drop-shadow(0 14px 18px rgba(34, 47, 39, .2)); }
.mdm-wide-crop { position: absolute; inset: 0; border-radius: 50%; overflow: hidden; background: var(--mdm-support); border: 5px solid var(--mdm-surface); }
.mdm-wide-crop img { width: 100%; height: 100%; object-fit: cover; object-position: 55% 53%; }
.mdm-stone-orbit::before { content: ''; position: absolute; inset: -29px; background: url('offset-arcs.svg') center / contain no-repeat; z-index: 3; pointer-events: none; }
.mdm-scale-crescent { position: absolute; width: 224px; height: 224px; border-radius: 50%; left: 18px; top: 30px; background: var(--mdm-surface); }
.mdm-near-crop { position: absolute; width: 204px; height: 204px; border-radius: 50%; left: 28px; top: 58px; overflow: hidden; background: var(--mdm-support); }
.mdm-near-crop img { width: 100%; height: 100%; object-fit: cover; object-position: 55% 53%; transform: scale(2); }

/* Wide, narrow, wide: physically change the scale of the question. */
.mdm-story-flow { position: relative; overflow: clip; }
.mdm-prose-band { position: relative; margin: 0 auto; padding: 94px 44px 94px 148px; }
.mdm-prose-band h2 { margin-bottom: 28px; }
.mdm-band-content { position: relative; }
.mdm-band-content p { max-width: 760px; }
.mdm-scale-outer { max-width: 1200px; display: grid; grid-template-columns: minmax(240px, 320px) minmax(0, 1fr); gap: 48px; }
.mdm-scale-outer h2 { align-self: start; }
.mdm-step { font-family: 'Eczar', Georgia, serif; font-size: 142px; line-height: 1; position: absolute; top: 81px; left: 27px; color: var(--mdm-accent); }
.mdm-scale-outer .mdm-band-content p:last-child { padding-left: 24px; border-left: 4px solid var(--mdm-support); }
.mdm-scale-inset { max-width: 820px; padding: 61px 75px 65px; margin-top: 25px; margin-bottom: 42px; background: var(--mdm-ground); border-left: 6px solid var(--mdm-accent); box-shadow: 17px 17px 0 var(--mdm-support); isolation: isolate; }
.mdm-scale-inset::before { content: ''; position: absolute; left: -158px; top: 26px; width: 270px; height: 270px; background: url('offset-arcs.svg') center / contain no-repeat; clip-path: inset(0 112px 0 0); pointer-events: none; z-index: -1; }
.mdm-scale-inset .mdm-step { font-size: 94px; top: -37px; left: -47px; }
.mdm-scale-return { max-width: 1200px; display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 66px; padding: 94px 44px 100px; isolation: isolate; }
.mdm-scale-return::before { content: ''; position: absolute; inset: 0; left: calc((1200px - 100vw) / 2); right: calc((1200px - 100vw) / 2); background: var(--mdm-support); z-index: -1; }
.mdm-scale-return h2 { align-self: start; padding-top: 20px; }
.mdm-scale-return .mdm-step { left: -20px; top: 44px; font-size: 244px; opacity: .12; z-index: -1; }

/* Chapters put a title sheet over a smaller open photographic band. */
.mdm-reading-entrance { display: grid; grid-template-columns: minmax(0, 800px) 260px; justify-content: space-between; align-items: center; gap: 65px; padding: 42px max(48px, calc((100vw - 1248px) / 2)) 50px; background-color: var(--mdm-ground); background-size: cover; background-position: center 52%; position: relative; }
.mdm-chapter-title { background: var(--mdm-surface); padding: 32px 40px 36px; box-shadow: -12px 12px 0 var(--mdm-ground); }
.mdm-reading-entrance h1 { font-size: clamp(38px, 4vw, 56px); }
.mdm-reading-entrance p { margin-top: 22px; max-width: 740px; font-size: 21px; line-height: 1.5; }
.mdm-chapter-cutout { position: relative; margin: 26px 0 0; width: 260px; height: 260px; transform: translateY(32px); filter: drop-shadow(12px 12px 0 var(--mdm-ground)); }
.mdm-chapter-cutout::before { content: ''; position: absolute; inset: -20px; background: url('offset-arcs.svg') center / contain no-repeat; z-index: 1; }
.mdm-chapter-cutout img { width: 100%; height: 100%; border-radius: 50%; border: 6px solid var(--mdm-surface); object-fit: cover; background: var(--mdm-support); }
.mdm-photo-research { background-image: url('recognition-stone.webp'); }
.mdm-photo-dosage { background-image: url('measured-rain.webp'); }
.mdm-photo-effects { background-image: url('outside-the-lens.webp'); }
.mdm-photo-faq { background-image: url('pause-in-the-rain.webp'); }
.mdm-photo-about { background-image: url('near-and-far.webp'); }
.mdm-reading-entrance.mdm-without-photo { display: block; background: var(--mdm-ground) url('offset-arcs.svg') right 9% center / 330px no-repeat; }
.mdm-without-photo .mdm-chapter-title { max-width: 870px; box-shadow: none; }
.mdm-without-photo h1 { max-width: 790px; }
.mdm-breadcrumbs { max-width: 1200px; margin: 38px auto 0; padding: 0 44px; font-size: 16px; }
.mdm-breadcrumbs a { margin-right: 8px; }
.mdm-source-spread { max-width: 1160px; margin: 25px auto 0; padding: 25px 40px 75px; }
.mdm-source-entry { padding: 35px 0; display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 60px; border-bottom: 2px solid var(--mdm-support); }
.mdm-source-entry h2 { font-size: 28px; margin-bottom: 13px; text-wrap: initial; }
.mdm-source-entry p { font-size: 18px; }
.mdm-source-entry .mdm-source-note { font-size: 20px; }
.mdm-source-entry:nth-child(even) { margin-left: 80px; grid-template-columns: 250px minmax(0, 1fr); }
.mdm-faq-answer { display: block; }

.mdm-bottom-wayfinding { max-width: 1152px; padding: 48px 0 52px; margin: 0 auto; }
.mdm-bottom-wayfinding p { font-family: 'Eczar', Georgia, serif; font-size: 32px; margin-bottom: 26px; }
.mdm-bottom-wayfinding ul { list-style: none; display: flex; flex-wrap: wrap; gap: 16px 34px; margin: 0; padding: 0; }
.mdm-bottom-wayfinding a { display: flex; align-items: center; gap: 12px; text-decoration: none; padding: 10px 0; border-bottom: 2px solid var(--mdm-support); }
.mdm-bottom-wayfinding a:hover { border-color: var(--mdm-accent); text-decoration: underline; }
.mdm-bottom-wayfinding .mdm-glyph { width: 25px; height: 25px; }
.mdm-page-end { padding: 44px max(36px, calc((100vw - 1152px) / 2)) 30px; background: var(--mdm-ground); border-top: 6px solid var(--mdm-accent); }
.mdm-page-end p { font-size: 18px; max-width: 760px; }
.mdm-footer-links { display: flex; flex-wrap: wrap; gap: 12px 30px; margin: 28px 0; font-size: 17px; }
.mdm-page-end .mdm-copyright { font-size: 16px; }
.mdm-not-found { max-width: 840px; margin: 35px auto 90px; padding: 44px; background: var(--mdm-ground); box-shadow: 16px 16px 0 var(--mdm-support); }
.mdm-not-found h1 { margin-bottom: 28px; }
.mdm-not-found p { margin-top: 22px; }

@media (min-width: 1101px) { .mdm-scale-outer h2, .mdm-scale-return h2 { position: sticky; top: 40px; } }
@media (min-width: 900px) and (prefers-reduced-motion: no-preference) {
  .mdm-stone-orbit::before { animation: mdm-settle 1.1s ease-out both; }
  @keyframes mdm-settle { from { transform: rotate(-12deg); } to { transform: rotate(0deg); } }
}
@media (max-width: 1200px) and (min-width: 701px) {
  .mdm-opening { padding: 32px 26px 40px; }
  .mdm-title-field { margin: 0 26px; padding: 25px 32px; }
  .mdm-opening-spread { grid-template-columns: minmax(0, 1fr) 200px minmax(0, 1fr); gap: 22px; }
  .mdm-promise-field { padding: 24px 20px; }
  .mdm-welcome { padding: 24px 20px; }
  .mdm-welcome p { font-size: 19px; }
  .mdm-stone-orbit { width: 200px; height: 200px; }
  .mdm-scale-crescent { width: 174px; height: 174px; left: 13px; top: 26px; }
  .mdm-near-crop { width: 156px; height: 156px; left: 22px; top: 48px; }
  .mdm-mention-prescription { margin-left: 8px; }
  .mdm-mention-qualifications { margin-left: 16px; }
  .mdm-scale-outer { grid-template-columns: 250px minmax(0, 1fr); gap: 30px; padding-left: 125px; }
  .mdm-scale-return { grid-template-columns: 270px minmax(0, 1fr); gap: 40px; }
  .mdm-scale-return::before { left: 0; right: 0; }
  .mdm-scale-inset { max-width: 75%; padding: 58px; }
  .mdm-reading-entrance { padding: 35px 36px 45px; grid-template-columns: minmax(0, 1fr) 200px; gap: 40px; }
  .mdm-chapter-title { padding: 28px; }
  .mdm-chapter-cutout { width: 200px; height: 200px; }
  .mdm-bottom-wayfinding { margin: 0 40px; }
}
@media (max-width: 900px) and (min-width: 701px) {
  .mdm-opening-spread { grid-template-columns: minmax(0, 1fr) 150px minmax(0, 1.15fr); gap: 18px; }
  .mdm-stone-orbit { width: 150px; height: 150px; }
  .mdm-scale-crescent { width: 124px; height: 124px; left: 13px; top: 28px; }
  .mdm-near-crop { width: 106px; height: 106px; left: 22px; top: 52px; }
  .mdm-mention-prescription { font-size: 18px; }
  .mdm-scale-outer, .mdm-scale-return { display: block; }
  .mdm-scale-outer h2, .mdm-scale-return h2 { margin-bottom: 26px; }
  .mdm-scale-return { padding-left: 100px; }
  .mdm-source-entry { grid-template-columns: 250px minmax(0, 1fr); gap: 30px; }
  .mdm-source-entry:nth-child(even) { margin-left: 35px; grid-template-columns: 215px minmax(0, 1fr); }
}
@media (max-width: 700px) {
  body { font-size: 18px; line-height: 1.6; }
  .mdm-inset-masthead { padding: 12px 20px 13px; height: 95px; }
  .mdm-square-wordmark { width: 70px; height: 70px; box-shadow: 5px 5px 0 var(--mdm-support); }
  .mdm-name { font-size: 13px; line-height: 1.3; }
  .mdm-left-links { right: calc(100% + 13px); width: 118px; }
  .mdm-left-links li { height: 17px; }
  .mdm-left-links a { font-size: 16px; line-height: 17px; gap: 6px; }
  .mdm-left-links .mdm-glyph { width: 13px; height: 13px; }
  .mdm-opening { padding: 21px 22px 0; background: var(--mdm-surface); }
  .mdm-title-field { padding: 0; background: var(--mdm-surface); box-shadow: none; }
  .mdm-title-field h1 { font-size: 32px; line-height: 1.12; letter-spacing: -.035em; }
  .mdm-opening-spread { display: flex; flex-direction: column; gap: 20px; align-items: stretch; margin-top: 20px; }
  .mdm-welcome { padding: 0; max-width: none; background: var(--mdm-surface); }
  .mdm-welcome p { font-size: 18px; line-height: 1.4; }
  .mdm-welcome .mdm-welcome-line { font-size: 16px; line-height: 1.3; margin-bottom: 7px; }
  .mdm-promise-field { order: 1; padding: 0 0 2px; max-width: none; background: var(--mdm-surface); }
  .mdm-mention-name { font-size: 25px; }
  .mdm-mention-prescription { font-size: 19px; line-height: 1.3; margin: 7px 0 0 12px; }
  .mdm-mention-qualifications { font-size: 16px; line-height: 1.35; margin: 8px 0 0 24px; }
  .mdm-detail-field { order: 2; display: grid; place-items: center; width: calc(100% + 44px); margin-left: -22px; height: 205px; padding: 30px 0; background: var(--mdm-ground) url('rain-field.webp') center 54% / cover; }
  .mdm-stone-orbit { width: 100px; height: 100px; filter: drop-shadow(0 8px 8px rgba(34, 47, 39, .25)); }
  .mdm-stone-orbit::before { inset: -15px; }
  .mdm-wide-crop { border-width: 3px; }
  .mdm-scale-crescent { width: 52px; height: 52px; top: 48px; left: 24px; }
  .mdm-near-crop { width: 40px; height: 40px; left: 30px; top: 60px; }
  .mdm-prose-band { display: block; padding: 75px 26px 46px; }
  .mdm-prose-band h2 { font-size: 31px; padding-right: 8px; margin-bottom: 24px; text-wrap: initial; }
  .mdm-step { font-size: 67px; top: 12px; left: 24px; }
  .mdm-scale-outer .mdm-band-content p:last-child { padding-left: 17px; }
  .mdm-scale-inset { margin: 20px 24px 38px 37px; padding: 44px 23px 36px; border-left-width: 4px; box-shadow: 10px 10px 0 var(--mdm-support); }
  .mdm-scale-inset::before { width: 150px; height: 150px; left: -84px; top: 28px; }
  .mdm-scale-inset .mdm-step { font-size: 64px; left: -24px; top: -24px; }
  .mdm-scale-return { padding-top: 50px; }
  .mdm-scale-return::before { left: 0; right: 0; }
  .mdm-scale-return .mdm-step { font-size: 178px; top: 4px; left: auto; right: 12px; }
  .mdm-scale-return h2 { max-width: 310px; padding-top: 0; }
  .mdm-reading-entrance { padding: 25px 22px 35px; display: block; background-position: center; }
  .mdm-chapter-title { padding: 24px 22px 28px; box-shadow: -8px 8px 0 var(--mdm-ground); }
  .mdm-reading-entrance h1 { font-size: 34px; line-height: 1.15; }
  .mdm-reading-entrance p { font-size: 19px; line-height: 1.5; margin-top: 18px; }
  .mdm-chapter-cutout { width: 126px; height: 126px; margin: 25px 20px 0 auto; transform: translateY(10px); filter: drop-shadow(7px 7px 0 var(--mdm-ground)); }
  .mdm-chapter-cutout img { border-width: 4px; }
  .mdm-chapter-cutout::before { inset: -13px; }
  .mdm-reading-entrance.mdm-without-photo { background-size: 230px; background-position: right -60px bottom -80px; }
  .mdm-breadcrumbs { padding: 0 26px; margin-top: 24px; }
  .mdm-source-spread { padding: 8px 26px 42px; margin-top: 10px; }
  .mdm-source-entry, .mdm-source-entry:nth-child(even) { display: block; margin-left: 0; padding: 28px 0; }
  .mdm-source-entry h2 { font-size: 26px; }
  .mdm-source-entry .mdm-source-note { margin-top: 20px; font-size: 18px; }
  .mdm-source-entry:nth-child(even) { padding-left: 20px; }
  .mdm-bottom-wayfinding { margin: 0 26px; padding: 32px 0 38px; }
  .mdm-bottom-wayfinding p { font-size: 26px; margin-bottom: 16px; }
  .mdm-bottom-wayfinding ul { display: block; }
  .mdm-bottom-wayfinding a { gap: 13px; min-height: 48px; }
  .mdm-bottom-wayfinding .mdm-glyph { width: 22px; height: 22px; }
  .mdm-page-end { padding: 30px 26px; }
  .mdm-page-end p { font-size: 17px; }
  .mdm-footer-links { font-size: 16px; gap: 12px 22px; }
  .mdm-not-found { margin: 20px 22px 60px; padding: 26px; box-shadow: 9px 9px 0 var(--mdm-support); }
  .mdm-not-found h1 { font-size: 34px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; scroll-behavior: auto !important; }
}