/* Consultation rooms */
.portrait-frame>.reader-room{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.82}
.portrait-frame::after{content:"";position:absolute;inset:8px;border:1px solid #ecd3a148;pointer-events:none}
.reader-art{z-index:1;filter:drop-shadow(0 12px 20px #160b14a8)}
.scene-player{margin-block:24px 0;scroll-margin-top:14px;--room-ink:#251b20;--room-gold:#8a6849;--room-paper:#f5ecdf;--room-shadow:#291921}
.scene-player[data-interpreter=hwaryeong]{--room-ink:#321c21;--room-gold:#8d5b46;--room-paper:#f2e2da;--room-shadow:#2b141c}
.scene-player[data-interpreter=munyeong]{--room-ink:#242c37;--room-gold:#596a82;--room-paper:#e9ebec;--room-shadow:#151c27}
.scene-player[data-interpreter=baekhwa]{--room-ink:#292729;--room-gold:#786c56;--room-paper:#f1eee7;--room-shadow:#201f21}
.scene-player[data-interpreter=iseon]{--room-ink:#2f2b21;--room-gold:#77673e;--room-paper:#eee8d6;--room-shadow:#242316}
.scene-player[data-interpreter=okbun]{--room-ink:#323323;--room-gold:#726c40;--room-paper:#f1ebd7;--room-shadow:#26281a}
.scene-player[data-interpreter=cheongap]{--room-ink:#27253a;--room-gold:#6e6181;--room-paper:#eee8e8;--room-shadow:#171629}
.scene-frame{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,1fr);border:1px solid #9a7f6055;background:var(--room-shadow);box-shadow:0 18px 44px #3a25231c}
.scene-frame:focus-visible{outline-color:var(--room-gold)}
.scene-art{position:relative;isolation:isolate;overflow:hidden;min-height:500px;background:var(--room-shadow);--actor-x:50%;--actor-scale:1;--room-x:50%;--light:1;--shade:#17101722}
.scene-room,.scene-character{position:absolute;width:100%;height:100%;pointer-events:none;user-select:none}
.scene-room{inset:0;object-fit:cover;object-position:var(--room-x) center;filter:brightness(var(--light));transition:filter .55s ease,object-position .7s ease}
.scene-character{z-index:2;bottom:0;left:var(--actor-x);width:90%;height:95%;object-fit:contain;object-position:center bottom;
  transform:translateX(-50%) scale(var(--actor-scale));transform-origin:center 68%;filter:drop-shadow(0 7px 17px #100b14a8);
  opacity:0;transition:transform .55s ease,left .55s ease,opacity .32s ease;mask-image:linear-gradient(#000 91%,transparent)}
.scene-character.is-visible{opacity:1}
.scene-art::after{content:"";z-index:3;position:absolute;inset:10px;border:1px solid #f5d7a35b;pointer-events:none;box-shadow:0 0 0 12px #1b15153f,inset 0 0 110px var(--shade);transition:box-shadow .45s ease}
.scene-frame[data-framing=wide] .scene-art{--actor-scale:.95}
.scene-frame[data-framing=left] .scene-art{--actor-x:41%;--room-x:66%;--actor-scale:1.07}
.scene-frame[data-framing=right] .scene-art{--actor-x:59%;--room-x:34%;--actor-scale:1.07}
.scene-frame[data-framing=close] .scene-art{--actor-scale:1.28}
.scene-frame[data-light=shadow] .scene-art{--light:.63;--shade:#180a17a3}
.scene-frame[data-light=twilight] .scene-art{--light:.72;--shade:#1e112173}
.scene-frame[data-light=moon] .scene-art{--light:.79;--shade:#111a2e65}
.scene-frame[data-light=hard] .scene-art{--light:.8;--shade:#140d1660}
.scene-frame[data-light=desk] .scene-art{--light:.89}
.scene-frame[data-light=soft] .scene-art{--light:.97}
.scene-tap{position:absolute;inset:0;z-index:5;border:0;background:transparent;touch-action:pan-y}
.scene-prop{position:absolute;z-index:1;pointer-events:none;opacity:.65}
[data-prop=thread] .scene-prop{inset:auto auto 15% -6%;width:52%;height:24%;border:1px solid #bd6473;border-color:#bd6473 transparent transparent;border-radius:50%;transform:rotate(-25deg)}
[data-prop=mirror] .scene-prop{inset:18% 8% auto auto;width:20%;aspect-ratio:3/4;border:1px solid #f3cf8f6e;border-radius:50%;box-shadow:0 0 31px #d48c4661,inset 0 0 26px #d48c4647}
[data-prop=rain] .scene-prop{inset:0;background:repeating-linear-gradient(103deg,transparent 0 45px,#b4c4ec30 46px,transparent 47px 73px);mask-image:linear-gradient(90deg,#000,transparent 65%);opacity:.5}
[data-prop=petal] .scene-prop{inset:67% auto auto 20%;width:12px;height:21px;border-radius:65% 20% 68% 22%;background:#f1e8d1;transform:rotate(37deg)}
[data-prop=route] .scene-prop{inset:auto 9% 12% auto;width:34%;height:24%;border:1px dashed #ecd491a3;border-width:1px 1px 0 0;transform:skew(-20deg) rotate(-18deg)}
[data-prop=steam] .scene-prop{inset:auto auto 15% 10%;width:42%;height:38%;background:radial-gradient(ellipse,#f8eac438,transparent 63%);transform:rotate(-28deg)}
[data-prop=orbit] .scene-prop{inset:10% auto auto 10%;width:79%;aspect-ratio:1;border:1px solid #dbc38781;border-radius:50%;box-shadow:inset 0 0 0 14px #ded4ab17;transform:rotate(-19deg) scaleY(.55)}
[data-prop=orbit] .scene-prop::after{content:"";position:absolute;inset:-8% 23%;border:1px solid #e0c68767;border-radius:50%}
.scene-panel{display:flex;flex-direction:column;min-width:0;padding:clamp(22px,3.6vw,45px);background:linear-gradient(145deg,#ffffff18,transparent 66%),var(--room-paper);color:var(--room-ink);position:relative}
.scene-panel::before{content:"";position:absolute;inset:9px;border:1px solid color-mix(in srgb,var(--room-gold) 28%,transparent);pointer-events:none}
.scene-speaker{color:var(--room-gold);font-size:13px;font-weight:700;letter-spacing:.075em;margin:0 0 15px}
.scene-panel h3{margin:0 0 14px;font:600 clamp(25px,3vw,42px)/1.22 var(--serif);letter-spacing:-.055em;text-wrap:balance}
.scene-lines p,.scene-transcript p{margin:0 0 12px;line-height:1.76;font-size:clamp(16px,1.55vw,18px)}
.scene-lines .scene-emphasis{font:600 clamp(19px,2.1vw,25px)/1.55 var(--serif)}
.scene-annotations{margin-block:3px 14px}
.scene-evidence{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,142px),1fr));margin:9px 0 0;gap:7px}
.scene-evidence>div{padding:8px 10px;border:1px solid #7e67543e;border-left:2px solid var(--room-gold);background:#fffcf16b;min-width:0}
.scene-evidence dt{font-weight:700;font-size:12px;color:var(--room-ink)}
.scene-evidence dd{margin:2px 0 0;font-size:13px;overflow-wrap:anywhere}
.scene-pillar-chips{display:flex;gap:7px;flex-wrap:wrap}
.scene-pillar-chips span{border-bottom:1px solid var(--room-gold);padding:2px 5px;font-size:13px;font-weight:650}
.scene-annotations ul{margin:6px 0 12px;padding-inline-start:1.25em}
.scene-price{font-weight:650;font-size:14px}
.scene-panel .secondary{border-color:var(--room-gold);color:var(--room-ink);font-size:14px}
.scene-nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin-top:auto;padding-top:12px;border-top:1px solid #7e67545c}
.scene-nav button{border:1px solid #7e675454;min-height:44px;background:transparent;color:var(--room-ink);font-size:13px;padding:5px 7px}
.scene-nav button:last-child{background:var(--room-shadow);color:#fff6e9;border-color:var(--room-shadow)}
.scene-nav button:disabled{opacity:.45}
.scene-nav button:focus-visible,.scene-panel a:focus-visible{outline-color:var(--room-gold)}
.scene-progress{font-variant-numeric:tabular-nums;font-size:12px;white-space:nowrap}
.scene-toolbar{display:flex;flex-wrap:wrap;align-items:start;gap:8px 24px;padding:11px 0;border-bottom:1px solid var(--line)}
.scene-setting{display:flex;align-items:center;min-height:44px;gap:8px;font-size:13px;white-space:nowrap;cursor:pointer}
.scene-setting input{margin:0;accent-color:var(--wine)}
.scene-transcript{flex:1;min-width:min(100%,210px)}
.scene-transcript summary{cursor:pointer;padding:11px 0;font-weight:700;font-size:14px}
.scene-transcript section{border-top:1px solid var(--line);padding:15px 0}
.scene-transcript h4{margin:0 0 7px;font:600 21px/1.4 var(--serif)}
#chart-detail>summary{cursor:pointer;padding:6px 0;font-weight:700}
.scene-frame.is-revealing .scene-lines p{animation:scene-text .54s ease both}
.scene-frame.is-revealing[data-transition=paper] .scene-lines p{animation-name:scene-paper}
.scene-frame.is-revealing[data-transition=ink] .scene-lines p{animation-name:scene-ink}
.scene-frame.is-revealing[data-transition=cut] .scene-lines p{animation-timing-function:steps(2,end)}
.scene-frame.is-revealing[data-transition=map] .scene-lines p{animation-name:scene-map}
.scene-frame.is-revealing[data-transition=steam] .scene-lines p{animation-name:scene-steam}
.scene-frame.is-revealing[data-transition=orbit] .scene-lines p{animation-name:scene-orbit}
.scene-frame.is-revealing[data-prop=mirror] .scene-prop,.scene-frame.is-revealing[data-prop=orbit] .scene-prop{animation:scene-glow .54s ease}
@keyframes scene-text{from{opacity:0}to{opacity:1}}
@keyframes scene-paper{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:none}}
@keyframes scene-ink{from{opacity:.12;filter:blur(2px)}to{opacity:1;filter:none}}
@keyframes scene-map{from{opacity:.1;transform:translateX(-8px)}to{opacity:1;transform:none}}
@keyframes scene-steam{from{opacity:.15;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes scene-orbit{from{opacity:.1;transform:scale(.98);transform-origin:left center}to{opacity:1;transform:none}}
@keyframes scene-glow{from{opacity:.3}to{opacity:.65}}
.scene-player[data-still=true] *{animation:none!important;transition:none!important}
@media(max-width:800px){
  .scene-frame{grid-template-columns:minmax(0,1fr)}
  .scene-art{min-height:0;aspect-ratio:1.12}
  .scene-character{height:95%;width:91%}
  .scene-panel{padding:22px 23px max(23px,env(safe-area-inset-bottom))}
  .scene-panel h3{font-size:clamp(24px,6.2vw,34px)}
}
@media(max-width:460px){
  .scene-player{margin-inline:-5px}
  .scene-art{aspect-ratio:1}
  .scene-panel{padding-inline:17px}
  .scene-toolbar{gap:0 16px}
  .scene-annotations .secondary{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .scene-player *, .portrait-frame *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* Illustrated covers, room entrance and the shared natal chart scene */
.hero--interpreters{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);column-gap:clamp(24px,5vw,72px)}
.hero--interpreters .portrait-frame{height:clamp(410px,48vw,620px)}
.hero--interpreters .reader-art{height:100%;transition:opacity .45s,transform .6s}
.reader-engaged .reader-art{transform:scale(1.09);transform-origin:center 30%}
#reader-story{font:600 clamp(28px,3.6vw,54px)/1.16 var(--serif);letter-spacing:-.05em;text-wrap:balance;margin:18px 0 10px}
#reader-intro{max-width:28ch;font-size:17px;color:#dfcfc4;margin:0 0 18px}
.hero--interpreters .reader-roster{grid-template-columns:repeat(4,minmax(0,1fr));border:0;gap:10px}
.hero--interpreters .reader-card{isolation:isolate;position:relative;justify-content:flex-start;min-height:126px;overflow:hidden;gap:8px;padding:11px 12px;text-align:left;border:1px solid #8c70554e;background:#21181f;color:#f5eadd}
.hero--interpreters .reader-card:first-child{grid-column:span 2}
.hero--interpreters .reader-card[aria-pressed=true]{border-color:#d5b785;box-shadow:inset 0 0 0 1px #d5b785}
.hero--interpreters .reader-card .reader-cover{position:absolute;inset:0;z-index:-2;border:0;border-radius:0;width:100%;height:100%;object-fit:cover;opacity:.55;mask-image:linear-gradient(90deg,#000 12%,#0008 58%,transparent)}
.hero--interpreters .reader-card>img:not(.reader-cover){width:66px;height:76px;object-fit:cover;border-radius:0;border:0;background:none}
.reader-card-copy{display:grid;gap:2px;line-height:1.42;min-width:0}
.reader-card-copy>strong{font-size:18px}
.reader-card-copy>span{font:600 15px/1.35 var(--serif);text-wrap:balance}
.reader-card-copy>small{font-size:11px;color:#f0d2aa}
.reader-card.cover-arrival{animation:cover-arrival .45s ease both}
@keyframes cover-arrival{from{opacity:.15;transform:translateY(9px)}to{opacity:1;transform:none}}
.room-entry{grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:20px 36px;align-items:center}
.room-entry .section-title{margin:0;max-width:none}
.room-entry .section-title h2{max-width:none}
.room-entry form{grid-column:1/-1;max-width:720px;width:100%;justify-self:center}
.room-entry blockquote{margin:17px 0;padding:9px 0 9px 12px;border-inline-start:1px solid #9a6b51;font:600 clamp(17px,2vw,23px)/1.65 var(--serif)}
.room-entry .text-btn{margin-inline-start:9px}
.entry-art{position:relative;min-height:330px;aspect-ratio:1.25;isolation:isolate;overflow:hidden;background:#271c22;outline:1px solid #a485624f}
.entry-art img{position:absolute;inset:0;width:100%;height:100%}
.entry-art img:first-child{object-fit:cover}
.entry-art img:last-child{object-fit:contain;object-position:center bottom;filter:drop-shadow(0 6px 12px #170c15aa)}
.scene-frame[data-kind=nature] .scene-character,.scene-frame[data-kind=nature] .scene-prop{opacity:0}
.scene-frame[data-kind=nature] .scene-room{filter:none}
.scene-frame[data-kind=chart] .scene-art{--actor-scale:1.03}
.scene-chart{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
.scene-chart>div{min-width:0;text-align:center;padding:8px 2px;background:#fff9ed99;border:1px solid #6b514546}
.scene-chart>.scene-day-pillar{background:var(--room-shadow);color:#fff5e5;border-color:var(--room-gold)}
.scene-chart span,.scene-chart small{display:block;font-size:12px}
.scene-characters{font:600 clamp(23px,3vw,38px)/1.15 var(--serif);padding:6px 0;letter-spacing:.02em}
.scene-characters b{display:inline-block;animation:pillar-appear .5s both}
.scene-characters b:nth-child(2){animation-delay:.08s}
.scene-chart>div:nth-child(2) b{animation-delay:.14s}
.scene-chart>div:nth-child(3) b{animation-delay:.25s}
.scene-chart>div:nth-child(4) b{animation-delay:.36s}
@keyframes pillar-appear{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.scene-choices{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.scene-choices button{min-height:44px;padding:4px 8px;border:1px solid var(--room-gold);background:transparent;color:var(--room-ink);font-size:13px}
.scene-choices button[aria-pressed=true]{background:var(--room-shadow);color:#fff5e5}
.scene-answer:not(:empty){padding:8px 10px;border-inline-start:2px solid var(--room-gold);background:#fffcf185;font-size:14px}
@media(max-width:800px){
 .hero--interpreters{grid-template-columns:minmax(0,1fr)}
 .hero--interpreters .portrait-frame{height:clamp(345px,93vw,500px)}
 .hero--interpreters .reader-roster{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
 .hero--interpreters .reader-card{min-height:102px;padding:7px;gap:5px}
 .hero--interpreters .reader-card>img:not(.reader-cover){width:44px;height:62px}
 .reader-card-copy>span{font-size:13px}
 .reader-card-copy>small{font-size:10px}
 .room-entry{grid-template-columns:minmax(0,1fr);gap:16px}
 .entry-art{min-height:0;aspect-ratio:1.2}
}
@media(prefers-reduced-motion:reduce){.reader-card.cover-arrival,.scene-characters b{animation:none}.hero--interpreters .reader-art{transition:none}}

/* Portrait, subtitle and response occupy the same continuous scene. */
.consultation-page .paper{background:radial-gradient(ellipse at 70% 0%,#291628,transparent 50rem),var(--night)}
.room-entry{
  --light:#e3b491;--wash:#452032;--portrait-x:73%;
  position:relative;isolation:isolate;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-content:end;align-items:end;gap:24px;
  min-height:clamp(520px,64vw,710px);margin-top:22px;
  padding:clamp(24px,5vw,64px);border:1px solid color-mix(in srgb,var(--light) 40%,transparent);
  background:var(--night)
}
[data-interpreter=hwaryeong].room-entry{--light:#efa991;--wash:#530e28}
[data-interpreter=munyeong].room-entry{--light:#cbbde9;--wash:#28203d}
[data-interpreter=baekhwa].room-entry{--light:#eeedf4;--wash:#34353f}
[data-interpreter=iseon].room-entry{--light:#e4b88b;--wash:#3c2335}
[data-interpreter=okbun].room-entry{--light:#dcce97;--wash:#263923}
[data-interpreter=cheongap].room-entry{--light:#dfc9ef;--wash:#22224a}
.room-entry .entry-art{position:absolute;inset:0;z-index:-1;min-height:0;aspect-ratio:auto;outline:0;background:var(--wash)}
.entry-art img:first-child{filter:brightness(.62) saturate(.76);transition:object-position .6s;object-position:50% 49%}
.entry-art img:last-child{left:var(--portrait-x);width:63%;transform:translateX(-50%) scale(1.03);transform-origin:center 56%;transition:transform .55s,opacity .45s}
.entry-art::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,#100d15ed,transparent 70%),linear-gradient(0deg,#100d15f5,transparent 69%),linear-gradient(115deg,var(--wash),transparent 56%)
}
.room-entry[data-cut="2"] .entry-art img:last-child{transform:translateX(-50%) scale(1.19)}
.room-entry[data-cut="3"] .entry-art img:last-child{opacity:.74;transform:translateX(-50%) scale(1.13)}
.room-entry .section-title{position:relative;min-width:0;max-width:43ch;align-self:end}
.room-entry .eyebrow{color:var(--light);letter-spacing:.06em}
.room-entry .section-title h2{font-size:clamp(34px,5vw,65px);max-width:none}
.room-entry blockquote,.entry-ask{
  margin:18px 0;padding:12px 16px;border:0;border-inline-start:2px solid var(--light);
  background:#130e1be8;color:var(--paper);font:600 clamp(17px,2vw,23px)/1.6 var(--serif)
}
.room-entry .primary{width:auto;background:#211626;border-color:var(--light);color:var(--paper);gap:10px}
.room-entry .primary:hover:not(:disabled){background:#40253e}
.room-entry .text-btn{margin-inline-start:0;padding-block:8px}
.room-entry #birth{
  grid-column:2;max-width:none;justify-self:stretch;align-self:end;
  border:1px solid color-mix(in srgb,var(--light) 49%,transparent);
  padding:clamp(16px,2.4vw,30px);background:#15101eee;box-shadow:0 20px 46px #0008;
}
.room-entry #birth .entry-ask{margin-top:0}
.room-entry #birth .primary{width:100%;margin-top:12px;background:#43253c}
.room-entry #birth input,.room-entry #birth select{font-size:16px}
.room-entry .form-heading{margin-bottom:15px}
.scene-player[data-interpreter],.scene-player{
  --room-paper:#1b1422;--room-ink:#f0edf2;--room-gold:#e3c28b;--room-shadow:#15101b;
}
.scene-player[data-interpreter=hwaryeong]{--room-gold:#efa991;--room-paper:#24121c}
.scene-player[data-interpreter=munyeong]{--room-gold:#cbbde9;--room-paper:#1a1729}
.scene-player[data-interpreter=baekhwa]{--room-gold:#e8e7ef;--room-paper:#1d1b23}
.scene-player[data-interpreter=iseon]{--room-gold:#e4b88b;--room-paper:#221723}
.scene-player[data-interpreter=okbun]{--room-gold:#dcce97;--room-paper:#1a201a}
.scene-player[data-interpreter=cheongap]{--room-gold:#dfc9ef;--room-paper:#18182c}
.scene-frame{border-color:var(--line)}
.scene-panel{background:var(--room-paper)}
.scene-lines p{border-inline-start:1px solid var(--room-gold);padding-inline-start:13px}
.scene-evidence>div,.scene-chart>div,.scene-answer:not(:empty){background:#100d17;border-color:var(--line)}
.scene-chart>.scene-day-pillar{border-color:var(--room-gold)}
.scene-nav button:last-child{border-color:var(--room-gold)}
@media(max-width:800px){
  .room-entry{display:flex;flex-direction:column;align-items:stretch;justify-content:end;min-height:0;padding:0;gap:0;--portrait-x:54%}
  .room-entry .entry-art{position:relative;min-height:0;aspect-ratio:1.14}
  .entry-art img:last-child{width:94%}
  .entry-art::after{background:linear-gradient(0deg,#100d15,transparent 37%),linear-gradient(115deg,var(--wash),transparent 38%)}
  .room-entry .section-title{align-self:stretch;padding:0 18px 20px;margin-top:-24px}
  .room-entry #birth{margin:0 12px 14px}
}
@media(prefers-reduced-motion:reduce){.entry-art img{transition:none!important}}