body{width:100%;min-height:100vh;margin:0;padding:0;background-color:#7e80d9}#root{width:100%;height:auto;display:flex;flex-direction:column}:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}a{text-decoration:none}.main-page{width:100%;height:auto;align-items:center;display:flex}.main-img{width:40%;padding-top:20px;display:flex}.img-size{width:70%;height:auto;margin-left:15%;margin-top:20px}.main-content{width:50%;display:flex;flex-direction:column;justify-content:center;align-items:center}.main-title{text-align:center}h1{font-size:80px;color:#ffde36;text-align:center;font-family:Kdam Thmor Pro,sans-serif;margin:40px 0 0}h2{font-size:40px;color:#ffde36;font-family:Kdam Thmor Pro,sans-serif;margin-block-end:0;text-align:center}h3{font-size:20px;color:#40004d;font-weight:400}.operation-list{width:80%;height:auto;display:flex;flex-wrap:wrap;justify-content:space-between;row-gap:40px;padding-top:40px}.operation-list a{display:block;width:45%}button:hover{scale:1.1;text-decoration:none}.operation-button{width:100%;box-sizing:border-box;height:80px;background-color:#fff;color:#40004d;border-radius:24px;border:none;font-size:24px;display:flex;justify-content:center;align-items:center;cursor:pointer}.operation-button:hover{background-color:#ffde36}.operation-button:active{background-color:#f0c800;font-size:26px}.method-list{display:grid;width:100%;grid-template-columns:1fr 1fr;gap:40px;padding:0 10px;justify-content:space-between;align-items:center;margin-top:40px}.method-item{display:flex;flex-direction:column}.method-button{display:flex;width:100%;flex-grow:1;height:60px;background-color:#41e1be;color:#40004d;font-size:24px;border-radius:20px;cursor:pointer;justify-content:center;align-items:center;border:none}.method-selected-button{display:flex;width:40%;height:60px;background-color:#30a58c;color:#40004d;font-size:24px;border-radius:20px;cursor:pointer;justify-content:center;align-items:center;border:none}.header{width:100%;height:100px;position:relative}.go-back-button{position:absolute;left:60px;top:40px;padding:0 20px;height:40px;background-color:#40004d;color:#fff;font-size:20px;border-radius:8px;border:none}.show-result-button{position:absolute;right:60px;top:40px;padding:0 20px;height:40px;background-color:#fff;color:#40004d;font-size:20px;border-radius:8px;border:none}.example-page{display:flex;width:100%;gap:5%}.image-block{display:flex;flex-direction:column;width:40%;height:100%;justify-content:center;align-items:center}.img-example-page{padding:20px 20%;object-fit:cover}.example-block{display:flex;flex-direction:column;width:50%;align-items:center;justify-content:center}.formula{font-size:30px;color:#fff;text-align:center}.example-answer{display:flex;width:100%;justify-content:center;align-items:center}.example-box{display:flex;width:100%;height:100px;background-color:#ececec;border-radius:20px;border:8px rgba(255,222,54,1) solid;box-sizing:border-box;justify-content:center;align-items:center}.example-text{font-size:32px;font-weight:700;color:#3e82d5;text-align:center}.center{display:flex;margin:auto}.correct-incorrect-answer{color:#fff;font-size:40px;text-align:center;padding-top:20px}.input-field{width:100%;height:80px;border:none;border-radius:16px;font-size:36px;text-align:center;margin:20px auto}.answer-block{width:100%;display:flex;flex-wrap:wrap;row-gap:20px;column-gap:40px;justify-content:center;margin-bottom:40px}.answer-button{width:200px;height:80px;border-radius:30px;border:none;background-color:#fff;color:#40004d;font-size:24px;cursor:pointer}.answer-button:hover{background-color:#ffde36}.answer-button:disabled{background-color:#cecece;color:#737373}.answer-button:disabled:hover{cursor:not-allowed;scale:1}.result-block{padding:20px 10% 0;width:80%;display:flex;flex-direction:column;align-items:center}.result{color:#fff;font-size:30px}.go-to-main-page-button{width:240px;height:80px;margin-top:40px;border:none;border-radius:20px;background-color:#55a1ff;color:#fff;font-size:20px;font-weight:400}.go-to-main-page-button:hover{background-color:#ffde36;color:#40004d}.quiz-container{display:flex;flex-direction:column;align-items:center;gap:20px;margin-bottom:40px}.answers-container{display:flex;gap:10px;padding:40px}.answer-card{width:160px;height:80px;background-color:#154798;color:#fff;font-size:24px;text-align:center;display:flex;align-items:center;justify-content:center;border-radius:8px;cursor:grab;transition:transform .3s ease-in-out}.empty-card{background-color:#ccc;cursor:default}.drop-zone{width:240px;height:120px;border:2px dashed #666;display:flex;align-items:center;justify-content:center;text-align:center;border-radius:8px;position:relative;font-size:16px}.dropped-card{width:100%;height:100%;color:#fff;text-align:center;font-size:30px;font-weight:700;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:transform .3s ease-in-out}.correct-msg{color:green;font-size:18px}.wrong-msg{color:red;font-size:18px}@media screen and (min-width: 0px) and (max-width: 768px){.main-page{flex-direction:column;height:100vh}.img-size{margin:auto;width:100%}.main-content{width:80%}h1{font-size:40px}h2{font-size:32px;font-family:Kdam Thmor Pro,sans-serif}.operation-list{flex-direction:column;width:100%;row-gap:20px;align-items:center;padding-bottom:40px}.operation-list a{width:75%}.operation-button{height:60px;border-radius:20px;font-size:20px}.operation-button:active{font-size:22px}.example-page{flex-direction:column;justify-content:center;align-items:center;padding-bottom:40px}.image-block{width:50%;height:auto}.img-example-page{width:100%}.example-block{margin-top:20px;width:100%}.formula{font-size:24px}.example-answer{flex-direction:column;align-items:center}.example-box{width:80%;height:80px;border:6px rgba(255,222,54,1) solid}.example-text{font-size:28px}.correct-incorrect-answer{font-size:32px;transform:none}.input-field{width:80%;height:60px;font-size:24px;margin-top:0}.answer-block{width:80%;padding-top:20px}.answer-button{width:160px;height:60px;border-radius:20px;font-size:20px}}@media screen and (min-width: 768.1px) and (max-width: 1080px){.main-img{width:30%}.img-size{margin:auto;width:90%}.main-content{width:70%}h1{font-size:44px}h2{font-size:36px}.operation-list{row-gap:20px}.operation-list a{width:45%}.operation-button{height:60px;border-radius:20px;font-size:20px}.operation-button:active{font-size:22px}.image-block{width:40%;height:auto;justify-content:flex-start}.img-example-page{width:90%}.example-block{margin-top:20px;width:100%}.formula{font-size:26px}.example-answer{flex-direction:column;align-items:center}.example-box{width:100%;height:100px;border:6px rgba(255,222,54,1) solid;margin-left:auto;margin-right:auto}.example-text{font-size:30px}.correct-incorrect-answer{font-size:32px;transform:none}.input-field{width:80%;height:60px;font-size:24px;margin-top:0}.answer-block{width:80%;padding-top:20px}.answer-button{width:200px;height:60px;border-radius:20px;font-size:22px}}