/* Full-screen illustrated library with a short character speech bubble. */
body:has(.ritual-page) { background:#f6eee4; padding:0; }
body:has(.ritual-page) :is(.site-header,.site-footer,.mobile-nav) { display:none; }
body:has(.ritual-page) main { min-height:100svh; margin:0; padding:0; }
.page.ritual-page { position:relative; isolation:isolate; width:100%; max-width:none; height:100svh; min-height:100svh; margin:0; padding:0; overflow:clip; color:#493b35; background:#f6eee4; }
.progress-panel.ritual-panel { position:relative; display:block; width:100%; max-width:none; height:100svh; min-height:100svh; margin:0; padding:0; text-align:left; }
.ritual-stage-wrap { position:absolute; inset:0; min-width:0; overflow:hidden; }
.ritual-topbar { position:absolute; z-index:8; inset:0 0 auto; display:flex; align-items:center; gap:16px; min-height:86px; padding:calc(18px + env(safe-area-inset-top)) clamp(24px,5vw,80px) 14px; background:linear-gradient(#fff7ecd9,transparent); pointer-events:none; }
.ritual-topbar > * { pointer-events:auto; }
.ritual-brand { display:block; flex:none; }
.ritual-brand img { display:block; width:94px; height:auto; }
.ritual-scene-label { font-size:13px; color:#786352; letter-spacing:0; }
.ritual-motion { display:inline-flex; align-items:center; justify-content:center; flex:none; width:44px; height:44px; min-height:44px; margin:0 0 0 auto; padding:0; border:0; border-radius:50%; background:#fffcf5e8; color:#775b4c; box-shadow: none; }
.ritual-motion::before { content:''; width:9px; height:13px; border-right:3px solid currentColor; border-left:3px solid currentColor; }
.ritual-motion[aria-pressed=true]::before { width:0; height:0; margin-left:3px; border:7px solid transparent; border-left:10px solid currentColor; border-right:0; }
.ritual-motion:hover { background:var(--surface); color:#b04e3d; }
.ritual-guide-select { min-width:128px; max-width:180px; min-height:44px; padding:10px 30px 10px 16px; border:0; border-radius: 8px; background:#fffcf5ec; color:#654b3e; font-family:var(--sans); font-size:14px; font-weight:550; }
.ritual-guide-select option { background:var(--surface); color:#493b35; }
.ritual-dialogue { --dialogue-bottom:clamp(30px,15svh,160px); position:absolute; z-index:6; left:clamp(32px,8vw,130px); bottom:var(--dialogue-bottom); width:min(400px,37vw); max-height:calc(100svh - 100px - env(safe-area-inset-top) - var(--dialogue-bottom)); display:flex; flex-direction:column; }
.ritual-copy { position:relative; width:100%; min-height:0; max-height:none; flex:0 1 auto; margin:0; padding:25px 27px 23px; border:0; border-radius:30px 30px 9px 30px; background:#fffcf6f5; box-shadow: none; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#bc9e8566 transparent; }
.ritual-reader { margin:0 0 9px; color:#aa604c; font-size:14px; font-weight:600; line-height:1.5; letter-spacing:0; }
.ritual-panel h1.ritual-heading { margin:0; color:#493b35; font-family:var(--sans); font-size:clamp(24px,2.2vw,30px); font-weight:550; line-height:1.45; letter-spacing:-.025em; white-space:pre-line; text-wrap:pretty; }
.ritual-panel .progress-stage { min-height:0; margin:12px 0 0; padding:0; border:0; color:#715e53; font-size:14px; line-height:1.65; word-break:keep-all; overflow-wrap:anywhere; }
.ritual-panel .progress-elapsed { margin:8px 0 0; color:#887368; font-size: 13px; line-height:1.5; letter-spacing:0; font-variant-numeric:tabular-nums; }
.ritual-panel p.ritual-description { margin:14px 0 0; color:#85736a; font-size: 13px; line-height:1.65; }
.ritual-panel .inline-error { width:100%; margin:12px 0 0; padding:12px 14px; border:0; border-radius: 8px; background:#fbe5dd; color:#9a4435; font-size:13px; line-height:1.65; }
.ritual-actions { flex:none; display:flex; align-items:center; justify-content:flex-start; flex-wrap:wrap; gap:8px 16px; width:100%; margin:18px 0 0; padding:0 4px; }
.ritual-actions .primary-button { display:inline-flex; align-items:center; justify-content:center; gap:12px; width:auto; min-height:52px; padding:13px 23px; border:0; border-radius: 8px; background:#b94c3c; color:#fffaf5; font-family:var(--sans); font-size:15px; font-weight:650; box-shadow:0 4px 0 #873f2f12; }
.ritual-actions .primary-button::after { content:''; width:8px; height:8px; border-top:1.5px solid currentColor; border-right:1.5px solid currentColor; transform:rotate(45deg); }
.ritual-actions .primary-button:hover { background:#9c3d30; }
.ritual-actions .secondary-button { display:inline-flex; align-items:center; justify-content:center; width:auto; min-height:44px; padding:10px 5px; border:0; border-radius: 8px; background:transparent; color:#766358; font-family:var(--sans); font-size:13px; font-weight:500; box-shadow:none; }
.ritual-actions .secondary-button:hover { color:#a24c3c; background:#fff7ea80; }
.ritual-page :is(a,button,select):focus-visible,.ritual-copy:focus-visible { outline:2px solid #b94c3c; outline-offset:4px; }

/* One actor holds the same illustrated book from the shelf to the final spread. */
.divination-scene {
  --divination-accent: 218,178,115; --portrait-ratio: 3 / 4; --reading-travel: 0; --book-focus: 0; --paper-ink: 0;
  --figure-x: 67%; --figure-top: 8%; --figure-height: min(96svh, 1000px);
  position: absolute; isolation: isolate; inset: 0; overflow: hidden; background: #e7dbcb; pointer-events: none; contain: layout paint;
}
.book-room-camera { position: absolute; inset: -2%; transform: translateX(calc(var(--reading-travel) * -1%)) scale(calc(1.04 + var(--book-focus) * .11)); transform-origin: var(--figure-x) 50%; opacity: calc(1 - var(--book-focus) * .28); }
.divination-room-picture {position:absolute;inset:0;display:block;}
.divination-room-art {position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 50%;opacity:0;user-select:none;}
.divination-room-art[data-ready=true] {opacity:1;}
.book-actor {
  --portrait-ratio:3 / 4; --book-zoom:1; --book-shift-x:0px; --book-shift-y:0px; --paper-focus-x:50%; --paper-focus-y:68%;
  position:absolute;z-index:2;left:var(--figure-x);top:var(--figure-top);height:var(--figure-height);aspect-ratio:var(--portrait-ratio);
  transform:translateX(-50%) translateX(calc((1 - var(--reading-travel)) * -6%)) translate3d(calc(var(--book-focus) * var(--book-shift-x)),calc(var(--book-focus) * var(--book-shift-y)),0) scale(calc(1 + var(--book-focus) * (var(--book-zoom) - 1)));
  transform-origin:var(--paper-focus-x) var(--paper-focus-y);
}
.book-actor-light {position:absolute;inset:8% -10% 12%;background:radial-gradient(ellipse,rgba(var(--divination-accent),.13),transparent 67%);filter:blur(18px);}
.book-actor-breath {position:absolute;z-index:1;inset:0;animation:book-reader-breathe 8s ease-in-out infinite;transform-origin:50% 76%;}
.book-sprite-frame {position:absolute;inset:0;overflow:hidden;-webkit-mask-image:linear-gradient(#000 0 88%,transparent 100%);mask-image:linear-gradient(#000 0 88%,transparent 100%);opacity:0;}
.book-sprite {position:absolute;width:400%;height:200%;max-width:none;object-fit:fill;user-select:none;filter:brightness(1.03) saturate(.96);will-change:opacity;}
.divination-scene[data-image-ready=true] .book-sprite-frame {opacity:1;}
.divination-scene[data-phase=complete] .book-actor-breath {animation:none;}
.book-papers {position:absolute;inset:0;opacity:var(--paper-ink);}
.book-paper-pose {position:absolute;inset:0;opacity:0;mask-size:100% 100%;-webkit-mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;}
.book-paper {position:absolute;left:0;top:0;width:400px;height:500px;transform-origin:0 0;backface-visibility:hidden;overflow:hidden;}
/* Only transparent outlined ink lies over the original illustrated paper. */
.book-ink-plate {display:block;width:100%;height:100%;max-width:none;object-fit:fill;opacity:.78;mix-blend-mode:multiply;}
.book-papers {mix-blend-mode:multiply;}
.book-body-frame {position:absolute;inset:0;}
.book-static {position:absolute;z-index:0;inset:0;display:none;}
.divination-scene[data-fallback-ready=true] .book-static {display:block;}
.book-static-cover {position:absolute;left:2%;top:33%;width:96%;height:47%;border:3px solid #bfa46d;border-radius:5px;background:#1f3e42;box-shadow: none;}
.book-static-pages {position:absolute;display:flex;left:5%;right:5%;top:35%;height:42%;filter:drop-shadow(0 3px 1px #221d1677);}
.book-static-leaf {width:50%;height:100%;border:1px solid #cbb99b;background:linear-gradient(90deg,#f0e5ce,#fcf4e5 70%,#d6c7ac);clip-path:polygon(0 0,100% 5%,100% 100%,0 95%);}
.book-static-leaf + .book-static-leaf {background:linear-gradient(90deg,#d6c7ac,#fcf4e5 30%,#f0e5ce);clip-path:polygon(0 5%,100% 0,100% 95%,0 100%);}
.book-static-seam {position:absolute;left:50%;top:37%;height:40%;border-left:1px solid #9d87678c;}
.book-static-waiting {position:absolute;left:9%;right:9%;top:42%;margin:0;text-align:center;color:#92704a;font-size:18px;line-height:1.9;white-space:pre-line;}
.divination-scene[data-phase=complete] .book-static-waiting {display:none;}
.divination-scene[data-fallback-ready=true] .book-papers {z-index:3;}
.divination-foreground-mist {position:absolute;inset:60% -20% -8%;background:radial-gradient(ellipse at 25% 70%,#8f9c7c14,transparent 52%),radial-gradient(ellipse at 85% 74%,#b5aa7d14,transparent 50%);filter:blur(20px);opacity:.25;animation:book-mist 26s ease-in-out infinite;}
.divination-motes {position:absolute;z-index:3;inset:0;overflow:hidden;opacity:.45;}
.divination-mote {position:absolute;left:var(--mote-x);top:var(--mote-y);width:2px;height:2px;border-radius:50%;background:#f1d9a4;box-shadow: none;animation:book-drift var(--mote-duration) ease-in-out var(--mote-delay) infinite;}
.divination-vignette {position:absolute;z-index:4;inset:0;background:linear-gradient(90deg,#f6eee426,transparent 42%),linear-gradient(0deg,#f6eee455 0,#f6eee41a 12%,transparent 28%,transparent 86%,#fff3e61a 100%);}
.divination-scene[data-phase=complete] .divination-vignette {background:linear-gradient(90deg,#f6eee41a,transparent 42%),linear-gradient(0deg,#f6eee444 0,#f6eee414 13%,transparent 29%);}
.divination-scene[data-paused=true] *, .divination-scene[data-suspended=true] * {animation-play-state:paused !important;}
.divination-scene[data-phase=failed] {filter:saturate(.65);}
@keyframes book-reader-breathe {0%,100%{transform:translateY(0)}50%{transform:translateY(-1.5px)}}
@keyframes book-mist {0%,100%{transform:translateX(-2%)}50%{transform:translateX(2%)}}
@keyframes book-drift {0%,100%{transform:translate(0,5px);opacity:.1}40%{opacity:.7}85%{transform:translate(12px,-35px);opacity:.05}}


@media (max-width:1000px) and (min-width:701px) {
  .divination-scene {--figure-x:70%;--figure-top:12%;--figure-height:88svh;}
  .ritual-dialogue {left:32px;width:38vw;}.ritual-copy{padding:23px;}
}
@media (max-width:700px) {
  .ritual-topbar{gap:12px;min-height:74px;padding:calc(14px + env(safe-area-inset-top)) 20px 10px;}
  .ritual-brand img{width:76px;}.ritual-scene-label{font-size: 13px;}
  .ritual-guide-select{min-width:116px;max-width:155px;}
  .ritual-topbar:has(.ritual-guide-select) .ritual-scene-label{display:none;}
  .ritual-dialogue{left:20px;right:20px;--dialogue-bottom:calc(20px + env(safe-area-inset-bottom));width:auto;}
  .ritual-copy{padding:20px 23px 19px;border-radius:28px 28px 28px 8px;}
  .ritual-reader{margin-bottom:7px;font-size:13px;}
  .ritual-panel h1.ritual-heading{font-size:24px;line-height:1.4;font-weight:550;}
  .ritual-panel .progress-stage{font-size:14px;margin-top:10px;}
  .ritual-panel p.ritual-description{font-size: 13px;margin-top:10px;}
  .ritual-actions{margin-top:14px;gap:8px 16px;}
  .ritual-actions .primary-button{min-height:50px;font-size:14px;padding:12px 20px;}
  .ritual-actions .secondary-button{font-size: 13px;}
  .divination-scene{--figure-x:53%;--figure-top:12%;--figure-height:64svh;}
  .divination-room-art{object-position:50% 50%;}
  .divination-vignette,.divination-scene[data-phase=complete] .divination-vignette{background:linear-gradient(0deg,#f6eee466 0,#f6eee433 15%,#f6eee414 26%,transparent 40%,transparent 85%,#fff3e61a 100%);}
}
@media (max-width:700px) and (max-height:730px) {
  .ritual-dialogue{--dialogue-bottom:calc(14px + env(safe-area-inset-bottom));}
  .ritual-copy{padding:16px 20px;}.ritual-panel h1.ritual-heading{font-size:22px;}
  .ritual-panel p.ritual-description{margin-top:7px;}.ritual-actions{margin-top:11px;}
  .divination-scene{--figure-top:10%;--figure-height:61svh;}
}
@media (max-width:350px) {
  .ritual-topbar{padding-right:16px;padding-left:16px;gap:9px;}.ritual-brand img{width:64px;}.ritual-guide-select{min-width:110px;font-size:13px;}
  .ritual-dialogue{left:16px;right:16px;}.ritual-actions{gap:7px;}.ritual-actions .primary-button{padding:12px 16px;}
}
@media (max-height:550px) and (min-width:701px) {
  .ritual-dialogue{--dialogue-bottom:20px;}.ritual-copy{padding:18px 22px;}
  .ritual-panel h1.ritual-heading{font-size:23px;}.ritual-topbar{min-height:70px;padding-top:12px;}
  .divination-scene{--figure-height:94svh;--figure-top:8%;}
}
@media (prefers-reduced-motion:reduce) {
  .divination-scene *, .divination-scene *::before,.divination-scene *::after{animation:none !important;transition:none !important;}
  .book-actor-breath{transform:none;}.divination-mote{opacity:.25;}.ritual-motion{display:none;}
}