@import "https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap";
.chinese-font{font-family:Noto Serif SC,serif}.oracle-iching-scope{overflow-x:hidden}.cosmic-bg{z-index:0;pointer-events:none;background:radial-gradient(at 20% 20%,#581c8726 0%,#0000 50%),radial-gradient(at 80% 80%,#1e3a8a26 0%,#0000 50%),radial-gradient(#78350f1a 0%,#0000 60%),linear-gradient(#050510 0%,#0a0a20 50%,#050510 100%);position:fixed;inset:0}.nebula{filter:blur(80px);opacity:.4;pointer-events:none;border-radius:50%;animation:30s ease-in-out infinite nebulaDrift;position:fixed}@keyframes nebulaDrift{0%,to{transform:translate(0)scale(1)}33%{transform:translate(30px,-20px)scale(1.1)}66%{transform:translate(-20px,30px)scale(.9)}}.sacred-geometry{opacity:.05;pointer-events:none;width:clamp(320px,56vw,520px);height:clamp(320px,56vw,520px);animation:120s linear infinite rotateGeometry;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes rotateGeometry{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}.particle{pointer-events:none;z-index:1;border-radius:50%;animation:linear infinite floatParticle;position:fixed}@keyframes floatParticle{0%{opacity:0;transform:translateY(100vh)rotate(0)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(-100vh)rotate(720deg)}}.orb{filter:blur(2px);z-index:1;pointer-events:none;border-radius:50%;animation:8s ease-in-out infinite orbFloat;position:fixed}@keyframes orbFloat{0%,to{transform:translate(0)}25%{transform:translate(20px,-30px)}50%{transform:translate(-10px,-50px)}75%{transform:translate(-30px,-20px)}}.yin-yang-container{width:clamp(112px,18vw,140px);height:clamp(112px,18vw,140px);position:relative}.yin-yang-glow{background:radial-gradient(circle,#ffd7004d 0%,#0000 70%);border-radius:50%;animation:4s ease-in-out infinite glowPulse;position:absolute;inset:-16px}.yin-yang-ring{border:1px solid #ffd70033;border-radius:50%;animation:4s ease-in-out infinite ringExpand;position:absolute;inset:-24px}.yin-yang-ring:nth-child(2){animation-delay:1s}.yin-yang-ring:nth-child(3){animation-delay:2s}@keyframes ringExpand{0%{opacity:.5;transform:scale(1)}to{opacity:0;transform:scale(1.5)}}.yin-yang{will-change:transform;border-radius:50%;width:clamp(112px,18vw,140px);height:clamp(112px,18vw,140px);animation:25s linear infinite rotate;position:relative;box-shadow:0 0 50px #ffd70033}.yin-yang svg{width:100%;height:100%;display:block}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes glowPulse{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}.coins-container{perspective:1000px}.coin{color:#3d2914;width:78px;height:78px;transform-style:preserve-3d;background:radial-gradient(at 30% 30%,#fff7cc 0%,#0000 50%),linear-gradient(145deg,gold 0%,#b8860b 50%,#8b6914 100%);border:4px solid #daa520;border-radius:50%;justify-content:center;align-items:center;font-size:32px;transition:all .3s;display:flex;position:relative;box-shadow:0 8px 32px #ffd70066,0 0 60px #ffd70033,inset 0 2px 4px #ffffff80,inset 0 -2px 4px #0000004d}.coin:before{content:"";border:2px solid #8b691480;border-radius:50%;position:absolute;inset:8px}.coin:after{content:"";background:linear-gradient(145deg,#3d2914 0%,#5d4924 100%);border-radius:2px;width:20px;height:20px;position:absolute;transform:rotate(45deg)}.coin:hover{transform:translateY(-5px)rotateY(15deg);box-shadow:0 15px 40px #ffd70080,0 0 80px #ffd7004d}.coin.flipping{animation:.8s ease-in-out coinFlip3D}@keyframes coinFlip3D{0%{transform:rotateX(0)rotateY(0)translateY(0)}25%{transform:rotateX(180deg)rotateY(90deg)translateY(-100px)}50%{transform:rotateX(360deg)rotateY(180deg)translateY(-120px)}75%{transform:rotateX(540deg)rotateY(270deg)translateY(-60px)}to{transform:rotateX(720deg)rotateY(360deg)translateY(0)}}.coin.result-yang{background:radial-gradient(at 30% 30%,#fff7cc 0%,#0000 50%),linear-gradient(145deg,gold 0%,#ffed4a 30%,#b8860b 70%,#daa520 100%);box-shadow:0 8px 32px #ffd70099,0 0 80px #ffd70066}.coin.result-yin{background:radial-gradient(at 30% 30%,#a0a0a0 0%,#0000 50%),linear-gradient(145deg,#708090 0%,#4a5568 50%,#2d3748 100%);border-color:#4a5568;box-shadow:0 8px 32px #64648c66,0 0 60px #64648c33}.hexagram-glow{filter:blur(20px);pointer-events:none;background:radial-gradient(#ffd70026 0%,#0000 70%);animation:3s ease-in-out infinite hexGlow;position:absolute;inset:-40px}@keyframes hexGlow{0%,to{opacity:.5}50%{opacity:1}}.question-container{position:relative}.question-aura{filter:blur(8px);opacity:0;background:linear-gradient(45deg,#ffd7004d,#9333ea4d,#3b82f64d,#ffd7004d) 0 0/300% 300%;border-radius:30px;transition:opacity .5s;animation:8s infinite auraShift;position:absolute;inset:-4px}.question-container:focus-within .question-aura{opacity:1}@keyframes auraShift{0%,to{background-position:0%}50%{background-position:100%}}.question-input{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:1;background:#0a0a1ecc;border:1px solid #ffd70033;transition:all .5s;position:relative}.question-input:focus{border-color:#ffd70099;outline:none;box-shadow:0 0 40px #ffd70026,inset 0 0 20px #ffd7000d}.oracle-btn{cursor:pointer;background:linear-gradient(145deg,#1a0a2e 0%,#2d1b4e 50%,#1a0a2e 100%) padding-box padding-box;border:2px solid #0000;transition:all .4s;position:relative;overflow:hidden}.oracle-btn:before{content:"";border-radius:inherit;z-index:-1;opacity:.7;background:linear-gradient(45deg,gold,#ff6b6b,#a855f7,#3b82f6,gold) 0 0/400% 400%;animation:6s infinite borderGlow;position:absolute;inset:-2px}.oracle-btn:after{content:"";background:linear-gradient(45deg,#0000 40%,#ffffff1a 50%,#0000 60%);width:200%;height:200%;transition:all .6s;position:absolute;top:-50%;left:-50%;transform:rotate(45deg)}.oracle-btn:hover:after{left:100%}.oracle-btn:hover{transform:translateY(-3px);box-shadow:0 10px 40px #ffd7004d,0 0 60px #a855f733}@keyframes borderGlow{0%,to{background-position:0%}50%{background-position:100%}}.reading-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:linear-gradient(145deg,#1a0a2ef2 0%,#0d1f2df2 50%,#1a0a2ef2 100%);border:1px solid #ffd70026;position:relative;overflow:hidden;transform:translateZ(0);box-shadow:0 20px 50px #00000080,inset 0 2px 5px #ffd7000d,inset 0 -2px 5px #00000080}.reading-card:before{content:"";background:linear-gradient(90deg,#0000,#ffd70080,#0000);height:1px;position:absolute;top:0;left:0;right:0}.card-shimmer{opacity:.5;pointer-events:none;background:linear-gradient(145deg,#0000 0%,#ffd70005 20%,#0000 40%);position:absolute;inset:0}.corner-decoration{pointer-events:none;width:50px;height:50px;position:absolute}.corner-tl{top:-1px;left:-1px}.corner-tr{top:-1px;right:-1px}.corner-bl{bottom:-1px;left:-1px}.corner-br{bottom:-1px;right:-1px}.corner-decoration svg{width:100%;height:100%}.hexagram-container{position:relative}.hexagram-glow{filter:blur(20px);background:radial-gradient(#ffd70026 0%,#0000 70%);animation:3s ease-in-out infinite hexGlow;position:absolute;inset:-40px}.hexagram-line{height:14px;margin:10px 0;transition:all .5s;position:relative}.hexagram-line.yang{background:linear-gradient(90deg,#ffd7004d 0%,gold 10%,#ffed4a 50%,gold 90%,#ffd7004d 100%);border-radius:7px;box-shadow:0 0 20px #ffd70099,0 0 40px #ffd7004d,inset 0 2px 4px #ffffff4d}.hexagram-line.yin{justify-content:space-between;display:flex}.hexagram-line.yin span{background:linear-gradient(90deg,#ffd7004d 0%,gold 20%,#ffed4a 50%,gold 80%,#ffd7004d 100%);border-radius:7px;width:40%;height:100%;box-shadow:0 0 20px #ffd70099,0 0 40px #ffd7004d,inset 0 2px 4px #ffffff4d}.hexagram-line.changing{animation:2s ease-in-out infinite lineTransform}.hexagram-line.changing:after{content:"◈";color:#ff6b6b;font-size:14px;animation:1s ease-in-out infinite pulseSymbol;position:absolute;top:50%;right:-30px;transform:translateY(-50%)}@keyframes lineTransform{0%,to{filter:brightness()hue-rotate()}50%{filter:brightness(1.4)hue-rotate(10deg)}}@keyframes pulseSymbol{0%,to{opacity:.5;transform:translateY(-50%)scale(1)}50%{opacity:1;transform:translateY(-50%)scale(1.2)}}@media (max-width:768px){.nebula{filter:blur(60px);opacity:.3}.coin{width:72px;height:72px;font-size:26px}.hexagram-glow{inset:-24px}.corner-decoration{width:36px;height:36px}}