body{margin:0;padding:0;font-family:Mansalva,cursive;background-color:#2f1b0c;color:#d4af37;overflow-x:hidden}.fullscreen{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center;background-color:#2f1b0c;transition:background-color .6s ease-in-out}.fullscreen.ready{background-color:#2f1b0c}.loading-info{color:#d4af37;font-size:1.4rem;text-align:center;margin-top:10px;opacity:0;animation:fadeIn 1s ease 1s forwards,pulseText 2s infinite ease-in-out;font-family:Mansalva,cursive;display:inline-block}.loader-container{display:flex;flex-direction:column;align-items:center;cursor:pointer}.fox-loader{width:160px;height:160px;animation:pulse 1.5s infinite ease-in-out;filter:drop-shadow(0 0 10px #d4af37)}.animated-btn{margin-top:5px;padding:5px;background:none;border:2px solid #8b4513;border-radius:10px;color:#d4af37;font-size:2rem;cursor:pointer;transition:transform .2s ease,color .3s ease;font-family:Mansalva,cursive}.animated-btn:hover{transform:scale(2.2);color:gold}.play-icon{color:#d4af37;transition:color .3s}.animated-btn:hover .play-icon{color:gold}.intro-text{color:#d4af37;font-size:1.2rem;text-align:center;margin-top:30px;opacity:0;font-family:Mansalva,cursive;animation:fadeIn 2s ease 1.5s forwards}.cursor{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;border-radius:100%;transform:translate(-50%,-50%);transition:all .2s ease-in-out;transition-property:width,height,border;will-change:width,height,transform,border;pointer-events:none;z-index:3000}.pointer{width:25px;height:25px;background:rgb(164,164,164);border:2px solid rgb(164,164,164)}svg{height:3rem;width:3rem}.pointer>svg,.hover>svg{display:none}button.active>svg{stroke:#a4a4a4}svg{height:1.5rem;width:1.5rem;stroke:#787878}.container{max-width:1200px;margin:0 auto;padding:.5rem;width:100%}header{position:fixed;top:20px;left:50%;transform:translate(-50%);width:90%;max-width:1200px;padding:1rem;z-index:2000;background:rgba(43,26,11,.8);border-radius:15px;border:2px solid #8b5e3c;box-shadow:0 4px 8px #000000b3;display:flex;justify-content:space-between;align-items:center}nav{display:flex;width:100%}nav>ul{display:flex;gap:0rem;list-style:none;margin:0;padding:0;width:100%}nav>ul>li{flex:1;display:flex;justify-content:center;align-items:center}nav>ul>li>button,nav>ul>li>a{font-family:Mansalva,cursive;font-size:1.1rem;text-transform:capitalize;color:#d4af37;background:none;border:2px solid #8b4513;padding:.5rem 1rem;border-radius:8px;cursor:pointer;width:100%;box-sizing:border-box;text-align:center}nav>ul>li>button:hover,nav>ul>li>a:hover{background-color:#8b4513;color:gold}.mobile-nav ul{display:flex;justify-content:space-between}.mobile-nav li{flex:1}.mobile-nav-overlay{position:fixed;top:20px;left:50%;transform:translate(-50%);width:90%;max-width:1200px;padding:.8rem;z-index:1000;background:rgba(43,26,11,.8);border-radius:15px;border:2px solid #8b5e3c;box-shadow:0 4px 8px #000000b3;display:flex;justify-content:space-between;align-items:center}.mobile-nav button{font-family:Mansalva,cursive;font-size:1.1rem;color:#d4af37;border:2px solid #8b4513;padding:0rem .2rem;border-radius:8px;cursor:pointer;width:100%;box-sizing:border-box;text-align:center}.mobile-nav button:hover{background-color:#8b4513;color:gold}.sound_control{font-family:Mansalva,cursive;font-size:1.1rem;text-transform:capitalize;color:#d4af37;background:none;border:2px solid #8b4513;padding:.5rem 1rem;border-radius:8px;cursor:pointer;width:100%;box-sizing:border-box;text-align:center}.sound_control svg{width:1.5rem;height:1.5rem;color:#d4af37}.sound_control:hover{background-color:#8b4513;color:gold}.sound_control.no-sound{opacity:.5}.mobile-nav a{font-family:Mansalva,cursive;font-size:1.1rem;color:#d4af37;background:none;border:2px solid #8b4513;padding:.5rem;border-radius:8px;cursor:pointer;transition:all .3s ease}.mobile-nav a:hover{background-color:#8b4513;color:gold}.mobile-nav svg{height:1.5rem;width:1.5rem;stroke:#787878}.mobile-nav .active>svg{stroke:#a4a4a4}button,a{font-family:Mansalva,cursive;font-size:1.1rem;text-transform:capitalize;color:#d4af37;background:#8b4513;border:2px solid #8b4513;padding:.5rem;border-radius:8px;cursor:pointer;transition:all .3s ease}button:hover,a:hover{background-color:#702b00;color:gold}.text-content{background-color:#2b1a0be6;color:#d4af37;padding:.5rem;border-radius:15px;box-shadow:0 8px 16px #000c;font-family:Mansalva,cursive;font-size:.5rem;max-width:800px;margin:.5rem auto;text-align:center;line-height:1}.timed-text-container{display:flex;flex-direction:column;align-items:center;gap:5px}.highlighted-text{display:flex;flex-direction:column;align-items:center;font-family:MedievalSharp,serif}.text-lang1,.text-lang2{text-align:center;margin-bottom:0}.separator{font-size:1rem;color:#d4af37;text-shadow:2px 2px 6px rgba(0,0,0,.9);margin:10px 0}.audio-button{padding:5px 10px;font-size:1.2rem;font-weight:700;color:#d4af37;background-color:transparent;border:2px solid #8b4513;border-radius:8px;cursor:pointer;transition:transform .2s ease,background-color .3s ease}.audio-button.playing{background-color:#d4af37;color:#2f1b0c}.audio-button:hover{transform:scale(1.1)}.highlighted-text{display:flex;flex-direction:column;align-items:center;font-family:MedievalSharp,serif;margin-top:5px}.default-word{color:#fff;font-size:1rem;transition:color .3s ease-in-out}.highlighted-word{color:#d4af37;font-size:1srem;text-shadow:2px 2px 6px rgba(0,0,0,.9),0 0 10px #d4af37}.section-container{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:#fff0;box-sizing:border-box;pointer-events:none}.react-mic .wavebox{display:none!important}.hidden{display:none!important;visibility:hidden;width:0;height:0;overflow:hidden}.section-overlay{position:fixed;bottom:10px;left:30;transform:translate(-50%);width:80%;max-width:1200px;padding:1.5rem;background-color:#2b1a0be6;border-radius:15px;border:2px solid #8b4513;box-shadow:0 8px 16px #000000b3;text-align:center;z-index:1000;pointer-events:auto}.play-btn{padding:5px;background:none;border:2px solid #8b4513;border-radius:10px;color:#d4af37;font-size:1rem;cursor:pointer;font-family:Mansalva,cursive;transition:transform .3s ease,color .4s ease;pointer-events:auto;z-index:1010}.intro-text{color:#d4af37;font-size:1.2rem;text-align:center;margin-top:30px;opacity:0;font-family:Mansalva,cursive;animation:fadeIn 2s ease 1.5s forwards;line-height:1.6;transition:color .3s ease}.centered{display:flex;justify-content:center;align-items:center;text-align:center;flex-direction:column}.form-wrapper{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:1rem;box-sizing:border-box}.register-login-content{background-color:#2b1a0bf2;padding:2rem;border-radius:15px;box-shadow:0 12px 24px #000c;max-width:1000px;width:90%;display:flex;justify-content:space-around;gap:2rem;text-align:center}.form-container{width:45%;background:rgba(0,0,0,.2);padding:1.5rem;border-radius:10px;box-shadow:inset 0 4px 8px #00000080}.register-login-content{background-color:#2b1a0bf2;padding:2rem;border-radius:15px;box-shadow:0 12px 24px #000c;max-width:1000px;width:90%;margin:0 auto;display:flex;justify-content:space-around;gap:2rem;box-sizing:border-box;text-align:center}.register-login-content h2{font-size:2rem;font-weight:700;color:gold;margin-bottom:1.5rem;text-shadow:1px 1px 4px rgba(0,0,0,.6);font-family:Mansalva,cursive}.register-form input,.login-form input{width:100%;padding:.75rem;margin-bottom:15px;border-radius:8px;border:1px solid #8b5e3c;font-size:1rem;color:#d4af37;background-color:#2f1b0c;box-shadow:0 2px 4px #00000080;transition:all .3s ease}.register-form input:focus,.login-form input:focus{outline:none;border-color:gold;background-color:#3a2a18;color:gold;box-shadow:0 0 10px #ffd700b3}.register-btn,.login-btn{padding:10px 15px;font-size:1.1rem;font-weight:700;color:#2f1b0c;background-color:#d4af37;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s ease,box-shadow .3s ease;width:100%;font-family:Mansalva,cursive}.register-btn:hover,.login-btn:hover{background-color:gold;color:#2f1b0c;box-shadow:0 4px 8px #00000080}.register-form input::placeholder,.login-form input::placeholder{color:#8b5e3c;font-style:italic}.ui-overlay .carousel-wrapper img{width:120px;height:auto;border-radius:12px;border:3px solid #8b4513;box-shadow:0 8px 12px #00000080,0 0 15px #8b451380;transition:transform .3s ease,box-shadow .3s ease;filter:sepia(20%) hue-rotate(-10deg) saturate(70%)}.ui-overlay .carousel-wrapper img:hover{transform:scale(1.05);box-shadow:0 10px 15px #000000b3,0 0 20px #8b451399;filter:sepia(30%) hue-rotate(-20deg) saturate(80%)}.progress-bar{width:80%;height:20px;background-color:#3e2723;border:2px solid #8b4513;border-radius:10px;overflow:hidden;margin-top:20px;box-shadow:0 0 10px #00000080;position:relative}.progress-bar-inner{height:100%;background-color:#d4af37;width:0;transition:width .3s ease;display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 0 8px #ffdf00cc}.progress-text{color:#2f1b0c;font-family:Mansalva,cursive;font-size:.9rem;font-weight:700;position:absolute;right:10px;z-index:1}.loading-info{font-size:1.2rem;color:#d4af37;font-family:Mansalva,cursive;margin-top:10px}.section-text h1{color:gold;font-family:Mansalva,cursive;margin-bottom:0rem;text-shadow:2px 2px 4px rgba(0,0,0,.7)}.section-text p{color:#f0e6d2;font-family:Mansalva,cursive;font-size:1.2rem;line-height:1;text-shadow:1px 1px 4px rgba(0,0,0,.6)}.section-btns{display:flex;flex-direction:column;row-gap:1rem;align-items:center}.section-btn{display:flex;column-gap:1rem;align-items:center;font-family:Mansalva,cursive;font-size:1rem;font-weight:700;color:gold;background-color:#8b4513;padding:.5rem;border-radius:10px;border:2px solid #d4af37;cursor:pointer;transition:background-color .3s ease,transform .3s ease}.section-btn:hover{background-color:#d4af37;color:#2f1b0c}a{color:#d4af37;font-weight:600;text-decoration:none;font-size:1.2rem;text-shadow:1px 1px 3px rgba(0,0,0,.5)}a:hover{color:gold}.form-wrapper{display:flex;justify-content:center;align-items:center;min-height:1rem;width:100%;padding:1%;box-sizing:border-box}.register-login-content{background-color:#2b1a0bf2;padding:1rem;border-radius:15px;box-shadow:0 12px 24px #000c;max-width:1200px;width:100%;display:flex;justify-content:space-between;gap:2rem;box-sizing:border-box}.form-container{width:48%}.register-login-content h2{font-size:1.8rem;font-weight:700;color:gold;margin-bottom:20px;text-shadow:1px 1px 4px rgba(0,0,0,.6)}.register-form input,.login-form input{padding:10px;margin-bottom:15px;border-radius:8px;border:1px solid #8b5e3c;font-size:1rem;color:#d4af37;background-color:#2f1b0c}.register-btn,.login-btn{padding:10px 15px;font-size:1rem;color:#fff;background-color:#8b4513;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s ease,box-shadow .3s ease}.register-btn:hover,.login-btn:hover{background-color:#d4af37;color:#2f1b0c}.control{position:absolute;top:100%;right:0;padding:1rem 0;font-family:Inter;font-weight:400;line-height:1em;letter-spacing:-.01em;font-size:12px;transform:translateY(3rem);transform-origin:100% 50%}input[type=range]{display:block;-webkit-appearance:none;-moz-appearance:none;background:rgb(164,164,164);border-radius:5px;width:100%;height:2px;outline:0}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;img {height: 4.75rem; width: 4.75rem; border-radius: 50%; object-fit: cover; border: 2px solid #8b4513; box-shadow: 0 0 8px rgba(0,0,0,.6); transition: transform .3s ease;} img:hover {transform: scale(1.1);} .member-details {display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; font-family: "Mansalva",cursive;} p {font-size: 1rem; font-weight: 500; color: #d4af37; text-shadow: 1px 1px 3px rgba(0,0,0,.8); font-family: "Mansalva",cursive;} a > svg,button > svg {width: 1.5rem; height: 1.5rem; color: #d4af37; transition: color .3s ease,transform .3s ease;} a > svg:hover,button > svg:hover {color: #ffd700; transform: scale(1.2);}}.sound-control-container{position:relative;display:inline-block}.volume-slider-container{position:absolute;top:calc(100% + 5px);left:50%;transform:translate(-50%);width:120px;background-color:#000000b3;padding:5px;border-radius:8px;box-shadow:0 0 5px #00000080;z-index:1000}.volume-slider{width:100%;cursor:pointer;background:#ffd700}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:15px;height:15px;background:#ffd700;border-radius:50%;cursor:pointer}.volume-slider::-moz-range-thumb{width:15px;height:15px;background:#ffd700;border-radius:50%;cursor:pointer}@media only screen and (min-width: 1200px){.sound_control{font-size:1.2rem;padding:1.3rem 1rem}}@media only screen and (max-width: 768px){.header,.cursor{display:none}.section-overlay{position:relative;left:30;max-height:60%;top:1rem}}@media only screen and (min-width: 768px){.mobile-nav-overlay{display:none}}.fullscreen{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#2f1b0c;transition:background-color .6s ease-in-out;overflow:hidden}.fullscreen.ready{background-color:#3a2511}.loading-info{color:#d4af37;font-size:1.2rem;text-align:center;margin-top:15px;opacity:0;animation:fadeIn 1s ease-in-out 1s forwards,pulseText 2s infinite ease-in-out;font-family:Mansalva,cursive;transition:color .3s}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes pulseText{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.loader-container{display:flex;flex-direction:column;align-items:center;gap:20px;cursor:pointer}.frog-loader{width:140px;height:140px;animation:pulse 1.5s infinite ease-in-out;filter:drop-shadow(0 0 10px #d4af37);transition:filter .3s ease}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.play-btn{padding:15px;border:none;background:none;cursor:pointer;color:#d4af37;font-size:3rem;transition:transform .3s ease,color .4s ease;display:flex;justify-content:center;align-items:center}.play-btn:hover{transform:scale(1.1);color:gold}.play-icon{color:inherit;transition:color .3s}.intro-text{color:#d4af37;font-size:1.1rem;text-align:center;margin-top:20px;opacity:0;font-family:Mansalva,cursive;animation:fadeIn 2s ease 1.5s forwards;max-width:600px;line-height:1.6;transition:color .3s ease}@media (max-width: 768px){.play-btn{font-size:2.5rem}.loading-info,.intro-text{font-size:1rem}.frog-loader{width:120px;height:120px}}@media (max-width: 480px){.play-btn{font-size:2rem}.loading-info,.intro-text{font-size:.9rem}.frog-loader{width:100px;height:100px}}