.odd-book{--ob-ink:#30372e;--ob-paper:#eeede6;box-sizing:border-box;background:var(--ob-paper);color:var(--ob-ink);padding:40px clamp(12px,4vw,64px);font-family:Arial,'Malgun Gothic',sans-serif;max-width:1600px;margin:0 auto}.odd-book *{box-sizing:border-box}.odd-book .ob-heading{display:flex;justify-content:space-between;align-items:end;margin:0 0 24px;gap:15px}.odd-book .ob-heading p,.odd-book .ob-heading>span{font-size:10px;letter-spacing:.16em;margin:0 0 10px}.odd-book .ob-heading h1{font-size:clamp(24px,3vw,38px);font-weight:400;margin:0}.odd-book .ob-stage{perspective:2200px;touch-action:pan-y;outline-offset:7px}.odd-book .ob-paper{position:relative;aspect-ratio:841.89/595.276;background:white;box-shadow:0 15px 40px #30372e26;isolation:isolate}.odd-book .ob-page{width:100%;height:100%;display:block;object-fit:contain;margin:0}.odd-book .ob-flip{position:absolute;inset:0;pointer-events:none;transform-style:preserve-3d;transform-origin:left center;z-index:2;display:none}.odd-book .ob-flip img{position:absolute;width:100%;height:100%;object-fit:contain;backface-visibility:hidden}.odd-book .ob-flip:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#d9d8d0,#fff 20%,#f7f6ef 85%,#b8baae);transform:rotateY(180deg);backface-visibility:hidden}.odd-book .ob-flip.forward{display:block;animation:ob-turn .68s cubic-bezier(.2,.6,.3,1) forwards}.odd-book .ob-flip.backward{display:block;animation:ob-return .68s cubic-bezier(.2,.6,.3,1) forwards}.odd-book .ob-controls{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:12px 0}.odd-book button{font:inherit;font-size:12px;border:1px solid #a6ac9b;padding:10px 13px;background:transparent;color:var(--ob-ink);border-radius:0;cursor:pointer;min-height:42px}.odd-book button:hover{background:#dce0d1}.odd-book button:disabled{opacity:.35;cursor:default}.odd-book button:focus-visible,.odd-book input:focus-visible{outline:2px solid #667356;outline-offset:3px}.odd-book .ob-jump{display:flex;align-items:center;gap:8px;margin:0;font-size:12px}.odd-book .ob-jump input{width:65px;padding:8px;border:1px solid #a6ac9b;background:#fff;color:var(--ob-ink);font:inherit}.odd-book .ob-hint,.odd-book .ob-status{text-align:center;font-size:12px;margin:12px 0;color:#656b60}.odd-book .ob-status{min-height:18px}.odd-book .ob-dialog{width:96vw;max-width:none;height:94vh;max-height:94vh;padding:55px 15px 20px;overflow:auto;border:0;background:#eeede6}.odd-book .ob-dialog::backdrop{background:#152013bf}.odd-book .ob-dialog img{display:block;width:1800px;max-width:none;height:auto;margin:auto}.odd-book .ob-close{position:fixed;right:4vw;top:5vh;background:#eeede6;z-index:10}.odd-book .ob-dialog p{font-size:12px;margin:0 0 12px}@keyframes ob-turn{from{transform:rotateY(0)}to{transform:rotateY(-180deg)}}@keyframes ob-return{from{transform:rotateY(-180deg)}to{transform:rotateY(0)}}@media(max-width:700px){.odd-book{padding:25px 12px}.odd-book .ob-heading>span{display:none}.odd-book .ob-controls{gap:6px}.odd-book button{padding:9px}.odd-book .ob-hint{font-size:11px}}@media(prefers-reduced-motion:reduce){.odd-book .ob-flip.forward,.odd-book .ob-flip.backward{animation:none;display:none}}

/* Fold the spread around its center spine. */
.odd-book .ob-paper:after{content:'';position:absolute;left:calc(50% - 10px);top:0;bottom:0;width:20px;background:linear-gradient(90deg,transparent,#26302317 45%,#26302330 50%,#fff2 55%,transparent);pointer-events:none;z-index:4}
.odd-book .ob-flip{inset:0 auto 0 50%;width:50%;height:100%;transform-origin:left center}
.odd-book .ob-flip:after{display:none}
.odd-book .ob-flip.forward{animation:ob-fold-next .9s cubic-bezier(.35,.1,.25,1) forwards}
.odd-book .ob-flip.backward{left:0;transform-origin:right center;animation:ob-fold-prev .9s cubic-bezier(.35,.1,.25,1) forwards}
.odd-book .ob-face,.odd-book .ob-static-half{position:absolute;top:0;height:100%;background-size:200% 100%;background-repeat:no-repeat;background-color:white}
.odd-book .ob-face{inset:0;width:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.odd-book .ob-front{background-position:right center;transform:translateZ(.2px)}
.odd-book .ob-back{background-position:left center;transform:rotateY(180deg) translateZ(.2px)}
.odd-book .backward .ob-front{background-position:left center}
.odd-book .backward .ob-back{background-position:right center}
.odd-book .ob-face:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#24301e30,transparent 25%,#fff1 65%,#24301e12);pointer-events:none}
.odd-book .ob-static-half{width:50%;z-index:1;pointer-events:none}
.odd-book .ob-static-half.left{left:0;background-position:left center}
.odd-book .ob-static-half.right{right:0;background-position:right center}
@keyframes ob-fold-next{from{transform:rotateY(0)}to{transform:rotateY(-180deg)}}
@keyframes ob-fold-prev{from{transform:rotateY(0)}to{transform:rotateY(180deg)}}
@media(prefers-reduced-motion:reduce){.odd-book .ob-flip.forward,.odd-book .ob-flip.backward{animation:none;display:none}}

/* Subtle center seam at rest. */
.odd-book .ob-paper:after{left:calc(50% - 3px);width:6px;background:linear-gradient(90deg,transparent,rgba(48,55,46,.025) 50%,transparent)}

/* Fade the moving sheet shading before it settles flat. */
.odd-book .ob-face:after{opacity:0;background:linear-gradient(90deg,rgba(36,48,30,.18),transparent 30%,rgba(255,255,255,.05) 65%,rgba(36,48,30,.07));animation:ob-soft-light .9s ease-in-out both}
.odd-book .ob-flip.forward{animation-timing-function:cubic-bezier(.33,.12,.2,1)}
.odd-book .ob-flip.backward{animation-timing-function:cubic-bezier(.33,.12,.2,1)}
@keyframes ob-soft-light{0%{opacity:0}30%{opacity:.85}55%{opacity:.7}75%{opacity:.25}90%{opacity:.04}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.odd-book .ob-face:after{animation:none}}

/* Compact top spacing, scoped to the portfolio book page. */
.odd-book{padding-top:8px!important}
.odd-book .ob-heading{margin-top:0;margin-bottom:14px}
.odd-book .ob-heading p,.odd-book .ob-heading>span{margin-bottom:0}
body:has(.odd-book) .site-content,body:has(.odd-book) .site-main,body:has(.odd-book) .inside-article,body:has(.odd-book) .entry-content{padding-top:0!important;margin-top:0!important}
.elementor .e-con:has(.odd-book),.elementor .e-con-inner:has(.odd-book),.elementor .elementor-section:has(.odd-book),.elementor .elementor-widget-wrap:has(.odd-book),.elementor .elementor-widget-shortcode:has(.odd-book){padding-top:0!important;margin-top:0!important;min-height:0!important;justify-content:flex-start!important}
@media(max-width:700px){.odd-book{padding-top:8px!important}}
 
.odd-book .ob-stage{cursor:pointer}.odd-book .ob-page{user-select:none;-webkit-user-drag:none}.odd-book .ob-controls{display:flex!important;flex-flow:row wrap!important;align-items:center!important;justify-content:center!important;gap:8px!important;width:100%}.odd-book .ob-controls>.ob-jump{display:inline-flex!important;width:auto!important;max-width:100%;flex:0 0 auto;margin:0!important;align-items:center;gap:8px}.odd-book .ob-controls button{width:auto!important;flex:0 0 auto;white-space:nowrap;margin:0!important}.odd-book .ob-controls>br,.odd-book .ob-jump>br{display:none}

.odd-book .ob-controls>p,.odd-book .ob-jump>p{display:contents!important}.odd-book .ob-controls>br,.odd-book .ob-jump>br,.odd-book .ob-controls>p>br,.odd-book .ob-jump>p>br{display:none!important}.odd-book .ob-controls{max-width:none!important}.odd-book .ob-controls .ob-jump{margin:0!important;flex:0 0 auto!important}

.odd-book .ob-controls button,.odd-book .ob-controls .ob-jump,.odd-book .ob-controls .ob-jump input{font-size:11px!important;line-height:1.25!important}
.odd-book .ob-controls button{min-height:36px;padding:6px 10px!important}
.odd-book .ob-controls .ob-jump input{width:52px;padding:6px!important}
@media(pointer:coarse){.odd-book .ob-controls button{min-height:44px}}