@font-face {
  font-family: 'TANAngleton';
  src: url('../assets/fonts/TANAngleton_3052.ttf') format('truetype');
  font-display: swap;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  padding: 0;
  background: #6b6b6b;
  font-family: 'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif;
}

.pagewrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px 0 60px;
}

.nav {
  width: 695px;
  display: flex;
  gap: 16px;
  align-items: center;
  color: #eee;
  font-size: 14px;
  margin-bottom: 10px;
}

.nav a {
  color: #fff;
  text-decoration: none;
  background: #444;
  padding: 4px 10px;
  border-radius: 4px;
}

.nav a:hover { background: #666; }

.nav .disabled {
  color: #999;
  background: #333;
  padding: 4px 10px;
  border-radius: 4px;
}

.page {
  position: relative;
  width: 695px;
  height: 900px;
  background-color: #ffffff;
  background-repeat: no-repeat;
  background-size: 695px 900px;
  background-position: top left;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0,0,0,0.35);
  flex-shrink: 0;
}

/* Base positioning for the handful of elements that still draw real text
   on top of the page image — currently only .toc-page-label below. (Every
   other page's body text is part of the background image itself now — see
   generate.py's top-of-file comment — so this class has almost nothing
   left to do; it's not the book-wide "every text div" class it used to be.) */
.t {
  position: absolute;
  white-space: pre;
  margin: 0;
}

/* Page 5's table of contents (generate.py's TOC_TARGETS). The heading text
   itself is already part of the background image, so this is just an
   invisible clickable overlay — same hover-highlight affordance as
   .readmore-trigger/.photo-zoom/.tooltip-hotspot below, not underlined text
   (there's no text inside anymore to underline). */
.toc-jump {
  position: absolute;
  display: flex;
  align-items: center;
  cursor: pointer;
  border-radius: 3px;
  transition: background-color 0.15s ease;
}

.toc-jump:hover,
.toc-jump:focus-visible {
  background-color: rgba(98, 67, 147, 0.14);
  outline: none;
}

/* The "PAGE #" placeholder entries (generate.py's TOC_PAGE_LABELS): the
   PDF's own text is a literal, unfilled "PAGE #" — since nothing is
   redacted out of the background anymore, this covers just that one small
   bbox with an opaque page-colored box and draws the real "PAGE <n>" on
   top. The only body text this pipeline still renders as live HTML,
   deliberately contained to these 8 elements on this one page. */
.toc-page-label {
  display: flex;
  align-items: center;
  background: #ffffff;
  text-decoration: none;
  cursor: pointer;
  border-radius: 2px;
}

.toc-page-label:hover,
.toc-page-label:focus-visible {
  outline: 1px solid rgba(98, 67, 147, 0.35);
  outline-offset: 1px;
}

/* Small persistent "this is clickable" affordance appended to every TOC
   entry (generate.py's TOC_ICON_SVG) — unlike the hover-only highlight
   above, this stays visible at rest, since the entries otherwise give no
   visual hint of being links (toc-jump is a fully invisible overlay;
   toc-page-label is plain black PDF-style text). margin-left:auto pushes it
   to the end of the entry's own (icon-space-widened) box regardless of
   whether there's preceding text content. */
.toc-jump-icon {
  flex-shrink: 0;
  margin-left: auto;
}

/* Transparent hit-area over the "閱讀全文" button already visible in the
   background image — click opens the article modal. See webapp's
   readmore.client.ts. */
.readmore-trigger {
  position: absolute;
  display: block;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.15s ease;
}

.readmore-trigger:hover,
.readmore-trigger:focus-visible {
  background-color: rgba(98, 67, 147, 0.12);
  outline: none;
}

/* Transparent hit-area over a PDF hyperlink's already-visible text/button
   in the background image — invisible until hovered, just for affordance. */
.pdf-link {
  position: absolute;
  display: block;
  cursor: pointer;
  border-radius: 0;
  border-bottom: 1.5px solid #0563c1;
  box-sizing: border-box;
  transition: background-color 0.15s ease;
  background-color: rgba(23, 106, 190, 0.2);

}



.pdf-link:hover,
.pdf-link:focus-visible {
  background-color: rgba(5, 99, 193, 0.1);
  outline: none;
}

/* Invisible click target over a YouTube video's spot — the PDF's own
   thumbnail artwork for it is already part of the background image (see
   generate.py), so this shows that real thumbnail rather than a live
   iframe's own default one. Swapped for an actual <iframe class="yt-embed">
   on click by webapp's yt-embed.client.ts. */
.yt-trigger {
  position: absolute;
  display: block;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.15s ease;
}

.yt-trigger:hover,
.yt-trigger:focus-visible {
  background-color: rgba(255, 255, 255, 0.15);
  outline: none;
}

.yt-embed {
  position: absolute;
  border: 0;
  background: #000;
}

/* Transparent hit-area over a real content photo already visible in the
   background image — click opens the original full-resolution file (never
   resized/recompressed) in a lightbox. See webapp's photo-zoom.client.ts. */
.photo-zoom {
  position: absolute;
  display: block;
  cursor: zoom-in;
  border-radius: 3px;
  transition: background-color 0.15s ease;
}

.photo-zoom:hover,
.photo-zoom:focus-visible {
  background-color: rgba(255, 255, 255, 0.15);
  outline: none;
}

/* "Photo Slides" pages (generate.py's PHOTO_ALBUM_PAGES) — a prev/next
   carousel of real photos replacing the PDF's reused placeholder graphic.
   Every <img> inside is already letterboxed to this exact box by
   extract.py (resized + black bars baked in), so it's just stacked
   <img>s with all but one `hidden`; webapp's photo-album.client.ts (or
   this same pattern ported for the standalone preview pages) toggles
   which one and updates the caption.
   .photo-album-wrap carries the page position; .photo-album itself is
   just sized (position:relative, not absolute), so .photo-album-controls
   below can sit in normal flow right under it, inside the same wrapper. */
.photo-album-wrap {
  position: absolute;
}

.photo-album {
  position: relative;
  overflow: hidden;
  background: #000000;
  border-radius: 4px;
}

.photo-album-img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  /* Clicking opens the lightbox — see generate.py's data-photo-src on this
     element, handled by the existing photo-zoom.client.ts delegation
     (also disabled on mobile there, for the same pinch-to-zoom-gesture
     reason as regular content photos). */
  cursor: zoom-in;
}

/* `.photo-album-img`'s own `display:block` above is an author-stylesheet
   rule, so it silently beats the browser's default `[hidden]{display:none}`
   regardless of matching specificity — every non-current slide stayed
   `display:block` and just got pushed out of view (clipped by
   `.photo-album`'s overflow:hidden, since these weren't absolutely
   positioned either), so the photo never actually changed on prev/next,
   only the caption did (a separate element, unaffected by this). This
   selector's higher specificity is what makes `hidden` actually take
   effect again. */
.photo-album-img[hidden] {
  display: none;
}

.photo-album-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 50%;
  /* A solid-ish fill + a light ring: the fill alone (originally
     rgba(0,0,0,0.45)) all but disappeared against a dark photo edge (e.g.
     page 37's first slide, trees right behind it) — the ring keeps the
     button visible against light AND dark photo content, not just one. */
  border: 1.5px solid rgba(255, 255, 255, 0.85);
  background: rgba(0, 0, 0, 0.6);
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
  color: #ffffff;
  font-size: 19px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background-color 0.15s ease;
}

.photo-album-nav:hover,
.photo-album-nav:focus-visible {
  background: rgba(98, 67, 147, 0.85);
  outline: none;
}

.photo-album-prev {
  left: 8px;
}

.photo-album-next {
  right: 8px;
}

.photo-album-caption {
  /* Hidden — captions are just each source filename cleaned up (see
     extract.py's caption_for()), not curated copy, so they didn't read as
     useful to a viewer. The element + its live text are left in place
     (photo-album.client.ts still updates it on prev/next) in case captions
     come back later; this is the only change needed to toggle them. */
  display: none;
}

/* Labeled prev/next row below the image (as opposed to .photo-album-nav's
   small icon buttons overlaid on the image corners above) — a second,
   more discoverable way to step through the same album. Normal document
   flow under .photo-album within their shared .photo-album-wrap. */
.photo-album-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  font-size: 13px;
  color: #624393;
}

.photo-album-controls-label {
  font-weight: 700;
}

.photo-album-controls-btn {
  appearance: none;
  border: 1px solid rgba(98, 67, 147, 0.35);
  border-radius: 4px;
  background: rgba(98, 67, 147, 0.08);
  color: #624393;
  font-family: inherit;
  font-size: 13px;
  padding: 3px 10px;
  cursor: pointer;
}

.photo-album-controls-btn:hover,
.photo-album-controls-btn:focus-visible {
  background: rgba(98, 67, 147, 0.18);
  outline: none;
}

/* Folio-style page-number badge — left page of a spread gets it in the
   bottom-left corner, right page in the bottom-right, mirroring how a
   printed book's page numbers sit toward the outer edge of each leaf.
   pointer-events:none so it never blocks the book's click-to-flip areas. */
.page-num {
  position: absolute;
  bottom: 24px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background-color: #e2e2e2;
  color: #624393;
  font-family: 'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif;
  font-size: 15px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  box-shadow: 0 1px 4px rgba(0,0,0,0.25);
  pointer-events: none;
}

/* Reusable hover/tap tooltip hotspot (generate.py's emit_tooltip_hotspot) —
   invisible hit-area over content that's already part of the background
   image (a real designed PDF, not a placeholder — see TIMELINE-ALGORITHM.md
   for the original timeline-spread use, pages 8-9; the mechanism itself
   isn't timeline-specific). Wired to the #tooltip popup below by
   timeline.js's wireTooltipHotspots (standalone previews) or the webapp's
   tooltip-hotspot.client.ts (same logic, ported to TS for event delegation
   across desktop/mobile rebuilds). */
.tooltip-hotspot {
  position: absolute;
  display: block;
  cursor: pointer;
  border-radius: 4px;
  background: transparent;
}

.tooltip-hotspot:hover,
.tooltip-hotspot.is-active {
  background: rgba(98, 67, 147, 0.14);
  outline: 1px solid rgba(98, 67, 147, 0.35);
}

#tooltip {
  position: fixed;
  z-index: 100;
  max-width: 340px;
  background: #c8dfe4;
  color: #000000;
  border-radius: 8px;
  padding: 14px 16px;
  line-height: 1.6;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
  pointer-events: none;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 0.12s ease, transform 0.12s ease;
}

#tooltip.open {
  opacity: 1;
  transform: translateY(0);
}

#tooltip .tt-title {
  font-weight: 700;
  color: #624393;
  font-size: 20px;
  margin-bottom: 4px;
}

#tooltip .tt-year {
  color: #624393;
  font-weight: 700;
  margin-right: 6px;
}

#tooltip .tt-tag {
  color: #624393;
  font-weight: 700;
  margin-right: 2px;
}

#tooltip .tt-desc {
  color: #000000;
  font-size: 16px;
}

/* Reusable dismissible hint callout (generate.py's emit_hint_bubble) — a
   small floating pill with a close button, pointing at whatever it's
   labeling. Originally timeline-only (pages 8-9); position (left/right/etc)
   is set per instance in pageN.generated.css since there's no one generic
   anchor point that suits every caller. Dismissing one hides only that
   instance (.dismissed, added by the close button's own click handler —
   see tooltip-hotspot.client.ts/timeline.js's wireHintBubbles) — NOT a
   page/body-wide flag, so multiple independent hint bubbles across
   different pages never cross-dismiss each other. Not persisted anywhere,
   so a refresh always shows it again. */
.hint-bubble {
  position: absolute;
  bottom: 72px;
  z-index: 6;
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: calc(100% - 48px);
  padding: 8px 10px 8px 16px;
  border-radius: 999px;
  background: #e2e2e2;
  color: #624393;
  font-family: 'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: 0.02em;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
  pointer-events: auto;
  animation: hint-bubble-float 2.6s ease-in-out infinite;
}

.hint-bubble-text {
  flex: 1;
  min-width: 0;
}

.hint-bubble-close {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 1px solid rgba(98, 67, 147, 0.35);
  border-radius: 50%;
  background: rgba(98, 67, 147, 0.08);
  color: #624393;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hint-bubble-close:hover,
.hint-bubble-close:focus-visible {
  background: rgba(98, 67, 147, 0.18);
  outline: none;
}

.hint-bubble.dismissed {
  display: none;
}

@keyframes hint-bubble-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-7px); }
}


/* ---- page 1 ---- */
#page1 { background-image: url('../assets/backgrounds/page1.webp'); }

/* page1.css — local overrides for page 1.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page1.generated.css, so any rule here wins.

   Examples:

   #page1 {
     background-image: url('assets/backgrounds/page1.png');
   }

   #p1-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

/* ---- page 2 ---- */
#page2 { background-image: url('../assets/backgrounds/page2.webp'); }
#p2-pagenum { left:24px; }

/* page2.css — local overrides for page 2.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page2.generated.css, so any rule here wins.

   Examples:

   #page2 {
     background-image: url('assets/backgrounds/page2.png');
   }

   #p2-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p2-t2,
#p2-t3 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 3 ---- */
#page3 { background-image: url('../assets/backgrounds/page3.webp'); }
#p3-pagenum { right:24px; }

/* page3.css — local overrides for page 3.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page3.generated.css, so any rule here wins.

   Examples:

   #page3 {
     background-image: url('assets/backgrounds/page3.png');
   }

   #p3-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 4 ---- */
#page4 { background-image: url('../assets/backgrounds/page4.webp'); }
#p4-pagenum { left:24px; }

/* page4.css — local overrides for page 4.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page4.generated.css, so any rule here wins.

   Examples:

   #page4 {
     background-image: url('assets/backgrounds/page4.png');
   }

   #p4-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 5 ---- */
#page5 { background-image: url('../assets/backgrounds/page5.webp'); }
#p5-toc1 { left:69.60px; top:212.89px; width:54.07px; height:24.68px; }
#p5-toc2 { left:313.93px; top:212.74px; width:87.10px; height:24.32px; }
#p5-toc3 { left:342.45px; top:259.30px; width:157.95px; height:24.32px; }
#p5-toc4 { left:313.93px; top:282.17px; width:129.58px; height:14.45px; }
#p5-toc5 { left:342.45px; top:309.18px; width:157.95px; height:24.32px; }
#p5-toc6 { left:313.93px; top:332.05px; width:178.31px; height:14.45px; }
#p5-toc7 { left:342.45px; top:359.06px; width:157.95px; height:24.32px; }
#p5-toc8 { left:313.93px; top:381.94px; width:165.84px; height:14.45px; }
#p5-toc9 { left:313.93px; top:473.36px; width:88.14px; height:24.68px; }
#p5-toc10 { left:342.89px; top:521.09px; width:262.30px; height:24.68px; }
#p5-toc11 { left:342.89px; top:568.81px; width:262.30px; height:24.68px; }
#p5-toc12 { left:342.89px; top:616.54px; width:262.30px; height:24.68px; }
#p5-toc13 { left:342.89px; top:664.27px; width:300.18px; height:24.68px; }
#p5-toc14 { left:342.89px; top:711.99px; width:300.18px; height:24.68px; }
#p5-toc18 { left:69.60px; top:117.12px; width:139.24px; height:24.68px; }
#p5-toc19 { left:313.93px; top:117.12px; width:88.14px; height:24.68px; }
#p5-toc22 { left:69.60px; top:308.66px; width:88.14px; height:24.68px; }
#p5-toc24 { left:69.60px; top:404.42px; width:139.24px; height:24.68px; }
#p5-toc25 { left:313.93px; top:807.27px; width:88.14px; height:24.68px; }
#p5-toc15 { left:69.60px; top:188.64px; width:49.39px; height:13.32px; font-size:13.31px; line-height:13.32px; color:#624393; font-family:'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif; font-weight:700; }
#p5-toc16 { left:313.93px; top:188.64px; width:49.39px; height:13.32px; font-size:13.31px; line-height:13.32px; color:#624393; font-family:'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif; font-weight:700; }
#p5-toc17 { left:313.93px; top:449.11px; width:49.39px; height:13.32px; font-size:13.31px; line-height:13.32px; color:#624393; font-family:'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif; font-weight:700; }
#p5-toc20 { left:69.60px; top:92.87px; width:49.39px; height:13.32px; font-size:13.31px; line-height:13.32px; color:#624393; font-family:'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif; font-weight:700; }
#p5-toc21 { left:313.93px; top:92.87px; width:49.39px; height:13.32px; font-size:13.31px; line-height:13.32px; color:#624393; font-family:'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif; font-weight:700; }
#p5-toc23 { left:69.60px; top:284.41px; width:49.39px; height:13.32px; font-size:13.31px; line-height:13.32px; color:#624393; font-family:'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif; font-weight:700; }
#p5-toc26 { left:69.60px; top:380.18px; width:49.39px; height:13.32px; font-size:13.31px; line-height:13.32px; color:#624393; font-family:'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif; font-weight:700; }
#p5-toc27 { left:313.93px; top:783.02px; width:49.39px; height:13.32px; font-size:13.31px; line-height:13.32px; color:#624393; font-family:'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif; font-weight:700; }
#p5-pagenum { right:24px; }
#p5-toc-hint { left:69.6px; bottom:233.36px; }

/* page5.css — local overrides for page 5.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page5.generated.css, so any rule here wins.

   Examples:

   #page5 {
     background-image: url('assets/backgrounds/page5.png');
   }

   #p5-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 6 ---- */
#page6 { background-image: url('../assets/backgrounds/page6.webp'); }
#p6-photo1 { left:53.32px; top:530.21px; width:304.35px; height:228.41px; }
#p6-photo2 { left:363.48px; top:604.31px; width:263.77px; height:198.15px; }
#p6-readmore1 { left:432.20px; top:495.11px; width:62.64px; height:19.73px; }
#p6-pagenum { left:24px; }

/* page6.css — local overrides for page 6.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page6.generated.css, so any rule here wins.

   Examples:

   #page6 {
     background-image: url('assets/backgrounds/page6.png');
   }

   #p6-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 7 ---- */
#page7 { background-image: url('../assets/backgrounds/page7.webp'); }
#p7-photo1 { left:65.94px; top:236.98px; width:395.54px; height:172.03px; }
#p7-photo2 { left:365.49px; top:370.93px; width:259.90px; height:206.66px; }
#p7-readmore1 { left:432.20px; top:822.64px; width:62.64px; height:19.73px; }
#p7-pagenum { right:24px; }
#p7-photo-zoom-hint { left:69.5px; bottom:361.49px; }

/* page7.css — local overrides for page 7.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page7.generated.css, so any rule here wins.

   Examples:

   #page7 {
     background-image: url('assets/backgrounds/page7.png');
   }

   #p7-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 8 ---- */
#page8 { background-image: url('../assets/backgrounds/page8.webp'); }
#p8-tl1 { left:417.46px; top:134.27px; width:170.22px; height:24.67px; }
#p8-tl2 { left:417.46px; top:157.28px; width:68.09px; height:24.67px; }
#p8-tl3 { left:189.80px; top:287.33px; width:68.09px; height:24.67px; }
#p8-tl4 { left:33.69px; top:351.91px; width:132.63px; height:70.69px; }
#p8-tl5 { left:129.43px; top:731.41px; width:68.09px; height:24.67px; }
#p8-tl6 { left:243.63px; top:787.68px; width:68.09px; height:24.67px; }
#p8-tl7 { left:332.21px; top:679.74px; width:98.59px; height:47.68px; }
#p8-tl8 { left:480.34px; top:582.84px; width:68.09px; height:24.67px; }
#p8-tl9 { left:480.34px; top:605.85px; width:102.13px; height:24.67px; }
#p8-tl10 { left:295.56px; top:192.01px; width:68.09px; height:24.67px; }
#p8-tl11 { left:529.84px; top:251.04px; width:170.22px; height:24.67px; }
#p8-pagenum { left:24px; }
#p8-timeline-hint { right:24px; bottom:72px; }

/* page8.css — local overrides for page 8.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page8.generated.css, so any rule here wins.

   Examples:

   #page8 {
     background-image: url('assets/backgrounds/page8.png');
   }

   #p8-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 9 ---- */
#page9 { background-image: url('../assets/backgrounds/page9.webp'); }
#p9-tl1 { left:76.20px; top:156.51px; width:98.59px; height:47.68px; }
#p9-tl2 { left:105.15px; top:202.53px; width:170.22px; height:24.67px; }
#p9-tl3 { left:105.15px; top:225.54px; width:170.22px; height:24.67px; }
#p9-tl4 { left:72.49px; top:565.16px; width:85.11px; height:24.67px; }
#p9-tl5 { left:136.07px; top:669.94px; width:170.22px; height:24.67px; }
#p9-tl6 { left:287.85px; top:727.64px; width:170.22px; height:24.67px; }
#p9-tl7 { left:451.81px; top:626.84px; width:167.42px; height:24.67px; }
#p9-tl8 { left:228.05px; top:109.42px; width:208.08px; height:24.67px; }
#p9-tl9 { left:369.21px; top:245.14px; width:68.09px; height:24.67px; }
#p9-tl10 { left:369.21px; top:268.16px; width:136.17px; height:24.67px; }
#p9-tl11 { left:369.21px; top:291.17px; width:119.15px; height:24.67px; }
#p9-tl12 { left:509.50px; top:133.85px; width:136.17px; height:24.67px; }
#p9-tl13 { left:509.50px; top:156.86px; width:102.13px; height:24.67px; }
#p9-tl14 { left:509.50px; top:179.87px; width:73.77px; height:24.67px; }
#p9-pagenum { right:24px; }
#p9-timeline-hint { left:24px; bottom:72px; }

/* page9.css — local overrides for page 9.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page9.generated.css, so any rule here wins.

   Examples:

   #page9 {
     background-image: url('assets/backgrounds/page9.png');
   }

   #p9-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 10 ---- */
#page10 { background-image: url('../assets/backgrounds/page10.webp'); }
#p10-photo1 { left:402.95px; top:612.86px; width:208.73px; height:144.12px; }
#p10-photo2 { left:67.10px; top:213.66px; width:315.75px; height:237.20px; }
#p10-photo3 { left:32.41px; top:537.58px; width:385.20px; height:237.20px; }
#p10-pagenum { left:24px; }

/* page10.css — local overrides for page 10.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page10.generated.css, so any rule here wins.

   Examples:

   #page10 {
     background-image: url('assets/backgrounds/page10.png');
   }

   #p10-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 11 ---- */
#page11 { background-image: url('../assets/backgrounds/page11.webp'); }
#p11-photo1 { left:314.25px; top:124.62px; width:311.12px; height:415.10px; }
#p11-photo2 { left:291.64px; top:537.58px; width:356.49px; height:237.20px; }
#p11-pagenum { right:24px; }
#p11-photo-zoom-hint { left:69.5px; bottom:90px; }

/* page11.css — local overrides for page 11.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page11.generated.css, so any rule here wins.

   Examples:

   #page11 {
     background-image: url('assets/backgrounds/page11.png');
   }

   #p11-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 12 ---- */
#page12 { background-image: url('../assets/backgrounds/page12.webp'); }
#p12-pagenum { left:24px; }

/* page12.css — local overrides for page 12.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page12.generated.css, so any rule here wins.

   Examples:

   #page12 {
     background-image: url('assets/backgrounds/page12.png');
   }

   #p12-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 13 ---- */
#page13 { background-image: url('../assets/backgrounds/page13.webp'); }
#p13-photo1 { left:109.96px; top:422.50px; width:474.61px; height:356.54px; }
#p13-pagenum { right:24px; }

/* page13.css — local overrides for page 13.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page13.generated.css, so any rule here wins.

   Examples:

   #page13 {
     background-image: url('assets/backgrounds/page13.png');
   }

   #p13-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 14 ---- */
#page14 { background-image: url('../assets/backgrounds/page14.webp'); }
#p14-pagenum { left:24px; }

/* page14.css — local overrides for page 14.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page14.generated.css, so any rule here wins.

   Examples:

   #page14 {
     background-image: url('assets/backgrounds/page14.png');
   }

   #p14-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/



/* ---- page 15 ---- */
#page15 { background-image: url('../assets/backgrounds/page15.webp'); }
#p15-pagenum { right:24px; }

/* page15.css — local overrides for page 15.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page15.generated.css, so any rule here wins.

   Examples:

   #page15 {
     background-image: url('assets/backgrounds/page15.png');
   }

   #p15-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p15-t2,
#p15-t3,
#p15-t5,
#p15-t6,
#p15-t7,
#p15-t8,
#p15-t9,
#p15-t12,
#p15-t13,
#p15-t16,
#p15-t17 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 16 ---- */
#page16 { background-image: url('../assets/backgrounds/page16.webp'); }
#p16-pagenum { left:24px; }

/* page16.css — local overrides for page 16.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page16.generated.css, so any rule here wins.

   Examples:

   #page16 {
     background-image: url('assets/backgrounds/page16.png');
   }

   #p16-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p16-t9,
#p16-t10,
#p16-t14,
#p16-t15,
#p16-t16,
#p16-t17,
#p16-t19,
#p16-t20 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 17 ---- */
#page17 { background-image: url('../assets/backgrounds/page17.webp'); }
#p17-photo1 { left:291.64px; top:564.55px; width:356.49px; height:237.20px; }
#p17-pagenum { right:24px; }

/* page17.css — local overrides for page 17.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page17.generated.css, so any rule here wins.

   Examples:

   #page17 {
     background-image: url('assets/backgrounds/page17.png');
   }

   #p17-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p17-t2,
#p17-t3,
#p17-t4,
#p17-t5,
#p17-t7,
#p17-t12,
#p17-t13,
#p17-t14,
#p17-t15 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 18 ---- */
#page18 { background-image: url('../assets/backgrounds/page18.webp'); }
#p18-pagenum { left:24px; }

/* page18.css — local overrides for page 18.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page18.generated.css, so any rule here wins.

   Examples:

   #page18 {
     background-image: url('assets/backgrounds/page18.png');
   }

   #p18-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

/* Clones of #p18-t1, tops stepped by 27.28px from 423.46 */
#p18-t1-1 {
  left: 69.50px;
  top: 450.74px; /* 423.46 + 27.28 */
  font-size: 18.17px;
  line-height: 26.32px;
  color: #000000;
  font-family: 'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif;
  font-weight: 400;
  width: 365.68px;
  white-space: normal;
  text-align: justify;
  width: 365.68px;
}

#p18-t1-2 {
  left: 69.50px;
  top: 478.02px; /* 450.74 + 27.28 */
  font-size: 18.17px;
  line-height: 26.32px;
  color: #000000;
  font-family: 'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif;
  font-weight: 400;
  width: 365.68px;
  white-space: normal;
  text-align: justify;
  text-align-last: justify;
  text-justify: inter-character;
}

#p18-t1-3 {
  left: 69.50px;
  top: 505.30px; /* 478.02 + 27.28 */
  font-size: 18.17px;
  line-height: 26.32px;
  color: #000000;
  font-family: 'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif;
  font-weight: 400;
  width: auto;
  white-space: normal;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
  width: 365.68px;
}

#p18-t1-4 {
  left: 69.50px;
  top: 532.58px; /* 505.30 + 27.28 */
  font-size: 18.17px;
  line-height: 26.32px;
  color: #000000;
  font-family: 'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif;
  font-weight: 400;
  width: 365.68px;
  white-space: normal;
  text-align: justify;
  text-align-last: left;
  text-justify: inter-character;
}

#p18-t2,
#p18-t3 {
  width: 365.68px;
  text-align: justify;
  text-align-last: justify;
  text-justify: inter-character;
}

#p18-t4 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 19 ---- */
#page19 { background-image: url('../assets/backgrounds/page19.webp'); }
#p19-photo1 { left:23.69px; top:422.50px; width:636.06px; height:356.54px; }
#p19-pagenum { right:24px; }

/* page19.css — local overrides for page 19.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page19.generated.css, so any rule here wins.

   Examples:

   #page19 {
     background-image: url('assets/backgrounds/page19.png');
   }

   #p19-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 20 ---- */
#page20 { background-image: url('../assets/backgrounds/page20.webp'); }
#p20-pagenum { left:24px; }

/* page20.css — local overrides for page 20.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page20.generated.css, so any rule here wins.

   Examples:

   #page20 {
     background-image: url('assets/backgrounds/page20.png');
   }

   #p20-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p20-t1, #p20-t2 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}

#p20-t1::after { content: none; }


/* ---- page 21 ---- */
#page21 { background-image: url('../assets/backgrounds/page21.webp'); }
#p21-pagenum { right:24px; }

/* page21.css — local overrides for page 21.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page21.generated.css, so any rule here wins.

   Examples:

   #page21 {
     background-image: url('assets/backgrounds/page21.png');
   }

   #p21-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 22 ---- */
#page22 { background-image: url('../assets/backgrounds/page22.webp'); }
#p22-pagenum { left:24px; }

/* page22.css — local overrides for page 22.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page22.generated.css, so any rule here wins.

   Examples:

   #page22 {
     background-image: url('assets/backgrounds/page22.png');
   }

   #p22-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 23 ---- */
#page23 { background-image: url('../assets/backgrounds/page23.webp'); }
#p23-photo1 { left:271.01px; top:490.91px; width:423.16px; height:237.20px; }
#p23-pagenum { right:24px; }

/* page23.css — local overrides for page 23.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page23.generated.css, so any rule here wins.

   Examples:

   #page23 {
     background-image: url('assets/backgrounds/page23.png');
   }

   #p23-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p23-t4,
#p23-t5 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 24 ---- */
#page24 { background-image: url('../assets/backgrounds/page24.webp'); }
#p24-pagenum { left:24px; }

/* page24.css — local overrides for page 24.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page24.generated.css, so any rule here wins.

   Examples:

   #page24 {
     background-image: url('assets/backgrounds/page24.png');
   }

   #p24-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 25 ---- */
#page25 { background-image: url('../assets/backgrounds/page25.webp'); }
#p25-photo1 { left:105.45px; top:422.50px; width:531.68px; height:356.54px; }
#p25-pagenum { right:24px; }

/* page25.css — local overrides for page 25.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page25.generated.css, so any rule here wins.

   Examples:

   #page25 {
     background-image: url('assets/backgrounds/page25.png');
   }

   #p25-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 26 ---- */
#page26 { background-image: url('../assets/backgrounds/page26.webp'); }
#p26-pagenum { left:24px; }

/* page26.css — local overrides for page 26.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page26.generated.css, so any rule here wins.

   Examples:

   #page26 {
     background-image: url('assets/backgrounds/page26.png');
   }

   #p26-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p26-t4,
#p26-t5,
#p26-t7,
#p26-t8 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}

/* Match 創造／救贖: label on its own line, body wraps below */
#p26-t6 {
  width: 396.40px;
  white-space: normal;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 27 ---- */
#page27 { background-image: url('../assets/backgrounds/page27.webp'); }
#p27-pagenum { right:24px; }

/* page27.css — local overrides for page 27.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page27.generated.css, so any rule here wins.

   Examples:

   #page27 {
     background-image: url('assets/backgrounds/page27.png');
   }

   #p27-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 28 ---- */
#page28 { background-image: url('../assets/backgrounds/page28.webp'); }
#p28-pagenum { left:24px; }

/* page28.css — local overrides for page 28.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page28.generated.css, so any rule here wins.

   Examples:

   #page28 {
     background-image: url('assets/backgrounds/page28.png');
   }

   #p28-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 29 ---- */
#page29 { background-image: url('../assets/backgrounds/page29.webp'); }
#p29-photo1 { left:189.90px; top:559.74px; width:444.92px; height:247.01px; }
#p29-pagenum { right:24px; }

/* page29.css — local overrides for page 29.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page29.generated.css, so any rule here wins.

   Examples:

   #page29 {
     background-image: url('assets/backgrounds/page29.png');
   }

   #p29-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 30 ---- */
#page30 { background-image: url('../assets/backgrounds/page30.webp'); }
#p30-pagenum { left:24px; }

/* page30.css — local overrides for page 30.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page30.generated.css, so any rule here wins.

   Examples:

   #page30 {
     background-image: url('assets/backgrounds/page30.png');
   }

   #p30-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 31 ---- */
#page31 { background-image: url('../assets/backgrounds/page31.webp'); }
#p31-pagenum { right:24px; }

/* page31.css — local overrides for page 31.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page31.generated.css, so any rule here wins.

   Examples:

   #page31 {
     background-image: url('assets/backgrounds/page31.png');
   }

   #p31-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 32 ---- */
#page32 { background-image: url('../assets/backgrounds/page32.webp'); }
#p32-pagenum { left:24px; }

/* page32.css — local overrides for page 32.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page32.generated.css, so any rule here wins.

   Examples:

   #page32 {
     background-image: url('assets/backgrounds/page32.png');
   }

   #p32-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 33 ---- */
#page33 { background-image: url('../assets/backgrounds/page33.webp'); }
#p33-pagenum { right:24px; }

/* page33.css — local overrides for page 33.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page33.generated.css, so any rule here wins.

   Examples:

   #page33 {
     background-image: url('assets/backgrounds/page33.png');
   }

   #p33-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p33-t27 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 34 ---- */
#page34 { background-image: url('../assets/backgrounds/page34.webp'); }
#p34-photo1 { left:54.21px; top:555.76px; width:437.13px; height:245.03px; }
#p34-readmore1 { left:432.20px; top:507.09px; width:62.64px; height:19.73px; }
#p34-pagenum { left:24px; }

/* page34.css — local overrides for page 34.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page34.generated.css, so any rule here wins.

   Examples:

   #page34 {
     background-image: url('assets/backgrounds/page34.png');
   }

   #p34-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p34-t4,
#p34-t5 {
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 35 ---- */
#page35 { background-image: url('../assets/backgrounds/page35.webp'); }
#p35-photo1 { left:183.10px; top:228.79px; width:406.52px; height:264.17px; }
#p35-readmore1 { left:545.80px; top:764.60px; width:62.64px; height:19.73px; }
#p35-pagenum { right:24px; }

/* page35.css — local overrides for page 35.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page35.generated.css, so any rule here wins.

   Examples:

   #page35 {
     background-image: url('assets/backgrounds/page35.png');
   }

   #p35-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 36 ---- */
#page36 { background-image: url('../assets/backgrounds/page36.webp'); }
#p36-photo1 { left:69.50px; top:385.67px; width:406.52px; height:542.71px; }
#p36-readmore1 { left:432.20px; top:425.96px; width:62.64px; height:19.73px; }
#p36-pagenum { left:24px; }

/* page36.css — local overrides for page 36.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page36.generated.css, so any rule here wins.

   Examples:

   #page36 {
     background-image: url('assets/backgrounds/page36.png');
   }

   #p36-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 37 ---- */
#page37 { background-image: url('../assets/backgrounds/page37.webp'); }
#p37-link1 { left:100.16px; top:695.97px; width:293.84px; height:26.42px; }
#p37-link2 { left:100.16px; top:722.39px; width:91.99px; height:26.42px; }
#p37-link3 { left:100.16px; top:748.81px; width:238.48px; height:26.42px; }
#p37-link4 { left:198.11px; top:801.65px; width:73.25px; height:26.42px; }
#p37-album-wrap { left:69.50px; top:244.50px; width:555.00px; }
#p37-album { width:555.00px; height:357.00px; }
#p37-pagenum { right:24px; }

/* page37.css — local overrides for page 37.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page37.generated.css, so any rule here wins.

   Examples:

   #page37 {
     background-image: url('assets/backgrounds/page37.png');
   }

   #p37-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p37-t3,
#p37-t4,
#p37-t5,
#p37-t6 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 38 ---- */
#page38 { background-image: url('../assets/backgrounds/page38.webp'); }
#p38-pagenum { left:24px; }

/* page38.css — local overrides for page 38.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page38.generated.css, so any rule here wins.

   Examples:

   #page38 {
     background-image: url('assets/backgrounds/page38.png');
   }

   #p38-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/
#p38-t3 { right:108.26px; top:396.71px; font-size:34.07px; line-height:34.09px; color:#624393; font-family:'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif; font-weight:400; letter-spacing:0.02em; text-align:right; }

/* ---- page 39 ---- */
#page39 { background-image: url('../assets/backgrounds/page39.webp'); }
#p39-pagenum { right:24px; }

/* page39.css — local overrides for page 39.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page39.generated.css, so any rule here wins.

   Examples:

   #page39 {
     background-image: url('assets/backgrounds/page39.png');
   }

   #p39-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p39-t10,
#p39-t11,
#p39-t14 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 40 ---- */
#page40 { background-image: url('../assets/backgrounds/page40.webp'); }
#p40-photo1 { left:69.50px; top:467.89px; width:453.39px; height:301.50px; }
#p40-readmore1 { left:432.20px; top:425.96px; width:62.64px; height:19.73px; }
#p40-pagenum { left:24px; }

/* page40.css — local overrides for page 40.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page40.generated.css, so any rule here wins.

   Examples:

   #page40 {
     background-image: url('assets/backgrounds/page40.png');
   }

   #p40-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

/* Merged teaser body (was p40-t3…t5) */
#p40-t3 {
  left: 69.50px;
  top: 340.10px;
  font-size: 18.17px;
  line-height: 26.32px;
  color: #000000;
  font-family: 'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei', sans-serif;
  font-weight: 400;
  width: 426.68px;
  white-space: normal;
  text-align: justify;
  text-align-last: left;
  text-justify: inter-character;
}


/* ---- page 41 ---- */
#page41 { background-image: url('../assets/backgrounds/page41.webp'); }
#p41-photo1 { left:218.81px; top:232.20px; width:406.52px; height:270.87px; }
#p41-readmore1 { left:534.73px; top:791.87px; width:62.64px; height:19.73px; }
#p41-pagenum { right:24px; }

/* page41.css — local overrides for page 41.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page41.generated.css, so any rule here wins.

   Examples:

   #page41 {
     background-image: url('assets/backgrounds/page41.png');
   }

   #p41-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 42 ---- */
#page42 { background-image: url('../assets/backgrounds/page42.webp'); }
#p42-photo1 { left:69.50px; top:515.88px; width:406.65px; height:304.92px; }
#p42-readmore1 { left:432.20px; top:455.80px; width:62.64px; height:19.73px; }
#p42-pagenum { left:24px; }

/* page42.css — local overrides for page 42.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page42.generated.css, so any rule here wins.

   Examples:

   #page42 {
     background-image: url('assets/backgrounds/page42.png');
   }

   #p42-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p42-t7,
#p42-t8 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 43 ---- */
#page43 { background-image: url('../assets/backgrounds/page43.webp'); }
#p43-photo1 { left:248.46px; top:193.46px; width:376.89px; height:283.07px; }
#p43-readmore1 { left:545.80px; top:823.51px; width:62.64px; height:19.73px; }
#p43-pagenum { right:24px; }

/* page43.css — local overrides for page 43.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page43.generated.css, so any rule here wins.

   Examples:

   #page43 {
     background-image: url('assets/backgrounds/page43.png');
   }

   #p43-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p43-t6,
#p43-t7,
#p43-t8 {
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 44 ---- */
#page44 { background-image: url('../assets/backgrounds/page44.webp'); }
#p44-photo1 { left:-60.86px; top:178.18px; width:755.52px; height:567.01px; }
#p44-pagenum { left:24px; }

/* page44.css — local overrides for page 44.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page44.generated.css, so any rule here wins.

   Examples:

   #page44 {
     background-image: url('assets/backgrounds/page44.png');
   }

   #p44-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 45 ---- */
#page45 { background-image: url('../assets/backgrounds/page45.webp'); }
#p45-link1 { left:100.16px; top:674.66px; width:183.97px; height:26.42px; }
#p45-link2 { left:100.16px; top:701.08px; width:434.37px; height:26.42px; }
#p45-link3 { left:100.16px; top:753.92px; width:437.78px; height:26.42px; }
#p45-link4 { left:326.72px; top:806.76px; width:73.25px; height:26.42px; }
#p45-album-wrap { left:69.50px; top:244.50px; width:555.00px; }
#p45-album { width:555.00px; height:357.00px; }
#p45-pagenum { right:24px; }

/* page45.css — local overrides for page 45.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page45.generated.css, so any rule here wins.

   Examples:

   #page45 {
     background-image: url('assets/backgrounds/page45.png');
   }

   #p45-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 46 ---- */
#page46 { background-image: url('../assets/backgrounds/page46.webp'); }
#p46-pagenum { left:24px; }

/* page46.css — local overrides for page 46.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page46.generated.css, so any rule here wins.

   Examples:

   #page46 {
     background-image: url('assets/backgrounds/page46.png');
   }

   #p46-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 47 ---- */
#page47 { background-image: url('../assets/backgrounds/page47.webp'); }
#p47-pagenum { right:24px; }

/* page47.css — local overrides for page 47.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page47.generated.css, so any rule here wins.

   Examples:

   #page47 {
     background-image: url('assets/backgrounds/page47.png');
   }

   #p47-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p47-t15,
#p47-t16,#p47-t18 {
  width: 100px;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}

#p47-t23 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 48 ---- */
#page48 { background-image: url('../assets/backgrounds/page48.webp'); }
#p48-photo1 { left:-54.81px; top:484.47px; width:581.57px; height:273.75px; }
#p48-readmore1 { left:432.20px; top:475.66px; width:62.64px; height:19.73px; }
#p48-pagenum { left:24px; }

/* page48.css — local overrides for page 48.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page48.generated.css, so any rule here wins.

   Examples:

   #page48 {
     background-image: url('assets/backgrounds/page48.png');
   }

   #p48-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 49 ---- */
#page49 { background-image: url('../assets/backgrounds/page49.webp'); }
#p49-photo1 { left:173.27px; top:239.31px; width:452.44px; height:253.65px; }
#p49-readmore1 { left:534.73px; top:826.81px; width:62.64px; height:19.73px; }
#p49-pagenum { right:24px; }

/* page49.css — local overrides for page 49.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page49.generated.css, so any rule here wins.

   Examples:

   #page49 {
     background-image: url('assets/backgrounds/page49.png');
   }

   #p49-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 50 ---- */
#page50 { background-image: url('../assets/backgrounds/page50.webp'); }
#p50-photo1 { left:69.50px; top:499.52px; width:318.30px; height:337.60px; }
#p50-readmore1 { left:432.20px; top:456.23px; width:62.64px; height:19.73px; }
#p50-pagenum { left:24px; }

/* page50.css — local overrides for page 50.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page50.generated.css, so any rule here wins.

   Examples:

   #page50 {
     background-image: url('assets/backgrounds/page50.png');
   }

   #p50-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 51 ---- */
#page51 { background-image: url('../assets/backgrounds/page51.webp'); }
#p51-photo1 { left:332.83px; top:239.86px; width:292.62px; height:220.02px; }
#p51-photo2 { left:69.50px; top:351.70px; width:245.15px; height:184.12px; }
#p51-readmore1 { left:549.27px; top:807.33px; width:62.64px; height:19.73px; }
#p51-pagenum { right:24px; }

/* page51.css — local overrides for page 51.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page51.generated.css, so any rule here wins.

   Examples:

   #page51 {
     background-image: url('assets/backgrounds/page51.png');
   }

   #p51-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 52 ---- */
#page52 { background-image: url('../assets/backgrounds/page52.webp'); }
#p52-photo1 { left:-224.04px; top:42.06px; width:938.30px; height:703.17px; }
#p52-pagenum { left:24px; }

/* page52.css — local overrides for page 52.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page52.generated.css, so any rule here wins.

   Examples:

   #page52 {
     background-image: url('assets/backgrounds/page52.png');
   }

   #p52-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 53 ---- */
#page53 { background-image: url('../assets/backgrounds/page53.webp'); }
#p53-link1 { left:100.16px; top:696.82px; width:165.23px; height:26.42px; }
#p53-link2 { left:100.16px; top:724.09px; width:330.47px; height:26.42px; }
#p53-link3 { left:100.16px; top:751.36px; width:165.23px; height:26.42px; }
#p53-link4 { left:198.11px; top:805.91px; width:73.25px; height:26.42px; }
#p53-album-wrap { left:69.50px; top:244.50px; width:555.00px; }
#p53-album { width:555.00px; height:357.00px; }
#p53-pagenum { right:24px; }

/* page53.css — local overrides for page 53.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page53.generated.css, so any rule here wins.

   Examples:

   #page53 {
     background-image: url('assets/backgrounds/page53.png');
   }

   #p53-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p53-t2,
#p53-t3 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 54 ---- */
#page54 { background-image: url('../assets/backgrounds/page54.webp'); }
#p54-pagenum { left:24px; }

/* page54.css — local overrides for page 54.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page54.generated.css, so any rule here wins.

   Examples:

   #page54 {
     background-image: url('assets/backgrounds/page54.png');
   }

   #p54-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 55 ---- */
#page55 { background-image: url('../assets/backgrounds/page55.webp'); }
#p55-pagenum { right:24px; }

/* page55.css — local overrides for page 55.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page55.generated.css, so any rule here wins.

   Examples:

   #page55 {
     background-image: url('assets/backgrounds/page55.png');
   }

   #p55-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 56 ---- */
#page56 { background-image: url('../assets/backgrounds/page56.webp'); }
#p56-pagenum { left:24px; }

/* page56.css — local overrides for page 56.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page56.generated.css, so any rule here wins.

   Examples:

   #page56 {
     background-image: url('assets/backgrounds/page56.png');
   }

   #p56-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 57 ---- */
#page57 { background-image: url('../assets/backgrounds/page57.webp'); }
#p57-photo1 { left:69.50px; top:247.49px; width:324.26px; height:435.50px; }
#p57-readmore1 { left:435.60px; top:803.78px; width:62.64px; height:19.73px; }
#p57-pagenum { right:24px; }

/* page57.css — local overrides for page 57.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page57.generated.css, so any rule here wins.

   Examples:

   #page57 {
     background-image: url('assets/backgrounds/page57.png');
   }

   #p57-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 58 ---- */
#page58 { background-image: url('../assets/backgrounds/page58.webp'); }
#p58-photo1 { left:69.50px; top:268.40px; width:324.26px; height:410.62px; }
#p58-readmore1 { left:432.20px; top:803.78px; width:62.64px; height:19.73px; }
#p58-pagenum { left:24px; }

/* page58.css — local overrides for page 58.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page58.generated.css, so any rule here wins.

   Examples:

   #page58 {
     background-image: url('assets/backgrounds/page58.png');
   }

   #p58-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 59 ---- */
#page59 { background-image: url('../assets/backgrounds/page59.webp'); }
#p59-photo1 { left:69.50px; top:182.46px; width:324.26px; height:431.68px; }
#p59-readmore1 { left:432.20px; top:776.51px; width:62.64px; height:19.73px; }
#p59-pagenum { right:24px; }

/* page59.css — local overrides for page 59.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page59.generated.css, so any rule here wins.

   Examples:

   #page59 {
     background-image: url('assets/backgrounds/page59.png');
   }

   #p59-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 60 ---- */
#page60 { background-image: url('../assets/backgrounds/page60.webp'); }
#p60-photo1 { left:69.50px; top:264.05px; width:324.26px; height:348.40px; }
#p60-readmore1 { left:432.20px; top:803.78px; width:62.64px; height:19.73px; }
#p60-pagenum { left:24px; }

/* page60.css — local overrides for page 60.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page60.generated.css, so any rule here wins.

   Examples:

   #page60 {
     background-image: url('assets/backgrounds/page60.png');
   }

   #p60-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 61 ---- */
#page61 { background-image: url('../assets/backgrounds/page61.webp'); }
#p61-photo1 { left:69.50px; top:240.69px; width:324.26px; height:280.45px; }
#p61-readmore1 { left:432.20px; top:803.78px; width:62.64px; height:19.73px; }
#p61-pagenum { right:24px; }

/* page61.css — local overrides for page 61.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page61.generated.css, so any rule here wins.

   Examples:

   #page61 {
     background-image: url('assets/backgrounds/page61.png');
   }

   #p61-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p61-t4,
#p61-t5 {
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 62 ---- */
#page62 { background-image: url('../assets/backgrounds/page62.webp'); }
#p62-pagenum { left:24px; }

/* page62.css — local overrides for page 62.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page62.generated.css, so any rule here wins.

   Examples:

   #page62 {
     background-image: url('assets/backgrounds/page62.png');
   }

   #p62-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 63 ---- */
#page63 { background-image: url('../assets/backgrounds/page63.webp'); }
#p63-link1 { left:280.86px; top:511.13px; width:270.85px; height:268.47px; }
#p63-photo2 { left:86.84px; top:206.42px; width:291.60px; height:218.84px; }
#p63-readmore1 { left:545.80px; top:423.33px; width:62.64px; height:19.73px; }
#p63-pagenum { right:24px; }

/* page63.css — local overrides for page 63.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page63.generated.css, so any rule here wins.

   Examples:

   #page63 {
     background-image: url('assets/backgrounds/page63.png');
   }

   #p63-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 64 ---- */
#page64 { background-image: url('../assets/backgrounds/page64.webp'); }
#p64-photo1 { left:69.50px; top:149.96px; width:445.33px; height:249.77px; }
#p64-readmore1 { left:238.75px; top:801.84px; width:62.64px; height:19.73px; }
#p64-readmore2 { left:547.64px; top:801.84px; width:62.64px; height:19.73px; }
#p64-pagenum { left:24px; }

/* page64.css — local overrides for page 64.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page64.generated.css, so any rule here wins.

   Examples:

   #page64 {
     background-image: url('assets/backgrounds/page64.png');
   }

   #p64-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p64-t10,
#p64-t11 {
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 65 ---- */
#page65 { background-image: url('../assets/backgrounds/page65.webp'); }
#p65-photo1 { left:58.74px; top:309.15px; width:270.21px; height:202.99px; }
#p65-photo2 { left:354.80px; top:324.68px; width:296.36px; height:202.99px; }
#p65-readmore1 { left:238.75px; top:801.84px; width:62.64px; height:19.73px; }
#p65-readmore2 { left:547.64px; top:801.84px; width:62.64px; height:19.73px; }
#p65-pagenum { right:24px; }

/* page65.css — local overrides for page 65.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page65.generated.css, so any rule here wins.

   Examples:

   #page65 {
     background-image: url('assets/backgrounds/page65.png');
   }

   #p65-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 66 ---- */
#page66 { background-image: url('../assets/backgrounds/page66.webp'); }
#p66-photo1 { left:70.64px; top:312.23px; width:248.81px; height:332.23px; }
#p66-readmore1 { left:545.80px; top:632.52px; width:62.64px; height:19.73px; }
#p66-pagenum { left:24px; }

/* page66.css — local overrides for page 66.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page66.generated.css, so any rule here wins.

   Examples:

   #page66 {
     background-image: url('assets/backgrounds/page66.png');
   }

   #p66-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 67 ---- */
#page67 { background-image: url('../assets/backgrounds/page67.webp'); }
#p67-photo1 { left:69.50px; top:308.16px; width:261.49px; height:348.88px; }
#p67-readmore1 { left:545.80px; top:632.52px; width:62.64px; height:19.73px; }
#p67-pagenum { right:24px; }

/* page67.css — local overrides for page 67.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page67.generated.css, so any rule here wins.

   Examples:

   #page67 {
     background-image: url('assets/backgrounds/page67.png');
   }

   #p67-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 68 ---- */
#page68 { background-image: url('../assets/backgrounds/page68.webp'); }
#p68-photo1 { left:55.65px; top:264.42px; width:298.73px; height:223.60px; }
#p68-photo2 { left:367.63px; top:297.55px; width:308.24px; height:230.74px; }
#p68-readmore1 { left:238.75px; top:801.84px; width:62.64px; height:19.73px; }
#p68-readmore2 { left:547.64px; top:801.84px; width:62.64px; height:19.73px; }
#p68-pagenum { left:24px; }

/* page68.css — local overrides for page 68.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page68.generated.css, so any rule here wins.

   Examples:

   #page68 {
     background-image: url('assets/backgrounds/page68.png');
   }

   #p68-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 69 ---- */
#page69 { background-image: url('../assets/backgrounds/page69.webp'); }
#p69-photo1 { left:376.55px; top:319.43px; width:163.61px; height:225.75px; }
#p69-photo2 { left:62.57px; top:283.81px; width:317.95px; height:149.35px; }
#p69-readmore1 { left:238.75px; top:801.84px; width:62.64px; height:19.73px; }
#p69-readmore2 { left:547.64px; top:801.84px; width:62.64px; height:19.73px; }
#p69-pagenum { right:24px; }

/* page69.css — local overrides for page 69.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page69.generated.css, so any rule here wins.

   Examples:

   #page69 {
     background-image: url('assets/backgrounds/page69.png');
   }

   #p69-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p69-t4 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}

/* ---- page 70 ---- */
#page70 { background-image: url('../assets/backgrounds/page70.webp'); }
#p70-photo1 { left:59.12px; top:285.19px; width:298.50px; height:146.49px; }
#p70-photo2 { left:356.54px; top:250.32px; width:391.71px; height:184.25px; }
#p70-readmore1 { left:238.75px; top:801.84px; width:62.64px; height:19.73px; }
#p70-readmore2 { left:547.64px; top:801.84px; width:62.64px; height:19.73px; }
#p70-pagenum { left:24px; }

/* page70.css — local overrides for page 70.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page70.generated.css, so any rule here wins.

   Examples:

   #page70 {
     background-image: url('assets/backgrounds/page70.png');
   }

   #p70-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 71 ---- */
#page71 { background-image: url('../assets/backgrounds/page71.webp'); }
#p71-photo1 { left:58.74px; top:284.89px; width:270.21px; height:202.99px; }
#p71-photo2 { left:376.55px; top:313.33px; width:248.81px; height:246.60px; }
#p71-readmore1 { left:238.75px; top:801.84px; width:62.64px; height:19.73px; }
#p71-readmore2 { left:545.80px; top:801.84px; width:62.64px; height:19.73px; }
#p71-pagenum { right:24px; }

/* page71.css — local overrides for page 71.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page71.generated.css, so any rule here wins.

   Examples:

   #page71 {
     background-image: url('assets/backgrounds/page71.png');
   }

   #p71-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 72 ---- */
#page72 { background-image: url('../assets/backgrounds/page72.webp'); }
#p72-pagenum { left:24px; }

/* page72.css — local overrides for page 72.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page72.generated.css, so any rule here wins.

   Examples:

   #page72 {
     background-image: url('assets/backgrounds/page72.png');
   }

   #p72-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 73 ---- */
#page73 { background-image: url('../assets/backgrounds/page73.webp'); }
#p73-photo1 { left:338.21px; top:278.07px; width:302.83px; height:169.75px; }
#p73-photo2 { left:240.43px; top:633.60px; width:390.30px; height:169.75px; }
#p73-readmore1 { left:83.36px; top:386.62px; width:62.64px; height:19.73px; }
#p73-readmore2 { left:83.36px; top:792.62px; width:62.64px; height:19.73px; }
#p73-pagenum { right:24px; }

/* page73.css — local overrides for page 73.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page73.generated.css, so any rule here wins.

   Examples:

   #page73 {
     background-image: url('assets/backgrounds/page73.png');
   }

   #p73-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 74 ---- */
#page74 { background-image: url('../assets/backgrounds/page74.webp'); }
#p74-photo1 { left:356.11px; top:261.86px; width:269.70px; height:202.24px; }
#p74-photo2 { left:245.33px; top:629.73px; width:380.22px; height:138.89px; }
#p74-readmore1 { left:83.36px; top:386.62px; width:62.64px; height:19.73px; }
#p74-readmore2 { left:83.36px; top:792.62px; width:62.64px; height:19.73px; }
#p74-pagenum { left:24px; }

/* page74.css — local overrides for page 74.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page74.generated.css, so any rule here wins.

   Examples:

   #page74 {
     background-image: url('assets/backgrounds/page74.png');
   }

   #p74-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 75 ---- */
#page75 { background-image: url('../assets/backgrounds/page75.webp'); }
#p75-photo1 { left:315.46px; top:221.00px; width:323.77px; height:249.24px; }
#p75-photo2 { left:447.72px; top:533.94px; width:177.21px; height:236.21px; }
#p75-readmore1 { left:83.36px; top:386.62px; width:62.64px; height:19.73px; }
#p75-readmore2 { left:83.36px; top:749.12px; width:62.64px; height:19.73px; }
#p75-pagenum { right:24px; }

/* page75.css — local overrides for page 75.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page75.generated.css, so any rule here wins.

   Examples:

   #page75 {
     background-image: url('assets/backgrounds/page75.png');
   }

   #p75-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p75-t12,
#p75-t15 {
  width: auto;
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}

/* ---- page 76 ---- */
#page76 { background-image: url('../assets/backgrounds/page76.webp'); }
#p76-photo1 { left:302.69px; top:544.43px; width:354.51px; height:265.89px; }
#p76-photo2 { left:245.33px; top:272.03px; width:380.36px; height:182.35px; }
#p76-readmore1 { left:83.36px; top:469.56px; width:62.64px; height:19.73px; }
#p76-readmore2 { left:83.36px; top:738.08px; width:62.64px; height:19.73px; }
#p76-pagenum { left:24px; }

/* page76.css — local overrides for page 76.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page76.generated.css, so any rule here wins.

   Examples:

   #page76 {
     background-image: url('assets/backgrounds/page76.png');
   }

   #p76-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 77 ---- */
#page77 { background-image: url('../assets/backgrounds/page77.webp'); }
#p77-photo1 { left:356.11px; top:615.50px; width:269.70px; height:202.24px; }
#p77-photo2 { left:245.33px; top:271.57px; width:380.36px; height:183.67px; }
#p77-readmore1 { left:83.36px; top:412.09px; width:62.64px; height:19.73px; }
#p77-readmore2 { left:83.36px; top:739.22px; width:62.64px; height:19.73px; }
#p77-pagenum { right:24px; }

/* page77.css — local overrides for page 77.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page77.generated.css, so any rule here wins.

   Examples:

   #page77 {
     background-image: url('assets/backgrounds/page77.png');
   }

   #p77-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 78 ---- */
#page78 { background-image: url('../assets/backgrounds/page78.webp'); }
#p78-photo1 { left:312.90px; top:631.72px; width:326.02px; height:169.75px; }
#p78-photo2 { left:245.33px; top:277.99px; width:380.24px; height:151.26px; }
#p78-readmore1 { left:83.36px; top:439.36px; width:62.64px; height:19.73px; }
#p78-readmore2 { left:83.36px; top:738.08px; width:62.64px; height:19.73px; }
#p78-pagenum { left:24px; }

/* page78.css — local overrides for page 78.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page78.generated.css, so any rule here wins.

   Examples:

   #page78 {
     background-image: url('assets/backgrounds/page78.png');
   }

   #p78-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 79 ---- */
#page79 { background-image: url('../assets/backgrounds/page79.webp'); }
#p79-photo1 { left:355.10px; top:278.46px; width:292.23px; height:182.35px; }
#p79-readmore1 { left:83.36px; top:384.82px; width:62.64px; height:19.73px; }
#p79-readmore2 { left:83.36px; top:738.08px; width:62.64px; height:19.73px; }
#p79-pagenum { right:24px; }

/* page79.css — local overrides for page 79.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page79.generated.css, so any rule here wins.

   Examples:

   #page79 {
     background-image: url('assets/backgrounds/page79.png');
   }

   #p79-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 80 ---- */
#page80 { background-image: url('../assets/backgrounds/page80.webp'); }
#p80-pagenum { left:24px; }

/* page80.css — local overrides for page 80.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page80.generated.css, so any rule here wins.

   Examples:

   #page80 {
     background-image: url('assets/backgrounds/page80.png');
   }

   #p80-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 81 ---- */
#page81 { background-image: url('../assets/backgrounds/page81.webp'); }
#p81-link1 { left:70.74px; top:761.93px; width:73.25px; height:26.42px; }
#p81-photo1 { left:220.15px; top:487.63px; width:386.86px; height:257.76px; }
#p81-readmore1 { left:527.61px; top:452.18px; width:62.64px; height:19.73px; }
#p81-pagenum { right:24px; }

/* page81.css — local overrides for page 81.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page81.generated.css, so any rule here wins.

   Examples:

   #page81 {
     background-image: url('assets/backgrounds/page81.png');
   }

   #p81-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p81-t4,
#p81-t5,
#p81-t9,
#p81-t10,
#p81-t11 {
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 82 ---- */
#page82 { background-image: url('../assets/backgrounds/page82.webp'); }
#p82-photo1 { left:61.76px; top:562.27px; width:377.87px; height:219.50px; }
#p82-readmore1 { left:545.80px; top:452.18px; width:62.64px; height:19.73px; }
#p82-pagenum { left:24px; }

/* page82.css — local overrides for page 82.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page82.generated.css, so any rule here wins.

   Examples:

   #page82 {
     background-image: url('assets/backgrounds/page82.png');
   }

   #p82-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 83 ---- */
#page83 { background-image: url('../assets/backgrounds/page83.webp'); }
#p83-photo1 { left:262.79px; top:552.87px; width:414.71px; height:232.36px; }
#p83-readmore1 { left:545.80px; top:479.45px; width:62.64px; height:19.73px; }
#p83-pagenum { right:24px; }

/* page83.css — local overrides for page 83.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page83.generated.css, so any rule here wins.

   Examples:

   #page83 {
     background-image: url('assets/backgrounds/page83.png');
   }

   #p83-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 84 ---- */
#page84 { background-image: url('../assets/backgrounds/page84.webp'); }
#p84-photo1 { left:58.90px; top:560.25px; width:255.28px; height:244.09px; }
#p84-readmore1 { left:545.80px; top:506.72px; width:62.64px; height:19.73px; }
#p84-pagenum { left:24px; }

/* page84.css — local overrides for page 84.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page84.generated.css, so any rule here wins.

   Examples:

   #page84 {
     background-image: url('assets/backgrounds/page84.png');
   }

   #p84-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 85 ---- */
#page85 { background-image: url('../assets/backgrounds/page85.webp'); }
#p85-photo1 { left:200.50px; top:481.15px; width:434.41px; height:325.32px; }
#p85-readmore1 { left:545.80px; top:504.72px; width:62.64px; height:19.73px; }
#p85-pagenum { right:24px; }

/* page85.css — local overrides for page 85.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page85.generated.css, so any rule here wins.

   Examples:

   #page85 {
     background-image: url('assets/backgrounds/page85.png');
   }

   #p85-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p85-t11,
#p85-t12 {
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 86 ---- */
#page86 { background-image: url('../assets/backgrounds/page86.webp'); }
#p86-pagenum { left:24px; }

/* page86.css — local overrides for page 86.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page86.generated.css, so any rule here wins.

   Examples:

   #page86 {
     background-image: url('assets/backgrounds/page86.png');
   }

   #p86-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 87 ---- */
#page87 { background-image: url('../assets/backgrounds/page87.webp'); }
#p87-photo1 { left:70.74px; top:507.62px; width:362.90px; height:277.82px; }
#p87-readmore1 { left:440.96px; top:461.05px; width:62.64px; height:19.73px; }
#p87-pagenum { right:24px; }

/* page87.css — local overrides for page 87.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page87.generated.css, so any rule here wins.

   Examples:

   #page87 {
     background-image: url('assets/backgrounds/page87.png');
   }

   #p87-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 88 ---- */
#page88 { background-image: url('../assets/backgrounds/page88.webp'); }
#p88-photo1 { left:262.79px; top:513.07px; width:362.41px; height:272.47px; }
#p88-readmore1 { left:545.80px; top:490.24px; width:62.64px; height:19.73px; }
#p88-pagenum { left:24px; }

/* page88.css — local overrides for page 88.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page88.generated.css, so any rule here wins.

   Examples:

   #page88 {
     background-image: url('assets/backgrounds/page88.png');
   }

   #p88-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 89 ---- */
#page89 { background-image: url('../assets/backgrounds/page89.webp'); }
#p89-photo1 { left:70.74px; top:525.96px; width:362.41px; height:270.53px; }
#p89-readmore1 { left:440.96px; top:461.26px; width:62.64px; height:19.73px; }
#p89-pagenum { right:24px; }

/* page89.css — local overrides for page 89.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page89.generated.css, so any rule here wins.

   Examples:

   #page89 {
     background-image: url('assets/backgrounds/page89.png');
   }

   #p89-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p89-t5,
#p89-t6 {
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 90 ---- */
#page90 { background-image: url('../assets/backgrounds/page90.webp'); }
#p90-photo1 { left:70.74px; top:482.58px; width:328.61px; height:298.05px; }
#p90-readmore1 { left:545.80px; top:508.86px; width:62.64px; height:19.73px; }
#p90-pagenum { left:24px; }

/* page90.css — local overrides for page 90.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page90.generated.css, so any rule here wins.

   Examples:

   #page90 {
     background-image: url('assets/backgrounds/page90.png');
   }

   #p90-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/

#p90-t3,
#p90-t4 {
  text-align: left;
  text-align-last: left;
  text-justify: auto;
}


/* ---- page 91 ---- */
#page91 { background-image: url('../assets/backgrounds/page91.webp'); }
#p91-pagenum { right:24px; }

/* page91.css — local overrides for page 91.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page91.generated.css, so any rule here wins.

   Examples:

   #page91 {
     background-image: url('assets/backgrounds/page91.png');
   }

   #p91-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 92 ---- */
#page92 { background-image: url('../assets/backgrounds/page92.webp'); }
#p92-link1 { left:367.60px; top:355.91px; width:143.09px; height:26.42px; }
#p92-link2 { left:367.60px; top:580.91px; width:194.19px; height:26.42px; }
#p92-link3 { left:367.60px; top:805.91px; width:229.11px; height:26.42px; }
#p92-pagenum { left:24px; }

/* page92.css — local overrides for page 92.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page92.generated.css, so any rule here wins.

   Examples:

   #page92 {
     background-image: url('assets/backgrounds/page92.png');
   }

   #p92-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/


/* ---- page 93 ---- */
#page93 { background-image: url('../assets/backgrounds/page93.webp'); }
#p93-photo1 { left:69.33px; top:213.22px; width:381.52px; height:294.38px; }
#p93-photo2 { left:158.37px; top:303.26px; width:381.52px; height:294.38px; }
#p93-photo3 { left:243.61px; top:397.41px; width:381.52px; height:294.38px; }
#p93-pagenum { right:24px; }

/* page93.css — local overrides for page 93.
   This file is created once and is NEVER overwritten by generate.py,
   so it's safe to hand-edit. It loads AFTER style.css and
   page93.generated.css, so any rule here wins.

   Examples:

   #page93 {
     background-image: url('assets/backgrounds/page93.png');
   }

   #p93-t3 {
     left: 120px;
     top: 340px;
     font-size: 18px;
     color: #333333;
   }
*/