:root{font-family:Poppins;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button,input,select{outline:none}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.login-page{width:100vw;min-height:100vh;display:flex;align-items:center;justify-content:center;background-color:#617483}.login-component{width:65vw;min-height:80vh;background-color:#ebf0f3;display:flex;flex-direction:row;align-items:center}.left-section-login,.right-section-login{width:50%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden}.left-section-login img{width:250px;height:250px}.left-section-login p{font-size:32px;color:#617483}.section-content{width:80%}.form-group{width:100%;display:flex;flex-direction:column}.form-group .title{font-size:24px;font-weight:700;align-self:center;color:#617483}.form-group label{font-size:16px;color:#617483;margin-top:10px}.form-group input{height:35px;font-size:16px;font-family:Poppins;background-color:#617483;border:transparent;padding-left:5px}.form-group button{height:50px;width:50%;align-self:center;background-color:#617483;margin-top:15px;border:transparent}.form-group button:hover{background-color:#27a2db}.form-group .link{color:#27a2db;cursor:pointer;align-self:center;font-size:14px}.form-group .link:hover{text-decoration:underline}.right-section-home.with-left-open{width:65%}@media (max-width: 912px){.login-page{height:auto;overflow-y:visible}.login-component{flex-direction:column;width:90vw;height:auto}.left-section-login,.right-section-login{width:100%;padding:20px 0}.left-section-login img{width:150px;height:150px}.left-section-login p{font-size:24px;text-align:center}.form-group button{width:80%}.right-section-home.with-left-open{width:100%}}.home-page{width:100vw;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.top-content{width:100vw;height:10vh;background-color:#1ba1e2;display:flex;flex-direction:row;align-items:center;justify-content:space-between}.top-content .logo-section,.top-content .profile-section{height:100%;display:flex;flex-direction:row;align-items:center;padding:1%;width:25%}.top-content .profile-section{width:max-content}.top-content .logo-section p{font-size:18px;font-weight:700;margin-left:5%}.top-content .profile-section p{font-size:16px;font-weight:500;cursor:pointer}.top-content .profile-section p:hover{text-decoration:underline}.top-content .logo-section img{width:50px}.page-content{width:100vw;height:90vh;background-color:#617483;display:flex;flex-direction:row;justify-content:center;align-items:center}.section-organizer{width:95vw;height:90%;display:flex;flex-direction:row;justify-content:space-around}.left-section-home,.right-section-home{width:85%;height:100%;display:flex;flex-direction:column;align-items:center}.left-section-home{width:30%;height:100%;background-color:#617483;display:flex;flex-direction:column;overflow:hidden;position:relative}.left-section-home a{font-size:20px;color:#fff;cursor:pointer}.left-section-home .content-scroll{overflow-y:auto;flex:1;padding:10px;width:95%}.left-section-home .word{min-height:120px;background-color:#e6d0de;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:10px 0}.left-section-home .word p{font-size:24px;font-weight:500;padding:0;margin:0;word-break:break-word;width:90%;text-align:center}.left-section-home .word p:nth-child(2){font-weight:400;font-size:18px}.left-section-home h2{margin:20px 0 10px}.left-section-home .meanings{margin:0 0 10px}.left-section-home .meanings p{font-size:15px;color:#fff;word-break:break-word}.left-section-home .meanings h3{font-size:16px;font-weight:600;color:#fff;padding:0;margin:0;word-break:break-all;width:75%}.loading,.error-phrase{font-size:24px;color:#fff}.top-word-container-options{display:flex;align-items:center;justify-content:space-between;margin-bottom:3%}.top-word-container-options button{width:max-content;height:50px;border:transparent}.profile-modal{position:fixed;top:0;right:0;width:300px;height:100vh;background-color:#1ba1e2;border-left:transparent;box-shadow:-5px 0 8px #0000001a;padding:20px;z-index:999;display:flex;flex-direction:column;animation:slideIn .3s ease-out}@keyframes slideIn{0%{right:-300px;opacity:0}to{right:0;opacity:1}}.profile-card{display:flex;flex-direction:column;gap:15px}.close-btn{align-self:flex-end;background:transparent;border:none;font-size:18px;cursor:pointer}.logout-btn{background-color:#617483;color:#fff;border:none;padding:10px;cursor:pointer}@media (max-width: 912px){.home-page{min-height:100vh;height:auto;justify-content:unset}.page-content{min-height:100vh;height:auto}.top-content .logo-section,.top-content .profile-section{padding:5%}.top-content .profile-section p{font-size:18px}.section-organizer{flex-direction:column;justify-content:space-around}.left-section-home,.right-section-home{width:100%}.left-section-home{order:2;margin-top:5%}}.audio-player{display:flex;align-items:center;margin-top:12px;width:100%}.progress-wrapper{display:flex;align-items:center;width:100%}.triangle{width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:15px solid #a3ddff;margin-right:8px;cursor:pointer}.progress-bar{width:94%;height:8px;background-color:#ccc;border-radius:4px;overflow:hidden}.progress-fill{height:100%;background-color:#a3ddff;transition:width .2s ease-in-out}.wordlist-container{height:400px;overflow-y:auto;border:1px solid #fff;padding:10px;overflow-x:hidden;width:100%}.scroll-area{height:100%;overflow-y:auto;width:100%}.word-table{width:100%;border-collapse:collapse;text-align:center}.word-table td{border:1px solid #ccc;padding:8px;width:20%}.word-table td span{width:100%;font-size:15px;color:#fff;text-decoration:none;cursor:pointer;display:flex}@media (max-width: 912px){.wordlist-container{width:91%}}.tabs-container,.tabs-content{width:100%}.tabs-header{display:flex;margin-bottom:10px;justify-content:space-between;align-items:center}.tabs-header button{padding:8px 12px;border:none;background:transparent;cursor:pointer;margin-right:4px;font-weight:700}.tabs-header button.active{background-color:#eee}.tabs-header input{width:20%;color:#fff;border:transparent;padding:1%;font-size:16px;height:30px}.tabs-header input::placeholder{color:#fff}@media (max-width: 912px){.tabs-container{margin-top:5%}.tabs-header{display:flex;flex-direction:column;width:100%}.tabs-header input{width:80%;color:#fff;border:transparent;padding:1%;font-size:16px;height:30px;margin-top:5%;margin-bottom:5%}}