*,*:before,*:after{box-sizing:border-box}body{margin:0;padding:16px;font-family:var(--font-sans, system-ui, sans-serif);background:var(--color-background-primary, #fff)}#app-root{-webkit-user-select:none;user-select:none}#app-root[data-grade=K]{--c-gap:#f6ad55;--c-cell-bg:#fffaf0;--c-cell-text:#7b341e;--c-frog-bg:#68d391;--c-frog-border:#276749;--c-prompt-bg:#fefcbf;--c-prompt-border:#f6e05e;--c-prompt-text:#744210}#app-root[data-grade="1"]{--c-gap:#76e4f7;--c-cell-bg:#ebfffe;--c-cell-text:#065666;--c-frog-bg:#68d391;--c-frog-border:#276749;--c-prompt-bg:#e6fffa;--c-prompt-border:#81e6d9;--c-prompt-text:#234e52}#app-root[data-grade="2"]{--c-gap:#f687b3;--c-cell-bg:#fff5f7;--c-cell-text:#702459;--c-frog-bg:#68d391;--c-frog-border:#276749;--c-prompt-bg:#fed7e2;--c-prompt-border:#f687b3;--c-prompt-text:#702459}#app-root[data-grade="3"]{--c-gap:#9f7aea;--c-cell-bg:#faf5ff;--c-cell-text:#44337a;--c-frog-bg:#68d391;--c-frog-border:#276749;--c-prompt-bg:#e9d8fd;--c-prompt-border:#9f7aea;--c-prompt-text:#44337a}button.action-btn{padding:9px 22px;border-radius:8px;font-size:14px;font-family:inherit;cursor:pointer;font-weight:500}.snd-btn{font-size:18px;cursor:pointer;background:none;border:none;padding:2px 6px;border-radius:6px;line-height:1}.snd-btn:hover{background:var(--color-background-secondary, #f0f0f0)}.grade-btn{padding:0;border:2px solid transparent;border-radius:12px;background:var(--color-background-primary, #fff);cursor:pointer;font-family:inherit;transition:transform .15s,box-shadow .15s;overflow:hidden;text-align:left;box-shadow:0 1px 3px #00000014}.grade-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001f}.grade-btn:active{transform:scale(.97)}.grade-header{padding:12px 16px 8px}.grade-label{font-size:18px;font-weight:600;margin:0 0 2px}.grade-sub{font-size:12px;opacity:.7;margin:0}.grade-body{padding:4px 16px 14px;border-top:1px solid rgba(0,0,0,.06)}.grade-topics{font-size:12px;line-height:1.8;margin:6px 0 0;opacity:.85}.gk{border-top:4px solid #ed8936;background:linear-gradient(135deg,#fffaf0,#fefcbf)}.gk .grade-label,.gk .grade-sub,.gk .grade-topics{color:#7b341e}.g1{border-top:4px solid #0bc5ea;background:linear-gradient(135deg,#ebfffe,#e6fffa)}.g1 .grade-label,.g1 .grade-sub,.g1 .grade-topics{color:#065666}.g2{border-top:4px solid #ed64a6;background:linear-gradient(135deg,#fff5f7,#fed7e2)}.g2 .grade-label,.g2 .grade-sub,.g2 .grade-topics{color:#702459}.g3{border-top:4px solid #805ad5;background:linear-gradient(135deg,#faf5ff,#e9d8fd)}.g3 .grade-label,.g3 .grade-sub,.g3 .grade-topics{color:#44337a}.overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;border-radius:10px;overflow:hidden}#fw-canvas{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;will-change:transform;z-index:1}.overlay-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:12px;background:transparent;border-radius:12px;padding:20px 28px}.overlay-content.win-content h2,.overlay-content.win-content p,.overlay-content.lose-content h2,.overlay-content.lose-content p{color:#fff;text-shadow:0 0 4px rgba(0,0,0,.9),0 0 8px rgba(0,0,0,.7),0 1px 2px rgba(0,0,0,1),0 2px 6px rgba(0,0,0,.6)}.overlay-content.win-content .btn-row button,.overlay-content.lose-content .btn-row button{background:#00000073;color:#fff;border:1.5px solid rgba(255,255,255,.5);text-shadow:0 1px 2px rgba(0,0,0,.8)}.overlay-content.win-content .btn-row button:hover,.overlay-content.lose-content .btn-row button:hover{background:#000000a6}.overlay h2{font-size:20px;font-weight:700;margin:0}.overlay p{margin:0;font-size:14px;text-align:center;max-width:240px;line-height:1.6}.overlay-content.lose-content{animation:fadeInUp .4s ease .15s both}.result-slot{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--c-cell-bg, #f7fafc);border:1.5px solid var(--c-gap, #a0aec0);font-size:18px;flex-shrink:0}.result-slot.correct{background:#c6f6d5;border-color:#38a169;color:#276749}.result-slot.wrong{background:#fed7d7;border-color:#e53e3e;color:#9b2c2c}@keyframes wobble{0%,to{transform:rotate(0) scale(1)}15%{transform:rotate(-8deg) scale(1.1)}30%{transform:rotate(7deg) scale(1.05)}45%{transform:rotate(-6deg) scale(1.08)}60%{transform:rotate(5deg) scale(1.04)}75%{transform:rotate(-3deg) scale(1.02)}}@keyframes dizzy-orbit{0%{transform:rotate(0) translate(38px) rotate(0)}to{transform:rotate(360deg) translate(38px) rotate(-360deg)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.lose-frog{font-size:56px;display:inline-block;animation:wobble .7s ease .1s 3}.dizzy-wrap{position:relative;width:80px;height:80px;display:flex;align-items:center;justify-content:center;margin:0 auto 4px}.dizzy-star{position:absolute;top:50%;left:50%;font-size:16px;animation:dizzy-orbit 1s linear infinite}#screen-game-select{display:flex;flex-direction:column;gap:20px;max-width:680px}#gs-header{display:flex;align-items:center;justify-content:space-between}.gs-main-title{font-size:24px;font-weight:700;color:var(--color-text-primary);margin-bottom:4px}.gs-main-sub{font-size:14px;color:var(--color-text-secondary)}#gs-games{display:flex;flex-direction:column;gap:20px}.gs-game-card{border:1.5px solid rgba(0,0,0,.1);border-radius:14px;overflow:hidden;background:var(--color-background-primary, #fff);box-shadow:0 2px 8px #00000012}.gs-game-header{padding:16px 20px 12px;border-bottom:1px solid rgba(0,0,0,.06)}.gs-game-title{font-size:18px;font-weight:700;color:var(--color-text-primary);margin-bottom:4px}.gs-game-desc{font-size:13px;color:var(--color-text-secondary);line-height:1.5}.gs-grade-row{display:grid;grid-template-columns:repeat(4,1fr);gap:0}.gs-grade-btn{border-radius:0;border:none;border-right:1px solid rgba(0,0,0,.06)}.gs-grade-btn:last-child{border-right:none}.gs-grade-btn:hover{transform:none;box-shadow:inset 0 0 0 2px #00000026}#g1-grid{display:grid;grid-template-columns:repeat(6,58px);gap:3px;background:var(--c-gap, #a0aec0);border:3px solid var(--c-gap, #a0aec0);border-radius:10px;overflow:hidden}.g1-cell{width:58px;height:58px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:600;background:var(--c-cell-bg, #f7fafc);color:var(--c-cell-text, #1a202c);transition:background .1s}.g1-cell.eaten{background:var(--c-cell-bg, #e2e8f0);color:var(--c-gap, #a0aec0);font-size:13px;text-decoration:line-through;opacity:.5}.g1-cell.munchie{background:var(--c-frog-bg, #48bb78);font-size:26px;box-shadow:inset 0 0 0 2px var(--c-frog-border, #276749)}#g1-prompt-box{background:var(--c-prompt-bg);border:1.5px solid var(--c-prompt-border);border-radius:10px;padding:12px 16px;max-width:200px}#g1-prompt-label{font-size:10px;color:var(--c-prompt-text);letter-spacing:.5px;text-transform:uppercase;margin-bottom:6px;opacity:.75}#g1-prompt-text{font-size:17px;font-weight:600;color:var(--c-prompt-text);line-height:1.5}#g1-cur-val-box{background:var(--c-prompt-bg);border:1.5px solid var(--c-prompt-border);border-radius:10px;padding:8px 14px;text-align:center;min-width:110px}#g1-cur-val-label{font-size:11px;color:var(--c-prompt-text);opacity:.75;margin-bottom:3px}#g1-cur-val{font-size:26px;font-weight:700;color:var(--c-prompt-text)}#g1-screen{display:none;flex-direction:column;gap:0}#g2-screen{display:none;flex-direction:column;align-items:center;gap:16px}#g2-answer-box{background:var(--c-prompt-bg);border:1.5px solid var(--c-prompt-border);border-radius:10px;padding:10px 24px;text-align:center}#g2-answer-label{font-size:10px;color:var(--c-prompt-text);letter-spacing:.5px;text-transform:uppercase;opacity:.75;margin-bottom:4px}#g2-answer-value{font-size:36px;font-weight:800;color:var(--c-prompt-text)}#g2-arena{display:flex;align-items:center;justify-content:center;gap:0;position:relative;background:var(--c-gap, #a0aec0);border:3px solid var(--c-gap, #a0aec0);border-radius:10px;overflow:hidden}.g2-eq-cell{width:130px;height:90px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:20px;font-weight:700;background:var(--c-cell-bg);color:var(--c-cell-text);text-align:center;padding:8px;transition:background .1s}.g2-eq-cell.eaten{opacity:.4;text-decoration:line-through}.g2-eq-cell.munchie-here{background:var(--c-frog-bg);box-shadow:inset 0 0 0 2px var(--c-frog-border)}.g2-eq-cell.munchie-here .g2-frog-icon{display:block}.g2-eq-cell.munchie-here .g2-eq-text{font-size:14px}.g2-frog-icon{display:none;font-size:28px;line-height:1}.g2-frog-cell{width:60px;height:90px;display:flex;align-items:center;justify-content:center;font-size:40px;background:var(--c-frog-bg);box-shadow:inset 0 0 0 2px var(--c-frog-border);transition:opacity .1s}.g2-frog-cell.hidden{opacity:0}.g2-eq-cell.gap-right{border-right:3px solid var(--c-gap, #a0aec0)}.g2-eq-cell.gap-left{border-left:3px solid var(--c-gap, #a0aec0)}#g2-scores{display:flex;gap:32px}.g2-score-group{display:flex;flex-direction:column;align-items:center;gap:6px}.g2-score-label{font-size:10px;color:var(--color-text-secondary);letter-spacing:.5px;text-transform:uppercase}.g2-slots{display:flex;gap:6px}#g2-end-overlay{position:relative;width:343px;min-height:200px;display:none;flex-direction:column;align-items:center;justify-content:center;gap:12px;border-radius:10px;overflow:hidden;background:var(--c-gap, #a0aec0)}