@import "https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;600&family=IM+Fell+English:ital@0;1&display=swap";:root{--ink:#110b04;--parchment:#fdf3dc;--ember:#b85a22;--gold:#d4a040;--gold-light:#eac878;--yes-clr:#6db86d;--no-clr:#c07070;--ask-clr:#d4a040;--ff-display:"IM Fell English", Georgia, serif;--ff-hanzi:"Noto Serif SC", "SimSun", serif;--ff-body:"Noto Serif SC", Georgia, serif}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{background:var(--ink);min-height:100dvh;color:var(--parchment);font-family:var(--ff-body);background-image:radial-gradient(90% 55% at 50% -5%,#4a2a0a 0%,#0000 65%),radial-gradient(60% 40% at 15% 90%,#3e1808 0%,#0000 55%);font-weight:400;position:relative;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:20;opacity:.03;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:200px 200px;position:fixed;inset:0}body:after{content:"";pointer-events:none;z-index:19;background:radial-gradient(90% 90%,#0000 40%,#0000004d 100%);position:fixed;inset:0}canvas#particleCanvas{z-index:1;pointer-events:none;width:100%;height:100%;position:fixed;inset:0}.back-nav{z-index:30;padding:.75rem 1.2rem;position:fixed;top:0;left:0;right:0}.back-btn{color:var(--gold-light);font-family:var(--ff-display);cursor:pointer;-webkit-backdrop-filter:blur(10px);-webkit-tap-highlight-color:transparent;background:#110b04b8;border:1px solid #d4a04038;border-radius:999px;align-items:center;gap:.35rem;padding:.38rem .9rem .38rem .6rem;font-size:.88rem;font-style:italic;text-decoration:none;transition:background .2s,border-color .2s;display:inline-flex}.back-btn:hover{background:#1e1206e0;border-color:#d4a0406b}.back-arrow{color:var(--gold);font-size:1.1rem;line-height:1}.app{z-index:2;flex-direction:column;align-items:center;gap:1.6rem;max-width:420px;min-height:100dvh;margin:0 auto;padding:4.5rem 1.5rem 2rem;display:flex;position:relative}.header{text-align:center;flex-direction:column;align-items:center;gap:.2rem;display:flex}.hanzi{font-family:var(--ff-hanzi);color:var(--gold);text-shadow:0 0 20px #c9943a80;font-size:clamp(2.8rem,11vw,3.6rem);line-height:1}h1{font-family:var(--ff-display);letter-spacing:.05em;color:var(--parchment);font-size:clamp(1.5rem,5.5vw,2rem);font-weight:400;line-height:1}.subtitle{letter-spacing:.22em;text-transform:uppercase;color:var(--gold-light);opacity:.9;margin-top:.1rem;font-size:.72rem}.instruction{font-family:var(--ff-display);color:var(--parchment);opacity:.85;text-align:center;font-size:clamp(.95rem,3.8vw,1.05rem);font-style:italic;line-height:1.7;transition:opacity .8s}.instruction.faded{opacity:.6}.stage{perspective:900px;perspective-origin:50%;flex:none;justify-content:center;align-items:flex-end;gap:clamp(1.5rem,6vw,3rem);padding:.5rem 0;display:flex}.block-slot{width:clamp(110px,30vw,140px);height:clamp(170px,45vw,210px);transform-style:preserve-3d;will-change:transform;position:relative}.block-slot svg{width:100%;height:100%;display:block;overflow:visible}@keyframes gentle-float{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-6px)rotate(1.2deg)}}@keyframes dice-roll-hold-1{0%{transform:translateY(-20px)rotateX(0)rotateY(0)rotate(-12deg)scale(1.05)}25%{transform:translateY(-45px)rotateX(180deg)rotateY(90deg)rotate(18deg)scale(1.12)}50%{transform:translateY(-15px)rotateX(360deg)rotateY(180deg)rotate(-15deg)scale(.96)}75%{transform:translateY(-40px)rotateX(540deg)rotateY(270deg)rotate(20deg)scale(1.08)}to{transform:translateY(-20px)rotateX(720deg)rotateY(360deg)rotate(-12deg)scale(1.05)}}@keyframes dice-roll-hold-2{0%{transform:translateY(-15px)rotateX(0)rotateY(0)rotate(14deg)scale(1.05)}25%{transform:translateY(-42px)rotateX(-180deg)rotateY(-90deg)rotate(-20deg)scale(1.1)}50%{transform:translateY(-25px)rotateX(-360deg)rotateY(-180deg)rotate(12deg)scale(.98)}75%{transform:translateY(-50px)rotateX(-540deg)rotateY(-270deg)rotate(-16deg)scale(1.12)}to{transform:translateY(-15px)rotateX(-720deg)rotateY(-360deg)rotate(14deg)scale(1.05)}}@keyframes dice-roll-release-1{0%{transform:translateY(-25px)rotateX(0)rotateY(0)rotate(-12deg)scale(1.06)}16%{transform:translateY(-85px)rotateX(360deg)rotateY(180deg)rotate(35deg)scale(1.22)}36%{transform:translateY(-50px)rotateX(720deg)rotateY(360deg)rotate(-25deg)scale(1.1)}56%{transform:translateY(12px)rotateX(1080deg)rotateY(540deg)rotate(18deg)scale(.93)}70%{transform:translateY(-26px)rotateX(1260deg)rotateY(630deg)rotate(-10deg)scale(1.05)}82%{transform:translateY(6px)rotateX(1380deg)rotateY(690deg)rotate(4deg)scale(.97)}92%{transform:translateY(-4px)rotateX(1425deg)rotateY(712deg)rotate(-1.5deg)scale(1.01)}to{transform:translateY(0)rotateX(1440deg)rotateY(720deg)rotate(0)scale(1)}}@keyframes dice-roll-release-2{0%{transform:translateY(-20px)rotateX(0)rotateY(0)rotate(14deg)scale(1.06)}16%{transform:translateY(-80px)rotateX(-360deg)rotateY(-180deg)rotate(-30deg)scale(1.2)}36%{transform:translateY(-46px)rotateX(-720deg)rotateY(-360deg)rotate(22deg)scale(1.08)}56%{transform:translateY(14px)rotateX(-1080deg)rotateY(-540deg)rotate(-16deg)scale(.92)}70%{transform:translateY(-22px)rotateX(-1260deg)rotateY(-630deg)rotate(8deg)scale(1.04)}82%{transform:translateY(5px)rotateX(-1380deg)rotateY(-690deg)rotate(-3deg)scale(.98)}92%{transform:translateY(-3px)rotateX(-1425deg)rotateY(-712deg)rotate(1deg)scale(1.01)}to{transform:translateY(0)rotateX(-1440deg)rotateY(-720deg)rotate(0)scale(1)}}.block-slot.resting svg{animation:4s ease-in-out infinite gentle-float}.block-slot.resting:nth-child(2) svg{animation-delay:-2s}.block-slot.rolling-hold{animation:.46s linear infinite dice-roll-hold-1}.block-slot.rolling-hold:nth-child(2){animation:.5s linear infinite dice-roll-hold-2}.block-slot.rolling-release{animation:2s cubic-bezier(.22,1,.36,1) both dice-roll-release-1}.block-slot.rolling-release:nth-child(2){animation:2s cubic-bezier(.22,1,.36,1) both dice-roll-release-2}.result-banner{text-align:center;border:1px solid #c9943a33;border-radius:3px;flex-direction:column;gap:.8rem;width:100%;padding:2rem;animation:.55s both banner-in;display:none}.result-banner.visible{display:flex}@keyframes banner-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.result-banner.yes{background:#7db87d0f;border-color:#7db87d59}.result-banner.no{background:#c070700f;border-color:#c0707059}.result-banner.ask{background:#c9943a0f;border-color:#c9943a66}.result-verdict{font-family:var(--ff-hanzi);font-size:clamp(2.2rem,10vw,3rem);font-weight:600;line-height:1}.yes .result-verdict{color:var(--yes-clr)}.no .result-verdict{color:var(--no-clr)}.ask .result-verdict{color:var(--ask-clr)}.result-name{letter-spacing:.16em;text-transform:uppercase;opacity:.85;color:var(--parchment);font-size:1rem}.result-meaning{font-family:var(--ff-display);color:var(--parchment);font-size:clamp(1.3rem,5.5vw,1.6rem);line-height:1.7}.cast-btn{appearance:none;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:radial-gradient(circle at 38% 32%,#9e2a20 0%,#6b1212 50%,#3a0808 100%);border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:clamp(120px,38vw,155px);height:clamp(120px,38vw,155px);transition:transform .16s,box-shadow .16s;display:flex;position:relative;box-shadow:0 0 0 1px #b4503c59,0 0 0 7px #a032281a,0 10px 36px #000000bf,inset 0 2px 8px #ffd28238,inset 0 -4px 10px #00000080}.cast-btn:before{content:"";pointer-events:none;border:1px solid #ffa08226;border-radius:50%;position:absolute;inset:9px}.cast-btn:active:not(:disabled),.cast-btn.holding{transform:scale(.92);box-shadow:0 0 0 2px #d4a04099,0 0 24px #d4a04059,0 5px 18px #000000b3,inset 0 2px 10px #ffd28259}.cast-btn:disabled{opacity:.5;cursor:default}.cast-label{font-family:var(--ff-hanzi);color:var(--parchment);letter-spacing:.1em;text-shadow:0 1px 5px #000000b3;-webkit-user-select:none;user-select:none;font-size:clamp(1rem,4vw,1.15rem);font-weight:600}.tally{align-items:center;gap:1rem;animation:.4s both fadeup;display:none}.tally.visible{display:flex}@keyframes fadeup{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.tally-item{align-items:center;gap:.4rem;display:flex}.tally-dot{border-radius:50%;width:6px;height:6px}.dot-yes{background:var(--yes-clr)}.dot-no{background:var(--no-clr)}.dot-ask{background:var(--ask-clr)}.tally-count{color:var(--parchment);min-width:1ch;font-size:.85rem}.tally-label{letter-spacing:.12em;text-transform:uppercase;color:var(--parchment);opacity:.35;font-size:.62rem}.tally-sep{background:#c9943a33;width:1px;height:14px}.footer{text-align:center;margin-top:auto}.footer p{letter-spacing:.12em;color:var(--parchment);opacity:.5;font-size:.7rem}
