:root,html[data-theme=light]{--ks-ink: #15100C;--ks-bg: #EFE4CA;--ks-bg-2: #FBF3DC;--ks-bg-3: #E2D6B4;--ks-bg-4: #D6C795;--ks-line: rgba(21, 16, 12, .12);--ks-line-2: rgba(21, 16, 12, .22);--ks-line-3: rgba(21, 16, 12, .32);--ks-text: #15100C;--ks-text-dim: rgba(21, 16, 12, .78);--ks-text-faint: rgba(21, 16, 12, .58);--ks-text-mute: rgba(21, 16, 12, .36);--ks-gold: #9A6B05;--ks-gold-soft: #B8860B;--ks-gold-deep: #5C3F03;--ks-gold-12: rgba(154, 107, 5, .12);--ks-gold-08: rgba(154, 107, 5, .08);--ks-gold-04: rgba(154, 107, 5, .04);--ks-gold-30: rgba(154, 107, 5, .32);--ks-gold-50: rgba(154, 107, 5, .55);--ks-mint: #176B52;--ks-mint-12: rgba(23, 107, 82, .12);--ks-mint-30: rgba(23, 107, 82, .32);--ks-crimson: #A8281F;--ks-crimson-12: rgba(168, 40, 31, .12);--ks-crimson-30: rgba(168, 40, 31, .32);--ks-grade-active-bg: linear-gradient(180deg, rgba(184,134,11,.08), rgba(184,134,11,.02));--ks-grade-active-border: var(--ks-gold-50);--ks-grade-active-text: var(--ks-gold);--ks-grade-progress-bg: var(--ks-bg-2);--ks-grade-progress-border: var(--ks-line);--ks-grade-progress-text: var(--ks-text);--ks-grade-locked-bg: var(--ks-bg-3);--ks-grade-locked-border: var(--ks-line);--ks-grade-locked-text: var(--ks-text-dim);--ks-shadow-sm: 0 2px 6px -2px rgba(80,55,20,.1);--ks-shadow-md: 0 8px 22px -10px rgba(80,55,20,.18);--ks-shadow-lg: 0 18px 40px -18px rgba(80,55,20,.25);--ks-shadow-gold: 0 8px 22px -8px rgba(184,134,11,.35);--ks-r-sm: 8px;--ks-r-md: 12px;--ks-r-lg: 18px;--ks-r-xl: 24px;--ks-r-pill: 999px}html[data-theme=dark]{--ks-ink: #0E0A06;--ks-bg: #1A140C;--ks-bg-2: #231A10;--ks-bg-3: #2D2216;--ks-bg-4: #382A1C;--ks-line: rgba(245, 235, 210, .1);--ks-line-2: rgba(245, 235, 210, .18);--ks-line-3: rgba(245, 235, 210, .26);--ks-text: #F8F1DE;--ks-text-dim: rgba(248, 241, 222, .82);--ks-text-faint: rgba(248, 241, 222, .6);--ks-text-mute: rgba(248, 241, 222, .32);--ks-gold: #F4C430;--ks-gold-soft: #FCD96B;--ks-gold-deep: #B98A1A;--ks-gold-12: rgba(244, 196, 48, .12);--ks-gold-08: rgba(244, 196, 48, .08);--ks-gold-04: rgba(244, 196, 48, .04);--ks-gold-30: rgba(244, 196, 48, .3);--ks-gold-50: rgba(244, 196, 48, .5);--ks-mint: #3DD9B0;--ks-mint-12: rgba(61, 217, 176, .12);--ks-mint-30: rgba(61, 217, 176, .3);--ks-crimson: #E25C4A;--ks-crimson-12: rgba(226, 92, 74, .12);--ks-crimson-30: rgba(226, 92, 74, .3);--ks-grade-active-bg: radial-gradient(120% 60% at 100% 0%, rgba(244,196,48,.14), transparent 60%), linear-gradient(180deg, rgba(244,196,48,.08), rgba(244,196,48,.02));--ks-grade-active-border: var(--ks-gold-50);--ks-grade-active-text: var(--ks-gold);--ks-grade-progress-bg: var(--ks-bg-2);--ks-grade-progress-border: var(--ks-line);--ks-grade-progress-text: var(--ks-text);--ks-grade-locked-bg: rgba(35, 26, 16, .55);--ks-grade-locked-border: var(--ks-line);--ks-grade-locked-text: var(--ks-text-dim);--ks-shadow-sm: 0 4px 14px -6px rgba(0,0,0,.5);--ks-shadow-md: 0 10px 30px -10px rgba(0,0,0,.55);--ks-shadow-lg: 0 24px 60px -20px rgba(0,0,0,.65);--ks-shadow-gold: 0 8px 24px -8px rgba(244,196,48,.45)}html,body{background:var(--ks-bg);color:var(--ks-text)}body{transition:background .25s ease,color .25s ease}.ks-text-gold{color:var(--ks-gold)}.ks-text-mint{color:var(--ks-mint)}.ks-text-crimson{color:var(--ks-crimson)}.ks-text-dim{color:var(--ks-text-dim)}.ks-text-faint{color:var(--ks-text-faint)}.ks-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 20px;border-radius:var(--ks-r-md);font-weight:700;font-size:14px;cursor:pointer;border:0;font-family:inherit;min-height:44px;transition:transform .15s,box-shadow .15s,background .15s}.ks-btn-primary{background:var(--ks-gold);color:#fffaec;box-shadow:inset 0 0 0 1px var(--ks-gold-deep),var(--ks-shadow-gold)}html[data-theme=dark] .ks-btn-primary{color:var(--ks-ink)}.ks-btn-primary:hover{transform:translateY(-1px)}.ks-btn-ghost{background:transparent;color:var(--ks-text);border:1px solid var(--ks-line-2)}.ks-btn-ghost:hover{background:var(--ks-gold-08);border-color:var(--ks-gold-30)}.ks-tab{flex:1;padding:14px 8px;text-align:center;font-size:13px;font-weight:700;color:var(--ks-text-faint);border:0;background:transparent;border-bottom:2px solid transparent;cursor:pointer;transition:color .15s,border-color .15s;font-family:inherit}.ks-tab:hover{color:var(--ks-text)}.ks-tab[aria-selected=true],.ks-tab.is-active{color:var(--ks-gold);border-bottom-color:var(--ks-gold)}.ks-grade{position:relative;overflow:hidden;border-radius:var(--ks-r-lg);padding:16px 16px 14px;border:1px solid var(--ks-line);background:var(--ks-bg-2);transition:transform .2s,border-color .2s,background .2s,box-shadow .2s;cursor:pointer;min-height:180px;display:flex;flex-direction:column}.ks-grade:hover{transform:translateY(-2px);border-color:var(--ks-line-2)}.ks-grade--active{background:var(--ks-grade-active-bg),var(--ks-bg-2);border-color:var(--ks-grade-active-border);box-shadow:0 0 0 1px var(--ks-gold-50),0 14px 32px -12px #b8860b2e}html[data-theme=dark] .ks-grade--active{box-shadow:0 0 0 1px var(--ks-gold-50),0 16px 40px -12px #f4c4302e}.ks-grade--active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ks-gold)}.ks-grade--active .ks-grade-num{color:var(--ks-grade-active-text)}.ks-grade--locked{background:var(--ks-grade-locked-bg);border-color:var(--ks-grade-locked-border)}.ks-grade--locked .ks-grade-num{color:var(--ks-text-faint)}.ks-grade--locked .ks-grade-jlpt{background:var(--ks-bg-3);color:var(--ks-text-faint)}.ks-grade-lock{position:absolute;top:11px;right:11px;width:24px;height:24px;border-radius:50%;background:var(--ks-bg-3);border:1px solid var(--ks-line-2);display:grid;place-items:center;color:var(--ks-text-dim);font-size:10px}.ks-grade--locked .ks-grade-lock{background:var(--ks-crimson);color:#fff;border-color:transparent}.ks-bar{height:3px;background:var(--ks-line);border-radius:2px;overflow:hidden;margin-top:10px}.ks-bar>i{display:block;height:100%;background:var(--ks-gold);border-radius:2px;transition:width .6s ease}.ks-grade--locked .ks-bar>i{background:var(--ks-text-faint)}.ks-grade-jlpt{font-size:10px;font-weight:800;letter-spacing:.12em;background:var(--ks-gold-12);color:var(--ks-gold);padding:4px 8px;border-radius:4px}.ks-grade-num{font-family:"Noto Serif JP",serif;font-weight:900;font-size:38px;line-height:1;color:var(--ks-gold);letter-spacing:-.02em}.ks-badge-premium{position:absolute;top:14px;right:14px;display:inline-flex;align-items:center;gap:6px;font-size:9px;font-weight:800;letter-spacing:.12em;color:var(--ks-text-faint);text-transform:uppercase}.ks-hanko{display:inline-block;background:var(--ks-crimson);color:#fff;font-family:"Noto Serif JP",serif;font-weight:900;font-size:11px;padding:3px 6px;border-radius:2px;letter-spacing:.04em;transform:rotate(-4deg);box-shadow:inset 0 0 0 1.5px #ffffff26,0 0 0 1.5px var(--ks-crimson-30)}.ks-kanji-hl{color:var(--ks-gold);border-bottom:2px solid var(--ks-gold-30);padding-bottom:1px;font-weight:700;cursor:pointer;transition:color .15s,border-color .15s}.ks-kanji-hl:hover{color:var(--ks-gold-soft);border-bottom-color:var(--ks-gold-50)}.ks-quiz-opt{background:var(--ks-bg-2);border:1px solid var(--ks-line);border-radius:var(--ks-r-sm);padding:12px;font-size:13px;font-weight:600;color:var(--ks-text-dim);cursor:pointer}.ks-quiz-opt--correct{border-color:var(--ks-mint);background:var(--ks-mint-12);color:var(--ks-mint)}.ks-quiz-opt--wrong{border-color:var(--ks-crimson-30);color:var(--ks-text-faint);text-decoration:line-through;text-decoration-color:var(--ks-crimson)}.ks-upgrade{position:relative;overflow:hidden;background:#1b1410;color:#f8f1de;border:1px solid var(--ks-line-2);border-radius:var(--ks-r-lg);padding:18px;display:flex;align-items:center;gap:14px}.ks-upgrade:before{content:"印";position:absolute;top:12px;right:14px;font-family:"Noto Serif JP",serif;font-weight:900;font-size:11px;padding:3px 5px;background:var(--ks-crimson);color:#fff;letter-spacing:.04em;transform:rotate(-4deg);border-radius:2px;box-shadow:0 0 0 1.5px var(--ks-crimson-30)}.ks-upgrade-icon{width:46px;height:46px;flex-shrink:0;border-radius:var(--ks-r-md);background:var(--ks-gold);color:#1b1410;display:grid;place-items:center;font-family:"Noto Serif JP",serif;font-weight:900;font-size:24px}.ks-theme-toggle{width:40px;height:40px;border-radius:50%;border:1px solid var(--ks-line-2);background:var(--ks-bg-2);display:grid;place-items:center;font-size:16px;color:var(--ks-text-dim);cursor:pointer;flex-shrink:0;transition:background .15s,border-color .15s,color .15s;position:relative;overflow:hidden}.ks-theme-toggle:hover{background:var(--ks-gold-12);border-color:var(--ks-gold-30);color:var(--ks-gold)}.ks-theme-toggle .ico-sun,.ks-theme-toggle .ico-moon{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;transition:opacity .25s,transform .25s}html[data-theme=light] .ks-theme-toggle .ico-sun{opacity:1;transform:scale(1)}html[data-theme=light] .ks-theme-toggle .ico-moon{opacity:0;transform:scale(.5) rotate(60deg)}html[data-theme=dark] .ks-theme-toggle .ico-sun{opacity:0;transform:scale(.5) rotate(-60deg)}html[data-theme=dark] .ks-theme-toggle .ico-moon{opacity:1;transform:scale(1)}.ks-snav{padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--ks-line);background:var(--ks-bg);position:sticky;top:0;z-index:100}.ks-snav-back{width:40px;height:40px;border-radius:var(--ks-r-sm);border:1px solid var(--ks-line-2);background:var(--ks-bg-2);color:var(--ks-text-dim);font-size:22px;font-weight:600;display:grid;place-items:center;flex-shrink:0;cursor:pointer;font-family:inherit}.ks-snav-back:hover{background:var(--ks-bg-3);color:var(--ks-text)}.ks-snav-title{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center}.ks-snav-title .ks-crumb{font-size:10px;font-weight:600;letter-spacing:.14em;color:var(--ks-text-faint);text-transform:uppercase}.ks-snav-title .ks-num{font-size:13px;font-weight:800;color:var(--ks-text);margin-top:1px;letter-spacing:-.01em}.ks-snav-title .ks-num em{color:var(--ks-gold);font-style:normal}.ks-snav-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}.ks-icon-btn{width:32px;height:32px;border-radius:var(--ks-r-sm);border:1px solid var(--ks-line-2);background:var(--ks-bg-2);color:var(--ks-text-dim);font-size:14px;display:grid;place-items:center;cursor:pointer;font-family:inherit;transition:background .15s,border-color .15s,color .15s}.ks-icon-btn:hover{background:var(--ks-bg-3);color:var(--ks-text)}.ks-icon-btn.ks-fav-on{background:var(--ks-crimson-12);border-color:var(--ks-crimson-30);color:var(--ks-crimson)}.ks-prog-strip{padding:10px 16px 0;display:flex;align-items:center;gap:8px}.ks-prog-strip .bar{flex:1;height:4px;background:var(--ks-line);border-radius:2px;overflow:hidden}.ks-prog-strip .bar>i{display:block;height:100%;background:var(--ks-gold);border-radius:2px;transition:width .6s ease}.ks-prog-strip .text{font-size:10px;font-weight:700;color:var(--ks-text-dim);font-family:JetBrains Mono,monospace}.ks-prog-strip .text b{color:var(--ks-gold)}.ks-shero{margin:18px 16px 0;background:radial-gradient(80% 50% at 50% 0%,var(--ks-gold-12),transparent 70%),var(--ks-bg-2);border:1px solid var(--ks-line);border-radius:var(--ks-r-xl);padding:18px 18px 16px;position:relative;overflow:hidden}.ks-shero:before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--ks-gold-50),transparent)}.ks-shero-row{display:flex;align-items:center;gap:14px}.ks-shero-kanji{width:120px;height:120px;flex-shrink:0;border-radius:var(--ks-r-lg);background:var(--ks-bg);border:1px solid var(--ks-line-2);display:grid;place-items:center;font-family:"Noto Serif JP",serif;font-weight:900;font-size:84px;line-height:1;color:var(--ks-text);letter-spacing:-.02em;position:relative}.ks-shero-kanji:after{content:"";position:absolute;top:8px;right:8px;bottom:8px;left:8px;border:1px dashed var(--ks-line-2);border-radius:12px;pointer-events:none}.ks-shero-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.ks-shero-tags{display:flex;gap:6px;flex-wrap:wrap}.ks-stag{font-size:9px;font-weight:800;letter-spacing:.12em;padding:3px 7px;border-radius:4px;text-transform:uppercase}.ks-stag-gold{background:var(--ks-gold-12);color:var(--ks-gold)}.ks-stag-line{background:var(--ks-bg-3);color:var(--ks-text-dim);border:1px solid var(--ks-line)}.ks-shero-meaning{font-size:18px;font-weight:800;color:var(--ks-text);letter-spacing:-.01em;line-height:1.2}.ks-shero-strokes{font-size:11px;color:var(--ks-text-faint);font-weight:500;display:flex;align-items:center;gap:6px}.ks-shero-strokes b{color:var(--ks-text-dim);font-weight:700}.ks-readings{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.ks-read{background:var(--ks-bg);border:1px solid var(--ks-line);border-radius:var(--ks-r-md);padding:10px 12px}.ks-read-label{font-size:9px;font-weight:800;letter-spacing:.18em;color:var(--ks-text-faint);text-transform:uppercase;margin-bottom:4px}.ks-read-label.on{color:var(--ks-gold)}.ks-read-value{font-family:"Noto Serif JP",serif;font-size:18px;font-weight:700;color:var(--ks-text);letter-spacing:-.005em}.ks-read-value .ks-romaji{font-family:Inter,sans-serif;font-size:11px;font-weight:600;color:var(--ks-text-faint);margin-left:6px;letter-spacing:0}.ks-section-title{font-size:11px;font-weight:800;letter-spacing:.22em;color:var(--ks-text-faint);text-transform:uppercase;margin:22px 16px 10px;display:flex;align-items:center;justify-content:space-between}.ks-section-title .right{font-size:11px;letter-spacing:.05em;text-transform:none;font-weight:600;color:var(--ks-gold)}.ks-story{margin:16px 16px 0;background:var(--ks-bg-2);border:1px solid var(--ks-line);border-radius:var(--ks-r-md);padding:16px}.ks-story-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.ks-story-title{font-family:"Noto Serif JP",serif;font-size:17px;font-weight:700;color:var(--ks-text);letter-spacing:-.005em}.ks-story-meta{font-size:11px;color:var(--ks-text-faint);font-weight:500}.ks-story-body{font-family:"Noto Serif JP",serif;font-size:17px;line-height:1.95;color:var(--ks-text)}.ks-story-body .ks-kanji-hl{color:var(--ks-gold);font-weight:700;border-bottom:1.5px solid var(--ks-gold-30);padding-bottom:1px;cursor:pointer;transition:color .15s,border-color .15s}.ks-story-body .ks-kanji-hl:hover{color:var(--ks-gold-soft);border-bottom-color:var(--ks-gold-50)}.ks-story-body .ks-kanji-hl.ks-current{background:var(--ks-gold-12);border-bottom-color:var(--ks-gold);border-radius:2px;padding:0 2px}.ks-story-trans{margin-top:12px;padding-top:12px;border-top:1px dashed var(--ks-line-2);font-size:12px;color:var(--ks-text-faint);font-style:italic;line-height:1.55}.ks-words{margin:0 16px;display:flex;flex-direction:column;gap:8px}.ks-word{background:var(--ks-bg-2);border:1px solid var(--ks-line);border-radius:var(--ks-r-md);padding:13px 14px;display:flex;align-items:center;gap:12px;transition:border-color .15s,background .15s;min-height:56px}.ks-word:hover{border-color:var(--ks-line-2)}.ks-word-main{font-family:"Noto Serif JP",serif;font-size:22px;font-weight:700;color:var(--ks-text);min-width:60px;flex-shrink:0;line-height:1.1}.ks-word-main .ks-kanji-target{color:var(--ks-gold)}.ks-word-body{flex:1;min-width:0}.ks-word-read{font-size:12px;color:var(--ks-text-dim);font-weight:600;font-family:Noto Sans JP,sans-serif}.ks-word-mean{font-size:14px;color:var(--ks-text);font-weight:700;margin-top:2px;letter-spacing:-.005em}.ks-word-play{width:40px;height:40px;border-radius:var(--ks-r-sm);flex-shrink:0;border:1px solid var(--ks-line-2);background:var(--ks-bg);display:grid;place-items:center;color:var(--ks-text-dim);font-size:16px;cursor:pointer;font-family:inherit}.ks-word-play:hover{background:var(--ks-gold-12);color:var(--ks-gold);border-color:var(--ks-gold-30)}.ks-quiz{margin:18px 16px 0;background:var(--ks-bg-2);border:1px solid var(--ks-line);border-radius:var(--ks-r-md);padding:14px}.ks-quiz-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}.ks-quiz-badge{width:36px;height:36px;border-radius:var(--ks-r-sm);background:var(--ks-gold);color:var(--ks-ink);display:grid;place-items:center;font-family:"Noto Serif JP",serif;font-weight:900;font-size:18px}html[data-theme=light] .ks-quiz-badge{color:#fbf3dc}.ks-quiz-title{font-size:14px;font-weight:800;color:var(--ks-text);letter-spacing:-.005em}.ks-quiz-sub{font-size:11px;color:var(--ks-text-faint);font-weight:500;margin-top:2px}.ks-quiz-q{font-size:15px;color:var(--ks-text);font-weight:600;margin-bottom:12px;line-height:1.45}.ks-quiz-q .ks-kanji-target{font-family:"Noto Serif JP",serif;font-weight:700;color:var(--ks-gold);font-size:22px}.ks-quiz-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ks-opt{background:var(--ks-bg);border:1px solid var(--ks-line-2);border-radius:var(--ks-r-md);padding:14px 12px;font-size:13.5px;font-weight:600;color:var(--ks-text-dim);text-align:left;line-height:1.35;display:flex;align-items:center;gap:10px;cursor:pointer;font-family:inherit;transition:border-color .15s,background .15s,color .15s;min-height:52px}.ks-opt:hover{border-color:var(--ks-gold-30);color:var(--ks-text)}.ks-opt .ks-opt-key{width:22px;height:22px;border-radius:5px;flex-shrink:0;border:1px solid var(--ks-line-2);font-size:11px;font-weight:800;display:grid;place-items:center;color:var(--ks-text-faint);font-family:JetBrains Mono,monospace}.ks-opt-correct{border-color:var(--ks-mint);background:var(--ks-mint-12);color:var(--ks-mint)}.ks-opt-correct .ks-opt-key{border-color:var(--ks-mint);color:var(--ks-mint);background:var(--ks-mint-12)}.ks-opt-wrong{border-color:var(--ks-crimson-30);color:var(--ks-text-faint);text-decoration:line-through;text-decoration-color:var(--ks-crimson)}.ks-pager{margin:18px 16px 0;display:flex;gap:8px}.ks-pager-btn{flex:1;padding:11px 12px;border-radius:var(--ks-r-md);border:1px solid var(--ks-line-2);background:var(--ks-bg-2);color:var(--ks-text-dim);font-size:12px;font-weight:700;letter-spacing:-.005em;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;font-family:inherit;transition:transform .15s,border-color .15s,background .15s}.ks-pager-btn:hover{border-color:var(--ks-line-3);background:var(--ks-bg-3)}.ks-pager-btn.next{background:var(--ks-gold);color:var(--ks-ink);border-color:transparent;box-shadow:var(--ks-shadow-gold)}html[data-theme=light] .ks-pager-btn.next{color:#fbf3dc}.ks-pager-btn .arr{font-size:14px;font-weight:900}.ks-tts{position:absolute;left:0;right:0;bottom:0;z-index:6;padding:12px 16px 22px;background:linear-gradient(180deg,transparent,var(--ks-bg) 30%);pointer-events:none}.ks-tts>*{pointer-events:auto}.ks-tts-bar{background:var(--ks-bg-2);border:1px solid var(--ks-line-2);border-radius:var(--ks-r-pill);padding:6px 8px 6px 14px;display:flex;align-items:center;gap:10px;box-shadow:var(--ks-shadow-md)}.ks-tts-info{flex:1;min-width:0;display:flex;flex-direction:column}.ks-tts-now{font-size:11px;font-weight:700;color:var(--ks-text);letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ks-tts-now em{color:var(--ks-gold);font-style:normal;font-family:"Noto Serif JP",serif;font-weight:700}.ks-tts-meta{font-size:9.5px;color:var(--ks-text-faint);font-weight:600}.ks-tts-controls{display:flex;align-items:center;gap:4px}.ks-tts-btn{width:32px;height:32px;border-radius:50%;background:transparent;color:var(--ks-text-dim);font-size:14px;display:grid;place-items:center;cursor:pointer;font-family:inherit;transition:background .15s,color .15s}.ks-tts-btn:hover{background:var(--ks-bg-3);color:var(--ks-text)}.ks-tts-play{width:38px;height:38px;border-radius:50%;background:var(--ks-gold);color:var(--ks-ink);display:grid;place-items:center;font-size:14px;font-weight:900;cursor:pointer;font-family:inherit;border:0;box-shadow:0 6px 14px -4px var(--ks-gold-50);transition:transform .15s}html[data-theme=light] .ks-tts-play{color:#fbf3dc}.ks-tts-play:hover{transform:scale(1.06)}.ks-stab-strip{margin-top:18px;border-bottom:1px solid var(--ks-line);display:flex;padding:0 16px}.ks-stab{flex:1;padding:14px 4px;text-align:center;font-size:13px;font-weight:700;color:var(--ks-text-faint);border:0;background:transparent;border-bottom:2px solid transparent;letter-spacing:.02em;cursor:pointer;transition:color .15s,border-color .15s;font-family:inherit;min-height:44px}.ks-stab:hover{color:var(--ks-text)}.ks-stab[aria-selected=true],.ks-stab.is-active{color:var(--ks-gold);border-bottom-color:var(--ks-gold)}} {story.translation_vi}
// Word list Từ ghép thường gặp Xem tất cả →
{words.map(w => (
{} {renderWithTarget(w.text,kanji.char)}
{w.kana} · {w.romaji}
{w.meaning_vi}
playTTS(w)}>▸ ))}
問
Kiểm tra nhanh
Chọn nghĩa đúng — 1 trên 4
{kanji.char} nghĩa là gì?
{opts.map((o,i) => ( answer(o)} > {"ABCD"[i]} {o.text} ))}
// optClass: // - submitted && o.correct → "ks-opt-correct" // - submitted && o.id === picked && !o.correct → "ks-opt-wrong" // - else → "" // Pager ‹ Kanji trước Kanji tiếp ›
9) TTSPlayer.jsx — sticky pill at bottom of phone viewport: {playing ? "⏸" : "▶"} Đang đọc · {nowPlaying.title}
{fmt(currentTime)}/{fmt(duration)}·{rate.toFixed(1)}×
⟲ ⏯
Mount TTS as the LAST child of phone viewport (so position:absolute bottom:0 anchors correctly). It auto-fades content above it via gradient mask in `.ks-tts`. ============================================================ */{}