/* Layout: page frames, reading columns and the writable sheets. */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; }
body { margin: 0; }
button, input, textarea { font: inherit; }
button, a, summary { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { min-height: 44px; }
button, summary { min-height: 48px; }
button[hidden], [hidden] { display: none !important; }
fieldset { min-width: 0; margin: 0; }
textarea { display: block; width: 100%; min-height: 88px; resize: vertical; }
p, h1, h2, h3 { margin: 0; }
p + p { margin-top: 18px; }
ul { padding: 0; margin: 16px 0 28px; list-style: none; }
legend { padding: 0; }
details > div { padding: 6px 28px 28px; }
summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 21px 28px; cursor: pointer; list-style: none; }
summary::-webkit-details-marker { display: none; }
summary > span { flex: 0 0 24px; text-align: center; }
:is(.intro-skip, .questions-skip, .missing-skip) { position: absolute; z-index: 20; top: 16px; left: 16px; transform: translateY(-150%); padding: 12px 20px; display: inline-flex; align-items: center; }
:is(.intro-skip, .questions-skip, .missing-skip):focus { transform: translateY(0); }
:is(.intro-masthead, .questions-masthead, .missing-masthead) { width: min(1280px, calc(100% - 96px)); margin: auto; min-height: 120px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
:is(.intro-wordmark, .questions-wordmark, .missing-wordmark) { display: inline-flex; align-items: center; gap: 14px; padding: 12px 0; }
:is(.intro-wordmark-sub, .questions-wordmark-sub, .missing-wordmark-sub) { display: block; margin-top: 2px; }
:is(.intro-mark, .questions-mark, .missing-mark) { flex: 0 0 28px; width: 28px; height: 37px; }
:is(.intro-directory-jump, .questions-directory-jump, .missing-directory-jump) { display: inline-flex; align-items: center; justify-content: space-between; gap: 20px; padding: 12px 0; }
:is(.intro-hero, .questions-hero) { width: min(1280px, calc(100% - 96px)); margin: 56px auto 72px; display: grid; grid-template-columns: minmax(0, 1.26fr) minmax(0, 1fr); gap: 52px; align-items: center; }
:is(.intro-eyebrow, .questions-eyebrow, .missing-eyebrow) { margin-bottom: 22px; }
:is(.intro-hero, .questions-hero) h1 { margin-bottom: 30px; }
:is(.intro-lead, .questions-lead) { max-width: 34rem; }
:is(.intro-action, .questions-action, .missing-action) { display: inline-flex; align-items: center; justify-content: space-between; padding: 17px 24px; gap: 32px; margin-top: 30px; }
.intro-hero-aside { max-width: 28rem; margin-top: 22px; }
.intro-collage { position: relative; isolation: isolate; width: 100%; aspect-ratio: 1.03; overflow: clip; }
.intro-collage-orbit { position: absolute; inset: 7% 0 4% 0; }
.intro-collage-cutout { position: absolute; width: 26%; height: 56%; top: 8%; left: 4%; transform: rotate(-14deg); }
.intro-collage-tab { position: absolute; width: 19%; height: 27%; right: 0; top: 2%; transform: rotate(11deg); }
.intro-collage-back { position: absolute; width: 67%; height: 71%; top: 4%; left: 15%; padding: 9% 7%; transform: rotate(-9deg); }
.intro-collage-back > span:first-child { display: block; }
.intro-paper-rule { display: block; width: 100%; height: 1px; margin: 13px 0 28px; }
.intro-collage-front { position: absolute; width: 78%; height: 59%; top: 31%; left: 15%; padding: 9% 8%; transform: rotate(7deg); }
.intro-paper-label, .questions-paper-label { display: block; margin-bottom: 18px; }
.intro-collage-front p { margin-bottom: 18px; }
.intro-paper-line { display: block; height: 1px; width: 100%; margin-top: 19px; }
.intro-collage-flower { position: absolute; bottom: 3%; left: 1%; width: 28%; aspect-ratio: 1; transform: rotate(-12deg); }
.intro-collage-caption { position: absolute; right: 8%; bottom: 0; }
:is(.intro-summary, .questions-summary) { width: min(1280px, calc(100% - 96px)); margin: 0 auto 100px; display: grid; grid-template-columns: 0.58fr 1.25fr 1.2fr; gap: 44px; padding: 44px; align-items: start; }
:is(.intro-summary, .questions-summary) .intro-eyebrow, .questions-summary .questions-eyebrow { margin-bottom: 0; }
:is(.intro-chapter, .questions-chapter) { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.28fr); gap: 100px; width: min(1100px, calc(100% - 160px)); margin: 0 auto 100px; }
:is(.intro-depth, .questions-depth) { max-width: 42rem; }
.questions-depth h3:not(:first-child) { margin-top: 32px; }
:is(.intro-depth, .questions-depth) h3 { margin-bottom: 12px; }
.intro-side-cutout { display: block; width: 170px; height: 120px; margin: 45px 0 0; }
:is(.intro-tools, .questions-tools) { display: flex; flex-wrap: wrap; gap: 10px; margin: 30px 0; }
:is(.intro-tools, .questions-tools) button { display: inline-flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 16px; }
:is(.intro-word-help, .questions-word-help) { margin-top: 28px; padding: 24px 28px; }
:is(.intro-word-help, .questions-word-help) h3 { margin: 0 0 10px; }
:is(.intro-section-top, .questions-section-top) { max-width: 44rem; margin-bottom: 40px; }
:is(.intro-section-top, .questions-section-top) h2 { margin-bottom: 18px; }
:is(.intro-product-section, .questions-cost, .questions-cautions) { width: min(1200px, calc(100% - 120px)); margin: 0 auto 100px; }
.intro-product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 20px; }
.intro-product { padding: 32px 28px 36px; }
.intro-tag { margin-bottom: 36px; }
.intro-product h3 { margin-bottom: 20px; }
:is(.intro-fold, .questions-fold) { margin-top: 24px; }
:is(.intro-fold-body, .questions-fold-body) { max-width: 46rem; }
:is(.intro-worksheet, .questions-licence-sheet, .questions-compare) { width: min(1200px, calc(100% - 120px)); margin: 0 auto 100px; padding: 52px; }
.intro-worksheet, .questions-licence-sheet { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.2fr); gap: 80px; }
:is(.intro-sheet-heading, .questions-sheet-heading) h2 { margin-bottom: 24px; }
:is(.intro-sheet-heading, .questions-sheet-heading) { max-width: 37rem; }
.intro-field, .questions-field { margin-bottom: 28px; }
.intro-field > label, .questions-field > label { display: block; margin-bottom: 10px; }
:is(.intro-field-hint, .questions-field-hint) { margin-bottom: 14px; }
.intro-field textarea, .questions-field textarea { padding: 12px 14px; }
.intro-checklist, .questions-checklist, .questions-cost-prompts { padding: 0; border: 0; }
.intro-checklist { margin: 36px 0; }
:is(.intro-checklist, .questions-checklist, .questions-cost-prompts) legend { margin-bottom: 18px; }
:is(.intro-check, .questions-check) { display: flex; align-items: flex-start; gap: 13px; padding: 15px 0; min-height: 56px; cursor: pointer; }
:is(.intro-check, .questions-check) input { width: 44px; height: 44px; flex: 0 0 44px; margin: 3px 0 0; }
.intro-next { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 22px 0; }
.intro-next > span:first-child > span { display: block; margin-top: 8px; }
.questions-hero { grid-template-columns: minmax(0, 1.8fr) minmax(0, .65fr); }
.questions-pocket { position: relative; width: 100%; min-height: 345px; display: grid; align-items: center; }
.questions-pocket > div { position: relative; padding: 48px 30px; transform: rotate(5deg); }
.questions-pocket-cutout { position: absolute; inset: 8% 4%; transform: rotate(-8deg); }
.questions-lookup-links { display: grid; gap: 12px; margin: 28px 0; }
.questions-lookup-links a, .questions-source-action { display: inline-flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 18px; }
.questions-cost-snapshot { padding: 36px 40px; max-width: 58rem; margin-bottom: 36px; }
.questions-cost-depth { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .8fr); gap: 80px; margin: 36px 0; }
.questions-cost-depth h3 { margin-bottom: 16px; }
.questions-cost-depth > div { max-width: 42rem; }
.questions-compare .questions-sheet-heading { margin-bottom: 36px; }
.questions-compare-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; }
.questions-option { padding: 24px; margin-bottom: 24px; }
.questions-option legend { padding: 0 12px; }
.questions-option .questions-field:last-child { margin-bottom: 0; }
.questions-caution-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.questions-caution-list article { padding: 24px 0 30px; }
.questions-caution-list h3 { margin-bottom: 18px; }
.questions-cautions > .questions-word-help { max-width: 46rem; }
:is(.intro-endnotes, .questions-endnotes) { width: min(1100px, calc(100% - 160px)); margin: 0 auto 100px; }
:is(.intro-endnotes, .questions-endnotes) h2 { margin-bottom: 32px; }
:is(.intro-notes-fold, .questions-notes-fold) h3 { margin: 24px 0 10px; }
:is(.intro-notes-fold, .questions-notes-fold) li > a { display: flex; justify-content: space-between; gap: 28px; align-items: center; padding: 14px 0; }
:is(.intro-footer, .questions-footer, .missing-footer) { padding: 64px max(48px, calc((100vw - 1280px) / 2)) 28px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); column-gap: 100px; row-gap: 64px; }
:is(.intro-directory-heading, .questions-directory-heading, .missing-directory-heading) p:last-child { max-width: 28rem; margin-top: 24px; }
:is(.intro-directory, .questions-directory, .missing-directory) > a { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 24px 0; }
:is(.intro-directory, .questions-directory, .missing-directory) > a:first-child { padding-top: 0; }
:is(.intro-directory, .questions-directory, .missing-directory) > a > span:first-child > span { display: block; margin-top: 10px; }
:is(.intro-directory-sub, .questions-directory-sub, .missing-directory-sub) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px 28px; margin-top: 20px; }
:is(.intro-directory-sub, .questions-directory-sub, .missing-directory-sub) a { display: flex; align-items: center; padding: 12px 0; }
:is(.intro-footer-bottom, .questions-footer-bottom, .missing-footer-bottom) { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 40px; padding-top: 24px; }
:is(.intro-footer-bottom, .questions-footer-bottom, .missing-footer-bottom) p { max-width: 36rem; }
:is(.intro-footer-bottom, .questions-footer-bottom, .missing-footer-bottom) a { display: inline-flex; align-items: center; gap: 24px; padding: 12px 0; flex-shrink: 0; }
.missing-content { max-width: 58rem; width: calc(100% - 96px); margin: 80px auto 120px; }
.missing-content h1 { margin-bottom: 30px; }

@media (max-width: 1100px) {
  :is(.intro-masthead, .questions-masthead, .missing-masthead, .intro-hero, .questions-hero, .intro-summary, .questions-summary) { width: calc(100% - 64px); }
  :is(.intro-chapter, .questions-chapter, .intro-product-section, .questions-cost, .questions-cautions, .intro-worksheet, .questions-licence-sheet, .questions-compare, .intro-endnotes, .questions-endnotes) { width: calc(100% - 64px); }
  :is(.intro-chapter, .questions-chapter) { gap: 48px; }
  :is(.intro-summary, .questions-summary) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding: 36px; gap: 24px 36px; }
  :is(.intro-summary, .questions-summary) > .intro-eyebrow, .questions-summary > .questions-eyebrow { grid-column: 1 / -1; }
  .intro-product-grid { grid-template-columns: 1fr; }
  .intro-product { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.25fr); column-gap: 48px; }
  .intro-product .intro-tag, .intro-product h3 { grid-column: 1; }
  .intro-product p:not(.intro-tag) { grid-column: 2; }
  .intro-product .intro-tag { margin-bottom: 24px; }
  .intro-product h3 { grid-row: 2 / span 2; }
  .intro-product p:nth-child(3) { grid-row: 1 / span 2; }
  :is(.intro-worksheet, .questions-licence-sheet) { gap: 40px; padding: 36px; }
  .questions-compare { padding: 36px; }
  .questions-compare-grid { gap: 24px; }
  .questions-cost-depth { gap: 44px; }
  :is(.intro-footer, .questions-footer, .missing-footer) { column-gap: 48px; padding-inline: 32px; }
}

@media (max-width: 700px) {
  :is(.intro-masthead, .questions-masthead, .missing-masthead) { width: calc(100% - 40px); min-height: 112px; gap: 14px; align-items: flex-start; padding-top: 22px; }
  :is(.intro-wordmark, .questions-wordmark, .missing-wordmark) { padding: 0 0 12px; gap: 8px; }
  :is(.intro-mark, .questions-mark, .missing-mark) { flex-basis: 20px; width: 20px; height: 30px; }
  :is(.intro-directory-jump, .questions-directory-jump, .missing-directory-jump) { width: 100px; padding-top: 0; gap: 10px; flex-shrink: 0; }
  :is(.intro-hero, .questions-hero) { width: calc(100% - 40px); grid-template-columns: 1fr; margin: 26px auto 44px; gap: 24px; }
  :is(.intro-hero, .questions-hero) h1 { margin-bottom: 24px; }
  .intro-collage { width: min(100%, 410px); margin: 14px auto 0; }
  .intro-collage-caption { right: 4%; }
  :is(.intro-action, .questions-action, .missing-action) { margin-top: 24px; padding-inline: 20px; gap: 24px; }
  :is(.intro-summary, .questions-summary) { width: calc(100% - 40px); grid-template-columns: 1fr; gap: 24px; padding: 30px 24px; margin-bottom: 64px; }
  :is(.intro-chapter, .questions-chapter, .intro-product-section, .questions-cost, .questions-cautions, .intro-worksheet, .questions-licence-sheet, .questions-compare, .intro-endnotes, .questions-endnotes) { width: calc(100% - 40px); margin-bottom: 64px; }
  :is(.intro-chapter, .questions-chapter, .intro-worksheet, .questions-licence-sheet) { grid-template-columns: 1fr; gap: 30px; }
  .intro-side-cutout { display: none; }
  :is(.intro-section-top, .questions-section-top) { margin-bottom: 28px; }
  .intro-product { display: block; padding: 28px 24px; }
  .intro-product .intro-tag { margin-bottom: 20px; }
  :is(.intro-worksheet, .questions-licence-sheet, .questions-compare) { padding: 30px 22px; }
  :is(.intro-tools, .questions-tools) { flex-direction: column; align-items: stretch; }
  :is(.intro-tools, .questions-tools) button { justify-content: flex-start; }
  :is(.intro-word-help, .questions-word-help) { padding: 22px; }
  summary { padding: 20px; gap: 16px; }
  details > div { padding: 4px 20px 24px; }
  .questions-pocket { min-height: 240px; width: min(78%, 320px); margin: 0 auto 8px; }
  .questions-pocket > div { padding: 30px; }
  .questions-cost-snapshot { padding: 28px 24px; }
  .questions-cost-depth { grid-template-columns: 1fr; gap: 28px; }
  .questions-compare-grid { grid-template-columns: 1fr; gap: 16px; }
  .questions-option { padding: 22px 16px; }
  .questions-caution-list { grid-template-columns: 1fr; gap: 4px; }
  :is(.intro-footer, .questions-footer, .missing-footer) { grid-template-columns: 1fr; padding: 44px 24px 24px; gap: 36px; }
  :is(.intro-footer-bottom, .questions-footer-bottom, .missing-footer-bottom) { flex-direction: column; align-items: flex-start; gap: 16px; }
  :is(.intro-directory-sub, .questions-directory-sub, .missing-directory-sub) { column-gap: 20px; }
  .missing-content { width: calc(100% - 40px); margin: 44px auto 72px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

@media print {
  @page { margin: 18mm; }
  html { scroll-behavior: auto; }
  :is(.intro-masthead, .questions-masthead, .missing-masthead, .intro-tools, .questions-tools, .intro-collage, .questions-pocket, .intro-footer, .questions-footer, .missing-footer, .intro-skip, .questions-skip, .missing-skip) { display: none; }
  :is(.intro-hero, .questions-hero, .intro-summary, .questions-summary, .intro-chapter, .questions-chapter, .intro-product-section, .questions-cost, .questions-cautions, .intro-worksheet, .questions-licence-sheet, .questions-compare, .intro-endnotes, .questions-endnotes) { width: 100%; margin: 0 0 30px; padding: 0; display: block; }
  :is(.intro-product-grid, .questions-cost-depth, .questions-compare-grid, .questions-caution-list) { display: block; }
  :is(.intro-product, .questions-option, .intro-field, .questions-field, .intro-check, .questions-check) { break-inside: avoid; }
  :is(.intro-worksheet, .questions-compare) { break-before: page; }
  :is(.intro-sheet-heading, .questions-sheet-heading) { margin-bottom: 24px; }
  :is(.intro-action, .questions-action, .intro-next, .questions-lookup-links) { display: none; }
  details > div { display: block !important; padding: 0 0 20px; }
  summary { padding: 14px 0; }
  textarea { min-height: 96px; }
}
