/* One fixed A4 sheet is shared by paper, PDF and the scaled Web viewer. */
:root {
  --paper: #fbf8f0;
  --ink: #253c58;
  --muted: #6b7681;
  --gold: #b89964;
  --line: #d9c9a9;
  --blue: #edf3f6;
  --rose: #f8efed;
  --green: #f1f4ec;
  --serif: "Yu Mincho", "Noto Serif JP", "Hiragino Mincho ProN", serif;
  --sans: "Yu Gothic", "Noto Sans JP", Meiryo, sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: var(--sans); color: var(--ink); }
a { color: #345b7a; text-underline-offset: .2em; }
a:focus-visible { outline: 2px solid #99713b; outline-offset: 3px; }
.reader-heading { color: #647588; font-family: var(--sans); font-size: 12px; }
.reader-heading p { margin: 0 0 5px; }
.viewer-hint { font-size: 11px; }
.sheet {
  position: relative;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 210mm;
  height: 297mm;
  padding: 13mm 14mm 10mm;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 10.5pt;
  font-weight: 500;
  line-height: 1.82;
  overflow-wrap: anywhere;
  box-shadow: 0 8px 28px rgba(30, 45, 54, .1);
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.sheet::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: url("art/a23-paper.png");
  background-size: cover;
  background-position: center;
  opacity: .28;
  pointer-events: none;
  content: "";
}
.sheet > * { position: relative; z-index: 1; }
.page-head { flex: 0 0 auto; margin-bottom: 5mm; }
.eyebrow { margin: 0 0 1.8mm; color: #947747; font-size: 8pt; letter-spacing: .14em; font-weight: 600; }
.page-head h2 { margin: 0; padding-bottom: 3mm; border-bottom: .25mm solid var(--gold); color: var(--ink); font-family: var(--serif); font-size: 21pt; font-weight: 600; line-height: 1.5; letter-spacing: .025em; }
.subtitle { margin: 2.6mm 0 0; color: #866e50; font-family: var(--serif); font-size: 10pt; line-height: 1.7; }
.page-body { flex: 1 0 auto; min-width: 0; }
.page-body > :first-child { margin-top: 0; }
.page-body > :last-child { margin-bottom: 0; }
.page-footer { flex: 0 0 auto; display: flex; justify-content: space-between; align-items: baseline; margin-top: auto; padding-top: 3mm; color: #8c9ba8; font-family: var(--serif); font-size: 8pt; line-height: 1.5; letter-spacing: .06em; }
.page-footer::before { position: absolute; top: 1mm; left: 0; width: 20mm; height: .15mm; background: var(--gold); content: ""; opacity: .7; }
p { margin: 0 0 2.5mm; }
h3 { margin: 5mm 0 2mm; padding-bottom: 1mm; color: #2b4664; font-family: var(--serif); font-size: 13pt; font-weight: 600; line-height: 1.6; }
h4 { margin: 3.5mm 0 1.5mm; color: #3a5671; font-size: 10.8pt; font-weight: 700; line-height: 1.65; }
strong { font-weight: 700; }
ul, ol { margin: 2mm 0 3mm; padding-left: 1.6em; }
li { margin: 0 0 1.5mm; padding-left: .1em; }
li::marker { color: #9b8050; }
.prose p { margin-bottom: 3mm; }
.lead { font-size: 11pt; line-height: 1.9; }
.split { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 7mm; margin: 3mm 0; }
.column { min-width: 0; }
.column > :first-child { margin-top: 0; }
.column > :last-child { margin-bottom: 0; }
.feature-row { display: grid; grid-template-columns: minmax(0,1.12fr) minmax(0,.88fr); align-items: center; gap: 7mm; margin: 0 0 4mm; }
.feature-row > * { min-width: 0; }
.page-illustration { display: block; width: 100%; margin: 4mm auto 5mm; }
.page-illustration img { display: block; max-width: 100%; width: 100%; height: 100%; object-fit: contain; }
.page-illustration[data-art-status="pending"] { background: transparent; }
.art-landscape { width: 132mm; height: 72mm; }
.art-still { width: 70mm; height: 48mm; }
.art-care { width: 76mm; height: 58mm; }
.art-portrait { width: 75mm; height: 106mm; }
.art-sequence { width: 182mm; height: 52mm; }
.art-supplies { width: 182mm; height: 64mm; }
.art-room { width: 146mm; height: 93mm; }
.art-room-detail { width: 93mm; height: 68mm; }
.art-portrait-small { width: 66mm; height: 82mm; }
.feature-row .page-illustration { max-width: 100%; margin: 0; }
.panel { margin: 4mm 0; padding: 3.5mm 4mm; border-top: .2mm solid #d0ba91; border-bottom: .2mm solid #e4d7c1; background: rgba(241,237,223,.44); }
.panel.blue { background: rgba(216,229,237,.36); }
.panel.rose { background: rgba(230,199,197,.2); border-color: #ddc4bd; }
.panel.gold { background: rgba(235,223,196,.24); }
.panel.green { background: rgba(218,228,205,.28); }
.panel > :first-child { margin-top: 0; }
.panel > :last-child { margin-bottom: 0; }
.notice { margin: 4mm 0; padding: 3mm 3.5mm; border-left: .55mm solid #b89964; background: rgba(235,223,196,.26); font-size: 9.7pt; line-height: 1.8; }
.notice.rose { border-color: #b77f7e; background: rgba(230,199,197,.22); }
.notice.blue { border-color: #8daaba; background: rgba(216,229,237,.3); }
.notice > :last-child { margin-bottom: 0; }
.checklist { padding: 0; list-style: none; }
.checklist li { position: relative; margin-bottom: 2.3mm; padding-left: 1.7em; }
.checklist li::before { position: absolute; top: .49em; left: .12em; width: .65em; height: .65em; border: .2mm solid #94a7b2; content: ""; }
.small { font-size: 9.4pt; }
.source { margin-top: 3mm; color: #6c7985; font-size: 8pt; line-height: 1.8; }
.source a { color: inherit; }
.pill { display: inline-block; padding: 1.5mm 3mm; border: .2mm solid #b6c4cb; font-size: 9pt; text-decoration: none; }
table { width: 100%; margin: 3mm 0 4mm; border-collapse: collapse; font-size: 10pt; line-height: 1.7; text-align: left; }
th, td { padding: 2.8mm 3mm; border-bottom: .2mm solid #d0d9dc; vertical-align: top; }
th { background: rgba(216,229,237,.3); color: #3c5670; font-weight: 700; }
thead th { border-top: .25mm solid #b5c5cd; }
.feeding-table { font-size: 10pt; font-variant-numeric: tabular-nums; }
.feeding-table th, .feeding-table td { padding: 3.4mm 3mm; }
.toc-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 0 8mm; margin: 2mm 0 4mm; }
.toc-grid a { display: flex; gap: 3mm; align-items: baseline; padding: 2.2mm 0; border-bottom: .15mm solid #dfd8c9; color: var(--ink); font-size: 9.5pt; line-height: 1.65; text-decoration: none; }
.toc-num { flex: 0 0 1.8em; color: #a1814c; font-family: var(--serif); font-size: 11pt; }
.fields { margin: 3mm 0; }
.field { min-height: 13mm; margin: 2mm 0; padding: 2.5mm 0; border-bottom: .2mm solid #aebec9; color: #4c6680; }
.field span { display: inline-block; min-width: 7em; }
.qr-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 7mm; margin: 5mm 0; }
.qr-card { display: block; min-width: 0; padding: 4mm 3mm; border-top: .2mm solid #c6ad83; color: #715c42; font-size: 9pt; text-align: center; text-decoration: none; }
.qr-card h3 { margin-top: 0; padding: 0; color: #715c42; font-size: 13pt; }
.qr-card img { display: block; width: 32mm; height: 36mm; margin: 3mm auto; object-fit: contain; }
.qr-card span { display: block; }
.facts { margin: 5mm 0; }
.facts dl { margin: 0; }
.facts dl > div { display: grid; grid-template-columns: 32mm minmax(0,1fr); gap: 3mm; border-bottom: .15mm solid #dbd5c9; }
.facts dt, .facts dd { margin: 0; padding: 1.7mm 0; font-size: 9.4pt; }
.facts dt { color: #778493; }
.reference-list { padding-left: 1.4em; font-size: 9pt; line-height: 1.8; }
.reference-list li { margin-bottom: 2mm; }
.care-steps { margin: 3mm 0; }
.care-steps li { margin-bottom: 2.7mm; padding-left: 1mm; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Page-specific composition; no viewport-based changes to the paper are used. */
.cover { padding: 0; }
.cover::before { display: none; }
.cover-art { position: absolute; inset: 0; margin: 0; z-index: 0; }
.cover-art img { display: block; width: 100%; height: 100%; object-fit: contain; }
.cover-title { position: absolute; top: 25mm; left: 14mm; right: 14mm; margin: 0; color: #65492e; font-family: var(--serif); font-size: 31pt; font-weight: 600; line-height: 1.75; letter-spacing: .045em; text-align: center; }
.cover-title span { display: block; margin-top: 2mm; font-size: 22pt; letter-spacing: .045em; }
.cover-title::after { display: block; width: 64mm; height: .25mm; margin: 6mm auto 0; background: linear-gradient(90deg, transparent, #b89964, transparent); content: ""; }
.cover-edition { position: absolute; left: 17mm; right: 17mm; bottom: 7mm; margin: 0; padding: 2mm 3mm; background: rgba(251,248,240,.78); color: #695139; font-family: var(--serif); font-size: 8.5pt; line-height: 1.8; text-align: center; }
.page-promise .page-head { width: 99mm; }
.page-promise .page-head h2 { font-size: 20pt; }
.page-promise .page-body { width: 96mm; }
.page-promise .feature-row { display: block; margin: 0; }
.page-promise .prose { font-family: var(--serif); font-size: 10.7pt; line-height: 1.9; }
.page-promise .prose p { margin-bottom: 3.5mm; }
.page-promise .art-portrait { position: absolute; top: -45mm; right: -98mm; width: 90mm; height: 275mm; margin: 0; }
.page-promise .art-portrait img { position: absolute; right: 0; bottom: 0; width: 90mm; height: 205mm; object-fit: cover; object-position: right center; }
.page-promise .page-body { position: relative; }
.page-promise h3 { font-size: 12pt; }
.page-promise .notice { font-family: var(--sans); font-size: 9.2pt; }
.page-about .art-still { height: 53mm; }
.page-about-care .art-landscape { height: 60mm; margin-top: 1mm; margin-bottom: 4mm; }
.page-about-care .split { gap: 8mm; }
.page-prepare .art-supplies { height: 64mm; margin: 3mm 0 5mm; }
.supply-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 4mm; }
.supply-item { min-width: 0; padding-top: 2mm; border-top: .2mm solid #c7b18e; }
.supply-item h4 { margin: 0 0 2mm; font-family: var(--serif); font-size: 10.5pt; line-height: 1.7; }
.supply-item p { margin-bottom: 2.7mm; font-size: 10.5pt; line-height: 1.78; }
.page-prepare-comfort .art-supplies { height: 65mm; margin-bottom: 6mm; }
.page-home .prose { font-size: 10.5pt; line-height: 1.75; }
.page-home .prose p { margin-bottom: 1.5mm; }
.page-home .art-room { margin: 2mm auto 3mm; height: 88mm; }
.page-home .split { margin: 1mm 0 0; gap: 7mm; line-height: 1.72; }
.page-home h4 { margin: 2.7mm 0 1mm; font-size: 10.5pt; }
.page-home .column p { margin-bottom: 1.8mm; }
.page-settling .art-portrait { height: 105mm; }
.page-settling-week .art-sequence { height: 52mm; margin: 4mm 0 7mm; }
.page-resident-pets .art-landscape { height: 51mm; margin-top: 1mm; margin-bottom: 4mm; }
.page-resident-signs .feature-row { display: block; }
.page-resident-signs .art-landscape { height: 66mm; margin: 4mm auto 6mm; }
.page-food .art-still { width: 76mm; height: 66mm; }
.page-feeding-amount .page-head { margin-bottom: 6mm; }
.page-feeding-amount .notice { margin-top: 5mm; padding: 4mm; }
.page-feeding-adjust .art-still { height: 55mm; }
.page-feeding-adjust .split { margin-bottom: 4mm; }
.page-food-safety .panel { margin-top: 8mm; }
.page-food-safety table { margin-top: 5mm; margin-bottom: 7mm; }
.page-food-safety th, .page-food-safety td { padding: 5mm 3.5mm; }
.page-unsafe-foods .page-illustration { height: 54mm; width: 135mm; margin-top: 5mm; }
.page-litter .art-landscape, .page-litter-troubles .art-landscape { width: 76mm; height: 65mm; }
.page-health .panel { margin-top: 6mm; padding: 5mm; }
.page-health .panel li { margin-bottom: 3mm; }
.page-health .notice { margin-top: 7mm; }
.page-health-prevention .art-still { height: 48mm; margin: 4mm auto; }
.page-health-daily .split { margin-top: 4mm; margin-bottom: 7mm; }
.page-health-daily .field { min-height: 16mm; margin: 3mm 0; }
.page-grooming .art-landscape { width: 135mm; height: 62mm; }
.page-grooming-mouth .art-still { height: 64mm; }
.page-care-nose .art-care, .page-care-ears .art-care { height: 57mm; }
.page-care-nose .feature-row, .page-care-ears .feature-row { margin-bottom: 5mm; }
.page-care-nose .split, .page-care-ears .split { margin-top: 5mm; }
.page-safety .feature-row { display: block; }
.page-safety .art-landscape { width: 147mm; height: 69mm; margin: 4mm auto 6mm; }
.page-safety-lost .feature-row { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
.page-safety-lost .art-room-detail { width: 86mm; height: 100mm; }
.page-safety-chip .panel { margin-top: 7mm; margin-bottom: 7mm; padding: 5mm; }
.page-safety-chip .checklist { margin-top: 5mm; margin-bottom: 7mm; }
.page-safety-chip .checklist li { margin-bottom: 4mm; }
.page-contact .feature-row { grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); }
.page-contact .prose { font-family: var(--serif); line-height: 1.9; }
.page-contact .art-portrait-small { height: 84mm; }
.page-contact .qr-grid { margin-top: 7mm; margin-bottom: 5mm; }
.page-contact .qr-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4mm; margin-top: 6mm; }
.page-contact .qr-card { padding: 4mm 1.5mm; }
.page-contact .qr-card h3 { font-size: 11.5pt; }
.page-contact .qr-card img { box-sizing: content-box; width: 44mm; height: 44mm; padding: 3mm; background: #fff; object-fit: contain; }
.page-references .facts { margin-top: 6mm; }

@page { size: A4 portrait; margin: 0; }
@media print {
  body { margin: 0; }
  .sheet { box-shadow: none; break-after: page; page-break-after: always; }
  .sheet:last-child { break-after: auto; page-break-after: auto; }
  .screen-only, .toolbar, .reader-heading { display: none !important; }
  h2, h3, h4, .page-head { break-after: avoid; page-break-after: avoid; }
  .page-illustration, .panel, .notice, .supply-item, table, .field, .qr-card, .facts dl > div { break-inside: avoid; page-break-inside: avoid; }
  p, li { orphans: 3; widows: 3; }
  a { color: inherit; text-decoration: none; }
}
