/* Page blocks own the copy. A single set of books travels between the scenes. */
/* Leather grain and recessed gold edging belong to the books themselves. */
body.wmi-screen-page #wmi-screen .service-book .service-face{
 background-image:linear-gradient(145deg,#68414a14,#3218200a),linear-gradient(#361a24b3,#361a24b3),url('../images/book-leather-v2.webp');
 background-size:100% 100%,100% 100%,cover;
 background-position:center;background-repeat:no-repeat;
 box-shadow:inset -1px -1px 2px #25101940,inset 1px 1px 1px #bea17b40;
 position:relative;
}
body.wmi-screen-page #wmi-screen .service-book .service-face::after{content:"";position:absolute;inset:12px 10px 12px 19px;border:1px solid #c2a47142;border-radius:3px;box-shadow:inset 0 0 0 3px #0f060620;pointer-events:none}
body.wmi-screen-page #wmi-screen .service-book .service-face h3,body.wmi-screen-page #wmi-screen .service-book .service-mark{text-shadow:0 1px #11070b,0 -1px #f5dfae22}
html.wmi-screen-root{overflow:hidden;overscroll-behavior:none}
body.wmi-screen-page{overflow:hidden;overscroll-behavior:none}
body.wmi-screen-page #wmi-screen .story-reader{display:contents}
body.wmi-screen-page{height:calc(100svh - var(--wmi-top,0px))}
body.wmi-screen-page #wmi-screen .scene[data-view="hero"] :is(.ritual .inner,.fine-circle,.floor-ring,.corner,.portal-far,.portal-middle){opacity:0}
body.wmi-screen-page #wmi-screen .scene[data-view="hero"] .portal-rim{opacity:.12}
body.wmi-screen-page[data-depth="enhanced"] #wmi-screen .scene[data-view] .portal-stack{opacity:1;transition:transform 1000ms var(--ease-in-out)}
body.wmi-screen-page #wmi-screen .scene:is([data-view="arcana"],[data-view="unreleased"],[data-view="cabinet"],[data-view="closing"]) :is(.floor-ring,.corner){opacity:0}
body.wmi-screen-page #wmi-screen .scene:is([data-view="arcana"],[data-view="unreleased"],[data-view="cabinet"],[data-view="closing"]) .portal-plane{opacity:.04}
body.wmi-screen-page #wmi-screen .scene:is([data-view="arcana"],[data-view="unreleased"],[data-view="cabinet"],[data-view="closing"]) .portal-rim{opacity:.14}
body.wmi-screen-page #wmi-screen .scene{--book-width:clamp(210px,23vw,300px);--book-gap:calc(var(--book-width) + 32px);--book-duration:1000ms}
body.wmi-screen-page #wmi-screen .hero-content .wmi-home-hero{text-align:center}
body.wmi-screen-page #wmi-screen .hero-tagline{margin:20px 0 0;font-size:clamp(14px,1.1vw,19px);letter-spacing:.3em;color:#e1c398;line-height:1.8}
body.wmi-screen-page #wmi-screen .scene .service-panel{top:28%;width:min(1000px,90vw);z-index:5;pointer-events:none}
body.wmi-screen-page #wmi-screen .service-panel h2{margin:14px 0;font-size:clamp(23px,2.3vw,36px)}
body.wmi-screen-page #wmi-screen .service-library{position:absolute;inset:0;z-index:4;pointer-events:none;transform-style:preserve-3d}
body.wmi-screen-page #wmi-screen .service-book{position:absolute;left:50%;top:57%;width:var(--book-width);--book-x:0px;--book-turn:0deg;opacity:0;transform:translate(calc(-50% + var(--book-x)),calc(-50% + 80svh)) rotateY(var(--book-turn));transform-style:preserve-3d;transition:transform var(--book-duration) var(--ease-in-out),opacity 550ms var(--ease-out)}
body.wmi-screen-page #wmi-screen .service-book[data-book="arcana"]{--book-x:calc(-1 * var(--book-gap));--book-turn:10deg}
body.wmi-screen-page #wmi-screen .service-book[data-book="cabinet"]{--book-x:var(--book-gap);--book-turn:-10deg}
body.wmi-screen-page #wmi-screen .scene .service-book .service-card{width:100%;min-height:310px;padding:0;transform:none;pointer-events:none}
body.wmi-screen-page #wmi-screen .service-book .service-face{padding:28px 20px;min-height:310px;justify-content:center}
body.wmi-screen-page #wmi-screen .service-face>.wp-block-group{width:100%;text-align:center}
body.wmi-screen-page #wmi-screen .service-face .service-mark{font-size:38px;color:#d5b977;margin:0 auto 18px;line-height:1;text-align:center}
body.wmi-screen-page #wmi-screen .service-face h3.service-english{margin:0 0 14px;color:#e7d4b1;font-size:22px;letter-spacing:.12em;line-height:1.5}
body.wmi-screen-page #wmi-screen .service-face .service-subtitle{font-family:inherit;font-size:22px;letter-spacing:.16em;color:#f0e0c8;margin:0 0 22px}
body.wmi-screen-page #wmi-screen .service-face .service-description{font-size:12px;line-height:1.9;color:#cdbab0;margin:0}
body.wmi-screen-page #wmi-screen .book-hit{position:absolute;inset:0;border-radius:5px;transform:translateZ(35px);pointer-events:none}
body.wmi-screen-page #wmi-screen .book-hit:focus-visible{outline:2px solid #f2d28a;outline-offset:9px}
body.wmi-screen-page #wmi-screen .scene[data-view="services"] .service-book{opacity:1;transform:translate(calc(-50% + var(--book-x)),-50%) rotateY(var(--book-turn)) rotateX(4deg)}
body.wmi-screen-page #wmi-screen .scene[data-view="services"] .book-hit{pointer-events:auto}
body.wmi-screen-page #wmi-screen .scene:is([data-view="arcana"],[data-view="unreleased"],[data-view="cabinet"]) .service-book{transform:translate(calc(-50% + var(--book-x) + 90vw),-50%) rotateY(-35deg);opacity:0}
body.wmi-screen-page #wmi-screen .scene .service-book[data-selected="true"]{transform:translate(calc(-50% - min(25vw,310px)),-50%) rotateY(8deg);opacity:1}
body.wmi-screen-page #wmi-screen .story-panel{position:absolute;z-index:5;left:calc(50% + 40px);top:52%;width:min(480px,42vw);max-height:calc(100svh - 230px);overflow:auto;overscroll-behavior:contain;scrollbar-width:none;opacity:0;pointer-events:none;transform:translate(70px,-50%);transition:transform 850ms var(--ease-out),opacity 550ms var(--ease-out);padding:14px 20px 20px 6px;touch-action:pan-y}
body.wmi-screen-page #wmi-screen .story-panel[aria-hidden="false"]{opacity:1;pointer-events:auto;transform:translate(0,-50%)}
body.wmi-screen-page #wmi-screen .story-panel .wp-block-group{margin:0;padding:0;max-width:none}
body.wmi-screen-page #wmi-screen .story-panel h2{font-size:clamp(30px,3vw,48px);letter-spacing:.13em;font-weight:500;margin:14px 0 22px;line-height:1.4;color:#f0dfc2}
body.wmi-screen-page #wmi-screen .story-panel h3{font-size:clamp(21px,1.8vw,28px);font-weight:500;letter-spacing:.15em;color:#dec494;margin:0 0 26px}
body.wmi-screen-page #wmi-screen .story-panel p{font-size:17px;line-height:2;color:#d5c0b6;margin:0 0 18px;letter-spacing:.05em}
body.wmi-screen-page #wmi-screen .story-panel p.chapter{font-size:10px;letter-spacing:.3em;color:#ccb17d}
body.wmi-screen-page #wmi-screen .story-panel a{color:#e7c789}
body.wmi-screen-page #wmi-screen .story-panel .wp-block-buttons{margin-top:30px}
body.wmi-screen-page #wmi-screen .story-panel .wp-block-button__link{background:transparent;border:1px solid #b8945766;border-radius:2px;color:#eed4a5;padding:14px 25px;font-size:15px;letter-spacing:.15em;text-decoration:none}
body.wmi-screen-page #wmi-screen .closing-panel{left:50%;width:min(780px,84vw);transform:translate(calc(-50% + 60px),-50%)}
body.wmi-screen-page #wmi-screen .closing-panel[aria-hidden="false"]{transform:translate(-50%,-50%)}
body.wmi-screen-page #wmi-screen .closing-panel h2{font-size:30px;margin:8px 0 14px}
body.wmi-screen-page #wmi-screen .closing-panel details{border-block-end:1px solid #c59b553a;padding:11px 0;margin:0}
body.wmi-screen-page #wmi-screen .closing-panel summary{font-size:16px;letter-spacing:.04em;cursor:pointer;line-height:1.7;color:#e8d5b5}
body.wmi-screen-page #wmi-screen .closing-panel details p{font-size:15px;line-height:1.75;margin:8px 0 0}
body.wmi-screen-page #wmi-screen .closing-panel .closing-tagline{margin:22px 0 10px;font-size:22px;line-height:1.5}
body.wmi-screen-page #wmi-screen .scene:is([data-view="arcana"],[data-view="unreleased"],[data-view="cabinet"]) .ritual{opacity:.4}
body.wmi-screen-page #wmi-screen .scene[data-view="closing"] .ritual{transform:translate(-50%,-50%) translateZ(-300px) rotateZ(155deg);opacity:.22}
body.wmi-screen-page #wmi-screen .scene[data-instant="true"] :is(.service-book,.story-panel){transition:none}
@media(hover:hover) and (pointer:fine){body.wmi-screen-page #wmi-screen .scene[data-view="services"] .service-book:hover .service-card{border-color:#e3c083;transition-duration:220ms}}
@media(max-width:900px){
 body.wmi-screen-page #wmi-screen .scene{--book-width:26vw;--book-gap:calc(var(--book-width) + 20px)}
 body.wmi-screen-page #wmi-screen .scene .service-book .service-card,body.wmi-screen-page #wmi-screen .service-book .service-face{min-height:280px}
 body.wmi-screen-page #wmi-screen .service-face h3.service-english,body.wmi-screen-page #wmi-screen .service-face .service-subtitle{font-size:18px}
}
@media(max-width:700px){
 /* Leave the narrow mobile cover clear of an inset frame behind its title. */
 body.wmi-screen-page #wmi-screen .service-book .service-face::after{display:none}
 body.wmi-screen-page #wmi-screen .scene{--book-width:27vw;--book-gap:calc(var(--book-width) + 12px)}
 body.wmi-screen-page #wmi-screen .scene .service-panel{top:29%;width:94vw}
 body.wmi-screen-page #wmi-screen .service-panel h2{font-size:22px;letter-spacing:.1em}
 body.wmi-screen-page #wmi-screen .service-book{top:56%}
 body.wmi-screen-page #wmi-screen .scene .service-book .service-card,body.wmi-screen-page #wmi-screen .service-book .service-face{min-height:210px}
 body.wmi-screen-page #wmi-screen .service-book .service-face{padding:18px 7px}
 body.wmi-screen-page #wmi-screen .service-face .service-mark{font-size:28px;margin-bottom:20px}
 body.wmi-screen-page #wmi-screen .service-face h3.service-english{font-size:15px;letter-spacing:.04em;overflow-wrap:normal}
 body.wmi-screen-page #wmi-screen .service-face .service-subtitle{font-size:14px;letter-spacing:.05em;margin-bottom:0}
 body.wmi-screen-page #wmi-screen .service-face .service-description{display:none}
 body.wmi-screen-page #wmi-screen .scene .service-book[data-selected="true"]{transform:translate(-50%,-50%) translateY(calc(-.56 * 100svh + 210px));opacity:1}
 body.wmi-screen-page #wmi-screen .story-panel{left:24px;right:24px;top:335px;width:auto;bottom:185px;max-height:none;padding:6px 4px 24px;transform:translateX(45px)}
 body.wmi-screen-page #wmi-screen .story-panel[aria-hidden="false"]{transform:translateX(0)}
 body.wmi-screen-page #wmi-screen .story-panel h2{font-size:28px;margin:10px 0 12px}
 body.wmi-screen-page #wmi-screen .story-panel h3{font-size:20px;margin-bottom:18px}
 body.wmi-screen-page #wmi-screen .story-panel p{font-size:16px;line-height:1.85}
 body.wmi-screen-page #wmi-screen .story-panel .wp-block-buttons{margin-top:20px}
 body.wmi-screen-page #wmi-screen .closing-panel{top:100px}
 body.wmi-screen-page #wmi-screen .hero-tagline{font-size:14px;letter-spacing:.15em}
 body.wmi-screen-page #wmi-screen .scene-footer{width:calc(100% - 24px);max-width:410px;gap:8px;bottom:110px;justify-content:center}
 body.wmi-screen-page #wmi-screen .scene-footer>button{width:32px;min-width:32px;height:36px}
 body.wmi-screen-page #wmi-screen .scene-dots{flex:1;justify-content:space-between;gap:3px}
 body.wmi-screen-page #wmi-screen .scene-dots button{width:30px;min-width:0;padding-inline:0}
}
@media(max-width:700px) and (max-height:700px){
 body.wmi-screen-page #wmi-screen .scene .service-book .service-card,body.wmi-screen-page #wmi-screen .service-book .service-face{min-height:150px}
 body.wmi-screen-page #wmi-screen .scene .service-book[data-selected="true"]{transform:translate(-50%,-50%) translateY(calc(-.56 * 100svh + 150px))}
 body.wmi-screen-page #wmi-screen .service-introduction{top:250px}
}
@media(max-height:650px){
 body.wmi-screen-page #wmi-screen .scene .service-book .service-card,body.wmi-screen-page #wmi-screen .service-book .service-face{min-height:190px}
 body.wmi-screen-page #wmi-screen .service-face .service-mark{font-size:25px;margin-bottom:8px}
 body.wmi-screen-page #wmi-screen .service-face .service-description{display:none}
 body.wmi-screen-page #wmi-screen .story-panel{max-height:calc(100svh - 155px)}
}
@media(prefers-reduced-motion:reduce){body.wmi-screen-page #wmi-screen .service-book,body.wmi-screen-page #wmi-screen .story-panel{transition:none!important}}

body.wmi-screen-page #wmi-screen .service-face .service-mark{width:100%;text-align:center}
/* One native mobile scroll surface contains the book and the entire page copy. */
@media(max-width:700px){
 body.wmi-screen-page #wmi-screen{position:fixed;inset:var(--wmi-top,0px) 0 0;height:auto;overflow:clip}
 body.wmi-screen-page #wmi-screen .scene{height:100%;min-height:0}
 body.wmi-screen-page #wmi-screen .wmi-screen-header{top:0}
 body.wmi-screen-page #wmi-screen .scene:is([data-view="arcana"],[data-view="unreleased"],[data-view="cabinet"],[data-view="closing"]) .story-reader{display:block;position:absolute;inset:80px 0 180px;z-index:5;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y pinch-zoom;scrollbar-width:none;overflow-anchor:none}
 body.wmi-screen-page #wmi-screen .story-reader .story-panel{position:relative;inset:auto;width:100%;height:auto;min-height:100%;max-height:none;overflow:visible;overscroll-behavior:auto;padding:255px 28px 30px;transform:none!important;transition:none;opacity:1}
 body.wmi-screen-page #wmi-screen .story-reader .story-panel[aria-hidden="true"]{display:none}
 body.wmi-screen-page #wmi-screen .story-reader .closing-panel{padding-top:20px}
 body.wmi-screen-page #wmi-screen .scene .story-reader .service-book[data-selected="true"]{top:24px;transform:translateX(-50%) rotateY(8deg)}
 body.wmi-screen-page #wmi-screen .scene:is([data-view="arcana"],[data-view="unreleased"],[data-view="cabinet"],[data-view="closing"]) .story-reader .service-library{overflow:clip}
 body.wmi-screen-page #wmi-screen .story-reader .story-scroll-content{perspective:none}
}
@media(max-width:700px) and (max-height:700px){
 body.wmi-screen-page #wmi-screen .scene .service-book .service-card,body.wmi-screen-page #wmi-screen .service-book .service-face{min-height:150px}
 body.wmi-screen-page #wmi-screen .scene .service-book[data-selected="true"]{transform:translate(-50%,-50%) translateY(calc(-.56 * 100svh + 170px))}
 body.wmi-screen-page #wmi-screen .story-reader .story-panel{padding-top:195px}
 body.wmi-screen-page #wmi-screen .story-reader .closing-panel{padding-top:20px}
}

/* Hide scrollbar chrome while retaining the single native reading surface. */
body.wmi-screen-page #wmi-screen :is(.story-panel,.story-reader)::-webkit-scrollbar{display:none;width:0;height:0}
body.wmi-screen-page #wmi-screen .closing-panel p.chapter{margin-bottom:8px}
body.wmi-screen-page #wmi-screen .closing-panel .closing-tagline+p{font-size:15px;line-height:1.7;margin-bottom:0}
body.wmi-screen-page #wmi-screen .closing-panel h2::after{margin-top:10px}
@media(max-width:700px){
 body.wmi-screen-page #wmi-screen .scene[data-view="closing"] .story-reader{bottom:162px}
 body.wmi-screen-page #wmi-screen .story-reader .closing-panel{padding:10px 24px 16px}
 body.wmi-screen-page #wmi-screen .closing-panel h2{font-size:27px;margin:6px 0 10px}
 body.wmi-screen-page #wmi-screen .closing-panel details{padding:10px 0}
 body.wmi-screen-page #wmi-screen .closing-panel summary{font-size:15px;line-height:1.65;letter-spacing:.02em}
 body.wmi-screen-page #wmi-screen .closing-panel .closing-tagline{font-size:20px;margin:18px 0 8px;letter-spacing:.1em}
}

/* The visible chapter book is also a full-cover native service link. */
body.wmi-screen-page #wmi-screen .scene .service-book[data-selected="true"] .book-hit{pointer-events:auto;cursor:pointer}
@media(max-width:700px){
 body.wmi-screen-page #wmi-screen .scene:is([data-view="arcana"],[data-view="unreleased"],[data-view="cabinet"]) .story-reader .service-library{z-index:6}
}
