@font-face{font-family:Story;src:local("LXGW WenKai"),local("KaiTi"),local("Kaiti SC")}*{box-sizing:border-box}html{color:#75385d;background:#fbe2ee}body{margin:0;min-height:100svh;overflow-x:hidden;font-family:Story,"Yu Mincho","Noto Serif CJK SC",Georgia,serif}.sky,.border{position:fixed;inset:0;pointer-events:none}.sky{overflow:hidden;background:radial-gradient(ellipse at 50% 42%,#fff9f8 0%,transparent 55%),radial-gradient(ellipse at 90% 10%,#e2d3f7,transparent 55%),linear-gradient(145deg,#f8c7df,#ffe9ef 68%,#f3c9e4)}.sky:before,.sky:after{content:"";position:absolute;width:85%;height:25%;bottom:-7%;left:-12%;background:#fff8fc;border-radius:50%;box-shadow:15vw -4vh 0 #fff9fcad,35vw 1vh 0 #fff9fcbe,65vw -3vh 0 #fff9fcbd,85vw 4vh 0 #fff9fc;filter:blur(22px)}.sky:after{bottom:22%;opacity:.34;transform:scaleX(-1);left:36%}.orbit{position:absolute;left:50%;top:45%;width:min(78vw,580px);aspect-ratio:1;translate:-50% -50%;border:1px solid #cba67488;border-radius:50%;box-shadow:0 0 0 10px #ffffff48,0 0 0 11px #cba67444,inset 0 0 0 12px #ffffff40;animation:orbit 42s linear infinite}.orbit:before,.orbit:after{content:"✦";position:absolute;left:50%;translate:-50%;top:-.65em;color:#bc8d5a;font-size:2rem}.orbit:after{top:auto;bottom:-.65em}.moon{position:absolute;right:14%;top:16%;font-size:clamp(3rem,10vw,9rem);line-height:1;color:#fffbea;text-shadow:0 0 26px #fff;rotate:-21deg}.star{position:absolute;color:#a96d98;opacity:.65;animation:twinkle 4s infinite alternate;text-shadow:0 0 9px #fff}.border{inset:10px;border:1px solid #b78a5780;outline:1px solid #fff9;outline-offset:3px;border-radius:24px;z-index:4}header,footer{position:relative;text-align:center;letter-spacing:.3em;color:#895273;font-family:Georgia,serif}header{padding:26px 12px 0;font-size:.8rem}header span{color:#a36c3d;padding:0 8px}footer{padding:14px 16px 24px;font-size:.63rem}main{position:relative;min-height:calc(100svh - 90px);display:grid;place-items:center;padding:12px 24px;text-align:center}.title{display:grid;justify-items:center;gap:22px;width:min(780px,100%);align-content:center}.title img{width:100%;filter:drop-shadow(0 15px 22px #b8659e38);animation:float 5s ease-in-out infinite}.title.exit{animation:exit 1.55s ease-in forwards;pointer-events:none}.title .ribbon{margin-top:14px}.ribbon,.small{position:relative;border:3px double #ba8b52;color:#713052;background:linear-gradient(#fff5f9,#f5b5d3 53%,#fbd5e8);border-radius:48% 48% 46% 46% / 34% 34% 34% 34%;padding:11px 35px;box-shadow:0 4px 0 #b56a9560,0 8px 22px #ae638b32,inset 0 0 0 3px #fff8;font:700 1.03rem Story,Georgia,serif;cursor:pointer;min-height:46px}.ribbon{min-width:186px;font-size:1.45rem;letter-spacing:.12em;animation:float 3.5s ease-in-out infinite}.ribbon:before,.ribbon:after{content:"❧";position:absolute;top:17%;left:-27px;font-size:1.9rem;color:#fffdf0;text-shadow:0 1px 2px #9e6c46;transform:scaleX(-1)}.ribbon:after{left:auto;right:-27px;transform:none}.ribbon span{display:block;font-size:.78rem;letter-spacing:.14em;margin-top:4px}button:hover{filter:brightness(1.07)}button:active{scale:.95}button:focus-visible{outline:3px solid #9d4983;outline-offset:4px}.stage{width:min(100%,920px);height:min(72svh,670px);position:relative;animation:appear 1.5s both}.stage canvas{width:100%;height:100%;display:block}.seal-hit{position:absolute;inset:25% 28% 29%;background:none;border:none;cursor:pointer}.caption{position:absolute;bottom:1%;left:0;right:0;pointer-events:none;text-shadow:0 1px 3px white}.caption span,.jp{display:block;color:#92577d;margin-bottom:6px}.letter,.collection,dialog{color:#713c60;background:radial-gradient(ellipse at 50% 0,#fff,#fff6ec 72%,#f8e0e9);border:5px double #bd935e;border-radius:38px 18px;box-shadow:0 16px 45px #98557d30,inset 0 0 0 6px #f7d8e6;padding:24px}.letter{width:min(520px,100%);position:relative}.letter:before,.collection:before{content:"✧　୨♡୧　✧";display:block;color:#ac6e70;letter-spacing:.2em}.letter p{font-size:clamp(1.15rem,3vw,1.5rem);min-height:3em;display:grid;place-items:center;animation:appear .3s both;margin:.55em 0}.story{width:100%;display:grid;justify-items:center}.story .stage{height:min(45svh,410px);margin-bottom:-35px}.alert{animation:shake .4s}.partners{width:min(100%,480px);padding:12px 0}.partners h1,.collection h1{font-size:clamp(1.3rem,4vw,2.2rem);margin:.35em 0 .7em}.partner-grid,.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,2vw,16px)}.pet{position:relative;border:3px double #ba935c;border-radius:48% 48% 23% 23%;background:radial-gradient(ellipse at 50% 45%,white,#f8d9eb 72%,#e3c5eb);box-shadow:inset 0 0 0 4px #fff8,0 6px 14px #97537c24;cursor:pointer;min-width:0;padding:9%;aspect-ratio:1.09;animation:emerge .78s both;animation-delay:var(--delay,0s)}.pet:before,.pet:after{content:"✦";position:absolute;left:7%;top:25%;color:#a77545}.pet:after{left:auto;right:7%;top:60%}.pet img,.mascot img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 7px 5px #99698740);animation:float 3.2s ease-in-out infinite;animation-delay:var(--delay,0s)}.pet:hover img,.pet:focus-visible img{scale:1.08}.dim{opacity:.45}.contract img,.chosen{display:block;width:min(140px,38vw);height:125px;object-fit:contain;margin:auto;animation:bounce .7s 2}.depart{animation:exit 1s both}.collection{width:min(760px,100%);position:relative;background:linear-gradient(90deg,#fbdfed,#fff9ef 47%,#e8c2cf 50%,#fff9ef 53%,#fbe4ee);padding:24px clamp(16px,4vw,40px)}.collection .cards{max-width:430px;margin:auto}.slot{border:2px solid #c69b62;padding:2px;border-radius:10px;background:#f5d3e7;cursor:pointer;min-width:0;position:relative}.slot img{display:block;width:100%;aspect-ratio:2/3;object-fit:contain;border-radius:6px}.slot.locked img{opacity:.7}.slot.locked:after{content:"✦";position:absolute;inset:auto 0 8%;color:#fff;text-shadow:0 0 5px #532f64}.collection p{margin:.6em 0}.book-tools{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}.mascot{width:64px;height:61px;border:0;background:none;cursor:pointer}.mascot.hop img{animation:bounce .45s}.actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.small{padding:9px 18px}dialog{max-width:min(420px,calc(100% - 36px));text-align:center}dialog::backdrop{background:#61345260;backdrop-filter:blur(4px)}dialog h2{margin-top:8px}dialog img.card{display:block;width:min(220px,65vw);margin:0 auto 14px;border-radius:14px;animation:flip .65s both}dialog label{display:block;margin:14px}dialog .actions{margin-top:14px}.burst{position:fixed;z-index:6;pointer-events:none;color:#c578a7;font-size:1.35rem;animation:burst .85s ease-out both}.flash{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse,#fff,#fbd6ee77,transparent 66%);animation:flash .7s both}@keyframes flash{0%,100%{opacity:0}45%{opacity:1}}@keyframes orbit{to{rotate:360deg}}@keyframes twinkle{to{opacity:.18;scale:.8}}@keyframes float{50%{translate:0 -7px}}@keyframes exit{to{opacity:0;transform:translateY(-100px) scale(1.16);filter:blur(10px)}}@keyframes appear{from{opacity:0;translate:0 9px}to{opacity:1}}@keyframes emerge{0%{opacity:0;scale:.18;filter:brightness(2)}75%{scale:1.06}100%{opacity:1}}@keyframes shake{25%,75%{translate:5px}50%{translate:-5px}}@keyframes bounce{50%{translate:0 -16px}}@keyframes flip{from{transform:perspective(650px) rotateY(-88deg)}}@keyframes burst{to{translate:var(--x) var(--y);opacity:0;rotate:60deg}}@media(max-width:480px){.border{inset:7px}header{padding-top:20px}main{padding-inline:19px}.title{gap:15px}.stage{width:100%;height:60svh}.story .stage{height:36svh}.letter{padding:17px}.collection{padding-top:16px}}@media(prefers-reduced-motion:reduce){.orbit,.star,.ribbon,.title img,.pet img,.mascot img{animation:none}}
body{display:flex;flex-direction:column}main{flex:1;min-height:0}.stage:before{content:"";position:absolute;pointer-events:none;inset:auto 23% 15%;height:13%;border-radius:50%;background:#8d426a23;filter:blur(21px)}.stage canvas{position:relative}
@keyframes emerge{0%{opacity:0;translate:var(--birth-x) var(--birth-y);scale:.08;filter:brightness(3)}32%{opacity:1;filter:brightness(2)}75%{scale:1.06}100%{opacity:1}}