/* ChatGypsy 1.4 — a viewport stage, not a scrolling conversation page. */
:root{color-scheme:dark;--bg:#0c080d;--cream:#f2e4d0;--muted:#c7b498;--gold:#ddbb81;--aqua:#96dde1;--serif:"Iowan Old Style","Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;--sans:system-ui,-apple-system,"Segoe UI",sans-serif;--stage-w:100vw;--stage-h:100dvh;--stage-top:0px;--stage-left:0px}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none;background:var(--bg);color:var(--cream);font-family:var(--sans)}
body{-webkit-text-size-adjust:100%;text-size-adjust:100%}button,a,textarea{-webkit-tap-highlight-color:transparent}button,textarea{font:inherit}button{color:inherit;background:none;border:0;cursor:pointer;touch-action:manipulation}a{color:inherit}button:disabled{cursor:wait}img{display:block;max-width:100%}p,h1,h2,h3,figure{margin:0}[hidden]{display:none!important}svg{display:block}
button:focus-visible,a:focus-visible{outline:2px solid var(--aqua);outline-offset:3px}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;clip-path:inset(50%)!important;overflow:hidden!important;white-space:nowrap!important;border:0!important}
.skip{position:fixed;left:12px;top:12px;z-index:60;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;background:var(--cream);color:var(--bg)}.skip:focus{clip-path:none;width:auto;height:auto;padding:12px}
.scene-shell{position:fixed;left:var(--stage-left);top:var(--stage-top);width:var(--stage-w);height:var(--stage-h);overflow:hidden}
.oracle-scene{position:absolute;inset:0;isolation:isolate;overflow:hidden;background:#110b10}
.scene-ambience{position:absolute;inset:-30px;background:linear-gradient(#09071066,#11070955),url("assets/scene-wide.webp") center/cover;filter:blur(18px);opacity:.52;pointer-events:none}
.tableau{position:absolute;inset:0;pointer-events:none}.artboard{position:absolute;width:max(var(--stage-w),calc(var(--stage-h)*1.77683));left:50%;top:50%;transform:translate(-50%,-50%);isolation:isolate}.scene-art{width:100%;height:auto;max-width:none}
.art-shade{position:absolute;inset:0;background:linear-gradient(#09060c55,transparent 32%,transparent 74%,#0c080d44);pointer-events:none}
.utility-rail{position:absolute;right:max(14px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));z-index:25;display:flex;gap:4px}
.icon-button{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border-radius:50%;color:var(--gold);background:#0c080d44}
.icon-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}.icon-button:hover{background:#211623bb}.icon-button[aria-pressed=true]{box-shadow:inset 0 0 0 1px #b3d7cf66}
.chat-panel,.reading-area,.response-content{position:absolute;inset:0;pointer-events:none}
.message-layer{position:absolute;z-index:10;left:50%;transform:translateX(-50%);top:7%;width:min(68%,1000px);height:27%;text-align:center;pointer-events:auto;isolation:isolate;display:flex;flex-direction:column;justify-content:center}
.message-layer:before{content:"";position:absolute;z-index:-1;inset:-18px -8%;background:radial-gradient(ellipse,#0c080dae,transparent 73%);pointer-events:none}
.voice-body{width:100%;min-height:0;overflow:hidden;flex:0 1 auto;padding:4px 5px;opacity:1;filter:none}
.smoke-message,.branch-prompt{font:clamp(24px,2.35vw,36px)/1.3 var(--serif);color:#f5e8d6;text-wrap:pretty;overflow-wrap:anywhere;outline:none;text-shadow:0 2px 12px #050409cc,0 0 18px #e6c18720;opacity:1;filter:none}
.branch-prompt{font-size:clamp(22px,1.75vw,28px);font-style:italic;color:#e0d0b9;margin-top:14px}.branch-prompt:first-child{margin-top:0}
.message-label{font:13px/1.5 var(--sans);letter-spacing:.15em;color:#dcbf94;margin-bottom:10px}.mode-name{font:12px/1.5 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#dbc094;margin-bottom:8px}
.formed-word,.departing-word{display:inline-block;white-space:pre;opacity:1;filter:none;transform:none}.word-gap{white-space:pre-wrap}
.voice-pager{display:flex;align-items:center;justify-content:center;flex:0 0 44px;gap:12px;font:13px var(--sans);color:#d7bf98}.voice-pager .icon-button{font-size:30px;line-height:1}.voice-pager button:disabled{opacity:.3;cursor:default}
.ink-dock{position:absolute;z-index:15;left:50%;transform:translateX(-50%);bottom:max(5%,env(safe-area-inset-bottom));width:min(52%,740px);pointer-events:auto;text-align:center;padding:9px 16px 8px;isolation:isolate}
.ink-dock:before{content:"";position:absolute;z-index:-1;inset:-12px -5%;pointer-events:none;background:radial-gradient(ellipse,#0b070ee8 22%,#0b070ebb 62%,transparent 76%)}
.writing-label{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:8px;font:16px/1.4 var(--serif);color:#dfcba9;cursor:text}.writing-label svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}.writing-label small{font:12px var(--sans);color:#bda98f}
.input-shell{position:relative;min-height:70px;padding:7px 54px 7px 12px;border:1px solid #c2a66c70;border-bottom-color:#cfb67c;background:linear-gradient(#09060c99,#1b101bbb);border-radius:13px;cursor:text;box-shadow:inset 0 -1px 0 #b5966238;transition:box-shadow .25s,border-color .25s}
.input-shell:hover{border-color:#d4b88499}.input-shell:focus-within{border-color:#ceb282;box-shadow:0 0 22px #d8ae6028,inset 0 -1px 0 #e3c58a5c}
#question,#reply,.question-mirror,.departing-text{font:clamp(20px,1.65vw,26px)/1.4 var(--serif);letter-spacing:normal;white-space:pre-wrap;overflow-wrap:break-word;text-align:left;tab-size:4;word-spacing:normal;padding:0}
#question,#reply{display:block;width:100%;height:58px;background:transparent;resize:none;border:0;color:transparent;caret-color:transparent;outline:none;overflow:auto;scrollbar-width:thin}
#question::placeholder,#reply::placeholder{color:#ceba9e;opacity:1;font-style:italic}#question::selection,#reply::selection{background:#9abcd355;color:transparent}
.mirror-window{position:absolute;inset:7px 54px 7px 12px;overflow:hidden;pointer-events:none}.question-mirror{color:var(--cream);min-height:100%}.fresh-letter{animation:ink-arrive .26s ease-out both}
.native-input .mirror-window{visibility:hidden}.native-input #question,.native-input #reply{color:var(--cream);caret-color:transparent}.caret-visible #question,.caret-visible #reply{caret-color:var(--gold)}
.send-button{position:absolute;right:5px;bottom:10px;border:1px solid #c3a26955;background:#17101abb}
.departing-text{position:absolute;left:12px;right:54px;top:7px;z-index:21;max-height:100%;color:var(--cream);pointer-events:none;text-shadow:0 0 14px #9fe6ef55;transform-origin:50% 0}
.input-shell.sending .mirror-window,.input-shell.sending textarea{visibility:hidden}.input-shell.sending{overflow:visible}.input-shell.sending .send-button{opacity:.3}
.panel-actions{display:flex;align-items:center;justify-content:center;gap:5px;margin-top:4px}
.ghost-button,.choice{min-height:44px;padding:8px 12px;color:#ddc6a1;font:14px/1.35 var(--sans);overflow-wrap:anywhere}
.ghost-button:hover{color:#fff3df}.help-button{margin-right:auto;padding-left:2px;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#c2a26470}
.done-panel{padding:4px 0 8px}.closing-line{font:italic clamp(20px,1.6vw,24px)/1.4 var(--serif);color:#e4d1b4}.done-panel~.panel-actions{justify-content:center}
.smoke-wisps{position:absolute;inset:-20px -6%;z-index:-1;overflow:hidden;pointer-events:none}.smoke-wisps i{position:absolute;left:0;top:10%;width:52%;height:100px;border-radius:50%;background:radial-gradient(ellipse,#c1e5e037,transparent 67%);filter:blur(9px);opacity:0}.smoke-wisps i:nth-child(2){left:40%;top:40%;width:60%}.smoke-wisps i:nth-child(3){left:24%;top:65%;width:35%}.smoking .smoke-wisps i{animation:smoke-trail 1.8s ease-out both}.smoking .smoke-wisps i:nth-child(2){animation-delay:.13s}.smoking .smoke-wisps i:nth-child(3){animation-delay:.26s}
.card-stage{position:absolute;z-index:12;left:50%;top:51%;transform:translate(-50%,-50%);display:flex;justify-content:center;gap:24px;perspective:1100px;pointer-events:auto}
.drawn-card{width:clamp(105px,10.5vw,172px);flex:0 0 auto;padding:0 0 5px;text-align:center;border-radius:9px;position:relative;outline-offset:5px}
.drawn-card img{width:100%;height:auto;aspect-ratio:180/310;border-radius:8px;box-shadow:0 16px 40px #000a,0 0 0 1px #ccab7155;background:#18121d}
.drawn-card .card-name{display:block;font:17px/1.3 var(--serif);color:#f4e2c5;margin-top:5px;text-shadow:0 1px 8px #000}
.drawn-card .card-slot{display:block;font:12px/1.2 var(--sans);letter-spacing:.1em;color:#d4b383;margin:0 0 7px}
.drawn-card[aria-selected=true] img{box-shadow:0 16px 40px #000a,0 0 26px #b4e2d055,0 0 0 2px #c0cfacbb}.drawn-card:not([aria-selected=true]) img{filter:brightness(.78)}
.drawn-card.dealt{animation:card-deal .72s cubic-bezier(.21,.73,.31,1) both}.drawn-card:nth-child(2){animation-delay:.12s}.drawn-card:nth-child(3){animation-delay:.24s}
body[data-mode=spread][data-phase=reading] .orb-glow,body[data-mode=spread][data-phase=reading] .orb-mist{opacity:.06}
.card-detail{display:grid;grid-template-columns:minmax(110px,190px) 1fr;gap:20px;align-items:start}.card-detail img{width:100%;border-radius:8px}.card-detail h3{font:16px var(--serif);color:#c5ac83}.card-detail p{margin:6px 0 18px}
#choicesDialog{width:min(520px,calc(100% - 30px))}.choices{display:grid;gap:8px}.choice{border:1px solid #b6995a55;text-align:left;padding:13px 15px;background:#c7ab6808;border-radius:9px;font-size:16px}.choice:hover{background:#c7ab6822}
.toast{position:fixed;left:50%;bottom:max(14px,env(safe-area-inset-bottom));z-index:50;transform:translateX(-50%);max-width:calc(100% - 26px);background:#201923f5;border:1px solid #c5a87655;color:var(--cream);padding:12px 18px;border-radius:12px;font:14px/1.5 var(--sans);text-align:center;pointer-events:none}
.release-note{font-size:12px!important;color:#c8b08c!important}.noscript{position:fixed;inset:auto 0 0;padding:24px;background:#211625;z-index:30}

/* Photo-aligned objects and local ambience. */
.hotspot{position:absolute;z-index:3;pointer-events:auto;min-width:44px;min-height:44px;padding:0;border-radius:50%;outline-offset:5px}.hotspot:focus-visible{outline:1px solid #f4d4a488}.hotspot .object-glow{position:absolute;inset:0;border-radius:inherit;opacity:0;transition:opacity .25s;pointer-events:none;box-shadow:0 0 22px 3px #9ff2f088,inset 0 0 12px #acf0eb44;background:radial-gradient(ellipse,#adffff0a 30%,#9fd9e514 75%,transparent)}
.hotspot.crystal{left:35.8%;top:18.7%;width:26.2%;height:42%}
.hotspot.coin{left:14.8%;top:45.8%;width:12.9%;height:21.7%}.hotspot.coin .object-glow{box-shadow:0 0 20px 3px #f6c36588,inset 0 0 15px #ffe1aa55;background:radial-gradient(ellipse,transparent 30%,#ffba631c 65%,transparent)}
.hotspot.cards{left:68.7%;top:45.8%;width:18.1%;height:27%;border-radius:28%;transform:rotate(10deg)}.hotspot.cards .object-glow{box-shadow:0 0 22px #f4c67877,inset 0 0 22px #eaba7d55;border-radius:16%;background:#eac6880c}
.hotspot.armed .object-glow,.hotspot.selected .object-glow,.hotspot:focus-visible .object-glow{opacity:1}
@media(hover:hover) and (pointer:fine){.hotspot:hover .object-glow{opacity:1}.hotspot:hover .object-glow{animation:object-breathe 1.7s ease-in-out infinite}}
.object-hint{position:absolute;left:18%;right:18%;top:7.4%;text-align:center;color:#e2c399;font:italic clamp(14px,1.5vw,21px)/1.4 var(--serif);text-shadow:0 2px 7px #000;pointer-events:none;opacity:1}
.orb-glow{position:absolute;left:35.8%;top:18.7%;width:26.2%;height:42%;border-radius:50%;background:radial-gradient(ellipse at 45% 62%,#58e9fa20,#7cdac90a 50%,transparent 72%);box-shadow:0 0 42px #5ad6db16;pointer-events:none;animation:orb-breathe 9s ease-in-out infinite;will-change:auto}
.orb-mist{position:absolute;left:38.4%;top:23%;width:21%;height:32%;overflow:hidden;border-radius:50%;pointer-events:none;opacity:.19;mix-blend-mode:screen}.orb-mist::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 30deg,transparent,#8cdddf44,transparent 34%,#acd7dd55,transparent 70%);filter:blur(9px);animation:orb-drift 24s linear infinite}
.candle-flame{position:absolute;pointer-events:none;width:1.8%;height:6.8%;border-radius:70% 50% 50% 50%;background:radial-gradient(ellipse at 50% 65%,#fff8b09c,#ffb33950 32%,transparent 70%);transform-origin:50% 90%;filter:blur(1px);animation:candle-flicker 3.7s ease-in-out infinite;mix-blend-mode:screen}.candle-left{left:8.65%;top:27%}.candle-right{left:93.95%;top:31.6%;animation-delay:-1.73s;animation-duration:4.3s}
.coin-flip{position:absolute;left:14.9%;top:46.05%;width:12.7%;aspect-ratio:1;z-index:4;pointer-events:none;opacity:0;perspective:700px}.coin-crop{position:absolute;inset:0;border-radius:50%;overflow:hidden;box-shadow:0 0 19px #ffbd5966;backface-visibility:visible}.coin-crop img{position:absolute;width:787.402%;max-width:none;height:auto;left:-117.323%;top:-204.614%}
.oracle-scene.coin-toss .coin-flip{animation:coin-toss 1.05s cubic-bezier(.24,.62,.25,1) both}.oracle-scene.coin-toss .coin-crop{animation:coin-turn 1.05s ease-out both}.oracle-scene.conjuring .orb-glow{animation:crystal-wake 1.15s ease-out both}.oracle-scene.cards-dealing .hotspot.cards .object-glow{animation:deck-wake .9s ease-out}

dialog{width:min(650px,calc(100% - 32px));max-width:calc(100% - 32px);max-height:85vh;max-height:85dvh;overflow:auto;overscroll-behavior:contain;background:#171018;color:var(--cream);border:1px solid #a5865155;border-radius:16px;padding:26px;box-shadow:0 24px 100px #0009}dialog::backdrop{background:#08060bda}.dialog-heading{display:flex;align-items:start;justify-content:space-between;gap:14px;margin-bottom:18px}dialog h2{font:27px/1.25 var(--serif)}dialog p{font:14px/1.75 var(--sans);color:#d3c2ad;margin:10px 0 20px}.dialog-close{width:44px;height:44px;flex-shrink:0;border:1px solid #ae916044;border-radius:50%;font:26px var(--sans);margin-top:-6px}.menu-grid,.support-choices,.support-links{display:grid;gap:8px}.menu-grid button,.menu-grid a,.support-choices button,.support-links a{min-height:44px;padding:12px 15px;text-align:left;font-size:14px;border:1px solid #a5865133;background:#b7964c08;text-decoration:none;border-radius:8px}.menu-grid button:hover,.menu-grid a:hover,.support-choices button:hover{background:#b7964c16}.dialog-note{font-size:12px!important;color:#bead97!important;margin-bottom:0!important}
.deck-dialog{width:min(960px,calc(100% - 32px))}.deck-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px 15px}.deck-item img{width:100%;height:auto;border-radius:6px}.deck-item h3{font:16px var(--serif);margin:9px 0 5px}.deck-item p{font-size:12px;line-height:1.5;margin:0}#copyText{width:100%;resize:vertical;min-height:230px;border:1px solid #a5865166;background:#100a12;color:var(--cream);border-radius:8px;padding:14px;font:16px/1.6 var(--sans)}.noscript{padding:22px;text-align:center;background:#221522}

@keyframes soft-arrive{from{opacity:.2;filter:blur(2px)}to{opacity:1;filter:none}}@keyframes ink-arrive{from{opacity:.1;filter:blur(2px)}to{opacity:1;filter:none}}
@keyframes object-breathe{0%,100%{opacity:.75}50%{opacity:1}}
@keyframes orb-breathe{0%,100%{opacity:.45}45%{opacity:.95}}@keyframes orb-drift{to{transform:rotate(360deg)}}
@keyframes candle-flicker{0%,100%{opacity:.60;transform:scaleX(.85) skewX(-3deg)}27%{opacity:.85;transform:scaleX(.95) skewX(3deg)}56%{opacity:.63;transform:scaleY(.91) skewX(-1deg)}78%{opacity:.76;transform:scaleY(1.05) skewX(2deg)}}
@keyframes crystal-wake{0%{opacity:.4;transform:scale(.98)}45%{opacity:1;transform:scale(1.065);box-shadow:0 0 70px #7eedec69}100%{opacity:.5;transform:scale(1)}}
@keyframes coin-toss{0%{opacity:0;transform:translateY(0)}12%{opacity:1}48%{transform:translateY(-34%)}85%{opacity:1}100%{opacity:0;transform:translateY(0)}}@keyframes coin-turn{0%{transform:rotateY(0) rotateZ(0)}100%{transform:rotateY(1080deg) rotateZ(6deg)}}
@keyframes deck-wake{0%,100%{opacity:.3}45%{opacity:1;box-shadow:0 0 32px #e7b665aa}}
@keyframes card-deal{from{opacity:0;transform:translateY(18px) rotateY(65deg) rotateZ(-4deg)}to{opacity:1;transform:none}}
@keyframes smoke-trail{0%{opacity:0;transform:translate(-14px,12px) scale(.8)}22%{opacity:.9}100%{opacity:0;transform:translate(18px,-30px) scale(1.6)}}


/* Narrow screens extend the same scene with a softly blended backdrop. Props
   and their hotspots remain on ONE sharp, consistently scaled artboard. */
body[data-layout=portrait] .artboard{width:calc(var(--stage-w)*1.3);top:51%;mask-image:linear-gradient(transparent,#000 10%,#000 86%,transparent)}
body[data-layout=portrait] .art-shade{background:linear-gradient(#0c080d33,transparent 24%,transparent 70%,#0c080d77)}
body[data-layout=portrait] .scene-ambience{opacity:.44;mask-image:linear-gradient(#000,transparent 42%,transparent 65%,#000)}
body[data-layout=portrait] .utility-rail{top:max(8px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right))}
body[data-layout=portrait] .message-layer{top:max(58px,env(safe-area-inset-top));height:calc(var(--stage-h)*.39 - 54px);width:calc(100% - 34px);max-width:650px}
body[data-layout=portrait] .smoke-message,body[data-layout=portrait] .branch-prompt{font-size:24px;line-height:1.3}
body[data-layout=portrait] .branch-prompt{font-size:22px;margin-top:12px}
body[data-layout=portrait] .ink-dock{bottom:max(15px,env(safe-area-inset-bottom));width:calc(100% - 26px);max-width:620px;padding:6px 2px}
body[data-layout=portrait] .card-stage{top:54%;gap:12px}
body[data-layout=portrait] .drawn-card{width:clamp(80px,24vw,126px)}
body[data-layout=portrait] .drawn-card .card-name{font-size:16px}
body[data-layout=portrait] .object-hint{top:6.4%;left:20%;right:20%;font-size:16px}
body[data-layout=portrait] .deck-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
/* Compact landscape uses two overlay columns; it never puts the dialogue below
   the picture or makes the document longer than the visible viewport. */
body[data-layout=wide][data-compact=true] .artboard{width:calc(var(--stage-w)*.74);left:30%;top:52%;mask-image:radial-gradient(ellipse,#000 46%,transparent 76%)}
body[data-layout=wide][data-compact=true] .message-layer{left:auto;right:16px;transform:none;top:55px;width:45%;height:calc(var(--stage-h) - 226px)}
body[data-layout=wide][data-compact=true] .ink-dock{left:auto;right:15px;transform:none;bottom:8px;width:45%;padding:4px}
body[data-layout=wide][data-compact=true] .smoke-message,body[data-layout=wide][data-compact=true] .branch-prompt{font-size:22px;line-height:1.25}
body[data-layout=wide][data-compact=true] .card-stage{left:27%;top:53%;gap:10px}
body[data-layout=wide][data-compact=true] .drawn-card{width:clamp(80px,12vw,110px)}
body[data-layout=wide][data-compact=true] .drawn-card .card-name{font-size:15px}
body[data-layout=wide][data-compact=true] .object-hint{font-size:14px;top:5%}
/* With a short visible keyboard viewport the same stage compresses. The writer
   stays on-screen; the voice pages IN PLACE instead of shrinking to tiny text. */
body[data-layout=portrait][data-compact=true] .message-layer{top:52px;height:calc(var(--stage-h) - 227px)}
body[data-layout=portrait][data-compact=true] .artboard{top:51%;opacity:.7}
body[data-layout=portrait][data-compact=true] .ink-dock{bottom:7px}
body[data-layout=portrait][data-compact=true] .smoke-message,body[data-layout=portrait][data-compact=true] .branch-prompt{font-size:22px;line-height:1.25}
body.keyboard-open .ambient,body.keyboard-open .ambient::before{animation-play-state:paused!important}
body.keyboard-open[data-compact=true] .card-stage{visibility:hidden;pointer-events:none}
body[data-compact=true] .panel-actions{gap:1px}.writing-label{min-height:22px}
@media(max-width:400px){body[data-layout=portrait] .smoke-message{font-size:23px}.ghost-button{font-size:13px;padding-inline:9px}.help-button{padding-left:0}.card-stage{gap:9px!important}body[data-layout=portrait] .drawn-card{width:24vw;min-width:76px}.input-shell{padding-left:10px}.input-shell .mirror-window{left:10px}.card-detail{grid-template-columns:110px 1fr;gap:14px}}
@media(max-width:340px){body[data-layout=portrait] .smoke-message,body[data-layout=portrait] .branch-prompt{font-size:22px}.panel-actions{gap:1px}.ghost-button{padding-inline:7px}.drawn-card .card-name{font-size:14px!important}}
@media(max-height:320px) and (orientation:landscape){body[data-compact=true] .message-layer{height:calc(var(--stage-h) - 205px)}body[data-compact=true] .input-shell textarea{height:45px}body[data-compact=true] .input-shell{min-height:60px}.writing-label{margin-bottom:4px}}
@media(max-width:700px){dialog{padding:20px}dialog h2{font-size:24px}.deck-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:380px){.deck-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.still *, .still *::before,.still *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.still .formed-word,.still .smoke-message,.still .branch-prompt,.still .fresh-letter{opacity:1!important;filter:none!important;transform:none!important}
.still .orb-mist,.still .coin-flip,.still .smoke-wisps,.still .candle-flame{display:none!important}
.page-hidden .ambient,.page-hidden .ambient::before,.effects-paused .ambient,.effects-paused .ambient::before{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.formed-word,.smoke-message,.branch-prompt,.fresh-letter{opacity:1!important;filter:none!important;transform:none!important}.orb-mist,.coin-flip,.smoke-wisps,.candle-flame{display:none!important}}
@media(forced-colors:active){.hotspot{border:2px solid ButtonText}.hotspot.armed,.hotspot.selected{outline:3px solid Highlight}.message-layer,.ink-dock{background:Canvas}.choice,.icon-button,.input-shell{border:1px solid ButtonText}.mirror-window{display:none}#question,#reply{color:CanvasText;caret-color:CanvasText}.smoke-message,.branch-prompt,.writing-label{color:CanvasText}}
/* The portrait drapery and table are existing local artwork, not a separate
   page below the scene. The sharper three-prop plate is blended into its center. */
body[data-layout=portrait] .scene-ambience{inset:0;background:linear-gradient(#09070b66,#09060c55),url("assets/parlor.webp") center/cover;filter:none;opacity:.87;mask-image:linear-gradient(#000 24%,transparent 42%,transparent 61%,#000 80%)}
body[data-layout=portrait] .scene-ambience{mask-image:linear-gradient(#000 24%,transparent 42%,transparent 77%,#000 92%)}
body[data-layout=portrait]:not(.keyboard-open) .artboard{top:56%}
/* Hidden paragraphs still count for :first-child; a fixed gap keeps measurement
   and displayed pagination identical when only the question occupies a page. */
.branch-prompt:first-child{margin-top:14px}
/* On portrait crystal/coin readings, place the actual ink field over the
   photographed tablet. Tarot reserves the foreground for the larger cards. */
body[data-layout=portrait][data-compact=false][data-mode=guidance] .ink-dock,
body[data-layout=portrait][data-compact=false][data-mode=yesno] .ink-dock{
  bottom:max(15px,calc(var(--stage-h)*.44 - var(--stage-w)*.198 - 129px));
}