:root{--sea:#1596ad;--deep:#0b5870;--paper:#fffdf8;--ink:#173640;--muted:#53676c;--line:#cfe7ec;--warm:#fff6df;}
*{box-sizing:border-box} html,body{margin:0;background:linear-gradient(180deg,#eefbfe,#fffdf8 42%,#f8fbfb);color:var(--ink);font-family:"Noto Serif TC","PingFang TC","Microsoft JhengHei",serif;line-height:1.68}
button,a{font:inherit} a{color:var(--deep);text-decoration:none;cursor:pointer}
#reader{max-width:900px;margin:auto;min-height:100vh;padding-bottom:100px}
.page{max-width:780px;margin:auto;padding:42px 24px} .page p,.page li{line-height:1.68;margin:.72em 0}
h1{font-size:clamp(2rem,5vw,3.05rem);line-height:1.18;color:var(--deep);overflow-wrap:anywhere} h2{line-height:1.25}
img,video{max-width:100%;height:auto} .book-image{margin:1.3rem 0;text-align:center} .book-image img{width:100%;max-height:78vh;object-fit:contain;border-radius:10px}
.card,.note,.branch,.reader-panel{margin:16px 0;padding:18px 20px;border:1px solid var(--line);border-radius:16px;background:#fff} .note{background:var(--warm)}
.cover-v2{min-height:100vh;padding:54px 7vw;display:flex;align-items:flex-end;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.94)),url("https://med.bonbon.win/img/libro/cook/fish/5-360.jpg") center/cover no-repeat}
.cover-v2 h1{font-size:clamp(3.4rem,10vw,7rem);margin:.1em 0;line-height:1.05;color:#073f55} .cover-v2 p{font-size:1.2rem;max-width:38rem}
button{border:1px solid var(--line);background:white;color:var(--deep);padding:11px 16px;border-radius:12px;cursor:pointer;margin:5px} button.primary{background:var(--sea);color:white;border-color:var(--sea)}
.reader-top{position:sticky;top:0;z-index:20;background:rgba(244,252,253,.96);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px max(14px,calc((100vw - 820px)/2));font-size:17px}
.reader-top .chapter{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right;color:var(--muted)}
.reader-bottom{position:fixed;bottom:0;left:0;right:0;z-index:30;background:rgba(255,253,248,.97);border-top:1px solid var(--line);display:grid;grid-template-columns:1fr auto 1fr;gap:8px;padding:10px max(12px,calc((100vw - 820px)/2));box-shadow:0 -5px 20px rgba(0,0,0,.05)}
.reader-bottom button{margin:0;min-height:46px} .reader-bottom .next{background:var(--sea);color:white;border-color:var(--sea)}
.progress{height:3px;position:fixed;top:0;left:0;z-index:40;background:var(--sea);transition:width .2s}
.toc-v2{display:grid;gap:8px} .toc-v2 button{text-align:left;padding:15px 16px} .toc-tools{margin-top:22px}
.section-index,.toc{padding-left:0;list-style:none} .section-index li{margin:.5rem 0}
@media(max-width:600px){.page{padding:30px 18px 90px}.reader-top{font-size:16px}.reader-bottom{grid-template-columns:1fr 1fr}.reader-bottom .menu{display:none}}

/* V2R1 mobile reading */
:root{--reader-font:18px}
body{font-size:var(--reader-font);-webkit-text-size-adjust:100%}
.page{width:min(100%,780px);padding-left:clamp(16px,5vw,32px);padding-right:clamp(16px,5vw,32px)}
.page p,.page li{font-size:1em;line-height:1.68}
.reader-top{padding-top:max(10px,env(safe-area-inset-top));min-height:52px}
.font-tools{display:flex;gap:3px;flex:0 0 auto}.font-tools button{padding:6px 9px;margin:0;min-width:38px}
.reader-bottom{padding-bottom:max(10px,env(safe-area-inset-bottom))}
#reader{padding-bottom:calc(92px + env(safe-area-inset-bottom));width:100%}
.v2-landmark{padding-top:12vh}.v2-landmark .eyebrow{color:var(--muted);font-size:.9em;letter-spacing:.04em}
.jump-cards{display:grid;gap:10px;margin-top:24px}.jump-cards button{text-align:left;padding:15px}
.quick-find{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
@media(max-width:600px){
 :root{--reader-font:17px}
 body{overflow-x:hidden}.page{max-width:100%;padding-top:24px}
 h1{font-size:clamp(1.9rem,9vw,2.6rem)}
 .reader-top{display:grid;grid-template-columns:auto auto 1fr;gap:6px}
 .reader-top .chapter{font-size:.85em}
 .quick-find{grid-template-columns:1fr}
 .reader-bottom{padding-left:8px;padding-right:8px}
}

.book-position{font-family:"Microsoft JhengHei",sans-serif;font-size:.9em;font-weight:700;color:var(--deep);letter-spacing:.04em;margin-bottom:.55rem}
.page-pos{white-space:nowrap;font-family:"Microsoft JhengHei",sans-serif;font-size:.8em;color:var(--muted)}
.selection-three h2{margin-top:1.5em}
@media(max-width:600px){.reader-top{grid-template-columns:auto auto 1fr auto}.page-pos{font-size:.72em}}
.section-kicker{color:var(--deep);font-weight:700}.big-choices,.mini-toc,.recipe-list{display:grid;gap:9px;margin-top:18px}.big-choices button,.mini-toc button,.recipe-list button{text-align:left;padding:14px}.big-choices strong,.big-choices span{display:block}.big-choices span{color:var(--muted);margin-top:5px}.reader-bottom button:disabled{opacity:.35}.recipe-tools{position:sticky;top:58px;background:var(--bg);padding:10px 0;z-index:4}.recipe-tools input{width:100%;font:inherit;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:inherit}.recipe-jumps{display:flex;gap:6px;overflow:auto;margin-top:8px}.recipe-jumps button{white-space:nowrap}.recipe-category{scroll-margin-top:135px}.recipe-category h2{display:flex;justify-content:space-between}.recipe-category h2 small{font-size:.55em;color:var(--muted)}.recipe-entry{display:flex;justify-content:space-between;gap:12px}.recipe-entry small{color:var(--muted);white-space:nowrap}

/* Reader additions: do not alter the frozen passage bodies. */
html { scroll-padding-top: 68px; }
[hidden] { display: none !important; }
.page { overflow-wrap: anywhere; }
.page img { display: block; margin-inline: auto; }
.reader-top button:focus-visible,.reader-bottom button:focus-visible { outline: 3px solid #174b9b; }
@media(max-width:600px) {
  .reader-top { grid-template-columns: auto auto minmax(0,1fr) auto; }
  .reader-top .chapter { min-width:0; }
  #reader { min-width:0; }
}

/* Compact reader indexes are generated from the book manifest. */
.clean-index { max-width:850px; }
.clean-index h1 { margin: .2em 0 .35em; }
.clean-index section { margin: 1.8rem 0 2.4rem; }
.clean-index h2 { font-size:1.25rem; margin:0 0 .8rem; border-bottom:1px solid var(--line); padding-bottom:.5rem; }
.recipe-search { display:block; width:100%; max-width:32rem; padding:13px 16px; border:1px solid var(--line); border-radius:12px; font:inherit; }
.clean-index-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.clean-index-list button { display:grid; grid-template-columns:2.8em minmax(0,1fr); gap:.6rem; align-items:start; margin:0; width:100%; text-align:left; padding:12px 14px; min-height:54px; }
.index-number { color:var(--deep); font-family:"Microsoft JhengHei",sans-serif; font-size:.86em; font-weight:700; }
.index-title { min-width:0; line-height:1.35; }
.recipe-title { font-size:clamp(1.75rem,4.5vw,2.7rem); margin:.2em 0 .7em; }
.pmark:has(.book-image) { display:block; margin:1.1rem 0; }
@media(max-width:680px) { .clean-index-list { grid-template-columns:1fr; } .clean-index-list button { min-height:48px; } }

/* Book themes: chapter colors are data in manifest and applied by the reader. */
body { background:linear-gradient(180deg,var(--chapter-tint,#eefbfe),#fffdf8 44%,#fbfaf7); }
.reader-top { background:color-mix(in srgb,var(--chapter-tint,#eefbfe) 94%,white); }
.reader-bottom { border-top-color:var(--sea); }
.toc-v2 button { border-left:5px solid var(--sea); }
.toc-v2 button:nth-child(2) { border-left-color:#228b87; background:#f2faf6; }
.toc-v2 button:nth-child(3) { border-left-color:#b9794d; background:#fff7ee; }
.toc-v2 button:nth-child(4) { border-left-color:#356e9c; background:#f2f7ff; }
.toc-v2 button:nth-child(5) { border-left-color:#9479ac; background:#faf5fd; }
.toc-v2 button:nth-child(6) { border-left-color:#ad7775; background:#fff5f2; }
.toc-v2 button:nth-child(7) { border-left-color:#478875; background:#f3faef; }

/* Images load one at a time on the cover. The first image is the only eager request. */
.cover-v2 { isolation:isolate; position:relative; overflow:hidden; display:flex; flex-direction:column; align-items:stretch; justify-content:flex-end; gap:0; background:linear-gradient(135deg,#245f70,#7eb5b3); min-height:100svh; }
.cover-v2 > div:not(.cover-gallery) { position:relative; z-index:2; }
.cover-v2 > div:first-of-type:not(.cover-gallery) { margin-top:auto; }
.cover-gallery { position:absolute; inset:0; z-index:0; }
.cover-gallery::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255,255,255,.10) 6%,rgba(255,255,255,.68) 57%,rgba(255,253,248,.97) 100%); pointer-events:none; }
.cover-photo { position:absolute; width:100%; height:100%; inset:0; object-fit:cover; object-position:center; opacity:0; transition:opacity .8s ease; }
.cover-photo.active:not(.cover-error) { opacity:1; }
@media(max-width:600px) { .cover-v2 { min-height:100svh; padding:28px 18px calc(18px + env(safe-area-inset-bottom)); } .cover-v2 h1 { font-size:clamp(3rem,13vw,5rem); } }
@media(prefers-reduced-motion:reduce) { .cover-photo { transition:none; } }

.table-scroll{overflow-x:auto;max-width:100%}.table-scroll table{border-collapse:collapse;width:100%;font-size:.9em}.table-scroll th,.table-scroll td{padding:.65em;border:1px solid #ccd8d5;text-align:left}.book-image figcaption{font-size:.85em;color:#52645d;padding:.4em 0}

/* V3R29: optional market-to-table interaction prototype. */
.seafood-journey { max-width:680px; margin:1.5rem auto; }
.toc-interaction { margin:1.5rem 0 2rem; padding:20px 22px; border:1px solid var(--line); border-left:5px solid var(--sea); border-radius:16px; background:linear-gradient(120deg,#f1fbfc,#fff); }
.toc-interaction .interaction-label { margin:0 0 .35em; color:var(--deep); font-size:.82em; font-weight:700; letter-spacing:.08em; }
.toc-interaction h2 { margin:.1em 0 .35em; font-size:1.25em; }
.toc-interaction p { margin:.45em 0; }
.toc-interaction button { min-height:46px; margin:8px 0 0; }
.journey-step,.journey-results { margin:1rem 0; padding:1.1rem; border:1px solid var(--line); border-radius:16px; background:#fff; }
.journey-step h2,.journey-results h2 { margin:.1em 0 .4em; color:var(--deep); font-size:1.25em; }
.journey-choices,.journey-results { display:grid; gap:9px; }
.journey-choices button,.journey-result-link { margin:0; width:100%; text-align:left; padding:14px 16px; }
.journey-result-link strong,.journey-result-link span { display:block; }
.journey-result-link span { margin-top:.25em; color:var(--muted); }
.journey-progress { color:var(--deep); font-size:.85em; font-weight:700; margin:.3em 0; }
.journey-note { color:var(--muted); font-size:.9em; }
.journey-promo { margin-top:1.5rem; }


/* V3R21 reading polish: keep theme colors while meeting readable text contrast. */
button.primary,.reader-bottom .next { background:var(--deep);border-color:var(--deep);color:#fff; }
.editorial-draft { margin:.7rem 0 1rem;padding:.65rem .85rem;border-left:4px solid var(--deep);border-radius:8px;background:var(--warm);color:var(--deep);font-family:"Microsoft JhengHei",sans-serif;font-size:.88em;line-height:1.55; }
@media(max-width:600px) {
  .reader-bottom { grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:5px;padding-left:5px;padding-right:5px; }
  .reader-bottom .menu { display:block;font-size:.84em;padding-inline:5px; }
  .reader-bottom button { padding-inline:5px;font-size:.84em; }
}