/* Only authored Meowa PNGs are transformed here; typography describes the paid result. */
.divination-animation { position:absolute; inset:0; z-index:48; overflow:hidden; isolation:isolate; color:#f8e4bc; pointer-events:auto; }
/* The real stall remains underneath, preserving its independent room and table layers. */
.divination-heading { position:absolute; top:30px; left:262px; width:500px; padding:18px 26px; text-align:center; color:var(--ink); isolation:isolate; }
.divination-eyebrow { margin:0 0 7px; color:#7a6346; font-size:12px; letter-spacing:4px; }
.divination-heading h2 { margin:0; font-size:48px; font-weight:400; letter-spacing:3px; }
.divination-close,.divination-next { position:absolute; isolation:isolate; color:#f8e4bc; background:transparent; min-height:48px; padding:12px 25px; font-size:24px; }
.divination-close { right:27px; top:36px; min-width:130px; }
.divination-next { top:550px; left:50%; transform:translateX(-50%); min-width:270px; }
.divination-close:hover,.divination-next:hover:not(:disabled) { filter:brightness(1.1); }
.divination-next:disabled { opacity:.6; }
.divination-status { position:absolute; top:140px; left:145px; right:145px; text-align:center; font-size:24px; line-height:1.65; margin:0; min-height:56px; }
.divination-stage { position:absolute; top:202px; left:222px; width:580px; height:330px; }
.divination-stage img { position:absolute; display:block; image-rendering:pixelated; object-fit:contain; pointer-events:none; }
.is-yao .divination-stage { left:152px; width:530px; }
.divination-coin-tray { left:35px; top:132px; width:460px; height:196px; }
.divination-coin { position:absolute; top:190px; width:66px; height:66px; perspective:500px; }
.divination-coin-flip { position:absolute; inset:0; transform-style:preserve-3d; transform:scaleY(.72); }
/* Match the alpha-128 contours, leaving the original PNG bytes intact. Both faces have a 62px visible diameter. */
.divination-coin-face { width:66.34px; height:66.34px; left:-.01px; top:-.14px; backface-visibility:hidden; }
.divination-coin-face.is-back { width:69.08px; height:69.08px; left:-1.64px; top:-1.24px; transform-origin:50.1465% 49.5605%; transform:rotateY(180deg); }
.divination-lines-panel { position:absolute; left:716px; top:196px; width:196px; padding:14px 16px 12px; isolation:isolate; color:var(--ink); }
.divination-lines-title { margin:0 0 6px; font-size:12px; letter-spacing:2px; color:#7a6346; text-align:center; }
.divination-lines { display:flex; flex-direction:column-reverse; gap:2px; list-style:none; padding:0; margin:0; }
.divination-line { display:flex; align-items:center; gap:8px; min-height:36px; font-size:12px; opacity:.45; }
.divination-line[data-revealed=true] { opacity:1; }
.divination-line-order { width:33px; }
.divination-line-symbol { font-family:'Fusion Pixel',monospace; width:84px; font-size:24px; line-height:1; text-align:center; letter-spacing:-1px; color:#3b2618; white-space:pre; }
.divination-line-value { color:#943d2b; font-size:12px; }
/* Pendulum, all pixel art at 2x. The rail is fixed; the hook slides along it to the paid landing (JS offsets
   -182/0/+182 are the dial's three brass marks). The rig pivots at the hook's lower tip. */
.is-pendulum .divination-stage { top:204px; left:132px; width:760px; }
.is-pendulum .divination-status { top:150px; line-height:1.4; }
.divination-pendulum-dial { left:calc(50% - 256px); top:212px; width:512px; height:128px; }
.divination-pendulum-rail { left:calc(50% - 300px); top:0; width:600px; height:48px; }
.divination-pendulum-hook { left:calc(50% - 24px); top:2px; width:48px; height:64px; }
.divination-pendulum-support { position:absolute; inset:0; }
.divination-pendulum-rig { position:absolute; left:calc(50% - 28px); top:60px; width:56px; height:228px; transform-origin:50% 0; }
.divination-pendulum-chain { left:16px; top:0; width:24px; height:160px; object-fit:fill!important; }
.divination-pendulum-weight { left:0; top:156px; width:56px; height:72px; }
.divination-landing { position:absolute; top:334px; width:110px; transform:translateX(-50%); margin:0; text-align:center; color:#ead2aa; font-size:24px; line-height:1.45; opacity:.65; }
.divination-landing span { display:block; font-size:12px; }
.divination-landing[data-active=true] { color:#ffe1a0; opacity:1; font-weight:700; }
.is-pendulum .divination-next { top:604px; }
.divination-reading { position:absolute; left:198px; right:198px; top:550px; padding:18px 26px; isolation:isolate; color:var(--ink); }
.divination-reading p { white-space:pre-line; font-size:24px; line-height:1.7; margin:0; }
.is-pendulum .divination-reading { top:604px; padding:12px 25px; max-height:130px; overflow-y:auto; }
.is-pendulum .divination-reading p { font-size:24px; line-height:1.5; }
.divination-footnote { position:absolute; left:90px; right:90px; bottom:22px; text-align:center; margin:0; font-size:12px; color:#d5bd95; }
.divination-animation button:focus-visible { outline:2px solid #f5cd8f; outline-offset:4px; }
/* Hands on: hold the tray to shake the coins, drag the bob to pull the pendulum. */
.is-yao .divination-stage { cursor:grab; touch-action:none; }
.is-yao[data-phase="ready"] .divination-stage::after { content:''; position:absolute; inset:120px 20px 0; }
.divination-stage[data-shaking] { cursor:grabbing; }
.divination-stage[data-shaking] .divination-coin { animation:coin-shake .12s steps(2) infinite; }
.divination-stage[data-shaking] .divination-coin:nth-of-type(odd) { animation-duration:.1s; }
@keyframes coin-shake { 0% { transform:translate(-2px,-3px) rotate(-6deg); } 100% { transform:translate(2px,-1px) rotate(6deg); } }
.divination-pendulum-rig { cursor:grab; touch-action:none; }
.divination-stage.is-pulling .divination-pendulum-rig { cursor:grabbing; }
body.reduced-motion .divination-stage[data-shaking] .divination-coin { animation:none; }
