:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.blocker-container{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;text-align:center;padding:20px;box-sizing:border-box;overflow:hidden;font-family:Nunito,sans-serif}.blocker-video-bg{position:absolute;top:50%;left:50%;width:100%;height:100%;object-fit:cover;transform:translate(-50%,-50%);filter:brightness(2.8)}.blocker-content{max-width:550px;color:#ecf0f1;display:flex;flex-direction:column;align-items:center;margin-bottom:50px;gap:25px;background:#23283c80;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:20px;border:1px solid rgba(255,255,255,.18);box-shadow:0 8px 32px #0000005e}.desktop-icon-large{margin-top:15px;color:#0af;animation:float-effect 4s ease-in-out infinite,slideInFromTop .8s cubic-bezier(.25,.46,.45,.94) forwards;animation-delay:.2s}.blocker-content h1{font-size:2.5rem;font-weight:900;margin:0;background:linear-gradient(90deg,#e74c3c,#f39c12,#e74c3c);background-size:200% auto;color:#fff;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:gradient-pan 4s linear infinite,slideInFromTop .8s cubic-bezier(.25,.46,.45,.94) forwards;animation-delay:.6s}.blocker-content h2{font-size:1.5rem;font-weight:300;margin-top:0;color:#fff}.blocker-content p{font-size:1.1rem;font-weight:400;color:#bdc3c7;line-height:1.6;padding:0 14px;margin:0}.loading-dots{display:flex;margin-top:25px;margin-bottom:25px}.dot{width:12px;height:12px;background-color:#2ecc71;border-radius:50%;margin:0 5px;animation:bounce 1.4s infinite ease-in-out both}.blocker-container{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;justify-content:center;align-items:flex-start;padding-top:15vh;text-align:center;box-sizing:border-box;overflow:hidden;font-family:Nunito,sans-serif}.blocker-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#0a141ecc;z-index:-1}.blocker-content{width:90%;max-width:550px;color:#ecf0f1;display:flex;flex-direction:column;align-items:center;gap:25px;padding:25px;background:#23283c80;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:20px;border:1px solid rgba(255,255,255,.18);box-shadow:0 8px 32px #0000005e}.blocker-content>*{opacity:0;animation:slideInFromTop .8s cubic-bezier(.25,.46,.45,.94) forwards}.blocker-content .desktop-icon-large{animation-delay:.2s}.blocker-content h2{animation-delay:.4s}.blocker-content h1{animation-delay:.6s}.blocker-content p:nth-of-type(1){animation-delay:.8s}.blocker-content p:nth-of-type(2){animation-delay:1s}.blocker-content .loading-dots{animation-delay:1.2s}@keyframes slideInFromTop{to{opacity:1;transform:translateY(0)}}.desktop-icon-large{width:80px;height:80px;color:#0af;animation:float-effect 4s ease-in-out infinite,slideInFromTop .8s cubic-bezier(.25,.46,.45,.94) forwards;animation-delay:.2s}@keyframes float-effect{0%{transform:translateY(0)}50%{transform:translateY(-20px)}to{transform:translateY(0)}}@keyframes gradient-pan{to{background-position:-200% center}}.blocker-content h2{font-size:1.3rem;font-weight:300;margin:0;color:#fff}.blocker-content p{font-size:1rem;font-weight:400;color:#bdc3c7;line-height:1.6;margin:0}.loading-dots{display:flex;margin:15px 0}.dot{width:12px;height:12px;background-color:#0af;border-radius:50%;margin:0 5px;animation:bounce 1.4s infinite ease-in-out both}.dot:nth-child(1){animation-delay:-.32s}.dot:nth-child(2){animation-delay:-.16s}.dot:nth-child(3){animation-delay:0s}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}@media (max-width: 400px){.blocker-content{gap:15px;padding:20px}.desktop-icon-large{width:60px;height:60px}.blocker-content h1{font-size:1.8rem}.blocker-content h2{font-size:1.1rem}.blocker-content p{font-size:.9rem}}:root{--primary-blue: #3b82f6;--primary-blue-dark: #2563eb;--slate-50: #f8fafc;--slate-200: #e2e8f0;--slate-300: #cbd5e1;--slate-500: #64748b;--slate-600: #475569;--slate-800: #1e293b;--white: #ffffff;--background-dark: #0f172a}.screen-container{min-height:100vh;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center}.background-canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;cursor:none}.container{width:100%;max-width:1152px;margin-left:auto;margin-right:auto;padding-left:1.5rem;padding-right:1.5rem;box-sizing:border-box;position:relative;z-index:1}.header{position:fixed;top:0;left:0;right:0;background-color:#0f172ab3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:50;border-bottom:1px solid rgba(255,255,255,.1)}.navbar{display:flex;justify-content:space-between;align-items:center;height:80px;border-bottom:1px solid var(--primary-blue)}.logo-container{display:flex;align-items:center;gap:.75rem;cursor:pointer}.logo-icon{font-size:2rem;color:var(--primary-blue);transition:transform .3s ease-in-out}.logo-container:hover .logo-icon{transform:rotate(15deg) scale(1.1)}.logo-text{font-size:1.5rem;font-weight:700;color:var(--slate-50);transition:transform .3s ease,text-shadow .3s ease}.logo-container:hover .logo-text{transform:scale(1.05);text-shadow:0 0 10px var(--primary-blue)}.nav-links-desktop{display:none;align-items:center;gap:2rem}.nav-link{color:var(--slate-300);font-weight:500;text-decoration:none;position:relative;transition:color .3s ease,transform .3s ease,text-shadow .3s ease}.nav-link:after{content:"";position:absolute;width:0;height:2px;bottom:-4px;left:50%;background-color:var(--primary-blue);transition:all .3s ease-in-out}.nav-link:hover{color:var(--white);transform:translateY(-2px) scale(1.05);text-shadow:0 0 8px rgba(255,255,255,.5)}.nav-link:hover:after{width:100%;left:0}.mobile-menu-button button{background:none;border:none;cursor:pointer;color:var(--slate-50);padding:.5rem}.menu-icon{width:1.5rem;height:1.5rem}.text-content{margin-top:30px}.text-content h1{font-size:2.25rem;font-weight:900;color:var(--slate-50);margin:0}.text-content p{font-size:1rem;line-height:1.6;color:var(--slate-300);margin:0 0 2rem;max-width:28rem}.image-content img{width:100%;max-width:24rem;height:auto;border-radius:1rem;box-shadow:0 10px 25px -5px #0003;margin-bottom:2rem}.mobile-layout{margin-top:30vw;display:flex;flex-direction:column;align-items:center;text-align:center}.mobile-layout .image-content img{animation:float-bob 4s ease-in-out infinite}.desktop-layout{display:none}.btn{border:none;font-weight:600;border-radius:.5rem;cursor:pointer;transition:all .3s ease;padding:.75rem 1.5rem;font-size:1rem}.btn-large{padding:1rem 2rem;width:100%}.btn-primary{background-color:var(--primary-blue);color:var(--white);box-shadow:0 4px 14px #3b82f663}.btn-primary:hover{background-color:var(--primary-blue-dark);transform:translateY(-3px) scale(1.05);box-shadow:0 8px 25px #3b82f680}.btn-secondary{background-color:#ffffff1a;color:var(--white);border:1px solid rgba(255,255,255,.2)}.btn-secondary:hover{background-color:#fff3;border-color:#fff6;transform:translateY(-3px) scale(1.05)}.button-group{display:flex;gap:1rem;margin-top:2rem}.button-group-mobile{width:100%;max-width:30rem;display:flex;flex-direction:column;align-items:center;gap:1rem}.button-group-mobile .btn{width:90%}@media (min-width: 768px){.main-content{padding-top:0}.nav-links-desktop{display:flex}.mobile-menu-button,.mobile-layout{display:none}.desktop-layout{margin-top:11vw;display:flex;align-items:center;justify-content:center;gap:4rem;animation:float-bob 4s ease-in-out infinite}.text-content{width:90%;text-align:left}.text-content h1{font-size:3.75rem;line-height:1.1}.text-content p{font-size:1.125rem;max-width:none}.image-content{width:100%}.image-content img{max-width:100%;margin-bottom:0}.btn-large{width:auto}}a.btn{text-decoration:none}:root{--primary-blue: #3b82f6;--primary-blue-dark: #2563eb;--slate-50: #f8fafc;--slate-300: #cbd5e1;--white: #ffffff;--background-dark: #0f172a}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin:0;background-color:var(--background-dark);color:var(--slate-50);overflow-x:hidden}.screen-container{min-height:100vh;width:100%;display:grid;grid-template-rows:auto 1fr}.main-content{display:grid;place-items:center;padding:1.5rem;box-sizing:border-box}.content-wrapper{display:grid;grid-template-columns:1fr;gap:2rem;align-items:center;width:100%;max-width:1152px;text-align:center}.header{background-color:#0f172ab3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:50;border-bottom:1px solid rgba(255,255,255,.1)}.navbar{display:flex;justify-content:space-between;align-items:center;height:80px;max-width:1152px;margin:0 auto;padding:0 1.5rem;box-sizing:border-box}.text-content h1{font-size:2.25rem;font-weight:900;margin:0 0 1rem}.text-content h1 span{color:var(--primary-blue)}.text-content p{font-size:1rem;line-height:1.6;color:var(--slate-300);margin:0 0 2rem;max-width:28rem;margin-left:auto;margin-right:auto}.image-content img{width:92%;max-width:24rem;height:auto;border-radius:1rem;box-shadow:0 10px 25px -5px #0003;margin:0 auto}.button-group{display:flex;flex-direction:column;align-items:center;gap:1rem}@media (min-width: 768px){.content-wrapper{grid-template-columns:1fr 1fr;text-align:left;gap:4rem}.text-content p{margin-left:0;margin-right:0}.text-content h1{font-size:3.75rem}.image-content img{max-width:100%}.button-group{flex-direction:row;justify-content:flex-start}.image-content{grid-column:2;grid-row:1}.text-content{grid-column:1;grid-row:1}}.nav-links-desktop{display:none}@media (min-width: 768px){.nav-links-desktop{display:flex;align-items:center;gap:2rem}}.mobile-menu-button{display:block}@media (min-width:768px){.mobile-menu-button{display:none}}.mobile-menu{position:fixed;top:80px;left:0;right:0;background-color:var(--background-dark);z-index:40;box-shadow:0 4px 6px -1px #0000001a;display:flex;flex-direction:column;align-items:center;gap:1.5rem;padding:2rem 0;animation:slide-down .3s ease-out}@keyframes slide-down{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-down{0%{opacity:0;transform:translateY(-15px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-in-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-in-left{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes slide-in-right{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes float-bob{0%{transform:translateY(0)}50%{transform:translateY(-15px)}to{transform:translateY(0)}}.fade-down{animation:fade-down .5s ease-out forwards}.fade-in{animation:fade-in .6s ease-out .2s forwards;opacity:0}.slide-in-up{animation:slide-in-up .6s ease-out .4s forwards;opacity:0}.slide-in-left{animation:slide-in-left .8s cubic-bezier(.25,1,.5,1) forwards}.slide-in-right{animation:slide-in-right .8s cubic-bezier(.25,1,.5,1) .2s forwards;opacity:0}.background-canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1}.btn{text-decoration:none}.main-content{padding-top:100px;padding-bottom:48px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleUp{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}@keyframes border-glow{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0f172ab3;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .3s ease-out forwards}.modal-content{background-color:#17213ad9;padding:2.5rem;border-radius:16px;width:90%;max-width:600px;position:relative;display:flex;flex-direction:column;box-shadow:0 15px 40px #0006;animation:scaleUp .3s cubic-bezier(.25,.1,.25,1) forwards;border:2px solid transparent;background-clip:padding-box;background-image:linear-gradient(115deg,#4f46e5,#3b82f6,#60a5fa);background-size:200% auto;animation:border-glow 4s linear infinite}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;color:#fff}.modal-header h2{margin:0;font-size:1.8rem;font-weight:700;color:#60a5fa;text-shadow:0 0 10px rgba(96,165,250,.3)}.close-btn{background:none;border:none;font-size:0;color:#cbd5e0;cursor:pointer;padding:0;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:color .2s,transform .2s,background-color .2s}.close-btn svg{width:100%;height:100%}.close-btn:hover{color:#f0f8ff;transform:rotate(90deg) scale(1.1);background-color:#60a5fa1a}.avatar-grid::-webkit-scrollbar{width:8px}.avatar-grid::-webkit-scrollbar-track{background:#1a294d;border-radius:10px}.avatar-grid::-webkit-scrollbar-thumb{background:#3b82f6;border-radius:10px;border:2px solid #1a294d}.avatar-grid::-webkit-scrollbar-thumb:hover{background:#60a5fa}.avatar-grid-option{width:100%;aspect-ratio:1 / 1;border-radius:50%;cursor:pointer;border:3px solid transparent;transition:transform .2s ease-in-out,filter .2s ease-in-out,border-color .2s ease-in-out,box-shadow .2s ease-in-out,opacity .2s ease-in-out;will-change:transform,filter,opacity}.avatar-grid-option:hover,.avatar-grid-option.selected{transform:scale(1.1);border-color:#60a5fa;box-shadow:0 0 20px #60a5fab3;filter:brightness(1) grayscale(0%);opacity:1}@media (max-width: 768px){.modal-content{padding:1.5rem;max-width:95%}.modal-header h2{font-size:1.3rem}.avatar-grid{grid-template-columns:repeat(4,1fr);gap:.8rem}}.avatar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;max-height:55vh;overflow-y:auto;padding-right:12px;margin-right:-12px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#3b82f6 #1a294d}.modal-overlay-avatar{position:fixed;inset:0;background-color:#0f172ab3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;z-index:1000;opacity:0;animation:fadeIn .2s ease-out forwards}.modal-content-avatar{background-color:#111827;color:#e5e7eb;padding:2rem;border-radius:16px;border:1px solid rgba(255,255,255,.1);width:90%;max-width:500px;box-shadow:0 10px 25px #0000004d;transform:scale(.95);animation:popIn .2s ease-out .1s forwards}@keyframes fadeIn{to{opacity:1}}@keyframes popIn{to{transform:scale(1)}}.modal-header-avatar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid rgba(255,255,255,.1)}.modal-header-avatar h2{margin:0;font-size:1.5rem}.close-btn-avatar{background:none;border:none;color:#9ca3af;cursor:pointer;width:32px;height:32px;padding:0;transition:color .2s ease,transform .2s ease}.close-btn-avatar:hover{color:#fff;transform:rotate(90deg)}.avatar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:1rem;max-height:50vh;overflow-y:auto;padding-right:8px}.avatar-grid::-webkit-scrollbar{width:6px}.avatar-grid::-webkit-scrollbar-thumb{background-color:#4b5563;border-radius:3px}.avatar-grid::-webkit-scrollbar-track{background-color:transparent}.avatar-grid-option{width:100%;height:auto;aspect-ratio:1 / 1;border-radius:50%;object-fit:cover;cursor:pointer;border:3px solid transparent;transition:all .2s ease}.avatar-grid-option:hover{transform:scale(1.05);border-color:#4f46e5}.avatar-grid-option.selected{border-color:#2563eb;box-shadow:0 0 15px #3b82f680}.room-container{display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:transparent;padding:2rem;color:#fff;font-family:Poppins,sans-serif;box-sizing:border-box}.room-card{background-color:#17213acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:2.5rem;border-radius:12px;width:100%;max-width:450px;text-align:center;border:1px solid rgba(59,130,246,.3);box-shadow:0 0 25px #3b82f640}.room-card h2{font-size:2.25rem;font-weight:800;margin-bottom:2.5rem;color:#3b82f6;text-shadow:0 0 15px rgba(59,130,246,.4)}.room-card p{color:#a0aec0;margin-bottom:2rem}.room-form{display:flex;flex-direction:column;gap:1.5rem}.form-group{text-align:left}.form-group label{display:block;margin-bottom:.5rem;font-weight:500;color:#cbd5e0}.form-group input{width:100%;padding:.75rem 1rem;background-color:#1a294d;border:1px solid #3a4a75;border-radius:8px;color:#fff;font-size:1rem;transition:border-color .3s,box-shadow .3s;box-sizing:border-box}.form-group input::placeholder{color:#718096}.form-group input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 15px #3b82f680}.avatar-picker{margin-top:1.5rem;margin-bottom:1rem;text-align:left}.avatar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.avatar-label{display:block;font-weight:500;color:#cbd5e0}.avatar-list{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center}.avatar-option{width:50px;height:50px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:all .2s ease-in-out;background-color:#1a294d}.avatar-option:hover{transform:scale(1.1);border-color:#718096}.avatar-option.selected{transform:scale(1.1);border-color:#3b82f6;box-shadow:0 0 15px #3b82f699}.more-avatars-btn{background-color:#1a294d;border:1px solid #3a4a75;color:#cbd5e0;padding:.25rem .75rem;border-radius:6px;font-size:.875rem;cursor:pointer;transition:background-color .2s}.more-avatars-btn:hover{background-color:#3a4a75}.btn-primary{transition:transform .2s,box-shadow .3s;box-shadow:0 5px 15px #3b82f64d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px #3b82f666}.back-link{display:inline-block;margin-top:1.5rem;color:#a0aec0;text-decoration:none;transition:color .3s}@media (max-width: 768px){.room-container{padding:1rem;align-items:flex-start;padding-top:20px}.room-card{padding:1.5rem}.room-card h2{font-size:1.75rem}.room-card p{font-size:.9rem;margin-bottom:1.5rem}}@media (max-width: 768px){.form-main-content{display:flex;flex-direction:column;gap:1.5rem}.form-group{text-align:left;padding-bottom:2rem}.room-form{gap:1rem}}@media (min-width: 769px){@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.room-card{height:auto;max-width:850px;background-color:#17213ab3;border:1px solid transparent;background-clip:padding-box;border:solid 1px transparent;position:relative}}.room-card h2{font-size:2.5rem;text-shadow:0 0 25px rgba(59,130,246,.6);animation:fadeUp .5s ease-out forwards}.form-inputs{flex:1;display:flex;flex-direction:column;gap:1.5rem;animation:fadeUp .5s .2s ease-out forwards backwards}.form-group input{transition:all .3s ease}.form-group input:focus{transform:translateY(-2px);border-color:#60a5fa;box-shadow:0 0 20px #60a5fa99}.form-avatars{flex:1;display:flex;flex-direction:column;padding-right:1rem;animation:fadeUp .5s .4s ease-out forwards backwards}.avatar-picker{width:100%;margin:0}.avatar-option{transition:all .3s ease}.avatar-option:hover,.avatar-option.selected{filter:grayscale(0%);opacity:1;transform:scale(1.15) translateY(-3px);border-color:#60a5fa;box-shadow:0 0 25px #60a5fab3}.btn-primary{animation:fadeUp .5s .6s ease-out forwards backwards}.back-link{animation:fadeUp .5s .7s ease-out forwards backwards}.form-main-content{display:flex;justify-content:space-between;align-items:flex-start;gap:2.5rem;margin-bottom:1.5rem}.room-form{gap:1rem}.join-room-page .toast-overlay{inset:0 auto auto 0;width:100%;height:100%;background-color:#0f172a80;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);display:flex;justify-content:center;align-items:flex-start;padding:1rem;box-sizing:border-box}.join-room-page .toast-container{animation:slide-in-top .5s ease-out;width:100%;max-width:500px;position:relative;overflow:hidden;background-color:#1e293bcc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(59,130,246,.3);box-shadow:0 10px 25px #0000004d}.join-room-page .toast-container:after{content:"";position:absolute;bottom:0;left:0;right:0;height:4px;background-color:var(--primary-blue, #3b82f6);transform-origin:right;animation:scale-x-rtl 5s linear forwards}@keyframes spin{to{transform:rotate(360deg)}}.spinner{display:inline-block;width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#fff;animation:spin 1s ease-in-out infinite}.more-avatars-btn:disabled{width:70px;cursor:not-allowed}@keyframes fade-scale-in{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.toast-container{min-width:300px;background-color:#1e293bcc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#f8fafc;padding:1rem 1.5rem;border-radius:.75rem;border:1px solid rgba(59,130,246,.3);box-shadow:0 10px 25px #0000004d,0 0 25px #3b82f633;display:flex;justify-content:space-between;align-items:center;gap:1rem;animation:slide-in .5s cubic-bezier(.25,1,.5,1)}.toast-container:after{content:"";position:absolute;bottom:0;left:0;right:0;height:4px;background-color:var(--primary-blue);transform-origin:right;animation:scale-x-rtl 5s linear forwards}@media (max-width: 768px){.toast-overlay{inset:0 auto auto 0;width:100%;height:100%;background-color:#0009;display:flex;justify-content:center;align-items:center;padding:1.5rem;box-sizing:border-box}.toast-container{animation:fade-scale-in .3s ease-out;width:auto;max-width:400px}}:root{--primary-blue: #3b82f6}@keyframes slide-in{0%{transform:translate(120%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slide-in-top{0%{transform:translateY(-120%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes scale-x-rtl{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.toast-overlay{position:fixed;bottom:2rem;right:2rem;z-index:1000}.toast-container{min-width:300px;background-color:#1e293bcc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#f8fafc;padding:1rem 1.5rem;border-radius:.75rem;border:1px solid rgba(59,130,246,.3);box-shadow:0 10px 25px #0000004d;display:flex;justify-content:space-between;align-items:center;gap:1rem;animation:slide-in .5s cubic-bezier(.25,1,.5,1)}.toast-message{margin:0;font-weight:500}.toast-close-btn{background:none;border:none;color:#94a3b8;font-size:1.75rem;line-height:1;cursor:pointer;padding:0 .5rem;transition:color .2s ease}.toast-close-btn:hover{color:#fff}@media (max-width: 768px){.toast-overlay{top:0;left:0;width:100%;height:100%;background-color:#0f172a80;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:flex-start;padding:1rem;box-sizing:border-box;pointer-events:auto}.toast-container{animation:slide-in-top .5s ease-out;width:100%;max-width:500px;position:relative;overflow:hidden}.toast-container:after{content:"";position:absolute;bottom:0;left:0;right:0;height:4px;background-color:var(--primary-blue);transform-origin:left;animation:scale-x-rtl 5s linear forwards}}.toast-overlay{top:0;left:0;width:100%;height:100%;background-color:#0f172a80;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:flex-start;padding:1rem;box-sizing:border-box;pointer-events:auto}.toast-container{animation:slide-in-top .5s ease-out;width:100%;max-width:500px;position:relative;overflow:hidden}.toast-container:after{content:"";position:absolute;bottom:0;left:0;right:0;height:4px;background-color:var(--primary-blue);transform-origin:left;animation:scale-x-rtl 5s linear forwards}.preview-card{display:flex;max-width:400px;border:1px solid #ddd;border-radius:8px;overflow:hidden;text-decoration:none;color:inherit;margin-top:8px;background-color:#f9f9f9;transition:background-color .2s ease}.preview-card:hover{background-color:#f1f1f1}.preview-image{width:100px;height:100px;object-fit:cover;flex-shrink:0;border-right:1px solid #eee}.preview-content{padding:12px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}.preview-title{font-size:1rem;font-weight:600;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preview-description{font-size:.875rem;color:#555;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.preview-url{font-size:.75rem;color:#888;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.error-card{padding:12px;background-color:#fff8f8;border-color:#fdd;display:block}.error-card p{margin:0 0 4px}.error-card span{font-family:monospace;color:#d63333;word-break:break-all}.preview-card.loading{background-color:#fff}.loading .text-content{flex:1;padding:12px}.skeleton-loader{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;border-radius:4px}@keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}.loading>.skeleton-loader{width:100px;height:100px;border-radius:0}.skeleton-title{height:20px;margin-bottom:8px}.skeleton-desc{height:30px}.preview-card{display:flex;max-width:400px;border-radius:8px;overflow:hidden;text-decoration:none;color:inherit;background-color:#0000001a;border:1px solid rgba(255,255,255,.1);transition:background-color .2s ease}.dark-theme .preview-card{background-color:#0003;border-color:#ffffff26}.preview-card:hover{background-color:#00000026;cursor:pointer}.dark-theme .preview-card:hover{background-color:#0000004d}.preview-image{width:100px;height:100px;object-fit:cover;flex-shrink:0;align-self:center;margin:10px;border-radius:4px}.preview-content{padding:10px 10px 12px 8px;display:flex;flex-direction:column;justify-content:center;overflow:hidden;flex-grow:1}.preview-title{font-size:.95rem;font-weight:600;margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#55b4ff}.preview-description{font-size:.85rem;color:#e0e0e0;margin:0 0 4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;line-height:1.3}.dark-theme .preview-description{color:#e0e0e0}.preview-url{font-size:.75rem;color:#f5f5f5;margin-top:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dark-theme .preview-url{color:#aaa}.error-card{padding:10px;background-color:#ff00001a;border:1px solid rgba(255,0,0,.3)}.loading{height:70px}.loading>.skeleton-loader{width:50px;height:50px;margin:10px;border-radius:4px}.loading .text-content{flex:1;padding:10px 10px 10px 0}.skeleton-title{height:18px;margin-bottom:6px}.skeleton-desc{height:35px}.inline-link{color:#f9f9f9;text-decoration:none;position:relative;z-index:1;padding:.1em .3em;transition:color .3s ease-in-out}.inline-link:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#818cf840;border-radius:4px;transform:scaleX(0);transform-origin:left;transition:transform .35s ease-in-out;z-index:-1}.inline-link:hover{color:#fff}.inline-link:hover:before{transform:scaleX(1)}.admin-left-dialog-overlay{position:fixed;inset:0;background:#1e22288c;z-index:3000;display:flex;align-items:center;justify-content:center}.admin-left-dialog{background:#fff;border-radius:18px;box-shadow:0 8px 32px #0000002e;padding:36px 32px 28px;max-width:350px;width:100%;text-align:center;animation:popIn .25s cubic-bezier(.4,0,.2,1)}@keyframes popIn{0%{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}.admin-left-dialog-header svg{margin-bottom:10px}.admin-left-dialog-header h2{color:#e53e3e;font-size:1.45rem;margin:0 0 8px;font-weight:700}.admin-left-dialog-body p{color:#333;font-size:1.08rem;margin:0 0 18px}.admin-left-dialog-footer{margin-top:10px}.admin-left-dialog-btn{background:#e53e3e;color:#fff;border:none;border-radius:8px;padding:10px 28px;font-size:1.08rem;font-weight:600;cursor:pointer;box-shadow:0 2px 8px #e53e3e1a;transition:background .18s}.admin-left-dialog-btn:hover{background:#c53030}.custom-notification-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;align-items:flex-start;justify-content:center;padding-top:2vh;z-index:9999;pointer-events:none}.custom-notification-content{font-family:Inter,Segoe UI,Roboto,Helvetica Neue,sans-serif;font-size:.95rem;font-weight:500;line-height:1.4;text-shadow:0 1px 2px rgba(0,0,0,.3);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:#ffffff26;border:1px solid rgba(255,255,255,.25);border-radius:50px;padding:1rem 1.5rem;color:#fff;box-shadow:0 8px 32px #0003;max-width:90%;width:fit-content;pointer-events:auto;transition:transform .3s ease,opacity .3s ease;opacity:0;transform:translateY(-20px);animation:slideDownFade .4s forwards}.custom-notification-content.info{border-left:4px solid rgba(0,123,255,.6)}.custom-notification-content.success{border-left:4px solid rgba(40,167,69,.6)}.custom-notification-content.error{border-left:4px solid rgba(220,53,69,.6)}@keyframes slideDownFade{to{opacity:1;transform:translateY(0)}}html,body{height:100%;margin:0;padding:0}.end-room-desktop{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:48px}.end-room-mobile{display:none}@media (max-width: 768px){.end-room-desktop{display:none!important}.end-room-mobile{display:inline-flex!important;align-items:center;padding:4px 8px!important;min-width:0!important;width:auto!important;font-size:.92rem;border-radius:8px!important}}@media (min-width: 769px){.end-room-mobile{display:none!important}}:root{--header-bg-rgb: 248, 248, 248;--primary-rgb: 13, 110, 253;--surface-rgb: 243, 244, 246;--background-color: #ffffff;--text-color: #333333;--muted-text-color: #6b7280;--header-bg: #f8f8f8;--border-color: #e5e7eb;--input-bg: #f3f4f6;--focus-ring: 0 0 0 3px rgba(59, 130, 246, .35);--message-font-size: 1rem;--timestamp-font-size: .75rem;--received-bubble-bg: #f7f9fc;--received-bubble-text: #0f1724;--sent-bubble-bg: #1e90ff;--sent-bubble-text: #ffffff;--primary: #0d6efd;--primary-600: #0b5ed7;--primary-700: #0a58ca;--success: #10b981;--danger: #ef4444;--warning: #f59e0b;--info: #3b82f6;--surface-50: #fafafa;--surface-100: #f5f5f5;--surface-200: #eeeeee;--surface-800: #1f2937;--code-bg: #1e1e1e;--code-header-bg: #2a2a2a;--code-border: #333333;--code-text: #f8f8f2;--code-lang: #9cdcfe}.dark-theme{--background-color: #0f1115;--text-color: #e5e7eb;--muted-text-color: #9ca3af;--header-bg: #151821;--border-color: #2b3040;--input-bg: #0b0d12;--focus-ring: 0 0 0 3px rgba(96, 165, 250, .4);--received-bubble-bg: #23272f;--received-bubble-text: #e6eef8;--sent-bubble-bg: #2b7bff;--sent-bubble-text: #ffffff;--primary: #60a5fa;--primary-600: #4f88d9;--primary-700: #3f6fb3;--surface-50: #0f1115;--surface-100: #10131a;--surface-200: #141823;--surface-800: #0b0d12;--code-bg: #1e1e1e;--code-header-bg: #23252d;--code-border: #2e323f;--code-text: #eeeeee;--code-lang: #9cdcfe}body.light-theme{--background-color: #ffffff;--text-color: #0b1220;--header-bg: #ffffff;--border-color: #e6e9ef;--input-bg: #fbfdff;--received-bubble-bg: #f1f6fb;--received-bubble-text: #0f1724;--sent-bubble-bg: #2b9cff;--sent-bubble-text: #ffffff}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;padding:0;width:100%;background:var(--background-color);color:var(--text-color);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img{max-width:100%;display:block}button{font:inherit}button,[role=button],a,.btn,.settings-btn,.close-btn,.send-btn,.send-button,.attach-button,.remove-file-button,.copy-header-btn,.participants-toggle-btn,.participants-toggle,.end-room-btn,.download-button{-webkit-tap-highlight-color:transparent!important;outline:none!important;box-shadow:none!important;background-image:none!important}button:focus,button:active,[role=button]:focus,[role=button]:active,a:focus,a:active,.btn:focus,.btn:active,.settings-btn:focus,.settings-btn:active,.close-btn:focus,.close-btn:active,.send-btn:focus,.send-btn:active,.send-button:focus,.send-button:active,.attach-button:focus,.attach-button:active,.remove-file-button:focus,.remove-file-button:active,.copy-header-btn:focus,.copy-header-btn:active,.participants-toggle-btn:focus,.participants-toggle-btn:active,.participants-toggle:focus,.participants-toggle:active,.end-room-btn:focus,.end-room-btn:active,.download-button:focus,.download-button:active{outline:none!important;box-shadow:none!important;background-image:none!important}*::-webkit-scrollbar{height:10px;width:10px}*::-webkit-scrollbar-thumb{background:#9aa4b2;border-radius:8px}.dark-theme *::-webkit-scrollbar-thumb{background:#4b5563}*::-webkit-scrollbar-track{background:transparent}:focus-visible{outline:none;box-shadow:none}.theme-toggle-switch{position:relative;display:inline-block;width:50px;height:28px;vertical-align:middle}.chat-container{display:flex;flex-direction:column;width:100%;height:100vh!important;min-height:100vh;background-color:var(--background-color);color:var(--text-color);border-radius:0;overflow:hidden;position:relative;justify-content:flex-start;align-items:stretch;margin:0;padding:0}.main-content{flex:1 1 auto;display:flex;flex-direction:row;overflow:hidden;position:relative;min-height:0;height:auto;padding-top:0}.chat-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:12px 28px;gap:0;min-height:48px;border-bottom:1px solid var(--border-color);background:var(--header-bg);position:fixed;top:0;left:0;width:100vw;z-index:999;margin:0}.logo-section{display:flex;align-items:center;gap:8px}.logo-section .logo{font-weight:700;font-size:1.15rem;line-height:1.1;color:var(--primary-700);letter-spacing:.5px;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.desktop-admin-wrapper{display:flex;align-items:center}.desktop-admin-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;border:2px solid var(--border-color)}@media (max-width: 768px){.desktop-admin-wrapper{display:none}}.header-actions{display:flex;align-items:center;gap:10px}.settings-btn{background:none;border:none;color:var(--text-color);padding:8px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;outline:none!important;box-shadow:none!important}.settings-btn:focus{outline:none!important;box-shadow:none!important;background:none!important}.settings-btn:hover{background-color:var(--surface-100);color:var(--primary-700);transform:rotate(30deg)}.settings-btn:active{background:none!important;color:var(--primary-700);box-shadow:none!important;outline:none!important}.settings-btn{-webkit-tap-highlight-color:transparent}.settings-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background-color:#0000;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);transition:all .3s cubic-bezier(.4,0,.2,1);opacity:0;visibility:hidden;z-index:1000}.settings-overlay.visible{background-color:#00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:1;visibility:visible}.settings-modal{background-color:var(--background-color);width:98%;max-width:1000px;min-height:fit-content;height:auto;max-height:78vh;overflow:hidden;padding:0;border-radius:16px;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d,0 0 0 1px var(--border-color);transform:translateY(20px) scale(.98);opacity:0;transition:all .3s cubic-bezier(.4,0,.2,1);will-change:transform,opacity;position:relative;scrollbar-width:thin}.settings-modal:before{content:"";position:absolute;inset:-1px;border-radius:24px;padding:1px;background:linear-gradient(to bottom right,rgba(255,255,255,.1),rgba(255,255,255,.05) 50%,transparent 50%,transparent);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.settings-overlay.visible .settings-modal{transform:translateY(0);opacity:1}.settings-content-wrapper{max-height:calc(78vh - 70px);overflow-y:auto;overflow-x:hidden;scrollbar-width:none;-ms-overflow-style:none}.settings-content-wrapper::-webkit-scrollbar{display:none}.settings-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--border-color);background:var(--surface-50)}.settings-header h3{margin:0;font-size:1.25rem;font-weight:600;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-600) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-.02em}.close-btn{background:none;border:none;color:var(--text-color);font-size:24px;cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:all .2s cubic-bezier(.4,0,.2,1);margin:-6px;opacity:.7;background-color:var(--surface-100)}.close-btn:hover{opacity:1;background-color:var(--surface-200);transform:scale(1.05)}.settings-section{order:1;padding:28px 0 48px;gap:0;margin:0;box-sizing:border-box;flex:1 1 auto;min-height:0;max-height:calc(78vh - 96px);overflow-y:auto}.setting-item{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.setting-item:last-child{margin-bottom:0}.setting-item label{font-weight:500}.switch{position:relative;display:inline-block;width:46px;height:24px}.switch input{opacity:0;width:0;height:0}.switch .slider.round{position:absolute;cursor:pointer;inset:0;background-color:var(--surface-200);transition:.4s;border-radius:24px}.switch .slider.round:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background-color:#fff;transition:.4s;border-radius:50%}.switch input:checked+.slider.round{background-color:var(--primary)}.switch input:checked+.slider.round:before{transform:translate(22px)}.button-group{display:flex;gap:8px}.button-group button{background:var(--surface-100);border:1px solid var(--border-color);padding:6px 12px;border-radius:6px;cursor:pointer;transition:all .2s ease;color:var(--text-color)}.message-row{margin:8px 0;padding:0 16px;display:flex;flex-direction:column;width:auto;max-width:100%}.message-row.sent{align-self:flex-end;min-width:400px;width:70%}.message-row.received{align-self:flex-start;min-width:400px;width:70%}.message-wrapper{display:flex;flex-direction:column;gap:0}.message-sender{display:flex;align-items:center;gap:8px;margin-bottom:0}.message-sender .avatar{width:28px;height:28px;border-radius:50%;border:2px solid var(--border-color)}.message-sender .sender-name{font-size:.875rem;font-weight:500;color:var(--muted-text-color)}.message-bubble .text-content p{margin:0;padding:0}.modern .message-bubble{position:relative;padding:2px 18px 12px;border-radius:16px;width:100%;box-shadow:0 1px 2px #0000000d;transition:all .2s ease}.classic .message-bubble{position:relative;padding:4px 16px 10px;border-radius:12px;max-width:100%;transition:all .2s ease}.modern .sent .message-bubble{background:linear-gradient(135deg,var(--sent-bubble-bg),var(--primary-600));color:var(--sent-bubble-text);border-bottom-right-radius:4px;margin-left:auto}.modern .received .message-bubble{background:var(--received-bubble-bg);color:var(--received-bubble-text);border-bottom-left-radius:4px;box-shadow:0 2px 4px #0000000f}.classic .sent .message-bubble{background:var(--sent-bubble-bg);color:var(--sent-bubble-text);margin-left:auto;border:1px solid rgba(255,255,255,.1)}.classic .received .message-bubble{background:var(--received-bubble-bg);color:var(--received-bubble-text);border:1px solid var(--border-color)}.text-content{position:relative;width:100%}.message-bubble p{margin:0;font-size:1rem;line-height:1.6;word-wrap:break-word;white-space:pre-wrap;letter-spacing:.01em;transition:all .3s ease}.message-bubble.small p{font-size:.95rem}.message-bubble.medium p{font-size:1rem}.message-bubble.large p{font-size:1.1rem}.sent .message-bubble p{color:#fffffff2}.received .message-bubble p{color:var(--text-color)}.timestamp{font-size:.75rem;color:var(--muted-text-color);opacity:.8;margin-top:6px;padding-right:2px;display:block;text-align:right;transition:all .3s ease}.sent .timestamp{color:#ffffffe6}.message-bubble.small .timestamp{font-size:.7rem}.message-bubble.medium .timestamp{font-size:.75rem}.message-bubble.large .timestamp{font-size:.8rem}.message-bubble:hover{transform:translateY(-1px);box-shadow:0 4px 8px #00000014}.message-bubble:active{transform:translateY(0)}@media (max-width: 768px){.message-row{width:85%;min-width:280px;max-width:95%;padding:0 8px}.message-bubble{padding:12px 16px}.message-sender .avatar{width:24px;height:24px}}@media (min-width: 768px) and (max-width: 1199px){.message-row{width:75%;min-width:350px}}@media (min-width: 1200px){.message-row{width:70%;min-width:400px}.message-bubble{padding:14px 20px}}.button-group button:hover{background:var(--surface-200)}.button-group button.active{background:var(--primary);color:#fff;border-color:var(--primary)}.room-info{font-size:.9rem;color:var(--text-color);padding:6px 10px;border-radius:8px;text-align:center;background:var(--surface-100);border:1px solid var(--border-color);font-weight:600}.main-content{display:flex;flex:1 1 auto;overflow:hidden;height:100%;margin:0;padding:0;border-top:none;position:relative}.messages-section{flex:1 1 auto;padding:0 12px;margin:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:4px;height:100%;border-top:none;position:relative;background-color:#dfdbe5;z-index:1;will-change:transform;backface-visibility:hidden;-webkit-overflow-scrolling:touch;background-color:var(--background-color);scroll-behavior:smooth}.messages-section:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-repeat:repeat;background-size:350px;opacity:.06;pointer-events:none}.dark-theme .messages-section:before{opacity:.04}.participants-section{width:380px;flex-shrink:0;padding:24px;border-left:1px solid var(--border-color);background-color:var(--header-bg);color:var(--text-color);transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;z-index:1102;visibility:hidden;transform:translate(100%);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:-8px 0 20px #0000001a}.dark-theme .participants-section{background-color:#1e2023f2;box-shadow:-8px 0 20px #0003}.participants-section h4{margin:0 0 20px;font-size:1.1rem;font-weight:600;color:var(--text-color);display:flex;align-items:center;gap:8px}.participants-section h4:before{content:"";display:inline-block;width:6px;height:6px;background:var(--primary);border-radius:50%}.participants-section.visible{visibility:visible;transform:translate(0)}@media (min-width: 769px){.participants-section{visibility:hidden;transform:translate(380px)}.participants-section.visible{visibility:visible;transform:translate(0)}}.participants-section{pointer-events:auto}.sidebar-overlay{display:none;position:fixed;inset:0;width:100vw;height:100vh;background:#1e202340;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:1101}.sidebar-overlay.visible{display:block}@media (max-width: 768px){.participants-section{display:none;position:fixed;inset:0;width:100vw;height:100vh;max-width:100vw;max-height:100vh;padding-top:max(24px,env(safe-area-inset-top,0px));padding-bottom:max(24px,env(safe-area-inset-bottom,0px));border-left:none;border-top:none;border-radius:0;z-index:1102;box-shadow:none;background-color:var(--header-bg);transform:translateY(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);overflow-y:auto}.participants-section.visible{display:block;visibility:visible;transform:translateY(0)}.sidebar-overlay{top:0;z-index:1101;background:#1e202340}.close-participants-btn{position:absolute;top:max(16px,env(safe-area-inset-top,0px));right:16px;z-index:1200;background:var(--surface-100);color:var(--primary-700);font-size:2rem;border-radius:50%;box-shadow:0 2px 8px #00000014;padding:8px;display:flex;align-items:center;justify-content:center;transform-origin:center center;-webkit-transform-origin:center center;line-height:0}.close-participants-btn:active,.close-participants-btn:focus{background:var(--surface-200);color:var(--primary)}}.main-content.sidebar-open{pointer-events:none}.main-content.sidebar-open .messages-section,.main-content.sidebar-open .input-section{filter:blur(2px);opacity:.7}.participants-section h4{margin:0 0 16px;font-weight:700}.participants-list{display:flex;flex-direction:column;gap:12px;overflow-y:auto;overflow-x:hidden;padding-right:6px;max-height:calc(100vh - 160px);box-sizing:border-box}.participant-item{flex:0 0 auto;min-height:64px}.participants-list::-webkit-scrollbar{width:10px}.participants-list::-webkit-scrollbar-thumb{background:#0000001f;border-radius:8px}.dark-theme .participants-list::-webkit-scrollbar-thumb{background:#ffffff14}.participants-list::-webkit-scrollbar-track{background:transparent}.participants-list{scrollbar-width:none}.participants-list::-webkit-scrollbar{width:8px}.participants-list::-webkit-scrollbar-thumb{background:#0000001f;opacity:0;transition:opacity .22s ease}.participants-list.show-scrollbar::-webkit-scrollbar-thumb{opacity:1}.participants-list.show-scrollbar{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.12) transparent}.participants-list.show-scrollbar::-webkit-scrollbar-track{background:#00000005}.participant-item{display:flex;align-items:left;gap:12px;margin-bottom:12px;height:72px;width:100%;padding:12px 14px;border-radius:12px;background:var(--surface-50);transform:translateY(2px);box-shadow:0 10px 30px #00000014;transition:box-shadow .18s ease,transform .12s ease;background:radial-gradient(circle at var(--x, 50%) var(--y, 50%),rgba(var(--primary-rgb),.06) 0%,transparent 60%);border:1px solid rgba(var(--primary-rgb),.06);position:relative;overflow:hidden;cursor:pointer;flex:0 0 auto;box-shadow:0 6px 18px #0000000f}.participant-item:before,.participant-item:after{content:"";position:absolute;inset:0;border-radius:12px;transition:opacity .18s ease,transform .18s ease;pointer-events:none}.participant-item:before{background:linear-gradient(135deg,rgba(var(--primary-rgb),.06),transparent 40%);opacity:0}.participant-item:after{background:radial-gradient(circle at var(--x, 50%) var(--y, 50%),rgba(var(--primary-rgb),.06) 0%,transparent 60%);opacity:0;mix-blend-mode:normal}.participants-list .participant-item:first-child:hover{transform:none!important;box-shadow:0 6px 18px #0000000f!important}.participant-item:hover:before{opacity:1;transform:translateZ(0)}.participant-item:hover:after{opacity:1}.dark-theme .participant-item{background:#ffffff05}.dark-theme .participant-item:hover{background:radial-gradient(circle at var(--x, 50%) var(--y, 50%),rgba(var(--primary-rgb),.06) 0%,transparent 60%);border-color:rgba(var(--primary-rgb),.4);box-shadow:0 4px 15px #0003,0 8px 30px rgba(var(--primary-rgb),.15)}.participant-item .avatar{width:48px;height:48px;border-radius:10px;object-fit:cover;box-shadow:0 6px 18px #00000014;border:1px solid rgba(0,0,0,.04);transition:transform .12s ease}.participant-item:hover .avatar{transform:scale(1.03)}.participant-info{display:flex;flex-direction:row;align-items:center;gap:8px;flex:1 1 auto;min-width:0;justify-content:flex-start}.participant-name{font-weight:600;font-size:.98rem;color:var(--text-color);transition:color .12s ease;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}.participant-item:hover .participant-name{color:var(--primary)}.admin-badge{display:inline-flex;align-items:center;gap:6px;font-size:.82rem;color:var(--primary);font-weight:700;background:rgba(var(--primary-rgb),.06);padding:6px 10px;border-radius:999px;width:auto;transition:background .12s ease,transform .12s ease}.dark-theme .admin-badge{background:rgba(var(--primary-rgb),.15)}.admin-badge .creator-icon{width:14px;height:14px;opacity:.95}.participant-item:hover .admin-badge{background:rgba(var(--primary-rgb),.08);transform:translateY(-1px)}.dark-theme .participant-item:hover .admin-badge{background:rgba(var(--primary-rgb),.12)}.participant-item:hover .creator-icon{opacity:1;transform:rotate(6deg)}.participant-item{display:flex;align-items:center}.participant-item .participant-info{display:flex;align-items:center;justify-content:flex-start;width:100%}.participant-item .participant-info>.participant-name{max-width:calc(100% - 120px);text-align:left}.participant-item .participant-info>.admin-badge{margin-left:auto}.participant-item .admin-badge{margin-left:8px;flex-shrink:0}.participants-toggle{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;background:linear-gradient(135deg,var(--primary),rgba(var(--primary-rgb),.9));color:#fff;border:none;border-radius:12px;font-weight:500;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 8px rgba(var(--primary-rgb),.2);position:relative;overflow:hidden}.participants-toggle:before{content:"";position:absolute;inset:0;background:linear-gradient(to right,transparent,rgba(255,255,255,.1),transparent);transform:translate(-100%);transition:transform .6s ease}.participants-toggle:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(var(--primary-rgb),.3)}.participants-toggle:hover:before{transform:translate(100%)}.participants-toggle:active{transform:translateY(1px);box-shadow:0 2px 4px rgba(var(--primary-rgb),.2)}.participants-toggle:hover{background:var(--primary-dark)}.close-participants-btn{position:absolute;right:16px;top:16px;background:transparent;border:none;color:var(--text-color);padding:8px;cursor:pointer;border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.17,.67,.29,2.71);transform-origin:center center;-webkit-transform-origin:center center}.close-participants-btn svg{transition:transform .2s cubic-bezier(.17,.67,.29,2.71);transform-origin:center center;-webkit-transform-origin:center center;display:block;width:18px;height:18px}.close-participants-btn:hover{background:var(--surface-100)}.close-participants-btn:hover svg{transform:scale(1.15)}.dark-theme .close-participants-btn:hover{background:red;color:#fff}.dark-theme .close-participants-btn{border:none;cursor:pointer;transition:background-color .3s ease-in-out,color .3s ease-in-out,transform .2s ease-in-out}.dark-theme .close-participants-btn:hover{background:red;color:#fff;transform:scale(1.1)}.close-participants-btn:active svg{transform:scale(.95)}.message-row{display:flex;align-items:flex-start;gap:8px;margin:2px 0;opacity:0;animation:messageRowAppear .3s ease forwards}@keyframes messageRowAppear{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.message-row.sent{flex-direction:row-reverse;animation:messageRowAppearSent .3s ease forwards}@keyframes messageRowAppearSent{0%{opacity:0;transform:translate(10px)}to{opacity:1;transform:translate(0)}}.avatar{width:38px;height:38px;border-radius:50%;object-fit:cover;background:transparent!important;box-shadow:0 2px 8px #0000001a!important;border:2px solid rgba(255,255,255,.8);transition:transform .2s ease}.message-row:hover .avatar{transform:scale(1.05)}.message-content{display:flex;flex-direction:column;gap:2px}.sender-name{font-size:.8rem;font-weight:700;color:var(--muted-text-color);margin-bottom:0}.message-bubble{display:inline-block;max-width:56ch;padding:8px 16px;border-radius:18px;word-wrap:break-word;word-break:break-word;line-height:1.5;font-size:.97rem;transition:all .3s cubic-bezier(.34,1.56,.64,1);box-shadow:0 2px 4px #0000000d,0 1px 2px #00000014;animation:messageAppear .3s cubic-bezier(.34,1.56,.64,1) forwards;opacity:0;transform:translateY(10px);position:relative;will-change:transform}@keyframes messageAppear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message-bubble:before,.message-bubble:after{content:"";position:absolute;border-radius:18px;opacity:0;transition:all .3s cubic-bezier(.34,1.56,.64,1);pointer-events:none}.message-bubble:before{inset:-2px;background:linear-gradient(135deg,rgba(var(--primary-rgb),.15),transparent 50%);z-index:-2;transform:translateY(4px)}.message-bubble:after{inset:-1px;padding:1px;background:linear-gradient(135deg,rgba(255,255,255,.4),rgba(255,255,255,.1) 30%,transparent 50%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.message-bubble:hover{transform:translateY(-2px)}.message-row.received .message-bubble:hover{box-shadow:0 4px 12px #00000014,0 8px 24px #00000014}.message-row.sent .message-bubble:hover{box-shadow:0 4px 12px rgba(var(--primary-rgb),.2),0 8px 24px rgba(var(--primary-rgb),.15)}.message-bubble:hover:before{opacity:1;transform:scale(1.02) translateY(0)}.message-row.sent .message-bubble:before{background:linear-gradient(135deg,rgba(255,255,255,.25),transparent 50%)}.message-row.sent .message-bubble:after{background:linear-gradient(135deg,rgba(255,255,255,.4),rgba(255,255,255,.2) 30%,transparent 50%)}.message-bubble:hover:after{opacity:1}.dark-theme .message-bubble:before{background:linear-gradient(135deg,rgba(var(--primary-rgb),.2),transparent 50%)}.dark-theme .message-bubble:hover{box-shadow:0 4px 12px #0003,0 8px 24px #00000026}.message-row.received .message-bubble{background:linear-gradient(135deg,rgba(var(--surface-rgb),.95),rgba(var(--surface-rgb),.85));color:var(--received-bubble-text);border-bottom-left-radius:4px;border:1px solid rgba(0,0,0,.06)}.message-row.sent .message-bubble{background:linear-gradient(135deg,rgba(var(--primary-rgb),.95),rgba(var(--primary-rgb),.85));color:var(--sent-bubble-text);border-bottom-right-radius:4px;border:1px solid rgba(255,255,255,.1)}.dark-theme .message-row.received .message-bubble{background:linear-gradient(135deg,#ffffff1a,#ffffff0d);border:1px solid rgba(255,255,255,.05)}.dark-theme .message-row.sent .message-bubble{background:linear-gradient(135deg,rgba(var(--primary-rgb),.9),rgba(var(--primary-rgb),.7));border:1px solid rgba(255,255,255,.1)}.file-message-bubble{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:10px;background:var(--received-bubble-bg);color:var(--text-color)}.file-message-bubble.uploading-bubble{opacity:.7}.file-message-bubble .file-icon{font-size:1.25rem}.file-message-bubble .file-details{display:flex;flex-direction:column}.file-message-bubble .file-name{font-weight:700;font-size:.9rem}.file-message-bubble .file-size{font-size:.8rem;color:var(--muted-text-color)}.file-message-bubble .download-button{background:none;border:none;color:var(--primary);cursor:pointer;font-size:1rem}.timestamp{font-size:.75rem;opacity:.75;color:var(--muted-text-color);display:flex}.message-row.received .timestamp{align-self:flex-start;margin-left:8px}.message-row.sent .timestamp{align-self:flex-end;margin-right:8px}.code-block-wrapper{display:flex;flex-direction:column;max-width:700px;width:100%;border:1px solid var(--code-border);border-radius:10px;overflow:hidden;background:var(--code-bg)}.code-block{display:block;width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;padding:14px 16px;font-size:.92rem;line-height:1.55;background:var(--code-bg);color:var(--code-text);white-space:pre;font-family:Fira Code,JetBrains Mono,Consolas,Courier New,monospace}.code-block::-webkit-scrollbar{height:8px}.code-block::-webkit-scrollbar-thumb{background:#666;border-radius:6px}.code-block::-webkit-scrollbar-track{background:#2a2a2a}.code-header{display:flex;justify-content:space-between;align-items:center;gap:8px;background:var(--code-header-bg);padding:8px 12px;font-size:.8rem;color:#c9d1d9;border-bottom:1px solid var(--code-border)}.lang-label{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.75rem;color:var(--code-lang);text-transform:none}.copy-header-btn{background:none;border:1px solid transparent;color:#c9d1d9;font-size:.75rem;cursor:pointer;display:inline-flex;align-items:center;gap:6px;border-radius:6px;padding:6px 10px;transition:color .2s ease,background-color .2s ease,border-color .2s ease}.copy-header-btn:hover{color:#fff;background:#ffffff0f;border-color:var(--code-border)}.copy-header-btn:active{transform:translateY(.5px)}.code-block{overflow-x:auto;padding:14px 16px;font-size:.92rem;line-height:1.55;background:var(--code-bg);color:var(--code-text);white-space:pre;font-family:Fira Code,JetBrains Mono,Consolas,Courier New,monospace}.code-timestamp{font-size:.75rem;color:#ffffffa6;text-align:right;padding:8px 12px;background:transparent}.dark-theme .code-timestamp{color:#ffffffbf}.message-row .code-block-wrapper .code-timestamp{color:var(--muted-text-color)}.message-row.sent .code-block-wrapper .code-timestamp{color:#ffffffe6}.code-block code{display:block;white-space:pre}.message-row .code-block-wrapper{width:100%;max-width:700px;min-width:0;box-sizing:border-box;margin:4px 0}.message-row .message-bubble:has(.code-block-wrapper){background:transparent!important;padding:0!important;max-width:700px!important}.token.comment,.token.prolog,.token.doctype,.token.cdata{color:#6a9955}.token.punctuation{color:#d4d4d4}.token.property,.token.tag,.token.constant,.token.symbol,.token.deleted{color:#d16969}.token.boolean,.token.number{color:#b5cea8}.token.selector,.token.attr-name,.token.string,.token.char,.token.builtin,.token.inserted{color:#ce9178}.token.operator,.token.entity,.token.url{color:#d4d4d4}.token.atrule,.token.attr-value,.token.keyword{color:#c586c0}.token.function,.token.class-name{color:#dcdcaa}.token.regex,.token.important,.token.variable{color:#9cdcfe}.input-section{position:relative;display:flex;align-items:center;gap:8px;padding:16px 24px;border-top:1px solid var(--border-color);background-color:var(--header-bg)}.input-bar,.input-field{display:flex;align-items:center;flex:1;background-color:var(--input-bg);border-radius:26px;padding:8px 12px;gap:8px}.attach-button{background:none;border:none;color:#aebac1;cursor:pointer;padding:8px;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);border-radius:50%;margin-right:4px}.attach-button:hover{background:#aebac114;transform:scale(1.04)}.dark-theme .attach-button:hover{background:#aebac126}.attach-button:active{transform:scale(.98)}.attach-button svg,.attach-button:hover svg{transform:none!important;transition:transform .12s ease}.input-content-container{flex:1;display:flex;align-items:center;position:relative}.auto-grow-textarea{flex:1;border:none;background:transparent;outline:none!important;box-shadow:none!important;padding:8px 0;font-size:16px;resize:none;min-height:24px;max-height:160px;line-height:20px;color:var(--text-color);width:100%}.auto-grow-textarea.hidden{display:none}.file-preview-chip{display:inline-flex;align-items:center;background-color:#555;color:#fff;border-radius:18px;padding:6px 10px;max-width:100%;gap:8px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.file-preview-chip i{color:#fff}.file-preview-chip .file-name{overflow:hidden;text-overflow:ellipsis}.remove-file-button{background:none;border:none;color:#fff;font-size:1rem;cursor:pointer}.send-btn,.send-button{background-color:var(--primary);color:#fff;border:none;border-radius:26px;padding:10px 18px;font-weight:700;cursor:pointer;transition:background-color .2s ease,transform .05s ease}.send-button-outer{margin-left:12px;color:#fff;border-radius:50%;width:48px;height:48px;min-width:48px;min-height:48px;max-width:48px;max-height:48px;display:flex;align-items:center;justify-content:center;font-size:1.35rem;box-shadow:0 2px 12px rgba(var(--primary-rgb, 13,110,253),.1);transition:background .18s,box-shadow .18s,transform .08s;border:none;outline:none;position:relative;z-index:2}.send-button-outer:active{background:var(--primary-700);transform:scale(.97)}.send-button-outer:disabled{background:var(--primary-700);color:#fff;cursor:not-allowed;box-shadow:none}.send-btn:hover,.send-button:hover{background-color:var(--primary-600)}.send-btn:active,.send-button:active{transform:translateY(1px)}.send-button:disabled{background-color:#9ca3af;cursor:not-allowed}.hidden-file-input{display:none}.attachment-sheet-container{position:absolute;bottom:80px;left:10px;z-index:100;width:220px;background-color:var(--input-bg);border-radius:12px;box-shadow:0 10px 30px #00000040;padding:8px;display:flex;flex-direction:column;gap:6px;border:1px solid var(--border-color)}.attachment-sheet-overlay{position:fixed;inset:0;z-index:99}.attach-button-item{display:flex;align-items:center;gap:12px;background:none;border:none;color:var(--text-color);font-size:16px;padding:10px;width:100%;text-align:left;cursor:pointer;border-radius:8px;transition:background-color .15s ease}.attach-button-item:hover{background:#0000000d}.dark-theme .attach-button-item:hover{background:#ffffff0f}.file-message{display:flex;align-items:center;gap:8px;padding:3px}.file-message .file-icon{font-size:1rem;padding:4px}.file-icon svg{font-size:1.5rem;color:#fff}body.light-theme .file-icon svg{color:#333}body.light-theme .file-icon.pdf svg{color:#d93025}body.light-theme .file-icon.word svg{color:#2b579a}body.light-theme .file-icon.zip svg{color:#f4b400}.btn{border:none;font-weight:700;border-radius:8px;cursor:pointer;transition:all .2s;padding:10px;font-size:1rem;display:flex;align-items:center;justify-content:center}.btn-primary{background-color:var(--primary);color:#fff;box-shadow:0 4px 14px #3b82f640}.btn-primary:hover{background-color:var(--primary-600)}.end-room-btn{background-color:#e53e3e;color:#fff;padding:8px;border-radius:50%;min-width:40px;height:40px;transition:all .2s ease}.end-room-btn:hover{background-color:#c53030;transform:scale(1.05)}.end-room-btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;border:none;border-radius:12px;cursor:pointer;font-weight:700;font-size:16px;transition:background-color .3s,box-shadow .3s,transform .08s;height:48px;line-height:1}body.light .end-room-btn{background-color:#f8f9fc;color:#333;box-shadow:0 1px 2px #0000000d,0 4px 12px #00000014}body.light .end-room-btn:hover{background-color:#fff;transform:translateY(-2px);box-shadow:0 1px 2px #0000000d,0 8px 24px #0000001f}body.dark .end-room-btn{background-color:#2a2a2a;color:#e0e0e0;box-shadow:0 1px 2px #0003,0 4px 12px #00000040}body.dark .end-room-btn:hover{background-color:#3a3a3a;transform:translateY(-2px);box-shadow:0 1px 2px #0003,0 8px 24px #00000059}.end-room-btn:active{background-color:var(--primary);color:#fff;transform:translateY(0);box-shadow:0 2px 4px #0000001f,0 6px 16px #0000002e}.visually-hidden{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}.mt-8{margin-top:8px}.mb-8{margin-bottom:8px}.ml-8{margin-left:8px}.mr-8{margin-right:8px}.mt-12{margin-top:12px}.mb-12{margin-bottom:12px}.ml-12{margin-left:12px}.mr-12{margin-right:12px}.p-8{padding:8px}.px-12{padding-left:12px;padding-right:12px}.text-muted{color:var(--muted-text-color)}.text-primary{color:var(--primary)}.card-soft{background:var(--surface-100);border:1px solid var(--border-color);border-radius:12px;padding:16px}@media (max-width: 768px){.chat-container{height:100dvh;min-height:0;border-radius:0;display:flex;flex-direction:column;box-sizing:border-box;overflow:hidden}.main-content{flex-direction:column;height:calc(100dvh - 116px)!important;min-height:0;margin-top:48px!important;margin-bottom:68px!important;padding-top:0!important;padding-bottom:0!important;box-sizing:border-box;overflow:hidden}.chat-header{flex-direction:row;justify-content:space-between;align-items:center;padding:8px 4px 8px 8px;gap:0;min-height:48px;border-bottom:1px solid var(--border-color);background:var(--header-bg);position:fixed;top:0;left:0;width:100vw;z-index:1001}.input-section{padding:0!important;width:100vw;min-width:0;box-sizing:border-box;position:fixed;left:0;right:0;bottom:0;z-index:1001;margin:0;height:68px}.input-bar{border-radius:22px;margin-left:0;margin-right:0;width:100vw;min-width:0;box-sizing:border-box}.send-button-outer{margin-right:0;margin-left:0}.logo-section .logo{font-size:1.05rem;font-weight:700;letter-spacing:.5px;color:var(--primary-700);padding-left:2px;max-width:80px}.room-info{position:static;left:unset;transform:none;font-size:.92rem;padding:3px 7px;border-radius:8px;background:var(--surface-100);color:var(--primary-700);border:1px solid var(--border-color);margin:0 2px;min-width:70px;text-align:center;flex:1 1 auto;display:flex;align-items:center;justify-content:center;gap:4px;font-weight:600}.header-actions{gap:2px}.theme-toggle-desktop{display:none!important}.theme-toggle-mobile{display:inline-flex!important;align-items:center;background:#eaf1fb;border-radius:50%;padding:4px;margin:0 4px;font-size:1.3rem;color:var(--primary-700);box-shadow:0 1px 4px #0000000a;border:none;transition:color .2s,background .2s}.theme-toggle-mobile:active,.theme-toggle-mobile:focus{color:#2563eb;background:#e0e7ff}.theme-toggle-mobile svg{width:1.5em;height:1.5em;display:block}.end-room-desktop{display:none!important}.end-room-mobile{display:inline-flex!important;align-items:center}.end-room-mobile svg{color:#e53e3e;opacity:1!important;transition:color .2s,opacity .2s,filter .2s;width:1.7em;height:1.7em;display:block;filter:drop-shadow(0 1px 2px rgba(0,0,0,.08))}.end-room-mobile:active svg,.end-room-mobile:focus svg{color:#c53030;opacity:.85;filter:drop-shadow(0 2px 6px rgba(229,62,62,.12))}.room-info .copy-room-id-btn{padding:2px;font-size:1.05rem}.close-participants-btn{display:inline-flex!important;background:none;border:none;color:var(--primary-900);margin-left:auto;margin-bottom:8px;cursor:pointer;width:40px;height:40px;padding:0;border-radius:50%;align-items:center;justify-content:center;transition:background .18s ease,color .18s ease,transform .12s ease;transform-origin:center center;-webkit-transform-origin:center center;line-height:0}.close-participants-btn:hover{background:#eaf1fb;color:#2563eb;transform:scale(1.06)}.participants-toggle-btn{display:inline-flex!important;background:none;border:none;color:var(--primary);font-size:1.5rem;margin-right:8px;cursor:pointer;align-items:center}.messages-section{order:1;padding:8px!important;gap:10px;margin-top:0!important;box-sizing:border-box;flex:1 1 auto;min-height:0;max-height:calc(100dvh - 116px)!important;overflow-y:auto}.message-row{flex-direction:row;align-items:flex-start;gap:6px}.message-row.sent{flex-direction:row-reverse}.message-bubble{max-width:90vw;font-size:1rem;padding:8px 10px}.avatar{width:32px;height:32px}.input-section{padding:16px 24px;position:sticky;bottom:0;left:0;right:0;background:var(--background-color);z-index:10;border-top:1px solid var(--border-color);height:68px;display:flex;align-items:center}.input-bar,.input-field{padding:8px}.code-block{padding:8px;font-size:.95rem}.copy-header-btn{padding:6px 8px}}body.light-theme .theme-toggle-btn{color:#0b0d12;background-color:transparent}body.dark-theme .theme-toggle-btn{color:#fff;background-color:transparent}body.light-theme .logo-section .logo{color:#0b0d12}body.dark-theme .logo-section .logo{color:#fff}body.light-theme .room-info{background-color:var(--surface-100);color:var(--text-color)}body.dark-theme .room-info{background-color:var(--surface-200);color:var(--text-color)}body.light-theme .message-row .timestamp{color:#1f2937}body.dark-theme .message-row .timestamp{color:#fff9}.chat-header{position:relative;align-items:center}.room-info{position:absolute;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:6px 16px;background-color:var(--input-bg);border:1px solid var(--border-color);border-radius:12px;font-weight:600;font-size:.9rem;color:var(--muted-text-color);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background-color .2s ease}.room-info:hover{background-color:var(--received-bubble-bg)}.copy-room-id-btn{background:none;border:none;color:var(--muted-text-color);cursor:pointer;display:flex;align-items:center;padding:4px}.end-room-btn{background-color:#e53e3e;color:#fff}.end-room-btn:hover{background-color:#c53030}.modal-overlay{position:fixed;inset:0;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.modal-content{background:var(--background-color);padding:24px;border-radius:16px;border:1px solid var(--border-color);width:90%;max-width:400px;box-shadow:0 10px 30px #0003;transform:scale(.95);animation:modal-pop .2s ease-out forwards}@keyframes modal-pop{to{transform:scale(1)}}.modal-content h3{margin:0 0 10px;font-size:1.25rem;color:var(--text-color)}.modal-content p{margin:0;color:var(--muted-text-color)}.modal-footer{margin-top:24px;display:flex;justify-content:flex-end;gap:12px}.modal-footer .btn{padding:10px 20px;border-radius:8px;font-weight:600;cursor:pointer;border:none}.modal-footer .btn-secondary{background-color:var(--received-bubble-bg);color:var(--text-color)}.modal-footer .btn-danger{background-color:#e53e3e;color:#fff}.modal-footer .btn-danger:hover{background-color:#c53030}.theme-toggle-switch{position:relative;display:inline-block;width:50px;height:28px}.theme-toggle-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#4a4f62;transition:.4s;border-radius:28px;display:flex;align-items:center;justify-content:space-between;padding:0 5px}.slider:before{position:absolute;content:"";height:22px;width:22px;left:3px;bottom:3px;background-color:#fff;transition:.4s;border-radius:50%}input:checked+.slider{background-color:#3b82f6}input:checked+.slider:before{transform:translate(22px)}.participant-item{display:flex;align-items:center;gap:12px}.participant-name{flex-grow:1}.creator-icon{color:#f59e0b;margin-left:auto;flex-shrink:0}@media (min-width: 769px){.participants-section{position:fixed;top:0;right:0;height:100vh;width:340px;max-width:100vw;background:var(--header-bg);border-left:1.5px solid var(--border-color);box-shadow:-4px 0 24px #3b82f614;z-index:2000;padding:32px 24px;display:flex;flex-direction:column;gap:18px;transform:translate(100%);transition:transform .35s cubic-bezier(.4,0,.2,1),box-shadow .2s;overflow-y:auto}.participants-section.open{transform:translate(0);box-shadow:-8px 0 32px #3b82f624}.main-content{margin-right:0;transition:margin-right .35s cubic-bezier(.4,0,.2,1)}.participants-section.open~.main-content{margin-right:340px}.close-participants-btn{display:block!important;background:none;border:none;font-size:2rem;background-color:#2563eb;color:#fff;margin-left:auto;margin-bottom:8px;cursor:pointer;padding:2px 8px;border-radius:6px;transition:background .2s,color .2s;line-height:1}.close-participants-btn:hover{background:#eaf1fb;color:#2563eb}}.header-actions .participants-toggle-btn .avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;background:transparent!important;border:2px solid var(--primary-200, #c7d2fe);box-shadow:0 1px 4px #3b82f614;padding:0}.header-actions .participants-toggle-btn span{background:none!important;box-shadow:none!important}.header-actions .participants-toggle-btn{background:#eaf1fb;color:var(--primary-700);border:none;border-radius:20px;font-weight:600;font-size:1rem;padding:7px 18px;margin:0 6px;box-shadow:0 1px 4px #3b82f60f;cursor:pointer;transition:background .18s,color .18s,box-shadow .18s;letter-spacing:.1px;outline:none;display:inline-flex;align-items:center;gap:8px}.header-actions .participants-toggle-btn:hover,.header-actions .participants-toggle-btn:focus{background:#e0e7ff;color:#2563eb;box-shadow:0 2px 8px #2563eb1a}@media (max-width: 768px){.chat-header{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;position:relative;padding-left:8px}.logo-section{display:flex;align-items:center;gap:8px;flex:1 1 auto}.logo-section .logo{font-size:1.05rem;font-weight:700;letter-spacing:.5px;color:var(--primary-700);max-width:80px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header-actions{display:flex;align-items:center;gap:0;margin-left:8px}.participants-toggle-btn{position:static!important;margin:0!important;padding:0;background:none;border:none;box-shadow:none;display:inline-flex!important;align-items:center;z-index:2}.participants-toggle-btn .avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;background:transparent!important;border:2px solid var(--primary-200, #c7d2fe);box-shadow:0 1px 4px #3b82f614;padding:0}}@media (max-width: 768px){.main-content{padding-top:60px;padding-bottom:0}.messages-section{padding-top:6px;padding-bottom:max(12px,env(safe-area-inset-bottom,12px))}}@media (max-width: 768px){.main-content{padding-top:0!important}.messages-section{padding-top:8px!important}}@media (max-width: 768px){.chat-header,.input-section{pointer-events:none}.chat-header .logo-section,.chat-header .header-actions,.chat-header .header-actions *,.chat-header .participants-toggle-btn,.chat-header .settings-btn,.chat-header .end-room-mobile,.chat-header .room-info,.input-section .input-bar,.input-section .input-bar *,.input-section .send-button-outer,.input-section .attach-button,.input-section .input-content-container,.input-section .hidden-file-input,.input-section .remove-file-button{pointer-events:auto}.messages-section{position:relative;z-index:0;-webkit-overflow-scrolling:touch}}.welcome-wrapper{display:flex;justify-content:center;width:100%;margin-top:6px;margin-bottom:8px}.welcome-bubble{background:#22304a;color:#fff;border-radius:12px;padding:.5rem 1rem;text-align:center;font-family:inherit;font-size:1.02rem;font-weight:500;letter-spacing:.01em;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 2px 8px #22304a14;max-width:520px;width:auto}@media (max-width: 768px){.chat-header{padding:10px 16px}}@media (min-width: 769px){.chat-header{padding:14px 32px}}@media (max-width: 768px){.main-content{margin:0!important;padding:0!important;height:100dvh;min-height:0;position:relative;box-sizing:border-box;overflow:hidden}.messages-section{position:absolute!important;inset:48px 0 68px;padding:8px!important;margin:0!important;box-sizing:border-box;overflow-y:auto!important;-webkit-overflow-scrolling:touch;z-index:0}}.input-section{box-shadow:0 -5px 15px -5px #0000000a;z-index:10}.dark-theme .input-section{box-shadow:0 -5px 20px -5px #0003}.input-bar{border:1.5px solid transparent;transition:border-color .2s ease-in-out,box-shadow .2s ease-in-out}.input-bar:focus-within{border-color:var(--primary);box-shadow:0 0 0 4px rgba(var(--primary-rgb),.1)}.auto-grow-textarea::placeholder{color:var(--muted-text-color);opacity:.7}.attach-button{color:var(--muted-text-color);transition:all .2s cubic-bezier(.4,0,.2,1);rotate:-45deg}.attach-button:hover{color:var(--primary);transform:scale(1.06);background-color:rgba(var(--primary-rgb),.08)}.send-button-outer{transition:all .2s ease-out;transform:scale(1);opacity:1}.send-button-outer:hover:not(:disabled){transform:scale(1.05);box-shadow:0 4px 15px rgba(var(--primary-rgb),.3)}.send-button-outer:active:not(:disabled){transform:scale(.98)}.send-button-outer:disabled{opacity:.5;transform:scale(.9);cursor:not-allowed}.file-preview-chip{display:flex;align-items:center;gap:10px;background-color:var(--received-bubble-bg);color:var(--text-color);padding:6px 8px 6px 12px;border-radius:20px;font-size:.9rem;width:auto;animation:popIn .2s ease-out}@keyframes popIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.file-preview-chip .file-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.remove-file-button{background:var(--surface-200);color:var(--text-color);border:none;border-radius:50%;width:22px;height:22px;display:flex;align-items:center;justify-content:center;font-size:14px;line-height:1;cursor:pointer;transition:background-color .2s ease,transform .2s ease}.remove-file-button:hover{background-color:#ef4444;color:#fff;transform:scale(1.1) rotate(90deg)}.chat-input-error{position:absolute;bottom:100%;left:50%;transform:translate(-50%);background-color:#ef4444;color:#fff;padding:8px 16px;border-radius:8px 8px 0 0;font-size:.9rem;font-weight:500;box-shadow:0 -4px 10px #0000001a;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translate(-50%,100%)}to{transform:translate(-50%)}}.message-bubble:hover{transform:translateY(-1px);box-shadow:0 4px 8px #00000014;cursor:pointer}.message-row,.message-wrapper{position:relative}.message-actions-toolbar{position:absolute;top:6px;display:flex;gap:4px;background-color:var(--background-color);padding:4px;border-radius:18px;box-shadow:0 5px 15px #0000001a;border:1px solid var(--border-color);z-index:2;opacity:0;transform:translateY(4px) scale(.95);transition:all .15s ease-out;pointer-events:none}.message-wrapper:hover .message-actions-toolbar,.message-wrapper:focus-within .message-actions-toolbar{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}.message-row.sent .message-wrapper .message-actions-toolbar{right:-15px;top:-15px;left:auto}.message-row.received .message-wrapper .message-actions-toolbar{right:-15px;top:15px;left:auto}@media (hover: none){.message-actions-toolbar{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}}.message-actions-toolbar button{background:transparent;border:none;color:var(--muted-text-color);width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.message-actions-toolbar button:hover{background-color:var(--surface-100);color:var(--primary);transform:scale(1.1)}.message-actions-toolbar button span{font-size:1.2rem}.emoji-button{color:var(--muted-text-color);width:44px;height:44px;border-radius:50%;transition:color .2s ease,background-color .2s ease;display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;flex-shrink:0}.emoji-button:hover{color:var(--primary);background-color:rgba(var(--primary-rgb),.08)}.emoji-picker-container{position:absolute;bottom:calc(100% + 12px);left:8px;z-index:20;opacity:0;transform:translateY(10px) scale(.98);transform-origin:bottom left;transition:all .2s cubic-bezier(.4,0,.2,1);pointer-events:none}.emoji-picker-container.open{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}.emoji-picker-container:after{content:"";position:absolute;top:100%;left:24px;width:0;height:0;border:8px solid transparent;border-top-color:var(--border-color)}.EmojiPickerReact{--epr-bg-color: var(--background-color) !important;--epr-text-color: var(--text-color) !important;--epr-search-input-bg-color: var(--input-bg) !important;--epr-border-color: var(--border-color) !important;--epr-category-label-bg-color: var(--background-color) !important;--epr-hover-bg-color: var(--surface-100) !important;border-radius:12px!important;border:1px solid var(--border-color)!important;box-shadow:0 8px 25px -5px #0000001a!important;animation:fadeIn .2s ease-out}.dark-theme .EmojiPickerReact{box-shadow:0 8px 25px -5px #0000004d!important}.EmojiPickerReact .epr-search-container input{background-color:var(--input-bg)!important;color:var(--text-color)!important;border:1px solid var(--border-color)!important;border-radius:8px!important;padding:6px 40px;font-size:.9rem;box-shadow:none!important}.EmojiPickerReact .epr-search-container input::placeholder{color:var(--muted-text-color)!important}.EmojiPickerReact .epr-categories{padding:6px 12px 0!important;border-bottom:1.5px solid var(--border-color);margin-bottom:6px;background-color:var(--background-color)!important}.EmojiPickerReact .epr-cat-btn{color:var(--muted-text-color);opacity:.8;background:transparent!important;transition:all .2s ease;border:none!important;border-radius:8px!important}.EmojiPickerReact .epr-cat-btn:hover{opacity:1;color:var(--text-color);background-color:var(--surface-100)!important}.EmojiPickerReact .epr-category-active{opacity:1;color:var(--primary)!important;background-color:rgba(var(--primary-rgb),.1)!important}.EmojiPickerReact .epr-emoji-category-content{padding:6px 8px!important}.EmojiPickerReact .epr-emoji{transition:transform .1s ease}.EmojiPickerReact .epr-emoji:hover{transform:scale(1.15);background:var(--surface-100)!important;border-radius:6px}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.message-row.received .message-bubble{background:var(--sent-bubble-bg);color:var(--sent-bubble-text);border-bottom-left-radius:4px;border:1px solid transparent}.message-row.sent .message-bubble{background:var(--sent-bubble-bg);color:var(--sent-bubble-text);border-bottom-right-radius:4px;border:1px solid transparent}.dark-theme .message-row.received .message-bubble,.dark-theme .message-row.sent .message-bubble{background:var(--sent-bubble-bg);color:var(--sent-bubble-text);border:1px solid transparent}:root{--received-bubble-bg: #f1f1f1;--received-bubble-text: #111827;--sent-bubble-bg: #E0F2FE;--sent-bubble-text: #ffffff}:root{--sent-bubble-bg: #007AFF;--sent-bubble-text: #ffffff}.dark-theme{--received-bubble-bg: #2a2f3d;--received-bubble-text: #e5e7eb;--sent-bubble-bg: #2b9cff;--sent-bubble-text: #ffffff}.dark-theme{--sent-bubble-bg: #3B82F6;--sent-bubble-text: #ffffff}:root{--background-color: #ffffff;--header-bg: #ffffff;--input-bg: #ffffff;--sent-bubble-bg: #E0F2FE;--sent-bubble-text: #0D47A1}.code-header{position:sticky;top:0;background:var(--code-header-bg);z-index:10;display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-bottom:1px solid var(--code-border)}.code-content{max-height:400px;overflow-y:auto}.show-more-btn{background:var(--primary);color:#fff;border:none;border-radius:4px;padding:6px 12px;cursor:pointer;font-size:.85rem;margin:8px}.show-more-btn:hover{background:var(--primary-600)}.show-more-btn:active{background:var(--primary-700)}.message-text-content{margin:0;padding:0;display:block}.message-wrapper{gap:0!important}.message-sender{margin-bottom:0!important}.message-bubble{display:flex!important;flex-direction:column!important;justify-content:flex-start!important;padding-top:10px!important}.message-bubble p,.message-bubble>.text-content,.message-bubble .message-text-content,.message-bubble .text-content p{margin-top:0!important;margin-bottom:0!important;padding-top:0!important}.message-bubble .link-previews-container,.message-bubble .link-preview{margin-top:0!important;padding-top:0!important}.message-wrapper .message-actions-toolbar{position:absolute!important;top:6px;right:8px;left:auto;z-index:40}body.debug-borders .message-wrapper{outline:2px dashed rgba(255,0,0,.35)}body.debug-borders .message-sender{outline:2px dashed rgba(0,128,0,.35)}body.debug-borders .message-bubble{outline:2px dashed rgba(0,0,255,.35)}body.debug-borders .message-bubble p{outline:1px dashed rgba(255,165,0,.35)}.participants-section .close-participants-btn,.close-participants-btn{width:40px!important;height:40px!important;padding:0!important;border-radius:50%!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;background-clip:padding-box!important;transform-origin:center center!important;-webkit-transform-origin:center center!important;line-height:0!important}.participants-section .close-participants-btn svg,.close-participants-btn svg{width:18px!important;height:18px!important;display:block!important;transform-origin:center center!important}.close-participants-btn:hover{border-radius:50%!important;transform:scale(1.06)!important}.messages-scroller{position:absolute;top:0;left:0;width:100%;height:100%;overflow-y:auto;overflow-x:hidden;padding:8px 12px;display:flex;flex-direction:column;gap:4px}.messages-section{position:relative;overflow:hidden;z-index:1}.messages-section .engaging-background,.messages-section .animated-background{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;pointer-events:none;z-index:-1}.messages-section .particle{position:absolute;border-radius:50%;animation:fall linear infinite;opacity:0;width:3px;height:3px}@keyframes fall{to{transform:translateY(100vh);opacity:1}}.dark-theme .messages-section{background-color:#0c0a18}.dark-theme .messages-section .particle{background:#fff;box-shadow:0 0 8px #fff,0 0 16px #fff,0 0 24px #0af,0 0 32px #0af}.dark-theme .messages-section .animated-background{background:transparent;background-image:radial-gradient(2px 2px at 20px 30px,rgba(173,216,230,1),transparent),radial-gradient(2.5px 2.5px at 80px 70px,rgba(221,160,221,.9),transparent),radial-gradient(2px 2px at 150px 160px,rgba(255,255,255,1),transparent),radial-gradient(2.5px 2.5px at 210px 100px,rgba(135,206,250,.9),transparent),radial-gradient(2px 2px at 280px 50px,rgba(255,255,255,.95),transparent);background-size:300px 300px;background-position:0 0;animation:twinkle 10s infinite linear}.light-theme .messages-section{background-color:#eaf2f8}.light-theme .messages-section .particle{background:#334155;width:4px;height:4px;box-shadow:0 0 10px #00000080}.light-theme .messages-section .animated-background{background:transparent;background-image:radial-gradient(2.5px 2.5px at 50px 50px,rgba(0,86,179,.85),transparent),radial-gradient(3px 3px at 150px 120px,rgba(112,128,144,.9),transparent),radial-gradient(2.5px 2.5px at 250px 200px,rgba(30,144,255,.85),transparent),radial-gradient(2px 2px at 320px 80px,rgba(112,128,144,.8),transparent);background-size:350px 350px;background-position:0 0;animation:twinkle 12s infinite linear}@keyframes twinkle{0%{background-position:0 0}to{background-position:-800px -800px}}.about-content{background-color:#0f172acc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:1rem;padding:2.5rem;width:100%;max-width:1024px;text-align:center;border:1px solid rgba(59,130,246,.3);box-shadow:0 0 25px #3b82f640;animation:fade-in .6s ease-out forwards}.team-card{background-color:transparent;height:380px;perspective:1500px;border:none;transition:transform .3s ease,box-shadow .3s ease}.team-card-back{transform:rotateY(180deg);justify-content:flex-start;padding:1.5rem;overflow-y:auto}.skills-title:hover{color:#f8fafc;border-color:#3b82f6b3; box-shadow:0 0 15px rgba(59,130,246,.3);cursor:pointer}.team-card-back::-webkit-scrollbar{width:6px}.team-card-back::-webkit-scrollbar-track{background:#0f172a80;border-radius:10px}.team-card-back::-webkit-scrollbar-thumb{background:#3b82f6;border-radius:10px}.team-card-back::-webkit-scrollbar-thumb:hover{background:#2563eb}.back-link{display:inline-block;color:#cbd5e1;text-decoration:none;transition:color .3s;margin-top:1rem}.about-title{font-size:2.5rem;font-weight:800;color:#3b82f6;margin-bottom:1rem}.team-title{font-size:2rem;font-weight:700;margin-bottom:2rem;border-top:1px solid rgba(255,255,255,.1);padding-top:2.5rem}.back-link{display:inline-flex;align-items:center;gap:.5rem;color:#cbd5e1;text-decoration:none;background-color:#3b82f61a;padding:.5rem 1rem;border-radius:999px;border:1px solid rgba(59,130,246,.3);transition:all .3s ease}.about-container{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:80px 2rem 2rem;color:#f8fafc;box-sizing:border-box}.about-content{background-color:#0f172acc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:1rem;padding:2.5rem;width:100%;max-width:1024px;text-align:center;border:1px solid rgba(59,130,246,.3);box-shadow:0 0 25px #3b82f640;animation:fade-in .6s ease-out forwards;transition:box-shadow .3s ease,border .3s ease}.about-content:hover{border:1px solid rgba(59,130,246,.5);box-shadow:0 0 35px #3b82f666}.about-title{font-size:2.5rem;font-weight:800;margin-bottom:1rem;color:#3b82f6;text-align:center}.about-description{font-size:1.125rem;line-height:1.7;color:#cbd5e1;max-width:800px;margin:0 auto 3rem}.team-title{font-size:2rem;font-weight:700;margin-bottom:2rem;border-top:1px solid rgba(255,255,255,.1);padding-top:2.5rem;color:#3b82f6}.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-bottom:3rem}.team-card{background-color:transparent;min-height:380px;height:auto;perspective:1500px;border:none;transition:transform .3s ease,box-shadow .3s ease}.team-card:hover{transform:translateY(-8px);box-shadow:0 10px 30px #3b82f633}.team-card-inner{position:relative;width:100%;height:100%;transition:transform .7s;transform-style:preserve-3d}.team-card-inner.is-flipped{transform:rotateY(180deg)}.team-card-front,.team-card-back{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:.75rem;background-color:#1e293be6;border:1px solid rgba(255,255,255,.1);box-sizing:border-box;padding:2rem;display:flex;flex-direction:column;align-items:center;justify-content:center}.team-card-back{transform:rotateY(180deg);justify-content:flex-start;padding:1.5rem}.skills-title{font-size:1.25rem;font-weight:600;color:#94a3b8;border:1px solid rgba(59,130,246,.3);padding:.5rem 1.5rem;border-radius:999px;margin-bottom:1.5rem;transition:color .3s ease,border-color .3s ease,box-shadow .3s ease}.skills-title:hover{color:#f8fafc;border-color:#3b82f6b3;box-shadow:0 0 15px #3b82f64d;cursor:pointer}.skills-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;width:100%}.skill-item{background-color:#0f172acc;border:1px solid rgba(255,255,255,.1);border-radius:.5rem;padding:.5rem .75rem;display:flex;align-items:center;gap:.75rem;transition:all .3s ease}.skill-item:hover{transform:scale(1.05);border-color:#3b82f680;box-shadow:0 4px 20px #3b82f633;cursor:pointer}.skill-icon{font-size:1.25rem;width:20px;text-align:center;flex-shrink:0;transition:color .3s ease}.skill-item:hover .skill-icon{color:#3b82f6}.skill-name{font-size:.875rem;color:#cbd5e1;font-weight:500}.flip-icon-btn{position:absolute;top:1rem;right:1rem;background:none;border:none;color:#94a3b8;font-size:1.25rem;cursor:pointer;z-index:2;opacity:0;transition:opacity .3s ease,color .3s ease,transform .3s ease}.flip-icon-btn:hover{color:#3b82f6;transform:scale(1.1) rotate(90deg)}.team-avatar{width:150px;height:150px;border-radius:50%;border:3px solid #3b82f6;margin-bottom:1rem;background-color:#0f172a;object-fit:cover}.team-member-name{font-size:1.25rem;font-weight:600;margin:0}.team-member-role{color:#94a3b8;margin:.25rem 0 1rem}.social-links{display:flex;justify-content:center;gap:1.5rem}.social-links a{color:#cbd5e1;font-size:1.5rem;transition:color .3s ease,transform .3s ease}.social-links a:hover{color:#3b82f6;transform:scale(1.2)}.back-link{display:inline-flex;align-items:center;gap:.5rem;color:#cbd5e1;text-decoration:none;background-color:#3b82f61a;padding:.5rem 1rem;border-radius:999px;border:1px solid rgba(59,130,246,.3);transition:all .3s ease;margin-top:1rem}.back-link:hover{color:#fff;background-color:#3b82f64d;box-shadow:0 0 15px #3b82f64d}@media (max-width: 768px){.about-container{padding:30px 1rem 2rem}.about-content{padding:1.5rem}.about-title,.team-title{font-size:2rem}.team-grid{grid-template-columns:1fr;gap:1.5rem}}.team-card:hover .flip-icon-btn{opacity:1}@media (max-width: 768px){.flip-icon-btn{opacity:1}}.software-tester-card .skills-grid{gap:8px}.software-tester-card .skill-item{padding:8px;font-size:1rem}.software-tester-card .skill-icon{font-size:1rem}.software-tester-card .team-card-back{overflow-y:hidden}.software-tester-card .skills-grid,.data-specialist-card .skills-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px}.software-tester-card .skill-item,.data-specialist-card .skill-item{display:flex;align-items:center;gap:8px;padding:6px 10px;font-size:.85rem;border-radius:6px;background-color:#1e2a46b3}.software-tester-card .skill-icon,.data-specialist-card .skill-icon{font-size:1.1em}.software-tester-card .team-card-back,.data-specialist-card .team-card-back{overflow-y:hidden}.team-avatar{border-radius:50%;background-size:cover;background-position:center;background-repeat:no-repeat}.contact-container{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:25px 2rem 2rem;box-sizing:border-box}.contact-content{background-color:#0f172acc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:1rem;padding:2.5rem;width:100%;max-width:600px;border:1px solid rgba(59,130,246,.3);box-shadow:0 0 25px #3b82f640;animation:fade-in .6s ease-out forwards}.contact-title{font-size:2.5rem;font-weight:800;color:#3b82f6;text-align:center;margin-bottom:.5rem}.contact-description{font-size:1.125rem;text-align:center;color:#cbd5e1;margin-bottom:2.5rem}.contact-form{display:flex;flex-direction:column;gap:1.5rem}.form-group{display:flex;flex-direction:column}.form-group label{margin-bottom:.5rem;font-weight:500;color:#cbd5e0}.form-group input,.form-group textarea{width:100%;padding:.75rem 1rem;background-color:#1a294d;border:1px solid #3a4a75;border-radius:8px;color:#f8fafc;font-size:1rem;transition:border-color .3s,box-shadow .3s;box-sizing:border-box}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f64d}.form-group textarea{resize:vertical;min-height:120px}.submit-btn{margin-top:1rem;font-size:1.125rem!important;padding:.875rem 1.5rem!important}.back-link{display:block;text-align:center;margin-top:1rem;color:#cbd5e1;text-decoration:none;transition:color .3s}.back-link:hover{color:#fff}@keyframes fade-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@media (max-width: 768px){.contact-container{padding:0 1rem 2rem}.contact-content{padding:1.5rem}.contact-title{font-size:2rem}.contact-description{font-size:1rem;margin-bottom:2rem}}@media (min-width: 769px){.contact-content{max-width:800px;padding:3rem}.form-row{display:flex;gap:1.5rem}.form-row .form-group{flex:1}.form-group input:focus,.form-group textarea:focus{transform:translateY(-2px);box-shadow:0 0 0 3px #3b82f666,0 5px 10px #0003}.submit-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #3b82f666}.contact-title{animation:fade-in .5s .1s ease-out forwards backwards}.contact-description{animation:fade-in .5s .2s ease-out forwards backwards}.contact-form .form-row{animation:fade-in .5s .3s ease-out forwards backwards}.contact-form .form-group:not(.form-row .form-group){animation:fade-in .5s .4s ease-out forwards backwards}.submit-btn{animation:fade-in .5s .5s ease-out forwards backwards}.back-link{animation:fade-in .5s .6s ease-out forwards backwards}}.form-group{position:relative}.input-icon{position:absolute;left:1rem;top:.85rem;width:24px;height:24px;color:#64748b;transition:color .3s ease}.form-group input,.form-group textarea{padding-left:3.5rem}.form-group label{position:absolute;top:.85rem;left:3.5rem;color:#94a3b8;pointer-events:none;transition:all .3s ease}.form-group input:focus+label,.form-group input:not(:placeholder-shown)+label,.form-group textarea:focus+label,.form-group textarea:not(:placeholder-shown)+label{transform:translateY(-1.75rem) translate(-.25rem) scale(.85);color:#3b82f6;background-color:#121d3a;padding:0 .25rem}.form-group input:focus~.input-icon,.form-group textarea:focus~.input-icon{color:#3b82f6}.submit-btn{position:relative;overflow:hidden;transition:all .3s ease}.submit-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transition:left .5s ease}.submit-btn:hover:before{left:100%}.submit-btn:disabled{background:#3a4a75;cursor:not-allowed}.background-container{position:fixed;top:0;left:0;width:100%;height:100vh;z-index:-1;overflow:hidden;background-color:#0c1427}.stars{background-image:radial-gradient(1px 1px at 20px 30px,#eee,#0000),radial-gradient(1px 1px at 40px 70px,#fff,#0000),radial-gradient(1px 1px at 50px 160px,#ddd,#0000),radial-gradient(1px 1px at 90px 40px,#fff,#0000),radial-gradient(2px 2px at 150px 120px,#ddd,#0000),radial-gradient(2px 2px at 120px 200px,#fff,#0000);background-repeat:repeat;background-size:200px 200px;position:absolute;inset:0;opacity:0;animation:twinkle 5s infinite}.stars2{background-size:300px 300px;animation-duration:7s;animation-delay:1s}.stars3{background-size:400px 400px;animation-duration:9s;animation-delay:2s}@keyframes twinkle{0%{opacity:0}50%{opacity:.7}to{opacity:0}}.shooting-stars{position:absolute;top:0;left:0;width:100%;height:100%;transform:rotate(45deg)}.shooting-star{position:absolute;background:linear-gradient(-45deg,#3b82f6,#00f0);width:150px;height:2px;border-radius:999px;filter:drop-shadow(0 0 6px #699bff);opacity:0;animation:shoot 3s ease-out infinite}.shooting-star:nth-child(1){top:10%;left:30%;animation-delay:1.2s}.shooting-star:nth-child(2){top:20%;left:80%;animation-delay:0s}.shooting-star:nth-child(3){top:50%;left:10%;animation-delay:2.5s}.shooting-star:nth-child(4){top:90%;left:60%;animation-delay:4.1s}.shooting-star:nth-child(5){top:60%;left:40%;animation-delay:5.8s}@keyframes shoot{0%{transform:translate(-500px);opacity:0}20%{opacity:1}80%{opacity:1}to{transform:translate(500px);opacity:0}}.back-button{position:fixed;top:1.5rem;left:1.5rem;z-index:100;width:50px;height:50px;border-radius:50%;background-color:#1e293bb3;border:1px solid rgba(59,130,246,.3);color:#f8fafc;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:all .3s ease;padding:0;box-shadow:0 4px 15px #0003}.back-button svg{width:1.5rem;height:1.5rem}.back-button:hover{background-color:#3b82f680;border-color:#3b82f6b3;transform:scale(1.1);box-shadow:0 0 20px #3b82f666}@media (max-width: 639px){.back-button{display:none}}.error404-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1a1a2e,#16213e);position:relative;overflow:hidden}.error404-bg{position:absolute;top:0;left:0;width:100vw;height:100vh;background:url(/assets/home_pc-C3JmJDA3.png) center/cover no-repeat;opacity:.08;z-index:0}.error404-content{z-index:1;background:linear-gradient(120deg,#222831d1 60%,#e945601a);border-radius:36px;box-shadow:0 16px 64px #00000061,0 2px 12px #e945601a;padding:0 56px 56px;text-align:center;max-width:950px;max-height:650px;width:98vw;backdrop-filter:blur(18px) saturate(180%) brightness(1.12);-webkit-backdrop-filter:blur(18px) saturate(180%) brightness(1.12);border:2.5px solid rgba(233,69,96,.22);transition:box-shadow .2s,border .2s,background .2s;overflow:hidden;position:relative}.error404-title{font-size:6.5rem;font-weight:900;color:#e94560;margin-bottom:.1em;letter-spacing:.14em;font-family:Montserrat,Segoe UI,Arial,sans-serif;text-shadow:0 6px 40px rgba(233,69,96,.22);animation:error404-pop 1.2s cubic-bezier(.68,-.55,.27,1.55) 1}@keyframes error404-pop{0%{transform:scale(.7) rotate(-8deg);opacity:0}60%{transform:scale(1.1) rotate(2deg);opacity:1}to{transform:scale(1) rotate(0);opacity:1}}.error404-subtitle{font-size:2.6rem;color:#fff;margin-bottom:1.3em;font-family:Montserrat,Segoe UI,Arial,sans-serif;font-weight:700;letter-spacing:.05em;text-shadow:0 2px 12px rgba(34,40,49,.18)}.error404-message{color:#e0e0e0;font-size:1.3rem;margin-bottom:2.8em;line-height:1.8;font-family:Segoe UI,Arial,sans-serif;text-shadow:0 1px 8px rgba(34,40,49,.1)}.error404-home-btn{display:inline-flex;align-items:center;justify-content:center;gap:.7em;padding:1.1em 2.8em;background:linear-gradient(270deg,#e94560,#0f3460,#e94560);background-size:400% 400%;color:#fff;font-weight:900;border-radius:18px;text-decoration:none;font-size:1.3rem;box-shadow:0 8px 32px #e9456047,0 0 0 4px #e945601f;border:2px solid rgba(233,69,96,.22);outline:none;letter-spacing:.05em;position:relative;overflow:hidden;cursor:pointer;transition:background .3s,transform .2s,box-shadow .2s,border .2s;animation:error404-btn-gradient 3s ease infinite}@keyframes error404-btn-gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.error404-home-btn:after{content:"";position:absolute;inset:0;background:radial-gradient(circle,#e945602e,#22283114);opacity:0;transition:opacity .3s;border-radius:18px;z-index:0;pointer-events:none}.error404-home-btn:hover:after{opacity:1}.error404-home-btn:hover{background:linear-gradient(270deg,#0f3460,#e94560,#0f3460);transform:translateY(-5px) scale(1.09);box-shadow:0 16px 48px #e9456052,0 0 0 6px #e945602e;border-color:#e94560}@media (max-width: 600px){.error404-content{padding:18px 2px;max-width:99vw}.error404-title{font-size:3.5rem}.error404-subtitle{font-size:1.4rem}}
