@import"https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&family=Fredoka+One&display=swap";*{box-sizing:border-box;margin:0;padding:0}.grade-card{transition:transform .15s,box-shadow .15s;cursor:pointer}.grade-card:hover{transform:translateY(-6px) scale(1.03);box-shadow:0 12px 32px #00000026!important}.grade-card:active{transform:scale(.97)}.choice-btn{transition:transform .12s,box-shadow .12s;cursor:pointer;border:none}.choice-btn:hover:not(:disabled){transform:scale(1.04);box-shadow:0 6px 20px #00000026}.choice-btn:active:not(:disabled){transform:scale(.96)}.choice-btn:disabled{cursor:default}@keyframes cardIn{0%{opacity:0;transform:scale(.92) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes cardOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.92)}}@keyframes bounce{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-8px)}75%{transform:translate(8px)}}@keyframes popIn{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.card-enter{animation:cardIn .3s ease forwards}.card-exit{animation:cardOut .3s ease forwards}.bounce{animation:bounce .4s ease}.shake{animation:shake .4s ease}.pop{animation:popIn .5s cubic-bezier(.34,1.56,.64,1) forwards}@media (prefers-color-scheme: dark){body{background:#0f0f22;color:#e0e0f0}.grade-card:hover{box-shadow:0 12px 32px #00000080!important}}
