:root{--paper:#f7f2e9;--paper-deep:#efe7d7;--paper-card:#fdfaf3;--ink:#201d19;--ink-soft:#5c554c;--ink-faint:#9b9287;--line:#201d191f;--line-soft:#201d1912;--shu:#cf3a25;--shu-deep:#a92c1a;--ai:#33547d;--matcha:#4a7c59;--gold:#b8923f;--radius:16px;--font-jp:"Shippori Mincho", "Hiragino Mincho ProN", serif;--font-body:"Zen Kaku Gothic New", "Hiragino Sans", sans-serif;--shadow-card:0 1px 2px #201d190d, 0 8px 28px #201d1912}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{font-family:var(--font-body);background:var(--paper);color:var(--ink);background-image:radial-gradient(1200px 600px at 85% -10%,#cf3a250d,#0000 60%),radial-gradient(900px 500px at -10% 110%,#33547d0d,#0000 55%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0.13 0 0 0 0 0.11 0 0 0 0 0.09 0 0 0 0.035 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");background-attachment:fixed;min-height:100dvh;line-height:1.6}#root{max-width:480px;min-height:100dvh;padding:max(env(safe-area-inset-top), 16px) 20px calc(env(safe-area-inset-bottom) + 24px);flex-direction:column;margin:0 auto;display:flex}.jp{font-family:var(--font-jp);font-feature-settings:"palt"}h1,h2,h3{font-family:var(--font-jp);letter-spacing:.01em;font-weight:600;line-height:1.25}.eyebrow{letter-spacing:.22em;text-transform:uppercase;color:var(--ink-faint);font-size:11px;font-weight:700}.muted{color:var(--ink-soft)}.faint{color:var(--ink-faint)}.small{font-size:13px}@keyframes rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.rise{animation:.5s cubic-bezier(.22,1,.36,1) both rise}.rise-1{animation-delay:50ms}.rise-2{animation-delay:.12s}.rise-3{animation-delay:.19s}.rise-4{animation-delay:.26s}.rise-5{animation-delay:.33s}.card{background:var(--paper-card);border:1px solid var(--line-soft);border-radius:var(--radius);box-shadow:var(--shadow-card);padding:20px}.btn{font-family:var(--font-body);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;border:none;border-radius:999px;padding:15px 28px;font-size:16px;font-weight:700;transition:transform .12s,box-shadow .12s,background .15s}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.4;cursor:default}.btn-primary{background:var(--shu);color:#fff8ef;box-shadow:0 6px 18px #cf3a2552}.btn-primary:hover{background:var(--shu-deep)}.btn-ghost{color:var(--ink);border:1.5px solid var(--line);background:0 0}.btn-ghost:hover{border-color:var(--ink-soft)}.btn-quiet{color:var(--ink-soft);background:0 0;padding:10px 16px;font-size:14px;font-weight:500}.btn-block{width:100%;display:block}.enso{border:2.5px solid var(--shu);width:54px;height:54px;font-family:var(--font-jp);color:var(--shu);border-radius:50%;place-items:center;font-size:19px;font-weight:700;display:grid;transform:rotate(-4deg)}.answer-input{font-family:var(--font-body);text-align:center;border:1.5px solid var(--line);width:100%;color:var(--ink);background:#fff9;border-radius:12px;outline:none;padding:14px 18px;font-size:22px;transition:border-color .15s,box-shadow .15s}.answer-input:focus{border-color:var(--ai);box-shadow:0 0 0 3px #33547d24}.answer-input.correct{border-color:var(--matcha);box-shadow:0 0 0 3px #4a7c5929}.answer-input.wrong{border-color:var(--shu);animation:.3s shake;box-shadow:0 0 0 3px #cf3a2526}@keyframes shake{25%{transform:translate(-5px)}50%{transform:translate(5px)}75%{transform:translate(-3px)}}.rating-bar{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.rating-btn{font-family:var(--font-body);border:1.5px solid var(--line);color:var(--ink-soft);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border-radius:12px;padding:12px 4px;font-size:13px;font-weight:700;transition:all .12s}.rating-btn small{color:var(--ink-faint);margin-top:2px;font-size:10px;font-weight:500;display:block}.rating-btn:active{transform:scale(.95)}.rating-btn.suggested{border-width:2px}.rating-again.suggested,.rating-again:hover{border-color:var(--shu);color:var(--shu)}.rating-hard.suggested,.rating-hard:hover{border-color:var(--gold);color:var(--gold)}.rating-good.suggested,.rating-good:hover{border-color:var(--matcha);color:var(--matcha)}.rating-easy.suggested,.rating-easy:hover{border-color:var(--ai);color:var(--ai)}.glyph{font-family:var(--font-jp);text-align:center;font-weight:500;line-height:1.1}.track{background:var(--paper-deep);border-radius:999px;height:5px;overflow:hidden}.track>div{background:var(--shu);border-radius:999px;height:100%;transition:width .4s cubic-bezier(.22,1,.36,1)}input[type=range]{width:100%;accent-color:var(--shu)}.hanko{writing-mode:vertical-rl;font-family:var(--font-jp);color:#cf3a25d9;letter-spacing:.2em;-webkit-user-select:none;user-select:none;border:1.5px solid #cf3a258c;border-radius:6px;padding:8px 3px;font-size:13px}.hint-strip{color:var(--ai);background:#33547d14;border:1px solid #33547d2e;border-radius:12px;align-items:center;gap:10px;margin-bottom:14px;padding:10px 14px;font-size:13.5px;display:flex}.hint-strip button{color:var(--ai);cursor:pointer;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;background:0 0;border:none;font-size:12px;font-weight:700}@keyframes pop-ok{0%{opacity:0;transform:scale(.6)}60%{transform:scale(1.15)}to{opacity:1;transform:scale(1)}}.pop-ok{animation:.35s cubic-bezier(.22,1,.36,1) both pop-ok}@keyframes celebrate{0%{opacity:0;transform:scale(.4)rotate(-8deg)}60%{transform:scale(1.12)rotate(2deg)}to{opacity:1;transform:scale(1)rotate(0)}}.celebrate{animation:.6s cubic-bezier(.22,1,.36,1) both celebrate}hr.rule{border:none;border-top:1px solid var(--line-soft);margin:16px 0}a{color:var(--ai)}.chat{flex-direction:column;gap:10px;padding:2px 0 18px;display:flex}.bubble{border-radius:18px;max-width:86%;padding:12px 16px;animation:.35s cubic-bezier(.22,1,.36,1) both rise}.bubble-npc{background:var(--paper-card);border:1px solid var(--line-soft);box-shadow:var(--shadow-card);border-bottom-left-radius:6px;align-self:flex-start}.bubble-user{background:#33547d1c;border:1px solid #33547d29;border-bottom-right-radius:6px;align-self:flex-end}.bubble-scene{text-align:center;max-width:92%;color:var(--ink-faint);align-self:center;padding:4px 8px;font-size:13.5px;font-style:italic}.bubble .bubble-tr{color:var(--ai);cursor:pointer;font-size:12px;font-family:var(--font-body);background:0 0;border:none;margin-top:6px;padding:0}.choice-btn{font-family:var(--font-body);text-align:left;border:1.5px solid var(--line);width:100%;color:var(--ink);cursor:pointer;-webkit-tap-highlight-color:transparent;background:#ffffff8c;border-radius:14px;padding:13px 16px;transition:border-color .12s,transform .12s}.choice-btn:active{transform:scale(.98)}.choice-btn.wrong{border-color:var(--shu);color:var(--ink-faint);opacity:.55;cursor:default;animation:.3s shake}.choice-btn.correct{border-color:var(--matcha);cursor:default;box-shadow:0 0 0 3px #4a7c5929}.choice-btn:disabled{cursor:default}