*,*: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;min-height:100dvh;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;min-height:100dvh;padding: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;min-height:100dvh;width:100%;max-width:600px;margin:0 auto;padding:0 16px 12px}.game-header{display:flex;align-items:center;justify-content:space-between;padding:10px 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:14px;margin-bottom:10px;display:flex;flex-direction:column;align-items:center;box-shadow:0 8px 24px #0000001a}.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;min-height:100dvh;width:100%;max-width:600px;margin:0 auto;padding:0 16px 12px;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:1;min-height:0;align-items:center}.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--triangle{background:#ffb40033}.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}}.runner-wrap{position:fixed;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,#87ceeb,#c5e8ff 60%,#a0824a);display:flex;flex-direction:column;z-index:200;touch-action:none;user-select:none;-webkit-user-select:none;font-family:-apple-system,Hiragino Sans,Hiragino Kaku Gothic ProN,Yu Gothic,Noto Sans JP,sans-serif;cursor:pointer}.runner-hdr{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;background:#ffffff4d;flex-shrink:0}.runner-hdr__title{font-size:1.5rem;font-weight:900;color:#333}.runner-hdr__dist{font-size:1.5rem;font-weight:900;color:#333;background:#fff9;border-radius:10px;padding:4px 12px}.runner-canvas{width:100%;height:auto;display:block;max-width:600px;margin:0 auto}.runner-over{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:#00000080;z-index:10}.runner-over__title{font-size:clamp(2rem,7vw,3rem);font-weight:900;color:#fff;animation:pop-in .3s cubic-bezier(.34,1.56,.64,1) both}.runner-over__dist{font-size:clamp(1.6rem,5vw,2.2rem);font-weight:700;color:#ffe066;animation:pop-in .3s .05s cubic-bezier(.34,1.56,.64,1) both}.runner-over__best{font-size:1.2rem;color:gold;animation:pop-in .3s .1s cubic-bezier(.34,1.56,.64,1) both}.runner-over__btns{display:flex;gap:16px;margin-top:8px;animation:pop-in .3s .15s cubic-bezier(.34,1.56,.64,1) both}.runner-btn{border:none;border-radius:16px;padding:16px 28px;font-size:1.4rem;font-weight:700;font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .1s,box-shadow .1s}.runner-btn:active{transform:translateY(4px);box-shadow:none!important}.runner-btn--retry{background:#5c7cfa;color:#fff;box-shadow:0 6px #3b5bdb}.runner-btn--next{background:#ff9f1c;color:#fff;box-shadow:0 6px #cc7a00}@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}}