/* Tactile bindings and a quiet, legible reading surface. */
#storyShelfOverlay .sb-shelf-container {
  background: linear-gradient(rgba(42,37,32,.94),rgba(42,37,32,.96)),url('/images/ui/storybook-cloth-v1.webp') center/420px;
}
#storyShelfOverlay .shelf-header { padding-top:42px; }
#storyShelfOverlay .shelf-header::before {
  content:'';display:block;width:62px;height:22px;margin:0 auto 18px;
  background:url('/images/ui/storybook-endpaper-v1.webp') center/cover;
  border:1px solid rgba(200,168,124,.38);opacity:.8;
}
#storyShelfOverlay .shelf-grid { gap:26px 18px;padding:12px 24px 38px; }
#storyShelfOverlay .shelf-book.sb-bound-cover {
  appearance:none;text-align:left;font:inherit;align-self:start;
  aspect-ratio:auto;min-height:252px;padding:14px 12px 12px 18px;
  border:1px solid rgba(239,232,220,.3);border-radius:2px 5px 5px 2px;
  background:linear-gradient(90deg,rgba(50,39,24,.25),transparent 9%,rgba(255,255,255,.16) 11%,transparent 14%),url('/images/ui/storybook-cloth-v1.webp') center/270px,#d3c6af;
  box-shadow:2px 2px 0 #e8dfcd,4px 3px 0 #a99b83,7px 9px 15px rgba(0,0,0,.26);
}
#storyShelfOverlay .sb-bound-cover:nth-child(3n+2) { background-color:#e1dccf;background-blend-mode:normal,multiply; }
#storyShelfOverlay .sb-bound-cover:nth-child(3n) { background-color:#e2d5c2;background-blend-mode:normal,multiply; }
/* 【2026-10-30】圖庫（角色像、故事場景）全部是 4:3 橫幅，右邊約 40% 是刻意留給文字的空白紙。
   以前封面用 4:3 框＋contain 整張放，書架上每本書的右半都是一塊米白，看起來像圖沒載完。
   改成 4:5 直式框、cover 靠左裁：剛好留下整個畫面區（左 60%），只裁掉留白，不裁人物。 */
#storyShelfOverlay .sb-bound-cover .shelf-book-cover {
  display:block;width:100%;aspect-ratio:4/5;overflow:hidden;
  border:4px solid var(--surface-paper-deep, #ebe1d0);box-shadow:0 1px 2px rgba(45,35,24,.2);
  background:url('/images/ui/storybook-endpaper-v1.webp') center/cover;
}
#storyShelfOverlay .sb-bound-cover .shelf-book-cover img { display:block;width:100%;height:100%;object-fit:cover;object-position:left center; }
.sb-cover-fallback { display:grid;place-items:center;height:100%;color:#64533d;font-size:calc(24px * var(--user-font-scale)); }
.sb-cover-fallback[hidden] { display:none; }
#storyShelfOverlay .sb-bound-cover .shelf-book-copy { margin-top:12px;padding:10px 8px;gap:4px;background:rgba(245,240,230,.82);border:1px solid rgba(121,95,59,.22); }
#storyShelfOverlay .sb-bound-cover .shelf-book-title { font-size:calc(15px * var(--user-font-scale));line-height:1.65;color:#3a3530;overflow-wrap:anywhere; }
#storyShelfOverlay .sb-bound-cover .shelf-book-mark { color:#65543f;font-size:calc(10px * var(--user-font-scale)); }
#storyShelfOverlay .sb-bound-cover .shelf-book-date { color:#64533d;font-size:calc(10px * var(--user-font-scale));letter-spacing:.06em; }
#storyShelfOverlay .sb-bound-cover .shelf-book-brand { color:#64533d;font-size:calc(10px * var(--user-font-scale));letter-spacing:.04em;line-height:1.7; }

/* The shared paper also reaches newly generated pages, letters and the closing page. */
#storybookOverlay .sb-page {
  background:linear-gradient(90deg,rgba(121,95,59,.09),transparent 7%),linear-gradient(rgba(245,240,230,.66),rgba(245,240,230,.66)),url('/images/ui/handbook-book-v1.webp') center/560px;
}
#storybookOverlay .sb-page-image-wrap { background:var(--surface-paper-deep, #ebe1d0);border:6px solid var(--bg-cream, #f5f0e6);border-radius:0;box-shadow:0 1px 3px rgba(45,35,24,.16); }
#storybookOverlay .sb-page-image-wrap::after,#storybookOverlay .sb-page-image-wrap::before { display:none; }
#storybookOverlay .sb-page-image { object-fit:contain;opacity:1;animation:none; }
#storybookOverlay .sb-bookmark {
  border:0;border-radius:0;background:transparent url('/images/ui/storybook-ribbon-v1.webp') center/100% 100% no-repeat;
  width:32px;height:58px;color:#fff8e8;box-shadow:none;top:0;right:22px;padding:0 0 10px;
}
#storybookOverlay .sb-bookmark.sb-bookmarked { color:#fff8e8!important;filter:brightness(.82); }
#storybookOverlay .sb-story-text { font-size:calc(16px * var(--user-font-scale));line-height:2.05;color:#493e31;text-shadow:none; }
#storybookOverlay .sb-book-title { font-size:calc(24px * var(--user-font-scale));line-height:1.55;letter-spacing:.08em;color:#493e31; }

/* History reader: one scrollable text area, persistent navigation, no click-to-skip prose. */
#storybookOverlay .storybook-container.sb-bound-reader {
  display:flex;flex-direction:column;width:min(94vw,620px);height:min(92dvh,940px);max-height:none;
  overflow:hidden;border-radius:3px 8px 8px 3px;border:1px solid #b9aa90;
  box-shadow:3px 0 0 #d9cdb7,5px 0 0 #867860,0 16px 50px rgba(0,0,0,.3);
}
#storybookOverlay .sb-bound-reader::before,#storybookOverlay .sb-bound-reader::after { display:none; }
.sb-reader-bar { flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 12px;background:#ece2cd;border-bottom:1px solid rgba(121,95,59,.18);z-index:6; }
.sb-reader-bar button { min-height:44px;padding:6px 8px;border:0;background:transparent;color:#64533d;font:inherit;font-size:calc(12px * var(--user-font-scale));white-space:nowrap;cursor:pointer; }
.sb-reader-location { color:#7e6b51;font-size:calc(11px * var(--user-font-scale));font-variant-numeric:tabular-nums; }
#storybookOverlay .sb-bound-reader #sbPageArea { flex:1;min-height:0; }
#storybookOverlay .sb-bound-reader .sb-page { height:100%;max-height:none; }
#storybookOverlay .sb-bound-reader .sb-page-image-wrap { flex:0 0 auto;margin:20px 30px 0; }
#storybookOverlay .sb-bound-reader .sb-page-image { width:100%;height:min(27dvh,250px);max-height:none;aspect-ratio:auto; }
#storybookOverlay .sb-bound-reader .sb-page-text { padding:24px 30px 26px;margin:0;overscroll-behavior:contain; }
#storybookOverlay .sb-bound-reader .sb-page.sb-no-img .sb-page-text { display:block;min-height:0;padding:34px 30px; }
#storybookOverlay .sb-bound-reader .sb-chapter-label { margin-top:0;margin-bottom:16px;line-height:1.7; }
#storybookOverlay .sb-bound-reader .sb-story-anchor { margin:0 0 22px;padding-left:13px;border-left:1px solid rgba(121,95,59,.3);font-size:calc(12px * var(--user-font-scale));line-height:1.9;color:#7e6b51; }
#storybookOverlay .sb-bound-reader .sb-page-nav {
  display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:12px 20px 16px;
  background:#f0e7d5;border-top:1px solid rgba(121,95,59,.15);
}
#storybookOverlay .sb-bound-reader .sb-page-nav::before { display:none; }
#storybookOverlay .sb-bound-reader .sb-dots { display:none; }
#storybookOverlay .sb-bound-reader .sb-nav-meta { flex-wrap:wrap;gap:6px; }
#storybookOverlay .sb-bound-reader .sb-nav-actions { flex-wrap:wrap; }
#storybookOverlay .sb-bound-reader .sb-page-num { display:none; }
#storybookOverlay .sb-bound-reader .sb-nav-button,#storybookOverlay .sb-bound-reader .sb-share-btn { min-height:44px;font-size:calc(12px * var(--user-font-scale));padding:7px 8px;letter-spacing:0;white-space:nowrap; }
#storybookOverlay .sb-bound-reader .sb-recap-page::before {
  content:'';display:block;flex:0 0 20px;background:url('/images/ui/storybook-endpaper-v1.webp') center/cover;opacity:.65;
}
.sb-contents { position:fixed;inset:0;margin:auto;width:min(90vw,540px);max-height:84dvh;height:fit-content;overflow:auto;padding:0;border:1px solid #a99b83;border-radius:4px;background:#f5eee0;color:#493e31;box-shadow:0 18px 65px rgba(0,0,0,.35); }
.sb-contents::backdrop { background:rgba(25,22,18,.62);backdrop-filter:blur(4px); }
.sb-contents-head { position:relative;padding:28px 28px 24px;background:linear-gradient(rgba(245,240,230,.82),rgba(245,240,230,.88)),url('/images/ui/storybook-endpaper-v1.webp') center/cover; }
.sb-contents-head p { font-size:calc(12px * var(--user-font-scale));line-height:1.8;margin:0;color:#7e6b51; }
.sb-contents-head h2 { font:inherit;font-size:calc(23px * var(--user-font-scale));line-height:1.6;margin:12px 25px 12px 0;overflow-wrap:anywhere; }
.sb-contents-head button { position:absolute;right:8px;top:8px;min-width:44px;min-height:44px;border:0;background:transparent;font-size:calc(23px * var(--user-font-scale));color:#64533d;cursor:pointer; }
.sb-contents nav { padding:10px 18px 22px; }
.sb-contents nav button { display:grid;grid-template-columns:46px 1fr auto;align-items:center;gap:12px;width:100%;text-align:left;padding:14px 8px;border:0;border-bottom:1px solid rgba(121,95,59,.16);background:transparent;color:#64533d;font:inherit;font-size:calc(14px * var(--user-font-scale));line-height:1.7;cursor:pointer; }
.sb-contents nav button[aria-current] { background:rgba(184,152,96,.12);color:#493e31; }
.sb-contents nav img { width:46px;height:40px;object-fit:contain;background:#e6dcc8; }
.sb-contents-mark { display:grid;place-items:center;width:46px;height:40px;background:url('/images/ui/handbook-quote-v1.webp') center/cover; }
.sb-contents nav small { font-size:calc(11px * var(--user-font-scale));font-variant-numeric:tabular-nums; }
@media(max-width:360px) {
  #storyShelfOverlay .shelf-grid { gap:22px 14px;padding:12px 18px 32px; }
  #storyShelfOverlay .shelf-book.sb-bound-cover { padding:11px 9px 10px 15px;min-height:234px; }
  #storybookOverlay .sb-bound-reader .sb-page-image-wrap { margin:16px 22px 0; }
  #storybookOverlay .sb-bound-reader .sb-page-text,#storybookOverlay .sb-bound-reader .sb-page.sb-no-img .sb-page-text { padding-left:23px;padding-right:23px; }
  #storybookOverlay .sb-bound-reader .sb-page-nav { padding-left:10px;padding-right:10px;gap:5px; }
}
@media(prefers-reduced-motion:reduce) {
  #storybookOverlay *,#storyShelfOverlay * { animation:none!important;transition:none!important; }
}
@media(min-width:640px) {
  #storybookOverlay .sb-bound-reader .sb-page-image-wrap { width:340px;max-width:calc(100% - 60px);margin:20px auto 0; }
  #storybookOverlay .sb-bound-reader .sb-page-image { height:auto;aspect-ratio:4/3; }
}

/* Handbook objects open onto the same material they were made from. */
#hbExpandOverlay {
  background:linear-gradient(rgba(42,37,32,.87),rgba(42,37,32,.91)),url('/images/ui/storybook-cloth-v1.webp') center/420px!important;
  overscroll-behavior:contain;
}
#hbExpandOverlay>.hb-expand-wrap { padding:76px 20px calc(30px + env(safe-area-inset-bottom))!important; }
.hb-reading-back { position:fixed;left:18px;top:calc(12px + env(safe-area-inset-top));z-index:3;min-height:44px;padding:8px 14px;border:1px solid rgba(233,220,196,.25);border-radius:24px;background:rgba(42,37,32,.92);color:#e9dcc4;font-family:inherit;font-size:calc(12px * var(--user-font-scale));cursor:pointer; }
#hbExpandOverlay .hb-reading-sheet {
  --reading-paper:url('/images/ui/handbook-quote-v1.webp');
  position:relative;width:min(100%,440px);padding:35px 28px 30px;box-sizing:border-box;
  border:1px solid rgba(160,130,90,.26);border-radius:2px;
  background:linear-gradient(rgba(245,240,230,.52),rgba(245,240,230,.52)),var(--reading-paper) center/cover;
  box-shadow:0 2px 3px rgba(0,0,0,.13),0 14px 35px rgba(0,0,0,.18);color:#4f4233;
}
#hbExpandOverlay .hb-reading-sheet::before {
  content:'';position:absolute;top:-8px;left:calc(50% - 34px);width:68px;height:18px;
  background:url('/images/ui/handbook-tape-v1.webp') center/100% 210% no-repeat;transform:rotate(-3deg);opacity:.85;
}
#hbExpandOverlay .hb-reading-sheet>div { width:100%!important;max-width:none!important;padding:0!important;box-sizing:border-box; }
#hbExpandOverlay .hb-reading-sheet div[style*="color:"] { color:#4f4233!important; }
#hbExpandOverlay .hb-reading-sheet div[style*="font-size:calc(9px"],
#hbExpandOverlay .hb-reading-sheet div[style*="font-size:calc(10px"] { font-size:calc(11px * var(--user-font-scale))!important;color:#7a654a!important;letter-spacing:.16em!important; }
#hbExpandOverlay .hb-reading-sheet [style*="writing-mode"] { writing-mode:horizontal-tb!important;font-size:calc(25px * var(--user-font-scale))!important;line-height:1.9!important;letter-spacing:.12em!important; }
#hbExpandOverlay.hb-reading-slip .hb-reading-sheet { --reading-paper:url('/images/ui/handbook-slip-v1.webp');border:4px double rgba(178,136,99,.65); }
#hbExpandOverlay.hb-reading-note .hb-reading-sheet { --reading-paper:url('/images/ui/handbook-note-v1.webp'); }
#hbExpandOverlay.hb-reading-mag .hb-reading-sheet { --reading-paper:url('/images/ui/handbook-news-v1.webp'); }
#hbExpandOverlay.hb-reading-tonight .hb-reading-sheet { --reading-paper:url('/images/ui/handbook-index-v1.webp'); }
#hbExpandOverlay.hb-reading-fable .hb-reading-sheet { --reading-paper:url('/images/ui/handbook-book-v1.webp'); }
#hbExpandOverlay.hb-reading-polaroid .hb-reading-sheet,#hbExpandOverlay.hb-reading-memory .hb-reading-sheet { --reading-paper:url('/images/ui/handbook-photo-v1.webp'); }
#hbExpandOverlay.hb-reading-dark .hb-reading-sheet { background:#2a2520 url('/images/ui/handbook-dark-v1.webp') center/cover;border-color:rgba(200,168,124,.4); }
#hbExpandOverlay.hb-reading-dark .hb-reading-sheet div[style*="color:"] { color:#e6d4b7!important; }
#hbExpandOverlay.hb-reading-dark .hb-reading-sheet div[style*="font-size:calc(9px"] { color:#cbb48e!important; }
#hbExpandOverlay .hb-reading-photo,#hbExpandOverlay .hb-reading-plate { width:100%!important;max-width:100%!important;box-sizing:border-box;box-shadow:0 2px 6px rgba(57,43,26,.18)!important; }
#hbExpandOverlay .hb-reading-photo { background:#faf5e9 url('/images/ui/handbook-photo-v1.webp') center/cover!important;transform:rotate(-.6deg)!important; }
#hbExpandOverlay .hb-reading-photo img,#hbExpandOverlay .hb-reading-plate img { object-fit:contain!important; }
#hbExpandOverlay.hb-reading-letter .hb-reading-sheet { --reading-paper:url('/images/ui/handbook-envelope-v1.webp'); }
#hbExpandOverlay .hb-letter-sheet { padding:0!important;background:none!important;box-shadow:none!important;border:0!important;width:100%; }
#hbExpandOverlay .hb-reading-actions { margin-top:25px!important; }
#hbExpandOverlay .hb-reading-actions button { min-height:44px;font-size:calc(12px * var(--user-font-scale))!important;color:#e9dcc4!important;border-color:rgba(233,220,196,.35)!important; }
@media(max-width:360px){#hbExpandOverlay .hb-reading-sheet{padding:30px 22px 26px;}}
.hb-sticker-window-photo { padding:7px 7px 22px;background:var(--bg-cream, #f5f0e6) url('/images/ui/handbook-photo-v1.webp') center/cover;box-shadow:1px 3px 5px rgba(58,40,22,.15); }
.hb-sticker-photo-strip { padding:6px 6px 16px;background:#f4edde url('/images/ui/handbook-photo-v1.webp') center/cover;box-shadow:1px 3px 5px rgba(58,40,22,.15); }
.hb-sticker-photo-strip>img { margin-bottom:6px;aspect-ratio:4/3;object-fit:contain; }
.hb-sticker-glassine { opacity:.78; }

/* Saved letters and postcards share the room; each keeps its own paper. */
body #mirrorLetterOverlay,body #postcardOverlay {
  background:linear-gradient(rgba(42,37,32,.87),rgba(42,37,32,.91)),url('/images/ui/storybook-cloth-v1.webp') center/420px;
}
#mirrorLetterOverlay .letter-header-label,#mirrorLetterOverlay .letter-header-meta { color:#7a654a; }
#mirrorLetterOverlay .letter-container { background:linear-gradient(rgba(245,240,230,.58),rgba(245,240,230,.58)),#f5f0e6 url('/images/ui/letter-paper.webp') right bottom/auto 100% no-repeat; }
#mirrorLetterOverlay .letter-paper-left-edge { opacity:.3; }
#mirrorLetterOverlay .letter-paragraph { font-size:calc(16px * var(--user-font-scale));line-height:2.15; }
#postcardOverlay .postcard-front { padding:8px 8px 26px;background:#f5f0e6 url('/images/ui/handbook-photo-v1.webp') center/cover; }
#postcardOverlay .postcard-img { object-fit:contain; }
#postcardOverlay .postcard-back { background:#f5f0e6; }
#postcardOverlay .postcard-back::before { background-image:url('/images/ui/handbook-postcard-v1.webp');opacity:.4; }
#postcardOverlay .postcard-text,#postcardOverlay .postcard-note { color:#493e31; }

/* Calendar is an index beside the intact collage. */
.hb-view-switch { position:absolute;top:calc(12px + env(safe-area-inset-top));left:20px;z-index:99999;display:flex;padding:4px;gap:3px;border:1px solid rgba(200,168,124,.35);border-radius:28px;background:#2a2520; }
.hb-view-switch button { min-height:40px;padding:6px 22px;border:0;border-radius:24px;background:transparent;color:#e9dcc4;font:inherit;font-size:calc(12px * var(--user-font-scale));cursor:pointer; }
.hb-view-switch button[aria-pressed="true"] { background:#ebe1d0;color:#493e31; }
.hb-with-calendar .hb-view-switch { left:max(20px,calc((100vw - 420px)/2 + 20px)); }
.hb-with-calendar .hb-close,.hb-with-calendar .hb-sticker-toggle { right:max(16px,calc((100vw - 420px)/2 + 16px)); }
.hb-calendar-open .hb-view-switch { left:max(20px,calc((100vw - 740px)/2 + 24px)); }
.hb-calendar-open .hb-close { right:max(16px,calc((100vw - 740px)/2 + 16px)); }
.hb-with-calendar .hb-month-nav-btn,.hb-with-calendar .hb-month-dropdown { display:none; }
.hb-with-calendar .hb-edit-toggle { top:auto;bottom:24px;left:max(20px,calc((100vw - 420px)/2 + 20px));min-height:44px; }
.hb-with-calendar .hb-edit-hint { top:auto;bottom:78px; }
.hb-with-calendar .hb-ps[hidden],.hb-calendar-panel[hidden] { display:none!important; }
.hb-calendar-open .hb-edit-toggle,.hb-calendar-open .hb-edit-hint,.hb-calendar-open .hb-sticker-toggle { display:none; }
.hb-calendar-panel { position:absolute;inset:0;margin:0 auto;width:min(100%,740px);overflow-y:auto;overscroll-behavior:contain;padding:92px 24px 40px;box-sizing:border-box;background:linear-gradient(rgba(245,240,230,.88),rgba(245,240,230,.88)),url('/images/ui/handbook-paper-v1.webp') center/560px;color:#493e31;font-family:'Noto Serif TC',serif; }
.hb-calendar-panel * { box-sizing:border-box; }
.hb-calendar-heading { margin-bottom:30px; }
.hb-calendar-heading.has-art { display:grid;grid-template-columns:minmax(0,1fr) 108px;gap:18px;align-items:center; }
.hb-calendar-heading-copy { min-width:0; }
.hb-calendar-heading-copy>p:last-child { font-size:calc(13px * var(--user-font-scale));line-height:1.9;color:#7a654a;margin:10px 0 0; }
.hb-calendar-month-art { position:relative;margin:0 2px 0 0;padding:6px 6px 14px;background:#f5f0e6 url('/images/ui/handbook-photo-v1.webp') center/cover;border:1px solid rgba(121,95,59,.15);box-shadow:var(--shadow-paper);transform:rotate(2deg); }
.hb-calendar-month-art[hidden] { display:none; }
.hb-calendar-month-art img { display:block;width:100%;aspect-ratio:4/3;object-fit:contain; }
.hb-calendar-month-art figcaption { margin-top:7px;color:#7a654a;font-size:calc(9px * var(--user-font-scale));line-height:1.6;text-align:center;letter-spacing:.08em; }
.hb-calendar-month-art::before { content:'';position:absolute;top:-7px;left:22px;width:48px;height:14px;background:url('/images/ui/handbook-tape-v1.webp') center/100% 210% no-repeat;transform:rotate(-5deg); }
.hb-calendar-month-art::after { content:'';position:absolute;right:-12px;bottom:-16px;width:36px;height:57px;background:url('/images/ui/storybook-botanical-v1.webp') center/contain no-repeat;pointer-events:none; }
.hb-calendar-eyebrow { margin:0 0 12px;color:#7a654a;font-size:calc(11px * var(--user-font-scale));letter-spacing:.12em;line-height:1.8; }
.hb-calendar-heading h2 { margin:0 0 10px;font-size:calc(27px * var(--user-font-scale));font-weight:400;letter-spacing:.12em; }
.hb-calendar-heading>p:last-child,.hb-calendar-count,.hb-calendar-empty { font-size:calc(13px * var(--user-font-scale));line-height:1.9;color:#7a654a; }
.hb-calendar-month { padding:16px 0 22px;border-top:1px solid rgba(121,95,59,.25);border-bottom:1px solid rgba(121,95,59,.25); }
.hb-calendar-monthbar { display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:16px; }
.hb-calendar-monthbar h3,.hb-calendar-detail h3 { font-size:calc(18px * var(--user-font-scale));line-height:1.8;font-weight:400;margin:0; }
.hb-calendar-monthbar h3 { min-width:0; }
.hb-calendar-monthbar select { width:100%;max-width:100%;min-height:44px;border:0;background:transparent;color:#64533d;font:inherit;cursor:pointer; }
.hb-calendar-monthbar button { min-width:44px;min-height:44px;background:transparent;border:0;font-size:calc(25px * var(--user-font-scale));color:#7a654a;cursor:pointer; }
.hb-calendar-week,.hb-calendar-days { display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;text-align:center; }
.hb-calendar-week { margin-bottom:8px;font-size:calc(11px * var(--user-font-scale));line-height:2;color:#7a654a; }
.hb-calendar-days button { position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;min-height:52px;padding:4px 0;border:1px solid transparent;border-radius:8px;background:transparent;color:#64533d;font-family:'Klee One',serif;font-size:calc(16px * var(--user-font-scale));cursor:pointer; }
.hb-calendar-days button>span { position:relative;z-index:1;display:grid;place-items:center;width:32px;height:32px; }
.hb-calendar-days .has-content>span { color:#493e31;border-radius:50%;background:radial-gradient(ellipse at 28% 20%,rgba(255,255,255,.9),transparent 35%),radial-gradient(ellipse at 68% 78%,rgba(148,106,53,.38),transparent 64%),linear-gradient(135deg,rgba(242,220,174,.92),rgba(200,168,124,.6));box-shadow:inset 0 0 0 1px rgba(121,95,59,.3),inset -2px -3px 5px rgba(121,95,59,.18),0 2px 3px rgba(121,95,59,.13); }
.hb-calendar-days button>i { width:4px;height:4px;border-radius:50%;border:1px solid transparent; }
.hb-calendar-days .has-content>i { background:#7a654a; }
.hb-calendar-days .has-visit>i { border-color:#7a654a; }
.hb-calendar-days button[aria-current="date"] { border-color:#a99b83; }
.hb-calendar-days button[aria-pressed="true"] { background:rgba(200,168,124,.18);box-shadow:inset 0 0 0 1px rgba(121,95,59,.35); }
.hb-calendar-panel button:focus-visible,.hb-view-switch button:focus-visible { outline:2px solid #a99b83;outline-offset:2px; }
.hb-calendar-legend { display:flex;flex-wrap:wrap;gap:9px 16px;margin-top:18px;font-size:calc(10px * var(--user-font-scale));line-height:1.8;color:#7a654a; }
.hb-calendar-legend span { display:flex;align-items:center;gap:6px; }
.hb-calendar-legend i { display:inline-block;width:7px;height:7px;border:1px solid #7a654a;border-radius:50%; }
.hb-calendar-legend .has-content { background:#7a654a; }
.hb-calendar-summary { display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:8px;font-size:calc(12px * var(--user-font-scale));color:#7a654a; }
.hb-calendar-summary button { min-height:44px;padding:6px;background:none;border:0;color:#7a654a;font:inherit;cursor:pointer; }
.hb-calendar-footnote { font-size:calc(10px * var(--user-font-scale));line-height:1.8;color:#7a654a;margin:8px 0 0; }
.hb-calendar-detail { padding-top:28px; }
.hb-calendar-count { margin:8px 0 22px; }
.hb-calendar-entries { display:grid;gap:14px;list-style:none;padding:0;margin:0 0 18px; }
.hb-calendar-entries li { padding:18px 20px;border:1px solid rgba(121,95,59,.2);background:linear-gradient(rgba(245,240,230,.8),rgba(245,240,230,.8)),url('/images/ui/handbook-index-v1.webp') center/cover;box-shadow:var(--shadow-paper); }
.hb-calendar-entries li>span { color:#7a654a;font-size:calc(11px * var(--user-font-scale));letter-spacing:.12em; }
.hb-calendar-entries li>p { color:#493e31;font-size:calc(14px * var(--user-font-scale));line-height:2;margin:10px 0 0;white-space:pre-line;overflow-wrap:anywhere; }
.hb-calendar-entries li[data-kind="letter"] { background-image:linear-gradient(rgba(245,240,230,.8),rgba(245,240,230,.8)),url('/images/ui/handbook-envelope-v1.webp'); }
.hb-calendar-entries li[data-kind="journal"] { background-image:linear-gradient(rgba(245,240,230,.8),rgba(245,240,230,.8)),url('/images/ui/handbook-note-v1.webp'); }
.hb-calendar-entries li[data-kind="postcard"] { background-image:linear-gradient(rgba(245,240,230,.8),rgba(245,240,230,.8)),url('/images/ui/handbook-postcard-v1.webp'); }
.hb-calendar-entries li.has-image { display:grid;grid-template-columns:80px minmax(0,1fr);column-gap:16px;align-items:start; }
.hb-calendar-entries li>img { width:80px;height:68px;object-fit:contain;padding:4px;background:#f5f0e6;box-shadow:var(--shadow-paper);grid-row:1/3; }
.hb-calendar-entries li>img[hidden] { display:none; }
.hb-calendar-entry-link { display:block;grid-column:1/-1;justify-self:start;min-height:44px;padding:12px 0 0;margin-top:8px;border:0;border-top:1px solid rgba(121,95,59,.16);background:none;color:#7a654a;font:inherit;font-size:calc(11px * var(--user-font-scale));line-height:1.8;text-align:left;cursor:pointer; }
.hb-calendar-peek[hidden] { display:none!important; }
.hb-calendar-peek { display:none; }
.hb-calendar-read { display:block;margin:12px 0 0;min-height:44px;padding:10px 16px;border:1px solid rgba(121,95,59,.3);background:#ebe1d0;color:#64533d;font-family:inherit;font-size:calc(12px * var(--user-font-scale));line-height:1.8;cursor:pointer; }
@media(max-width:699px) {
  .hb-calendar-panel { padding-bottom:120px; }
  .hb-calendar-open .hb-calendar-peek { position:absolute;bottom:calc(16px + env(safe-area-inset-bottom));left:20px;right:20px;z-index:99999;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 18px;min-height:54px;border:1px solid rgba(200,168,124,.35);border-radius:6px;background:#2a2520;color:#e9dcc4;font-family:'Noto Serif TC',serif;font-size:calc(12px * var(--user-font-scale));line-height:1.8;text-align:left;box-shadow:0 4px 18px rgba(0,0,0,.18);cursor:pointer; }
  .hb-calendar-peek strong { font-weight:400;white-space:nowrap; }
}
@media(min-width:700px) { .hb-calendar-layout { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:start; }.hb-calendar-detail { padding-top:16px; }.hb-calendar-panel { padding-left:36px;padding-right:36px; } }
@media(max-width:340px) { .hb-calendar-panel { padding-left:16px;padding-right:16px; }.hb-view-switch button { padding-left:18px;padding-right:18px; } }

/* Distinct folios: a taped quotation, an archive of perspectives, a personal letter. */
#storybookOverlay .sb-recap-page .sb-page-text { display:block;min-height:0;padding:34px 28px 28px;background:transparent; }
#storybookOverlay .sb-recap-page .sb-chapter-label { display:block;text-align:left;font-size:calc(23px * var(--user-font-scale));line-height:1.65;letter-spacing:.12em;color:#493e31; }
#storybookOverlay .sb-recap-page .sb-chapter-label::after { content:'';display:block;width:38px;height:1px;margin:17px 0 24px;background:#a99b83; }
#storybookOverlay .sb-recap-label { color:#7a654a;font-size:calc(11px * var(--user-font-scale));line-height:1.9; }
#storybookOverlay .sb-recap-lead,#storybookOverlay .sb-recap-text { color:#493e31;font-size:calc(16px * var(--user-font-scale));line-height:2; }
#storybookOverlay .sb-recap-quote { position:relative;margin:14px 0 28px;padding:22px 20px 20px;background:#f5f0e6 url('/images/ui/handbook-quote-v1.webp') center/cover;border:1px solid rgba(121,95,59,.2);box-shadow:var(--shadow-paper);font-family:'Klee One',serif;font-size:calc(18px * var(--user-font-scale)); }
#storybookOverlay .sb-recap-quote::before { content:'';position:absolute;top:-8px;left:calc(50% - 28px);width:56px;height:16px;background:url('/images/ui/handbook-tape-v1.webp') center/100% 210% no-repeat;transform:rotate(-3deg); }
#storybookOverlay .sb-recap-list { padding:0;list-style:none;counter-reset:recap; }
#storybookOverlay .sb-recap-list li { position:relative;margin:0;padding:17px 0 17px 30px;border-top:1px solid rgba(121,95,59,.2);font-size:calc(15px * var(--user-font-scale));line-height:1.95;counter-increment:recap; }
#storybookOverlay .sb-recap-list li::before { content:counter(recap,decimal-leading-zero);position:absolute;left:0;top:20px;color:#7a654a;font-family:Georgia,serif;font-size:calc(12px * var(--user-font-scale)); }
#storybookOverlay .sb-recap-why { margin-top:8px;color:#7a654a;font-size:calc(13px * var(--user-font-scale));line-height:1.9; }
#storybookOverlay .sb-page-type-angles .sb-recap-row { margin:0 0 18px;padding:20px;border:1px solid rgba(121,95,59,.18);background:linear-gradient(rgba(245,240,230,.72),rgba(245,240,230,.72)),url('/images/ui/handbook-index-v1.webp') center/cover;box-shadow:var(--shadow-paper); }
#storybookOverlay .sb-page-type-angles .sb-recap-row:nth-of-type(2) { background-image:linear-gradient(rgba(245,240,230,.72),rgba(245,240,230,.72)),url('/images/ui/handbook-note-v1.webp'); }
#storybookOverlay .sb-page-type-angles .sb-recap-row:nth-of-type(3) { background-image:linear-gradient(rgba(245,240,230,.72),rgba(245,240,230,.72)),url('/images/ui/handbook-envelope-v1.webp'); }
#storybookOverlay .sb-page-type-letter { background:linear-gradient(rgba(245,240,230,.74),rgba(245,240,230,.74)),url('/images/ui/handbook-envelope-v1.webp') center/560px; }
#storybookOverlay .sb-page-type-letter .sb-letter-date { margin:0 0 30px;text-align:right;font-size:calc(12px * var(--user-font-scale));line-height:1.8;color:#7a654a; }
#storybookOverlay .sb-page-type-letter .sb-letter-para { margin-bottom:25px;line-height:2.15; }
#storybookOverlay .sb-page-type-letter .sb-epilogue-sign { text-align:right; }
#storybookOverlay .sb-page-type-letter .sb-page-text::after { content:'';display:block;width:76px;height:114px;margin:18px 0 0 auto;background:url('/images/ui/storybook-botanical-v1.webp') center/contain no-repeat; }
#handbookOverlay.hb-reading-story * { animation-play-state:paused!important; }
@media(max-width:340px) { .hb-calendar-heading.has-art { grid-template-columns:minmax(0,1fr) 86px;gap:14px; } }

/* A chapter's contents feels like the illustrated bookplate inside its cover. */
.sb-contents-head.has-art { display:grid;grid-template-columns:92px minmax(0,1fr);gap:22px;align-items:center;padding:40px 28px 28px; }
.sb-contents-heading { min-width:0; }
.sb-contents-heading h2 { margin-right:0; }
.sb-contents-cover { display:grid;place-items:center;position:relative;margin:0;width:92px;min-height:116px;padding:10px 7px 20px;border:1px solid rgba(121,95,59,.25);border-radius:1px 3px 3px 1px;background:linear-gradient(90deg,rgba(42,37,32,.16),transparent 12%),url('/images/ui/storybook-cloth-v1.webp') center/180px;box-shadow:2px 1px 0 var(--surface-paper-deep,#ebe1d0),4px 4px 9px rgba(0,0,0,.13); }
.sb-contents-cover[hidden] { display:none; }
.sb-contents-cover img { display:block;width:100%;height:78px;object-fit:contain;background:#f5f0e6;border:3px solid #ebe1d0; }
.sb-contents-cover::after { content:'';position:absolute;bottom:9px;width:24px;height:1px;background:#a99b83; }
.sb-contents nav button { border-left:2px solid transparent;padding-left:10px; }
.sb-contents nav button>span:not(.sb-contents-mark) { min-width:0;overflow-wrap:anywhere; }
.sb-contents nav button[aria-current] { border-left-color:#a99b83; }
.sb-contents nav button:focus-visible { outline:2px solid #a99b83;outline-offset:-2px; }
.sb-contents nav small { font-family:Georgia,serif;color:#7a654a; }
.sb-contents-mark { border:1px solid rgba(121,95,59,.2);box-shadow:var(--shadow-paper);font-family:'Klee One',serif;color:#7a654a;transform:rotate(-2deg); }
.sb-contents-mark-angles { background-image:url('/images/ui/handbook-index-v1.webp');transform:rotate(2deg); }
.sb-contents-mark-letter { background-image:url('/images/ui/handbook-envelope-v1.webp');transform:none; }
.sb-reader-bar { position:relative; }
.sb-reader-bar::after { content:'';position:absolute;left:0;bottom:-1px;width:var(--sb-reading-progress,0%);height:2px;background:#a99b83;pointer-events:none; }

/* Keep each opened object recognisable by its silhouette and small details. */
#hbExpandOverlay .hb-reading-sheet { overflow-wrap:anywhere; }
#hbExpandOverlay.hb-reading-slip .hb-reading-sheet { width:min(100%,350px);padding-top:42px;padding-bottom:38px; }
#hbExpandOverlay.hb-reading-slip .hb-reading-sheet::before { width:48px;left:calc(50% - 24px);transform:rotate(3deg); }
#hbExpandOverlay.hb-reading-note .hb-reading-sheet { border:0;border-left:1px solid rgba(121,95,59,.15);padding-bottom:42px;clip-path:polygon(0 -12px,100% -12px,100% calc(100% - 5px),94% 100%,88% calc(100% - 3px),80% 100%,73% calc(100% - 4px),66% 100%,59% calc(100% - 2px),51% 100%,44% calc(100% - 4px),36% 100%,29% calc(100% - 3px),21% 100%,14% calc(100% - 4px),7% 100%,0 calc(100% - 3px)); }
#hbExpandOverlay.hb-reading-mag .hb-reading-sheet { border-top:3px double #a99b83;border-bottom:3px double #a99b83; }
#hbExpandOverlay.hb-reading-polaroid .hb-reading-sheet,#hbExpandOverlay.hb-reading-memory .hb-reading-sheet { --reading-paper:url('/images/ui/handbook-glassine-v1.webp'); }
#hbExpandOverlay .hb-reading-photo { position:relative; }
#hbExpandOverlay .hb-reading-photo::before { content:'';position:absolute;top:-7px;left:calc(50% - 25px);width:50px;height:15px;background:url('/images/ui/handbook-teal-tape-v1.webp') center/100% 210% no-repeat;transform:rotate(4deg); }
#hbExpandOverlay.hb-reading-fable .hb-reading-sheet { border-left:4px double rgba(121,95,59,.3);padding-bottom:38px; }
#hbExpandOverlay.hb-reading-letter .hb-reading-sheet { padding-top:42px; }
#hbExpandOverlay.hb-reading-letter .hb-reading-sheet::after { content:'';display:block;width:54px;height:81px;margin:20px 0 0 auto;background:url('/images/ui/storybook-botanical-v1.webp') center/contain no-repeat; }
#hbExpandOverlay.hb-reading-dark .hb-reading-sheet { border:1px solid rgba(200,168,124,.4);outline:1px solid rgba(200,168,124,.2);outline-offset:-8px; }
@media(max-width:360px) {
  .sb-contents-head.has-art { grid-template-columns:70px minmax(0,1fr);gap:15px;padding:42px 20px 24px; }
  .sb-contents-cover { width:70px;min-height:94px;padding:8px 5px 17px; }
  .sb-contents-cover img { height:61px; }
  .sb-contents-heading h2 { font-size:calc(20px * var(--user-font-scale));letter-spacing:.03em; }
  .sb-contents nav { padding-left:12px;padding-right:12px; }
}

/* 【2026-10-30】書館與故事書跟手帳統一：同一本手帳紙（handbook-paper 橫線紙）、
   插圖像拍立得貼在紙上（紙膠帶＋微斜）、分類鈕是紙索引標籤、信用手帳的信封紙、日期手寫體。
   另修：插圖外框原本用 var(--bg-cream)，深色主題把它換成 #1a1816，每張圖都被黑框包住。
   插圖右邊約 40% 是留給文字的空白紙，改成 4:5 直式靠左裁，只裁掉留白。 */
#storyShelfOverlay .sb-shelf-container{background:repeating-linear-gradient(0deg,transparent,transparent 27px,rgba(160,140,110,.07) 27px,rgba(160,140,110,.07) 28px),linear-gradient(rgba(245,240,230,.64),rgba(245,240,230,.64)),url('/images/ui/handbook-paper-v1.webp') center top/420px 630px,#ebe1d0!important;color:#493e31!important;border-color:rgba(121,95,59,.22)!important;}
#storyShelfOverlay .sb-close{background:rgba(251,247,239,.9)!important;color:#64533d!important;border-color:rgba(121,95,59,.25)!important;}
#storyShelfOverlay .shelf-header::before{background:url('/images/ui/handbook-tape-v1.webp') center/100% 210% no-repeat!important;border:0!important;width:70px;height:20px;opacity:.85;transform:rotate(-3deg);}
#storyShelfOverlay .shelf-header-title{color:#493e31!important;}
#storyShelfOverlay .shelf-header-subtitle,#storyShelfOverlay .shelf-collection-note,#storyShelfOverlay .shelf-tab-region-head,#storyShelfOverlay .shelf-content-note{color:#7e6b51!important;}
#storyShelfOverlay .shelf-collection-overview,#storyShelfOverlay .shelf-collection-total{color:#64533d!important;}
#storyShelfOverlay .shelf-collection-total strong{color:#604b38!important;font-family:"Caveat","Klee One",cursive;font-size:1.5em;}
#storyShelfOverlay .shelf-tab-region{background:transparent!important;border-color:rgba(121,95,59,.16)!important;}
#storyShelfOverlay .shelf-content-kicker{color:#604b38!important;}
#storyShelfOverlay .sb-tab-btn{background:#f5eee0 url('/images/ui/handbook-index-v1.webp') center/cover!important;color:#64533d!important;border:1px solid rgba(121,95,59,.22)!important;border-radius:3px 3px 1px 1px!important;box-shadow:0 1px 2px rgba(58,40,22,.12)!important;}
#storyShelfOverlay .sb-tab-btn.sb-tab-active{background:#e9dcc2 url('/images/ui/handbook-slip-v1.webp') center/cover!important;color:#493e31!important;transform:translateY(-2px);box-shadow:0 3px 5px rgba(58,40,22,.16)!important;}
#storyShelfOverlay .sb-tab-count{background:rgba(121,95,59,.12)!important;color:#604b38!important;}
#storyShelfOverlay .sb-tab-icon{color:#8a6f4e!important;}
#storyShelfOverlay .sb-subtab-btn{background:transparent!important;color:#7e6b51!important;border:0!important;border-bottom:1px dashed rgba(121,95,59,.3)!important;border-radius:0!important;}
#storyShelfOverlay .sb-subtab-btn[aria-pressed="true"],#storyShelfOverlay .sb-subtab-btn.sb-subtab-active{color:#493e31!important;border-bottom:2px solid #8a6f4e!important;}
#storyShelfOverlay .shelf-letter-card{background:#e8d8ba url('/images/ui/handbook-envelope-v1.webp') center/100% 100%!important;border:0!important;box-shadow:1px 2px 5px rgba(58,40,22,.16)!important;}
#storyShelfOverlay .shelf-letter-card:nth-child(odd){transform:rotate(-.5deg);}
#storyShelfOverlay .shelf-letter-card:nth-child(even){transform:rotate(.4deg);}
#storyShelfOverlay .shelf-letter-title{color:#493e31!important;}
#storyShelfOverlay .shelf-letter-date{color:#604b38!important;font-family:"Caveat","Klee One",cursive;font-size:1.25em;}
#storyShelfOverlay .shelf-letter-preview{color:#5b4b39!important;}
/* 鏡像卡沿用手帳的深色卡（handbook-dark），卡內淺色字不用改 */
#storyShelfOverlay .collection-entry{background:#2a2520 url('/images/ui/handbook-dark-v1.webp') center/cover!important;border:1px solid rgba(200,168,124,.35)!important;box-shadow:1px 3px 6px rgba(58,40,22,.2)!important;}
#storyShelfOverlay .shelf-cards-wrap>div>div:first-child:not(.collection-entry){color:#8a6f4e!important;}
#storyShelfOverlay .shelf-empty{background:rgba(251,247,239,.55)!important;border:1px dashed rgba(121,95,59,.28)!important;}
#storyShelfOverlay .shelf-empty-mark{color:#a0855f!important;}
#storyShelfOverlay .shelf-empty-kicker{color:#604b38!important;}
#storyShelfOverlay .shelf-empty-copy{color:#6f5d47!important;}
#storyShelfOverlay .shelf-empty-action{background:#493e31!important;color:#f5eee0!important;border-color:#493e31!important;}

#storybookOverlay .storybook-container.sb-bound-reader{background:#ebe1d0;}
#storybookOverlay .sb-page{background:linear-gradient(90deg,rgba(121,95,59,.10),transparent 6%),linear-gradient(rgba(245,240,230,.64),rgba(245,240,230,.64)),url('/images/ui/handbook-paper-v1.webp') center/420px 630px,#ebe1d0!important;}
#storybookOverlay .sb-page-text{background:transparent!important;}
/* 橫線跟著行高（em），段落之間是空行，所以每一行都落在線上 */
#storybookOverlay .sb-story-text{background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(2.05em - 1px),rgba(160,140,110,.16) calc(2.05em - 1px),rgba(160,140,110,.16) 2.05em);}
.sb-reader-bar,#storybookOverlay .sb-bound-reader .sb-page-nav{background:rgba(235,225,208,.86)!important;}
#storybookOverlay .sb-chapter-label{font-family:"Caveat","Klee One",cursive;}
#storybookOverlay .sb-page-image-wrap{position:relative;align-self:center;width:auto!important;padding:8px 8px 26px;margin-left:auto!important;margin-right:auto!important;border:0!important;background:#fbf7ef url('/images/ui/handbook-photo-v1.webp') center/cover!important;box-shadow:1px 3px 6px rgba(58,40,22,.18)!important;transform:rotate(-1.2deg);overflow:visible!important;}
#storybookOverlay .sb-page-image-wrap::before{content:''!important;display:block!important;position:absolute;top:-9px;left:50%;width:62px;height:18px;margin-left:-31px;background:url('/images/ui/handbook-tape-v1.webp') center/100% 210% no-repeat;opacity:.85;transform:rotate(3deg);z-index:2;}
#storybookOverlay .sb-bound-reader .sb-page-image,#storybookOverlay .sb-page-image{display:block;height:min(27dvh,250px)!important;width:auto!important;aspect-ratio:4/5!important;object-fit:cover!important;object-position:left center!important;}
@media(prefers-reduced-motion:reduce){#storybookOverlay .sb-page-image-wrap,#storyShelfOverlay .shelf-letter-card,#storyShelfOverlay .sb-tab-btn.sb-tab-active{transform:none;}}