*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{-webkit-tap-highlight-color:transparent;overscroll-behavior:none}.app{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(160deg,#fff0c8,#ffe4a0);font-family:-apple-system,Hiragino Sans,Hiragino Kaku Gothic ProN,Yu Gothic,Noto Sans JP,sans-serif;user-select:none;-webkit-user-select:none;position:relative}.level-select{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:40px 24px;gap:20px}.level-select__title{font-size:clamp(2.4rem,8vw,3.2rem);font-weight:900;color:#e85d04;text-align:center;line-height:1.3;text-shadow:2px 3px 0 rgba(0,0,0,.1)}.level-select__buttons{display:flex;flex-direction:column;gap:18px;width:100%;max-width:400px}.level-btn{border:none;border-radius:20px;padding:20px 32px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;box-shadow:0 7px #0003;transition:transform .1s,box-shadow .1s;-webkit-tap-highlight-color:transparent}.level-btn:active{transform:translateY(5px);box-shadow:0 2px #0003}.level-btn__label{font-size:1.8rem;font-weight:700;color:#fff}.level-btn__sub{font-size:1rem;color:#ffffffd9}.game-screen{display:flex;flex-direction:column;min-height:100vh;width:100%;max-width:600px;margin:0 auto;padding:0 16px 24px}.game-header{display:flex;align-items:center;justify-content:space-between;padding:14px 0;flex-shrink:0}.back-btn{background:#fff;border:none;border-radius:12px;padding:10px 18px;font-size:1.1rem;font-family:inherit;cursor:pointer;box-shadow:0 4px #0000001f;-webkit-tap-highlight-color:transparent;transition:transform .1s,box-shadow .1s}.back-btn:active{transform:translateY(3px);box-shadow:0 1px #0000001f}.score{font-size:1.2rem;font-weight:700;color:#555;background:#fff;border-radius:12px;padding:8px 16px;box-shadow:0 4px #0000001a}.word-card{background:#fff;border-radius:24px;padding:20px;margin-bottom:16px;display:flex;flex-direction:column;align-items:center;box-shadow:0 8px 24px #0000001a;flex:1;min-height:0}.word-image-container{width:100%;max-width:260px;aspect-ratio:1;display:flex;align-items:center;justify-content:center;margin-bottom:12px;flex-shrink:0}.word-image{width:100%;height:100%;object-fit:contain;border-radius:16px}.word-image-fallback{width:100%;height:100%;background:#f5f5f5;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:5rem;color:#ccc}.word-text{font-size:clamp(2.4rem,7vw,3.2rem);font-weight:900;color:#222;letter-spacing:.08em}.question-text{font-size:1.3rem;color:#999;margin-top:6px}.reading-screen{display:flex;flex-direction:column;min-height:100vh;width:100%;max-width:600px;margin:0 auto;padding:0 16px 24px;background:linear-gradient(160deg,#fff0c8,#ffe4a0)}.reading-card{flex:1;justify-content:center}.reading-image-container{max-width:340px}.reading-word-text{font-size:clamp(3rem,10vw,4.5rem);margin-top:16px}.reading-word-row{display:flex;align-items:center;gap:16px;margin-top:8px}.speak-btn{background:#e3f2fd;border:2px solid #90CAF9;border-radius:50%;width:56px;height:56px;font-size:1.6rem;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 3px #64b5f6;flex-shrink:0;-webkit-tap-highlight-color:transparent;transition:transform .1s,box-shadow .1s}.speak-btn:active{transform:translateY(2px);box-shadow:0 1px #64b5f6}.next-btn{border:none;border-radius:20px;padding:22px 0;font-size:1.8rem;font-weight:700;font-family:inherit;color:#fff;background:#5c7cfa;box-shadow:0 7px #3b5bdb;cursor:pointer;width:100%;-webkit-tap-highlight-color:transparent;transition:transform .1s,box-shadow .1s;flex-shrink:0}.next-btn:active{transform:translateY(5px);box-shadow:0 2px #3b5bdb}.level-select__divider{text-align:center;font-size:1.1rem;color:#9c6e00;margin:4px 0 -4px;position:relative}.level-select__divider:before,.level-select__divider:after{content:"";position:absolute;top:50%;width:22%;height:1px;background:#c8a000;opacity:.5}.level-select__divider:before{left:0}.level-select__divider:after{right:0}.level-btn--read,.level-btn--lv1{background:#5c7cfa}.level-btn--lv2{background:#ff9f1c}.image-choices{display:flex;gap:12px;justify-content:center;flex-shrink:0}.image-choice-btn{flex:1;aspect-ratio:1;background:#fff;border:3px solid #74B9FF;border-radius:20px;padding:10px;cursor:pointer;box-shadow:0 5px #4a90d9;-webkit-tap-highlight-color:transparent;transition:transform .1s,box-shadow .1s,border-color .15s,background .15s;overflow:hidden;display:flex;align-items:center;justify-content:center}.image-choice-btn img{width:100%;height:100%;object-fit:contain;border-radius:12px}.image-choice-btn:active:not(:disabled){transform:translateY(4px);box-shadow:0 1px #4a90d9}.image-choice-btn:disabled{cursor:default}.image-choice-btn--correct{background:#e8f5e9!important;border-color:#2f9e44!important;box-shadow:0 5px #1e7b33!important}.image-choice-btn--wrong{background:#ffebee!important;border-color:#c92a2a!important;box-shadow:0 5px #9b1c1c!important;animation:shake .4s ease}.image-choice-fallback{font-size:1.4rem;color:#999}.choices{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;flex-shrink:0}.choices--grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;width:100%}.choice-cell--empty{aspect-ratio:1}.choice-btn{background:#fff;border:3px solid #74B9FF;border-radius:16px;font-size:2rem;font-weight:700;font-family:inherit;color:#333;cursor:pointer;box-shadow:0 5px #4a90d9;-webkit-tap-highlight-color:transparent;min-width:72px;min-height:72px;display:flex;align-items:center;justify-content:center;transition:transform .1s,box-shadow .1s,background .15s,border-color .15s}.choice-btn:active:not(:disabled){transform:translateY(4px);box-shadow:0 1px #4a90d9}.choice-btn:disabled{cursor:default}.choice-btn--sm{font-size:1.3rem;min-width:0;min-height:0;width:100%;aspect-ratio:1;border-width:2px;border-radius:10px;box-shadow:0 3px #4a90d9}.choice-btn--correct{background:#51cf66!important;border-color:#2f9e44!important;box-shadow:0 5px #1e7b33!important;color:#fff!important}.choice-btn--wrong{background:#ff6b6b!important;border-color:#c92a2a!important;box-shadow:0 5px #9b1c1c!important;color:#fff!important;animation:shake .4s ease}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}.result-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;z-index:100}.result-overlay--correct{background:#51cf6640}.result-overlay--wrong{background:#ff6b6b40}.result-mark{font-size:clamp(8rem,30vw,12rem);line-height:1;animation:pop-in .3s cubic-bezier(.34,1.56,.64,1) both}.result-text{font-size:clamp(2rem,6vw,3rem);font-weight:700;color:#333;margin-top:16px;animation:pop-in .3s .1s cubic-bezier(.34,1.56,.64,1) both}@keyframes pop-in{0%{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}@media (min-height: 900px){.word-image-container{max-width:320px}.word-text{font-size:3.6rem}}@media (max-height: 700px){.word-image-container{max-width:180px}.word-card{padding:14px}}