*{font-family:sans-serif,cursive}h2{margin-top:0}input{padding:5px;margin:10px 0;width:90%;border:1px solid #ccc;border-radius:4px}button{position:relative;padding:10px 20px;margin:10px 5px;font-size:16px;color:#fff;background-color:#007bff;border:none;border-radius:50px;cursor:pointer;box-shadow:0 4px 6px #0000001a;transition:background-color .3s ease,transform .3s ease}button:hover{background-color:#0056b3;transform:scale(1.1)}button:active{background-color:#003d80;transform:scale(.95)}.centered-textbox{width:50%;display:flex;align-items:center;justify-content:center;padding:10px;margin:10px auto;border:1px solid #ccc;border-radius:5px;font-size:16px}select{width:100%;max-width:300px;padding:10px;font-size:16px;margin:10px auto;border:1px solid #ccc;border-radius:4px;background-color:#fff!important;color:#000!important;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none}select:after{content:"▼";position:absolute;right:10px;pointer-events:none}@media (max-width: 480px){select{font-size:14px;padding:5px}.dialog-box-content{width:95%;padding:10px}.error-message{font-size:12px;text-align:center}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn 1s ease-out}.dialog-box-container{display:flex;align-items:center;justify-content:center;height:50vh}.dialog-box-content{padding:10px;border-radius:10px;background:linear-gradient(270deg,#b768f8,#b768f8);text-align:center;width:90%;max-width:400px;box-shadow:0 4px 8px #0003}.error-message{color:red;font-size:14px;margin:5px 0;text-align:left;word-wrap:break-word}.error-container{display:flex;flex-direction:column;align-items:center}.language-container{display:flex;align-items:center;gap:10px;margin:10px 0}.slider-container{display:flex;align-items:center;gap:10px;margin-bottom:1rem;width:100%}.slider-label{font-size:.9rem;color:#333;white-space:nowrap}#age-slider{flex:1}.slider-value{margin-left:10px;font-size:.9rem;color:#555;white-space:nowrap}.spinner.small{display:inline-block;width:20px;height:20px;border:3px solid #f3f3f3;border-top:3px solid #3498db;border-radius:50%;animation:spin .8s linear infinite}.swal-custom-popup{width:90%;font-size:14px}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}body{font-family:sans-serif;color-scheme:light dark;background:linear-gradient(90deg,#a848f7,#a848f7);margin:0;display:flex;flex-direction:column;padding:0;min-width:320px;height:100%;overflow-x:hidden}.container{display:flex;flex-direction:column;height:100%;overflow-y:visible}.btn-container{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:sans-serif;background-color:#9550e3;color:#fff;cursor:pointer;transition:background-color .25s,border-color .25s}button:hover{background-color:#4a90e2;border-color:#f8e71c}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}button.selected{background-color:#f66bbf}.header{text-align:center;width:100%;position:center;top:-10;left:0;z-index:999}.translation-text{font-family:sans-serif;color:#fff}.logout-button{background-color:#f66bbf;color:#fff;border:none;padding:10px 20px;font-size:14px;cursor:pointer;border-radius:4px;margin-top:10px}.logout-button:hover{background-color:#d62828}@media (max-width: 768px){#root{padding:1rem}button{padding:.5em 1em;font-size:.9em}.btn-container{flex-direction:column;align-items:center;gap:15px}}@media (max-width: 480px){button{font-size:.8em;padding:.4em .8em}.btn-container{gap:10px}.logout-button{padding:8px 16px;font-size:12px}}.spinner{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);border:8px solid #f3f3f3;border-radius:50%;border-top:8px solid #4A90E2;width:50px;height:50px;animation:spin 1s linear infinite;z-index:2000}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.swal2-popup{font-family:sans-serif;background:linear-gradient(90deg,#a848f7,#a848f7);color:#fff;border-radius:12px;box-shadow:0 4px 8px #0000004d;padding:20px}.swal2-title{font-size:1.5em;font-weight:700;color:#fff}.swal2-content{font-size:1.2em;color:#f8f8f8}.swal2-actions{display:flex;justify-content:space-evenly;padding-top:10px}.swal2-button{background-color:#9550e3;color:#fff;border:none;padding:10px 20px;font-size:1em;font-weight:500;border-radius:8px;cursor:pointer;transition:background-color .3s ease}.swal2-button:hover{background-color:#4a90e2}.swal2-button:focus{outline:none}.swal2-cancel{background-color:#d62828}.swal2-cancel:hover{background-color:#b02a2a}.cards-container{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;padding:20px;background-color:#f5f5f5}.card{width:200px;height:200px;cursor:pointer;overflow:hidden;border-radius:8px;box-shadow:0 4px 6px #0000001a;transition:transform .3s,box-shadow .3s}.card img{width:100%;height:100%;object-fit:cover;object-fit:contain;background-color:#fff}.card.clicked{border:4px solid #007bff;box-shadow:0 6px 10px #0003;transition:border .3s,box-shadow .3s}.card:hover{transform:scale(1.05);box-shadow:0 6px 10px #00000026}.continue-button{margin-top:20px;padding:10px 20px;font-size:16px;color:#fff;background-color:#007bff;border:none;border-radius:5px;cursor:pointer;opacity:1;transition:opacity .3s ease}.continue-button:disabled{background-color:#6c757d;cursor:not-allowed;opacity:.6}.select-avatar-heading{text-align:center;font-size:1.5rem;font-weight:700;margin-bottom:20px;color:#333}.iframe-container{width:100%;height:100%;position:fixed;top:0;left:0;background-color:#000;z-index:1000}.iframe-container iframe{width:100%;height:100%;border:none}.send-message-button{position:fixed;bottom:20px;right:20px;padding:10px 20px;font-size:16px;color:#fff;background-color:#007bff;border:none;border-radius:50px;cursor:pointer;z-index:9999;box-shadow:0 4px 6px #0000001a;transition:background-color .3s ease,transform .3s ease}.send-message-button:hover{background-color:#0056b3;transform:scale(1.1)}.send-message-button:active{background-color:#003d80;transform:scale(.95)}.qr-code-container{position:fixed;bottom:20px;right:20px;padding:10px 20px;z-index:9999}.language-dropdown{position:absolute;top:0;right:200px}.dropdown-toggle{background:none;border:none;cursor:pointer;display:flex;align-items:center}.dropdown-toggle:hover{opacity:.8}.dropdown-menu{display:none;position:absolute;top:40px;right:0;background:#fff;border:1px solid #ccc;border-radius:5px;box-shadow:0 4px 6px #0000001a;z-index:1000;opacity:0;transform:translateY(-10px);transition:opacity .2s ease,transform .2s ease}.dropdown-menu .dropdown-item{display:flex;align-items:center;padding:8px 12px;background:none;border:none;width:100%;text-align:left;cursor:pointer}.dropdown-menu .dropdown-item:hover{background-color:#f0f0f0}.dropdown-menu .dropdown-item.selected{font-weight:700}.language-dropdown:hover .dropdown-menu{display:block;opacity:1;transform:translateY(0)}.dropdown-item:focus{outline:none;background-color:#e0e0e0}.menu-container{position:relative;z-index:2000}.menu-icon{background:none;border:none;font-size:2rem;color:#fff;cursor:pointer;position:fixed;top:20px;right:20px;z-index:2100}.menu-content{position:fixed;top:0;right:-100%;width:70%;height:100%;background:linear-gradient(90deg,#a848f7,#9550e3);color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:2rem;transition:right .3s ease-in-out;z-index:2050}.menu-content.open{right:0}.menu-content ul{list-style:none;padding:0;margin:0;flex-grow:1}.menu-content ul li{margin:1rem 0}.menu-content ul li a{color:#fff;text-decoration:none;font-size:1.5rem}.menu-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s ease-in-out;z-index:2040}.menu-overlay.visible{opacity:1;visibility:visible}.menu-close{background:none;border:none;font-size:2rem;color:#fff;cursor:pointer;align-self:flex-end;margin-bottom:1.5rem;padding:0}.menu-close:hover{color:gold}.menu-resize{background:none;border:none;font-size:2rem;color:#fff;cursor:pointer;position:absolute;top:20px;right:60px;z-index:2100}.menu-resize:hover{color:gold}.popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:2200}.popup-content{background:#fff;color:#000;padding:2rem;border-radius:10px;text-align:center;box-shadow:0 4px 8px #0003;animation:popup-slide-in .3s ease}.popup-buttons{margin-top:1rem;display:flex;justify-content:space-evenly}.ok-button,.cancel-button{padding:.5rem 1rem;border:none;border-radius:5px;cursor:pointer;font-size:1rem}.ok-button{background-color:#4caf50;color:#fff}.cancel-button{background-color:#f44336;color:#fff}.ok-button:hover{background-color:#45a049}.cancel-button:hover{background-color:#e53935}@keyframes popup-slide-in{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.iframe-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000c;z-index:1000;display:flex;justify-content:center;align-items:center}.camera-close-button{position:absolute;top:10px;right:10px;background:red;color:#fff;border:none;border-radius:50%;font-size:24px;width:40px;height:40px;cursor:pointer;z-index:9999}@media (max-width: 1000px){.menu-icon{font-size:1rem;top:10px}}.iframe-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:flex;justify-content:center;align-items:center;z-index:1000}.fullscreen-iframe{width:100%;height:100%;border:none}.fullscreen-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000;display:flex;justify-content:center;align-items:center;z-index:3000}img{transition:border .2s ease,transform .2s ease}img:focus{transform:scale(1.1)}