@import"https://fonts.googleapis.com/css2?family=Fredoka:wght@300;400;500;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Balsamiq+Sans&display=swap";:root{--screen-height: 0;--screen-width: 0;--background-image: "./assets/backgrounds/BG_Border_Default.png"}body{background:url(/assets/BG_Border_Default-KqgsGhEY.png);background-size:cover;background-position:center;background-repeat:no-repeat}.screen-space{display:flex;width:99vw;height:99vh}.fixed-ratio{width:var(--screen-width);height:var(--screen-height);display:flex;outline:calc(var(--screen-width) * .006) solid black;margin:auto;position:relative;overflow:clip}mark{color:#ffc702;background-color:transparent}.hide-react-player{width:0!important;height:0!important;overflow:hidden!important}.student-login-container{position:relative;width:var(--screen-width);height:var(--screen-height);background:url(/assets/BG_Higher_Grass-nHG6ep3w.png) no-repeat center center;background-size:cover;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box}.mitos-logo-sign-in{position:absolute;top:calc(var(--screen-height) * (46 / 832));left:calc(var(--screen-width) * (191 / 1280));width:calc(var(--screen-width) * (899 / 1280));height:auto}.sign-btn{width:calc(var(--screen-width) * (250 / 1280));height:calc(var(--screen-height) * (100 / 832));background-color:#a7e4e1;border:calc(var(--screen-width) * (5 / 1280)) solid black;border-radius:calc(var(--screen-width) *(10 / 1280));text-align:center;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * (60 / 1280));font-weight:500;cursor:pointer;transition:background-color .3s ease,transform .2s ease}.sign-btn.spanish{font-size:calc(var(--screen-width) * (35 / 1280))}.sign-btn:hover{background-color:#587e86;color:#fff;transform:scale(1.05)}.credits-btn{position:absolute;bottom:calc(var(--screen-height) * (25 / 832));left:calc(var(--screen-width) * (50 / 1280));width:calc(var(--screen-width) * (159 / 1280));height:calc(var(--screen-height) * (167 / 832));display:flex;flex-direction:column;align-items:center;background:none;border:none;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * (30 / 1280));font-weight:600;color:#000;cursor:pointer}.credit-icon-container{width:calc(var(--screen-width) * (114 / 1280));height:calc(var(--screen-height) * (102 / 832));display:flex;justify-content:center;align-items:center}.credits-btn img{max-width:100%;max-height:100%;min-width:100%;min-height:100%;object-fit:contain}.credits-btn:hover{filter:drop-shadow(0 0 8px #a7e4e1) drop-shadow(0 0 8px #a7e4e1) drop-shadow(0 0 8px #a7e4e1);transform:scale(1.05)}.language-toggle{display:flex;justify-content:center;width:100%}.student-login-form{display:flex;flex-direction:column;align-items:center;margin-top:calc(var(--screen-height) * .25);width:calc(var(--screen-width) * (424 / 1280));gap:calc(var(--screen-height) * .035)}.student-login-input-container{width:100%;position:relative;display:flex;justify-content:center;align-items:center;padding-bottom:calc(var(--screen-height) * .005)}.student-login-input{width:90%;height:calc(var(--screen-height) * (70/832));border:calc(var(--screen-width) * (5 / 1280)) solid black;border-radius:calc(var(--screen-width) *(10 / 1280));padding:0 calc(var(--screen-width) * .07) 0 calc(var(--screen-width) * .07);font-size:calc(var(--screen-width) * .023);font-weight:500;font-family:Fredoka,sans-serif;background-color:#fff}.student-login-input:focus{outline:calc(var(--screen-width) * (8 / 1280)) solid #a7e4e1}.student-login-input-icon{position:absolute;left:5%;top:50%;transform:translateY(-50%);width:calc(var(--screen-width) * .04);height:calc(var(--screen-width) * .04);z-index:1;display:flex;align-items:center;justify-content:center}.student-login-input-container input::placeholder{color:#b3b3b3}.toggle-password-btn{position:absolute;right:calc(var(--screen-width) * (20 / 1280));top:50%;transform:translateY(-50%);background:transparent;border:none;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center}.toggle-password-btn:hover img,.toggle-password-btn:active img{filter:brightness(0)}.toggle-password-btn img{width:calc(var(--screen-width) * .035);height:calc(var(--screen-width) * .035)}html,body{margin:0;padding:0;height:100%;overflow:hidden}.mitos-title{display:flex;position:relative;justify-content:center;margin:5vh auto;width:70vw}.section-container{margin:0 auto;font-family:Comic Sans MS}.input-container{position:relative;margin:0 auto;margin-bottom:1vh;width:28vw;min-width:200px;height:auto;min-height:50px}.input-label{display:block;font-family:Comic Sans MS,cursive;font-size:14px;color:#587e86;margin-bottom:5px;font-weight:700}.signup-form{overflow-y:auto}.col-container{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:4vh;margin:3% 10%}.col-container>*:nth-last-child(1){grid-column:span 2;margin:0 auto}.input{background-color:#fff;border-color:#000;border-width:5px;border-radius:5px;box-sizing:border-box;width:100%;height:4vh;min-height:50px;font-size:25px;font-family:Comic Sans MS;padding-left:50px}.red-border{border-color:red}.input-container input::placeholder{font-size:25px}.icon{position:absolute;top:25%;left:10px;width:30px;height:30px}.button-container{margin:3vh auto;display:flex;justify-content:center;align-items:center}.button{display:flex;background-color:#a7e4e1;border-color:#000;border-width:3px;border-radius:8px;width:200px;height:50px;font-size:18px;font-weight:700;font-family:Comic Sans MS,cursive;padding:10px 20px;justify-content:center;align-items:center;cursor:pointer;transition:all .3s ease;margin:0 auto}.button:hover{background-color:#8dd4d0;transform:scale(1.05);box-shadow:0 4px 8px #0003}.button:disabled{background-color:#ccc;cursor:not-allowed;transform:none;box-shadow:none}.auth-btn{display:flex;background-color:#a7e4e1;border-color:#000;border-width:3px;border-radius:8px;width:200px;height:50px;font-size:18px;font-weight:700;font-family:Comic Sans MS,cursive;padding:10px 20px;justify-content:center;align-items:center;cursor:pointer;transition:all .3s ease;margin:0 auto}.auth-btn:hover{background-color:#587e86}.no-underline{text-decoration:none;color:#587e86;font-size:20px}.forgot-password{text-align:right;max-width:400px;margin-top:1vh}.no-account{text-align:center;margin-top:3vh;font-size:20px}.auth-container{display:flex;justify-content:center;align-items:center;position:relative}#container-cloud{margin-top:15vh}.inside-container{width:30%;padding-top:5%;min-width:200px;min-height:35px}.cloud{width:45%;min-width:300px}.cloud-text{position:absolute;text-align:center;font-size:2vw;font-family:Comic Sans MS;max-width:30rem}.credit-container{display:block;top:82vh}.credit-btn{background-color:transparent;border:none;width:15vw;height:20vh;top:77vh;left:3vw;position:absolute}.credit-btn img{max-width:100%;max-height:100%;justify-items:center;align-items:center}.credit-icon{position:flex;object-fit:contain}.auth-header{position:absolute;top:20px;left:20px;right:20px;z-index:10}.auth-title-container{display:flex;justify-content:space-between;align-items:center;background-color:#ffffffe6;padding:10px 20px;border-radius:10px;box-shadow:0 2px 10px #0000001a}.auth-title{font-family:Comic Sans MS,cursive;font-size:18px;font-weight:700;color:#587e86}.auth-icon{font-family:Courier New,monospace;font-size:16px;color:#587e86}.teacher-login-title,.create-account-title,.forgot-password-title,.reset-password-title,.confirm-signup-title{font-family:Comic Sans MS,cursive;font-size:28px;font-weight:700;color:#587e86;text-align:center;margin:20px 0;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.two-column-form{display:flex;gap:20px;max-width:800px;margin:0 auto}.form-column{flex:1;display:flex;flex-direction:column;gap:15px}.left-column{margin-right:10px}.right-column{margin-left:10px}.email-display{font-family:Comic Sans MS,cursive;font-size:16px;color:#587e86;text-align:center;margin:10px 0;background-color:#fffc;padding:8px 12px;border-radius:5px;border:2px solid #A7E4E1}.name-display{font-family:Comic Sans MS,cursive;font-size:18px;color:#587e86;text-align:center;margin:10px 0;font-weight:700}.instruction-text{font-family:Comic Sans MS,cursive;font-size:14px;color:#587e86;text-align:center;margin:15px 0;line-height:1.4;background-color:#fffc;padding:10px;border-radius:5px}.forgot-password-link{color:#587e86;font-weight:700;transition:color .3s ease}.forgot-password-link:hover{color:#a7e4e1}@media(max-width:768px){.two-column-form{flex-direction:column;gap:10px}.form-column{margin:0}.auth-title{font-size:16px}.teacher-login-title,.create-account-title,.forgot-password-title,.reset-password-title,.confirm-signup-title{font-size:24px}.input-container{width:80vw}.input-label{font-size:12px}.input{font-size:18px;padding-left:40px}.icon{width:25px;height:25px;left:8px}.auth-btn{width:150px;height:45px;font-size:16px}}.popup-bg{background-image:linear-gradient(#00000080,#00000080),url(/assets/Grayed_Out_Rectangle-56DVUBss.gif);background-size:cover;background-position:center;position:absolute;background-repeat:no-repeat;top:0;left:0;width:var(--screen-width);height:var(--screen-height);z-index:1;display:flex;justify-content:center;align-items:center}.popup-container{position:relative;margin-top:auto;margin-bottom:auto}.popup-rectangle{position:absolute;object-fit:contain;margin-top:auto;margin-bottom:auto;background-color:#a7e4e1;border:calc(var(--screen-width) * .01) solid black;border-radius:calc(var(--screen-width) * .04);width:calc(var(--screen-width) * .57);height:calc(var(--screen-height) * .47);top:calc(var(--screen-height) * .19)}.popup-title{color:#000;font-family:Fredoka,sans-serif;font-weight:600;text-align:center;font-size:calc(var(--screen-width) * .05);margin:calc(var(--screen-height) * .08) auto calc(var(--screen-height) * .04) auto}.popup-text{color:#000;font-family:Balsamiq Sans,sans-serif;font-weight:400;text-align:center;font-size:calc(var(--screen-width) * .03);margin:calc(var(--screen-height) * .01) calc(var(--screen-width) * .03) auto calc(var(--screen-width) * .03)}.continue-btn{position:absolute;top:calc(var(--screen-height) * .71);height:calc(var(--screen-height) * .15)}.popup-bg-2{background-image:linear-gradient(#00000080,#00000080);background-size:cover;background-position:center;position:absolute;background-repeat:no-repeat;top:0;left:0;width:var(--screen-width);height:var(--screen-height);z-index:20;display:flex;justify-content:center;align-items:center}.popup-title-2{color:#000;font-family:Fredoka,sans-serif;font-weight:600;text-align:center;font-size:calc(var(--screen-width) * .07);margin-top:calc(var(--screen-height) * .15)}.popup-title-2-sm{margin-top:calc(var(--screen-height) * .1)}.general-popup-rectangle{position:absolute;object-fit:contain;margin-top:auto;margin-bottom:auto;background-color:#a7e4e1;border:calc(var(--screen-width) * .01) solid black;border-radius:calc(var(--screen-width) * .04);width:calc(var(--screen-width) * .57);height:calc(var(--screen-height) * .5);top:calc(var(--screen-height) * .25)}.popup-title-3{color:#000;font-family:Fredoka,sans-serif;font-weight:600;text-align:center;font-size:calc(var(--screen-width) * .05);display:flex;align-items:center;justify-content:center;height:100%;padding:calc(var(--screen-height) * .02);margin:0}.playback-popup-rectangle{display:flex;flex-direction:column;position:absolute;align-items:center;background-color:#a7e4e1;border:calc(var(--screen-width) * .01) solid black;border-radius:calc(var(--screen-width) * .04);width:calc(var(--screen-width) * .57);height:calc(var(--screen-height) * .47);top:calc(var(--screen-height) * .19)}.playback-text{color:#000;font-family:Fredoka,sans-serif;font-weight:600;text-align:center;font-size:calc(var(--screen-width) * .06);margin-top:calc(var(--screen-height) * .06);margin-bottom:calc(var(--screen-height) * .025)}.playback-timeline-group{width:85%;height:5%}.playback-image-button{width:calc(var(--screen-width) * .08);padding-bottom:calc(var(--screen-height) * .035)}.playback-duration-group{display:flex;align-items:center;justify-content:space-between;color:#000;gap:calc(var(--screen-width) * .02);font-family:Fredoka,sans-serif;font-size:calc(var(--screen-height) * .04)}.text-button{background-color:#fff;border:calc(var(--screen-width) * .01) solid black;border-radius:calc(var(--screen-width) * .03);padding:calc(var(--screen-height) * .02) calc(var(--screen-height) * .02);width:calc(var(--screen-width) * .21)}.text-button:hover{background-color:#d2d2d2}.playback-buttons{font-family:Fredoka,sans-serif;font-weight:500;font-size:calc(var(--screen-height) * .045);display:flex;justify-content:space-between;position:absolute;text-align:center;top:calc(var(--screen-height) * .7);width:calc(var(--screen-width) * .53)}.title-text-style{display:flex;position:relative;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-height) * .12);font-weight:600;text-align:center;align-items:center}.lesson-title-outer-container{display:flex;justify-content:center;width:calc(var(--screen-width) * .7);height:calc(var(--screen-height) * .5);margin:calc(var(--screen-height)* .15) auto calc(var(--screen-height)* .05)}.title-text-outer-container{display:flex;justify-content:center;width:var(--screen-width);padding:calc(var(--screen-height) * .07) 0 0;min-height:calc(var(--screen-height) * .15);align-items:center}.backpack-title-text-outer-container{display:flex;justify-content:center;width:var(--screen-width);padding:calc(var(--screen-height) * .03) 0 0}.title-text-style .black-text{position:absolute;color:#000}.title-text-style .yellow-outline{color:#ffc702;-webkit-text-stroke:calc(var(--screen-height) * .03) #FFC702}.title-text-style .green-text{position:absolute;color:#c2d2a3}.title-text-style .black-outline{color:#fff;-webkit-text-stroke:calc(var(--screen-width) * .018) black}.credits-page-container{position:relative;width:var(--screen-width);height:var(--screen-height);background:url(/assets/BG_Higher_Grass-nHG6ep3w.png) no-repeat center center;background-size:cover;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box}.credits-page-container .title-text-outer-container{width:100%;padding:0;margin:calc(var(--screen-height) * -.05) auto 0 auto}.scrollable-credits{height:calc(var(--screen-height) * .52);width:calc(var(--screen-width) * .75);background-color:#fff;border:calc(var(--screen-width) * .007) solid black;border-radius:calc(var(--screen-width) * .01);overflow-y:scroll;overflow-x:hidden;white-space:nowrap;display:flex;flex-direction:column;margin:calc(var(--screen-height) * .03) auto calc(var(--screen-height) * .03) auto;padding-bottom:calc(var(--screen-height) * .05)}.scrollable-credits::-webkit-scrollbar{width:calc(var(--screen-width) * (25 / 1280))}.scrollable-credits::-webkit-scrollbar-track{background:linear-gradient(to right,transparent 40%,black 40%,black 60%,transparent 60%)}.scrollable-credits::-webkit-scrollbar-thumb{background-color:#c2d2a3;border-radius:calc(var(--screen-width) * (13 / 1280));border:calc(var(--screen-width) * (6 / 1280)) solid transparent;background-clip:content-box}.scrollable-credits::-webkit-scrollbar-thumb:hover{background-color:#96a872}@-moz-document url-prefix(){.scrollable-credits{scrollbar-width:thin;scrollbar-color:#C2D2A3 transparent}}.credit-container{margin-bottom:calc(var(--screen-height) * .05)}.credit-title{color:#000;font-family:Balsamiq Sans,sans-serif;font-weight:500;text-align:center;font-size:calc(var(--screen-width) * .04);justify-content:center;margin-top:calc(var(--screen-height) * .08);text-decoration:underline}.credit-names{color:#000;font-family:Balsamiq Sans,sans-serif;font-weight:500;text-align:center;font-size:calc(var(--screen-width) * .03);margin-top:calc(var(--screen-height) * .05)}.credit-back-btn{position:absolute;background-color:transparent;border:none;width:15vw;height:20vh;top:80vh}.logo-outline{color:#c2d2a3;text-align:center;-webkit-text-stroke-width:10px;-webkit-text-stroke-color:#000;font-family:Fredoka,sans-serif;font-size:225px;font-style:normal;font-weight:600;line-height:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:inline-block}.logo{position:absolute;width:calc(var(--screen-width) * (600 / 1280));top:calc(var(--screen-height) * (40 / 832));left:calc(var(--screen-width) * (340 / 1280))}.dancing{position:absolute;width:calc(var(--screen-width) * (440 / 1280));top:calc(var(--screen-height) * (227 / 832));left:calc(var(--screen-width) * (400 / 1280))}.load_bar{position:absolute;width:calc(var(--screen-width) * (1000 / 1280));height:calc(var(--screen-height) * (60 / 832));top:calc(var(--screen-height) * (660 / 832));left:calc(var(--screen-width) * (140 / 1280));border:calc(var(--screen-height) * (6 / 832)) solid #000;border-radius:calc(var(--screen-height) * (10 / 832));background-color:#ddd;overflow:hidden;-webkit-appearance:none;appearance:none}.load_bar::-webkit-progress-bar{background-color:#ddd;border-radius:10px}.load_bar::-webkit-progress-value{background-color:#a7e4e1;border-radius:4px}.load_bar::-moz-progress-bar{background-color:#a7e4e1;border-radius:4px}.load-text{position:absolute;font-family:Balsamiq Sans,sans-serif;text-align:center;font-size:calc(var(--screen-width) * .04);color:var(--paragraph-color, black);-webkit-text-stroke:var(--paragraph-stroke-weight, 0px) var(--paragraph-stroke-color, black);top:calc(var(--screen-height) * (680 / 832));left:calc(var(--screen-width) * (440 / 1280));width:calc(var(--screen-width) * (400 / 1280))}.buttons_container{position:absolute;width:calc(var(--screen-width) * (400 / 1280));top:calc(var(--screen-height) * (140 / 832));left:calc(var(--screen-width) * (700 / 1280));display:flex;flex-direction:column;gap:calc(var(--screen-height) * .02)}.character{position:absolute;width:calc(var(--screen-width) * (440 / 1280));top:calc(var(--screen-height) * (100 / 832));left:calc(var(--screen-width) * (100 / 1280))}.button-paragraph{all:unset;display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:Balsamiq Sans,sans-serif;text-align:center;font-size:calc(var(--screen-width) * .03);color:var(--paragraph-color, black);-webkit-text-stroke:var(--paragraph-stroke-weight, 0px) var(--paragraph-stroke-color, black);border:calc(var(--screen-width) * .005) solid var(--paragraph-border-color, black);background-color:var(--paragraph-background-color, white);padding:calc(var(--screen-width) * .02);border-radius:calc(var(--screen-width) * .1);width:100%;height:100%}.footer{background-color:#fff;position:absolute;bottom:0;left:0;width:100%;height:calc(var(--screen-height) * .2);text-align:center;display:flex;justify-content:space-between}.button-left{position:absolute;cursor:pointer;width:calc(var(--screen-width) * .08);height:auto;left:calc(var(--screen-width) * .02);bottom:calc(var(--screen-height) * .04)}.button-right{position:absolute;cursor:pointer;width:calc(var(--screen-width) * .08);height:auto;right:calc(var(--screen-width) * .02);bottom:calc(var(--screen-height) * .04)}.blue-rectangle{position:absolute;min-width:calc(var(--screen-width) * .2);height:calc(var(--screen-height) * .07);background-color:#a7e4e1;left:calc(var(--screen-width) * .1);top:calc(var(--screen-height) * -.05);border:calc(var(--screen-width) * .005) solid black;border-radius:calc(var(--screen-width) * .01);padding-left:calc(var(--screen-width) * .01);padding-right:calc(var(--screen-width) * .01);display:flex;justify-content:center;align-items:center}.blue-rectangle-text{color:#000;font-family:Fredoka,sans-serif;font-weight:600;text-align:center;font-size:calc(var(--screen-width) * .04)}.exit-rectangle{cursor:pointer;height:40%;margin:calc(var(--screen-height) * .045) calc(var(--screen-width) * .04);padding:calc(var(--screen-width) * .005) calc(var(--screen-width) * .01);background-color:#a7e4e1;border:calc(var(--screen-width) * .005) solid black;border-radius:calc(var(--screen-width) * .01);flex-shrink:0}.exit-rectangle:hover{background-color:#587e86}.exit-rectangle-text{color:#000;font-family:Fredoka,sans-serif;font-weight:600;text-align:center;font-size:calc(var(--screen-width) * .035)}.main-text{position:absolute;font-family:Balsamiq Sans,sans-serif;text-align:left;left:12%;top:25%;width:75%;font-size:calc(var(--screen-width) * .033)}.ending-text{font-family:Balsamiq Sans,sans-serif;text-align:left;min-width:0;font-size:calc(var(--screen-width) * .033);margin-left:calc(var(--screen-width) * .12);margin-top:calc(var(--screen-height) * .05)}.hint-popup{position:absolute;width:33vw;height:30vh;background-color:#a7e4e1;left:32vw;top:-55vh;border:.8vw solid black;border-radius:3vw;color:#000;font-family:Fredoka,sans-serif;font-size:3.3vw;font-weight:500;padding:3.2vw;visibility:hidden;transition:visibility 0s,opacity .5s linear}.hint-button{position:absolute;background-color:#a7e4e1;left:10vw;top:-5.5vh;border:.5vw solid black;border-radius:9vw;color:#000;font-family:Fredoka,sans-serif;font-size:4.5vw;font-weight:500;padding-left:1.8vw;padding-right:1.8vw;padding-top:.05vh;padding-bottom:.05vh;cursor:pointer}.highlighted{-webkit-filter:drop-shadow(3px 3px 0 #FFC702) drop-shadow(-3px -3px 0 #FFC702) drop-shadow(-3px 3px 0 #FFC702) drop-shadow(3px -3px 0 #FFC702) drop-shadow(3px 0px 0 #FFC702) drop-shadow(-3px 0px 0 #FFC702) drop-shadow(0px 3px 0 #FFC702) drop-shadow(0px -3px 0 #FFC702);filter:drop-shadow(3px 3px 0 #FFC702) drop-shadow(-3px -3px 0 #FFC702) drop-shadow(-3px 3px 0 #FFC702) drop-shadow(3px -3px 0 #FFC702) drop-shadow(3px 0px 0 #FFC702) drop-shadow(-3px 0px 0 #FFC702) drop-shadow(0px 3px 0 #FFC702) drop-shadow(0px -3px 0 #FFC702)}.red-text{color:red}.yellow-text{color:#ffc702}.green-text{color:#649712}.blue-text{color:#0038ff}.underline-text{text-decoration:underline}.teacher-login-container{position:relative;width:var(--screen-width);height:var(--screen-height);background:url(/assets/BG_Teacher_Default-DkfHp5uF.png) no-repeat center center;background-size:cover;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box}.mitos-logo-login{position:absolute;top:calc(var(--screen-height) * (22 / 832));left:calc(var(--screen-width) * (191 / 1280));width:calc(var(--screen-width) * (899 / 1280));height:auto}.teacher-login-title{position:relative;font-family:Fredoka,sans-serif;font-weight:600;font-size:calc(var(--screen-width) * .04);color:#000;text-align:center;margin-bottom:calc(var(--screen-height) * .05);text-shadow:none;margin-top:calc(var(--screen-height) * .27)}.teacher-login-form{display:flex;flex-direction:column;align-items:center;width:calc(var(--screen-width) * (500 / 1280));gap:calc(var(--screen-height) * .023)}.teacher-login-input-container{width:100%;position:relative;display:flex;justify-content:center;align-items:center}.teacher-login-input{width:90%;height:calc(var(--screen-height) * (81/832));border:calc(var(--screen-width) * (3 / 1280)) solid var(--light-green);border-radius:calc(var(--screen-width) * .007);padding:0 calc(var(--screen-width) * .02) 0 calc(var(--screen-width) * .07);font-weight:500;font-size:calc(var(--screen-width) * .025);font-family:Fredoka,sans-serif;background:#fff;outline:none;transition:border-color .3s ease}.teacher-login-input:focus{border-color:var(--neon-green);box-shadow:0 0 calc(var(--screen-width) * .005) #228b224d}.teacher-login-input::placeholder{color:var(--light-grey);font-size:calc(var(--screen-width) * .025)}.password-container{margin-bottom:calc(var(--screen-height) * -.01)}.teacher-login-input[type=password],.teacher-login-input[type=text]{padding:0 calc(var(--screen-width) * .055) 0 calc(var(--screen-width) * .07)}.teacher-login-icon{position:absolute;left:5%;top:50%;transform:translateY(-50%);width:calc(var(--screen-width) * .04);height:calc(var(--screen-width) * .04);z-index:1;display:flex;align-items:center;justify-content:center}.forgot-password-link{align-self:flex-end;color:var(--muted-green);text-decoration:none;font-weight:500;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);margin-bottom:calc(var(--screen-height) * .03);transition:color .3s ease}.forgot-password-link:hover{color:var(--neon-green)}.no-account-container{text-align:center;font-weight:500;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .023)}.no-account-container span{color:#000}.no-account-container a{color:var(--muted-green);text-decoration:none;font-weight:500;font-size:calc(var(--screen-width) * .023);margin-left:calc(var(--screen-width) * .005);transition:color .3s ease}.no-account-container a:hover{color:var(--neon-green)}:root{--screen-width: 1280;--screen-height: 832;--green-overlay: #C2D2A3;--button-color: #649712;--font-family: "Fredoka", sans-serif;--popup-border-color: #C2D2A3}.custom-popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0006;display:flex;justify-content:center;align-items:center;z-index:9999}.custom-popup-container{display:flex;justify-content:center;align-items:center;width:100%;height:100%}.custom-popup-white-rectangle{position:relative;width:calc(var(--screen-width) * .446);height:calc(var(--screen-height) * .611);background-color:#fff;border-radius:calc(var(--screen-width) * .01);border:calc(var(--screen-width) * .003)solid var(--popup-border-color);box-shadow:0 calc(var(--screen-height) * .0048) calc(var(--screen-height) * .0144) #00000026;overflow:hidden}.custom-popup-green-overlay{position:absolute;top:0;left:0;width:100%;height:25%;background-color:var(--green-overlay)}.custom-popup-circle{position:absolute;top:100%;left:50%;transform:translate(-50%,-50%);width:calc(var(--screen-width) * .15);height:calc(var(--screen-width) * .15);background-color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center}.custom-popup-icon{width:calc(var(--screen-width) * .15);height:calc(var(--screen-width) * .15);object-fit:contain}.custom-popup-content{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;padding-top:calc(var(--screen-width) * .16);box-sizing:border-box}.custom-popup-title{font-size:calc(var(--screen-width) * .025);font-weight:500;font-family:var(--font-family);color:#000;text-align:center;max-width:calc(var(--screen-width) * .43);word-break:break-word;margin-bottom:calc(var(--screen-height) * .006)}.custom-popup-message{font-size:calc(var(--screen-width) * .02);font-family:var(--font-family);color:#000;text-align:center;max-width:calc(var(--screen-width) * .43);word-break:break-word}.custom-popup-confirmation-actions{display:flex;gap:calc(var(--screen-width) * .044);margin-top:auto;margin-bottom:calc(var(--screen-height) * .04);justify-content:center}.custom-popup-white-rectangle[data-type=success]{border-color:#c2d2a3!important}.custom-popup-white-rectangle[data-type=success] .custom-popup-green-overlay{background-color:#c2d2a3!important}.custom-popup-white-rectangle[data-type=error]{border-color:#f47878!important}.custom-popup-white-rectangle[data-type=error] .custom-popup-green-overlay{background-color:#f47878!important}.custom-popup-white-rectangle[data-type=warning]{border-color:#fef3c7!important}.custom-popup-white-rectangle[data-type=warning] .custom-popup-green-overlay{background-color:#fef3c7!important}.custom-popup-white-rectangle[data-type=delete]{border-color:#f47878!important}.custom-popup-white-rectangle[data-type=delete] .custom-popup-green-overlay{background-color:#f47878!important}:root{--screen-width: 1280;--screen-height: 832;--font-family: "Fredoka", sans-serif;--color-green-primary: #649712;--color-green-light: #C2D2A3;--color-green-hover: #A1D63C;--color-grey-secondary: #E4E4E4;--color-grey-hover: #F3F3F3;--color-grey-dark: #696969;--color-danger: #FF3D3D;--color-danger-hover: #FFAAAA}.btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;font-family:var(--font-family);font-weight:500;color:#fff;border:none;border-radius:calc(var(--screen-width) * .007);cursor:pointer;transition:background-color .3s ease;white-space:nowrap;width:auto;gap:calc(var(--screen-width) * .005)}.btn--sm{padding:calc(var(--screen-height) * .012) calc(var(--screen-width) * .02);height:calc(var(--screen-height) * (44 / 832));font-size:calc(var(--screen-width) * .016)}.btn--lg{padding:calc(var(--screen-height) * .015) calc(var(--screen-width) * .03);height:calc(var(--screen-height) * (100 / 832));font-size:calc(var(--screen-width) * .045)}.btn--primary{background-color:var(--color-green-primary);color:#fff}.btn--primary:hover{background-color:var(--color-green-hover);transform:translateY(calc(var(--screen-height) * -.002))}.btn--secondary{background-color:var(--color-grey-secondary);color:var(--color-grey-dark)}.btn--secondary:hover{background-color:var(--color-grey-hover);transform:translateY(calc(var(--screen-height) * -.002));color:#000}.btn--danger{background-color:var(--color-danger);color:#fff}.btn--danger:hover{background-color:var(--color-danger-hover);transform:translateY(calc(var(--screen-height) * -.002))}.btn--light{background-color:var(--color-green-light);color:#000}.btn--light:hover,.btn--outline{background-color:#fff;transform:translateY(calc(var(--screen-height) * -.002));border:calc(var(--screen-width) * .002) solid var(--color-green-light);color:var(--color-green-primary)}.btn--outline:hover{background-color:var(--color-green-light);color:#000}.btn--text{background:none;border:none;padding:0;color:var(--color-green-primary)}.btn--text:hover{color:var(--color-green-hover)}.btn:disabled{background-color:var(--color-grey-secondary);color:var(--color-grey-dark);cursor:not-allowed;transform:none;pointer-events:none}.btn--text:disabled{background:none}.btn__icon{display:flex;align-items:center}.btn__icon img,.btn__icon svg{width:calc(var(--screen-width) * .02);height:auto}.btn:has(.btn__icon){padding:calc(var(--screen-height) * .012) calc(var(--screen-width) * .015)}.btn--text:has(.btn__icon){padding:0}.btn--text .btn__icon img{filter:brightness(0) saturate(100%) invert(55%) sepia(90%) saturate(500%) hue-rotate(45deg) brightness(75%) contrast(95%)}.btn--text .btn__icon svg{color:var(--color-green-primary)}.btn--text:hover .btn__icon svg{color:var(--color-grey-secondary)}.btn--text:hover .btn__icon img{filter:brightness(0) saturate(100%) invert(74%) sepia(68%) saturate(400%) hue-rotate(35deg) brightness(105%) contrast(95%)}.btn--light .btn__icon img{filter:brightness(0) saturate(100%)}.btn--light .btn__icon svg{color:#000}.btn--light:hover .btn__icon svg{color:var(--color-green-primary)}.btn--light:hover .btn__icon img{filter:invert(55%) sepia(90%) saturate(500%) hue-rotate(45deg) brightness(75%) contrast(95%)}.btn__text{display:flex;align-items:center}.btn--menu{display:flex;align-items:center;justify-content:flex-start;width:100%;background-color:#fff;color:var(--color-green-primary);border-radius:0;font-weight:500}.btn--menu:hover{background-color:var(--color-green-light);color:#000}.btn--menu--danger{color:var(--color-danger)}.btn--menu .btn__icon svg{color:var(--color-green-primary)}.btn--menu--danger .btn__icon svg{color:var(--color-danger)}.btn--menu:hover .btn__icon svg{color:#000}.btn--menu .btn__icon img{filter:invert(55%) sepia(90%) saturate(500%) hue-rotate(45deg) brightness(75%) contrast(95%)}.btn--menu--danger .btn__icon img{filter:invert(59%) sepia(65%) saturate(3500%) hue-rotate(320deg)}.btn--menu:hover .btn__icon img{filter:brightness(0) saturate(100%)}.spinning-circle{width:calc(var(--screen-width) * .02);height:calc(var(--screen-width) * .02);border:calc(var(--screen-width) * .02) solid transparent;border-top:calc(var(--screen-width) * .02) solid #000000;border-radius:50%;animation:spin 1s linear infinite}.icon-btn{background:transparent;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:calc(var(--screen-width) * .007);padding:0;width:calc(var(--screen-width) * .035);height:auto;flex-shrink:0}.icon-btn--filled{background-color:#649712}.icon-btn--filled:hover{background-color:#a1d63c}.icon-btn:disabled{cursor:not-allowed;pointer-events:none;opacity:.5}.icon-btn img,.icon-btn svg{width:100%;height:100%;object-fit:contain}.icon-btn svg{color:#8b8686}.icon-btn:hover svg,.icon-btn:active svg{color:#000}.icon-btn:hover img,.icon-btn:active img{filter:brightness(0) saturate(100%)}.icon-btn--white svg{color:#fff}.icon-btn--white:hover svg,.icon-btn--white:active svg{color:#000}.icon-btn--white img{filter:brightness(0) invert(1)}.icon-btn--white:hover img,.icon-btn--white:active img{filter:brightness(0)}.teacher-signup-container{position:relative;width:var(--screen-width);height:var(--screen-height);background:url(/assets/BG_Teacher_Default-DkfHp5uF.png) no-repeat center center;background-size:cover;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box}.teacher-signup-container .title-text-outer-container{width:100%;padding:0;margin-bottom:calc(var(--screen-height) * .03)}.teacher-signup-container .title-text-style{font-size:calc(var(--screen-width) * .06);justify-content:center}.teacher-signup-form{display:grid;grid-template-columns:1fr 1fr;row-gap:calc(var(--screen-width) * .02);column-gap:calc(var(--screen-width) * .07);width:100%;max-width:calc(var(--screen-width) * .7);margin:0 auto calc(var(--screen-height) * .05) auto}.teacher-signup-form .email-field{grid-column:1 / -1;justify-self:center;width:50%}.teacher-signup-input-container{position:relative;display:flex;align-items:center}.teacher-signup-input{width:90%;height:calc(var(--screen-height) * (71 / 832));border:calc(var(--screen-width) * (3 / 1280)) solid var(--light-green);border-radius:calc(var(--screen-width) * .007);padding:0 calc(var(--screen-width) * .02) 0 calc(var(--screen-width) * .07);font-weight:500;font-size:calc(var(--screen-width) * .022);font-family:Fredoka,sans-serif;background:#fff;outline:none;transition:border-color .3s ease}.teacher-signup-input:focus{border-color:var(--neon-green);box-shadow:0 0 calc(var(--screen-width) * .005) #228b224d}.teacher-signup-input::placeholder{color:var(--light-grey);font-size:calc(var(--screen-width) * .022)}.signup-password-container .teacher-signup-input{padding:0 calc(var(--screen-width) * .055) 0 calc(var(--screen-width) * .07)}.teacher-signup-icon{position:absolute;left:5%;top:50%;transform:translateY(-50%);width:calc(var(--screen-width) * .04);height:calc(var(--screen-width) * .04);z-index:1;display:flex;align-items:center;justify-content:center}.teacher-signup-footer{position:absolute;bottom:calc(var(--screen-height) * .035);text-align:center;font-weight:500;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .023)}.teacher-signup-footer span{color:#000}.teacher-signup-footer a{color:var(--muted-green);text-decoration:none;font-weight:500;font-size:calc(var(--screen-width) * .023);margin-left:calc(var(--screen-width) * .005);transition:color .3s ease}.teacher-signup-footer a:hover{color:var(--neon-green)}.teacher-forgot-password-container{position:relative;width:var(--screen-width);height:var(--screen-height);background:url(/assets/BG_Teacher_Default-DkfHp5uF.png) no-repeat center center;background-size:cover;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box}.teacher-forgot-password-container .title-text-outer-container{width:100%;padding:0}.teacher-forgot-password-container .title-text-style{font-size:calc(var(--screen-width) * .06);justify-content:center}.teacher-forgot-password-form{display:flex;flex-direction:column;align-items:center;margin-top:calc(var(--screen-width) * .03);width:calc(var(--screen-width) * (482 / 1280));gap:calc(var(--screen-height) * .048)}.teacher-forgot-password-input-container{width:100%;position:relative;display:flex;justify-content:center;align-items:center}.teacher-forgot-password-input{width:90%;height:calc(var(--screen-height) * (92 / 832));border:calc(var(--screen-width) * (3 / 1280)) solid var(--light-green);border-radius:calc(var(--screen-width) * .007);padding:0 calc(var(--screen-width) * .02) 0 calc(var(--screen-width) * .07);font-weight:500;font-size:calc(var(--screen-width) * .025);font-family:Fredoka,sans-serif;background:#fff;outline:none;transition:border-color .3s ease}.teacher-forgot-password-input:focus{border-color:var(--neon-green);box-shadow:0 0 calc(var(--screen-width) * .005) #228b224d}.teacher-forgot-password-input::placeholder{color:var(--light-grey);font-size:calc(var(--screen-width) * .025)}.teacher-forgot-password-icon{position:absolute;left:5%;top:50%;transform:translateY(-50%);width:calc(var(--screen-width) * .04);height:calc(var(--screen-width) * .04);z-index:1;display:flex;align-items:center;justify-content:center}.remember-password-container{position:absolute;bottom:calc(var(--screen-height) * .035);text-align:center;font-weight:500;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .023)}.remember-password-container span{color:#000}.remember-password-container a{color:var(--muted-green);text-decoration:none;font-weight:500;font-size:calc(var(--screen-width) * .023);margin-left:calc(var(--screen-width) * .005);transition:color .3s ease}.remember-password-container a:hover{color:var(--neon-green)}.teacher-reset-password-container{position:relative;width:var(--screen-width);height:var(--screen-height);background:url(/assets/BG_Teacher_Default-DkfHp5uF.png) no-repeat center center;background-size:cover;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box}.teacher-reset-password-container .title-text-outer-container{width:100%;padding:0;margin-bottom:calc(var(--screen-height) * .03);margin-top:calc(var(--screen-height) * -.1)}.teacher-reset-password-container .title-text-style{font-size:calc(var(--screen-width) * .06);justify-content:center}.teacher-reset-password-form{display:flex;flex-direction:column;align-items:center;margin-bottom:calc(var(--screen-height) * .04);width:calc(var(--screen-width) * (482 / 1280));gap:calc(var(--screen-height) * .02)}.teacher-reset-password-input-container{width:100%;position:relative;display:flex;justify-content:center;align-items:center}.teacher-reset-password-input{width:90%;height:calc(var(--screen-height) * (81 / 832));border:calc(var(--screen-width) * (3 / 1280)) solid var(--light-green);border-radius:calc(var(--screen-width) * .007);padding:0 calc(var(--screen-width) * .028) 0 calc(var(--screen-width) * .07);font-weight:500;font-size:calc(var(--screen-width) * .025);font-family:Fredoka,sans-serif;background:#fff;outline:none;transition:border-color .3s ease}.teacher-reset-password-input:focus{border-color:var(--neon-green);box-shadow:0 0 calc(var(--screen-width) * .005) #228b224d}.teacher-reset-password-input::placeholder{color:var(--light-grey);font-size:calc(var(--screen-width) * .025)}.teacher-reset-password-icon{position:absolute;left:5%;top:50%;transform:translateY(-50%);width:calc(var(--screen-width) * .04);height:calc(var(--screen-width) * .04);z-index:1;display:flex;align-items:center;justify-content:center}.reset-multiple-code-container{position:absolute;bottom:calc(var(--screen-height) * .035);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--screen-height) * .01)}.reset-resend-code-container,.reset-back-to-login-container{text-align:center;font-weight:500;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .023)}.reset-back-to-login-container span{color:#000}.reset-back-to-login-container a{color:var(--muted-green);text-decoration:none;font-weight:500;font-size:calc(var(--screen-width) * .023);margin-left:calc(var(--screen-width) * .005);transition:color .3s ease}.reset-back-to-login-container a:hover{color:var(--neon-green)}:root{--screen-width: 100vw;--screen-height: 100vh;--light-green: #C2D2A3;--muted-green: #649712;--neon-green: #A1D63C;--light-grey: #B7B7B7;--dark-grey: #696969}.teacher-verify-container{position:relative;width:var(--screen-width);height:var(--screen-height);background:url(/assets/BG_Teacher_Default-DkfHp5uF.png) no-repeat center center;background-size:cover;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box}.teacher-verify-container .title-text-outer-container{width:100%;padding:0}.teacher-verify-container .title-text-style{font-size:calc(var(--screen-width) * .06);justify-content:center}.teacher-verify-form{display:flex;flex-direction:column;align-items:center;margin:calc(var(--screen-height) * .03) auto calc(var(--screen-height) * .12) auto;width:calc(var(--screen-width) * (482 / 1280));gap:calc(var(--screen-height) * .023)}.teacher-verify-input-container{width:100%;position:relative;display:flex;justify-content:center;align-items:center}.teacher-verify-input{width:90%;height:calc(var(--screen-height) * (81 / 832));border:calc(var(--screen-width) * (3 / 1280)) solid var(--light-green);border-radius:calc(var(--screen-width) * .007);padding:0 calc(var(--screen-width) * .028) 0 calc(var(--screen-width) * .07);font-weight:500;font-size:calc(var(--screen-width) * .025);font-family:Fredoka,sans-serif;background:#fff;outline:none;transition:border-color .3s ease}.teacher-verify-input:focus{border-color:var(--neon-green);box-shadow:0 0 calc(var(--screen-width) * .005) #228b224d}.teacher-verify-input::placeholder{color:var(--light-grey);font-size:calc(var(--screen-width) * .025)}.teacher-verify-icon{position:absolute;left:5%;top:50%;transform:translateY(-50%);width:calc(var(--screen-width) * .04);height:calc(var(--screen-width) * .04);z-index:1;display:flex;align-items:center;justify-content:center}.email-display{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .025);color:var(--dark-grey);text-align:center;background-color:#fffc;padding:calc(var(--screen-height) * .01) calc(var(--screen-width) * .02);border-radius:calc(var(--screen-width) * .007);border:calc(var(--screen-width) * (3 / 1280)) solid var(--light-green);margin:0}.multiple-code-container{position:absolute;bottom:calc(var(--screen-height) * .035);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--screen-height) * .01)}.resend-code-container,.back-to-login-container{text-align:center;font-weight:500;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .023)}.back-to-login-container span{color:#000}.back-to-login-container a{color:var(--muted-green);text-decoration:none;font-weight:500;font-size:calc(var(--screen-width) * .023);margin-left:calc(var(--screen-width) * .005);transition:color .3s ease}.back-to-login-container a:hover{color:var(--neon-green)}.lesson-page-body{display:flex;flex-direction:column;width:var(--screen-width);height:var(--screen-height)}.lesson-title{display:flex}.lesson-play-button{width:auto;height:auto;background-color:#a7e4e1;border:calc(var(--screen-width) * .007) solid black;border-radius:calc(var(--screen-width) * .01);color:#000;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .05);font-weight:500;margin:0 auto;padding:calc(var(--screen-height) * .01) calc(var(--screen-width) * .025)}.lesson-play-button:hover{background-color:#587e86}.scrollable-page-body{display:flex;flex-direction:column;width:var(--screen-width);height:var(--screen-height)}.backpack-scrollable-page-body{height:calc(var(--screen-height) * .6)}.scrollable-item-selection{height:calc(var(--screen-height) * .6);width:calc(var(--screen-width) * .75);background-color:#fff;border:calc(var(--screen-width) * .01) solid black;border-radius:calc(var(--screen-width) * .01);overflow-y:hidden;overflow-x:scroll;scrollbar-color:#C2D2A3 transparent;white-space:nowrap;display:flex;margin:calc(var(--screen-width) * .01) auto;padding-left:calc(var(--screen-width) * .01);padding-right:calc(var(--screen-width) * .01)}.green-back-button{position:absolute;cursor:pointer;width:calc(var(--screen-width) * .07);height:auto;left:calc(var(--screen-width) * .03);top:calc(var(--screen-height) * .85)}.module-tutorial{height:calc(var(--screen-height) * .5);width:calc(var(--screen-width) * .7);margin:calc(var(--screen-height) * .01) auto}.green-title-rectangle{display:flex;margin:calc(var(--screen-width) * .02) auto calc(var(--screen-height) * .01);background-color:#c2d2a3;border:calc(var(--screen-width) * .005) solid black;border-radius:calc(var(--screen-width) * .01);justify-content:center;color:#000;font-family:Fredoka,sans-serif;font-weight:600;text-align:center;font-size:calc(var(--screen-width) * .03);width:fit-content;height:7%}; .green-bar-icon{object-fit:contain;margin:auto calc(var(--screen-width) * .01) auto 0vw}.green-bar-title{margin:auto calc(var(--screen-width) * .01);display:flex}.tutorial-toc{height:calc(var(--screen-height) * .47);margin:calc(var(--screen-height) * .03) auto}.scrollable-topic-list{margin:calc(var(--screen-height) * .08) auto;height:calc(var(--screen-height) * .6);width:calc(var(--screen-width) * .8);background-color:#fff;border:calc(var(--screen-width) * .007) solid black;border-radius:calc(var(--screen-width) * .005);overflow-y:auto;overflow-x:hidden;scrollbar-color:#C2D2A3 transparent;direction:rtl}.topic-list-instance{display:flex;justify-content:left;height:calc(var(--screen-height) * .1);margin:calc(var(--screen-height) * .02) calc(var(--screen-width) * .04)}.topic-text{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .04);font-weight:550;margin-top:auto;margin-bottom:auto;white-space:nowrap;margin:calc(var(--screen-height) * 0) calc(var(--screen-width) * .02);direction:ltr;unicode-bidi:isolate}.checkbox-toc{width:calc(var(--screen-width) * .05);height:auto;left:calc(var(--screen-width) * .01);top:calc(var(--screen-height) * .15)}.dots-spacing{width:100%;background:radial-gradient(circle at center calc(var(--screen-height) * .06),#999 8%,transparent 8%);background-size:calc(var(--screen-height) * .02);background-repeat:repeat-x}.background{background-size:cover!important;background-repeat:no-repeat!important;height:var(--screen-height);width:var(--screen-width)}.default-bg{--background-image: url(/assets/BG_Default-C3mfDpId.png);background:var(--background-image)}.high-grass-bg{background:url(/assets/BG_Higher_Grass-nHG6ep3w.png)}.volcano-bg{background:url(/assets/BG_Volcano-BpaTLzpU.png)}.label-rectangle{display:block;background-color:#a7e4e1;border:.5vw solid black;border-radius:1vw;margin-top:40vh;margin-left:51.41vw;width:38.91vw}.label-text{color:red;font-family:Fredoka,sans-serif;font-weight:600;text-align:center;font-size:5vw;padding:2vh 0}.mc-container{display:flex;position:absolute;margin-left:calc(var(--screen-width) * .6);margin-top:calc(var(--screen-width) * .1);width:calc(var(--screen-width) * .3);text-align:center;flex-direction:column}.mc-container-half{margin-left:calc(var(--screen-width) * .5);margin-top:calc(var(--screen-width) * .11);width:calc(var(--screen-width) * .45)}.mc-container-third{margin-left:calc(var(--screen-width) * .7);margin-top:calc(var(--screen-width) * .15);width:auto}.mc-btn{display:block;padding:calc(var(--screen-width) * .02) calc(var(--screen-width) * .03);border-radius:calc(var(--screen-width) * .05);border-width:calc(var(--screen-width) * .005);background-color:#f0f8ff;font-family:Balsamiq Sans;font-weight:400;font-size:calc(var(--screen-width) * .026);margin-bottom:calc(var(--screen-height) * .02)}.mc-btn:hover{background-color:#a7e4e1}.horizontal-mc-container{display:flex;position:absolute;flex-direction:column;justify-content:center;align-items:center;width:var(--screen-width)}.question-rectangle{display:flex;background-color:#a7e4e1;border:calc(var(--screen-width) * .005) solid black;border-radius:calc(var(--screen-width) * .01);justify-content:center;align-items:center;margin-top:calc(var(--screen-height) * .19);padding:calc(var(--screen-height) * .01) calc(var(--screen-width) * .05);height:calc(var(--screen-width) * .065);max-width:calc(var(--screen-width) * .65)}.question-text{color:#000;font-family:Balsamiq Sans,sans-serif;font-weight:400;text-align:center;font-size:calc(var(--screen-width) * .028)}.picture-btn-container{display:flex;justify-content:center;align-items:center;gap:calc(var(--screen-width) * .09);margin-top:calc(var(--screen-height) * .06)}.picture-btn{display:grid;padding:calc(var(--screen-width) * .005) calc(var(--screen-width) * .005);border-radius:calc(var(--screen-width) * .05);border:calc(var(--screen-width) * .005) solid black;background-color:#f0f8ff;width:calc(var(--screen-width) * .23);height:calc(var(--screen-height) * .2885);font-family:Fredoka;font-weight:600;font-size:calc(var(--screen-width) * .02);grid-template-rows:1fr auto;align-items:center;text-overflow:ellipsis}.picture-btn:hover{background-color:#a7e4e1}.picture-btn img{max-width:100%;max-height:100%;justify-items:center;align-items:center}.picture-container{width:auto;height:calc(var(--screen-height) * .1923);object-fit:contain;display:flex;justify-content:center;text-align:center;margin-top:0}.left-right-question-container{display:flex;position:absolute;flex-direction:column;justify-content:center;align-items:center;width:var(--screen-width);height:calc(var(--screen-height) * .8)}.higher-question-rectangle{display:flex;background-color:#a7e4e1;border:calc(var(--screen-width) * .005) solid black;border-radius:calc(var(--screen-width) * .02);justify-content:center;align-items:center;padding:calc(var(--screen-height) * .03) calc(var(--screen-width) * .02)}.left-right-container{display:flex;justify-content:space-between;width:90%;margin:calc(var(--screen-height) * .1) calc(var(--screen-width) * .05)}.left-right-display-container{display:flex;position:absolute;justify-content:space-between;width:calc(var(--screen-width) * .9);margin:calc(var(--screen-height) * .4) calc(var(--screen-width) * .05)}.left-right-btn{display:block;padding:calc(var(--screen-height) * .01) calc(var(--screen-width) * .01);border-radius:calc(var(--screen-width) * .04);border-width:calc(var(--screen-width) * .005);background-color:#f0f8ff;font-family:Balsamiq Sans;font-weight:600;font-size:calc(var(--screen-width) * .035);width:calc(var(--screen-width) * .2148);height:calc(var(--screen-height) * .1863)}.left-right-btn:hover,.correct-btn{background-color:#a7e4e1}.smaller-font-btn{font-size:calc(var(--screen-width) * .025)}.display-btn{pointer-events:none;cursor:default}.paragraph-text{font-family:Balsamiq Sans,sans-serif;text-align:center;font-size:calc(var(--screen-width) * .03);color:var(--paragraph-color, black);-webkit-text-stroke:var(--paragraph-stroke-weight, 0px) var(--paragraph-stroke-color, black);word-spacing:-.1em}.paragraph-background{border:calc(var(--screen-width) * .005) solid var(--paragraph-border-color, black);background-color:var(--paragraph-background-color, #a7e4e1);padding:calc(var(--screen-width) * .01);margin:auto;border-radius:calc(var(--screen-width) * .013);width:100%;height:100%}.paragraph-background{padding:calc(var(--screen-width) * .005)!important}.paragraph-parent{margin:calc(var(--screen-width) * .12)}.paragraph-text-only{padding:0;margin:auto;max-width:fit-content}.clickable-cards-container{display:flex;justify-content:center;align-items:center;gap:calc(var(--screen-width) * .04);width:100%;height:calc(var(--screen-height) * .8);position:relative}.clickable-card{display:inline-flex;justify-content:center;align-items:center;width:auto;height:auto}.revealed-wrapper,.clickable-images-wrapper{display:flex;justify-content:center;align-items:center;height:calc(var(--screen-height) * .8);width:100%}.click-reveal-container{width:calc(var(--screen-width) * .19);height:calc(var(--screen-height) * .23);display:flex;justify-content:center;align-items:center;flex-direction:column}.property-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,auto);gap:calc(var(--screen-height) * .09);justify-items:center;align-items:center;position:absolute;top:45%;left:55%;transform:translate(-50%,-50%);width:60%;height:auto}.click-reveal-box{width:100%;height:100%;background-color:#587e86;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.hidden-state{background-color:#587e86}.click-reveal-top{width:100%;height:30%;display:flex;align-items:center;justify-content:center}.click-reveal-placeholder{font-size:calc(var(--screen-width) * .035);color:#fff;font-family:Balsamiq Sans,sans-serif;text-align:center}.click-reveal-bottom{width:90%;height:65%;background-color:#e6f0f3;display:flex;align-items:center;justify-content:center}.revealed{background-color:#587e86;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding-top:calc(var(--screen-height) * .01);border:none!important;outline:none!important;box-shadow:none!important}.click-reveal-title{font-size:calc(var(--screen-width) * .035);color:#fff;font-family:Balsamiq Sans,sans-serif;text-align:center;word-wrap:break-word;overflow-wrap:break-word;word-break:break-word;margin:0 auto;overflow:hidden;display:flex;flex-wrap:wrap;white-space:nowrap}.click-reveal-images{display:flex;justify-content:center;align-items:center;gap:calc(var(--screen-width) * .0003);padding-bottom:calc(var(--screen-height) * .02)}.inner-images{padding-left:5%;height:calc(var(--screen-width) * .1);width:90%;object-fit:cover}.click-reveal-image{display:block!important;width:48%!important;max-width:100%;height:auto!important;object-fit:contain;background:none!important;border:none!important}.dual-image-container{width:calc(var(--screen-width) * .42);height:calc(var(--screen-height) * .45);display:flex;justify-content:center;align-items:center;flex-direction:column;padding-top:calc(var(--screen-height) * .22);padding-left:calc(var(--screen-width) * .42)}.dual-image-title{font-size:calc(var(--screen-width) * .05);color:#fff;font-family:Balsamiq Sans,sans-serif;text-align:center;margin:calc(var(--screen-height) * .03) auto calc(var(--screen-height) * .01) auto}.dual-images{display:flex;justify-content:center;align-items:center;gap:calc(var(--screen-width) * .005);padding-bottom:calc(var(--screen-height) * .02)}.dual-image-inner-images{height:calc(var(--screen-width) * .2);padding-left:3%;width:95%;object-fit:cover}.draggable{touch-action:none}.dd-component{--cell-size: calc(var(--screen-height) * .15);--drop-width: calc(var(--screen-width) * .11);--drop-height: calc(var(--screen-height) * .15)}.dd-container{display:flex;justify-content:center;align-items:center;width:100%;height:calc(var(--screen-height) * 1);box-sizing:border-box;overflow:hidden;font-family:Arial,sans-serif}.test-draggable{position:absolute;object-fit:contain;top:0;left:0;width:60px;height:60px}.dd-draggable-items{display:flex;flex-wrap:wrap;gap:calc(var(--screen-height) * .012);justify-content:center;width:calc(var(--screen-width) * .3)}.dd-draggable-item{width:calc(var(--cell-size) * .5);height:var(--cell-size);border-radius:0;cursor:grab;border:none;outline:none;box-shadow:none}.dd-drop-zone{display:flex;justify-content:center;align-items:center;width:calc(var(--screen-width) * .078);height:calc(var(--screen-height) * .12);border-radius:0}.dd-dropped-item-container,.dd-empty-slot{width:calc(var(--screen-width) * .078);height:calc(var(--screen-height) * .12);border:calc(var(--screen-width) * .00078) solid #eee;display:flex;justify-content:center;align-items:center;border-radius:0}.dd-draggable-item.dd-hidden{visibility:hidden}.dd-layout{display:flex;flex-direction:column;align-items:center;width:100%;height:100%;position:relative}.dd-top-images{display:flex;justify-content:center;gap:calc(var(--screen-width) * .02);position:absolute;top:calc(var(--screen-height) * .02);left:0;right:0}.dd-main-content{display:flex;justify-content:center;align-items:center;width:100%;height:calc(var(--screen-height) * .6);margin-top:calc(var(--screen-height) * .15);position:relative}.dd-left-images,.dd-right-images{display:flex;flex-direction:column;gap:calc(var(--screen-height) * .02);justify-content:center;position:absolute;top:50%;transform:translateY(-50%)}.dd-left-images{right:calc(50% + var(--screen-width) * .225)}.dd-right-images{left:calc(50% + var(--screen-width) * .225)}.dd-grid{display:grid;grid-template-rows:repeat(2,1fr);height:calc(var(--screen-height) * .4);width:calc(var(--screen-width) * .3);column-gap:calc(var(--screen-height) * .07)}.dd-grid-4{grid-template-columns:repeat(2,1fr)}.dd-grid-8{grid-template-columns:repeat(4,1fr)}.dd-droppable-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;position:relative;box-sizing:border-box}.dd-droppable-zone{height:calc(var(--screen-width) * .12);margin-top:calc(var(--screen-height) * -.02);display:flex;justify-content:center;align-items:center;position:relative}.dd-grid-4 .dd-droppable-zone{width:calc(var(--screen-width) * .12)}.dd-grid-8 .dd-droppable-zone{width:calc(var(--screen-width) * .06);height:calc(var(--screen-width) * .06);margin-left:calc(var(--screen-width) * -.015);margin-top:calc(var(--screen-width) * .015);box-sizing:border-box}.dd-draggable-item,.dd-dropped-item,.dd-placeholder-item{display:flex;justify-content:center;align-items:center;width:calc(var(--screen-width) * .19);height:calc(var(--screen-width) * .12);box-sizing:border-box;background-color:transparent;border:none}.dd-draggable-item img,.dd-dropped-item img{max-width:100%;max-height:100%;object-fit:contain}.dd-draggable-layer{position:relative;z-index:100;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.dd-drag-overlay{z-index:1000;border:none!important;outline:none!important;box-shadow:none!important}.dd-drag-overlay .dd-draggable-item,.dd-drag-overlay{transform:scale(1.05);border:none!important;outline:none!important;box-shadow:none!important;background-color:transparent}.dd-drop-placeholder{color:#8b4513;font-size:calc(var(--screen-width) * .011)}.dd-draggable-wrapper{position:relative;z-index:1000;touch-action:none}.dd-draggable-layer>*{pointer-events:auto}.dd-placeholder-item{width:calc(var(--screen-width) * .19);height:calc(var(--screen-width) * .12);visibility:hidden}.dd-droppable-container:hover,.dd-droppable-container:active,.dd-droppable-container:focus{background-color:transparent!important;border:none!important;outline:none!important}.dd-draggable-item img,.dd-drag-overlay img{border:none!important;outline:none!important;box-shadow:none!important}.dd-grid-8 .dd-dropped-item img,.dd-grid-8 .dd-draggable-item img{width:calc(var(--screen-width) * .09);height:calc(var(--screen-width) * .09)}.timer-click-container{--base-width: 1280;--base-height: 832;position:relative;width:100%;height:100%}.timer{display:flex;position:absolute;top:calc(var(--screen-height) * .15);left:calc(var(--screen-width) * .04);background-color:#fff;border:calc(var(--screen-width) * (6 / var(--base-width))) solid black;border-radius:calc(var(--screen-width) * (60 / var(--base-width)));padding:calc(var(--screen-height) * (15 / var(--base-height))) calc(var(--screen-width) * (25 / var(--base-width)));font-family:Balsamiq Sans,cursive;font-size:calc(var(--screen-width) * (60 / var(--base-width)));font-weight:700;align-items:center;justify-content:space-between;width:calc(var(--screen-width) * (195 / var(--base-width)))}.timer-icon{position:absolute;left:calc(var(--screen-width) * .01);width:calc(var(--screen-width) * .06)}.papers-container{position:relative;width:100%;height:100%;left:calc(var(--screen-width) * .1)}.papers-container img{transition:transform .2s ease}.papers-container img:hover{transform:scale(1.05)}.timer-text{margin-left:auto}:root{--base-width: 1000;--base-height: 750}.match{display:flex;flex-direction:column;align-items:center;gap:calc(var(--screen-height) * (20 / var(--base-height)));padding-top:calc(var(--screen-height) * (150 / var(--base-height)));width:100%;height:100%;box-sizing:border-box;overflow:hidden;font-family:Balsamiq Sans,cursive}.match__draggables{display:flex;justify-content:center;flex-wrap:nowrap;gap:calc(var(--screen-width) * (20 / var(--base-width)));margin-bottom:calc(var(--screen-height) * (30 / var(--base-height)));width:100%;overflow:hidden}.match__droppables{display:flex;justify-content:center;flex-wrap:nowrap;gap:calc(var(--screen-width) * (20 / var(--base-width)));width:100%;overflow-x:auto}.match__pair{display:flex;flex-direction:column;align-items:center;gap:calc(var(--screen-height) * (10 / var(--base-height)))}.match__image{width:calc(var(--screen-width) * (200 / var(--base-width)));height:calc(var(--screen-height) * (200 / var(--base-height)));object-fit:contain}.match__item{width:calc(var(--screen-width) * (200 / var(--base-width)));height:calc(var(--screen-height) * (80 / var(--base-height)));display:flex;justify-content:center;align-items:center;background-color:#a7e4e1;border:calc(var(--screen-width) * (4 / var(--base-width))) solid black;border-radius:calc(var(--screen-width) * (5 / var(--base-width)));cursor:move;-webkit-user-select:none;user-select:none;font-size:calc(var(--screen-width) * (60 / var(--base-width)));color:#000;font-family:Balsamiq Sans,cursive;font-weight:900}.match__item--dragging{opacity:.5}.match__item--droppable{background-color:#fff;cursor:default}.match__pair--no-sprite .match__item--droppable{background-color:#a7e4e1;margin-bottom:calc(var(--screen-height) * (90 / var(--base-height)))}.match__item--placeholder{visibility:hidden}.match__wrapper{position:relative;z-index:1;touch-action:none}.match__overlay{z-index:1000}.match__overlay .match__item{transform:scale(1.05);box-shadow:0 calc(var(--screen-height) * (2 / var(--base-height))) calc(var(--screen-height) * (5 / var(--base-height))) #0003}.match__placeholder-text{color:#8b4513;font-size:calc(var(--screen-width) * (14 / var(--base-width)))}.match__droppables::-webkit-scrollbar{height:calc(var(--screen-height) * (8 / var(--base-height)))}.match__droppables::-webkit-scrollbar-thumb{background-color:#a7e4e1;border-radius:calc(var(--screen-width) * (4 / var(--base-width)))}.match__droppables::-webkit-scrollbar-track{background-color:#f1f1f1}.speaking-button-container{height:100%;width:calc(var(--screen-width) * .05);display:flex}.postit-container{display:flex;position:absolute;justify-content:center;align-items:center;width:calc(var(--screen-width) * (445 / 1280));height:calc(var(--screen-height) * (471 / 832));top:calc(var(--screen-height) * (140 / 832));left:calc(var(--screen-width) * (667 / 1280))}.postit-container img{width:100%;height:auto}.postit-container img.postit-record-btn{width:25%;object-fit:contain}.postit-image{object-fit:cover}.postit-record-btn{position:absolute;width:calc(var(--screen-width) * (100 / 1280));top:calc(var(--screen-height) * (80 / 832))}.postit-record-text-container{display:flex;position:absolute;align-items:center;width:calc(var(--screen-width) * (238 / 1280));height:calc(var(--screen-height) * (226 / 832));top:calc(var(--screen-height) * (130 / 832));left:calc(var(--screen-width) * (100 /1280))}.postit-record-text{color:#000;font-family:Balsamiq Sans,sans-serif;font-weight:500;object-fit:contain;font-size:calc(var(--screen-width) * .024);text-align:center}.vocab-pencil{position:absolute;width:calc(var(--screen-width) * .21);top:calc(var(--screen-height) * (140 / 832));left:calc(var(--screen-width) * (990 / 1280))}.vocab-speech-bubble{width:calc(var(--screen-width) * .08);top:calc(var(--screen-height) * (180 / 832));margin:0;position:absolute}.vocab-text{position:absolute;color:red;font-family:Balsamiq Sans,sans-serif;font-weight:600;object-fit:contain}.vocab-word-text{font-size:calc(var(--screen-width) * .034);top:calc(var(--screen-height) * .06);white-space:pre-line;vertical-align:middle;text-align:center}.vocab-syllable{font-size:calc(var(--screen-width) * .024);bottom:calc(var(--screen-height) * .14)}.vocab-pronunciation{font-size:calc(var(--screen-width) * .024);bottom:calc(var(--screen-height) * .06);white-space:pre-line;vertical-align:middle;text-align:center}.record-btn{position:absolute;width:calc(var(--screen-width) * (102 / 1280));top:calc(var(--screen-height) * (482 / 832));left:calc(var(--screen-width) * (896 / 1280))}.checkbox{display:flex;position:relative;height:calc(var(--screen-height) * .095)}.header-container{position:absolute;top:0;left:0;width:100%}.header-grid{display:grid;grid-template-columns:auto 1fr auto;align-items:center;padding:calc(var(--screen-width) * .01);box-sizing:border-box}.green-rectangle{display:flex;align-items:center;background-color:#c2d2a3;border:calc(var(--screen-width) * .005) solid black;border-radius:calc(var(--screen-width) * .01);padding:calc(var(--screen-width) * .01);margin-right:calc(var(--screen-width) * .015)}.green-rectangle-text{color:#000;font-family:Fredoka,sans-serif;font-weight:600;font-size:calc(var(--screen-height) * .04)}.helper-buttons-container{display:flex;justify-content:flex-end;align-items:center;gap:calc(var(--screen-width) * .01);height:calc(var(--screen-width) * .06)}:root{--base-width: 1280;--base-height: 832}.drag-in-container{position:relative;width:100%;height:100%;overflow:hidden;font-family:Balsamiq Sans,cursive}.draggable-wrapper{position:absolute;z-index:2;touch-action:none;cursor:grab}.draggable-wrapper img{position:absolute;pointer-events:auto;-webkit-user-select:none;user-select:none}.draggable-wrapper:active{cursor:grabbing;z-index:1000}.rock-dropzone{position:absolute;z-index:1}.rock-dropzone img{position:relative;width:100%;height:100%;pointer-events:none}.rock-dropzone.can-drop{background-color:#00ff001a}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.draggable-wrapper.dropped{animation:fadeOut .3s ease forwards}.rock-container{display:flex;justify-content:center;align-items:flex-start;width:calc(var(--screen-width));margin:calc(var(--screen-height) * .2) auto 0;padding:calc(var(--screen-height) * .02) 0;position:absolute;top:0}.rock{width:100%;height:auto;object-fit:contain;z-index:1}.pickaxe{width:calc(var(--screen-width) * .25);height:auto;object-fit:contain;margin-top:calc(var(--screen-height) * .23);touch-action:none;z-index:3}.rock-hover-area{position:relative;display:flex;justify-content:center;align-items:flex-start;width:calc(var(--screen-width) * .3);height:calc(var(--screen-width) * .3)}.diamond-container{position:relative;width:100%;height:100%}.diamond{position:absolute;width:calc(var(--screen-width) * .3);height:auto;top:50%;left:50%;transform:translate(-50%,-30%);animation:fadeIn .3s forwards;z-index:2}.sparkles{position:absolute;width:calc(var(--screen-width) * .25);height:auto;top:50%;left:50%;transform:translate(-50%,-30%);animation:fadeIn .3s forwards;z-index:3;opacity:.8}.diamond-label{position:absolute;top:0;left:50%;transform:translate(-50%);font-family:Balsamiq Sans,sans-serif;font-size:calc(var(--screen-height) * .05);color:#333;background:#fff;padding:10px 30px;border:4px solid #587e86;border-radius:8px;z-index:3;animation:fadeIn .3s forwards;white-space:nowrap;-webkit-user-select:none;user-select:none}.diamond-label:contains("shiny"){padding:10px 50px}.shiny-label{padding:10px 50px!important}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.rocky-container{display:flex;justify-content:center;align-items:center;width:calc(var(--screen-width) * .8);height:calc(var(--screen-height) * .5);margin:calc(var(--screen-height) * .2) auto 0;padding:calc(var(--screen-height) * .02) 0;position:relative}.rocky-wrapper{position:absolute;left:50%;transform:translate(-50%)}.rocky{width:calc(var(--screen-width) * .35);height:auto;object-fit:contain}.rocky-state-dull{width:calc(var(--screen-width) * .4);height:auto;object-fit:contain;filter:brightness(.9)}.rocky-state-semi{width:calc(var(--screen-width) * .5);height:auto;object-fit:contain;filter:brightness(.95);transform:translate(calc(var(--screen-width) * .009))}.rocky-state-shiny{width:calc(var(--screen-width) * .43);height:auto;object-fit:contain;filter:brightness(1);transform:translate(calc(var(--screen-width) * .015),calc(var(--screen-height) * .01))}.tool-wrapper{position:absolute;right:calc(var(--screen-width) * -.05);top:calc(var(--screen-height) * .1)}.tool{width:calc(var(--screen-width) * .4);height:auto;object-fit:contain;-webkit-user-select:none;user-select:none}.image-box-click-drag{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.drag-drop-container-ibcd{display:flex;flex-direction:column;align-items:center;gap:5.775vw;position:absolute;top:calc(var(--screen-height) * .45);transform:translateY(-50%)}.draggable-items-ibcd{display:grid;grid-template-columns:repeat(3,calc(var(--screen-width) * .2448));gap:1.8vw;justify-content:center;height:calc(var(--screen-height) * .15)}.draggable-items-success{display:grid;grid-template-columns:repeat(3,auto);gap:4vw;justify-content:center;height:calc(var(--screen-height) * .15)}.draggable-item-ibcd{width:100%;height:calc(var(--screen-height) * .15);overflow:visible;display:flex;align-items:center;justify-content:center;cursor:grab}.draggable-item-ibcd img{max-width:100%;max-height:100%;object-fit:contain}.draggable-items-ibcd>*:nth-child(1) .draggable-item img{transform:scale(2.2);overflow:visible}.draggable-items-ibcd>*:nth-child(2) .draggable-item img{transform:scale(1.2);overflow:visible}.draggable-items-ibcd>*:nth-child(3) .draggable-item img{transform:scale(1.4);overflow:visible}.droppable-boxes-ibcd{display:grid;grid-template-columns:repeat(3,auto);justify-content:center;gap:4vw}.dd-droppable-container-ibcd{width:calc(var(--screen-width) * .2148)}.dd-droppable-zone-ibcd{width:100%}.droppable-box-ibcd,.droppable-box-success{width:calc(var(--screen-width) * .2148);height:calc(var(--screen-height) * .231);display:flex;align-items:center;justify-content:center;border-radius:0}.droppable-box-ibcd p{margin:0;line-height:1.4;text-align:center;word-wrap:break-word;max-width:100%}.dropped-item-ibcd{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.dropped-item-ibcd img{max-width:90%;max-height:90%;object-fit:contain}p.success-text{font-size:calc(var(--screen-width) * .023);padding-top:calc(var(--screen-width) * .015);padding-bottom:calc(var(--screen-width) * .015);padding-right:calc(var(--screen-width) * .003);padding-left:calc(var(--screen-width) * .003)}.mc-colored-box-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--screen-height) * .03);font-family:Balsamiq Sans;margin-top:calc(var(--screen-height) * .03)}.question-box{display:block;font-size:calc(var(--screen-width) * .025);background-color:#a7e4e1;padding:calc(var(--screen-height) * .015);border-radius:calc(var(--screen-height) * .01);border:calc(var(--screen-width) * .005) solid black;width:calc(var(--screen-width) * .8);min-height:calc(var(--screen-height) * .1);height:auto;text-align:left;line-height:1.2;word-wrap:break-word;overflow-wrap:break-word}.answer-box{font-weight:700;color:#4a677e;background-color:#a7cf9e;padding:calc(var(--screen-height) * .004) calc(var(--screen-width) * .018);border-radius:calc(var(--screen-height) * .002);min-width:calc(var(--screen-width) * .04);height:1em;display:inline-block;text-align:center;margin:0 calc(var(--screen-width) * .01);border:calc(var(--screen-width) * .0008) dashed rgba(135,184,107,.7);vertical-align:middle;line-height:normal;font-size:inherit;white-space:nowrap}.answer-box.filled{background-color:#87b86b;color:#fff;border:none;box-shadow:0 1px 3px #0003}.options-colored-container{display:flex;flex-direction:column;gap:calc(var(--screen-height) * .024);width:calc(var(--screen-width) * .4);align-items:center}.option-colored-button{padding:calc(var(--screen-height) * .012) calc(var(--screen-width) * .01);font-size:calc(var(--screen-width) * .025);background-color:#d4e4b7;border:calc(var(--screen-width) * .004) solid black;cursor:pointer;font-family:Balsamiq Sans;width:calc(var(--screen-width) * .35);height:calc(var(--screen-height) * .14);display:flex;align-items:center;justify-content:center;text-align:center;white-space:normal;word-wrap:break-word;line-height:1.2;border-radius:calc(var(--screen-width) * .01)}.option-colored-button:hover{background-color:#b7d49e}.option-colored-button.selected{background-color:#87b86b;color:#fff}.mc-sentence-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--screen-height) * .03);font-family:Balsamiq Sans;margin-top:calc(var(--screen-height) * .05)}.question-box{display:flex;align-items:center;justify-content:center;font-size:calc(var(--screen-width) * .035);background-color:#a7e4e1;padding:calc(var(--screen-height) * .015);border-radius:calc(var(--screen-height) * .01);border:calc(var(--screen-width) * .005) solid black;font-family:Balsamiq Sans;width:70%;height:auto;text-align:center;word-wrap:break-word;margin-top:calc(var(--screen-height) * .175)}.options-container{display:flex;justify-content:center;flex-direction:row;gap:calc(var(--screen-width) * .022);margin-top:calc(var(--screen-height) * .025)}.option-button{padding:calc(var(--screen-height) * .02) calc(var(--screen-width) * .05);font-size:calc(var(--screen-width) * .02875);background-color:#fff;border:calc(var(--screen-width) * .005) solid black;cursor:pointer;border-radius:calc(var(--screen-height) * 1);font-family:Balsamiq Sans;text-align:center;width:calc(var(--screen-width) * .225);height:calc(var(--screen-height) * .13);display:flex;align-items:center;justify-content:center}.option-button:hover{background-color:#f0f0f0}.option-button.selected{background-color:#87b86b;color:#fff}.correct-answer{background-color:#87b86b!important;color:#fff!important}.incorrect-answer{background-color:#ff4d4d!important;color:#fff!important}.horizontal-mc-picture-container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:var(--screen-width);height:calc(var(--screen-height) - (var(--screen-width) * .06) - (var(--screen-height) * .1))}.picture-btn-container-2{display:flex;justify-content:center;gap:calc(var(--screen-width) * .015)}.two-options-container{display:flex;justify-content:center;gap:calc(var(--screen-width) * .1)}.mcp-button-img-container{display:flex;flex-direction:column;align-items:center;gap:calc(var(--screen-height) * .03)}.picture-btn-2{display:flex;align-items:center;justify-content:center;height:100%;width:calc(var(--screen-width) * .28);padding:0 calc(var(--screen-width) * .01);border-radius:calc(var(--screen-width) * .04);border:calc(var(--screen-width) * .005) solid black;background-color:#f0f8ff;font-family:Balsamiq Sans;font-weight:500;font-size:calc(var(--screen-width) * .023);text-align:center;transition:background-color .3s ease}.picture-btn-2:hover{background-color:#a7e4e1}.picture-container-2{width:calc(var(--screen-width) * .28);height:calc(var(--screen-height) * .31);display:flex;justify-content:center;align-items:center;object-fit:contain}.picture-container-2 img{width:100%;height:100%;object-fit:contain}.mcp-button-img-container:hover .picture-btn-2,.correct-btn{background-color:#a7e4e1}.inactive-btn{pointer-events:none;cursor:default;opacity:.8}.inactive-btn:hover{background-color:inherit}.texttop-mc-container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:var(--screen-width);height:var(--screen-height);text-align:center;margin:calc(var(--screen-height) * -.07) 0 0 0;padding:0}.texttop-question-rectangle{display:flex;background-color:#a7e4e1;border:calc(var(--screen-width) * .005) solid black;border-radius:calc(var(--screen-width) * .01);justify-content:center;align-items:center;margin:0 calc(var(--screen-width) * .05) calc(var(--screen-height) * .04);width:calc(var(--screen-width) * .5);padding:calc(var(--screen-height) * .01) calc(var(--screen-width) * .04)}.texttop-question-text{color:#000;font-family:Balsamiq Sans,sans-serif;font-weight:400;text-align:center;font-size:calc(var(--screen-width) * .028)}.texttop-mc-content{display:flex;justify-content:space-around;align-items:center;width:100%;margin-top:calc(var(--screen-height) * .05)}.texttop-picture-btn{width:calc(var(--screen-width) * .3);height:calc(var(--screen-height) * .35);display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:calc(var(--screen-height) * .03);margin-top:calc(var(--screen-height) * -.1);font-size:calc(var(--screen-width) * .032);font-family:Balsamiq Sans;font-weight:400;border-radius:calc(var(--screen-width) * .05);border-width:calc(var(--screen-width) * .005);background-color:#f0f8ff}.texttop-picture-btn img{width:100%;height:70%;object-fit:contain;order:2}.texttop-picture-btn:hover{background-color:#a7e4e1}.inactive-btn{pointer-events:none;opacity:.5}.multi-image-matching-drag{width:100%;height:100%;justify-content:center;align-items:center;position:relative}.draggable-item-outer-wrapper{position:absolute}.draggable-item-mim{display:flex;align-items:center;justify-content:center;font-family:Balsamiq Sans}.media-mim{position:absolute}.droppable-box-mim{display:flex;align-items:center;justify-content:center;font-family:Balsamiq Sans}.prefix-matching-container{display:flex;flex-direction:column;align-items:center;gap:calc(var(--screen-height) * (20/ var(--base-height)));padding-top:calc(var(--screen-height) * (170 / var(--base-height)));font-family:Balsamiq Sans,cursive}.prefixes{display:flex;justify-content:center;gap:calc(var(--screen-width) * (75 / var(--base-width)));margin-bottom:calc(var(--screen-height) * (20 / var(--base-height)))}.base-words{display:flex;flex-direction:column;gap:calc(var(--screen-height) * (20 / var(--base-height)));align-items:center}.prefix-item{width:calc(var(--screen-width) * (120 / var(--base-width)));height:calc(var(--screen-height) * (67 / var(--base-height)));background-color:#a7e4e1;border:calc(var(--screen-width) * (4 / var(--base-width))) solid black;border-radius:calc(var(--screen-width) * (5 / var(--base-width)));display:flex;justify-content:center;align-items:center;font-size:calc(var(--screen-width) * (40 / var(--base-width)));cursor:move;-webkit-user-select:none;user-select:none}.word-container{display:flex;align-items:flex-start;gap:calc(var(--screen-width) * (5 / var(--base-width)))}.prefix-slot{width:calc(var(--screen-width) * (100 / var(--base-width)));height:calc(var(--screen-height) * (75 / var(--base-height)))}.prefix-placeholder{width:100%;height:-webkit-fill-available;border:calc(var(--screen-width) * (4 / var(--base-width))) dashed #666;border-radius:calc(var(--screen-width) * (5 / var(--base-width)))}.base-word{font-size:calc(var(--screen-width) * (40 / var(--base-width)));padding:calc(var(--screen-width) * (10 / var(--base-width)));background-color:#a7e4e1;border:calc(var(--screen-width) * (4 / var(--base-width))) solid black;border-radius:calc(var(--screen-width) * (5 / var(--base-width)));min-width:calc(var(--screen-width) * (200 / var(--base-width)));text-align:center}.placeholder-item{visibility:hidden;pointer-events:none}.draggable-prefix-wrapper{position:relative;z-index:1;touch-action:none}.prefix-item.dragging{opacity:.5}.prefix-item.clickable{cursor:pointer}.prefix-item.clickable:hover{transform:scale(1.05);transition:transform .2s ease}.base-word.combined{min-width:calc(var(--screen-width) * (200 / var(--base-width)));transition:all .3s ease}.sk-fill-in-the-blanks-container{display:flex;align-items:center;width:var(--screen-width);height:var(--screen-height);gap:calc(var(--screen-width) * .1)}.sk-text-box{display:flex;align-items:center;justify-content:center;height:auto;width:calc(var(--screen-width) * .7);background-color:#a7e4e1;border-radius:calc(var(--screen-width) * .008);border:calc(var(--screen-width) * .005) solid black;font-family:Balsamiq Sans;font-size:calc(var(--screen-width) * .037);text-align:center;margin-left:calc(var(--screen-width) * .1);margin-bottom:calc(var(--screen-width) * .08);padding-top:calc(var(--screen-width) * .04);padding-bottom:calc(var(--screen-width) * .04);padding-left:calc(var(--screen-width) * .015);padding-right:calc(var(--screen-width) * .015)}.sk-letter-buttons-container{display:flex;flex-wrap:wrap;gap:calc(var(--screen-width) * .01);margin-right:calc(var(--screen-width) * .1);margin-bottom:calc(var(--screen-width) * .06)}.sk-no-buttons-container{display:flex;flex-wrap:wrap;width:calc(var(--screen-width) * .57);gap:calc(var(--screen-width) * .01);margin-right:calc(var(--screen-width) * .1);margin-bottom:calc(var(--screen-width) * .06)}.sk-circle-letter-btn{border-radius:calc(var(--screen-width) * .1);border:calc(var(--screen-width) * .004) solid black;width:calc(var(--screen-width) * .06);height:calc(var(--screen-width) * .06);text-align:center;font-size:calc(var(--screen-width) * .025);font-family:Balsamiq Sans}.sk-circle-letter-btn:disabled{background-color:#ccc}.sk-circle-letter-btn:hover:not(:disabled){background-color:#b2dfdb}.play-sound-container{--base-width: 1280;--base-height: 832;position:relative;width:100%;height:100%}.sprites-container{position:relative;width:100%;height:100%;left:calc(var(--screen-width) * .1)}.sprites-container img{transition:transform .2s ease}.sprites-container img:hover{transform:scale(1.05)}.image-matching-container{display:flex;flex-direction:column;width:var(--screen-width);height:var(--screen-height);position:relative}.timer-container{display:flex;flex-direction:row;align-items:center;width:calc(var(--screen-height) * .34);height:calc(var(--screen-height) * .12);margin-top:calc(var(--screen-height) * .15);margin-left:calc(var(--screen-height) * .025);background:#fff;border-radius:calc(var(--screen-width) * .04);border:calc(var(--screen-width) * .005) solid black}.bucket-dropzone{position:absolute;height:calc(var(--screen-height) * .4);left:calc(var(--screen-height) * .04);bottom:calc(var(--screen-height) * .24)}.image-draggable-item img:hover{transform:scale(1.05)}.invisible-item{visibility:hidden}.clickable-images-container{display:flex;justify-content:center;align-items:center;gap:calc(var(--screen-width) * .04);width:100%;height:calc(var(--screen-height) * .8);position:relative}.clickable-images-wrapper{display:flex;justify-content:center;align-items:center;height:calc(var(--screen-height) * .8);width:100%}.image-wrapper{position:relative;display:flex;flex-direction:column;align-items:center}.clickable-image{width:calc(var(--screen-width) * .22);height:calc(var(--screen-height) * .29);max-width:calc(var(--screen-width) * .3);max-height:calc(var(--screen-height) * .4);object-fit:contain}.clickable-image:hover{transform:scale(1.0125)}.image-label{position:absolute;top:80%;left:50%;transform:translate(-50%,-100%);background:#fff;padding:calc(var(--screen-height) * .015) calc(var(--screen-width) * .0375);border-radius:calc(var(--screen-width) * .00725);font-family:Balsamiq Sans;border:calc(var(--screen-width) * .004) solid #4e727a;font-size:calc(var(--screen-height) * .035);white-space:nowrap;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.sentences-container{display:flex;flex-direction:column;align-items:center;gap:calc(var(--screen-height) * .05);margin-top:calc(var(--screen-height) * .17);width:100%}.sentence-box{background:#a7e4e1;padding:calc(var(--screen-height) * .01) calc(var(--screen-width) * .02);border-radius:calc(var(--screen-width) * .004);border:calc(var(--screen-width) * .0035) solid black;font-family:Balsamiq Sans,sans-serif;font-size:calc(var(--screen-height) * .048);white-space:nowrap;display:flex;align-items:center;justify-content:center;min-width:calc(var(--screen-width) * .3);transition:transform calc(var(--screen-height) * .0002) ease;-webkit-user-select:none;user-select:none}.sentence-box.drag-over{background:#8ed1ce;transform:scale(calc(1 + var(--screen-width) * .0001))}.blank-space{margin-right:calc(var(--screen-width) * .01);display:inline-block;min-width:calc(var(--screen-width) * .1);text-align:center}.labels-container{display:flex;justify-content:center;gap:calc(var(--screen-width) * .05);margin-top:calc(var(--screen-height) * .07);width:calc(var(--screen-width))}.drag-label{background:#fff;padding:calc(var(--screen-height) * .01) calc(var(--screen-width) * .02);border-radius:calc(var(--screen-width) * .04);border:calc(var(--screen-width) * .0035) solid black;font-family:Balsamiq Sans,sans-serif;font-size:calc(var(--screen-height) * .04);cursor:grab;-webkit-user-select:none;user-select:none;position:relative;transform-origin:center center;transition:transform calc(var(--screen-height) * .0002) ease}.drag-label:hover{transform:scale(calc(1 + var(--screen-width) * .0001))}.mc-freeform-container{position:relative;width:100%;height:100%}.freeform-clickable{transition:transform .1s ease-in-out}.freeform-clickable:hover{transform:scale(1.05);filter:brightness(1.1)}.freeform-clickable:active{transform:scale(.95)}.draggable-word-wrapper{position:absolute}.dd-draggable-word-idd{text-align:center;place-items:center;display:grid}.dd-draggable-word-idd-2{justify-content:center;align-items:center;display:center}.droppable-box-label-idd{justify-content:center;align-items:center;display:flex;transform:translateY(calc(var(--screen-height) * -.007))}.droppable-box-idd-2{justify-content:center;align-items:center;display:flex}.droppable-box-wrapper-idd{position:absolute}.image__bg__click__drag__match__draggable__images{display:flex;justify-content:center;gap:calc(var(--screen-width) * (90 / var(--base-width)));margin-top:calc(var(--screen-height) * (-380 / var(--base-height)));width:100%;overflow:visible;z-index:-1}.image__bg__click__drag__match__item__image{width:calc(var(--screen-width) * (240 / var(--base-width)));height:calc(var(--screen-height) * (265 / var(--base-height)))}.image__bg__click__drag__match__item__match__item--placeholder{width:calc(var(--screen-width) * (240 / var(--base-width)));height:calc(var(--screen-height) * (240 / var(--base-height)));margin-top:calc(var(--screen-height) * (-30 / var(--base-height)));visibility:visible;z-index:1;position:relative}.image__bg__click__drag__match__item__image--placeholder{width:calc(var(--screen-width) * (240 / var(--base-width)));height:calc(var(--screen-height) * (240 / var(--base-height)))}.image__bg__click__drag__match__wrapper{overflow:visible}.image__bg__click__drag__match__item--droppable{background-color:#fff;cursor:default}.image__bg__click__drag__match__droppables{display:flex;justify-content:center;flex-wrap:nowrap;gap:calc(var(--screen-width) * (30 / var(--base-width)));margin-top:calc(var(--screen-height) * (100 / var(--base-height)));width:100%;height:calc(var(--screen-height) * (550 / var(--base-height)));overflow-x:auto}.image__bg__click__drag__match__image{width:calc(var(--screen-width) * (285 / var(--base-width)));height:calc(var(--screen-height) * (285 / var(--base-height)));object-fit:contain}.image__bg__click__drag__match__image__completed{width:calc(var(--screen-width) * (285 / var(--base-width)));height:calc(var(--screen-height) * (475 / var(--base-height)));margin-top:calc(var(--screen-height) * (-15 / var(--base-height)));object-fit:contain}.image__bg__click__drag__match__box{width:40%;height:40%}.image__bg__click__drag__match__overlay{z-index:1000}.image__bg__click__drag__match__overlay .match__item{transform:scale(1.05);box-shadow:0 calc(var(--screen-height) * (2 / var(--base-height))) calc(var(--screen-height) * (5 / var(--base-height))) #0003}.character-btn{background-color:#f0f8ff;width:calc(var(--screen-width) * .5);font-family:Balsamiq Sans;font-weight:600;font-size:calc(var(--screen-width) * .02);text-overflow:ellipsis;border:none}.character-btn:hover{background-color:#a7e4e1;transform:scale(1.05)}.character-btn img{width:calc(var(--screen-width) * .2);height:calc(var(--screen-height) * .3);justify-items:center;align-items:center;padding-bottom:calc(var(--screen-height) * .01)}.helper-btn-container{display:flex;position:absolute;right:calc(var(--screen-width) * .01);top:calc(var(--screen-height) * .4)}.helper-btns{display:flex;height:calc(var(--screen-height) * .15);justify-content:center}.header{position:absolute;left:calc(var(--screen-width) * .18);top:0;right:0;height:calc(var(--screen-height) * .12);background:#ffffffe6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:space-between;padding:0 calc(var(--screen-width) * .03);z-index:98}.header-title{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .035);font-weight:600;color:#000;margin:0}.nav-button{width:calc(var(--screen-width) * .18);height:calc(var(--screen-height) * .08);font-size:calc(var(--screen-width) * .018);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.nav-button .btn__icon img{width:calc(var(--screen-width) * .03)}.nav-button--active{background-color:#c2d2a3;color:#000}.nav-button--active .btn__icon img{filter:brightness(0) saturate(100%)}.green-line{position:absolute;left:calc(var(--screen-width) * .18);top:0;width:calc(var(--screen-width) * .004);height:100%;background-color:#c2d2a3;z-index:99}.sidebar-navigation{position:absolute;left:0;top:calc(var(--screen-height) * .12);display:flex;flex-direction:column;gap:0;z-index:100}.profile-container{position:absolute;left:calc(var(--screen-width) * .18);top:calc(var(--screen-height) * .12);right:0;bottom:0;background:#fff;padding:calc(var(--screen-height) * .03)}.profile-header{position:absolute;left:0;top:0;right:0;display:flex;align-items:center;background-color:#649712;padding:calc(var(--screen-height) * .018) calc(var(--screen-width) * .03);border-radius:0}.profile-avatar{margin-right:calc(var(--screen-width) * .02)}.profile-welcome{flex:1}.profile-content{padding:0 calc(var(--screen-width) * .01);margin-top:calc(var(--screen-height) * .15)}.profile-title{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);font-weight:500;color:#000;margin:0 0 calc(var(--screen-height) * .03) 0}.profile-fields{display:flex;flex-direction:column;gap:calc(var(--screen-height) * .015);margin-bottom:calc(var(--screen-height) * .02)}.profile-field{display:flex;align-items:center;background-color:#c2d2a3;padding:calc(var(--screen-height) * .015) calc(var(--screen-width) * .025);border-radius:calc(var(--screen-width) * .01);position:relative;transition:all .3s ease;border:none;box-shadow:none}.profile-field.editing{background-color:#fff;border:2px solid #649712;box-shadow:none}.field-icon{width:calc(var(--screen-width) * .025);height:calc(var(--screen-width) * .025);margin-right:calc(var(--screen-width) * .015);filter:brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(0%) contrast(100%);transition:all .3s ease}.profile-field.editing .field-icon{filter:brightness(0) saturate(100%) invert(39%) sepia(94%) saturate(1234%) hue-rotate(86deg) brightness(94%) contrast(86%)}.field-input{flex:1;border:none!important;outline:none!important;background:transparent!important;background-color:transparent!important;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);color:#000;transition:all .3s ease;box-shadow:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;-webkit-focus-ring-color:transparent!important;-webkit-tap-highlight-color:transparent!important}.profile-field.editing .field-input{color:#649712;background:transparent!important;background-color:transparent!important;border:none!important;outline:none!important;box-shadow:none!important}.field-input:disabled{color:#000;cursor:default;background:transparent!important;background-color:transparent!important;border:none!important;outline:none!important;box-shadow:none!important}.profile-field.editing .field-input:disabled{color:#649712;background:transparent!important;background-color:transparent!important}.field-input::placeholder{color:#666;font-size:calc(var(--screen-width) * .016)}.profile-field.editing .field-input::placeholder{color:#649712;font-size:calc(var(--screen-width) * .016)}.k-badge{position:absolute;right:calc(var(--screen-width) * .025);top:50%;transform:translateY(-50%);width:calc(var(--screen-width) * .02);height:calc(var(--screen-width) * .02);background-color:#ff6b35;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .012);font-weight:600;color:#fff}.profile-actions{display:flex;justify-content:flex-end;gap:calc(var(--screen-width) * .015);padding-top:calc(var(--screen-height) * .01)}.classes-container{position:absolute;left:calc(var(--screen-width) * .18);top:calc(var(--screen-height) * .12);right:0;bottom:0;background:#fff;display:flex;flex-direction:column}.classes-loading{position:absolute;inset:0;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);color:#666;z-index:10;border-radius:calc(var(--screen-width) * .005)}.loading-spinner{display:flex;align-items:center;justify-content:center;margin-bottom:calc(var(--screen-height) * .02)}.spinner-ring{width:calc(var(--screen-width) * .02);height:calc(var(--screen-width) * .02);border:3px solid #f3f3f3;border-top:3px solid #649712;border-radius:50%;animation:spin 1s linear infinite;margin:0 calc(var(--screen-width) * .005)}.loading-text{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);color:#666}.classes-header{left:0;top:0;right:0;display:flex;align-items:center;background-color:#649712;padding:calc(var(--screen-height) * .018) calc(var(--screen-width) * .03);border-radius:0}.classes-avatar{margin-right:calc(var(--screen-width) * .02)}.classes-container .classes-avatar .avatar-placeholder{width:calc(var(--screen-width) * .06);height:calc(var(--screen-width) * .06);background:#fff;border-radius:50%;border:3px solid rgba(255,255,255,.8)}.classes-welcome{flex:1}.welcome-text{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);font-weight:500;color:#000;margin:0 0 calc(var(--screen-height) * .005) 0}.welcome-subtext{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);color:#06c;margin:0}.add-class-section{display:flex;justify-content:flex-start;align-items:center;gap:calc(var(--screen-width) * .02);padding-left:calc(var(--screen-height) * .04);padding-top:calc(var(--screen-height) * .04);padding-bottom:calc(var(--screen-height) * .02)}.add-class-btn{display:flex;align-items:center;background-color:#c2d2a3;color:#000;border:none;border-radius:calc(var(--screen-width) * .01);padding:calc(var(--screen-height) * .015) calc(var(--screen-width) * .025);font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);font-weight:500;cursor:pointer;transition:background-color .3s ease,transform .2s ease}.add-class-btn:hover{background-color:#a8c28a;transform:translateY(-2px)}.plus-icon{font-size:calc(var(--screen-width) * .02);font-weight:700;margin-right:calc(var(--screen-width) * .01)}.add-class-text{font-size:calc(var(--screen-width) * .016)}.classes-grid-container{overflow-y:auto;margin-top:calc(var(--screen-height) * .02);padding-left:calc(var(--screen-height) * .04);padding-right:calc(var(--screen-height) * .04);flex:1}.classes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(calc(var(--screen-width) * .22),1fr));gap:calc(var(--screen-width) * .02)}.class-card{background:#fff;border:2px solid #e0e0e0;border-radius:calc(var(--screen-width) * .01);padding:0;transition:all .3s ease;animation:fadeIn .3s ease-in-out;min-width:calc(var(--screen-width) * .2);max-width:calc(var(--screen-width) * .25);overflow:hidden}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.class-card.deleting{animation:fadeOut .3s ease-in-out forwards}@keyframes fadeOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-10px)}}.class-card:hover{border-color:#649712;box-shadow:0 calc(var(--screen-width) * .005) calc(var(--screen-width) * .01) #64971233}.class-header{height:calc(var(--screen-height) * .12);position:relative;display:flex;align-items:flex-start;justify-content:flex-end;padding:calc(var(--screen-height) * .015);box-sizing:border-box}.no-classes{grid-column:1 / -1;text-align:center;padding:calc(var(--screen-height) * .05);color:#666;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016)}@media(max-width:768px){.classes-grid{grid-template-columns:repeat(auto-fill,minmax(calc(var(--screen-width) * .4),1fr))}.modal-content{width:calc(var(--screen-width) * .8)}.welcome-text{font-size:calc(var(--screen-width) * .018)}.add-class-btn{font-size:calc(var(--screen-width) * .014)}}@media(max-width:480px){.classes-grid{grid-template-columns:1fr}.modal-content{width:calc(var(--screen-width) * .9)}.welcome-text{font-size:calc(var(--screen-width) * .016)}.add-class-btn{font-size:calc(var(--screen-width) * .012)}}.class-menu-container{position:relative}.class-dropdown{position:absolute;top:calc(100% + 4px);right:0;background:#fff;border:1px solid #e0e0e0;border-radius:calc(var(--screen-width) * .005);box-shadow:0 4px 12px #00000026;z-index:1000;min-width:calc(var(--screen-width) * .12);overflow:hidden}.class-content{padding:calc(var(--screen-height) * .02) calc(var(--screen-width) * .015);background:#fff;box-sizing:border-box}.class-name{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);font-weight:600;color:#000;margin:0 0 calc(var(--screen-height) * .008) 0;line-height:1.2}.class-code{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .013);color:#666;margin:0;line-height:1.2}.add-class-container{position:absolute;left:calc(var(--screen-width) * .18);top:calc(var(--screen-height) * .12);right:0;bottom:0;background:#fff;padding:calc(var(--screen-height) * .03);overflow-y:auto}.add-class-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:calc(var(--screen-height) * .04)}.add-class-title{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .025);font-weight:500;color:#000;margin:0}.add-class-content{width:100%}.color-section{margin-bottom:calc(var(--screen-height) * .04)}.color-palette{display:flex;gap:calc(var(--screen-width) * .015);flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto}@media(max-width:768px){.add-class-content{max-width:calc(var(--screen-width) * .8)}}@media(max-width:480px){.add-class-content{max-width:calc(var(--screen-width) * .9)}.color-palette{justify-content:center}.student-item{flex-direction:column;align-items:flex-start;gap:calc(var(--screen-height) * .01)}}.add-student-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:10000}.add-student-content{background:#fff;border-radius:calc(var(--screen-width) * .01);padding:calc(var(--screen-height) * .03) calc(var(--screen-width) * .03);width:90%;max-width:500px;max-height:80vh;overflow-y:auto;box-shadow:0 4px 20px #0000004d}.add-student-content h3{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .022);font-weight:600;color:#333;margin:0 0 calc(var(--screen-height) * .02) 0;text-align:center}.add-student-content h4{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .018);font-weight:600;color:#333;margin:0 0 calc(var(--screen-height) * .015) 0}.id-input-section{display:flex;flex-direction:column;gap:calc(var(--screen-height) * .015)}.student-confirmation{text-align:center}.student-confirmation h4{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .018);font-weight:600;color:#333;margin:0 0 calc(var(--screen-height) * .015) 0}.student-info{background-color:#f8f9fa;border-radius:calc(var(--screen-width) * .008);padding:calc(var(--screen-height) * .015) calc(var(--screen-width) * .015);margin-bottom:calc(var(--screen-height) * .02)}.student-info p{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);color:#333;margin:calc(var(--screen-height) * .005) 0}.confirmation-actions{display:flex;gap:calc(var(--screen-width) * .015);justify-content:center}.student-not-found{margin-top:calc(var(--screen-height) * .02);padding:calc(var(--screen-height) * .015) calc(var(--screen-width) * .02);background-color:#ffebee;border:1px solid #ffcdd2;border-radius:calc(var(--screen-width) * .005);text-align:center}.student-not-found p{margin:0;color:#c62828;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .014);font-weight:500}.edit-class-container{position:absolute;left:calc(var(--screen-width) * .18);top:calc(var(--screen-height) * .12);right:0;bottom:0;background:#fff;padding:calc(var(--screen-height) * .03);overflow-y:auto}.edit-class-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:calc(var(--screen-height) * .04)}.edit-class-title{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .025);font-weight:500;color:#000;margin:0}.edit-class-content{width:100%}.input-section{margin-bottom:calc(var(--screen-height) * .04)}.form-group{margin-bottom:calc(var(--screen-height) * .02)}.class-input{width:100%;padding:calc(var(--screen-height) * .015) calc(var(--screen-width) * .02);border:2px solid #C2D2A3;border-radius:calc(var(--screen-width) * .01);font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);box-sizing:border-box;transition:border-color .3s ease}.class-input:focus{outline:none;border-color:#a8c28a;box-shadow:0 0 0 3px #c2d2a31a}.class-input::placeholder{color:#999;font-size:calc(var(--screen-width) * .016)}.edit-class-section,.color-section{margin-bottom:calc(var(--screen-height) * .04)}.section-title{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);font-weight:500;color:#000;margin:0 0 calc(var(--screen-height) * .02) 0}.color-palette{display:flex;gap:calc(var(--screen-width) * .015);flex-wrap:wrap;justify-content:flex-start;overflow:visible}.color-option{width:calc(var(--screen-width) * .05);height:calc(var(--screen-width) * .05);border:2px solid #e0e0e0;border-radius:calc(var(--screen-width) * .008);cursor:pointer;transition:all .3s ease;flex-shrink:0}.color-option:hover{transform:scale(1.1);border-color:#333}.color-option.selected{border:3px solid #333;transform:scale(1.1)}.enrolled-students-section .section-title{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);font-weight:500;color:#000;margin:0 0 calc(var(--screen-height) * .02) 0}.students-table-container{max-height:calc(var(--screen-height) * .35);overflow-y:auto;border:1px solid #e0e0e0;border-radius:calc(var(--screen-width) * .005);width:100%;box-sizing:border-box;background:#fff}.students-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--screen-height) * .04);min-height:calc(var(--screen-height) * .2)}.students-loading .spinning-circle{width:calc(var(--screen-width) * .04);height:calc(var(--screen-width) * .04);border:3px solid transparent;border-top:3px solid #649712;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:calc(var(--screen-height) * .02)}.students-loading p{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);color:#666;margin:0;text-align:center}.error-message{background:#fee;border:1px solid #fcc;color:#c33;padding:calc(var(--screen-height) * .015) calc(var(--screen-width) * .015);border-radius:calc(var(--screen-width) * .005);margin-bottom:calc(var(--screen-height) * .02);font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .014)}@media(max-width:1200px){.edit-class-container{left:calc(var(--screen-width) * .18);padding:calc(var(--screen-height) * .015) calc(var(--screen-width) * .012)}.edit-class-header,.edit-class-content{padding:calc(var(--screen-height) * .018) calc(var(--screen-width) * .012)}.students-loading .spinning-circle{width:calc(var(--screen-width) * .035);height:calc(var(--screen-width) * .035)}}@media(max-width:768px){.edit-class-container{left:calc(var(--screen-width) * .18);padding:calc(var(--screen-height) * .01) calc(var(--screen-width) * .008)}.input-section{margin-bottom:calc(var(--screen-height) * .02)}.color-palette{justify-content:center;gap:calc(var(--screen-width) * .01)}.color-option{width:calc(var(--screen-width) * .04);height:calc(var(--screen-width) * .04)}.students-table{font-size:calc(var(--screen-width) * .011);min-width:400px}.students-table th,.students-table td{padding:calc(var(--screen-height) * .008) calc(var(--screen-width) * .008)}.section-title{font-size:calc(var(--screen-width) * .018)}.edit-class-title{font-size:calc(var(--screen-width) * .02)}.students-loading .spinning-circle{width:calc(var(--screen-width) * .03);height:calc(var(--screen-width) * .03)}.students-loading p{font-size:calc(var(--screen-width) * .014)}}@media(max-width:480px){.edit-class-container{left:calc(var(--screen-width) * .18);padding:calc(var(--screen-height) * .008) calc(var(--screen-width) * .006)}.edit-class-header{flex-direction:column;text-align:center;gap:calc(var(--screen-height) * .01)}.add-student-content{padding:calc(var(--screen-height) * .02) calc(var(--screen-width) * .02);width:95%}}.id-input-section{display:flex;flex-direction:column;gap:calc(var(--screen-height) * .015);margin:calc(var(--screen-height) * .03) calc(var(--screen-width) * .03)}.id-input-section label{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);font-weight:500;color:#333}.id-input{padding:calc(var(--screen-height) * .012) calc(var(--screen-width) * .015);border:2px solid #C2D2A3;border-radius:calc(var(--screen-width) * .008);font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);transition:border-color .3s ease}.id-input:focus{outline:none;border-color:#a8c484}.id-actions{display:flex;gap:calc(var(--screen-width) * .015);justify-content:center}@media(max-width:480px){.add-student-content{padding:calc(var(--screen-height) * .015) calc(var(--screen-width) * .015);width:98%}}.pending-addition{background-color:#e8f5e8!important;border-left:4px solid #4caf50}.pending-removal{background-color:#ffebee!important;border-left:4px solid #f44336;opacity:.7}.pending-indicator{color:#666;font-style:italic;font-size:.9em}.overview-grid{display:grid;grid-template-columns:repeat(2,auto);gap:calc(var(--screen-width) * .014)}.overview-message,.overview-error{grid-column:1 / -1;padding:1rem;font-family:Fredoka,sans-serif}.overview-error{color:#c62828}.overview-loading{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem}.small-card{background-color:#fff;width:calc(var(--screen-width) * (382 / 1280));height:calc(var(--screen-height) * (288 / 832));border-radius:calc(var(--screen-width) * (16 / 1280));border:calc(var(--screen-width) * (3 / 1280)) solid #c2d2a3;display:flex;flex-direction:column;overflow:hidden;font-family:Fredoka,sans-serif}.card{background-color:#fff;width:calc(var(--screen-width) * (555 / 1280));height:calc(var(--screen-height) * (288 / 832));border-radius:calc(var(--screen-width) * (16 / 1280));border:calc(var(--screen-width) * (3 / 1280)) solid #c2d2a3;display:flex;flex-direction:column;overflow:hidden;font-family:Fredoka,sans-serif}.words-table{width:100%;height:100%;border-collapse:collapse;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .012);min-width:0;background:#fff}.words-table thead{background:#649712;color:#fff;position:sticky;top:0;z-index:10}.words-table th{padding:calc(var(--screen-height) * .012) calc(var(--screen-width) * .012);text-align:left;font-size:calc(var(--screen-width) * .015);font-weight:500;border-bottom:none;white-space:nowrap}.words-table td{padding:calc(var(--screen-height) * .01) calc(var(--screen-width) * .012);border-bottom:calc(var(--screen-width) * (1 / 1280)) solid #f0f0f0;vertical-align:middle;white-space:nowrap}.words-table th,.words-table td{border-right:calc(var(--screen-width) * (3 / 1280)) solid #c2d2a3}.words-table th:last-child,.words-table td:last-child{border-right:none}.words-table tbody tr:last-child td{border-bottom:none}.words-table tbody tr:nth-child(odd){background-color:#fff}.words-table tbody tr:nth-child(2n){background-color:#ebefe4}.words-table tbody tr:hover{background-color:#f8f9fa}.card-body{padding:calc(var(--screen-height) * (13 / 832)) calc(var(--screen-width) * (22 / 1280));display:flex;flex-direction:column;gap:calc(var(--screen-height) * (18 / 832));height:100%}.lesson-card-body{padding:calc(var(--screen-height) * (13 / 832)) calc(var(--screen-width) * (22 / 1280));display:flex;flex-direction:column;gap:calc(var(--screen-height) * (4 / 832));height:100%}.small-card-body{padding:calc(var(--screen-height) * (13 / 832)) calc(var(--screen-width) * (22 / 1280));display:flex;flex-direction:column;gap:calc(var(--screen-height) * (18 / 832));height:100%}.controls{display:flex;justify-content:space-between;align-items:flex-start}.module-select{padding:calc(var(--screen-height) * (3 / 832)) calc(var(--screen-width) * (25 / 1280)) calc(var(--screen-height) * (2 / 832)) calc(var(--screen-width) * (20 / 1280));border-radius:calc(var(--screen-width) * (10 / 1280));background-color:#c2d2a3;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * (16 / 1280));border:none;outline:none;cursor:pointer;appearance:none;background-repeat:no-repeat;background-position:right calc(var(--screen-width) * (10 / 1280)) center;background-size:calc(var(--screen-width) * (8 / 1280))}.legend{display:flex;justify-content:flex-end;gap:calc(var(--screen-height) * (8 / 832))}.legend-item{width:calc(var(--screen-width) * (20 / 1280));height:calc(var(--screen-height) * (20 / 832));border-radius:calc(var(--screen-width) * (5 / 1280));display:flex;align-items:center;justify-content:center;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * (12 / 1280));color:#fff}.column-legend{display:flex;flex-direction:column;gap:calc(var(--screen-height) * (4 / 832))}.column-legend-item{width:calc(var(--screen-width) * (74 / 1280));height:calc(var(--screen-height) * (20 / 832));border-radius:calc(var(--screen-width) * (5 / 1280));display:flex;align-items:center;justify-content:center;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * (12 / 1280));color:#fff}.small-chart-container{position:relative;width:calc(var(--screen-width) * (336/ 1280));height:calc(var(--screen-height) * (163 / 832))}.small-chart-container svg{width:100%;height:100%;display:block}.small-chart-container .domain{stroke:#649712}.small-chart-container .tick text{font-family:Fredoka,sans-serif;font-weight:400;fill:#000}.small-chart-container .tick line{display:none}.chart-container{position:relative;width:calc(var(--screen-width) * (533/ 1280));height:calc(var(--screen-height) * (173 / 832))}.chart-container svg{width:100%;height:100%;display:block}.chart-container .domain{stroke:#649712}.chart-container .tick text{font-family:Fredoka,sans-serif;font-weight:400;fill:#000}.chart-container .tick line{display:none}.tooltip{position:absolute;opacity:0;pointer-events:none;background-color:#fff;border:calc(var(--screen-width) * (1 / 1280)) solid #649712;border-radius:calc(var(--screen-width) * (5 / 1280));padding:calc(var(--screen-height) * (8 / 832));font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * (12 / 1280));font-weight:500;color:#000;box-shadow:0 calc(var(--screen-height) * (2 / 832)) calc(var(--screen-height) * (6 / 832)) #00000026}.enrolled-students-section{display:flex;flex-direction:column;min-height:0;max-height:100%}.students-table-outer-wrapper{background-color:#c2d2a3;border-radius:calc(var(--screen-height) * .015);padding:calc(var(--screen-height) * .046) calc(var(--screen-height) * .004) calc(var(--screen-height) * .004);overflow:hidden;display:flex;flex-direction:column;min-height:0;max-height:100%}.enrolled-students-section .section-title{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);font-weight:500;color:#000;margin-bottom:calc(var(--screen-height) * .02)}.enrolled-students-section .students-table-container{max-height:100%;min-height:0;overflow-y:auto;overflow-x:auto;border:none;border-radius:0 0 calc(var(--screen-height) * .011) calc(var(--screen-height) * .011);background:#fff;clip-path:inset(0 0 0 0 round 0 0 calc(var(--screen-height) * .011) calc(var(--screen-height) * .011))}.enrolled-students-section .students-table{width:100%;border-collapse:separate;border-spacing:0;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .012);display:table;border:none}.enrolled-students-section .students-table thead{background:#649712;color:#fff;position:sticky;top:0;z-index:10;border:none}.enrolled-students-section .students-table tbody{background-color:#fff}.enrolled-students-section .students-table th{padding:calc(var(--screen-height) * .012) calc(var(--screen-width) * .012);text-align:left;font-weight:600;white-space:nowrap;border-right:calc(var(--screen-width) * .003) solid #C2D2A3}.enrolled-students-section .students-table th:last-child{border-right:none}.enrolled-students-section .students-table thead th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;padding-right:calc(var(--screen-width) * .02)}.enrolled-students-section .students-table thead th.sortable:hover{background-color:#5a8a10}.sort-icon{margin-left:8px;vertical-align:middle;opacity:.3;transition:opacity .2s,transform .2s}.sort-icon.active{opacity:1}.enrolled-students-section .students-table td{padding:calc(var(--screen-height) * .01) calc(var(--screen-width) * .012);white-space:nowrap;border-right:calc(var(--screen-width) * .003) solid #C2D2A3;vertical-align:middle;box-sizing:border-box}.enrolled-students-section .students-table tbody td.students-table__td-action{padding:0 calc(var(--screen-width) * .012);height:1px}.enrolled-students-section .students-table td:last-child{border-right:none}.enrolled-students-section .students-table tbody tr:hover{background-color:#f8f9fa}.enrolled-students-section .no-students{text-align:center;color:#666;font-style:italic;padding:calc(var(--screen-height) * .03) 0;background:#fff}.enrolled-students-section .enroll-actions{display:flex;justify-content:space-between;align-items:center;padding:calc(var(--screen-height) * .02) calc(var(--screen-width) * .025)}.enrolled-students-section .students-table thead{background-color:#649712}.enrolled-students-section .students-table thead th{color:#fff;font-weight:600;padding:calc(var(--screen-height) * .012) calc(var(--screen-width) * .012);text-align:left;white-space:nowrap;border-right:calc(var(--screen-width) * .003) solid #C2D2A3;background-color:#649712}.enrolled-students-section .students-table thead th:last-child{border-right:none}.enrolled-students-section .students-table thead th.students-table__th-action,.enrolled-students-section .students-table tbody td.students-table__td-action{width:calc(var(--screen-width) * .07);min-width:4.25rem;vertical-align:middle;text-align:center}.enrolled-students-section .students-table tbody td.students-table__td-action .students-table__icon-btn{display:inline-flex;width:fit-content;margin-left:auto;margin-right:auto}.enrolled-students-section .students-table tbody tr:nth-child(2n){background-color:#c2d2a340}.enrolled-students-section .students-table__icon-btn{display:inline-flex;align-items:center;justify-content:center;padding:calc(var(--screen-height) * .005);border:none;border-radius:calc(var(--screen-width) * .006);background:transparent;color:#3d5c0c;cursor:pointer;transition:background-color .15s ease,color .15s ease;min-height:0}.enrolled-students-section .students-table__icon-btn:hover:not(:disabled){background-color:#64971226;color:#2d4509}.enrolled-students-section .students-table__icon-btn:disabled{opacity:.45;cursor:not-allowed}.enrolled-students-section .students-table__icon-btn--remove{color:#8b2942}.enrolled-students-section .students-table__icon-btn--remove:hover:not(:disabled){background-color:#8b29421f;color:#6a1f33}.student-container{padding:calc(var(--screen-height) * .03);overflow:auto}.student-header{position:absolute;left:0;top:0;right:0;display:flex;align-items:center;background-color:#4d8fa7;padding:calc(var(--screen-height) * .018) calc(var(--screen-width) * .03);border-radius:0;z-index:11}.student-avatar{margin-right:calc(var(--screen-width) * .02)}.student-container .student-avatar .avatar-placeholder{width:calc(var(--screen-width) * .06);height:calc(var(--screen-width) * .06);background:#fff;border-radius:50%;border:3px solid rgba(255,255,255,.8)}.student-information{flex:1}.student-name-text{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);font-weight:500;color:#fff;margin:0 0 calc(var(--screen-height) * .005) 0}.student-username-subtext{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);color:#fff;margin:0}.student-header-right{display:flex;align-items:flex-end;margin-left:auto;flex-direction:column}.student-time-login-subtext{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .013);color:#fff;margin:0 0 calc(var(--screen-width) * .01) auto;font-weight:400}.student-content{margin-top:calc(var(--screen-height) * .18);display:flex;flex-direction:column;gap:calc(var(--screen-height) * .03)}.student-card{background-color:#fff;height:auto;border-radius:calc(var(--screen-width) * (16 / 1280));border:calc(var(--screen-width) * (3 / 1280)) solid #c2d2a3;display:flex;flex-direction:column;overflow:hidden;font-family:Fredoka,sans-serif}.card-title{background-color:#c2d2a3;padding:calc(var(--screen-height) * (14 / 832)) calc(var(--screen-width) * (22 / 1280));font-weight:600;font-size:calc(var(--screen-width) * (20 / 1280));color:#000}.student-table{width:100%;height:100%;border-collapse:collapse;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .012);min-width:0;background:#fff}.student-table thead{background:#649712;color:#fff;position:sticky;top:0;z-index:10}.student-table th{padding:calc(var(--screen-height) * .012) calc(var(--screen-width) * .012);text-align:left;font-size:calc(var(--screen-width) * .015);font-weight:500;border-bottom:none;white-space:nowrap}.student-table td{padding:calc(var(--screen-height) * .01) calc(var(--screen-width) * .012);border-bottom:calc(var(--screen-width) * (1 / 1280)) solid #f0f0f0;vertical-align:middle;white-space:nowrap}.student-table th,.student-table td{border-right:calc(var(--screen-width) * (3 / 1280)) solid #c2d2a3}.student-table th:last-child,.student-table td:last-child{border-right:none}.student-table td:nth-child(3){max-width:calc(var(--screen-width) * .25);white-space:normal;word-break:break-word}.student-table td:nth-child(2),.student-table td:nth-child(4){text-align:center}.student-table tbody tr:last-child td{border-bottom:none}.student-table tbody tr:nth-child(odd){background-color:#fff}.student-table tbody tr:nth-child(2n){background-color:#ebefe4}.student-table tbody tr:hover{background-color:#f8f9fa}.lesson-row{display:flex;justify-content:space-between;align-items:center}.lesson-text{flex:1}.lesson-square{width:calc(var(--screen-width) * .018);height:calc(var(--screen-width) * .018);border-radius:calc(var(--screen-width) * .004);border:calc(var(--screen-width) * (3 / 1280)) solid #649712}.lesson-square.empty{background-color:#fff}.lesson-square.filled{background-color:#649712}.dropdown-progress-container{display:grid;gap:calc(var(--screen-width) * .01)}.dropdown-container{flex-shrink:0}.progress-container{display:flex;align-items:center;gap:calc(var(--screen-width) * .01)}.progress-bar{flex:1;height:calc(var(--screen-height) * .02);background:none;border:calc(var(--screen-width) * (3 / 1280)) solid #4D8FA7;border-radius:calc(var(--screen-width) * .02);overflow:hidden}.progress-fill{height:100%;background:#4f8fa3}.progress-text{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .015);font-weight:500;color:#000}.dropdown-student{position:relative}.dropdown-student-title{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .015);font-weight:500;display:flex;align-items:center;color:#000;cursor:pointer;gap:calc(var(--screen-width) * .009375);position:relative}.dropdown-student-menu{position:absolute;left:0;width:100%;background:#fff;color:#649712;border:calc(var(--screen-width) * (3 / 1280)) solid #649712;border-radius:calc(var(--screen-width) * (6 / 1280));z-index:11;display:none}.dropdown-student.open .dropdown-student-menu{display:block}.dropdown-student-item{padding:calc(var(--screen-height) * .015);cursor:pointer;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .013);border-radius:calc(var(--screen-width) * (6 / 1280));font-weight:500}.dropdown-student-item:hover{background:#ebefe4;color:#000}.class-display-container{position:absolute;left:calc(var(--screen-width) * .18);top:calc(var(--screen-height) * .12);right:0;bottom:0;background:#fff;display:flex;flex-direction:column;overflow:hidden}.class-display-header{left:0;top:0;right:0;display:flex;align-items:center;--header-bg-color: #649712;background-color:var(--header-bg-color);padding:calc(var(--screen-height) * .018) calc(var(--screen-width) * .03);border-radius:0}.profile-container .profile-avatar .avatar-placeholder{width:calc(var(--screen-width) * .06);height:calc(var(--screen-width) * .06);background:#fff;border-radius:50%;border:3px solid rgba(255,255,255,.8)}.profile-welcome{display:flex;justify-content:space-between;align-items:center;width:100%;flex:1}.profile-welcome-left{display:flex;flex-direction:column;align-items:flex-start}.profile-welcome-right{display:flex;align-items:center;margin-left:auto}.header-button{color:#fff}.header-button:hover{color:#000}.header-button img{filter:brightness(0) invert(1)!important}.header-button:hover img{filter:brightness(0) saturate(100%)!important}.class-name-text{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);font-weight:500;color:#000;margin:0 0 calc(var(--screen-height) * .005) 0}.class-name-subtext{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);color:#fff;margin:0}.nav-button-group{display:inline-flex;align-items:center;padding:0}.segmentedControl{display:inline-flex;gap:0;background-color:#fff;border:calc(var(--screen-height) * .004) solid #C2D2A3;border-radius:calc(var(--screen-height) * .015)!important;position:relative}.segmentedControl .MuiToggleButton-root{border:none;text-transform:none;color:#649712;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .015);padding:calc(var(--screen-height) * .002) calc(var(--screen-width) * .01);display:flex;align-items:center;border-radius:0;background-color:transparent;z-index:0}.segmentedControl .Mui-selected{background-color:#c2d2a3!important;font-size:calc(var(--screen-width) * .02);color:#000!important;border-radius:calc(var(--screen-height) * .012)!important;z-index:1}.main-content{display:flex;flex-direction:column;padding-top:calc(var(--screen-height) * .02);padding-left:calc(var(--screen-height) * .04);padding-right:calc(var(--screen-height) * .04);padding-bottom:calc(var(--screen-height) * .04);flex:1;min-height:0;overflow-y:auto}.class-display-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;min-height:200px;font-family:Fredoka,sans-serif;color:#666}.loading-spinner--class-display{position:relative;width:calc(var(--screen-width) * .055);height:calc(var(--screen-width) * .055);margin-bottom:calc(var(--screen-height) * .02)}.loading-spinner--class-display .spinner-ring{position:absolute;border:3px solid transparent;border-radius:50%;animation:class-display-spinner-spin 1.2s linear infinite;box-sizing:border-box;transform-origin:center center}.loading-spinner--class-display .spinner-ring:nth-child(1){width:calc(var(--screen-width) * .055);height:calc(var(--screen-width) * .055);top:0;left:0;border-top-color:#3498db;animation-delay:0s}.loading-spinner--class-display .spinner-ring:nth-child(2){width:calc(var(--screen-width) * .036);height:calc(var(--screen-width) * .036);top:50%;left:50%;margin-top:calc(var(--screen-width) * -.018);margin-left:calc(var(--screen-width) * -.018);border-top-color:#2ecc71;animation-delay:.15s}.loading-spinner--class-display .spinner-ring:nth-child(3){width:calc(var(--screen-width) * .018);height:calc(var(--screen-width) * .018);top:50%;left:50%;margin-top:calc(var(--screen-width) * -.009);margin-left:calc(var(--screen-width) * -.009);border-top-color:#f39c12;animation-delay:.3s}@keyframes class-display-spinner-spin{to{transform:rotate(360deg)}}.class-display-loading .loading-text{font-size:calc(var(--screen-width) * .016)}.manage-text{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);font-weight:500;border-radius:0}.class-column{display:flex;align-items:center;width:100%;margin-top:calc(var(--screen-height) * .03);padding-left:calc(var(--screen-width) * .03);padding-right:calc(var(--screen-width) * .03);box-sizing:border-box}.class-column-left{display:flex;align-items:center;gap:calc(var(--screen-width) * .01)}.class-column-right{margin-left:auto}.modal-add-student{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000}.modal-add-student__content{background:#fff;border-radius:calc(var(--screen-width) * .01);padding:calc(var(--screen-height) * .03) calc(var(--screen-width) * .03);width:90%;max-width:480px;max-height:80vh;overflow-y:auto;box-shadow:0 4px 20px #0000004d}.modal-add-student__title{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .022);font-weight:600;color:#333;margin:0 0 calc(var(--screen-height) * .02) 0;text-align:center}.modal-add-student__hint{margin-top:0;color:#649712;font-family:Fredoka,sans-serif;font-weight:600;text-align:left}.modal-add-student__hint strong{color:#696969}.modal-add-student__form{display:flex;flex-direction:column;gap:calc(var(--screen-height) * .015)}.modal-add-student__label{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);font-weight:500;color:#333}.modal-add-student__input{padding:calc(var(--screen-height) * .012) calc(var(--screen-width) * .015);border:2px solid #C2D2A3;border-radius:calc(var(--screen-width) * .008);font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);transition:border-color .3s ease}.modal-add-student__input:focus{outline:none;border-color:#a8c28a;box-shadow:0 0 0 3px #c2d2a326}.modal-add-student__password-wrap{display:flex;align-items:center;gap:calc(var(--screen-width) * .01);position:relative}.modal-add-student__password-wrap .modal-add-student__input{flex:1;padding-right:calc(var(--screen-width) * .08)}.modal-add-student__actions{display:flex;justify-content:center;gap:calc(var(--screen-width) * .02);margin-top:calc(var(--screen-height) * .025)}.modal-add-student .modal-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:calc(var(--screen-height) * .28);padding:calc(var(--screen-height) * .012) 0}.modal-add-student .modal-loading .loading-spinner{position:relative;width:calc(var(--screen-width) * .055);height:calc(var(--screen-width) * .055);flex-shrink:0;margin-bottom:calc(var(--screen-height) * .02)}.modal-add-student .modal-loading .spinner-ring{position:absolute;border:3px solid transparent;border-radius:50%;animation:modal-spinner-spin 1.2s linear infinite;box-sizing:border-box;transform-origin:center center}.modal-add-student .modal-loading .spinner-ring:nth-child(1){border-top-color:#3498db}.modal-add-student .modal-loading .spinner-ring:nth-child(2){border-top-color:#2ecc71}.modal-add-student .modal-loading .spinner-ring:nth-child(3){border-top-color:#f39c12}.modal-add-student .modal-loading .spinner-ring:nth-child(1){width:calc(var(--screen-width) * .055);height:calc(var(--screen-width) * .055);top:0;left:0;animation-delay:0s}.modal-add-student .modal-loading .spinner-ring:nth-child(2){width:calc(var(--screen-width) * .036);height:calc(var(--screen-width) * .036);top:50%;left:50%;margin-top:calc(var(--screen-width) * -.018);margin-left:calc(var(--screen-width) * -.018);animation-delay:.15s}.modal-add-student .modal-loading .spinner-ring:nth-child(3){width:calc(var(--screen-width) * .018);height:calc(var(--screen-width) * .018);top:50%;left:50%;margin-top:calc(var(--screen-width) * -.009);margin-left:calc(var(--screen-width) * -.009);animation-delay:.3s}@keyframes modal-spinner-spin{to{transform:rotate(360deg)}}.modal-list-csv{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000}.modal-list-csv__content{background:#fff;border-radius:calc(var(--screen-width) * .01);padding:calc(var(--screen-height) * .03) calc(var(--screen-width) * .03);width:90%;max-width:720px;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 4px 20px #0000004d}.modal-list-csv__title{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .022);font-weight:600;text-align:center;margin-bottom:calc(var(--screen-height) * .02)}.modal-list-csv__table-wrapper{flex:1;overflow-y:scroll;border:1px solid #e0e0e0;border-radius:calc(var(--screen-width) * .005)}.modal-list-csv__table{width:100%;border-collapse:collapse;font-family:Fredoka,sans-serif}.modal-list-csv__table thead tr:first-child th:first-child{border-top-left-radius:calc(var(--screen-width) * .005)}.modal-list-csv__table thead tr:first-child th:last-child{border-top-right-radius:calc(var(--screen-width) * .005)}.modal-list-csv__table thead th{position:sticky;top:0;z-index:10;background:#649712;color:#fff;font-weight:600;padding:calc(var(--screen-height) * .012);text-align:left;white-space:nowrap}.modal-list-csv__table td{padding:calc(var(--screen-height) * .01);border-bottom:1px solid #eee}.modal-list-csv__table input{width:100%;min-width:0;padding:6px 8px;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .014);border:1px solid #ccc;border-radius:4px}.modal-list-csv__table td input{width:100%;box-sizing:border-box;font-family:inherit;font-size:inherit}.modal-list-csv__empty{text-align:center;color:#888;font-style:italic;padding:calc(var(--screen-height) * .02)}.modal-list-csv__actions{display:flex;justify-content:center;gap:calc(var(--screen-width) * .02);margin-top:calc(var(--screen-height) * .025)}.modal-list-csv__submit,.modal-list-csv__cancel{min-width:140px;padding:calc(var(--screen-height) * .012) calc(var(--screen-width) * .025);border-radius:calc(var(--screen-width) * .008);font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);font-weight:500;cursor:pointer;transition:background-color .3s ease}.modal-list-csv__upload-btn{min-width:140px;padding:calc(var(--screen-height) * .012) calc(var(--screen-width) * .025);border-radius:calc(var(--screen-width) * .008);font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);font-weight:500;cursor:pointer;transition:all .3s ease;background:transparent;border:2px solid #C2D2A3;color:#649712}.modal-list-csv__submit{background:#649712;color:#fff;border:none}.modal-list-csv__submit:hover:not(:disabled){background:#5a8a10}.modal-list-csv__upload-btn:hover{background:#c2d2a31a}.modal-list-csv__submit:disabled{background:#ccc;cursor:not-allowed}.modal-list-csv__cancel{background:#f5f5f5;color:#666;border:1px solid #ddd}.modal-list-csv__cancel:hover{background:#e0e0e0}.modal-list-csv__upload-zone{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px dashed #C2D2A3;border-radius:calc(var(--screen-width) * .01);padding:calc(var(--screen-height) * .05);background:#fafafa;cursor:pointer;transition:all .3s ease;gap:calc(var(--screen-height) * .02)}.modal-list-csv__upload-zone.dragging{background:#eef7e1;border-color:#649712}.modal-list-csv__upload-icon{width:calc(var(--screen-width) * .05);height:auto}.modal-list-csv__upload-zone p{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);color:#666;text-align:center}.modal-list-csv__results{display:flex;flex-direction:column;gap:calc(var(--screen-height) * .02);font-family:Fredoka,sans-serif;color:#333;flex:1;min-height:0;overflow:hidden}.modal-list-csv__loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--screen-height) * .05);font-family:Fredoka,sans-serif;color:#666}.modal-list-csv__loading .loading-spinner--class-display{margin-bottom:calc(var(--screen-height) * .02)}.modal-list-csv__json-result{background:#f8f8f8;padding:calc(var(--screen-height) * .02);border-radius:calc(var(--screen-width) * .005);border:1px solid #ddd;max-height:40vh;overflow:auto;font-family:monospace;font-size:calc(var(--screen-width) * .012);white-space:pre-wrap;word-break:break-all}.help-container{position:absolute;left:calc(var(--screen-width) * .18);top:calc(var(--screen-height) * .12);right:0;bottom:0;background:#fff;padding:calc(var(--screen-height) * .03);overflow-y:auto;scrollbar-color:#c2d2a3 transparent}.help-container::-webkit-scrollbar{height:calc(var(--screen-width) * (277 / 1280));width:calc(var(--screen-width) * (16 / 832))}.help-container::-webkit-scrollbar-track{background:transparent}.help-container::-webkit-scrollbar-thumb{background-color:#c2d2a3;border-radius:calc(var(--screen-width) * (5 / 1280))}.help-container::-webkit-scrollbar-thumb:hover{background-color:#649712}.loading-message{display:flex;align-items:center;justify-content:center;height:100%;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);color:#666}.error-message{background-color:#ffebee;color:#c62828;padding:calc(var(--screen-height) * .015) calc(var(--screen-width) * .02);border-radius:calc(var(--screen-width) * .005);margin-bottom:calc(var(--screen-height) * .02);font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .014);border:1px solid #ffcdd2}.help-header{position:absolute;left:0;top:0;right:0;display:flex;align-items:center;background-color:#649712;padding:calc(var(--screen-height) * .018) calc(var(--screen-width) * .03);border-radius:0}.help-avatar{margin-right:calc(var(--screen-width) * .02)}.help-container .help-avatar .avatar-placeholder{width:calc(var(--screen-width) * .06);height:calc(var(--screen-width) * .06);background:#fff;border-radius:50%;border:3px solid rgba(255,255,255,.8)}.help-welcome{flex:1}.help-welcome-text{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);font-weight:500;color:#fff;margin:0 0 calc(var(--screen-height) * .005) 0}.help-welcome-subtext{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .016);color:#fff;margin:0}.help-content{padding:0 calc(var(--screen-width) * .01);margin-top:calc(var(--screen-height) * .15)}.help-title{font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .02);font-weight:500;color:#000;margin:0 0 calc(var(--screen-height) * .03) 0}.helpcard{background-color:#fff;width:calc(var(--screen-width) * (955 / 1280));height:calc(var(--screen-height) * (643 / 832));border-radius:calc(var(--screen-width) * (16 / 1280));border:calc(var(--screen-width) * (3 / 1280)) solid #c2d2a3;display:flex;flex-direction:column;overflow:hidden;font-family:Fredoka,sans-serif}.helpcard-title{background-color:#c2d2a3;padding:calc(var(--screen-height) * (14 / 832)) calc(var(--screen-width) * (22 / 1280));font-weight:600;font-size:calc(var(--screen-width) * (20 / 1280));color:#000}.dropdown{position:relative}.dropdown-title{display:flex;align-items:center;background-color:#c2d2a3;color:#000;cursor:pointer;gap:calc(var(--screen-width) * .009375);position:relative}.dropdown-icon{width:calc(var(--screen-width) * (14 / 1280));height:auto}.dropdown-icon.open{transform:rotate(180deg)}.dropdown-menu{position:absolute;top:100%;left:0;width:100%;background:#fff;color:#649712;border:calc(var(--screen-width) * (1 / 1280)) solid #c2d2a3;border-top:none;border-radius:0 0 calc(var(--screen-width) * (6 / 1280)) calc(var(--screen-width) * (6 / 1280));z-index:100;display:none}.dropdown.open .dropdown-menu{display:block}.dropdown-item{padding:calc(var(--screen-height) * .015);cursor:pointer}.dropdown-item:hover{background:#ebefe4;color:#000}.help-table{width:100%;height:100%;border-collapse:collapse;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .012);min-width:0;background:#fff}.help-table thead{background:#649712;color:#fff;position:sticky;top:0;z-index:10}.help-table th{padding:calc(var(--screen-height) * .012) calc(var(--screen-width) * .012);text-align:left;font-size:calc(var(--screen-width) * .015);font-weight:500;border-bottom:none}.help-table td{padding:calc(var(--screen-height) * .01) calc(var(--screen-width) * .012);vertical-align:top}.help-table td.score-cell{vertical-align:middle}.help-table th,.help-table td{border-right:calc(var(--screen-width) * (3 / 1280)) solid #c2d2a3}.help-table th:last-child,.help-table td:last-child{border-right:none}.help-table th:nth-child(2){border-right:none}.help-table tbody tr:hover{background-color:#f8f9fa}.help-table tbody tr{border-bottom:calc(var(--screen-width) * (3 / 1280)) solid #c2d2a3}.help-table tbody tr:last-child{border-bottom:none}.help-table tbody tr:nth-child(1) .score-cell{background-color:#84adab}.help-table tbody tr:nth-child(2) .score-cell{background-color:#848bad}.help-table tbody tr:nth-child(3) .score-cell{background-color:#d0a972}.no-data{text-align:center;color:#666;font-style:italic;padding:calc(var(--screen-height) * .03)!important}.score-cell{width:calc(var(--screen-width) * (120 / 1280));font-weight:600;font-size:calc(var(--screen-width) * (20 / 1280));text-align:center}.criteria-cell,.examples-cell{vertical-align:top;padding:calc(var(--screen-height) * (20 / 832))}.level-title{font-weight:600;font-size:calc(var(--screen-width) * (20 / 1280));margin-bottom:calc(var(--screen-height) * (10 / 832))}.criteria-cell ul,.examples-cell ul{margin:0;padding-left:calc(var(--screen-width) * (35 / 1280))}.teacher-dashboard{width:var(--screen-width);height:var(--screen-height);position:relative;overflow:hidden}.mitos-logo{position:absolute;display:flex;top:calc(var(--screen-height) * .04);left:calc(var(--screen-width) * .02);z-index:10}.logo-image{height:calc(var(--screen-height) * .05);width:auto}.page-placeholder{position:absolute;left:calc(var(--screen-width) * .18);top:calc(var(--screen-height) * .12);right:0;bottom:0;background:#fff;display:flex;align-items:center;justify-content:center;font-family:Fredoka,sans-serif;font-size:calc(var(--screen-width) * .025);color:#666}.loading-container{position:absolute;left:calc(var(--screen-width) * .18);top:calc(var(--screen-height) * .12);right:0;bottom:0;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:Fredoka,sans-serif}.loading-spinner{position:relative;width:80px;height:80px;margin-bottom:20px}.spinner-ring{position:absolute;width:100%;height:100%;border:4px solid transparent;border-top:4px solid #4A90E2;border-radius:50%;animation:spin 1.2s linear infinite}.spinner-ring:nth-child(1){animation-delay:0s}.spinner-ring:nth-child(2){width:60px;height:60px;top:10px;left:10px;border-top-color:#7ed321;animation-delay:.2s}.spinner-ring:nth-child(3){width:40px;height:40px;top:20px;left:20px;border-top-color:#f5a623;animation-delay:.4s}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-text{font-size:calc(var(--screen-width) * .018);color:#333;font-weight:500;text-align:center;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.7}50%{opacity:1}}@media(max-width:768px){.loading-spinner{width:60px;height:60px}.spinner-ring:nth-child(2){width:45px;height:45px;top:7.5px;left:7.5px}.spinner-ring:nth-child(3){width:30px;height:30px;top:15px;left:15px}.loading-text{font-size:calc(var(--screen-width) * .025)}}@media(max-width:480px){.loading-spinner{width:50px;height:50px}.spinner-ring:nth-child(2){width:37.5px;height:37.5px;top:6.25px;left:6.25px}.spinner-ring:nth-child(3){width:25px;height:25px;top:12.5px;left:12.5px}.loading-text{font-size:calc(var(--screen-width) * .03)}}
