@font-face{font-family:"Cormorant";src:url(../fonts/CormorantGaramond.ttf) format("truetype");font-weight:300 700;font-display:swap}
@font-face{font-family:"Cormorant";src:url(../fonts/CormorantGaramond-Italic.ttf) format("truetype");font-style:italic;font-weight:300 700;font-display:swap}
@font-face{font-family:"Inter";src:url(../fonts/Inter.ttf) format("truetype");font-weight:100 900;font-display:swap}
:root{
  --void:#05070d;--void2:#0a0f1c;--ink:#e9e4d6;--mute:#9aa3ad;--dim:#5f6873;
  --gold:#d8b878;--gold2:#f1dcae;--teal:#5fc6c0;--line:rgba(216,184,120,.22);
  --serif:"Cormorant","Noto Serif CJK SC","Noto Serif CJK TC","Songti SC",Georgia,serif;
  --zh:"Noto Serif CJK TC","Noto Serif CJK SC","Songti TC","Songti SC",serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(120% 80% at 50% 0%,#0d1526 0%,var(--void) 60%) fixed,var(--void);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;min-height:100vh}
a{color:var(--gold2);text-decoration:none}
a:hover{color:#fff}
#stars{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.wrap{position:relative;z-index:1;max-width:1080px;margin:0 auto;padding:0 20px}
.zh{font-family:var(--zh);letter-spacing:.04em}
/* header */
.top{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:18px 20px;max-width:1080px;margin:0 auto}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-size:22px;letter-spacing:.18em;color:var(--ink);text-transform:uppercase}
.brand .zh{color:var(--gold);font-size:18px;letter-spacing:.1em}
.brand .mark{width:36px;height:36px;display:block;flex-shrink:0}
.brand .bn{font:500 18px var(--serif);letter-spacing:.22em;color:var(--gold2)}
.brand .seal{writing-mode:vertical-rl;font:700 10px/1 var(--zh);color:#f6dcc0;background:#8b1e18;padding:5px 3px;border-radius:3px;letter-spacing:.06em;margin-left:2px}
.brand.product{margin-left:8px;opacity:.92;font-size:18px}
.top{gap:10px;flex-wrap:wrap}
footer .brand-line{letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-family:var(--serif);font-size:13px;margin-bottom:10px}
footer .brand-line a{color:var(--gold2);text-decoration:none}
.nav{display:flex;gap:22px;font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.nav a{color:var(--mute)}.nav a:hover,.nav a.on{color:var(--gold2)}
/* hero */
.hero{text-align:center;padding:4vh 0 1vh}
.eyebrow{font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--teal);opacity:.85}
h1,h2,h3{font-family:var(--serif);font-weight:500;letter-spacing:.02em;margin:0}
.hero h1{font-size:clamp(40px,8vw,76px);line-height:1.05;margin:14px 0 10px;font-weight:400}
.hero h1 span{color:var(--gold)}
.lede{max-width:560px;margin:0 auto;color:var(--mute);font-size:16px}
/* stage */
.stage{position:relative;margin:1vh auto 0;width:min(92vw,520px,54vh);min-width:min(92vw,300px);aspect-ratio:1}
.stage canvas{position:absolute;inset:0;width:100%;height:100%}
.reveal-card{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none;opacity:0;transition:opacity .8s}
.reveal-card.on{opacity:1}
.reveal-card .hx{width:26%;margin-bottom:10px}
.reveal-card .num{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--teal)}
.reveal-card .en{font-family:var(--serif);font-size:clamp(26px,5vw,38px);margin-top:4px}
.reveal-card .zhn{font-family:var(--zh);color:var(--gold);font-size:22px;margin-top:2px}
.fade{opacity:0;transform:translateY(6px);transition:opacity .9s,transform .9s}.fade.on{opacity:1;transform:none}
/* hexagram svg lines */
.hx rect{fill:var(--gold);transition:fill .6s,filter .6s,opacity .6s}
.hx.dimmed rect{fill:rgba(216,184,120,.13)}
.hx rect.lit{fill:var(--gold2);filter:drop-shadow(0 0 6px rgba(241,220,174,.8))}
.hx rect.chg{fill:var(--teal)}
/* ask */
.ask{max-width:560px;margin:10px auto 0;text-align:center}
.ask label{display:block;font-family:var(--serif);font-size:24px;margin-bottom:12px}
.field{width:100%;background:rgba(10,15,28,.6);border:1px solid var(--line);border-radius:14px;color:var(--ink);padding:16px 18px;font:inherit;font-size:16px;resize:none;outline:none;transition:border-color .3s,box-shadow .3s;backdrop-filter:blur(6px)}
.field:focus{border-color:rgba(216,184,120,.6);box-shadow:0 0 0 4px rgba(216,184,120,.08)}
.field::placeholder{color:var(--dim)}
.hint{font-size:13px;color:var(--dim);margin-top:8px}
.btn{appearance:none;border:1px solid rgba(216,184,120,.55);background:linear-gradient(180deg,rgba(216,184,120,.16),rgba(216,184,120,.04));color:var(--gold2);padding:15px 34px;border-radius:999px;font:500 13px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;cursor:pointer;transition:all .35s;min-width:220px}
.btn:hover:not(:disabled){background:rgba(216,184,120,.2);box-shadow:0 0 30px rgba(216,184,120,.25);color:#fff}
.btn:disabled{opacity:.35;cursor:default}
.btn.teal{border-color:rgba(95,198,192,.55);color:#bff0ec;background:linear-gradient(180deg,rgba(95,198,192,.16),rgba(95,198,192,.03))}
.btn.ghost{background:none;border-color:var(--line);color:var(--mute)}
.btn.pulse{animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 34px rgba(95,198,192,.45)}}
.actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:22px 0}
.status{min-height:26px;text-align:center;font-family:var(--serif);font-style:italic;color:var(--mute);font-size:19px}
/* info */
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:9vh 0 4vh}
.card{border:1px solid var(--line);border-radius:18px;padding:24px;background:linear-gradient(180deg,rgba(18,26,44,.55),rgba(8,12,22,.45));backdrop-filter:blur(6px)}
.three h3{font-size:22px;color:var(--gold2);margin-bottom:6px}
.three p{margin:0;color:var(--mute);font-size:15px}
.three .k{font-size:11px;letter-spacing:.3em;color:var(--teal);text-transform:uppercase}
/* result */
#result{display:none;padding-top:5vh}
#result.on{display:block}
.sec-title{text-align:center;margin:0 0 26px}
.sec-title h2{font-size:clamp(30px,5vw,44px)}
.q{font-family:var(--serif);font-style:italic;font-size:22px;text-align:center;color:var(--ink);max-width:680px;margin:0 auto 34px}
.q small{display:block;font-style:normal;font-family:var(--sans);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--teal);margin-bottom:6px}
.hexhead{display:grid;grid-template-columns:150px 1fr;gap:28px;align-items:center}
.hexhead .hx{width:150px}
.hexhead .num{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--teal)}
.hexhead h3{font-size:clamp(28px,4.4vw,40px)}
.hexhead .zhn{font-family:var(--zh);font-size:24px;color:var(--gold)}
.tri{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.pill{font-size:12px;border:1px solid var(--line);border-radius:999px;padding:4px 12px;color:var(--mute)}
.text-block{margin-top:22px;border-top:1px solid var(--line);padding-top:18px}
.text-block h4{margin:0 0 6px;font:600 11px/1.4 var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--teal)}
.text-block .zh{font-size:20px;color:var(--gold2)}
.text-block .en{font-family:var(--serif);font-size:19px;margin-top:4px;color:var(--ink)}
.cite{font-size:12px;color:var(--dim);margin-top:12px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}
.lines li{list-style:none;border-top:1px solid var(--line);padding:14px 0}
.lines{padding:0;margin:0}
.lines .lab{font-family:var(--zh);color:var(--teal);font-size:14px}
.ai h4{font-family:var(--serif);font:500 22px var(--serif);color:var(--gold2);margin:18px 0 4px;letter-spacing:0;text-transform:none}
.ai p{margin:0;color:#cfd3d6}
.badge{display:inline-block;font-size:11px;letter-spacing:.2em;text-transform:uppercase;border:1px dashed rgba(95,198,192,.5);color:var(--teal);padding:4px 10px;border-radius:6px}
.paywall{text-align:center;border-color:rgba(216,184,120,.4);background:radial-gradient(100% 140% at 50% 0%,rgba(216,184,120,.12),rgba(8,12,22,.5))}
.paywall h3{font-size:30px}
.paywall ul{list-style:none;padding:0;color:var(--mute);margin:14px 0}
.price{font-family:var(--serif);font-size:34px;color:var(--gold2)}
.history{margin:7vh auto 0;max-width:680px}
.history h3{font-size:22px;text-align:center;margin-bottom:12px;color:var(--mute)}
.history a{display:flex;justify-content:space-between;gap:12px;padding:10px 4px;border-top:1px solid var(--line);color:var(--ink);font-size:14px}
.history a span:last-child{color:var(--dim);white-space:nowrap}
/* library */
.lib{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin:30px 0 60px}
.lib a{display:block;border:1px solid var(--line);border-radius:14px;padding:18px 12px;text-align:center;background:rgba(10,15,28,.5);transition:all .3s;color:var(--ink)}
.lib a:hover{border-color:rgba(216,184,120,.6);box-shadow:0 0 24px rgba(216,184,120,.15);transform:translateY(-2px)}
.lib .hx{width:54px;margin:0 auto 10px}
.lib .n{font-size:11px;letter-spacing:.24em;color:var(--teal)}
.lib .t{font-family:var(--serif);font-size:18px;line-height:1.2}
.lib .zh{color:var(--gold);font-size:16px}
.crumbs{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);margin:20px 0}
.pager{display:flex;justify-content:space-between;margin:30px 0 60px;font-size:14px}
/* modal */
.modal{position:fixed;inset:0;z-index:20;background:rgba(3,5,10,.75);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:20px}
.modal.on{display:flex}
.modal .card{max-width:440px;width:100%}
footer{position:relative;z-index:1;border-top:1px solid var(--line);margin-top:8vh;padding:28px 20px 40px;text-align:center;color:var(--dim);font-size:12.5px;line-height:1.7}
footer p{max-width:720px;margin:6px auto}
@media (max-width:760px){
  .three,.grid2{grid-template-columns:1fr}
  .hexhead{grid-template-columns:96px 1fr;gap:18px}.hexhead .hx{width:96px}
  .nav{gap:14px;font-size:11px}.brand{font-size:17px}
  .card{padding:20px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media (max-width:420px){.nav a:first-child{display:none}}
/* ===== v2 hero scene ===== */
.hero2{position:relative;min-height:100vh;min-height:100svh;overflow:hidden;z-index:1}
#scene{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero2 .top{position:relative;z-index:3}
.brand{font-weight:500}
.hero-inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;padding:0 18px 40px}
.hero2 .stage{width:min(94vw,60vh,660px);min-width:min(94vw,300px);margin:-6px auto 0}
.reveal-card .hx{width:22%;margin-bottom:6px}
.reveal-card .en{font-size:clamp(22px,4vw,34px)}
.reveal-card .num{font-size:11px}
.reveal-card{background:radial-gradient(circle at 50% 50%,rgba(5,7,12,.7) 0,rgba(5,7,12,.5) 22%,rgba(0,0,0,0) 26%)}
.ask{max-width:620px;width:100%;margin:6px auto 0;text-align:center}
.title{display:inline-block;padding:0 .25em 0 .45em;font-family:var(--serif);font-weight:500;text-transform:uppercase;letter-spacing:.2em;font-size:clamp(26px,4.6vw,54px);line-height:1.05;margin:0;
  background:linear-gradient(180deg,#fff4dc 0%,#e6c68a 55%,#b88c4a 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 40px rgba(230,190,120,.15)}
.title i{font-style:normal;margin:0 .35em;color:#c9a463;-webkit-text-fill-color:#c9a463}
.sub{margin:10px 0 0;font-size:clamp(10px,1.4vw,12.5px);letter-spacing:.34em;text-transform:uppercase;color:#b7b2a6}
.sub{max-width:100%}
@media (max-width:760px){.sub{letter-spacing:.2em;font-size:10px}}
.sub .zh{color:var(--gold);letter-spacing:.1em}
.hero2 .status{margin:6px 0 4px;min-height:24px;font-size:17px}
.inputbar{display:flex;align-items:center;gap:12px;width:100%;padding:0 20px;height:54px;border-radius:999px;border:1px solid rgba(216,184,120,.38);
  background:linear-gradient(180deg,rgba(14,16,22,.78),rgba(8,9,13,.78));backdrop-filter:blur(8px);box-shadow:inset 0 1px 0 rgba(255,240,210,.06),0 10px 40px rgba(0,0,0,.4);transition:border-color .3s,box-shadow .3s}
.inputbar:focus-within{border-color:rgba(230,198,138,.75);box-shadow:0 0 0 4px rgba(216,184,120,.08),0 10px 40px rgba(0,0,0,.4)}
.inputbar svg{width:18px;height:18px;color:var(--gold);flex:none;opacity:.8}
.inputbar input{text-align:left;flex:1;min-width:0;background:none;border:0;outline:0;color:var(--ink);font:400 16px var(--sans);letter-spacing:.02em}
.inputbar input::placeholder{color:#7d8088}
.inputbar input:disabled{color:#cfc8b8}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.hero2 .actions{margin:22px 0 10px}
.hero2 .hint{color:#7f838b}
.btn.gold{position:relative;overflow:hidden;border:0;color:#2a1d08;font-weight:600;padding:18px 44px;
  background:linear-gradient(180deg,#f6e2b4 0%,#dcb877 48%,#b98d4b 100%);box-shadow:0 0 0 1px rgba(255,236,196,.5) inset,0 8px 30px rgba(220,175,100,.28),0 0 60px rgba(220,175,100,.15)}
.btn.gold::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);transform:skewX(-20deg);transition:none}
.btn.gold:hover:not(:disabled){color:#1a1204;background:linear-gradient(180deg,#fbeac4,#e3c084 48%,#c09452);box-shadow:0 0 0 1px rgba(255,236,196,.7) inset,0 10px 40px rgba(230,185,110,.45),0 0 80px rgba(230,185,110,.25)}
.btn.gold:hover::after,.btn.gold.pulse::after{left:130%;transition:left .9s ease}
.btn.gold.pulse{animation:gpulse 1.8s ease-in-out infinite}
.btn.gold.pulse::after{animation:sweep 1.8s ease-in-out infinite}
@keyframes sweep{0%{left:-60%}60%,100%{left:130%}}
@keyframes gpulse{50%{box-shadow:0 0 0 1px rgba(255,236,196,.7) inset,0 0 50px rgba(240,200,130,.6)}}
.btn.gold:disabled{opacity:.55}
.btn.ghost{background:rgba(8,10,14,.55);backdrop-filter:blur(6px)}
@media (max-width:760px){
  .hero2 .stage{width:min(96vw,52vh);margin-top:4px}
  .title{letter-spacing:.14em}
  .inputbar{height:50px}
  .btn.gold{padding:17px 34px}
}
@media (prefers-reduced-motion:reduce){.btn.gold::after{display:none}}
@media (max-width:760px){.title{font-size:clamp(20px,6.4vw,40px);letter-spacing:.12em;padding:0 .1em 0 .22em}.title i{margin:0 .22em}}
/* ===== v3: 3D oracle hero ===== */
.hero3{position:relative;height:100vh;height:100svh;min-height:600px;overflow:hidden;z-index:1;background:#05070d url(../img/hero-fallback.jpg) center/cover}
.gl-host{position:absolute;inset:0;opacity:0;transition:opacity 1.2s}
.gl-host.ready{opacity:1}
.gl-host canvas.gl{width:100%!important;height:100%!important;display:block;touch-action:pan-y;cursor:grab}
.hero3 .top{position:relative;z-index:3}
.h3-top{position:relative;z-index:2;text-align:center;padding:0 18px;pointer-events:none;margin-top:1vh}
.h3-top>*{pointer-events:auto}
.h3-top .eyebrow{color:#d8b878;opacity:.8}
.h3-top .title{margin-top:8px}
.sub2{color:#c3bdb0;margin:10px auto 0;font-family:var(--serif);font-size:clamp(16px,1.6vw,20px);font-style:italic;max-width:560px}
.inputbar.big{max-width:620px;margin:18px auto 0;padding:0 6px 0 20px;height:58px}
.inputbar.big .btn.gold{padding:14px 24px;min-width:0;font-size:12px;white-space:nowrap}
.h3-bottom{position:absolute;left:0;right:0;bottom:0;z-index:2;text-align:center;padding:0 18px 18px;pointer-events:none}
.h3-bottom>*{pointer-events:auto}
.h3-bottom .status{font-size:16px;color:#bdb6a6;text-shadow:0 1px 8px #000}
.h3-bottom .actions{margin:8px 0}
.feats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;max-width:980px;margin:6px auto 0;border-top:1px solid rgba(216,184,120,.18)}
.feats div{padding:12px 8px 0;border-left:1px solid rgba(216,184,120,.14)}.feats div:first-child{border-left:0}
.feats b{display:block;font:500 12px var(--sans);letter-spacing:.22em;text-transform:uppercase;color:#e3c690}
.feats span{font-size:12.5px;color:#8f939a}
.hero3 .reveal-card{position:absolute;inset:auto;left:var(--ring-cx,50%);top:calc(var(--ring-cy,60%) + var(--ring-ry,100px) * .15);transform:translate(-50%,0);background:none;z-index:2;text-shadow:0 2px 12px #000}
.hero3 .reveal-card .en{font-size:clamp(22px,3vw,34px)}
.tile-tip{position:absolute;z-index:4;left:50%;transform:translate(-50%,0);bottom:calc(100% - var(--ring-cy,60%) - var(--ring-ry,100px) - 64px);
  background:rgba(8,9,13,.85);border:1px solid rgba(216,184,120,.5);border-radius:12px;padding:10px 16px;backdrop-filter:blur(8px);text-align:center;font-size:13px;box-shadow:0 10px 30px rgba(0,0,0,.5);animation:tipin .35s ease}
.tile-tip b{font-family:var(--serif);font-size:20px;font-weight:500;display:block;color:#f1dcae}
.tile-tip .zh{color:var(--gold)}
@keyframes tipin{from{opacity:0;transform:translate(-50%,6px)}}
@media (max-width:760px){
  .hero3{min-height:640px}
  .h3-top{margin-top:0}
  .h3-top .eyebrow{font-size:10px}
  .sub2{font-size:15px;margin-top:6px}
  .inputbar.big{height:52px;margin-top:14px;padding-left:14px}
  .inputbar.big input{font-size:15px}
  .inputbar.big .btn.gold{padding:12px 14px;font-size:10.5px;letter-spacing:.16em}
  .feats{display:none}
  .h3-bottom{padding-bottom:22px}
}
.hero3 .reveal-card{padding:6px 22px 8px;border-radius:14px;background:radial-gradient(closest-side,rgba(4,5,8,.75),rgba(4,5,8,0))}

.navr{display:flex;align-items:center;gap:18px;position:relative}
.sound-btn{width:38px;height:38px;border-radius:50%;border:1px solid rgba(216,184,120,.4);background:rgba(8,9,13,.55);color:#d8b878;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(6px);transition:all .3s;padding:0}
.sound-btn:hover{border-color:rgba(240,210,150,.8);box-shadow:0 0 18px rgba(216,184,120,.3)}
.sound-btn svg{width:18px;height:18px}.sound-btn .x{display:none}
.sound-btn:not(.on) .w{display:none}.sound-btn:not(.on) .x{display:inline}.sound-btn:not(.on){color:#7d8088}
.sound-hint{position:absolute;right:0;top:46px;white-space:nowrap;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#bfae86;opacity:.85;animation:hintp 2.4s ease-in-out infinite;transition:opacity .8s;pointer-events:none}
.sound-hint.gone{opacity:0;animation:none}
@keyframes hintp{50%{opacity:.4}}
@media (max-width:420px){.navr{gap:10px}.sound-btn{width:34px;height:34px}}
/* v4: personal result first screen */
#result{transition:opacity .8s}#result:not(.on){opacity:0}
.yh{text-align:center;max-width:720px;margin:0 auto;padding:6vh 0 2vh}
.yh-hx{width:min(42vw,190px);margin:18px auto 22px;display:block}
.yh-hx rect{fill:url(#none);fill:#e6c68a;filter:drop-shadow(0 0 10px rgba(241,220,174,.45))}
.yh-hx rect.chg{fill:var(--teal)}
.yh-name{font-family:var(--serif);font-weight:400;font-size:clamp(44px,8vw,78px);line-height:1;letter-spacing:.04em;background:linear-gradient(180deg,#fff4dc,#e6c68a 60%,#b88c4a);-webkit-background-clip:text;background-clip:text;color:transparent}
.yh-sub{margin-top:10px;font-size:13px;letter-spacing:.24em;text-transform:uppercase;color:var(--mute)}
.yh-sub .zh{color:var(--gold);font-size:16px;letter-spacing:.1em}
.yh-date{margin-top:6px;font-size:12px;color:var(--dim);letter-spacing:.08em}
.yh-q{margin:5vh auto 0;padding:26px 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.yh-q p{margin:10px 0 0;font-family:var(--serif);font-style:italic;font-size:clamp(22px,3.4vw,30px);line-height:1.35;color:#f1e7cf}
.yh-intro{margin-top:4vh;text-align:left}
.yh-intro h3{font-size:26px;color:var(--gold2);text-align:center;margin-bottom:10px}
.yh-intro p{font-family:var(--serif);font-size:20px;line-height:1.6;color:#d9d4c8;margin:0}
.keep{text-align:center}.keep h3{font-size:32px}.keep p{color:var(--mute);max-width:460px;margin:8px auto 0}
.tile-tip{padding:7px 14px;font-size:12.5px;color:var(--mute);border-color:rgba(216,184,120,.25);border-radius:999px}
.tile-tip .lib-k{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--dim);margin-right:4px}
.tile-tip .zh{font-size:13px}
/* ---------- v5: productization ---------- */
.hero3::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 50% 55%,rgba(3,4,7,0) 40%,rgba(3,4,7,.45) 100%),linear-gradient(rgba(3,4,7,.18),rgba(3,4,7,.18))}
.ritual{position:absolute;z-index:3;left:var(--ring-cx,50%);top:var(--ring-cy,60%);transform:translate(-50%,-50%);width:min(380px,90vw);padding:16px 18px 12px;border-radius:16px;background:rgba(5,6,10,.78);border:1px solid rgba(216,184,120,.22);backdrop-filter:blur(6px);opacity:0;transition:opacity .5s}
.ritual.on{opacity:1}
.rt-k{font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--dim);text-align:center;margin-bottom:8px}
.rt{list-style:none;margin:0;padding:0;display:flex;flex-direction:column-reverse;gap:5px}
.rt li{display:grid;grid-template-columns:88px 54px 18px 64px 1fr;align-items:center;gap:8px;font-size:12px;color:var(--mute);opacity:.12;transition:opacity .35s}
.rt li.on{opacity:1}
.rt-l{font-family:var(--serif);font-size:14px;color:#d9cfb8;white-space:nowrap}
.rt-c{display:flex;gap:5px}
.coin{width:12px;height:12px;border-radius:50%;display:inline-block;border:1.5px solid #d8b878;transform:rotateY(90deg);transition:transform .35s calc(var(--k,0)*60ms)}
.coin.h{background:radial-gradient(circle at 40% 35%,#fff3d0,#d8b878 60%,#8a6a35);box-shadow:0 0 8px rgba(241,210,150,.7)}
.coin.t{background:transparent;opacity:.75}
.rt li.on .coin{transform:none}
.rt-c .coin:nth-child(2){--k:1}.rt-c .coin:nth-child(3){--k:2}
.rt-v{font-family:var(--serif);font-size:17px;color:#f1dcae;text-align:center}
.rt .ln{width:64px;height:8px}.rt .ln rect{fill:#e6c68a}.rt .ln.mv rect{fill:var(--teal)}
.rt-t{white-space:nowrap;font-size:11px;letter-spacing:.04em}.rt-t.mv{color:var(--teal)}
@media (max-width:640px){.ritual{width:94vw;padding:12px 10px 10px}.rt li{grid-template-columns:76px 48px 16px 52px 1fr;gap:6px}.rt .ln{width:52px}.rt-l{font-size:13px}.rt-t{font-size:10px}}

.rd{max-width:720px;margin:4.5vh auto 0;position:relative}
.rd>.eyebrow{text-align:left}
.rd h3{font-size:clamp(24px,3.4vw,30px);color:var(--gold2);margin:6px 0 12px;font-weight:500}
.rd h4{font-family:var(--sans);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--teal);margin:18px 0 6px;font-weight:600}
.rd p{font-family:var(--serif);font-size:20px;line-height:1.65;color:#ddd7ca;margin:0 0 12px}
.rd.heart{padding:30px 30px 18px;border-radius:18px;background:linear-gradient(180deg,rgba(216,184,120,.09),rgba(216,184,120,.02));border:1px solid rgba(216,184,120,.28)}
.rd.heart .rd-b p{font-size:clamp(22px,2.8vw,26px);line-height:1.55;color:#f3ead6}
.rd .wait{color:var(--dim);font-style:italic;animation:breathe 2s ease-in-out infinite}
@keyframes breathe{50%{opacity:.4}}
.disc{font-family:var(--sans)!important;font-size:12px!important;line-height:1.5!important;color:var(--dim)!important;margin:12px 0 0!important}
.rd.locked .rd-b{filter:blur(6px);opacity:.55;user-select:none;pointer-events:none;max-height:150px;overflow:hidden;-webkit-mask:linear-gradient(#000 40%,transparent)}
.rd.locked{cursor:pointer}
.lock-note{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#e3c690;padding:7px 14px;border:1px solid rgba(216,184,120,.35);border-radius:999px;background:rgba(5,6,10,.8);white-space:nowrap}
.lock-note::before{content:"";display:inline-block;width:8px;height:10px;margin-right:8px;border:1.5px solid currentColor;border-radius:2px;vertical-align:-1px}
.rd.emph{padding:22px 24px;border-left:2px solid var(--teal);background:rgba(95,198,192,.05);border-radius:4px 14px 14px 4px}
.rd .lines li .lab{color:var(--teal)}
.rd .lines li .en{font-family:var(--serif);font-size:18px;color:#d9d4c8}
.rd .pw{display:grid;grid-template-columns:1fr 1fr;gap:0 26px}.rd .pw h4{margin-top:4px}
@media (max-width:640px){.rd .pw{grid-template-columns:1fr}.rd.heart{padding:22px 18px 14px}.rd p{font-size:18px}}
.rd .ed{font-size:12px;color:var(--dim)}
.rd .refl{font-style:italic;color:#f1e7cf}
.cl-h{display:flex;align-items:center;gap:16px;margin:8px 0 10px}.cl-h svg{width:52px;flex:none}.cl-h .num{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--teal)}.cl-h b{font-family:var(--serif);font-size:22px;font-weight:500}.cl-h .zh{color:var(--gold)}
.unlock{max-width:720px;margin:3.5vh auto 0;text-align:center;border-color:rgba(216,184,120,.4)}
.unlock h3{font-size:30px}
.unlock-list{list-style:none;padding:0;margin:14px auto 6px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 10px;max-width:560px}
.unlock-list li{font-size:13px;padding:6px 12px;border:1px solid rgba(216,184,120,.25);border-radius:999px;color:#ddd2b8}
.unlock-list li::before{content:"✦ ";color:var(--gold)}
.paywall .unlock-list{justify-content:flex-start}
details.classic{max-width:720px;margin:5vh auto 0}
details.classic summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
details.classic summary::-webkit-details-marker{display:none}
details.classic summary::after{content:"+";font-size:22px;color:var(--gold)}details.classic[open] summary::after{content:"–"}
.cl-t{font-size:13px;color:var(--dim);flex:1;text-align:right}
.actions.ask{justify-content:center;margin:6vh 0 2vh}
.yh-sub .arrow{color:var(--teal)}
.how{margin:12vh 0 0;text-align:center}.how h2,.faq h2{font-size:clamp(28px,4vw,40px);font-weight:400;margin:6px 0 0}
.how .three{margin-top:4vh;text-align:left}
.faq{max-width:760px;margin:10vh auto 0}.faq h2{text-align:center;margin-bottom:3vh}.faq>.eyebrow{text-align:center}
.faq details{border-bottom:1px solid var(--line);padding:14px 0}.faq summary{cursor:pointer;font-family:var(--serif);font-size:20px;color:#efe6d2}
.faq p{color:var(--mute);margin:10px 0 0;line-height:1.6}
.rt li:not(.on) .rt-v,.rt li:not(.on) .rt-t,.rt li:not(.on) .ln{visibility:hidden}.rt li{opacity:.3}.rt li.on{opacity:1}
@media (max-width:640px){.cl-t{display:none}}