@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Literata:opsz,wght@7..72,400;7..72,500;7..72,600&display=swap');
:root{--ink:#1f2933;--muted:#657581;--line:#e6ebef;--blue:#286484;--pale:#eff7fb;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:var(--ink);font:14px/1.6 'DM Sans',Arial,sans-serif}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #66a9cf;outline-offset:3px}a{color:var(--blue)}.topbar{height:68px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,4vw,54px);position:sticky;top:0;background:#fffe;backdrop-filter:blur(10px);z-index:4;gap:16px}.wordmark{border:0;background:none;font-size:16px;font-weight:700;color:#263741;letter-spacing:-.5px;padding:9px 0;white-space:nowrap}.mark{color:#4c859f;margin-right:8px;font-size:21px;vertical-align:-2px}.edition{font-size:10px;letter-spacing:1.5px;color:#8c99a2;font-weight:700}.info{border:1px solid var(--line);color:#486578;background:#fff;border-radius:8px;padding:8px 12px;font-size:11px}.layout{max-width:1300px;margin:auto;display:grid;grid-template-columns:218px 1fr;min-height:calc(100vh - 68px)}.sidebar{border-right:1px solid var(--line);padding:36px 16px;position:sticky;top:68px;height:calc(100vh - 68px);display:flex;flex-direction:column;gap:4px}.sidebar-label{font-size:10px;color:#9aa7af;letter-spacing:1.8px;font-weight:700;margin:0 0 18px 16px}.nav{border:0;background:transparent;color:#647682;text-align:left;border-radius:8px;padding:13px 15px;font-size:13px;font-weight:600;min-height:44px}.nav span{display:inline-block;width:24px;font-size:20px;line-height:1;vertical-align:-2px}.nav.active{background:#edf6f9;color:#21607e}.nav:hover:not(.active){background:#f7f9fa}.sidebar-footer{margin:auto 8px 0;color:#9aabb4;font-size:11px;line-height:1.7}.bottom-nav{display:none}main{min-width:0}.page{max-width:805px;margin:auto;padding:49px 44px 100px}.kicker{color:#497d96;text-transform:uppercase;letter-spacing:1.8px;font-size:10px;font-weight:700}.page h1{font-family:Literata,Georgia,serif;font-weight:500;line-height:1.22;font-size:clamp(32px,4vw,48px);letter-spacing:-1.4px;margin:12px 0}.intro{color:#647783;font-size:14px;line-height:1.7;max-width:610px;margin:0 0 28px}.tools{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:11px 0;margin:30px 0 40px}.tools-left{font-size:11px;color:#72838c}.size-tools{display:flex;align-items:center;gap:5px}.size-tools button{border:1px solid var(--line);border-radius:7px;background:#fff;min-width:44px;min-height:44px;color:#365d71;font-weight:700}.size-tools button:hover{background:#eef7fa}.chapter{max-width:675px;margin:auto}.scripture{font-family:Literata,Georgia,serif;font-size:var(--reader-size,19px);line-height:1.93;font-weight:400;letter-spacing:-.12px;margin:0 0 11px;color:#202932}.verse-num{font:700 11px/1 'DM Sans',sans-serif;color:#8796a0;vertical-align:super;margin-right:8px;user-select:none}.note{border:0;border-left:2px solid #8fb7c9;background:#f2f8fb;color:#2f647f;padding:12px 16px;border-radius:0 6px 6px 0;display:block;text-align:left;width:100%;font-size:13px;line-height:1.55;margin:20px 0 26px}.note:hover{background:#e9f4fa}.note-label{display:block;font-size:10px;letter-spacing:1.1px;font-weight:700;text-transform:uppercase;color:#4a83a0;margin-bottom:2px}.note-arrow{float:right;padding-left:8px;color:#4a83a0}.chapter-footer{border-top:1px solid var(--line);padding-top:24px;margin-top:40px;display:flex;align-items:center;justify-content:space-between;gap:15px}.chapter-footer p{font-size:11px;color:#71808b;line-height:1.6;max-width:400px}.primary{background:#286484;color:#fff;border:0;border-radius:8px;padding:12px 17px;min-height:44px;font-size:12px;font-weight:700}.primary:hover{background:#1b526e}.ad{max-width:675px;margin:58px auto 0;border:1px dashed #dbe5ea;border-radius:8px;color:#8998a2;text-align:center;font-size:10px;letter-spacing:.4px;padding:14px}.ad strong{font-weight:600}.caption{color:#8898a2;font-size:11px;margin:18px 0;line-height:1.6}.panel{padding:26px;border:1px solid var(--line);border-radius:12px;background:#fff;margin-top:16px}.panel h2{font:500 25px/1.35 Literata,serif;letter-spacing:-.5px;margin:8px 0 13px}.panel p{color:#647783;font-size:13px;line-height:1.8}.tag{color:#336b85;background:#edf6fa;padding:5px 8px;border-radius:5px;font-size:10px;font-weight:700;display:inline-block}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}.tabset{display:flex;gap:6px;margin:18px 0}.tabset button{border:1px solid var(--line);border-radius:6px;background:#fff;min-height:44px;padding:8px 15px;color:#637b89;font-size:12px}.tabset button.active{background:#286484;color:#fff;border-color:#286484}.place-diagram{border:1px solid #dfeaf0;background:linear-gradient(125deg,#f7fbfd,#eaf3f7);height:220px;border-radius:8px;display:flex;align-items:center;justify-content:center;gap:16px;color:#32627b;font-weight:700}.place-diagram span{border:1px solid #b6d1dc;padding:10px;background:#fff;border-radius:6px}.place-diagram i{width:40px;border-top:2px dotted #95b5c5;transform:rotate(-14deg)}.list-row{padding:17px 0;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.list-row strong{font-size:13px}.list-row small{color:#84939c}.progress{background:#e9f0f4;height:7px;border-radius:6px;overflow:hidden}.progress i{height:100%;background:#5a9db9;display:block;transition:width .2s}.secondary{border:1px solid #bbd3df;color:#286484;background:#fff;border-radius:7px;padding:10px 13px;min-height:44px;font-weight:700;font-size:12px}.secondary:hover{background:#f2f8fb}#overlay{position:fixed;inset:0;background:#17293470;z-index:8}#overlay[hidden]{display:none}#drawer{position:fixed;right:0;top:0;width:min(480px,100vw);height:100dvh;overflow:auto;background:#fff;z-index:9;transform:translateX(105%);transition:transform .24s ease;box-shadow:-12px 0 45px #162d3b28;padding:38px 34px}#drawer.open{transform:translateX(0)}#closeDrawer{float:right;border:0;background:#edf4f7;border-radius:50%;width:40px;height:40px;color:#476778}#drawer h2{font:500 29px/1.3 Literata,Georgia,serif;margin:16px 0}#drawer p{color:#536a79;font-size:14px;line-height:1.75}.evidence{border-left:3px solid #93b9c9;padding:10px 13px;background:#f0f7fa;font-size:12px;color:#315f78;font-weight:600;margin:24px 0}.source{border-top:1px solid var(--line);padding:15px 0}.source a{font-size:12px}.disclosure{border-top:1px solid var(--line);margin-top:24px;padding-top:16px;color:#8a9aa4!important;font-size:11px!important}.footer-note{font-size:11px;color:#8799a3;margin:15px 0;line-height:1.6}@media(max-width:850px){.layout{grid-template-columns:1fr}.sidebar{display:none}.page{padding:34px 28px 116px}.bottom-nav{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:5;background:#fff;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom);height:calc(67px + env(safe-area-inset-bottom));justify-content:space-around}.bottom-nav .nav{text-align:center;display:flex;flex:1;align-items:center;justify-content:center;flex-direction:column;border-radius:0;font-size:10px;padding:4px;gap:1px}.bottom-nav .nav span{width:auto;font-size:21px}.bottom-nav .nav.active{border-top:2px solid #286484;background:#f5fafd}.topbar{height:59px;padding:0 19px}.edition{display:none}.info{padding:8px;font-size:10px}.two-col{grid-template-columns:1fr}.page h1{font-size:35px}.scripture{line-height:1.86}.chapter-footer{display:block}.chapter-footer .primary{margin-top:10px}#drawer{padding:28px 24px}}
@media(max-width:360px){.page{padding-left:20px;padding-right:20px}.wordmark{font-size:14px}.mark{font-size:17px}.tools{flex-wrap:wrap}.place-diagram{gap:7px}.place-diagram i{width:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}#drawer,.progress i{transition:none}}
/* Volume IV · a page designed to feel like an illustrated encyclopedia, not a faux manuscript. */
:root{--ink:#302c26;--muted:#6e675e;--line:#dcd0bb;--blue:#345e77;--pale:#f4f0e7;--white:#f7f0df}
body{background:#e6ddcc;color:var(--ink);font-family:Georgia,'Times New Roman',serif}
.topbar{background:#eee5d4ee;border-color:#c9bca5;box-shadow:0 2px 9px #4e422415;backdrop-filter:blur(8px)}
.wordmark{font:600 20px/1.2 Georgia,serif;color:#373025;letter-spacing:-.4px}.mark{color:#986b42}
.edition,.info,.sidebar-label,.nav,.sidebar-footer,.kicker,.intro,.tools,.note,.chapter-footer,.ad,.caption,.tag,.panel p,.secondary,.primary,.tabset,.source,.evidence,.disclosure,.list-row,.bottom-nav,.footer-note{font-family:'DM Sans',Arial,sans-serif}
.info,.size-tools button,.secondary,.tabset button{background:#f7f1e6;border-color:#d2c5af;color:#564d42}
.layout{max-width:1320px;background:#fbf7ed;box-shadow:0 0 35px #4f40201c;min-height:calc(100vh - 68px)}
.sidebar{background:#f0e8d9;border-color:#d8cab3}.sidebar-label{color:#806f57}.nav{color:#665b4a}.nav.active{background:#e5d8c1;color:#533e2d}.nav:hover:not(.active){background:#e9dfcc}
.page{background:radial-gradient(circle at 12% 16%,#b5a48616 0 1px,transparent 1.3px) 0 0/17px 19px,linear-gradient(90deg,#eee5d55e 0,#fbf7ed 4%,#fbf7ed 96%,#eee5d55e 100%);padding-top:50px;min-height:calc(100vh - 68px)}
.page:before{content:'❧  ·  ✦  ·  ❧';display:block;text-align:center;color:#ad8b64;font-size:17px;letter-spacing:10px;line-height:1;margin-bottom:24px}
.kicker{color:#916f4d}.page h1{font-family:Georgia,'Times New Roman',serif;color:#342a22;letter-spacing:-1.5px;font-size:clamp(37px,4vw,51px);font-weight:400}.intro{color:#756d61}.tools{border-color:#c9bca7;color:#716553}.tools-left{color:#80715d}.size-tools button{background:#f3eadc}
.chapter{max-width:660px}.scripture{font-family:Georgia,'Times New Roman',serif;color:#29251f;font-size:var(--reader-size,20px);line-height:1.85;letter-spacing:0}.verse-num{color:#947453}.chapter>.scripture:first-of-type:first-letter{float:left;color:#8d593c;font:500 3.1em/.77 Georgia,serif;padding:7px 7px 0 0}.chapter>.scripture:first-of-type{min-height:73px}
.note{background:#f1eee7;border:0;border-left:2px solid #537e91;border-radius:0;color:#355f75;margin:19px 0 28px;padding:11px 15px;box-shadow:none}.note:hover{background:#eae8e0}.note-label{color:#3b7288}.note-arrow{color:#5e8090}
.plate{margin:0 auto 33px;max-width:575px;text-align:center;padding:6px 6px 12px;background:#f4ead9;border:1px solid #c4b496;box-shadow:3px 4px 0 #d6c5a8}.plate img{display:block;width:100%;height:auto;max-height:290px;object-fit:contain;background:#f6efdf;mix-blend-mode:multiply;filter:sepia(.52) contrast(1.05)}.plate figcaption{font:11px/1.5 'DM Sans',Arial,sans-serif;color:#6d5c46;padding:9px 5px 0;text-align:left}.plate figcaption span{font-weight:700;letter-spacing:.7px;display:block;color:#74543b}.plate-mid{margin:32px auto 39px}.chapter-footer{border-color:#c9bca7}.ad{background:#f5eddf;border-color:#d5c7b2;color:#857866}.caption{color:#807361}
.panel{background:#fcf9f2;border-color:#d6c8b0;box-shadow:2px 3px 0 #e8dfd0}.panel h2{font-family:Georgia,serif;color:#3a3026}.panel p{color:#716a5f}.tag{background:#eee4d2;color:#765b3f}.tabset button.active,.primary{background:#6b5340;color:#fff;border-color:#6b5340}.primary:hover{background:#503e31}.progress{background:#e8ddca}.progress i{background:#916e4c}
.place-diagram{background:#eee3cf;border-color:#d3c2a3;color:#6b553d}.place-diagram span{background:#f7f0e3;border-color:#bbab91}.place-diagram i{border-color:#ad8d6a}
#drawer{background:#fbf7ed;color:#3b3024;box-shadow:-12px 0 40px #3529163d}#closeDrawer{background:#eee5d3;color:#5c4b3a}#drawer h2{font-family:Georgia,serif}.evidence{background:#e8e7df;border-color:#587a87;color:#355a6e}.source{border-color:#d7c9b3}
@media(max-width:850px){body{background:#fbf7ed}.topbar{height:58px}.layout{display:block}.page{padding-top:30px;padding-bottom:119px}.page:before{margin-bottom:16px}.bottom-nav{background:#f2e9da;border-color:#cfc0a7}.bottom-nav .nav.active{background:#e4d8c3;border-color:#816246}.wordmark{font-size:16px}.mark{font-size:18px}.plate{max-width:100%}.plate img{max-height:220px}.chapter>.scripture:first-of-type:first-letter{font-size:2.75em;padding-top:7px}.scripture{line-height:1.78}.note{padding:11px 13px}}
/* Reserve an actual standard banner well below the end of the chapter. */
.ad{width:min(320px,100%);min-height:100px;margin:58px auto 0;border:1px solid #c9bfae;background:#eee7d9;display:flex;align-items:flex-start;justify-content:flex-end;padding:5px 8px;color:#8a8174;text-transform:uppercase;letter-spacing:.6px;font-size:9px}.ad strong{font-weight:400}
.chapter>.scripture:first-of-type:first-letter{float:none;font:inherit;padding:0;color:inherit}.chapter>.scripture:first-of-type{min-height:0}.dropcap{float:left;color:#8d593c;font:500 3.2em/.74 Georgia,serif;padding:10px 7px 0 0}.plate{margin-top:29px}.plate-mid{margin-top:31px}@media(max-width:850px){.dropcap{font-size:2.8em;padding-top:9px}}
.chapter>.scripture:first-of-type .verse-num{float:left;margin:2px 5px 0 0;vertical-align:baseline}.chapter>.scripture:first-of-type .dropcap{padding-top:7px}
