@font-face{font-family:Mamelon;src:url('fonts/Mamelon-3-Hi-Regular.otf') format('opentype');font-display:swap}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#080c13;color:#ede9da;font-family:system-ui,sans-serif}body{display:flex;justify-content:center}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:2px solid #64eedb;outline-offset:5px}[hidden]{display:none!important}#app{position:relative;isolation:isolate;width:100%;max-width:560px;height:100svh;min-height:600px;overflow:hidden;border-inline:1px solid #ffffff0b;background:radial-gradient(ellipse at 50% 40%,#16263055,transparent 65%)}#cosmos{position:absolute;inset:0;width:100%;height:100%;z-index:-1}header{position:relative;height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 26px}.brand{color:#ddd6bd;text-decoration:none;font-size:12px;letter-spacing:3px}.brand span{color:#647775;font-size:10px}#sound{border:1px solid #8dac9d44;border-radius:20px;background:#101d2180;font-size:11px;letter-spacing:2px;padding:9px 13px}.overlay{position:absolute;inset:80px 20px 20px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.eyebrow{font-size:9px;letter-spacing:4px;color:#91a29a}.seal{font-family:Mamelon,serif;font-size:90px;color:#ede0b7;text-shadow:0 0 35px #d6b96966;margin:30px 0 10px}h1{font-family:Mamelon,serif;font-weight:400;font-size:42px;letter-spacing:12px;margin:10px 0}.subtitle{font-size:10px;letter-spacing:7px;color:#b9a778;margin:12px 0 24px}.description{font-size:13px;line-height:2.3;color:#9caaa7}.primary{margin-top:25px;border:1px solid #c7b27a88;background:linear-gradient(135deg,#b9a26e22,#52dac511);padding:17px 40px;border-radius:3px;font-size:13px;letter-spacing:4px;box-shadow:0 0 30px #c7b27a11}.primary:hover{background:#bdac7433}.primary:disabled{opacity:.5;cursor:wait}.hint{font-size:10px;line-height:2;color:#647975;margin-top:24px}#game{height:calc(100% - 80px);display:flex;flex-direction:column}.stats{display:flex;justify-content:space-between;margin:0 27px 12px;color:#b9b396;font-size:11px;letter-spacing:2px;font-variant-numeric:tabular-nums}.progress{height:1px;background:#c3b57c22;margin:0 27px}.progress div{height:100%;width:0;background:#63dcca;box-shadow:0 0 10px #63dcca;transition:width .3s}#field{position:relative;flex:1;min-height:250px;margin:16px 20px}.kanji{position:absolute;width:64px;height:64px;border-radius:50%;border:1px solid #bea67166;background:radial-gradient(circle,#baa06518,#0b171b88);font-family:Mamelon,serif;font-size:31px;box-shadow:0 0 20px #c1a56b0a,inset 0 0 15px #d8b87908;transform:translate(-50%,-50%);transition:background .2s,border-color .2s;animation:appear .6s both}.kanji:hover{border-color:#6ce3d1;background:#6ce3d118}.kanji.accepted{pointer-events:none;animation:dissolve .5s forwards}.kanji.wrong{animation:shake .3s}footer{padding:18px 15px 20px;text-align:center;background:linear-gradient(transparent,#080c13dd);border-top:1px solid #bba67320;min-height:148px;padding-bottom:max(20px,env(safe-area-inset-bottom))}#reading{display:flex;justify-content:center;flex-wrap:wrap;gap:3px;margin:17px auto 10px}#reading ruby{font-family:Mamelon,serif;font-size:22px;min-width:29px;color:#7e8983;padding:5px 1px;transition:color .2s}#reading rt{font-size:9px;letter-spacing:0;color:inherit}#reading .done{color:#cfb975}#reading .current{color:#76efd4;text-shadow:0 0 12px #76efd455;border-bottom:1px solid #76efd4}#score{font-size:14px;color:#cdbb87;line-height:2;letter-spacing:2px}@keyframes appear{from{opacity:0;transform:translate(-50%,-50%) scale(.3) rotate(-35deg)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes dissolve{to{opacity:0;transform:translate(-50%,-50%) scale(1.8);filter:blur(6px)}}@keyframes shake{25%,75%{transform:translate(-58%,-50%)}50%{transform:translate(-42%,-50%);border-color:#db7d8d}}@media(max-width:380px){header{padding:0 18px}.kanji{width:56px;height:56px;font-size:28px}#reading ruby{font-size:19px;min-width:25px}#reading{gap:1px}.seal{margin:15px 0 0}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition:none!important}}

.daily{margin-top:22px;padding:13px 22px;border:1px solid #bba67325;border-radius:5px;background:#0b171b80}.daily .eyebrow{letter-spacing:3px}.daily p{font-size:11px;color:#baa97d;margin:9px 0}#daily-claim{font-size:11px;border:0;background:transparent;color:#76e8d4;padding:5px 12px}#daily-claim:disabled{color:#7f9790;cursor:default}.overlay .seal{margin-top:18px}.overlay .hint{margin-top:16px}@media(max-height:760px){.overlay .seal{font-size:65px;margin:8px 0 0}.overlay h1{font-size:34px;margin:6px 0}.overlay .subtitle{margin:8px 0 12px}.overlay .description{margin:8px 0}.overlay .primary{margin-top:14px}.daily{margin-top:15px;padding:9px 20px}.overlay .hint{margin-top:12px}}
#daily-open{font-size:11px;border:0;background:transparent;color:#76e8d4;padding:5px 12px}#daily-dialog{width:min(400px,calc(100vw - 32px));max-height:calc(100svh - 32px);overflow:auto;padding:22px 24px 18px;border:1px solid #baa57770;border-radius:8px;background:radial-gradient(ellipse at 50% 0,#28312d,#101b1d 70%);color:#e9e1cc;box-shadow:0 25px 100px #000b;text-align:center}#daily-dialog::backdrop{background:#03080cce;backdrop-filter:blur(7px)}.calendar-top{display:flex;align-items:center;justify-content:space-between}.calendar-top button{border:0;background:transparent;color:#a8b6aa;font-size:25px;width:32px;height:32px}#calendar-title{font-family:Mamelon,serif;font-size:30px;font-weight:400;letter-spacing:7px;margin:10px 0}.calendar-caption,.calendar-note{font-size:11px;color:#92a196;margin:8px 0 15px}.calendar-nav{display:flex;justify-content:space-between;align-items:center;margin:18px 0 14px;font-size:13px;letter-spacing:2px}.calendar-nav button{border:1px solid #baa57733;background:transparent;border-radius:50%;width:30px;height:30px;font-size:22px}.weekdays,#calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.weekdays{font-size:10px;color:#899c92;margin-bottom:8px}.weekdays span:first-child{color:#c58279}.calendar-day{position:relative;aspect-ratio:1;border:1px solid #af9d6c25;border-radius:3px;display:flex;justify-content:center;align-items:center;font-size:12px;color:#a8b3a7;background:#ffffff03}.calendar-day.today{border-color:#d2b77c99;background:#c5a56b12;color:#edddaf}.calendar-day.today>span:first-child{text-decoration:underline;text-underline-offset:4px}.ritual-stamp{position:absolute;inset:2px;display:flex;align-items:center;justify-content:center;border:2px solid #e56b54;border-radius:50%;color:#ee765e;font-family:Mamelon,serif;font-size:25px;line-height:1;background:#381611b8;transform:rotate(-13deg);text-shadow:0 0 5px #d3463033;box-shadow:inset 0 0 0 2px #d64e3330}#calendar-status{font-size:11px;color:#cfbb89;min-height:18px;margin:18px 0 0}#daily-dialog #daily-claim{display:block;width:100%;border:1px solid #d2775688;background:#99493328;color:#edc2a0;font-size:13px;padding:14px 8px;margin:14px 0 12px;letter-spacing:3px}#daily-dialog #daily-claim:disabled{border-color:#aa976b33;background:transparent;color:#86988e}.stamp-impact{z-index:3;animation:stamp-slam .7s cubic-bezier(.18,.8,.25,1) both}.ink-burst::after{content:'';position:absolute;inset:-10px;border:2px solid #ee765e;border-radius:50%;pointer-events:none;animation:ink-ring .7s .12s both}.calendar-impact{animation:calendar-jolt .45s .14s both}@keyframes stamp-slam{0%{opacity:0;transform:scale(5) rotate(-30deg);filter:blur(3px)}25%{opacity:1}46%{transform:scale(.85) rotate(-13deg);filter:blur(0);box-shadow:0 0 45px #ef6646aa}65%{transform:scale(1.18) rotate(-13deg)}100%{transform:scale(1) rotate(-13deg)}}@keyframes ink-ring{0%{opacity:.9;transform:scale(.4)}100%{opacity:0;transform:scale(2.8)}}@keyframes calendar-jolt{0%,100%{transform:translate(0,0)}25%{transform:translate(0,7px) rotate(.5deg)}45%{transform:translate(-3px,-4px)}65%{transform:translate(2px,2px)}}@media(prefers-reduced-motion:reduce){.stamp-impact,.ink-burst::after,.calendar-impact{animation:none!important}}

#daily-replay{border:0;background:transparent;color:#bcaa83;font-size:11px;padding:8px 14px;text-decoration:underline;text-underline-offset:4px}

.ritual-stamp{border:0;background:#381611b8;box-shadow:none}.ritual-stamp svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:4;stroke-linecap:round;filter:drop-shadow(0 0 2px #d3463033)}
#daily-dialog #daily-claim{letter-spacing:1px;font-size:12px}.stamp-impact{animation:stamp-slam 1.1s cubic-bezier(.18,.8,.25,1) both}.ink-burst{z-index:4}.ink-burst::before{content:'';position:absolute;inset:-70px;pointer-events:none;border-radius:50%;background:radial-gradient(circle,#fff4bcbb 0,#ef8a4966 20%,#ee694622 45%,transparent 68%);animation:stamp-flash 1.1s .24s both}.ink-burst::after{border:3px double #efb577;animation:ink-ring 1s .26s both;box-shadow:0 0 22px #ef765e88,inset 0 0 12px #edc78b44}.stamp-spark{position:absolute;left:50%;top:50%;width:5px;height:9px;background:var(--spark-color);border-radius:2px;box-shadow:0 0 9px var(--spark-color);pointer-events:none;animation:stamp-sparks 1.25s .26s both}.calendar-impact{animation:calendar-jolt .6s .28s both}@keyframes stamp-slam{0%{opacity:0;transform:scale(8) rotate(-60deg);filter:blur(6px)}18%{opacity:1}28%{transform:scale(.75) rotate(-13deg);filter:blur(0);box-shadow:0 0 65px #ef6646dd}43%{transform:scale(1.3) rotate(-10deg)}60%{transform:scale(.96) rotate(-13deg)}100%{transform:scale(1) rotate(-13deg)}}@keyframes stamp-flash{0%{opacity:0;transform:scale(.2)}12%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.5)}}@keyframes stamp-sparks{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}8%{opacity:1}100%{opacity:0;transform:translate(var(--spark-x),var(--spark-y)) rotate(var(--spark-turn)) scale(.4)}}@keyframes calendar-jolt{0%,100%{transform:translate(0,0)}15%{transform:translate(0,10px) rotate(1deg)}30%{transform:translate(-6px,-6px) rotate(-.7deg)}50%{transform:translate(4px,4px)}70%{transform:translate(-2px,-2px)}}@media(prefers-reduced-motion:reduce){.ink-burst::before,.stamp-spark{display:none}.stamp-impact,.calendar-impact,.ink-burst::after{animation:none!important}}
.book-scene{position:absolute;inset:0;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse,#29332d,#101b1d 75%);border-radius:7px;overflow:hidden}.book-opening>:not(.book-scene){opacity:0;pointer-events:none}.ritual-book{position:relative;width:150px;height:215px;perspective:900px;transform:translateX(65px) rotate(-4deg);filter:drop-shadow(0 20px 20px #0009);animation:book-arrive 1.8s both}.book-paper,.book-cover{position:absolute;inset:0;transform-origin:left center;backface-visibility:visible;border-radius:2px 7px 7px 2px}.book-paper{border:1px solid #c4b28b;background:repeating-linear-gradient(0deg,transparent 0 19px,#a28d6222 20px 21px),linear-gradient(90deg,#c7b797,#f2e7c9 15%,#ded0ad);box-shadow:inset 5px 0 12px #63523844}.book-base{box-shadow:4px 4px 0 #c6b38f,7px 7px 0 #8c7e65}.book-cover{display:flex;align-items:center;justify-content:center;flex-direction:column;border:1px solid #c4a362;background:linear-gradient(90deg,#172828,#31504c 12%,#1f3633);box-shadow:inset 0 0 0 9px #203633,inset 0 0 0 10px #bda36b70;animation:cover-open .8s .15s both}.book-cover span{font-family:Mamelon,serif;writing-mode:vertical-rl;font-size:29px;letter-spacing:9px;color:#e5d1a0}.book-cover small{font-size:9px;color:#bbaa83;letter-spacing:3px;margin-top:18px}.turning-page{animation:page-flip .48s calc(.55s + var(--page)*.17s) both;z-index:calc(6 - var(--page))}.book-cover{z-index:8}.book-caption{font-family:Mamelon,serif;color:#c9bb94;font-size:13px;letter-spacing:2px;margin:35px 0 0;animation:book-caption 1.8s both}@keyframes cover-open{0%{transform:rotateY(0)}100%{transform:rotateY(-170deg)}}@keyframes page-flip{0%{transform:rotateY(0)}50%{transform:rotateY(-95deg)}100%{transform:rotateY(-175deg)}}@keyframes book-arrive{0%{opacity:0;transform:translateX(65px) translateY(30px) scale(.8) rotate(-8deg)}20%,85%{opacity:1;transform:translateX(65px) scale(1) rotate(-4deg)}100%{opacity:0;transform:translateX(65px) scale(1.12) rotate(0)}}@keyframes book-caption{0%,10%{opacity:0}30%,80%{opacity:1}100%{opacity:0}}@media(prefers-reduced-motion:reduce){.book-scene{display:none}.book-opening>:not(.book-scene){opacity:1}}
/* The title is printed on the front; the inner cover is unlettered. */
.book-cover{transform-style:preserve-3d;background:none;border:0;box-shadow:none;backface-visibility:visible}
.book-cover::before,.book-cover::after{content:'';position:absolute;inset:0;border-radius:2px 7px 7px 2px;backface-visibility:hidden;border:1px solid #c4a362}
.book-cover::before{background:linear-gradient(90deg,#172828,#31504c 12%,#1f3633);box-shadow:inset 0 0 0 9px #203633,inset 0 0 0 10px #bda36b70;transform:translateZ(.5px)}
.book-cover::after{background:linear-gradient(90deg,#b6a17e,#e5d8ba 12%,#cfbf9c);box-shadow:inset 0 0 16px #6a563133;transform:rotateY(180deg) translateZ(.5px)}
.book-cover span,.book-cover small{backface-visibility:hidden;transform:translateZ(1px)}
