/* 案内役と占う瞬間を主役にした、三つの部屋の演出。 */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.hero{grid-template-columns:.93fr 1.07fr;gap:34px;min-height:660px}
.hero h1{font-size:clamp(31px,3.1vw,45px)}
.hero-muses{display:flex;align-items:center;gap:11px;height:550px;min-width:0;padding:18px 0}
.hero-muse{position:relative;flex:1;min-width:0;height:86%;overflow:hidden;border-radius:100px 100px 5px 5px;border:1px solid #d9bc7c70;box-shadow:0 14px 40px #070d2280;isolation:isolate;transition:transform .35s,border-color .35s}
.hero-muse:nth-child(2){height:100%;margin-top:-12px}
.hero-muse:nth-child(3){margin-top:35px}
.hero-muse img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 25%;transition:transform .6s}
.hero-muse:after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#11172cee)}
.hero-muse>span{position:absolute;bottom:24px;left:0;right:0;z-index:1;text-align:center;font:24px/1.5 var(--serif);text-shadow:0 2px 12px #000}
.hero-muse small{display:block;font:11px/2 var(--sans);color:#ead7af;margin-top:7px}
.hero-muse:hover{transform:translateY(-7px);border-color:var(--gold)}
.hero-muse:hover img{transform:scale(1.035)}
.room-picture{height:320px;padding:0;overflow:hidden}
.room-picture img{display:block;height:100%;width:100%;object-fit:cover;object-position:50% 20%}
.room:hover .room-picture img{transform:scale(1.035)}
.room-picture:after{content:'';position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#171e36)}
.room-time{z-index:1;bottom:10px}
.omikuji-page{--guide-accent:#f2b6ad;--guide-halo:#dc8b7959}
.tarot-page{--guide-accent:#d0bcfc;--guide-halo:#b093e15c}
.number-page{--guide-accent:#a5e4db;--guide-halo:#65bdb65c}
.room-heading{padding-bottom:20px}.room-title{max-width:none}.room-title>img{width:95px;height:79px}.room-title h1{font-size:34px}.room-title p{margin-top:6px}
.reading-stage{display:grid;grid-template-columns:minmax(310px,.84fr) minmax(0,1.16fr);gap:30px;align-items:start}
.character-guide{position:sticky;top:18px;min-width:0;filter:drop-shadow(0 15px 32px #090f2550)}
.character-portrait{height:430px;border:1px solid var(--line);border-bottom:0;border-radius:110px 6px 0 0;overflow:hidden;position:relative;isolation:isolate;background:#24273c}
.character-portrait>img{width:100%;height:100%;object-fit:cover;object-position:50% 17%;display:block;transform-origin:50% 75%}
.character-portrait:after{content:'';position:absolute;inset:48% 0 0;background:linear-gradient(transparent,#172039e8);z-index:1}
.portrait-light{position:absolute;inset:0;box-shadow:inset 0 0 55px var(--guide-halo);opacity:.15;z-index:2;pointer-events:none}
.portrait-caption{position:absolute;z-index:3;bottom:21px;left:27px;right:20px;text-shadow:0 2px 10px #080e24}
.portrait-caption h2{font-size:34px;letter-spacing:.13em;color:#fff8ed;line-height:1.5;margin:4px 0}
.portrait-caption h2 span{font:11px var(--sans);letter-spacing:.04em;margin-left:15px;color:var(--guide-accent)}
.portrait-caption p{font-size:11px;color:#eee4d6}.portrait-caption p:last-child{font:13px/1.7 var(--serif)}
.guide-dialogue{background:linear-gradient(125deg,#29334dfc,#202942fc);border:1px solid var(--line);padding:20px 23px 15px;position:relative;border-radius:0 0 6px 6px;min-height:202px}
.dialogue-heading{display:flex;align-items:center;gap:10px;margin-bottom:10px}.dialogue-name{font:18px var(--serif);color:var(--guide-accent)}.guide-mood{font-size:10px;color:var(--muted);margin-left:auto}
.guide-caption{font:14px/1.95 var(--serif);min-height:5.85em;color:#f4f0eb;overflow-wrap:anywhere}
.guide-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:13px}
.guide-controls button{background:transparent;border:1px solid #ad9e8066;color:#ead6b2;font-size:11px;min-height:36px;padding:6px 10px;border-radius:3px}
.guide-controls button:hover{background:#d9bc7c1a}.guide-controls button[aria-pressed=true]{background:#d9bc7c;color:#171e36;border-color:var(--gold)}
.voice-status{font-size:10px!important;color:#b5bdce;line-height:1.7;min-height:1.7em;margin-top:10px!important}
.speaking-bars{display:flex;gap:3px;align-items:center;height:16px;width:27px}.speaking-bars i{height:3px;width:3px;background:var(--guide-accent);border-radius:2px;opacity:.45}
.is-speaking .speaking-bars i{animation:voice-wave .65s ease-in-out infinite alternate;opacity:1}.speaking-bars i:nth-child(2){animation-delay:-.3s}.speaking-bars i:nth-child(3){animation-delay:-.1s}.speaking-bars i:nth-child(4){animation-delay:-.45s}.speaking-bars i:nth-child(5){animation-delay:-.2s}
.is-speaking .portrait-light{animation:voice-glow 1.8s ease-in-out infinite alternate}.is-speaking .character-portrait>img{animation:portrait-breathe 4s ease-in-out infinite alternate}
.is-typing .guide-caption:after{content:'▍';color:var(--guide-accent);font-size:11px;margin-left:3px;animation:caption-caret .6s steps(2) infinite}
.portrait-particles{position:absolute;inset:0;overflow:hidden;z-index:2;pointer-events:none}.portrait-particles i{position:absolute;left:calc(var(--i)*8% + 3%);bottom:-12px;width:4px;height:4px;border-radius:50%;background:#f6e8c9;opacity:0;box-shadow:0 0 9px 2px var(--guide-accent)}
.is-casting .portrait-particles i{animation:portrait-spark 2s ease-out both;animation-delay:calc(var(--i)*.06s)}
.reading-stage .experience{width:100%;max-width:none;padding:32px;position:relative;min-height:640px;overflow:hidden;background:linear-gradient(145deg,#29334ce8,#202941);border-color:#d9bc7c40}
.reading-stage .tarot-deck{gap:10px;padding:48px 0 34px}.reading-stage .tarot-back{width:calc((100% - 40px)/5);max-width:90px;height:147px}.reading-stage .tarot-back .card-moon{width:44px;height:44px;font-size:32px;padding-top:5px}
.reading-stage .tarot-reading{grid-template-columns:170px minmax(0,1fr);gap:24px}.reading-stage .tarot-front{width:170px;min-height:270px;padding:10px}.reading-stage .tarot-front-inner{min-height:248px}.reading-stage .tarot-front img{width:144px;height:167px}.reading-stage .tarot-front h3{font-size:18px}.reading-stage .reading-text h2{font-size:25px}.reading-stage .reading-text>p:not(.result-label){font-size:13px}
.reading-stage .tarot-front .tarot-english-name{font-family:Georgia,'Times New Roman',serif;font-size:15px;line-height:1.4;letter-spacing:.06em;text-transform:uppercase;overflow-wrap:normal;margin:8px 0 0}.tarot-front .tarot-japanese-name{font-size:11px;color:var(--muted);margin:6px 0 5px;line-height:1.6}
.reading-stage .number-form{grid-template-columns:1fr;gap:22px}.reading-stage .number-form>div{padding-right:120px;position:relative}.reading-stage .number-form>div>img{position:absolute;right:0;top:0;width:108px;height:95px}.reading-stage .number-form>div>p{margin-top:11px}.reading-stage .number-form>div>p br{display:none}
.reading-stage .fortune-slip{padding:28px}.reading-stage .fortune-slip h3{font-size:20px}.reading-stage .fortune-name{font-size:60px!important}
.reading-stage .result-actions{gap:9px}.reading-stage .result-actions .button{font-size:12px;padding:10px 15px}.reading-stage .result-actions .voice-result{width:100%;border-color:#a89b7560;color:var(--guide-accent);gap:9px}
.ritual-overlay{position:absolute;inset:0;z-index:5;background:radial-gradient(ellipse at 50% 43%,#493d66,#19213bed 65%);display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:460px;overflow:hidden}
.ritual-omikuji{background:radial-gradient(ellipse at 50% 43%,#654151,#1c2238 70%)}.ritual-numerology{background:radial-gradient(ellipse at 50% 43%,#285957,#1b2239 70%)}
.experience.is-casting>:not(.ritual-overlay){visibility:hidden}.ritual-glow{position:absolute;width:270px;height:270px;border:1px solid #d9bc7c60;border-radius:50%;box-shadow:0 0 60px var(--guide-halo),inset 0 0 55px var(--guide-halo);animation:ritual-halo 2.4s ease-out both}
.ritual-message{position:relative;margin-top:45px;font:19px/1.7 var(--serif);color:#f4e3c3;z-index:2;text-align:center}.ritual-skip{position:relative;color:#dbd4e3;background:transparent;border:0;border-bottom:1px solid #d9bc7c44;font-size:11px;margin-top:22px;padding:8px;z-index:2}
.ritual-cylinder{height:188px;width:91px;background:linear-gradient(90deg,#795337,#c99e6e 27%,#e1c492 50%,#a77847 74%,#715032);border:2px solid #dfbe82;border-radius:13px 13px 9px 9px;position:relative;box-shadow:0 12px 30px #11182f80;animation:shake-cylinder .32s ease-in-out 5 alternate;z-index:1}
.ritual-cylinder:before,.ritual-cylinder:after{content:'';position:absolute;inset:10px -3px auto;border:2px solid #614127;height:10px;border-radius:50%}.ritual-cylinder:after{top:auto;bottom:10px}.ritual-cylinder span{writing-mode:vertical-rl;font:23px var(--serif);color:#542b2b;display:block;margin:35px auto;background:#eaddba;padding:11px 7px;border:1px solid #6a4428}.ritual-cylinder b{position:absolute;left:42px;top:-55px;height:75px;width:7px;background:#f3dab0;box-shadow:0 0 10px #f5cd83;animation:draw-stick 2.3s ease both}
.ritual-card{height:206px;width:133px;border:2px solid #e4c68a;border-radius:8px;background:repeating-linear-gradient(45deg,#493c6650 0 1px,transparent 1px 12px),#1d203b;box-shadow:0 0 40px #a88cc164;display:grid;place-items:center;font:88px var(--serif);color:#e8d097;animation:turn-card 2.4s ease-in-out both;z-index:1}.ritual-card:before{content:'';position:absolute;inset:9px;border:1px solid #d9bc7c99;border-radius:4px}
.ritual-orbit{height:225px;width:225px;position:relative;border:1px solid #a9e0d7a0;border-radius:50%;box-shadow:inset 0 0 35px #85d8c325;animation:number-orbit 2.4s ease-in-out both}.ritual-orbit:after{content:'';position:absolute;inset:18px;border:1px dashed #dfcc9570;border-radius:50%}.ritual-orbit span{position:absolute;left:calc(50% - 15px);top:calc(50% - 21px);font:26px var(--serif);width:30px;text-align:center;color:#f0e8cf;transform:rotate(calc(var(--n)*40deg)) translateY(-100px) rotate(calc(var(--n)*-40deg));text-shadow:0 0 13px #a5e4db}.ritual-orbit b{position:absolute;inset:0;display:grid;place-items:center;color:#a5e4db;font-size:65px;font-weight:400}
.ritual-particles{position:absolute;inset:0;pointer-events:none}.ritual-particles i{position:absolute;left:50%;top:43%;width:6px;height:6px;border-radius:50%;background:var(--guide-accent);box-shadow:0 0 9px var(--guide-accent);animation:ritual-particle 2.4s ease-out both;--angle:calc(var(--i)*30deg)}.ritual-omikuji .ritual-particles i{width:12px;height:7px;border-radius:90% 10% 90% 10%;background:#f3c5cc}
@keyframes voice-wave{to{height:16px}}@keyframes voice-glow{to{opacity:.8}}@keyframes portrait-breathe{to{transform:scale(1.025)}}@keyframes caption-caret{to{opacity:0}}
@keyframes portrait-spark{0%{opacity:0;transform:translateY(0)}30%{opacity:.8}100%{opacity:0;transform:translateY(-350px)}}
@keyframes ritual-halo{0%{opacity:0;transform:scale(.5)}35%{opacity:1;transform:scale(1)}85%{opacity:1}100%{opacity:0;transform:scale(1.5)}}
@keyframes shake-cylinder{from{transform:rotate(-13deg) translateX(-7px)}to{transform:rotate(13deg) translateX(7px)}}@keyframes draw-stick{0%,55%{transform:translateY(48px);opacity:0}85%{transform:translateY(-30px);opacity:1}100%{transform:translateY(-70px);opacity:0}}
@keyframes turn-card{0%{transform:perspective(700px) rotateY(0) scale(.9)}45%{transform:perspective(700px) rotateY(190deg) scale(1.06)}75%{transform:perspective(700px) rotateY(360deg) scale(1)}100%{transform:perspective(700px) rotateY(360deg) scale(1.1);box-shadow:0 0 75px #e4d3ffa0}}
@keyframes number-orbit{0%{transform:rotate(-70deg) scale(.7);opacity:0}30%{opacity:1}80%{transform:rotate(360deg) scale(1)}100%{transform:rotate(360deg) scale(1.08)}}
@keyframes ritual-particle{0%{opacity:0;transform:rotate(var(--angle)) translateY(40px)}35%{opacity:1}100%{opacity:0;transform:rotate(var(--angle)) translateY(250px) rotate(100deg)}}
@media(max-width:1100px){.reading-stage{grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);gap:22px}.reading-stage .experience{padding:26px}.character-portrait{height:400px}.guide-dialogue{padding-inline:18px}.hero-muses{height:490px}.hero{gap:24px;min-height:610px}.hero h1{font-size:33px}.reading-stage .tarot-reading{grid-template-columns:1fr}.reading-stage .tarot-front{margin:auto}.reading-stage .reading-text h2,.reading-stage .reading-text .result-label{text-align:center}.reading-stage .theme-picker span{padding:8px 11px;font-size:11px}}
@media(max-width:800px){.reading-stage{grid-template-columns:1fr;max-width:600px}.character-guide{position:relative;top:0}.character-portrait{height:350px;border-radius:85px 6px 0 0}.character-portrait>img{object-position:50% 22%}.character-portrait:after{inset:40% 0 0}.guide-dialogue{min-height:0}.guide-caption{min-height:3.9em}.reading-stage .experience{min-height:490px}.reading-stage .tarot-reading{grid-template-columns:170px minmax(0,1fr)}.hero{grid-template-columns:1fr;gap:0;text-align:center;padding-top:35px;min-height:0}.hero h1{font-size:35px}.hero-muses{width:100%;max-width:560px;margin:25px auto 0;height:420px}.hero-muse img{object-position:50% 20%}.room-picture{height:280px}}
@media(max-width:720px){.hero{padding-block:27px 28px}.hero h1{font-size:31px}.hero-description{font-size:12px}.hero-muses{height:350px;margin-top:20px;gap:8px}.hero-muse{border-radius:75px 75px 4px 4px}.hero-muse>span{font-size:20px;bottom:18px}.hero-muse small{font-size:9px}.hero-foot{font-size:10px}.room-picture{height:100%;min-height:237px;padding:0}.room-picture img{height:100%;min-height:237px;transform:none;object-fit:cover;object-position:50% 23%}.room-time{font-size:8px;bottom:12px}.room-copy{padding-top:27px}.room-picture:after{inset:65% 0 0}.room-title h1{font-size:30px}.room-title>img{width:78px;height:70px}.room-heading{padding:20px 0 17px}.reading-stage{gap:20px}.character-portrait{height:320px}.portrait-caption{left:22px;bottom:17px}.portrait-caption h2{font-size:30px}.portrait-caption p:last-child{font-size:12px}.guide-dialogue{padding:17px 19px 13px}.guide-caption{font-size:13px;line-height:1.95;min-height:5.85em}.guide-controls{gap:7px}.reading-stage .experience{padding:27px 20px}.reading-stage .tarot-back{height:133px;width:calc((100% - 28px)/5)}.reading-stage .tarot-deck{gap:7px;padding-top:37px}.reading-stage .tarot-back .card-moon{width:36px;height:36px;font-size:27px;padding-top:3px}.reading-stage .tarot-reading{grid-template-columns:1fr}.reading-stage .tarot-front{width:190px;min-height:294px}.reading-stage .tarot-front-inner{min-height:269px}.reading-stage .tarot-front img{height:187px;width:155px}.reading-stage .fortune-slip{padding:25px 20px}.reading-stage .number-form>div{padding-right:84px}.reading-stage .number-form>div>img{width:86px;height:86px}.ritual-message{font-size:17px}.reading-stage .result-actions .button{padding:10px 13px}.ritual-overlay{min-height:430px}}
@media(max-width:360px){.hero h1{font-size:27px}.hero-description{font-size:11px}.hero-muses{height:305px;gap:6px}.hero-muse>span{font-size:18px}.hero-muse small{font-size:8px}.character-portrait{height:290px}.guide-controls button{font-size:10px}.reading-stage .experience{padding:25px 15px}.reading-stage .tarot-back{height:113px}.reading-stage .tarot-back .card-moon{width:31px;height:31px;font-size:24px}.reading-stage .theme-picker span{padding:8px 9px;font-size:10px}.reading-stage .fortune-slip{padding:22px 15px}}
@media(prefers-reduced-motion:reduce){.hero-muse,.hero-muse img{transition:none}.hero-muse:hover,.hero-muse:hover img,.room:hover .room-picture img{transform:none}.character-guide *,.ritual-overlay *{animation:none!important;transition:none!important}.speaking-bars i{height:8px!important}.is-typing .guide-caption:after{display:none}}
@media print{.character-guide,.ritual-overlay,.hero-muses{display:none!important}.reading-stage{display:block}.reading-stage .experience{min-height:0;background:white}}