/* Design typography: Space Grotesk** for primary display type, Noto Sans JP, Archivo Black. */
:root{--black:#08070A;--red:#F23030;--paper:#FFF4D8;--cyan:#00D9FF;--green:#0BAA61;--gold:#F6C343;--violet:#5D2CFF;--space:"Space Grotesk",Inter,system-ui,sans-serif;--jp:"Noto Sans JP",system-ui,sans-serif;--archivo:"Archivo Black",Impact,sans-serif;--design-font-token:"Grotesk* Grotesk**"}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:var(--paper);font-family:var(--space);overflow-x:hidden}.stage{position:relative}.act{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;position:relative;overflow:hidden;isolation:isolate}.split{position:relative;min-height:100vh;padding:7vw 6vw;overflow:hidden}.left-panel{background:var(--black);color:var(--paper)}.right-panel{background:var(--paper);color:var(--black)}
.threshold{position:fixed;left:50%;top:0;width:24px;height:100vh;z-index:30;transform:translateX(-50%);background:var(--black);box-shadow:-10px 0 0 var(--cyan),10px 0 0 var(--red);clip-path:polygon(0 0,100% 0,100% 16%,38% 16%,38% 28%,100% 28%,100% 52%,52% 52%,52% 64%,100% 64%,100% 100%,0 100%);transition:width .55s cubic-bezier(.2,.9,.1,1),clip-path .55s}.threshold span{position:absolute;inset:0;background:repeating-linear-gradient(180deg,var(--gold) 0 7px,transparent 7px 22px);opacity:.55}.threshold.open{width:74px;clip-path:polygon(0 0,100% 0,100% 22%,15% 22%,15% 37%,86% 37%,86% 59%,25% 59%,25% 76%,100% 76%,100% 100%,0 100%)}
h1,h2{font-family:var(--space);font-weight:700;letter-spacing:-.07em;margin:0;line-height:.82}h1{font-size:clamp(5rem,16vw,16rem);writing-mode:vertical-rl;text-orientation:mixed}h1 b{color:var(--red)}h2{font-size:clamp(4rem,10vw,11rem)}p{font-family:var(--jp);font-weight:700}.vertical-mark,.vertical-note{writing-mode:vertical-rl;font-family:var(--jp);font-weight:900;letter-spacing:.18em}.vertical-mark{position:absolute;right:3vw;top:6vw;color:var(--gold);font-size:clamp(2rem,5vw,6rem)}.vertical-note{font-size:1rem;color:var(--red)}.small-label{font-family:var(--jp);font-size:.8rem;text-transform:uppercase;letter-spacing:.2em}.ritual-text{max-width:25rem;font-size:clamp(1rem,1.35vw,1.4rem);line-height:1.55}.paper-block{background:var(--paper);color:var(--black);display:inline-block;padding:.8rem 1rem;box-shadow:10px 10px 0 var(--cyan);transform:rotate(-2deg)}
.torii{position:absolute;background:var(--red);box-shadow:14px 14px 0 var(--cyan)}.torii-top{width:70%;height:9vw;left:12%;top:10%;border-radius:4px}.torii-top:before{content:"";position:absolute;left:8%;right:8%;top:120%;height:3vw;background:var(--black)}.torii-leg{width:8vw;height:66vh;top:28%}.left-leg{left:22%}.right-leg{right:22%}.burst,.chapter-stamp{font-family:var(--archivo);letter-spacing:-.04em;line-height:.82}.burst{position:absolute;right:5vw;bottom:7vw;color:var(--violet);font-size:clamp(3rem,7vw,8rem);text-shadow:8px 8px 0 var(--gold)}.dots{position:absolute;inset:8% 6%;background-image:radial-gradient(var(--violet) 0 7px,transparent 8px),radial-gradient(var(--red) 0 4px,transparent 5px);background-size:54px 54px,31px 31px;mix-blend-mode:multiply;opacity:.5}.seal,.bell,.final-seal,.ema,.omikuji{font:900 .9rem var(--jp);border:4px solid var(--black);background:var(--gold);color:var(--black);cursor:pointer;text-transform:uppercase;letter-spacing:.12em;box-shadow:8px 8px 0 var(--cyan);transition:transform .2s,box-shadow .2s}.seal:hover,.bell:hover,.final-seal:hover,.ema:hover,.omikuji:hover,.opened{transform:translate(-4px,-4px) rotate(-2deg);box-shadow:14px 14px 0 var(--red)}.seal{position:absolute;left:10%;bottom:12%;padding:1rem 1.2rem}.secret{opacity:0;transform:translateY(1rem) rotate(1deg) scale(.96);transition:opacity .35s,transform .35s}.secret.revealed{opacity:1;transform:translateY(0) rotate(-1deg) scale(1)}.phrase{position:absolute;max-width:24rem;padding:1.1rem;background:var(--black);color:var(--paper);border:4px solid var(--gold);box-shadow:10px 10px 0 var(--violet);font-size:1.15rem}#gate-secret{left:16%;bottom:25%}#wind-secret{right:7%;bottom:10%}#dance-secret,#final-secret{right:8%;bottom:16%}
.cream-left{background:var(--paper);color:var(--black)}.black-right{background:var(--black);color:var(--paper)}.black-rail{position:absolute;left:0;right:20%;top:48%;height:36px;background:var(--black);box-shadow:0 36px 0 var(--red),0 72px 0 var(--cyan)}.gohei{position:absolute;right:16%;bottom:10%;width:120px;height:58vh;border-left:12px solid var(--black)}.gohei span{position:absolute;width:75px;height:110px;background:var(--paper);border:5px solid var(--black);clip-path:polygon(0 0,100% 0,55% 35%,100% 35%,48% 70%,100% 70%,100% 100%,0 100%);box-shadow:9px 9px 0 var(--cyan)}.gohei span:nth-child(1){top:5%;left:7px}.gohei span:nth-child(2){top:32%;left:38px;transform:scaleX(-1)}.gohei span:nth-child(3){top:60%;left:7px}.chapter-stamp{font-size:clamp(3rem,8vw,9rem);color:var(--red);text-shadow:9px 9px 0 var(--cyan)}.giant-leaf,.leaf{position:absolute;background:var(--green);border:4px solid var(--black);border-radius:80% 0 80% 0;transform:rotate(-32deg);box-shadow:14px 14px 0 var(--cyan)}.giant-leaf{width:42vw;height:24vw;right:-8vw;bottom:12vh}.giant-leaf:after,.leaf:after{content:"";position:absolute;left:50%;top:8%;bottom:8%;border-left:5px solid var(--black);transform:rotate(23deg)}.ema{position:absolute;left:8%;bottom:12%;width:210px;height:135px;clip-path:polygon(0 28%,50% 0,100% 28%,100% 100%,0 100%)}.ema span{display:block;font-size:2.4rem}.squiggle{position:absolute;right:12%;top:14%;width:160px;height:90px;border-top:18px solid var(--violet);border-radius:50%;transform:rotate(18deg);filter:drop-shadow(12px 12px 0 var(--gold))}
.table-panel{background:linear-gradient(90deg,var(--paper) 0 64%,var(--red) 64%);position:relative}.tray{position:absolute;width:75%;height:34vh;left:12%;bottom:13%;background:var(--red);border:8px solid var(--paper);box-shadow:18px 18px 0 var(--cyan)}.omikuji{position:absolute;width:160px;height:330px;background:var(--paper);border-color:var(--black);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:1.2rem;transform-origin:top center}.omikuji b{font-size:3rem}.omikuji span{writing-mode:vertical-rl}.slip-one{left:12%;top:13%;transform:rotate(-8deg)}.slip-two{left:39%;top:23%;transform:rotate(5deg);background:var(--gold)}.slip-three{right:12%;top:16%;transform:rotate(12deg);background:var(--cyan)}.fortune-copy{position:absolute;left:12%;right:10%;bottom:8%;padding:1rem;background:var(--black);color:var(--paper);border-left:18px solid var(--gold);font-size:1.2rem}.fortune-copy.revealed:nth-of-type(2){transform:translateY(-92px) rotate(1deg)}.fortune-copy.revealed:nth-of-type(3){transform:translateY(-184px) rotate(-1deg)}
.dance-left{background:var(--red);display:flex;flex-direction:column;justify-content:center;gap:1rem}.dance-left:before{content:"";position:absolute;inset:-10%;background:repeating-linear-gradient(-35deg,var(--black) 0 34px,var(--gold) 34px 58px,var(--cyan) 58px 80px);opacity:.85}.syllable{position:relative;font-family:var(--archivo);font-size:clamp(5rem,13vw,15rem);line-height:.75;color:var(--paper);text-shadow:11px 11px 0 var(--black);transform:rotate(-8deg)}.syllable.alt{color:var(--gold);transform:rotate(5deg) translateX(8vw)}.dance-right{background:var(--paper);color:var(--black)}.dance-right:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0 40%,var(--violet) 40% 45%,transparent 45% 58%,var(--green) 58% 63%,transparent 63%)}.bell{position:absolute;left:14%;bottom:20%;padding:1rem 2rem;border-radius:999px}.bell:before{content:"";position:absolute;left:50%;bottom:100%;width:12px;height:180px;background:var(--red)}
.offering-left{background:var(--black)}.offering-right{background:var(--paper);color:var(--black)}.altar-piece{position:absolute;clip-path:polygon(15% 0,85% 0,100% 100%,0 100%);border:6px solid var(--black)}.altar-piece.red{width:35vw;height:42vh;right:-4vw;bottom:0;background:var(--red);box-shadow:18px 0 0 var(--cyan)}.altar-piece.gold{width:32vw;height:38vh;left:-2vw;bottom:0;background:var(--gold);box-shadow:-18px 0 0 var(--violet)}.central-altar{position:absolute;left:50%;top:50%;width:36vw;height:36vw;z-index:12;transform:translate(-50%,-38%);background:var(--paper);border:10px solid var(--black);box-shadow:18px 18px 0 var(--red),-18px -18px 0 var(--cyan);clip-path:polygon(50% 0,100% 22%,85% 100%,15% 100%,0 22%)}.fan{position:absolute;left:13%;top:16%;width:45%;height:48%;background:repeating-conic-gradient(from -25deg,var(--gold) 0 10deg,var(--paper) 10deg 18deg,var(--red) 18deg 26deg);border-radius:100% 0 0 0;border:5px solid var(--black)}.fan-two{left:45%;transform:scaleX(-1);background:repeating-conic-gradient(from -25deg,var(--green) 0 10deg,var(--paper) 10deg 18deg,var(--violet) 18deg 26deg)}.knot{position:absolute;width:90px;height:90px;left:50%;bottom:17%;transform:translateX(-50%);background:var(--red);border-radius:50%;border:6px solid var(--black);box-shadow:0 0 0 16px var(--gold)}.final-seal{position:absolute;right:12%;bottom:10%;padding:1.1rem 1.4rem}
.floating-kit{position:fixed;inset:0;pointer-events:none;z-index:20}.floating-kit i{display:block}.leaf-a{width:90px;height:150px;left:47%;top:18%;animation:drift 12s linear infinite}.leaf-b{width:70px;height:120px;right:9%;top:54%;animation:drift 15s -5s linear infinite}.leaf-c{width:55px;height:92px;left:7%;bottom:10%;animation:drift 13s -2s linear infinite}.shide{position:absolute;width:55px;height:130px;background:var(--paper);border:4px solid var(--black);clip-path:polygon(0 0,100% 0,55% 30%,100% 30%,42% 65%,100% 65%,100% 100%,0 100%);box-shadow:8px 8px 0 var(--red)}.shide-a{left:52%;top:8%;animation:paperflick 4s infinite}.shide-b{right:16%;bottom:14%;animation:paperflick 5s -1s infinite}.coin{position:absolute;width:46px;height:46px;border-radius:50%;background:var(--gold);border:5px solid var(--black);box-shadow:7px 7px 0 var(--cyan)}.coin-a{left:41%;bottom:18%}.coin-b{right:7%;top:18%}.gold-flecks{position:fixed;inset:0;pointer-events:none;z-index:50}.fleck{position:absolute;width:9px;height:9px;background:var(--gold);border-radius:50%;animation:fleck .75s ease-out forwards}.act-nav{position:fixed;left:1rem;bottom:1rem;z-index:40;display:flex;gap:.35rem;flex-wrap:wrap}.act-nav button{font:800 .7rem var(--space);text-transform:uppercase;letter-spacing:.12em;background:var(--paper);color:var(--black);border:3px solid var(--black);box-shadow:4px 4px 0 var(--red);padding:.55rem .65rem;cursor:pointer}.act-nav button.active{background:var(--gold);box-shadow:4px 4px 0 var(--cyan)}
@keyframes drift{0%{transform:translate3d(0,0,0) rotate(-32deg)}50%{transform:translate3d(42px,36px,0) rotate(-18deg)}100%{transform:translate3d(0,0,0) rotate(-32deg)}}@keyframes paperflick{0%,82%,100%{transform:rotate(0)}88%{transform:rotate(11deg)}94%{transform:rotate(-7deg)}}@keyframes fleck{0%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(.1)}}
@media(max-width:780px){.act{grid-template-columns:1fr}.split{min-height:50vh;padding:5rem 2rem}.threshold{left:auto;right:1rem;width:16px}h1{writing-mode:horizontal-tb;font-size:20vw}.vertical-mark{right:2rem}.central-altar{width:74vw;height:74vw}.torii-leg{height:36vh}.omikuji{width:120px;height:250px}.act-nav{right:1rem}.phrase{left:2rem!important;right:2rem!important;bottom:8%!important}}