:root{--bg: #faf6f1;--bg-gradient: linear-gradient(160deg, #fdf3f3 0%, #faf6f1 40%, #f3f0fa 100%);--card: #ffffff;--ink: #3a3335;--ink-soft: #8a8085;--sakura: #e8788a;--sakura-deep: #d95d72;--sakura-soft: #fbe4e8;--indigo: #5b5ea6;--border: #eee4e0;--shadow: 0 4px 24px rgba(180, 140, 150, .12);--radius: 18px;--font-zh: "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", sans-serif;--font-ja: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Yu Gothic", "Meiryo", sans-serif}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{font-family:var(--font-zh);background:var(--bg-gradient);color:var(--ink)}.app{max-width:860px;margin:0 auto;height:100vh;height:100dvh;display:flex;flex-direction:column}.header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:#ffffffbf;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}.header-left{display:flex;align-items:center;gap:12px}.avatar-badge{width:46px;height:46px;border-radius:50%;background:var(--sakura-soft);display:flex;align-items:center;justify-content:center;font-size:24px;box-shadow:inset 0 0 0 2px #f6cdd5}.header h1{font-size:19px;font-weight:700;letter-spacing:.5px}.subtitle{font-size:12.5px;color:var(--ink-soft);margin-top:2px}.clear-btn{border:1px solid var(--border);background:#fff;color:var(--ink-soft);font-size:13px;padding:8px 14px;border-radius:999px;cursor:pointer;transition:all .15s;white-space:nowrap;flex-shrink:0}.clear-btn:hover{color:var(--sakura-deep);border-color:var(--sakura);background:var(--sakura-soft)}.header-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.remind-btn.on{color:var(--sakura-deep);border-color:var(--sakura);background:var(--sakura-soft)}.whoami{font-size:13px;color:var(--ink-soft)}.login-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px}.beian-footer{align-self:center;width:fit-content;max-width:calc(100% - 32px);margin:16px auto 12px;padding:0 8px;text-align:center;font-size:12px;color:var(--ink-soft);line-height:1.7}.beian-note{text-wrap:balance}@media(max-width:420px){.beian-note br{display:none}}.beian-footer p{margin:0 0 6px}.beian-footer a{color:var(--ink-soft);text-decoration:none}.beian-footer a:hover{text-decoration:underline}.beian-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 16px;align-items:center}.beian-links a{display:inline-flex;align-items:center;gap:4px}.beian-links img{width:16px;height:16px}.login-card{width:min(420px,100%);background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:32px 28px;text-align:center}.login-card h2{font-size:20px;margin-bottom:10px}.login-card p{font-size:14px;color:var(--ink-soft);line-height:1.7;margin-bottom:16px}.login-field{display:block;text-align:left;margin-bottom:12px}.login-field span{display:block;font-size:12px;color:var(--ink-soft);margin-bottom:6px}.login-field input,.account-form input{width:100%;border:1px solid var(--border);border-radius:12px;padding:10px 12px;font:inherit;color:var(--ink);background:#fff}.login-error{color:#b04444;font-size:13px;margin:0 0 12px}.login-wait{color:var(--ink-soft)}.auth-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#28181c47;display:flex;align-items:center;justify-content:center;padding:16px}.auth-card{margin:0}.auth-tabs{display:flex;gap:8px;justify-content:center;margin-bottom:12px}.auth-tabs button{border:1px solid var(--border);background:#fff;border-radius:999px;padding:6px 14px;font:inherit;cursor:pointer;color:var(--ink-soft)}.auth-tabs button.on{background:var(--pink, #f4c6d0);color:var(--ink);border-color:transparent}.sms-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end}.sms-row .login-field{margin-bottom:12px}.auth-close{margin-top:12px;border:0;background:none;color:var(--ink-soft);cursor:pointer;font:inherit;font-size:13px}.account-panel{padding:12px 20px;background:#ffffffb3;border-bottom:1px solid var(--border)}.account-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.account-form input{width:180px}.account-list{margin:10px 0 0;padding-left:18px;color:var(--ink);font-size:14px}.account-note{margin-top:8px;font-size:12px;color:var(--ink-soft)}.toolbar{display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:10px 20px;background:#fff9;border-bottom:1px solid var(--border);min-width:0}.toolbar-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.tool-switches{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.mode-tabs{display:flex;align-self:flex-start;gap:6px;background:#f4ecee;border-radius:999px;padding:4px;max-width:100%;min-width:0;overflow-x:auto}.mode-tabs-sub{background:#eef3f9}.app-en .mode-tabs-sub .mode-tab.active{color:#2c6d96;box-shadow:0 2px 8px #5082aa29}.app-en .mode-tabs-sub .mode-tab.done{color:#2d8a56}.en-learn-path{margin:0;font-size:12.5px;color:var(--ink-soft);line-height:1.5}.en-learn-path .on{color:#2c6d96;font-weight:700}.en-learn-path .done{color:#2d8a56}.en-next-step{justify-content:center;margin-top:10px}.en-game-picks{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.en-game-pick{text-align:left;border:1px solid var(--border);background:#fff;border-radius:14px;padding:14px;cursor:pointer}.en-game-pick strong,.en-game-pick span{display:block}.en-game-pick span{margin-top:6px;color:var(--ink-soft);font-size:13px;line-height:1.5}.en-game-pick:disabled{opacity:.5;cursor:default}.en-board{margin-top:16px}.en-board-list{list-style:none;margin:0;padding:0}.en-board-list li{display:grid;grid-template-columns:28px 48px 1fr;gap:8px;align-items:center;padding:6px 0;border-bottom:1px solid var(--border)}.en-board-list time{color:var(--ink-soft);font-size:12px}.en-match{position:relative;display:flex;flex-direction:column;gap:36px;margin-top:14px}.en-match-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:relative;z-index:1}.en-match-item{min-height:48px;border:1px solid var(--border);background:#fff;border-radius:12px;padding:10px;font-size:16px;cursor:pointer}.en-match-item.on{border-color:#3a6bbf;background:#e9f0fb}.en-match-item.linked{border-color:#8aa4c8}.en-match-lines{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:2}.en-match-lines line{stroke:#8aa4c8;stroke-width:3}.en-match-lines line.ok{stroke:#2d8a56}.en-match-lines line.bad{stroke:#c45050}.en-spell-slots,.en-spell-bank{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.en-spell-slot,.en-spell-tile{width:42px;height:48px;border:1px solid var(--border);border-radius:10px;background:#fff;font-size:20px;cursor:pointer}.en-spell-slot.ok{border-color:#2d8a56;background:#e8f6ee;color:#1f7a48}.en-spell-slot.bad{border-color:#c45050;background:#fdecec;color:#a33b3b}.mode-tab{border:none;background:transparent;color:var(--ink-soft);font-size:12.5px;padding:7px 10px;border-radius:999px;cursor:pointer;transition:all .15s;white-space:nowrap;flex-shrink:0}.mode-tab.active{background:#fff;color:var(--sakura-deep);font-weight:600;box-shadow:0 2px 8px #b48c962e}.bilingual-btn{border:1px solid var(--border);background:#fff;color:var(--ink-soft);font-size:13px;padding:7px 14px;border-radius:999px;cursor:pointer;transition:all .15s}.bilingual-btn.on{background:#e9f0fb;border-color:#b9cef0;color:#3a6bbf;font-weight:600}.tool-tip-wrap{position:relative;display:inline-flex}.pitch-btn{border:1px solid var(--border);background:#fff;color:var(--ink-soft);font-size:13px;padding:7px 14px;border-radius:999px;cursor:pointer;transition:all .15s}.pitch-btn.on{background:#f3eef8;border-color:#d4c4e8;color:#6b4f9a;font-weight:600}.tool-tip{position:absolute;top:calc(100% + 10px);right:0;width:min(340px,calc(100vw - 40px));padding:14px 16px;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 10px 28px #3c324624;color:var(--ink);font-size:12.5px;line-height:1.65;text-align:left;opacity:0;visibility:hidden;z-index:40;pointer-events:none;transform:translateY(-4px);transition:opacity .15s,transform .15s,visibility .15s}.tool-tip-wrap.tip-left .tool-tip{right:auto;left:0}.tool-tip-wrap.tip-pitch .tool-tip{border-color:#e5d8ef;box-shadow:0 10px 28px #5a3c7829}.tool-tip:before{content:"";position:absolute;top:-6px;right:28px;width:12px;height:12px;background:#fff;border-left:1px solid var(--border);border-top:1px solid var(--border);transform:rotate(45deg)}.tool-tip-wrap.tip-left .tool-tip:before{right:auto;left:28px}.tool-tip-wrap.tip-pitch .tool-tip:before{border-left-color:#e5d8ef;border-top-color:#e5d8ef}.tool-tip-wrap:hover .tool-tip,.tool-tip-wrap:has(:focus-visible) .tool-tip{opacity:1;visibility:visible;transform:translateY(0)}.tool-tip-title{font-size:14px;font-weight:700;color:#3a6bbf;margin-bottom:6px}.tool-tip-wrap.tip-pitch .tool-tip-title{color:#6b4f9a}.tool-tip p{margin:0 0 8px}.tool-tip ul{margin:0 0 8px;padding-left:18px}.tool-tip li{margin-bottom:4px}.tool-tip .accent{color:#6b4f9a;font-weight:700;font-size:1.05em}.tool-tip-eg{background:#f7f2fb;border-radius:8px;padding:8px 10px}.tool-tip-note{color:var(--ink-soft);font-size:11.5px;margin-bottom:0!important}.tool-tip .pitch-word-demo{border-bottom:2px solid #c4a8e0;padding-bottom:1px}.ja,ruby,.flash-word,.flash-word-sm,.flash-reading,.frog-pad-kana,.quiz-kana-input,.pitch-word,.pitch-word-demo{font-family:var(--font-ja)}.bubble p.trans,.flash-meaning,.frog-pad-cn{font-family:var(--font-zh)}.lesson-picker{display:flex;align-items:center;gap:8px}.lesson-picker.hidden{display:none}.lesson-label{font-size:13px;color:var(--ink-soft)}.lesson-picker select{border:1px solid var(--border);background:#fff;color:var(--ink);font-size:13px;padding:7px 10px;border-radius:10px;outline:none;cursor:pointer}.lesson-picker select:focus{border-color:var(--sakura)}.start-btn{border:none;background:linear-gradient(135deg,var(--sakura) 0%,var(--sakura-deep) 100%);color:#fff;font-size:13px;padding:8px 16px;border-radius:999px;cursor:pointer;transition:all .15s}.start-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #d95d7259}.chat{flex:1;overflow-y:auto;padding:24px 20px 12px;display:flex;flex-direction:column;gap:18px;scroll-behavior:smooth}.welcome{display:flex;justify-content:center;padding-top:4vh}.welcome-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:32px 30px;max-width:560px;text-align:center}.welcome-emoji{font-size:42px;margin-bottom:10px}.welcome-card h2{font-size:20px;margin-bottom:10px}.welcome-card p{font-size:14px;color:var(--ink-soft);line-height:1.7}.starters{margin-top:20px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.starter{border:1px solid #f2d3da;background:#fff8f9;color:var(--sakura-deep);font-size:13px;padding:9px 14px;border-radius:999px;cursor:pointer;transition:all .15s}.starter:hover{background:var(--sakura-soft);transform:translateY(-1px)}.msg{display:flex;gap:10px;max-width:85%;animation:fadeIn .25s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.msg.user{align-self:flex-end;flex-direction:row-reverse}.msg.bot{align-self:flex-start}.msg-avatar{width:36px;height:36px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:18px;margin-top:2px}.msg.bot .msg-avatar{background:var(--sakura-soft)}.msg.user .msg-avatar{background:#e4e6f5}.bubble{padding:12px 16px;border-radius:var(--radius);font-size:15px;line-height:2.1;word-break:break-word;white-space:pre-wrap}.bubble ruby{ruby-align:center}.bubble rt{font-size:.55em;color:#9a8a90;-webkit-user-select:none;user-select:none}.bubble .accent{color:#6b4f9a;font-size:.75em;font-weight:700;margin-left:1px}.bubble .pitch-word{border-bottom:2px solid #c4a8e0;padding-bottom:1px;box-decoration-break:clone;-webkit-box-decoration-break:clone}.msg.user .bubble{background:linear-gradient(135deg,var(--sakura) 0%,var(--sakura-deep) 100%);color:#fff;border-bottom-right-radius:6px}.msg.bot .bubble{background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow);border-bottom-left-radius:6px;white-space:normal}.bubble p{margin:0 0 8px}.bubble p:last-child{margin-bottom:0}.bubble h3,.bubble h4{font-size:14.5px;margin:4px 0 8px;padding:6px 10px;border-radius:8px;display:inline-block}.bubble h3.correction{background:#fff1e6;color:#c05621}.bubble h3.tips{background:#e9f5ec;color:#2f7d4f}.bubble h3.plain{background:#f1eef8;color:var(--indigo)}.bubble ul{margin:0 0 8px;padding-left:20px}.bubble li{margin-bottom:4px}.bubble hr{border:none;border-top:1px dashed #e8d8dc;margin:12px 0}.bubble p.trans{color:#a89ba0;font-size:13px;margin:-6px 0 10px;padding-left:10px;border-left:2.5px solid #ecdfe3}.bubble strong{color:var(--sakura-deep)}.bubble code{background:#f5eef0;padding:1px 6px;border-radius:6px;font-size:.9em}.bubble.error{background:#fdf0f0;border-color:#f3c2c2;color:#b04444}.typing{display:inline-flex;gap:5px;padding:6px 2px}.typing span{width:7px;height:7px;background:var(--sakura);border-radius:50%;animation:blink 1.2s infinite both}.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}@keyframes blink{0%,80%,to{opacity:.25}40%{opacity:1}}.composer{padding:10px 20px 16px;background:#ffffffbf;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--border)}.composer-inner{display:flex;align-items:flex-end;gap:10px;background:var(--card);border:1.5px solid var(--border);border-radius:16px;padding:10px 12px;transition:border-color .15s}.composer-inner:focus-within{border-color:var(--sakura)}.composer-inner textarea{flex:1;width:100%;min-width:0;border:none;outline:none;resize:none;font-family:inherit;font-size:15px;line-height:1.6;max-height:140px;background:transparent;color:var(--ink)}.send-btn{width:40px;height:40px;border:none;border-radius:12px;background:linear-gradient(135deg,var(--sakura) 0%,var(--sakura-deep) 100%);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s}.send-btn:hover:not(:disabled){transform:scale(1.06);box-shadow:0 4px 12px #d95d7259}.send-btn:disabled{opacity:.45;cursor:not-allowed}.hint{text-align:center;font-size:11.5px;color:#b8aeb2;margin-top:8px}.chat::-webkit-scrollbar{width:8px}.chat::-webkit-scrollbar-thumb{background:#e3d5d9;border-radius:4px}.chat::-webkit-scrollbar-track{background:transparent}.flashcard-panel{padding:14px 20px 8px;border-bottom:1px solid var(--border);background:#ffffff8c}.flashcard-panel.hidden{display:none}.flashcard-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:13px;color:var(--ink-soft)}.flash-progress{font-weight:600;color:#6b4f9a}.flashcard{perspective:1200px;max-width:420px;height:250px;margin:0 auto;cursor:pointer;outline:none}.flashcard-inner{position:relative;width:100%;height:100%;transition:transform .45s ease;transform-style:preserve-3d}.flashcard.flipped .flashcard-inner{transform:rotateY(180deg)}.flash-face{position:absolute;top:0;right:0;bottom:0;left:0;backface-visibility:hidden;border-radius:20px;border:1px solid #eadfe8;background:linear-gradient(160deg,#fff,#fbf6fa);box-shadow:0 8px 28px #a0788c24;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px 24px;text-align:center}.flash-back{transform:rotateY(180deg);background:linear-gradient(160deg,#faf7ff,#fff)}.flash-pitch{display:inline-flex;align-items:center;justify-content:center;min-width:72px;padding:5px 14px;border-radius:999px;background:#f0e8f8;color:#6b4f9a;font-size:15px;font-weight:700;margin-bottom:14px;letter-spacing:.5px}.flash-pitch.unknown{background:#f2eeef;color:#9a9094;font-weight:500;font-size:13px}.flash-word{font-size:40px;font-weight:700;line-height:1.25;color:var(--ink);letter-spacing:1px}.flash-word-sm{font-size:22px;font-weight:600;color:var(--ink-soft);margin-bottom:10px}.flash-reading{margin-top:8px;font-size:22px;color:#8a6aad;line-height:1.6}.small-kana{font-size:.62em;position:relative;top:.22em;margin:0 .02em;color:#6b4f9a;font-weight:700}.bubble .small-kana{color:#7a5a9a}.bubble rt .small-kana{font-size:.85em;top:0}.flash-meaning{font-size:26px;font-weight:700;color:var(--sakura-deep);line-height:1.4}.flash-pitch-desc{margin-top:12px;font-size:12.5px;color:var(--ink-soft);max-width:300px;line-height:1.5}.flash-front .flash-hint{margin-top:10px}.flash-hint{margin-top:16px;font-size:12px;color:#b8aeb2}.flash-actions{display:flex;justify-content:center;gap:10px;margin-top:14px;flex-wrap:wrap}.flash-nav,.flash-flip-btn{border:1px solid var(--border);background:#fff;color:var(--ink);font-size:13px;padding:9px 16px;border-radius:999px;cursor:pointer;transition:all .15s}.flash-nav:hover,.flash-flip-btn:hover{border-color:#d4c4e8;background:#faf6ff}.flash-nav.primary{background:linear-gradient(135deg,var(--sakura) 0%,var(--sakura-deep) 100%);border:none;color:#fff;font-weight:600}.flash-nav.primary:hover{background:linear-gradient(135deg,var(--sakura) 0%,var(--sakura-deep) 100%);box-shadow:0 4px 12px #d95d724d}.flash-nav:disabled,.flash-flip-btn:disabled{opacity:.4;cursor:not-allowed}.flash-foot-note{text-align:center;font-size:11.5px;color:#b8aeb2;margin-top:10px}.flash-nav.quiz-start{background:#f3eef8;border-color:#d4c4e8;color:#6b4f9a;font-weight:600}.vocab-quiz,.vocab-quiz-result{max-width:440px;margin:0 auto;text-align:center}.vocab-quiz.hidden,.vocab-quiz-result.hidden,#vocab-study.hidden,#vocab-frog.hidden,.frog-setup.hidden,.frog-play.hidden{display:none}.srs-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;max-width:520px;margin:0 auto 12px;padding:10px 14px;border-radius:14px;background:linear-gradient(135deg,#f3f7f1,#eef4f8);border:1px solid #d8e4d6;flex-wrap:wrap}.srs-bar>span{font-size:12.5px;color:#4a6b52;line-height:1.45;flex:1;min-width:180px}.flash-nav.srs-btn{background:#e8f3ea;border-color:#b8d4be;color:#2f7d4f;font-weight:600}.flash-nav.srs-btn:hover:not(:disabled){background:#dceee0;border-color:#8fbf98}.flash-nav.frog-btn{background:#e8f4fb;border-color:#b5d4e8;color:#2f6f9a;font-weight:600}.flash-nav.frog-btn:hover{background:#d9ecf8;border-color:#8cbdd9}.game-stage{flex:1;min-height:0;overflow:auto;padding:28px 24px 16px}.game-hall h2{font-size:22px;font-weight:700;margin-bottom:6px}.game-hall>p{color:var(--ink-soft);font-size:14px;line-height:1.6}.game-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin-top:18px}.game-card{border:1px solid var(--border);background:#fff;border-radius:18px;padding:22px 16px 18px;text-align:left;box-shadow:var(--shadow);cursor:pointer;font:inherit;color:inherit}.game-card:hover{border-color:var(--sakura);background:#fff7f8}.game-icon{display:block;font-size:40px;line-height:1}.game-card strong{display:block;margin-top:12px;font-size:17px}.game-card span:last-child{display:block;margin-top:6px;font-size:13px;color:var(--ink-soft);line-height:1.55}.game-card.soon{border-style:dashed;box-shadow:none;background:#ffffff73}.game-card.soon:hover{border-color:var(--border);background:#ffffffb3}.game-notice{margin-top:14px;font-size:13.5px;color:var(--ink-soft)}.game-back{margin-bottom:12px}.vocab-frog{max-width:640px;margin:0 auto;text-align:center}.frog-title{font-size:22px;font-weight:700;color:var(--ink);margin-bottom:8px}.frog-desc{font-size:13.5px;color:var(--ink-soft);line-height:1.6;margin-bottom:14px}.frog-diff-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:10px}.frog-diff-btn{border:1.5px solid var(--border);background:#fff;color:var(--ink);font-size:13px;padding:10px 14px;border-radius:12px;cursor:pointer;transition:all .15s}.frog-diff-btn:hover{border-color:#9ec4df;background:#f3f9fd}.frog-diff-btn.active{border-color:#5a9fc4;background:#e5f3fb;color:#1f6a94;font-weight:600}.frog-diff-hint{font-size:12.5px;color:#6a8a9a;margin-bottom:14px;min-height:1.4em}.frog-hud{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;font-size:13px;color:var(--ink-soft);flex-wrap:wrap}.frog-lives{letter-spacing:2px;font-size:16px}.frog-stage{position:relative;height:min(420px,58vh);border-radius:16px;overflow:hidden;margin-bottom:10px;border:2px solid #7eb8d0;box-shadow:inset 0 0 0 1px #ffffff59,0 8px 24px #285a782e;background:linear-gradient(180deg,#8ec8e8,#5eb0d6 45%,#3a94c0);-webkit-user-select:none;user-select:none}.frog-stage.paused:after{content:"已暂停";position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#14283c59;color:#fff;font-size:22px;font-weight:700;z-index:20;letter-spacing:.12em}.frog-water{position:absolute;left:0;right:0;top:52px;bottom:52px;overflow:hidden;z-index:0;pointer-events:none}.frog-water:before,.frog-water:after{content:"";position:absolute;top:-20%;right:-40%;bottom:-20%;left:-40%;background-image:radial-gradient(ellipse 40px 14px at 20% 30%,rgba(255,255,255,.28) 0%,transparent 70%),radial-gradient(ellipse 50px 16px at 55% 60%,rgba(255,255,255,.2) 0%,transparent 70%),radial-gradient(ellipse 36px 12px at 80% 40%,rgba(255,255,255,.22) 0%,transparent 70%),radial-gradient(ellipse 44px 14px at 35% 75%,rgba(200,240,255,.18) 0%,transparent 70%);background-size:220px 120px;animation:frog-water-flow 7s linear infinite;opacity:.85}.frog-water:after{animation-duration:11s;animation-direction:reverse;opacity:.55;top:10%}@keyframes frog-water-flow{0%{transform:translate(-12%)}to{transform:translate(12%)}}.frog-shore{position:absolute;left:0;right:0;height:52px;z-index:1;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:#2f5a28;letter-spacing:.08em}.frog-shore.top{top:0;background:linear-gradient(180deg,#c5e878,#9ccc4a 55%,#7aab3d);border-bottom:2px solid #5f9030;box-shadow:inset 0 -8px 16px #2850141f}.frog-shore.bottom{bottom:0;background:linear-gradient(0deg,#c5e878,#9ccc4a 55%,#7aab3d);border-top:2px solid #5f9030;box-shadow:inset 0 8px 16px #2850141f}.frog-shore-deco{position:absolute;font-size:18px;line-height:1;opacity:.9;animation:frog-sway 3.2s ease-in-out infinite;pointer-events:none}.frog-shore.top .frog-shore-deco:nth-child(1){left:10%;top:8px}.frog-shore.top .frog-shore-deco:nth-child(2){left:28%;top:4px;animation-delay:.4s}.frog-shore.top .frog-shore-deco:nth-child(3){right:22%;top:6px;animation-delay:.8s}.frog-shore.top .frog-shore-deco:nth-child(4){right:8%;top:10px;animation-delay:1.1s}@keyframes frog-sway{0%,to{transform:rotate(-4deg) translateY(0)}50%{transform:rotate(5deg) translateY(-2px)}}.frog-lane{position:absolute;left:0;right:0;height:64px;border-top:1px dashed rgba(255,255,255,.18);border-bottom:1px dashed rgba(255,255,255,.1);overflow:visible;z-index:2}.frog-pad{position:absolute;top:50%;width:90px;height:56px;margin-top:-28px;border-radius:50%/45%;background:radial-gradient(ellipse at 32% 28%,#a6e878,#62c055,#3d8f3d);border:2px solid #2f7a38;box-shadow:0 4px #24662c,0 6px 10px #143c2838;color:#14321a;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4px 6px;z-index:2;transform:translate(-50%);pointer-events:none;animation:frog-pad-bob 2.4s ease-in-out infinite}.frog-pad:nth-child(2n){animation-delay:.35s}.frog-pad:nth-child(3n){animation-delay:.7s}@keyframes frog-pad-bob{0%,to{margin-top:-28px}50%{margin-top:-32px}}.frog-pad.targetable{box-shadow:0 4px #24662c,0 0 0 3px #ffe678e6,0 6px 10px #143c2838;filter:brightness(1.1);animation:frog-pad-bob 2.4s ease-in-out infinite,frog-pad-pulse 1s ease-in-out infinite}@keyframes frog-pad-pulse{0%,to{box-shadow:0 4px #24662c,0 0 0 3px #ffe678b3,0 6px 10px #143c2838}50%{box-shadow:0 4px #24662c,0 0 0 6px #ffd250f2,0 8px 14px #143c2847}}.frog-pad.matched{background:radial-gradient(ellipse at 35% 30%,#d4f7b0,#7dce6a 55%,#4fa84a)}.frog-pad-cn{font-size:11px;font-weight:700;line-height:1.15;max-width:82px;max-height:2.3em;overflow:hidden;text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.frog-pad-kana .small-kana{font-size:1em;top:0;color:inherit;font-weight:600}.frog-pad-kana{margin-top:1px;font-size:10px;color:#1f4a28;line-height:1.1;max-width:78px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.frog-actor{position:absolute;width:44px;height:44px;z-index:8;transform:translate(-50%,-50%);filter:drop-shadow(0 3px 2px rgba(0,0,0,.28));pointer-events:none;will-change:left,top,transform}.frog-actor svg{width:100%;height:100%;display:block;overflow:visible}.frog-actor.idle .frog-body{transform-origin:50% 70%;animation:frog-idle 1.1s ease-in-out infinite}.frog-actor.jumping .frog-body{transform-origin:50% 60%;animation:frog-leap-squash .42s ease}.frog-actor.jumping .frog-legs{animation:frog-legs-kick .42s ease}.frog-actor.splash{animation:frog-splash .55s ease forwards}@keyframes frog-idle{0%,to{transform:translateY(0) scaleY(1)}50%{transform:translateY(-2px) scaleY(.96)}}@keyframes frog-leap-squash{0%{transform:scale(1) rotate(0)}25%{transform:scale(1.15,.85) rotate(-8deg)}55%{transform:scale(.9,1.15) rotate(6deg)}to{transform:scale(1) rotate(0)}}@keyframes frog-legs-kick{0%,to{transform:translateY(0)}40%{transform:translateY(3px)}70%{transform:translateY(-2px)}}@keyframes frog-splash{0%{transform:translate(-50%,-50%) scale(1) rotate(0);opacity:1}40%{transform:translate(-50%,-30%) scale(1.1) rotate(-15deg);opacity:.9}to{transform:translate(-50%,20%) scale(.5) rotate(25deg);opacity:0}}.frog-fx{position:absolute;left:0;top:0;width:0;height:0;z-index:9;pointer-events:none}.frog-ripple{position:absolute;width:18px;height:10px;margin:-5px 0 0 -9px;border:2px solid rgba(255,255,255,.75);border-radius:50%;animation:frog-ripple .55s ease-out forwards}@keyframes frog-ripple{to{width:54px;height:28px;margin:-14px 0 0 -27px;opacity:0;border-width:1px}}.frog-drop{position:absolute;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#dcf5fff2;animation:frog-drop .6s ease-out forwards}@keyframes frog-drop{0%{transform:translate(0) scale(1);opacity:1}to{transform:translate(var(--dx),var(--dy)) scale(.3);opacity:0}}.frog-prompt{font-size:13px;color:var(--ink-soft);margin-bottom:8px}.frog-type-row{display:flex;gap:8px;align-items:center;margin-bottom:8px}.frog-shake{animation:frog-shake .35s ease}@keyframes frog-shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}@media(max-width:600px){.frog-stage{height:min(360px,52vh)}.frog-pad{width:78px;height:50px;margin-top:-25px}.frog-pad-cn{font-size:10px}.frog-pad-kana{font-size:9px}.frog-actor{width:38px;height:38px}@keyframes frog-pad-bob{0%,to{margin-top:-25px}50%{margin-top:-29px}}}.quiz-prompt{font-size:13px;color:var(--ink-soft);margin-bottom:10px}.quiz-stem{font-size:34px;font-weight:700;line-height:1.3;color:var(--ink);margin-bottom:6px;word-break:break-word}.quiz-sub{font-size:18px;color:#8a6aad;min-height:1.4em;margin-bottom:16px}.quiz-options{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.quiz-options.hidden{display:none}.quiz-option{border:1.5px solid var(--border);background:#fff;color:var(--ink);font-size:15px;padding:12px 14px;border-radius:12px;cursor:pointer;text-align:left;transition:all .15s}.quiz-option:hover:not(:disabled){border-color:#d4c4e8;background:#faf6ff}.quiz-option:disabled{cursor:default}.quiz-option.correct{border-color:#6aae7a;background:#eef8f0;color:#2f7d4f;font-weight:600}.quiz-option.wrong{border-color:#e09090;background:#fdf0f0;color:#b04444}.quiz-type-area{display:flex;gap:8px;align-items:center;margin-bottom:12px}.quiz-type-area.hidden{display:none}.quiz-kana-input{flex:1;border:1.5px solid var(--border);border-radius:12px;padding:12px 14px;font-size:18px;outline:none;color:var(--ink);background:#fff}.quiz-kana-input:focus{border-color:#c4a8e0}.quiz-kana-input.correct{border-color:#6aae7a;background:#eef8f0}.quiz-kana-input.wrong{border-color:#e09090;background:#fdf0f0}.quiz-feedback{min-height:1.4em;font-size:14px;margin-bottom:8px}.quiz-feedback.ok{color:#2f7d4f;font-weight:600}.quiz-feedback.bad{color:#b04444;font-weight:600}.quiz-result-title{font-size:15px;color:var(--ink-soft);margin-bottom:8px}.quiz-score{font-size:42px;font-weight:700;color:var(--sakura-deep);margin-bottom:8px}.quiz-score-desc{font-size:14px;color:var(--ink-soft);margin-bottom:16px;line-height:1.6}.app.vocab-mode .chat{min-height:80px}.lang-home{min-height:100vh;display:flex;flex-direction:column;padding:20px 20px 8px}.lang-home-bar{display:flex;align-items:center;justify-content:space-between;gap:12px}.lang-brand{font-size:18px;font-weight:700;letter-spacing:.5px}.lang-home-main{width:min(720px,100%);margin:auto;text-align:center;padding:24px 0 12px}.lang-home-main h1{font-size:30px;margin-bottom:10px}.lang-home-main>p{color:var(--ink-soft);line-height:1.7;font-size:14.5px}.lang-choices{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px;text-align:left}.lang-choice{border:1px solid var(--border);background:#fff;border-radius:18px;padding:22px 18px 18px;box-shadow:var(--shadow);cursor:pointer;font:inherit;color:inherit}.lang-choice strong{display:block;font-size:18px;margin-top:8px}.lang-choice em{display:block;margin-top:2px;font-style:normal;font-size:13px;color:var(--ink-soft)}.lang-choice span:last-child{display:block;margin-top:8px;font-size:13px;color:var(--ink-soft);line-height:1.6}.lang-mark{font-size:28px;line-height:1}.lang-choice[data-lang=ja]:hover{border-color:var(--sakura);background:#fff7f8}.lang-choice[data-lang=en]:hover{border-color:#3d7ea6;background:#f3f8fb}.lang-choice.soon{grid-column:1 / -1;cursor:default;box-shadow:none;border-style:dashed;background:transparent;display:flex;align-items:center;gap:10px;padding:12px 16px}.lang-choice.soon strong,.lang-choice.soon span:last-child{margin-top:0}.lang-choice.soon .lang-mark{font-size:18px;color:var(--ink-soft)}.app-en{--sakura: #3d7ea6;--sakura-deep: #2c6d96;--sakura-soft: #e5f2f8}body:has(.app-en){background:linear-gradient(160deg,#eef6f8,#f7f5f2 42%,#eef0f8)}.app-en .send-btn:hover:not(:disabled){box-shadow:0 4px 12px #2c6d9659}.app-en .bubble p.trans{color:#3a6bbf;border-left-color:#c5d7ef}.app-en .bubble h3.correction{background:#e8f1fb;color:#2c6d96}.level-gate{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;display:flex;align-items:center;justify-content:center;padding:20px;background:#3a333547}.level-leave{position:absolute;top:16px;right:16px;background:#fff}.level-card{width:min(440px,100%);background:#fff;border-radius:var(--radius);padding:22px 20px;box-shadow:var(--shadow)}.level-card h2{font-size:18px;margin-bottom:8px}.level-card p{font-size:13.5px;color:var(--ink-soft);line-height:1.6;margin-bottom:14px}.level-options{display:flex;flex-direction:column;gap:8px}.level-option{text-align:left;border:1px solid var(--border);background:#fff;border-radius:12px;padding:10px 12px;cursor:pointer}.level-option strong{display:block;font-size:15px}.level-option span{display:block;margin-top:2px;font-size:12.5px;color:var(--ink-soft)}.level-option:hover{border-color:var(--sakura);background:var(--sakura-soft)}.level-option.on{border-color:var(--sakura);background:var(--sakura-soft);font-weight:600}.en-panel{display:flex;flex-direction:column;flex:1;min-height:0}.en-panel[hidden]{display:none!important}.en-chat{display:flex;flex-direction:column;flex:1;min-height:0}.en-gate-card{width:min(520px,100%);max-height:calc(100vh - 40px);overflow:auto}.en-gate-go{margin-top:14px}.en-kicker{margin:14px 0 8px;font-size:13px;font-weight:700;color:var(--sakura-deep)}.en-note{background:#fff;border:1px solid var(--border);border-radius:14px;padding:12px 14px;color:var(--ink-soft);line-height:1.6}.en-card{background:#fff;border:1px solid var(--border);border-radius:18px;padding:18px 16px;box-shadow:var(--shadow)}.en-card-top,.en-word-row,.en-actions{display:flex;align-items:center;justify-content:space-between;gap:10px}.en-card-top{color:var(--ink-soft);font-size:13px}.en-word-row{margin-top:12px}.en-word-row h2{font-size:40px;letter-spacing:.5px}.en-speak,.en-cloze{border:1px solid var(--border);background:#fff;border-radius:999px;padding:8px 14px;font-size:14px}.en-speak{cursor:pointer;color:var(--sakura-deep)}.en-gloss{margin-top:6px;font-size:18px}.en-block{margin-top:14px;display:flex;flex-direction:column;gap:8px}.en-passage{display:flex;flex-direction:column}.en-passage .en-line,.en-passage .en-zh{line-height:1.45}.en-line{line-height:1.7}.en-zh{color:#3a6bbf;line-height:1.7}.en-actions{margin-top:16px;justify-content:flex-end}.en-cloze{width:100%;border-radius:12px;margin-top:12px;padding:10px 12px}.en-choices{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.en-choice{min-height:52px;border:1px solid var(--border);background:#fff;border-radius:12px;padding:12px 10px;font-size:18px;line-height:1.3;cursor:pointer;word-break:break-word}.en-choice:disabled{cursor:default;opacity:1}.en-choice.right{border-color:#2d8a56;background:#e8f6ee;color:#1f7a48}.en-choice.wrong{border-color:#c45050;background:#fdecec;color:#a33b3b}.en-ok{margin-top:8px;color:#2d8a56}.en-bad{margin-top:8px;color:#c45050}.en-word-list{list-style:none;display:flex;flex-direction:column;gap:8px}.en-word-list li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--border)}.en-word-list span{color:var(--ink-soft)}.kana-tool{border:1px solid var(--border);background:#fff;color:var(--ink-soft);font-size:13px;padding:7px 14px;border-radius:999px;cursor:pointer;transition:all .15s;white-space:nowrap;flex-shrink:0}.kana-tool.on{background:var(--sakura-soft);border-color:var(--sakura);color:var(--sakura-deep);font-weight:600}.kana-float{position:fixed;z-index:30;display:flex;flex-direction:column;background:#fff;border-radius:16px;box-shadow:var(--shadow);border:1px solid var(--border);overflow:hidden;container-type:inline-size}.kana-panel-head{display:flex;align-items:center;gap:8px;padding:10px 22px;border-bottom:1px solid var(--border);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}.kana-panel-head:active{cursor:grabbing}.kana-script{display:flex;gap:4px;margin-left:auto}.kana-script button,.kana-close,.kana-level{border:1px solid var(--border);background:#fff;border-radius:999px;padding:4px 10px;font-size:12.5px;cursor:pointer}.kana-script button.on{background:var(--sakura-soft);border-color:var(--sakura);color:var(--sakura-deep)}.kana-panel-body{overflow:auto;padding:12px}.kana-section{margin-bottom:14px}.kana-section h3{font-size:13px;margin-bottom:6px;color:var(--ink-soft);font-weight:600}.kana-grid{display:grid;gap:6px}.kana-cell{min-height:48px;border:1px solid var(--border);border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fff}.kana-cell.empty{border:0;background:transparent}.kana-glyph{font-size:clamp(16px,7cqi,34px);line-height:1.1}.kana-roma{font-size:11px;color:var(--ink-soft)}.kana-note{font-size:12.5px;color:var(--ink-soft);line-height:1.6;margin:4px 0 10px}.kana-level{width:100%}.kana-resize{position:absolute;z-index:2;width:18px;height:18px;border:0;padding:0;background:transparent;touch-action:none}.kana-resize:after{content:"";position:absolute;width:9px;height:9px;border-style:solid;border-color:#b9aeb4}.kana-resize.nw{left:2px;top:2px;cursor:nwse-resize}.kana-resize.nw:after{left:2px;top:2px;border-width:2px 0 0 2px}.kana-resize.ne{right:2px;top:2px;cursor:nesw-resize}.kana-resize.ne:after{right:2px;top:2px;border-width:2px 2px 0 0}.kana-resize.sw{left:2px;bottom:2px;cursor:nesw-resize}.kana-resize.sw:after{left:2px;bottom:2px;border-width:0 0 2px 2px}.kana-resize.se{right:2px;bottom:2px;cursor:nwse-resize}.kana-resize.se:after{right:2px;bottom:2px;border-width:0 2px 2px 0}@media(max-width:720px){.header{flex-wrap:wrap;align-items:flex-start;gap:10px}.header-actions{width:100%;justify-content:flex-start}.mode-tabs{max-width:100%}.toolbar-tools{align-items:flex-start}}@media(max-width:600px){.lang-choices{grid-template-columns:1fr}.lang-home-main h1{font-size:24px}.msg{max-width:95%}.header h1{font-size:16px}.subtitle{display:none}.flashcard{height:200px}.en-choices,.en-game-picks{grid-template-columns:1fr}.flash-word{font-size:32px}.mode-tab{font-size:11.5px;padding:6px 8px}}
