@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap";:root{--bg-color:#0f0f11;--bg-secondary:#1a1a1e;--text-primary:#f0f0f0;--text-secondary:#a0a0a5;--accent-color:#5c5cff;--accent-hover:#4a4ae6;--danger-color:#ff4a4a;--message-me:#2b2b36;--message-other:#1f1f24}*{box-sizing:border-box;margin:0;padding:0}html{height:100%;height:-webkit-fill-available}body{height:100%;width:100%;height:-webkit-fill-available;margin:0;padding:0;overflow:hidden}#root{height:100%}body{background-color:var(--bg-color);color:var(--text-primary);-webkit-font-smoothing:antialiased;font-family:Inter,sans-serif}button{cursor:pointer;background:0 0;border:none;font-family:Inter,sans-serif}input{font-family:Inter,sans-serif}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background-color:#333;border-radius:10px}.login-container{background-color:#0a0a0f;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.login-glow{pointer-events:none;background:radial-gradient(circle,#5c5cff1f 0%,#0000 70%);border-radius:50%;width:500px;height:500px;position:absolute}.login-card{z-index:1;-webkit-backdrop-filter:blur(20px);background:#121218cc;border:1px solid #ffffff12;border-radius:28px;flex-direction:column;align-items:center;width:400px;max-width:92%;padding:48px 40px;display:flex;position:relative;box-shadow:0 20px 60px #00000080,0 0 0 1px #5c5cff0d}.login-logo{letter-spacing:-2px;background:linear-gradient(135deg,#fff 30%,#8080ff 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:6px;font-size:2.8rem;font-weight:600}.login-card .subtitle{color:var(--text-secondary);letter-spacing:.3px;margin-bottom:36px;font-size:.85rem}.input-group{flex-direction:column;gap:10px;width:100%;margin-bottom:20px;display:flex}.input-group label{color:#ffffff59;text-transform:uppercase;letter-spacing:1.2px;font-size:.72rem;font-weight:600}.input-group input{width:100%;color:var(--text-primary);letter-spacing:2px;background:#0000004d;border:1px solid #ffffff12;border-radius:14px;outline:none;padding:15px 18px;font-size:1rem;transition:all .2s}.input-group input:focus{letter-spacing:2px;background:#0006;border-color:#5c5cff80;box-shadow:0 0 0 3px #5c5cff1a}.user-toggle{gap:10px;width:100%;display:flex}.toggle-btn{color:var(--text-secondary);cursor:pointer;background:#0003;border:1px solid #ffffff12;border-radius:14px;flex:1;padding:14px;font-size:.95rem;font-weight:500;transition:all .2s}.toggle-btn:hover{color:var(--text-primary);background:#ffffff0d;border-color:#ffffff26}.toggle-btn.active{color:#fff;background:#5c5cff33;border-color:#5c5cff80;box-shadow:0 0 16px #5c5cff26}.submit-btn{color:#fff;cursor:pointer;letter-spacing:.3px;background:linear-gradient(135deg,#5c5cff 0%,#7c5cff 100%);border:none;border-radius:14px;justify-content:center;align-items:center;width:100%;margin-top:8px;padding:16px;font-size:1rem;font-weight:600;transition:all .25s;display:flex;box-shadow:0 6px 20px #5c5cff4d}.submit-btn-content{align-items:center;gap:8px;display:flex}.submit-btn .btn-icon{width:16px;height:16px;transition:transform .2s}.submit-btn:hover .btn-icon{transform:translate(3px)}.submit-btn:hover{transform:translateY(-2px);box-shadow:0 10px 28px #5c5cff66}.submit-btn:active{transform:translateY(0)}.submit-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.loading-dots:after{content:"...";text-align:left;width:20px;animation:1.2s steps(4,end) infinite dots;display:inline-block}@keyframes dots{0%,20%{content:""}40%{content:"."}60%{content:".."}80%,to{content:"..."}}.error-message{color:#ff6b6b;text-align:center;background:#ff4a4a14;border:1px solid #ff4a4a33;border-radius:10px;width:100%;margin-bottom:8px;padding:10px 16px;font-size:.82rem}.message-wrapper{flex-direction:column;max-width:75%;margin-bottom:16px;display:flex}.message-wrapper.me{align-self:flex-end;align-items:flex-end}.message-wrapper.other{align-self:flex-start;align-items:flex-start}.message-sender{color:var(--text-secondary);margin-bottom:4px;margin-left:4px;margin-right:4px;font-size:.75rem;font-weight:500}.message-bubble{word-break:break-word;border-radius:18px;flex-direction:column;gap:8px;padding:12px 16px;display:flex;position:relative;box-shadow:0 2px 8px #00000026}.message-bubble.me{background-color:var(--message-me);color:var(--text-primary);border-bottom-right-radius:4px}.message-bubble.other{background-color:var(--message-other);color:var(--text-primary);border:1px solid #ffffff08;border-bottom-left-radius:4px}.message-text{font-size:.95rem;line-height:1.4}.chat-image,.chat-video{object-fit:cover;border-radius:12px;outline:none;max-width:100%;max-height:250px;display:block}.img-placeholder{width:200px;height:150px;color:var(--text-secondary);background:#ffffff08;border-radius:12px;justify-content:center;align-items:center;font-size:.8rem;display:flex}.img-placeholder.error{color:var(--danger-color);background:#ff4a4a0d}.message-time{color:var(--text-secondary);align-self:flex-end;margin-top:2px;font-size:.7rem}.message-bubble.view-once{border:1px dashed #ffffff26}.view-once-status{border-radius:8px;align-items:center;gap:8px;padding:8px 12px;font-size:.9rem;display:flex}.view-once-status.viewed{color:var(--text-secondary);background:#ffffff08}.view-once-status.sent{color:var(--accent-color);background:#5c5cff14}.view-once-btn{color:var(--text-primary);background:#5c5cff26;border:1px solid #5c5cff4d;border-radius:12px;align-items:center;gap:8px;padding:10px 16px;font-size:.9rem;font-weight:500;transition:all .2s;display:flex}.view-once-btn:hover{border-color:var(--accent-color);background:#5c5cff40}.message-list-container{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;flex-direction:column;flex:1;padding:16px 24px 8px;display:flex;overflow:hidden auto}.empty-chat{color:var(--text-secondary);text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:16px;padding:24px;display:flex}.logo-badge{letter-spacing:2px;color:#ffffff1a;background:#ffffff03;border:1px solid #ffffff0d;border-radius:40px;padding:8px 24px;font-size:2rem;font-weight:500}.empty-chat p{font-size:1rem}.empty-chat .info-text{opacity:.7;font-size:.8rem}@media (width<=600px){.message-list-container{padding:12px 16px 8px}}.chat-input-container{padding:16px calc(24px + env(safe-area-inset-right,0px)) calc(16px + env(safe-area-inset-bottom,0px)) calc(24px + env(safe-area-inset-left,0px));-webkit-backdrop-filter:blur(12px);background:#1a1a1e73;border-top:1px solid #ffffff0d;flex-direction:column;flex-shrink:0;gap:12px;display:flex}.preview-container{align-items:center;display:flex}.preview-image-wrapper{background:#111;border:1px solid #ffffff1a;border-radius:12px;width:120px;height:120px;position:relative;overflow:hidden}.preview-image{object-fit:cover;width:100%;height:100%}.view-once-toggle-btn{color:#ffffffe6;cursor:pointer;-webkit-backdrop-filter:blur(4px);background:#00000080;border:1.5px solid #fff9;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:.85rem;font-weight:700;transition:all .2s;display:flex;position:absolute;bottom:8px;right:8px}.view-once-toggle-btn:hover{background:#000000b3;transform:scale(1.05)}.view-once-toggle-btn.active{color:#fff;background:#10b981;border-color:#10b981;box-shadow:0 0 12px #10b98180}.remove-preview-btn{color:#fff;background:#0009;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;transition:background .2s;display:flex;position:absolute;top:6px;right:6px}.remove-preview-btn:hover{background:#000c}.input-row{align-items:center;gap:12px;display:flex}.text-input{color:var(--text-primary);background:#0f0f1199;border:1px solid #ffffff14;border-radius:24px;outline:none;flex:1;padding:14px 18px;font-size:.95rem;transition:all .2s}.text-input:focus{border-color:#fff3}.icon-btn{color:var(--text-secondary);border-radius:50%;justify-content:center;align-items:center;padding:10px;transition:all .2s;display:flex}.icon-btn:hover{color:var(--text-primary);background:#ffffff0d}.icon-btn:disabled{opacity:.5;cursor:not-allowed}.icon-btn.toggle-view-once.active{color:var(--danger-color);background:#ff4a4a1a}.send-btn{background:var(--accent-color);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;transition:all .2s;display:flex;box-shadow:0 4px 12px #5c5cff33}.send-btn:hover{background:var(--accent-hover);transform:scale(1.03)}.send-btn:disabled{color:var(--text-secondary);box-shadow:none;cursor:not-allowed;background:#ffffff0d;transform:none}.animate-spin{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.preview-video-wrapper{cursor:pointer;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.video-preview-overlay{color:#fff;pointer-events:none;background:#00000073;justify-content:center;align-items:center;width:100%;height:100%;transition:all .2s;display:flex;position:absolute;top:0;left:0}.video-preview-overlay.playing{opacity:0}.preview-video-wrapper:hover .video-preview-overlay.playing{opacity:1;background:#00000059}.preview-expand-btn{color:#ffffffe6;cursor:pointer;-webkit-backdrop-filter:blur(4px);z-index:2;background:#00000080;border:1.5px solid #fff9;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;transition:all .2s;display:flex;position:absolute;bottom:8px;left:8px}.preview-expand-btn:hover{background:#000000b3;transform:scale(1.05)}.fullscreen-preview-overlay{z-index:2000;-webkit-backdrop-filter:blur(10px);width:100vw;height:100vh;padding:calc(24px + env(safe-area-inset-top,0px)) calc(24px + env(safe-area-inset-right,0px)) calc(24px + env(safe-area-inset-bottom,0px)) calc(24px + env(safe-area-inset-left,0px));background-color:#0a0a0cfa;justify-content:center;align-items:center;display:flex;position:fixed;top:0;left:0}.fullscreen-preview-content{flex-direction:column;align-items:center;width:100%;max-width:90%;max-height:80vh;display:flex;position:relative}.fullscreen-preview-video{object-fit:contain;border-radius:12px;outline:none;max-width:100%;max-height:75vh;box-shadow:0 10px 40px #00000080}.fullscreen-close-btn{top:calc(24px + env(safe-area-inset-top,0px));right:calc(24px + env(safe-area-inset-right,0px));color:var(--text-primary);z-index:2001;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff14;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;transition:all .2s;display:flex;position:absolute}.fullscreen-close-btn:hover{background:#ffffff1a;transform:scale(1.05)}@media (width<=600px){.chat-input-container{padding:10px calc(16px + env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) calc(16px + env(safe-area-inset-left,0px))}}.view-once-overlay{z-index:1000;-webkit-backdrop-filter:blur(10px);background-color:#0a0a0cfa;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.view-once-content{flex-direction:column;align-items:center;max-width:90%;max-height:80vh;display:flex;position:relative}.view-once-image,.view-once-video{object-fit:contain;border-radius:12px;outline:none;max-width:100%;max-height:70vh;box-shadow:0 10px 40px #00000080}.view-once-image{-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.view-once-warning{color:var(--danger-color);background:#ff4a4a26;border:1px solid #ff4a4a33;border-radius:20px;align-items:center;gap:8px;margin-top:16px;padding:8px 16px;font-size:.85rem;display:flex}.close-btn{top:calc(24px + env(safe-area-inset-top,0px));right:calc(24px + env(safe-area-inset-right,0px));color:var(--text-primary);z-index:1001;background:#ffffff0d;border:1px solid #ffffff14;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;transition:all .2s;display:flex;position:absolute}.close-btn:hover{background:#ffffff1a;transform:scale(1.05)}.status-text{color:var(--text-secondary);font-size:1rem}.status-text.error{color:var(--danger-color)}.chat-container{top:var(--app-top,0px);height:var(--app-height,100dvh);background-color:var(--bg-color);background-image:radial-gradient(circle,#151520 0%,#0f0f11 100%);flex-direction:column;display:flex;position:fixed;left:0;right:0;overflow:hidden}.chat-header{padding:calc(16px + env(safe-area-inset-top,0px)) calc(24px + env(safe-area-inset-right,0px)) 16px calc(24px + env(safe-area-inset-left,0px));-webkit-backdrop-filter:blur(12px);z-index:10;will-change:auto;background:#1a1a1e73;border-bottom:1px solid #ffffff0d;flex-shrink:0;justify-content:space-between;align-items:center;display:flex;transform:translateZ(0)}.header-info{align-items:center;gap:12px;display:flex}.shield-icon{color:var(--accent-color)}.title-area h2{letter-spacing:.5px;font-size:1.2rem;font-weight:600}.user-badge{color:var(--text-secondary);font-size:.75rem}.logout-btn{color:var(--text-secondary);border-radius:50%;justify-content:center;align-items:center;padding:8px;transition:all .2s;display:flex}.logout-btn:hover{color:var(--danger-color);background:#ff4a4a0d}.chat-loading{background:var(--bg-color);width:100%;height:100%;color:var(--text-secondary);justify-content:center;align-items:center;font-size:1rem;display:flex}.chat-error{color:var(--danger-color);text-align:center;background:#ff4a4a1a;border-bottom:1px solid #ff4a4a33;flex-shrink:0;padding:10px 24px;font-size:.85rem}@media (width<=600px){.chat-header{padding:calc(10px + env(safe-area-inset-top,0px)) calc(16px + env(safe-area-inset-right,0px)) 10px calc(16px + env(safe-area-inset-left,0px))}}