@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&display=swap";:root{--bg-app: #f8fafc;--bg-chat: #ffffff;--sidebar-bg: rgba(255, 255, 255, .7);--navbar-bg: rgba(255, 255, 255, .8);--border-color: rgba(0, 0, 0, .08);--glass-bg: rgba(255, 255, 255, .6);--glass-border: rgba(0, 0, 0, .05);--glass-input: rgba(0, 0, 0, .03);--glass-header: rgba(255, 255, 255, .8);--primary-color: #0084ff;--accent-gradient: linear-gradient(135deg, #00c6ff 0%, #0072ff 100%);--primary-gradient: linear-gradient(135deg, #00c6ff 0%, #0072ff 100%);--text-main: #1a1a1b;--text-secondary: #64748b;--text-inverse: #ffffff;--msg-sent: #0084ff;--msg-sent-text: #ffffff;--msg-received: rgba(0, 0, 0, .05);--msg-received-text: #1a1a1b;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 15px rgba(0, 0, 0, .08)}body.dark-mode{--bg-app: #000000;--bg-chat: #000000;--sidebar-bg: rgba(0, 0, 0, .8);--navbar-bg: rgba(0, 0, 0, .9);--border-color: rgba(255, 255, 255, .08);--glass-bg: rgba(255, 255, 255, .03);--glass-border: rgba(255, 255, 255, .06);--glass-input: rgba(255, 255, 255, .05);--glass-header: rgba(0, 0, 0, .95);--primary-color: #8b5cf6;--accent-gradient: linear-gradient(135deg, #7c3aed 0%, #4c1d95 100%);--primary-gradient: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);--text-main: #ffffff;--text-secondary: #94a3b8;--text-inverse: #000000;--msg-sent: #7c3aed;--msg-sent-text: #ffffff;--msg-received: rgba(255, 255, 255, .07);--msg-received-text: #f8fafc}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background-color:var(--bg-app);color:var(--text-main);min-height:100vh;overflow:hidden;transition:background-color .3s ease,color .3s ease}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#6c63ff4d;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#6c63ff99}.app-container{height:100vh;display:flex;flex-direction:column;overflow:hidden;background-color:var(--bg-app)}.App{width:95%;max-width:1100px;height:90vh;background:var(--glass-bg);box-shadow:var(--glass-shadow);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:20px;border:1px solid var(--glass-border);display:flex;flex-direction:column;overflow:hidden;position:relative;animation:app-enter .6s cubic-bezier(.22,1,.36,1)}@keyframes app-enter{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}@media(max-width:768px){.App{width:100%;height:100vh;border-radius:0}}.login-room{position:relative;width:100vw;height:100vh;overflow:hidden;font-family:Inter,sans-serif;background:radial-gradient(circle at 50% 30%,#2b2b2b,#1a1a1a 40%,#000);transition:all 1.2s ease-in-out;display:flex;justify-content:center;align-items:center;animation:loginFadeIn 1s ease-out forwards}@keyframes loginFadeIn{0%{opacity:0}to{opacity:1}}.login-room.light-on{background:radial-gradient(circle at 50% 30%,#e8dcb9,#b8a688 30%,#5e4f3b)}.login-room.light-off{background:radial-gradient(circle at 50% 30%,#222,#111,#050505)}.lamp-container{position:absolute;top:0;left:50%;transform:translate(-50%);z-index:20;display:flex;flex-direction:column;align-items:center}.wire{width:4px;background:linear-gradient(90deg,#555,#222,#555);box-shadow:2px 0 5px #00000080;transform-origin:top center;will-change:height,transform}.lamp-shade{position:relative;width:140px;height:90px;background:linear-gradient(135deg,#333,#1a1a1a);border-radius:70px 70px 10px 10px;z-index:21;box-shadow:inset 0 -5px 10px #000c,0 10px 30px #000c}.light-on .lamp-shade{background:linear-gradient(135deg,#444,#2a2a2a)}.light-beam{position:absolute;top:80px;left:50%;transform:translate(-50%) perspective(600px) rotateX(20deg);width:200px;height:0;background:linear-gradient(to bottom,#ffffe666,#ffffe600);clip-path:polygon(20% 0%,80% 0%,100% 100%,0% 100%);transition:height .6s cubic-bezier(.25,.46,.45,.94),opacity .6s ease;opacity:0;pointer-events:none;filter:blur(15px);z-index:5}.light-beam.on{height:80vh;opacity:1}.ambient-glow{position:absolute;inset:0;background:radial-gradient(circle at 50% 40%,rgba(255,200,100,.15),transparent 70%);opacity:0;transition:opacity 1s ease;pointer-events:none;z-index:1}.ambient-glow.on{opacity:1}.pull-cord{position:absolute;top:60px;left:50%;width:2px;background:repeating-linear-gradient(45deg,#666,#666 2px,#444 2px 4px);transform:translate(-50%);cursor:grab;z-index:22;touch-action:none}.pull-handle{position:absolute;bottom:-15px;left:50%;transform:translate(-50%);width:20px;height:30px;background:radial-gradient(circle at 30% 30%,#ff6b6b,#c0392b);border-radius:10px 10px 15px 15px;cursor:grab;box-shadow:0 4px 6px #0006}.pull-cord:active,.pull-handle:active{cursor:grabbing}.login-form-container{opacity:0;transform:translateY(30px) scale(.95);transition:opacity .8s ease .2s,transform .8s cubic-bezier(.19,1,.22,1) .2s;z-index:15;pointer-events:none}.light-on .login-form-container{opacity:1;transform:translateY(0) scale(1);pointer-events:all}.login-card{background:#28282866;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);padding:3.5rem;border-radius:24px;border:1px solid rgba(255,255,255,.1);box-shadow:0 25px 50px -12px #00000080;text-align:center;max-width:420px;width:100%;color:#fff}.light-on .login-card{background:#ffffff59;border:1px solid rgba(255,255,255,.4);box-shadow:0 20px 60px #00000026;color:#333}.login-card h1{margin-bottom:.5rem;font-weight:700;font-size:2.8rem;letter-spacing:-1px;color:inherit}.login-card p{color:#ffffffb3;margin-bottom:2.5rem;font-size:1.1rem;font-weight:300}.light-on .login-card p{color:#0009}.google-btn{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:16px;border:none;background:#111;color:#fff;font-size:1.1rem;font-weight:500;border-radius:14px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #0003}.light-on .google-btn{background:#000}.google-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #0000004d}.google-btn:active{transform:translateY(0)}.google-btn.loading{background:#222;cursor:not-allowed;opacity:.8}.login-loader{width:24px;height:24px;border:3px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#fff;animation:spin 1s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}.google-icon{font-size:1.6rem;background:#fff;border-radius:50%;padding:2px}.error-message{background:#ff00001a;color:#ff6b6b;padding:10px;border-radius:8px;margin-bottom:1rem;font-size:.9rem;border:1px solid rgba(255,0,0,.2)}.floor-spotlight{display:none}.pull-instruction{margin-top:180px;text-align:center;color:#fff6;font-size:.9rem;pointer-events:none;opacity:1;transition:opacity .5s;letter-spacing:4px;text-transform:uppercase;font-weight:300;animation:pulse 3s infinite;z-index:10}.light-on .pull-instruction{opacity:0;animation:none}@keyframes pulse{0%,to{opacity:.2}50%{opacity:.5}}@media(max-width:600px){.login-card{padding:2rem;width:90%}.lamp-shade{width:120px;height:80px}}.message-wrapper{display:flex;margin-bottom:4px;width:100%;position:relative;max-width:85%}.message-wrapper.sent{flex-direction:row-reverse;align-self:flex-end}.message-wrapper.received{align-self:flex-start}.message-avatar{width:32px;height:32px;border-radius:10px;margin-right:8px;margin-top:auto;border:1.5px solid var(--glass-border)}.message-content-wrapper{display:flex;flex-direction:column;max-width:100%;position:relative}.message-bubble{padding:10px 14px;border-radius:20px;font-size:.95rem;line-height:1.4;position:relative;transition:all .2s ease;box-shadow:0 2px 8px #0000000d;z-index:2}.message-wrapper.sent .message-bubble{background:var(--msg-sent);color:var(--msg-sent-text);border-bottom-right-radius:4px}.message-wrapper.received .message-bubble{background:var(--msg-received);color:var(--msg-received-text);border-bottom-left-radius:4px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border)}.message-text{margin:0;word-break:break-all}.message-meta{display:flex;align-items:center;justify-content:flex-end;gap:4px;margin-top:4px;font-size:.7rem;opacity:.7}.message-wrapper.sent .message-meta{color:var(--msg-sent-text)}.message-wrapper.received .message-meta{color:var(--text-secondary)}.read-status.read{color:#4ade80}.audio-message{display:flex;align-items:center;gap:12px;padding:4px 0}.audio-play-btn{width:36px;height:36px;border-radius:50%;border:none;background:#fff3;color:currentColor;display:flex;align-items:center;justify-content:center;font-size:1.2rem;cursor:pointer;transition:all .2s}.audio-play-btn:hover{background:#ffffff4d}.audio-wave{display:flex;align-items:center;gap:3px;height:20px}.wave-bar{width:3px;height:12px;background:currentColor;border-radius:2px;opacity:.5}.wave-bar.animating{animation:waveBounce .8s infinite ease-in-out}.wave-bar:nth-child(2){animation-delay:.1s}.wave-bar:nth-child(3){animation-delay:.2s}@keyframes waveBounce{0%,to{height:8px}50%{height:18px}}.media-message{border-radius:12px;overflow:hidden;margin-top:-6px;margin-bottom:-6px}.message-image,.message-video{max-width:100%;max-height:300px;display:block;object-fit:cover}.message-delete-btn{position:absolute;right:102%;top:50%;transform:translateY(-50%);background:transparent;border:none;color:#ff3b30;opacity:0;cursor:pointer;padding:8px;border-radius:50%;transition:all .2s;font-size:1.1rem}.message-wrapper.sent:hover .message-delete-btn{opacity:1;background:#ff3b301a}.message-wrapper.received .message-delete-btn{right:auto;left:105%;color:var(--text-secondary)}.message-wrapper.received:hover .message-delete-btn{opacity:1;background:#0000000d}@media(max-width:768px){.message-wrapper{max-width:90%}.message-delete-btn{display:none}}.mood-hint-container{width:100%;display:flex;justify-content:center;margin-bottom:12px;pointer-events:none;z-index:5}.mood-hint-card{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);padding:6px 14px;border-radius:20px;display:flex;align-items:center;gap:8px;box-shadow:0 4px 15px #0000001a;position:relative;overflow:hidden}.mood-emoji{font-size:1.1rem}.mood-text{font-size:.8rem;color:var(--text-main);font-weight:600;letter-spacing:.2px}.mood-pulse{position:absolute;left:0;top:0;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.05),transparent);animation:moodSweep 4s infinite linear}@keyframes moodSweep{0%{transform:translate(-100%)}to{transform:translate(100%)}}body.light-theme .mood-hint-card{background:#fffc;border-color:#0000000d;box-shadow:0 4px 15px #0000000d}body.light-theme .mood-text{color:#333}.user-list{width:320px;background:var(--sidebar-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-right:1px solid var(--glass-border);display:flex;flex-direction:column;transition:all .4s cubic-bezier(.4,0,.2,1);z-index:100;overflow:hidden;position:relative}.sidebar-ambient{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.3}.sidebar-pulse{position:absolute;top:50%;left:50%;width:200%;height:200%;background:radial-gradient(circle,rgba(var(--primary-color-rgb),.05) 0%,transparent 70%);transform:translate(-50%,-50%);animation:sidebar-ripple 8s infinite ease-in-out}@keyframes sidebar-ripple{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}50%{opacity:1}to{transform:translate(-50%,-50%) scale(1.5);opacity:0}}.sidebar-ambient:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(circle at 20% 30%,var(--primary-color) 1px,transparent 1px),radial-gradient(circle at 80% 60%,#a855f7 1px,transparent 1px),radial-gradient(circle at 40% 80%,var(--primary-color) 1px,transparent 1px);background-size:100px 100px;opacity:.1;animation:particles-drift 20s infinite linear}@keyframes particles-drift{0%{background-position:0 0}to{background-position:100px 100px}}.sidebar-header{display:flex;flex-direction:column;align-items:center;padding:30px 20px 20px;position:relative;z-index:1}.user-profile{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%}.profile-img{width:90px;height:90px;border-radius:50%;object-fit:cover;border:3px solid var(--glass-border);box-shadow:0 8px 16px #0003;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.profile-img:hover{transform:scale(1.05) rotate(2deg)}.user-info{text-align:center;display:flex;flex-direction:column;align-items:center;width:100%}.user-info h3{font-size:1.35rem;font-weight:800;color:var(--text-main);margin:5px 0 2px;letter-spacing:-.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:250px;line-height:1.2}.status-text{font-size:.9rem;color:var(--primary-color);font-weight:500;display:flex;align-items:center;gap:6px;opacity:.9}.status-text:before{content:"";display:block;width:8px;height:8px;border-radius:50%;background-color:#2ecc71;box-shadow:0 0 8px #2ecc71}.sidebar-actions{position:absolute;top:20px;right:20px}.logout-btn{width:38px;height:38px;background:var(--glass-input);border:1px solid var(--glass-border);border-radius:12px;color:var(--text-secondary);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem;transition:all .2s}.logout-btn:hover{background:#ff47571a;color:#ff4757;border-color:#ff4757;transform:translateY(-2px);box-shadow:0 4px 12px #ff475733}.search-bar-container{padding:0 20px 20px}.search-form{background:var(--glass-input)!important;border:1px solid var(--glass-border)!important;border-radius:18px!important;padding:2px 8px!important;box-shadow:0 4px 12px #0000000d;transition:all .3s ease}.search-form:focus-within{transform:translateY(-1px);box-shadow:0 8px 20px rgba(var(--primary-color-rgb),.1);border-color:var(--primary-color)!important}.chats-header{margin-top:10px;padding-bottom:10px!important;border-bottom:1px solid var(--glass-border)}.chats-list{flex:1;overflow-y:auto;padding:15px 15px 20px;list-style:none;margin:0;z-index:1;position:relative}.chats-list::-webkit-scrollbar{width:4px}.chats-list::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:10px}.user-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);margin-bottom:4px;border:1px solid transparent}.user-item:hover{background:var(--glass-input);transform:translate(4px)}.user-item.active{background:var(--msg-received);border:1px solid var(--glass-border)}.user-avatar{width:48px;height:48px;border-radius:14px;object-fit:cover;border:2px solid var(--glass-border)}.user-info{flex:1;display:flex;flex-direction:column;gap:1px;min-width:0}.user-info-top{display:flex;justify-content:space-between;align-items:center}.user-name-list{font-size:.92rem;font-weight:600;color:var(--text-main);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-info-bottom{display:flex;justify-content:space-between;align-items:center}.last-message{font-size:.82rem;color:var(--text-secondary);opacity:.7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}.last-message.unread{color:var(--primary-color);font-weight:600;opacity:1}.unread-badge{background-color:#ff3b30;color:#fff;font-size:.75rem;font-weight:700;min-width:20px;height:20px;border-radius:10px;padding:0 6px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #ff3b304d}.list-header{padding:15px 12px 8px;font-size:.75rem;font-weight:700;text-transform:uppercase;color:var(--primary-color);letter-spacing:.1em}.list-status{padding:30px 20px;text-align:center;color:var(--text-secondary);font-style:italic;font-size:.9rem}@media(max-width:768px){.user-list{position:relative;width:100%;max-width:none;transform:none;box-shadow:none;height:100%;background:transparent}.user-list.is-chat-active:not(.active){display:none}}.empty-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;height:100%;position:relative;overflow:hidden}.empty-state-content{max-width:400px;text-align:center;display:flex;flex-direction:column;align-items:center;z-index:2}.empty-icon-wrapper{width:120px;height:120px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:40px;display:flex;align-items:center;justify-content:center;font-size:4rem;color:var(--primary-color);margin-bottom:30px;position:relative;box-shadow:0 10px 30px #0003}.icon-glow{position:absolute;width:100%;height:100%;background:var(--primary-color);filter:blur(40px);opacity:.15;z-index:-1}.empty-state h2{font-size:1.8rem;margin:0 0 12px;background:linear-gradient(135deg,var(--text-main) 0%,var(--text-secondary) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:700}.empty-state p{color:var(--text-secondary);font-size:1rem;margin-bottom:40px;line-height:1.5}.empty-search-container{width:100%;margin-bottom:25px}.empty-search-box{display:flex;background:var(--glass-input);border:1px solid var(--glass-border);border-radius:16px;padding:6px 6px 6px 16px;align-items:center;gap:12px;transition:all .3s}.empty-search-box:focus-within{border-color:var(--primary-color);background:var(--bg-chat);box-shadow:0 0 20px rgba(var(--primary-color),.1)}.search-icon{font-size:1.2rem;color:var(--text-secondary)}.empty-search-box input{flex:1;background:transparent;border:none;color:var(--text-main);font-size:.95rem;outline:none}.empty-search-box button{background:var(--accent-gradient);color:#fff;border:none;padding:10px 20px;border-radius:12px;font-weight:600;cursor:pointer;transition:all .2s}.empty-search-box button:disabled{opacity:.5;cursor:not-allowed}.suggestions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.suggestion-tag{background:var(--glass-bg);border:1px solid var(--glass-border);padding:6px 14px;border-radius:100px;font-size:.85rem;color:var(--text-secondary);cursor:pointer;transition:all .2s}.bottom-hints{position:absolute;bottom:40px;display:flex;gap:40px}.hint-item{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--text-secondary)}.hint-item svg{font-size:1rem;color:var(--primary-color)}@media(max-width:768px){.empty-state h2{font-size:1.5rem}.bottom-hints{bottom:20px;gap:20px}}.group-add-icon{font-size:1.5rem;color:var(--primary-color)}:root{--header-height: 70px}.chat-room{display:flex;height:calc(100vh - 60px);background:var(--bg-app);overflow:hidden;position:relative;transition:background .3s ease}.chat-box{flex:1;display:flex;flex-direction:column;height:100%;position:relative;background:var(--bg-chat);overflow:hidden}.chat-content-container{display:flex;flex-direction:column;height:100%;width:100%;z-index:2;position:relative}.chat-bg-mesh{position:absolute;inset:0;z-index:1;opacity:.4;pointer-events:none;background:radial-gradient(at 0% 0%,rgba(var(--primary-color-rgb, 124, 58, 237),.1) 0px,transparent 50%),radial-gradient(at 100% 0%,rgba(124,58,237,.05) 0px,transparent 50%),radial-gradient(at 100% 100%,rgba(var(--primary-color-rgb, 124, 58, 237),.1) 0px,transparent 50%),radial-gradient(at 0% 100%,rgba(124,58,237,.05) 0px,transparent 50%);animation:mesh-move 20s infinite alternate linear}@keyframes mesh-move{0%{transform:scale(1) rotate(0)}to{transform:scale(1.1) rotate(2deg)}}.chat-bg-ambient{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none}.orb{position:absolute;border-radius:50%;filter:blur(120px);opacity:.12;transition:background 1s ease}.orb-1{width:450px;height:450px;background:var(--primary-color);top:-150px;left:-100px;animation:orb-drift 30s infinite alternate ease-in-out}.orb-2{width:600px;height:600px;background:#c084fc;bottom:-200px;right:-150px;animation:orb-drift 40s infinite alternate-reverse ease-in-out;animation-delay:-5s}.orb-3{width:350px;height:350px;background:#818cf8;top:35%;right:10%;animation:orb-drift 25s infinite alternate ease-in-out;animation-delay:-12s}@keyframes orb-drift{0%{transform:translate(0) scale(1) rotate(0)}33%{transform:translate(60px,40px) scale(1.05) rotate(10deg)}66%{transform:translate(-40px,70px) scale(.95) rotate(-10deg)}to{transform:translate(20px,-30px) scale(1) rotate(0)}}.star{position:absolute;width:4px;height:4px;background:#fff;border-radius:50%;filter:blur(1.5px);opacity:.2}.star-1{top:15%;left:12%;animation:star-twinkle 5s infinite alternate}.star-2{top:75%;left:8%;animation:star-twinkle 7s infinite alternate-reverse;animation-delay:-2s}.star-3{top:25%;right:15%;animation:star-twinkle 6s infinite alternate;animation-delay:-1.5s}.star-4{top:85%;right:10%;animation:star-twinkle 8s infinite alternate-reverse;animation-delay:-3s}@keyframes star-twinkle{0%{opacity:.15;transform:scale(.8) translateY(0)}to{opacity:.5;transform:scale(1.4) translateY(-10px);filter:blur(2.5px)}}body.dark-mode .star{background:var(--primary-color);box-shadow:0 0 12px var(--primary-color);opacity:.3}body.dark-mode .orb{opacity:.1}body.dark-mode .orb-1{background:#4f46e5}body.dark-mode .orb-2{background:#9333ea}body.dark-mode .orb-3{background:#4338ca}body.dark-mode .chat-bg-mesh{opacity:.2;background:radial-gradient(at 20% 20%,rgba(99,102,241,.15) 0px,transparent 40%),radial-gradient(at 80% 80%,rgba(168,85,247,.1) 0px,transparent 40%)}.chat-header{height:var(--header-height);padding:0 25px;display:flex;align-items:center;justify-content:space-between;background:var(--glass-header);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border-bottom:1px solid var(--glass-border);z-index:10;transition:all .3s ease}.header-user-info{display:flex;align-items:center;gap:15px}.avatar-wrapper{position:relative;width:42px;height:42px}.header-avatar{width:100%;height:100%;border-radius:12px;object-fit:cover;border:2px solid var(--glass-border)}.status-dot{position:absolute;bottom:-2px;right:-2px;width:12px;height:12px;border-radius:50%;border:2px solid var(--bg-app)}.status-dot.online{background:#4ade80;box-shadow:0 0 10px #4ade8080}.status-dot.offline{background:#94a3b8}.status-dot.hidden{display:none}.user-details h3{margin:0;font-size:1.1rem;font-weight:600;color:var(--text-main)}.user-status{font-size:.75rem;color:var(--text-secondary)}.messages-area{flex:1;overflow-y:auto;padding:20px 25px;display:flex;flex-direction:column}.messages-container{max-width:1000px;width:100%;margin:0 auto;display:flex;flex-direction:column;gap:15px}.messages-area::-webkit-scrollbar{width:6px}.messages-area::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:10px}.input-container{padding:20px 25px;background:transparent;position:relative}.chat-form{background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:30px;padding:8px 10px;display:flex;align-items:center;gap:10px;transition:all .3s cubic-bezier(.4,0,.2,1);max-width:900px;margin:0 auto}.chat-form:focus-within{background:var(--glass-input);border-color:var(--primary-color);box-shadow:0 0 20px rgba(var(--primary-color),.1)}.chat-input{flex:1;background:transparent;border:none;color:var(--text-main);padding:10px 5px;font-size:1rem;outline:none}.chat-input::placeholder{color:var(--text-secondary);opacity:.6}.emoji-btn,.attach-btn,.send-btn,.mic-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:none;cursor:pointer;transition:all .2s;background:transparent}.attach-btn{color:var(--text-secondary);font-size:1.4rem}.attach-btn:hover{background:var(--border-color);color:var(--text-main)}.emoji-btn{color:#f5c518;font-size:1.4rem}.mic-btn{color:var(--text-secondary);font-size:1.4rem}.send-btn{background:var(--accent-gradient);color:#fff;font-size:1.1rem;box-shadow:0 4px 15px #0072ff4d}.send-btn:hover{transform:scale(1.05) translateY(-2px);box-shadow:0 6px 20px #0072ff66}.mic-btn:hover{background:var(--border-color);color:var(--text-main)}.mic-btn.recording{background:#ff4757;color:#fff;animation:micPulse 1.5s infinite}.mic-btn.uploading{background:var(--border-color);cursor:wait}.mic-loader{width:20px;height:20px;border:2px solid rgba(var(--primary-color),.3);border-top-color:var(--primary-color);border-radius:50%;animation:micSpin .8s linear infinite}@keyframes micSpin{to{transform:rotate(360deg)}}@keyframes micPulse{0%{box-shadow:0 0 #ff475766}70%{box-shadow:0 0 0 10px #ff475700}to{box-shadow:0 0 #ff475700}}.recording-status{display:flex;align-items:center;gap:12px;flex:1;padding:0 10px;color:#ff4757;font-weight:500}.recording-dot{width:8px;height:8px;background:#ff4757;border-radius:50%;animation:micPulse 1.5s infinite}.recording-timer{font-family:Courier New,Courier,monospace;font-weight:600;font-size:1.1rem;margin-top:2px;min-width:45px}.header-actions{display:flex;align-items:center;gap:8px}.header-action-btn,.header-delete-btn{background:transparent;border:none;color:var(--text-secondary);font-size:1.2rem;cursor:pointer;padding:8px;border-radius:50%;transition:all .2s;display:flex;align-items:center;justify-content:center}.header-action-btn:hover{background:var(--border-color);color:var(--primary-color)}.header-delete-btn:hover{background:#ff3b301a;color:#ff3b30}.discard-btn{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center;padding:5px;border-radius:50%;transition:all .2s}.discard-btn:hover{background:#ff47571a;color:#ff4757;transform:scale(1.1)}.recording-label{font-size:.9rem}.typing-indicator-wrapper{margin-left:10px;margin-bottom:5px}.typing-indicator{background:var(--msg-received);padding:10px 15px;border-radius:20px 20px 20px 5px;display:flex;gap:4px;width:fit-content}.typing-indicator span{width:6px;height:6px;background:var(--text-secondary);border-radius:50%;animation:typingBounce 1.4s infinite ease-in-out}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}@keyframes typingBounce{0%,80%,to{transform:translateY(0)}40%{transform:translateY(-6px);background:var(--primary-color)}}.emoji-picker-wrapper{position:absolute;bottom:100%;left:25px;margin-bottom:10px;z-index:100;box-shadow:var(--shadow-md);border-radius:12px;overflow:hidden;border:1px solid var(--glass-border)}.back-btn{display:none;background:transparent;border:none;color:var(--text-main);font-size:1.5rem;padding:8px;margin-right:5px;cursor:pointer;border-radius:50%;transition:background .2s}.back-btn:hover{background:var(--border-color)}@media(max-width:900px){.chat-room{height:100vh;height:100dvh}.chat-header{padding:0 15px}.input-container{padding:15px}.emoji-picker-wrapper{left:0;right:0;width:100%!important}}@media(max-width:768px){.chat-room{height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column}.chat-box{display:none}.chat-room.is-chat-selected .chat-box{display:flex;flex-direction:column;position:fixed;inset:0;height:100vh;height:100dvh;z-index:201;background:var(--bg-app)}.chat-header{height:60px;padding:0 10px}.back-btn{display:flex;align-items:center;justify-content:center}.header-user-info{gap:10px}.avatar-wrapper{width:36px;height:36px}.user-details h3{font-size:1rem}.input-container{padding:10px;background:var(--bg-app);border-top:1px solid var(--border-color);position:sticky;bottom:0;z-index:10;padding-bottom:env(safe-area-inset-bottom,10px)}.chat-form{border-radius:24px;padding:5px 8px}.chat-input{font-size:16px}.emoji-btn,.attach-btn,.mic-btn,.send-btn{width:36px;height:36px}.emoji-picker-wrapper{bottom:0;height:300px}.chat-bg-mesh,.chat-bg-ambient,.orb,.star{display:none!important}.chat-header,.chat-form{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--bg-app)}.chat-form:focus-within{box-shadow:none!important}.message-delete-btn.desktop-only{display:none!important}.message-bubble{box-shadow:none!important}}.navbar{display:flex;align-items:center;justify-content:space-between;background:var(--navbar-bg);padding:0 20px;height:60px;color:var(--text-main);border-bottom:1px solid var(--border-color);z-index:200;position:relative;transition:background .3s ease,border-color .3s ease;box-shadow:var(--shadow-sm)}.navbar-left{display:flex;align-items:center;gap:15px}.logo{font-family:Instagram Sans,sans-serif;font-weight:700;font-size:1.5rem;letter-spacing:.5px;background:var(--primary-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;white-space:nowrap}@keyframes gradientText{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.user{display:flex;align-items:center;gap:15px}.user img{background-color:#ddddf7;height:38px;width:38px;border-radius:50%;object-fit:cover;border:2px solid white}.user-name{font-weight:600;font-size:.9rem;color:var(--text-main);margin-right:10px}.logout-btn{background-color:var(--bg-chat);color:var(--text-main);border:1px solid var(--border-color);padding:6px 14px;border-radius:6px;cursor:pointer;font-size:13px;font-weight:500;transition:all .2s ease}.logout-btn:hover{background-color:#0000000d}.profile-container{position:relative;display:flex;align-items:center}.profile-trigger{display:flex;align-items:center;gap:12px;cursor:pointer;padding:4px 8px;border-radius:12px;transition:background .2s}.profile-trigger:hover{background:var(--glass-input)}.profile-dropdown{position:absolute;top:calc(100% + 10px);right:0;min-width:180px;background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:16px;padding:8px;box-shadow:0 10px 25px #0003;display:flex;flex-direction:column;z-index:1000}.dropdown-item{display:flex;align-items:center;gap:10px;padding:10px 14px;background:transparent;border:none;color:var(--text-main);font-size:.9rem;font-weight:500;width:100%;text-align:left;cursor:pointer;border-radius:10px;transition:all .2s}.dropdown-item svg{font-size:1rem;opacity:.7}.dropdown-item:hover{background:var(--glass-input);padding-left:18px}.dropdown-item.delete-item{color:#ff4757}.dropdown-item.delete-item:hover{background:#ff47571a}.theme-toggle-btn{background:transparent;border:none;color:var(--text-main);font-size:1.3rem;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:8px;border-radius:50%;transition:all .2s}.theme-toggle-btn:hover,.group-add-btn:hover{background:var(--border-color);transform:scale(1.1)}.group-add-btn{background:transparent;border:none;color:var(--text-main);font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:8px;border-radius:50%;transition:all .2s}@media screen and (max-width:768px){.user-name{display:none}.logo{font-size:1.2rem}.navbar{padding:0 15px;height:60px}}.settings-overlay{position:fixed;inset:0;background:#0009;z-index:2000;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.settings-modal{background:var(--glass-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);width:90%;max-width:900px;height:85vh;border-radius:20px;box-shadow:0 8px 32px #0000004d;color:var(--text-main);display:flex;overflow:hidden;position:relative}.settings-sidebar{width:250px;background:#0000001a;border-right:1px solid var(--border-color);display:flex;flex-direction:column;padding:20px 0}.settings-header-mobile{display:none}.sidebar-title{padding:0 20px;margin-bottom:20px;font-size:1.5rem;font-weight:700;color:var(--text-main)}.sidebar-item{padding:12px 20px;cursor:pointer;display:flex;align-items:center;gap:10px;color:var(--text-secondary);transition:all .2s ease;border-left:3px solid transparent}.sidebar-item:hover{background:#ffffff0d;color:var(--text-main)}.sidebar-item.active{background:rgba(var(--primary-rgb),.1);color:var(--primary-color);border-left-color:var(--primary-color)}.settings-content{flex:1;display:flex;flex-direction:column;overflow-y:auto;width:100%}.settings-content-header{padding:20px 30px;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:10}.settings-content-header h2{margin:0;font-size:1.4rem}.close-btn{background:transparent;border:none;color:var(--text-secondary);font-size:1.5rem;cursor:pointer}.settings-body{padding:30px}.setting-group{margin-bottom:30px}.setting-group-title{font-size:.9rem;text-transform:uppercase;color:var(--text-secondary);margin-bottom:15px;letter-spacing:1px}.setting-item{display:flex;justify-content:space-between;align-items:center;padding:15px 0;border-bottom:1px solid var(--border-color)}.setting-item:last-child{border-bottom:none}.setting-info{flex:1;padding-right:20px}.setting-label{display:block;font-weight:500;margin-bottom:4px}.setting-desc{font-size:.85rem;color:var(--text-secondary)}.setting-select{padding:10px 12px;border-radius:8px;background:#ffffff1a;border:1px solid var(--border-color);color:var(--text-main);outline:none;cursor:pointer;font-size:.95rem}.setting-select option{background:var(--bg-app);color:var(--text-main)}.setting-input{padding:10px;border-radius:8px;background:#ffffff1a;border:1px solid var(--border-color);color:var(--text-main);width:100%;outline:none;font-size:.95rem}body.dark-mode .setting-select,body.dark-mode .setting-input{background:#0000004d;border-color:#ffffff1a}.setting-toggle{position:relative;width:44px;height:24px;background:var(--text-secondary);border-radius:12px;cursor:pointer;transition:.3s}.setting-toggle.on{background:var(--primary-color)}.setting-toggle:after{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;background:#fff;border-radius:50%;transition:.3s}.setting-toggle.on:after{left:22px}.profile-edit-section{display:flex;flex-direction:column;align-items:center;gap:15px;margin-bottom:30px}.settings-avatar-wrapper{position:relative;width:100px;height:100px;margin-bottom:10px}.profile-avatar-large{width:100px;height:100px;border-radius:50%;object-fit:cover;border:3px solid var(--primary-color)}.change-avatar-btn{position:relative;overflow:hidden;background:var(--bg-secondary);padding:8px 16px;border-radius:20px;border:1px solid var(--border-color);cursor:pointer;color:var(--text-main);font-size:.9rem}.file-input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer}.danger-btn{background:#ff47571a;color:#ff4757;border:1px solid #ff4757;padding:10px 20px;border-radius:8px;cursor:pointer;font-weight:600;transition:all .2s}.danger-btn:hover{background:#ff4757;color:#fff}.primary-btn{background:var(--primary-color);color:#fff;border:none;padding:10px 20px;border-radius:8px;cursor:pointer;font-weight:600}.cache-btn{background:var(--bg-secondary);color:var(--text-main);border:1px solid var(--border-color);padding:8px 15px;border-radius:8px;cursor:pointer}@media(max-width:768px){.settings-modal{width:100%;height:100%;border-radius:0;flex-direction:column;display:block}.settings-sidebar{width:100%;height:100%;border-right:none;display:none}.settings-sidebar.mobile-visible{display:flex}.settings-content.mobile-hidden{display:none}.settings-content{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--bg-app);z-index:20}}.setup-container{height:100vh;width:100vw;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0f0c29,#302b63,#24243e);color:#fff}.setup-card{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:30px;border-radius:20px;width:100%;max-width:600px;box-shadow:0 15px 35px #0003;border:1px solid rgba(255,255,255,.2);text-align:center}.hint-text{font-size:.85rem;color:#bbb;margin-bottom:15px;text-align:left}.avatar-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:15px;margin-bottom:25px}.avatar-card{background:#ffffff0d;border-radius:12px;padding:10px;cursor:pointer;transition:all .3s ease;border:2px solid transparent;display:flex;flex-direction:column;align-items:center}.avatar-card:hover{background:#ffffff1a;transform:translateY(-3px)}.avatar-card.selected{border-color:#e100ff;background:#e100ff1a;box-shadow:0 0 15px #e100ff4d}.avatar-card img{width:50px;height:50px;margin-bottom:5px;border-radius:8px}.style-name{font-size:.7rem;color:#ccc;text-transform:capitalize}.primary-btn{width:100%;padding:14px;background:linear-gradient(135deg,#7f00ff,#e100ff);color:#fff;border:none;border-radius:12px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:transform .2s}.primary-btn:hover{transform:translateY(-2px)}.primary-btn:disabled{opacity:.7;cursor:not-allowed}.error-message{background:#ff3b301a;color:#ff3b30;padding:10px;border-radius:8px;margin-bottom:20px}.welcome-screen{display:flex;justify-content:center;align-items:center;height:100vh;width:100vw;background:var(--bg-app);color:var(--text-main);position:fixed;top:0;left:0;z-index:9999}.welcome-content{text-align:center;animation:welcomeFadeIn .8s cubic-bezier(.175,.885,.32,1.275) forwards}.welcome-avatar{width:120px;height:120px;border-radius:50%;border:4px solid var(--primary-color);box-shadow:0 10px 30px #0003;margin-bottom:2rem;object-fit:cover;animation:avatarScale 1s cubic-bezier(.175,.885,.32,1.275) forwards}.welcome-text-container{display:flex;flex-direction:column;gap:.5rem}.welcome-label{font-size:1rem;font-weight:600;letter-spacing:.4rem;color:var(--text-secondary);text-transform:uppercase;opacity:0;animation:textFadeIn .5s ease-out .4s forwards;margin:0}.welcome-name{font-size:2.5rem;font-weight:800;background:var(--gradient-primary);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;opacity:0;animation:textFadeIn .5s ease-out .6s forwards;margin:0}@keyframes welcomeFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes avatarScale{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes textFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.dark-mode .welcome-screen{background:var(--bg-app)}.intro-container{position:fixed;inset:0;background:#000;display:flex;justify-content:center;align-items:center;z-index:10000;transition:opacity .8s ease-in-out}.intro-container.fade-out{opacity:0;pointer-events:none}.vignette{position:absolute;inset:0;background:radial-gradient(circle,transparent 50%,rgba(0,0,0,.8) 100%);pointer-events:none;z-index:2;animation:vignettePulse 8s infinite alternate}.film-grain{position:absolute;inset:0;background-image:url(https://www.transparenttextures.com/patterns/stardust.png);opacity:.1;pointer-events:none;z-index:3;animation:grainMove 1s steps(5) infinite}@keyframes vignettePulse{0%{opacity:.5}to{opacity:.8}}@keyframes grainMove{0%,to{transform:translate(0)}25%{transform:translate(-1%,-1%)}50%{transform:translate(1%,1%)}75%{transform:translate(-1%,1%)}}.intro-content{position:relative;text-align:center}.intro-title{color:#fff;font-size:clamp(3rem,10vw,5rem);font-weight:800;margin:0;opacity:0;transform:scale(.9);animation:cinematicAppear 1.5s cubic-bezier(.2,0,.2,1) forwards,letterExpand 3.5s ease-out forwards,cinematicFloat 4s ease-in-out infinite alternate}.particles-bg{position:absolute;inset:0;overflow:hidden}.particle{position:absolute;width:2px;height:2px;background:#fff;border-radius:50%;opacity:0;animation:particleFloat 6s infinite linear}.particle:nth-child(1){left:10%;top:20%;animation-delay:0s}.particle:nth-child(2){left:30%;top:80%;animation-delay:1s}.particle:nth-child(3){left:50%;top:40%;animation-delay:2.5s}.particle:nth-child(4){left:70%;top:10%;animation-delay:.5s}.particle:nth-child(5){left:90%;top:60%;animation-delay:3s}.particle:nth-child(6){left:15%;top:50%;animation-delay:1.5s}.particle:nth-child(7){left:45%;top:25%;animation-delay:2s}.particle:nth-child(8){left:80%;top:75%;animation-delay:4s}.particle:nth-child(9){left:25%;top:15%;animation-delay:5s}.particle:nth-child(10){left:65%;top:85%;animation-delay:.2s}.particle:nth-child(n+11){display:none}@keyframes particleFloat{0%{transform:translateY(0);opacity:0}20%{opacity:.4}80%{opacity:.4}to{transform:translateY(-100px);opacity:0}}@keyframes letterExpand{0%{letter-spacing:.4rem}to{letter-spacing:1rem}}.intro-subtitle{color:#ffffff80;font-size:.8rem;text-transform:uppercase;letter-spacing:.3rem;margin-top:1rem;opacity:0;animation:cinematicAppear 1.5s cubic-bezier(.2,0,.2,1) .5s forwards}.ampersand{color:#444;font-weight:300;margin:0 .5rem}.intro-title:after{content:attr(data-text);position:absolute;inset:0;background:linear-gradient(120deg,transparent 0%,transparent 40%,rgba(255,255,255,.8) 50%,transparent 60%,transparent 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:sweep 2.5s ease-in-out .5s infinite}.sweep-line{position:absolute;bottom:-10px;left:10%;width:0;height:1px;background:linear-gradient(90deg,transparent,#fff,transparent);animation:lineExtend 1.5s ease-out .5s forwards;opacity:.3}@keyframes cinematicAppear{0%{opacity:0;transform:scale(.8);filter:blur(10px)}to{opacity:1;transform:scale(1);filter:blur(0)}}@keyframes cinematicFloat{0%{transform:translateY(0) scale(1)}to{transform:translateY(-5px) scale(1.02)}}@keyframes sweep{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes lineExtend{0%{width:0;left:50%;opacity:0}to{width:80%;left:10%;opacity:.3}}.loader-container{position:fixed;inset:0;background:#000;display:flex;justify-content:center;align-items:center;z-index:11000;color:#fff;overflow:hidden}.loader-content{position:relative;display:flex;flex-direction:column;align-items:center;gap:2rem;z-index:2}.loader-rings{position:relative;width:60px;height:60px}.ring{position:absolute;inset:0;border:2px solid transparent;border-top-color:var(--primary-color, #a855f7);border-radius:50%;animation:ringSpin 1.5s cubic-bezier(.5,0,.5,1) infinite}.ring:nth-child(2){border-top-color:#7c3aed;animation-delay:-.3s;inset:5px}.ring:nth-child(3){border-top-color:#fff;animation-delay:-.6s;inset:10px}.loader-text{font-size:1rem;font-weight:300;letter-spacing:.3rem;text-transform:uppercase;color:#fff9;animation:textPulse 2s ease-in-out infinite;margin:0}.loader-bg-glow{position:absolute;width:300px;height:300px;background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 70%);filter:blur(50px);z-index:1;animation:glowMove 8s infinite alternate}@keyframes ringSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes textPulse{0%,to{opacity:.4}50%{opacity:.8;letter-spacing:.4rem}}@keyframes glowMove{0%{transform:translate(-20%,-20%)}to{transform:translate(20%,20%)}}.modal-overlay{position:fixed;inset:0;background:#0006;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.modal-content{background:var(--bg-chat);width:90%;max-width:450px;border-radius:24px;padding:24px;box-shadow:0 20px 50px #0000004d;border:1px solid var(--glass-border);animation:slideUp .3s cubic-bezier(.2,0,.1,1)}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.header-title{display:flex;align-items:center;gap:12px}.group-icon{font-size:1.5rem;color:var(--primary-color)}.modal-header h3{margin:0;font-size:1.25rem;font-weight:700}.close-btn{background:transparent;border:none;font-size:1.5rem;color:var(--text-secondary);cursor:pointer;padding:4px;display:flex;border-radius:50%;transition:all .2s}.close-btn:hover{background:var(--border-color);color:var(--text-main)}.avatar-selection{display:flex;flex-direction:column;align-items:center;margin-bottom:24px}.avatar-preview-wrapper{width:90px;height:90px;border-radius:50%;background:var(--glass-input);border:2px dashed var(--glass-border);display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;overflow:hidden;transition:all .3s}.avatar-preview-wrapper:hover{border-color:var(--primary-color);background:rgba(var(--primary-color-rgb),.05)}.group-avatar-preview{width:100%;height:100%;object-fit:cover}.avatar-placeholder{font-size:2rem;color:var(--text-secondary);opacity:.5}.edit-overlay{position:absolute;bottom:0;left:0;right:0;background:#00000080;color:#fff;font-size:.7rem;padding:4px 0;text-align:center;opacity:0;transition:opacity .2s}.avatar-preview-wrapper:hover .edit-overlay{opacity:1}.avatar-label{margin-top:8px;font-size:.8rem;font-weight:600;color:var(--text-secondary)}.input-group{margin-bottom:20px}.input-group label{display:block;font-size:.85rem;font-weight:600;color:var(--text-secondary);margin-bottom:8px}.input-group input{width:100%;background:var(--glass-input);border:1px solid var(--glass-border);border-radius:12px;padding:12px 16px;color:var(--text-main);font-size:1rem;outline:none;transition:all .3s}.input-group input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(var(--primary-color-rgb),.1)}.friends-selection label{display:block;font-size:.85rem;font-weight:600;color:var(--text-secondary);margin-bottom:4px}.selection-hint{font-size:.75rem;color:var(--text-secondary);opacity:.7;margin-bottom:15px}.friends-list{max-height:250px;overflow-y:auto;border:1px solid var(--glass-border);border-radius:16px;padding:8px;display:flex;flex-direction:column;gap:4px}.friend-item{display:flex;align-items:center;gap:12px;padding:10px;border-radius:12px;cursor:pointer;transition:all .2s;-webkit-user-select:none;user-select:none}.friend-item:hover{background:var(--glass-input)}.friend-item.selected{background:rgba(var(--primary-color-rgb),.08)}.friend-item img{width:38px;height:38px;border-radius:10px;object-fit:cover}.friend-info{flex:1;display:flex;flex-direction:column}.friend-info .name{font-size:.9rem;font-weight:600}.friend-info .username{font-size:.75rem;color:var(--text-secondary)}.checkbox{width:20px;height:20px;border:2px solid var(--glass-border);border-radius:6px;display:flex;align-items:center;justify-content:center;transition:all .2s}.friend-item.selected .checkbox{background:var(--primary-color);border-color:var(--primary-color)}.check-mark{width:10px;height:6px;border-left:2px solid white;border-bottom:2px solid white;transform:rotate(-45deg) translateY(-1px)}.create-btn{width:100%;margin-top:24px;background:var(--accent-gradient);color:#fff;border:none;padding:14px;border-radius:16px;font-weight:600;font-size:1rem;cursor:pointer;transition:all .3s;box-shadow:0 4px 15px #0072ff33}.create-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #0072ff4d}.create-btn:disabled{opacity:.5;cursor:not-allowed;filter:grayscale(.5)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.dark-theme .modal-content{background:#111}.friends-list::-webkit-scrollbar{width:4px}.friends-list::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:10px}.maintenance-container{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#fff;display:flex;justify-content:center;align-items:center;z-index:9999;font-family:Inter,sans-serif;padding:20px;box-sizing:border-box}.dark-mode .maintenance-container{background-color:#121212;color:#fff}.maintenance-content{text-align:center;max-width:600px;animation:fadeIn .8s ease-out}.maintenance-title{font-size:2.5rem;font-weight:700;background:linear-gradient(135deg,#6e8efb,#a777e3);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:24px}.maintenance-message{font-size:1.5rem;font-weight:600;color:#333;margin-bottom:12px}.dark-mode .maintenance-message{color:#e0e0e0}.maintenance-subtext{font-size:1.1rem;color:#666}.dark-mode .maintenance-subtext{color:#aaa}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:480px){.maintenance-title{font-size:2rem}.maintenance-message{font-size:1.25rem}}