.vocab-flashcard-container{cursor:pointer;width:100%;max-width:520px;height:420px;margin:0 auto;animation:.6s ease-out fadeInUp}.vocab-flashcard{perspective:1200px;width:100%;height:100%;position:relative}.vocab-flashcard-front,.vocab-flashcard-back{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);width:100%;height:100%;box-shadow:var(--shadow-md);backface-visibility:hidden;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:32px;transition:transform .5s,box-shadow .2s,border-color .2s;display:flex;position:absolute;overflow:hidden}.vocab-flashcard-front{transform:rotateY(0)}.vocab-flashcard-back{transform:rotateY(180deg)}.vocab-flashcard.flipped .vocab-flashcard-front{transform:rotateY(-180deg)}.vocab-flashcard.flipped .vocab-flashcard-back{transform:rotateY(0)}.vocab-flashcard-container:hover .vocab-flashcard-front,.vocab-flashcard-container:hover .vocab-flashcard-back{border-color:var(--color-border-strong);box-shadow:var(--shadow-lg)}.vocab-flashcard-container:focus{outline:none}.vocab-kanji{font-family:var(--font-jp);color:var(--color-ink);-webkit-user-select:none;user-select:none;text-align:center;font-size:4rem;font-weight:500;line-height:1.2}.vocab-kana-reading{font-family:var(--font-jp);color:var(--color-ink-muted);-webkit-user-select:none;user-select:none;text-align:center;font-size:1.4rem;font-weight:400}.vocab-definition{font-family:var(--font-ui);color:var(--color-ink);-webkit-user-select:none;user-select:none;text-align:center;width:100%;max-height:100%;font-size:1.6rem;font-weight:500;line-height:1.5;overflow-y:auto}.vocab-flashcard-front .audio-button,.vocab-flashcard-back .audio-button{background:var(--color-accent);cursor:pointer;z-index:10;width:48px;height:48px;box-shadow:var(--shadow-sm);color:#fff;border:none;border-radius:50%;justify-content:center;align-items:center;transition:background .2s,box-shadow .2s;display:flex;position:absolute;bottom:24px;right:24px}.vocab-flashcard-front .audio-button svg,.vocab-flashcard-back .audio-button svg{width:24px;height:24px}.vocab-flashcard-front .audio-button:hover,.vocab-flashcard-back .audio-button:hover{background:var(--color-accent-hover);box-shadow:var(--shadow-md)}.vocab-flashcard-front .audio-button:active,.vocab-flashcard-back .audio-button:active{transform:scale(.97)}.vocab-flashcard-front .audio-button:focus,.vocab-flashcard-back .audio-button:focus{outline:none}@media (prefers-reduced-motion:reduce){.vocab-flashcard-front,.vocab-flashcard-back{transition:none}.vocab-flashcard:not(.flipped) .vocab-flashcard-back,.vocab-flashcard.flipped .vocab-flashcard-front{visibility:hidden}}@media (max-width:768px){.vocab-flashcard-container{max-width:90%;height:360px}.vocab-kanji{font-size:3rem}.vocab-definition{font-size:1.3rem}}@media (max-width:480px){.vocab-flashcard-container{height:300px}.vocab-kanji{font-size:2.5rem}.vocab-definition{font-size:1.1rem}}
.vocab-quiz-container{width:100%;max-width:600px;margin:0 auto}.vocab-quiz-prompt{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);text-align:center;flex-direction:column;align-items:center;gap:8px;margin-bottom:32px;padding:48px 40px;display:flex}.vocab-quiz-kanji{font-family:var(--font-jp);color:var(--color-ink);-webkit-user-select:none;user-select:none;font-size:4rem;font-weight:500;line-height:1.2}.vocab-quiz-kana{font-family:var(--font-jp);color:var(--color-ink-muted);-webkit-user-select:none;user-select:none;font-size:1.3rem}.vocab-quiz-definition-prompt{font-family:var(--font-ui);color:var(--color-ink);-webkit-user-select:none;user-select:none;font-size:1.5rem;font-weight:500;line-height:1.5}.vocab-quiz-options{gap:14px;margin-bottom:24px;display:grid}.vocab-quiz-options.one-col{grid-template-columns:1fr}.vocab-quiz-options.two-col{grid-template-columns:repeat(2,1fr)}.vocab-quiz-option{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;min-height:72px;font-family:var(--font-ui);color:var(--color-ink);box-shadow:var(--shadow-sm);text-align:left;padding:16px 20px;font-size:1rem;font-weight:500;line-height:1.4;transition:background .3s,color .3s,border-color .3s,box-shadow .3s}.vocab-quiz-options.two-col .vocab-quiz-option{font-family:var(--font-jp);text-align:center;font-size:1.3rem}.vocab-quiz-option:hover:not(:disabled){background:var(--color-surface-hover);border-color:var(--color-border-strong);box-shadow:var(--shadow-md)}.vocab-quiz-option:focus{outline:none}.vocab-quiz-option:disabled{cursor:not-allowed}.vocab-quiz-option.correct{background:var(--color-correct-surface);border-color:var(--color-correct);color:var(--color-correct);box-shadow:var(--shadow-sm)}.vocab-quiz-option.incorrect{background:var(--color-error-surface);border-color:var(--color-error);color:var(--color-error);box-shadow:var(--shadow-sm)}@media (max-width:768px){.vocab-quiz-prompt{padding:36px 28px}.vocab-quiz-kanji{font-size:3rem}.vocab-quiz-options.two-col{grid-template-columns:1fr 1fr}.vocab-quiz-option{min-height:60px;padding:14px 16px}}@media (max-width:480px){.vocab-quiz-container{max-width:100%}.vocab-quiz-prompt{padding:28px 20px}.vocab-quiz-kanji{font-size:2.5rem}.vocab-quiz-definition-prompt{font-size:1.2rem}.vocab-quiz-options.two-col{grid-template-columns:1fr}}