body{background:#0f1d2b}.story-quiz{max-width:820px;margin:0 auto;padding:40px 20px 80px;color:#dbe7ff}.story-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}.story-top.centered{justify-content:center}.story-progress-label{font-size:13px;letter-spacing:1px;color:#8fa8c9}.story-exit{background:rgba(255,255,255,.06);color:#a8c3e7;border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:6px 14px;font-size:13px}.story-question{font-size:32px;font-weight:700;color:#fff;text-align:center}.story-question-english{font-size:19px;font-weight:400;color:#8fa8c9;text-align:center;margin-top:10px}.story-hiragana{margin-top:10px;text-align:center;font-size:18px;color:#8fa8c9}.story-controls{display:flex;align-items:center;justify-content:center;gap:16px;margin:22px 0 28px}.hear-btn{display:inline-flex;align-items:center;gap:10px;background:#1e2c3b;color:#cfe2ff;border:1px solid rgba(255,255,255,.08);padding:10px 16px;border-radius:26px;box-shadow:inset 0 -1px #ffffff0d}.hear-btn i{color:#cfe2ff}.hear-btn span{font-size:13px}.toggle-group{display:inline-flex;align-items:center;gap:12px}.switch{position:relative;display:inline-block;width:52px;height:28px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;top:0;right:0;bottom:0;left:0;background:#314458;border-radius:28px;transition:.3s}.slider:before{content:"";position:absolute;height:22px;width:22px;left:4px;top:3px;background:#cfe2ff;border-radius:50%;transition:.3s}.switch input:checked+.slider{background:#466381}.switch input:checked+.slider:before{transform:translate(24px)}.toggle-group .label{margin-left:2px;color:#a8c3e7;font-size:13px}.story-options{display:flex;flex-direction:column;gap:18px}.story-options .option{background:#1b2a39;border:1px solid #2e455b;border-radius:16px;padding:22px 20px;color:#cfe2ff;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background-color .22s ease;will-change:transform}.story-options .option.disabled{pointer-events:none;opacity:.9}.story-options .opt-kanji{font-size:26px;color:#fff;text-align:center}.story-options .opt-hira{font-size:16px;color:#7fa7e0;text-align:center;margin-top:6px}.story-options .option.selected{outline:2px solid #546e8f}.story-options .option.correct-animation{border-color:#38ab69;box-shadow:0 0 0 2px #38ab69 inset;animation:storyCorrectPop .42s cubic-bezier(.2,.8,.2,1) both}.story-options .option.correct-reveal{border-color:#38ab69;animation:storyGreenPulse .8s ease-out 1 both}.story-options .option.incorrect-animation{border-color:#f5787a;box-shadow:0 0 0 2px #f5787a inset;animation:storySmoothShake .52s cubic-bezier(.36,.07,.19,.97) both}.story-actions{display:flex;justify-content:center;margin-top:22px}.next-btn{background:#203043;color:#cfe2ff;border:1px solid rgba(255,255,255,.08);border-radius:28px;padding:12px 22px;font-size:14px}.final-wrapper{display:grid;place-items:center;min-height:60vh}.final-panel{text-align:center;padding:24px 26px;border-radius:18px}.final-title{text-align:center;font-size:50px;color:#cfe2ff;margin-top:8px;margin-bottom:16px}.final-line{text-align:center;font-size:35px;color:#a8c3e7;margin:8px 0}.final-line.correct span{color:#38ab69}.final-line.wrong span{color:#f5787a}.final-actions{display:flex;justify-content:center;margin-top:18px}.restart-btn{background:#203043;color:#cfe2ff;border:1px solid rgba(255,255,255,.08);border-radius:28px;padding:12px 22px;font-size:15px}@keyframes storySmoothShake{0%{transform:translate(0)}13%{transform:translate(-10px)}26%{transform:translate(10px)}39%{transform:translate(-8px)}52%{transform:translate(8px)}65%{transform:translate(-6px)}78%{transform:translate(6px)}91%{transform:translate(-3px)}to{transform:translate(0)}}@keyframes storyCorrectPop{0%{transform:scale(1)}45%{transform:scale(1.06)}70%{transform:scale(.98)}to{transform:scale(1.03)}}@keyframes storyGreenPulse{0%{box-shadow:0 0 #38ab6900,0 0 0 2px #38ab69 inset}50%{box-shadow:0 0 0 10px #38ab692e,0 0 0 2px #38ab69 inset}to{box-shadow:0 0 #38ab6900,0 0 0 2px #38ab69 inset}}@media (prefers-reduced-motion: reduce){.story-options .option.correct-animation,.story-options .option.incorrect-animation,.story-options .option.correct-reveal{animation:none}}@media (max-width: 600px){.story-question{font-size:24px}.story-hiragana{font-size:16px}.story-options .opt-kanji{font-size:22px}.final-title{font-size:42px}.final-line{font-size:25px}.final-wrapper{min-height:50vh}}.inline-hira{color:#8fa8c9;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-left:2px}