@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400&family=Noto+Serif+JP:wght@400&family=M+PLUS+Rounded+1c:wght@400&family=Shippori+Mincho:wght@400&family=Kosugi+Maru&display=swap";*{box-sizing:border-box}:root{font-family:Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#000;background-color:#fbf5ed;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{margin:0;padding:0;width:100%;overflow-x:hidden}body{margin:0;padding:0;width:100%;min-height:100vh;min-height:100dvh;overflow-x:hidden}#root{width:100%;margin:0;padding:0;overflow-x:hidden}.app-container{width:100%;max-width:100vw;height:100vh;display:flex;flex-direction:column;align-items:center;padding:1.5rem;overflow:hidden;position:relative;box-sizing:border-box}.header{width:100%;display:flex;justify-content:center;align-items:center;gap:1rem;flex-wrap:wrap;margin:0}.toggle-btn{display:inline-flex;align-items:center;justify-content:center;width:3.2rem;height:2.8rem;padding:.6rem;font-size:1.2rem;font-weight:500;color:inherit;background-color:#e5c89a4d;border:1px solid rgba(201,176,136,.4);border-radius:8px;cursor:pointer;outline:none;transition:all .2s ease;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none}.toggle-btn svg{display:block;flex-shrink:0}.toggle-btn:focus,.toggle-btn:active{outline:none}.toggle-btn:active{transform:scale(.98)}.kanji-btn.active,.alternatives-btn.active,.translation-btn.active{background-color:#bea06eb3;border-color:#aa8c5fcc}.kanji-btn.active:hover,.alternatives-btn.active:hover,.translation-btn.active:hover{background-color:#b49664bf;border-color:#a08255d9}.flashcard-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100%;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.kana-wrapper{display:flex;flex-direction:column;align-items:center;margin-top:2rem}.furigana{height:2rem;min-height:2rem;font-size:2rem;font-weight:400;line-height:1;color:inherit;text-align:center;-webkit-user-select:none;user-select:none}.kana{font-size:6rem;font-weight:400;line-height:1.2;color:inherit;text-align:center;-webkit-user-select:none;user-select:none}.kana.kana-long{font-size:4.5rem}.kana.kana-very-long{font-size:3.5rem}.kana.mixed-mode,.furigana.mixed-mode{color:inherit}.answer-section{display:flex;flex-direction:column;align-items:center;gap:.5rem}.romaji{height:2.2rem;margin-top:.5rem;font-size:1.8rem;font-weight:400;color:#000;text-align:center}.romaji-spacer{height:2.2rem;margin-top:.5rem;visibility:visible;pointer-events:none}.translation{height:1.6rem;margin-top:.5rem;font-size:1.3rem;font-weight:300;font-style:italic;color:#0009;text-align:center}.translation-spacer{height:1.6rem;margin-top:.5rem;visibility:visible;pointer-events:none}.action-btn{min-width:150px;max-width:300px;margin-top:1rem;padding:.9rem 2.5rem;font-size:1.1rem;font-weight:400;color:inherit;background-color:#e5c89a4d;border:1px solid rgba(201,176,136,.4);border-radius:8px;box-shadow:none;cursor:pointer;transition:all .2s ease;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none}.action-btn:hover{background-color:#d4bc9666;border-color:#c9b08880}.action-btn:active{transform:scale(.98)}.action-btn-spacer{min-width:150px;height:3.8rem;padding:.9rem 2.5rem;font-size:1.1rem;visibility:hidden;pointer-events:none}.romaji-input{width:100%;max-width:450px;height:3.4rem;margin-top:1rem;padding:.8rem 1.5rem;font-size:1.8rem;font-weight:400;color:inherit;background-color:#ffffff80;border:2px solid rgba(201,176,136,.4);border-radius:8px;box-sizing:border-box;text-align:center;outline:none;transition:all .2s ease}.romaji-input:focus{background-color:#fffc;border-color:#c9b08899;box-shadow:0 0 0 3px #e5c89a33}.romaji-input:disabled{opacity:.7;cursor:not-allowed}.romaji-input::placeholder{opacity:.4}.romaji-input.input-correct{background-color:#4caf5014;border-color:#4caf50b3}.romaji-input.input-incorrect{background-color:#dc26261f;border-color:#dc2626}.input-spacer{height:3.4rem;margin-top:1rem;visibility:visible;pointer-events:none}.inline-feedback{display:flex;align-items:center;justify-content:center;width:100%}.correct-answer{font-size:1.4rem;font-weight:400;font-family:inherit;color:#000;text-align:center}.alternatives{font-size:.85em;font-weight:400;opacity:.9}.welcome-screen{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;min-height:80vh;padding-top:10vh}.welcome-title{margin-bottom:1rem;font-family:Noto Sans JP,sans-serif;font-size:4rem;font-weight:300;color:inherit;text-align:center}.welcome-subtitle{margin-bottom:3rem;font-size:1.2rem;color:#0009;text-align:center}.welcome-buttons{display:flex;flex-direction:column;gap:1.5rem;width:100%;max-width:300px}.welcome-btn{padding:1.2rem 2rem;font-size:1.3rem;font-weight:500;color:inherit;background-color:#e5c89a4d;border:2px solid rgba(201,176,136,.4);border-radius:12px;cursor:pointer;transition:all .2s ease;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none}.welcome-btn:hover{background-color:#d4bc9666;border-color:#c9b08880}.quiz-screen{justify-content:flex-start;padding-top:2rem}.quiz-controls{margin-bottom:2rem}.quiz-stats{display:flex;justify-content:center;align-items:center;gap:1.5rem;margin-bottom:2rem;flex-wrap:wrap}.quiz-stat{display:flex;flex-direction:column;align-items:center;gap:.3rem}.quiz-stat-label{font-size:.9rem;font-weight:500;color:#0009}.quiz-stat-value{font-size:1.8rem;font-weight:600;color:inherit}.quiz-stat-correct .quiz-stat-value{color:#4caf50}.quiz-stat-incorrect .quiz-stat-value{color:#dc2626}.quiz-romaji,.quiz-question{margin-bottom:3rem;font-size:3rem;font-weight:500;color:inherit;text-align:center}.quiz-options{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:500px}.quiz-option{display:flex;align-items:center;justify-content:center;height:4.5rem;padding:1.2rem 1.5rem;font-size:1.8rem;font-weight:400;color:#000;background-color:#e5c89a4d;border:none;border-radius:0;box-sizing:border-box;text-align:center;cursor:pointer;outline:none;user-select:none;transition:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;touch-action:manipulation}.quiz-option:disabled{cursor:default;pointer-events:none}.quiz-option-correct{background-color:#4caf504d!important;color:#4caf50!important}.quiz-option-incorrect{background-color:#dc26264d!important;color:#dc2626!important}.rsvp-screen{display:flex;flex-direction:column;align-items:center;min-height:100vh}.rsvp-controls{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:600px;margin-bottom:2rem}.rsvp-timer{font-size:1.5rem;font-weight:600;color:inherit;min-width:60px;text-align:center}.rsvp-start-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;max-width:600px;width:100%;text-align:center;margin-top:2rem}.rsvp-config-section{display:flex;flex-direction:column;gap:1.5rem;width:100%}.rsvp-config-row{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;justify-content:center}.rsvp-config-options{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}.rsvp-display-options{max-width:286px}.rsvp-option-btn{width:90px;height:2.8rem;padding:.5rem;font-size:.95rem;font-weight:500;color:inherit;background-color:#e5c89a4d;border:1px solid rgba(201,176,136,.4);border-radius:8px;cursor:pointer;outline:none;transition:all .2s ease;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;box-sizing:border-box}.rsvp-option-btn:hover{background-color:#d4bc9666;border-color:#c9b08880}.rsvp-toggle-btn,.rsvp-toggle-btn:hover{background-color:#e6d2b466;border-color:#d2b99680}.rsvp-option-btn.active{background-color:#bea06eb3;border-color:#aa8c5fcc}.rsvp-option-btn:active{transform:scale(.98)}.rsvp-instructions{font-size:1.1rem;line-height:1.6;color:#000000b3;margin:0}.rsvp-start-btn{margin-top:1rem}.rsvp-word-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;flex:1;width:100%;padding-top:8rem;cursor:pointer}.rsvp-word{font-size:5rem;font-weight:500;color:inherit;text-align:center;transition:opacity .1s ease-in-out}.rsvp-romaji{font-size:3.5rem;font-weight:400;color:#999;text-align:center;margin-top:.5rem;transition:opacity .1s ease-in-out}.rsvp-restart-btn{margin-top:3rem}.rsvp-end-screen{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:80vh;text-align:center}.rsvp-end-title{font-size:3rem;font-weight:400;color:inherit;margin-bottom:1rem}.rsvp-end-message{font-size:1.2rem;color:#0009;margin-bottom:3rem}.rsvp-end-actions{display:flex;flex-direction:row;gap:1rem;justify-content:center;align-items:center}.karaoke-start-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;width:100%;max-width:500px;margin:0 auto}.karaoke-start-btn{margin-top:1rem}.karaoke-sentence-container{display:flex;align-items:flex-start;justify-content:center;flex:1;width:100%;min-height:calc(100vh - 8rem);padding-top:8rem;cursor:pointer}.karaoke-sentence{font-size:2.25rem;font-weight:500;line-height:1.6;text-align:center;max-width:90%}.karaoke-word{color:#0000004d;transition:color .1s ease-in-out;margin-right:.5rem}.karaoke-word.highlighted{color:#000}@media(max-width:768px){.app-container{padding:1rem}.header{gap:.75rem}.toggle-btn{padding:.55rem;font-size:1.1rem}.alternatives-btn,.translation-btn{font-size:.85rem}.furigana{height:1.5rem;min-height:1.5rem;font-size:1.5rem}.kana{font-size:4.5rem}.kana.kana-long{font-size:3.5rem}.kana.kana-very-long{font-size:2.7rem}.romaji{font-size:1.5rem}.translation{margin-top:0rem;font-size:1.15rem}.translation-spacer{margin-top:0rem}.action-btn{min-width:140px;max-width:300px;padding:.8rem 2rem;font-size:1rem}.romaji-input{max-width:400px;font-size:1.5rem}.correct-answer{font-size:1.5rem}.welcome-title{font-size:3rem}.welcome-subtitle{font-size:1rem}.quiz-stats{margin-top:1.5rem}.quiz-romaji,.quiz-question{font-size:2.5rem}.quiz-option{height:4rem;padding:1rem 1.2rem;font-size:1.6rem}.rsvp-word{font-size:4rem}.rsvp-romaji{font-size:2.8rem}.rsvp-end-title{font-size:2.5rem}}@media(max-width:480px){.app-container{padding:.75rem}.header{gap:.5rem;font-size:.9rem}.toggle-btn{width:2.8rem;padding:.5rem;font-size:1rem}.alternatives-btn,.translation-btn{font-size:.8rem}.furigana{height:1.3rem;min-height:1.3rem;font-size:1.3rem}.kana{font-size:2.7rem}.kana.kana-long{font-size:2rem}.kana.kana-very-long{font-size:1.5rem}.romaji{font-size:1.3rem}.translation{margin-top:0rem;font-size:1rem}.translation-spacer{margin-top:0rem}.action-btn{min-width:100%;padding:.75rem 1.5rem;font-size:.95rem}.romaji-input{max-width:100%;padding:.7rem 1rem;font-size:1.3rem}.correct-answer{font-size:1.3rem}.welcome-title{font-size:2.5rem}.welcome-subtitle{font-size:.9rem}.quiz-stats{margin-top:1.5rem}.quiz-romaji,.quiz-question{font-size:2rem}.quiz-option{height:3.5rem;padding:.9rem 1rem;font-size:1.4rem}.rsvp-word{font-size:3rem}.rsvp-romaji{font-size:2.1rem}.rsvp-end-title{font-size:2rem}.rsvp-instructions{font-size:1rem}.karaoke-sentence{font-size:1.5rem}.rsvp-option-btn{font-size:.85rem;padding:.4rem .8rem}}@media(min-width:769px){.quiz-controls{justify-content:center}}