/* Deoksu's night sea. Decorative motion does not affect the saved cast. */
.j-mystic-page{--night:#101e22;--mist:#a8bbb3;--light:#f1ddb0}
.j-mystic-hero{position:relative;isolation:isolate;overflow:hidden;background:#101e22;color:#efe6cd;border-bottom:1px solid #aa94574d}
.j-mystic-hero::before,.j-ritual.j-mystic-ritual::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 76% 38%,#5a806328,transparent 47%),radial-gradient(ellipse at 15% 100%,#6c9b881b,transparent 55%),linear-gradient(125deg,#08171c,#17292a 60%,#101e22)}
.j-stars{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1}
.j-stars i{position:absolute;left:var(--sx);top:var(--sy);width:2px;height:2px;background:#e6ce95;border-radius:50%;box-shadow:0 0 9px 2px #dfc07b32;opacity:.45;animation:j-star-breathe 6s ease-in-out infinite alternate;animation-delay:var(--sd)}
.j-stars i:nth-child(4n){width:3px;height:3px;opacity:.65}.j-stars i:nth-child(3n){background:#bbd5cc}
.j-mystic-hero .j-intro{padding-block:72px 68px;grid-template-columns:1fr 1fr;gap:30px;min-height:575px;position:relative}
.j-mystic-hero .j-eyebrow{color:#c8b179;font-size:11px;letter-spacing:.2em;margin-bottom:29px}
.j-mystic-hero h1{color:#f3ead3;font-size:clamp(38px,4.1vw,62px);line-height:1.48;margin-bottom:22px;font-weight:500}
.j-mystic-hero h1 em{color:#dcc28b}.j-mystic-hero .j-lead{font-size:21px;color:#d5ddcf;margin-bottom:16px}
.j-mystic-hero .j-muted{font-size:14px;line-height:1.95;color:#a3b2aa}
.j-mystic-hero .j-link{color:#f1dbab;border-color:#ac955875;font-size:13px;padding-bottom:12px;gap:42px}
.j-mystic-hero .j-link span{transition:transform .2s}.j-mystic-hero .j-link:hover span{transform:translate(3px,3px)}
.j-mystic-kicker{display:flex;align-items:center;gap:12px}.j-mystic-kicker::before{content:'';width:30px;height:1px;background:#c8b179}
.j-mystic-art{position:relative;aspect-ratio:1;display:grid;place-items:center;isolation:isolate;background:radial-gradient(circle,#a8bf8920,transparent 65%);max-width:470px;width:100%;margin:auto}
.j-celestial-ring{position:absolute;inset:5%;border:1px solid #c1ad6c40;border-radius:50%;box-shadow:0 0 44px #b59c4d09,inset 0 0 36px #baa46406}
.j-celestial-ring::before,.j-celestial-ring::after{content:'';position:absolute;inset:8%;border:1px solid #c1ad6c22;border-radius:50%}
.j-celestial-ring::after{inset:-6%;border-style:dashed;opacity:.6;animation:j-sky-turn 180s linear infinite}
.j-sky-axes{position:absolute;inset:16%;border:1px solid #c1ad6c2c;transform:rotate(45deg);border-radius:3px}
.j-sky-axes::after{content:'';position:absolute;inset:0;border:1px solid #c1ad6c23;transform:rotate(45deg)}
.j-trigrams{position:absolute;inset:0}.j-trigrams span{position:absolute;left:50%;top:50%;font:24px/1 serif;color:#c5b47d;opacity:.65;transform:translate(-50%,-50%) rotate(calc(var(--t)*45deg)) translateY(clamp(-202px,-17vw,-118px)) rotate(calc(var(--t)*-45deg))}
.j-hero-card{position:relative;width:clamp(128px,15vw,176px);aspect-ratio:.64;border:1px solid #bb9f6580;border-radius:9px;background:linear-gradient(135deg,#304639,#142b28 45%,#20372d);box-shadow:0 24px 70px #020c0d99,0 0 55px #c6b77110;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:27px;transform:rotate(-6deg);animation:j-hero-drift 8s ease-in-out infinite}
.j-hero-card::before,.j-hero-card::after{content:'';position:absolute;inset:9px;border:1px solid #ccb26b45;border-radius:3px;pointer-events:none}.j-hero-card::after{inset:15px;border-color:#c9b26c18}
.j-hero-card>small{font:9px/1.6 sans-serif;letter-spacing:.3em;color:#c0ae7d}.j-hero-card .j-hex{width:65px;gap:7px;color:#d1bf88;filter:drop-shadow(0 0 10px #d1bf8830)}.j-hero-card .j-line{height:5px;gap:10px}.j-hero-card .j-line.yang{gap:0}
.j-hero-card>span:last-child{font:20px/1.5 'Noto Serif KR',serif;letter-spacing:.3em;color:#e0c892}
.j-art-whisper{position:absolute;bottom:0;text-align:center;font:11px/1.7 'Noto Serif KR',serif;letter-spacing:.17em;color:#a7b3a2}
.j-mystic-steps{display:flex;align-items:center;gap:25px;margin:30px 0 0;padding:0;list-style:none;color:#9aaea3;font-size:10px;letter-spacing:.04em}.j-mystic-steps b{font:italic 13px Georgia,serif;color:#cdb577;margin-right:7px}
.j-mystic-page .j-start{padding-top:62px}.j-mystic-page .j-plan{border-radius:7px}.j-mystic-page .j-plan:has(input:checked){background:#e9edde}

/* The cast fills the dialog with the same quiet night-sky palette. */
.j-ritual.j-mystic-ritual{isolation:isolate;width:min(1080px,calc(100% - 40px));max-height:calc(100dvh - 28px);border:1px solid #b6a37570;border-radius:12px;background:#101e22;color:#efe6cd;box-shadow:0 35px 120px #0009,0 0 60px #b5a5760a;overflow:auto;scrollbar-width:thin;scrollbar-color:#726c51 #142421}
.j-ritual.j-mystic-ritual::backdrop{background:#061210e6;backdrop-filter:blur(10px)}
.j-mystic-ritual .j-ritual-inner{padding:20px 38px 27px;background:none;position:relative;overflow:hidden;isolation:isolate;min-height:600px}
.j-mystic-ritual .j-ritual-inner::before{content:'';position:absolute;width:650px;height:650px;left:50%;top:45px;transform:translateX(-50%);border:1px solid #b8a16b19;border-radius:50%;box-shadow:0 0 0 50px #b8a16b05,0 0 0 100px #b8a16b03;pointer-events:none;z-index:-1}
.j-mystic-ritual .j-ritual-top{color:#b4c0ae;letter-spacing:.08em;font-size:11px}.j-mystic-ritual .j-ritual-top button{color:#c4c7b3;padding:9px 3px;font-size:11px}
.j-mystic-ritual .j-ritual-progress{margin-top:18px;font-size:10px;color:#d1b57b;letter-spacing:.16em}
.j-mystic-ritual h2{color:#f0e6cf;font-size:34px;font-weight:500;line-height:1.5;margin:15px 0 13px;outline:none}
.j-mystic-ritual .j-ritual-question{color:#acb9ad;font-size:13px;line-height:1.8;margin:0 auto;max-width:580px;white-space:pre-wrap;max-height:95px;overflow-y:auto;padding-inline:8px}
.j-mystic-ritual .j-cast-deck{--spread:clamp(47px,10vw,122px);position:relative;display:block;perspective:1200px;width:100%;max-width:950px;height:288px;margin:0 auto;isolation:isolate}
.j-mystic-ritual .j-cast-deck::before{content:'';position:absolute;inset:auto 4% 0;height:95px;pointer-events:none;background:radial-gradient(ellipse,#c2a96817,transparent 66%);filter:blur(15px)}
.j-mystic-ritual .j-sealed-cast{--angle:calc((var(--card-i) - 2.5)*7deg);--x:calc((var(--card-i) - 2.5)*var(--spread));position:absolute;left:50%;bottom:20px;width:clamp(83px,12vw,133px);height:auto;aspect-ratio:.625;max-height:none;border:0;padding:0;background:transparent;border-radius:8px;box-shadow:none;display:block;transform:translateX(calc(-50% + var(--x))) rotate(var(--angle));transform-origin:50% 140%;transition:transform .55s cubic-bezier(.2,.8,.2,1),opacity .45s,filter .4s;animation:j-card-arrive .8s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:calc(var(--card-i)*.075s);-webkit-tap-highlight-color:transparent}
.j-mystic-ritual .j-sealed-cast::before{display:none}
.j-card-face{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:19px 12px;border:1px solid #c2a56c9c;border-radius:8px;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 25% 10%,#63785835,transparent 60%),linear-gradient(145deg,#2c4335,#142a26 60%,#21392d);box-shadow:0 10px 28px #030b0b8c,inset 0 0 35px #09171060;transition:box-shadow .35s,border-color .35s}
.j-card-face::before,.j-card-face::after{content:'';position:absolute;inset:7px;border:1px solid #bba36a56;border-radius:3px;pointer-events:none}.j-card-face::after{inset:12px;border-color:#bba36a24}
.j-mystic-ritual .j-cast-card-number{font:italic 12px Georgia,serif;color:#d2bc88;opacity:.85}
.j-mystic-ritual .j-cast-card-word{font:14px/1.4 'Noto Serif KR',serif;color:#d3bf8e;opacity:.9;letter-spacing:.18em}
.j-mystic-ritual .j-cast-emblem{position:relative;transform:none;width:63px;height:63px;border:1px solid #c9b6796b;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#bca36718,transparent 70%)}
.j-emblem-ring{position:absolute;inset:7px;border:1px solid #c7ae6975;transform:rotate(45deg)}
.j-emblem-ring::after{content:'';position:absolute;inset:-5px;border:1px solid #c7ae692e;transform:rotate(45deg)}
.j-emblem-lines{display:flex;flex-direction:column;gap:5px;align-items:center}.j-mystic-ritual .j-cast-emblem i{transform:none;width:22px;height:2px;background:#d4bf85;box-shadow:0 0 6px #d4bf8520}.j-mystic-ritual .j-cast-emblem i:nth-child(2){background:linear-gradient(to right,#d4bf85 40%,transparent 40%,transparent 60%,#d4bf85 60%)}
.j-card-corners::before,.j-card-corners::after{content:'✧';position:absolute;top:8px;font:14px Georgia,serif;color:#bca568}.j-card-corners::before{left:10px}.j-card-corners::after{right:10px}
.j-card-glint{position:absolute;inset:-45% -90%;pointer-events:none;background:linear-gradient(105deg,transparent 44%,#ffe7a916 49%,#ffe7a92e 50%,transparent 56%);transform:translateX(-40%);transition:transform .9s}
@media(hover:hover){.j-mystic-ritual .j-sealed-cast:not(:disabled):hover{transform:translateX(calc(-50% + var(--x))) translateY(-25px) rotate(calc(var(--angle)*.5));z-index:9}.j-sealed-cast:hover .j-card-face{border-color:#e4cb8d;box-shadow:0 18px 35px #020a0a99,0 0 27px #cfb87530}.j-sealed-cast:hover .j-card-glint{transform:translateX(40%)}}
.j-mystic-ritual .j-sealed-cast:focus-visible{transform:translateX(calc(-50% + var(--x))) translateY(-24px) rotate(calc(var(--angle)*.5));z-index:10;outline:2px solid #f2d490;outline-offset:5px}
.j-mystic-ritual .j-cast-deck.has-choice .j-sealed-cast:not(.chosen){opacity:.13;filter:blur(1px);transform:translateX(calc(-50% + var(--x))) translateY(22px) rotate(var(--angle)) scale(.9)}
.j-mystic-ritual .j-sealed-cast.chosen{z-index:20;animation:none;transform:translateX(-50%) translateY(-12px) rotateY(12deg) scale(1.08)}
.j-sealed-cast.chosen .j-card-face{border-color:#ffe2a1;box-shadow:0 0 24px #e0bb6355,0 0 80px #dcc07525,0 22px 44px #0007}.j-sealed-cast.chosen .j-card-glint{transform:translateX(45%)}
.j-mystic-ritual .j-ritual-caption{color:#b8c0ab;font-size:12px;line-height:1.9;margin:9px 0 0}.j-mystic-ritual .j-ritual-footnote{font-size:10px;line-height:1.8;color:#82968b;margin:17px auto 0;max-width:560px}
.j-mystic-ritual #j-ritual-status{min-height:20px;color:#cfb77d;font-size:12px;margin:11px 0 0}.j-mystic-ritual[data-phase=casting] #j-ritual-status{animation:j-star-breathe 1.8s ease-in-out infinite alternate}
.j-mystic-ritual .j-ritual-reveal{gap:18px;padding:27px 0 7px}
.j-mystic-ritual .j-revealed-cast{position:relative;min-width:0;width:min(240px,100%);padding:24px 20px 21px;border:1px solid #c3a97270;border-radius:8px;background:radial-gradient(ellipse at 50% 20%,#a6b87d1c,transparent 70%),#183029a3;box-shadow:0 12px 45px #030d0b80;animation:j-result-arrive .7s ease-out both;animation-delay:calc(var(--reveal-i)*.12s)}
.j-mystic-ritual .j-revealed-cast::before{content:'';position:absolute;inset:6px;border:1px solid #c7a96726;border-radius:3px;pointer-events:none}
.j-mystic-ritual .j-revealed-cast>small{color:#b5b897;font-size:10px;margin-bottom:23px}.j-mystic-ritual .j-revealed-cast .j-hex{color:#d4c591;width:96px;gap:9px;filter:drop-shadow(0 0 11px #cebd6e30)}.j-mystic-ritual .j-revealed-cast .j-line{height:7px}.j-mystic-ritual .j-revealed-cast .j-line.moving{color:#f4db91}
.j-mystic-ritual .j-revealed-cast h3{color:#efdeb4;font-size:23px;margin:23px 0 9px}.j-mystic-ritual .j-revealed-cast p{color:#aab9a4;font-size:12px;line-height:1.7;margin:0}
.j-mystic-ritual .j-button{justify-content:center;background:#d5bc83;color:#172d27!important;border:1px solid #e7d29d;min-width:255px;margin-top:17px;border-radius:4px;box-shadow:0 0 25px #c5a65712}.j-mystic-ritual .j-button:hover{background:#e5cf9f}.j-mystic-ritual .j-button:focus-visible{outline:2px solid #fff1bd;outline-offset:5px}
.j-mystic-ritual[data-phase=error] #j-ritual-status{color:#f0c4a1}
@keyframes j-star-breathe{from{opacity:.25}to{opacity:.85}}
@keyframes j-sky-turn{to{transform:rotate(360deg)}}
@keyframes j-hero-drift{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-10px) rotate(-3deg)}}
@keyframes j-card-arrive{from{opacity:0;transform:translateX(-50%) translateY(38px) rotate(0)}to{opacity:1;transform:translateX(calc(-50% + var(--x))) rotate(var(--angle))}}
@keyframes j-result-arrive{from{opacity:0;transform:translateY(16px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:760px){.j-mystic-hero .j-intro{gap:10px;padding-block:50px;min-height:500px}.j-mystic-hero h1{font-size:38px}.j-mystic-hero .j-lead{font-size:18px}.j-mystic-hero .j-muted{font-size:12px}.j-mystic-steps{gap:13px;font-size:9px}.j-mystic-ritual .j-ritual-inner{padding-inline:22px}.j-mystic-ritual .j-cast-deck{height:265px;--spread:clamp(47px,10vw,80px)}}
@media(max-width:640px){.j-mystic-hero .j-intro{display:flex;flex-direction:column;gap:17px;padding-block:36px 30px;min-height:0}.j-mystic-hero .j-intro-copy{width:100%;position:relative;z-index:1}.j-mystic-hero .j-eyebrow{font-size:9px;margin-bottom:19px}.j-mystic-hero h1{font-size:36px;line-height:1.43;margin-bottom:18px}.j-mystic-hero .j-lead{font-size:17px;line-height:1.7;margin-bottom:11px}.j-mystic-hero .j-muted{font-size:12px;line-height:1.85}.j-mystic-hero .j-link{font-size:12px;margin-top:6px;padding-top:11px}.j-mystic-steps{margin-top:23px;gap:22px}.j-mystic-art{width:270px;height:265px;margin-top:0}.j-hero-card{width:114px;gap:18px}.j-hero-card .j-hex{width:49px;gap:6px}.j-hero-card .j-line{height:4px}.j-hero-card>small{font-size:7px}.j-hero-card>span:last-child{font-size:17px}.j-trigrams span{font-size:20px;transform:translate(-50%,-50%) rotate(calc(var(--t)*45deg)) translateY(-112px) rotate(calc(var(--t)*-45deg))}.j-art-whisper{font-size:9px;bottom:-6px}.j-mystic-page .j-start{padding-top:40px}
.j-ritual.j-mystic-ritual{width:calc(100% - 16px);max-height:calc(100dvh - 16px);border-radius:10px}.j-mystic-ritual .j-ritual-inner{padding:13px 13px 23px;min-height:0}.j-mystic-ritual .j-ritual-inner::before{width:420px;height:420px;top:50px}.j-mystic-ritual .j-ritual-top{font-size:10px}.j-mystic-ritual .j-ritual-top button{font-size:10px}.j-mystic-ritual .j-ritual-progress{margin-top:16px;font-size:9px}.j-mystic-ritual h2{font-size:26px;line-height:1.5;margin:14px 0 13px}.j-mystic-ritual .j-ritual-question{font-size:12px;max-width:310px;max-height:78px}.j-mystic-ritual .j-cast-deck{--spread:clamp(28px,8vw,48px);height:245px;max-width:420px}.j-mystic-ritual .j-sealed-cast{width:clamp(72px,22vw,100px);bottom:30px;aspect-ratio:.63;transform-origin:50% 100%}.j-card-face{padding:13px 8px;border-radius:6px}.j-card-face::before{inset:5px}.j-card-face::after{inset:9px}.j-mystic-ritual .j-cast-card-number{font-size:9px}.j-mystic-ritual .j-cast-card-word{font-size:10px}.j-mystic-ritual .j-cast-emblem{width:43px;height:43px}.j-emblem-ring{inset:6px}.j-emblem-ring::after{inset:-3px}.j-emblem-lines{gap:4px}.j-mystic-ritual .j-cast-emblem i{width:17px;height:2px}.j-card-corners::before,.j-card-corners::after{font-size:10px;top:7px}.j-card-corners::before{left:7px}.j-card-corners::after{right:7px}.j-mystic-ritual .j-ritual-caption{font-size:11px;margin-top:1px}.j-mystic-ritual #j-ritual-status{font-size:11px;margin-top:10px}.j-mystic-ritual .j-ritual-footnote{font-size:9px;margin-top:14px;max-width:280px}.j-mystic-ritual .j-ritual-reveal{gap:8px;padding-top:25px}.j-mystic-ritual .j-revealed-cast{padding:20px 9px 17px;width:195px}.j-mystic-ritual .j-revealed-cast>small{font-size:9px;margin-bottom:22px}.j-mystic-ritual .j-revealed-cast .j-hex{width:60px;gap:7px}.j-mystic-ritual .j-revealed-cast .j-line{height:6px;gap:9px}.j-mystic-ritual .j-revealed-cast .j-line.yang{gap:0}.j-mystic-ritual .j-revealed-cast h3{font-size:17px;margin-top:20px}.j-mystic-ritual .j-revealed-cast p{font-size:10px;max-width:none}.j-mystic-ritual .j-button{min-width:0;width:min(300px,100%);font-size:13px}}
@media(max-width:360px){.j-mystic-ritual .j-cast-deck{--spread:28px;height:225px}.j-mystic-ritual .j-sealed-cast{width:72px}.j-mystic-ritual h2{font-size:24px}.j-mystic-ritual .j-revealed-cast .j-hex{width:48px}.j-mystic-ritual .j-revealed-cast h3{font-size:15px}.j-mystic-steps{gap:13px}}
@media(prefers-reduced-motion:reduce){.j-mystic-hero *,.j-mystic-hero *::before,.j-mystic-hero *::after,.j-mystic-ritual *,.j-mystic-ritual *::before,.j-mystic-ritual *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.j-mystic-ritual .j-sealed-cast{opacity:1}}