*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;scroll-behavior:smooth}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;min-height:100vh;background:#fafafa;color:#111}#root{width:100%;min-height:100vh}:root{--bg: #ffffff;--bg-2: #fdf8f9;--bg-3: #fce7f3;--bg-hover: #fdf2f8;--text: #1f1215;--text-2: #5d4a4f;--text-3: #9b878b;--border: #f3d9e2;--bubble-sent: linear-gradient(135deg, #ec4899 0%, #db2777 100%);--bubble-sent-bg: #db2777;--bubble-recv: #fdfcff;--bubble-recv-border: #f5e3e8;--accent: #db2777;--accent-light: #fce7f3;--accent-gradient: linear-gradient(135deg, #f472b6 0%, #db2777 100%);--radius: 20px;--radius-sm: 8px;--radius-full: 9999px;--shadow-sm: 0 1px 3px rgba(219,39,119,.04);--shadow-md: 0 4px 20px rgba(219,39,119,.06);--shadow-lg: 0 10px 30px rgba(219,39,119,.08);--shadow-card: 0 20px 45px rgba(219,39,119,.06), 0 1px 4px rgba(219,39,119,.02);--ease: cubic-bezier(.4, 0, .2, 1);--fast: .15s;--normal: .2s;--slow: .3s}.splash{position:fixed;inset:0;background:#fafafa;display:flex;align-items:center;justify-content:center;z-index:9999;animation:splashOut .5s ease 2s forwards}@keyframes splashOut{to{opacity:0;visibility:hidden}}.splash-glow{position:absolute;width:200px;height:200px;background:radial-gradient(circle,rgba(0,0,0,.06) 0%,transparent 70%);border-radius:50%;animation:glowPulse 2s ease-in-out infinite}@keyframes glowPulse{0%,to{transform:scale(1);opacity:.6}50%{transform:scale(1.3);opacity:1}}.splash-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:.5rem;z-index:1}.splash-icon{font-size:3rem;animation:iconBounce 1.5s ease-in-out infinite}@keyframes iconBounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.splash-title{font-size:2.8rem;font-weight:800;color:#111;letter-spacing:-.02em}.splash-sub{font-size:.8rem;color:#999;letter-spacing:.2em;font-weight:500}.splash-loader{margin-top:1.5rem;width:40px;height:40px;border:3px solid #eee;border-top-color:#111;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.app{min-height:100vh;display:flex;flex-direction:column;width:100%}.home-screen{position:relative;overflow-x:hidden;background:var(--bg)}.home-bg{position:fixed;inset:0;background:linear-gradient(135deg,#fff2f6,#fff,#fdf4f7);z-index:0}.home-bg:before{content:"";position:absolute;top:-10%;left:-10%;width:60%;height:60%;background:radial-gradient(circle,rgba(251,207,232,.45) 0%,transparent 75%);filter:blur(100px);z-index:0;pointer-events:none}.home-bg:after{content:"";position:absolute;bottom:-10%;right:-10%;width:60%;height:60%;background:radial-gradient(circle,rgba(244,143,177,.3) 0%,transparent 75%);filter:blur(100px);z-index:0;pointer-events:none}.landing-hdr{position:relative;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:1.25rem 2.5rem;max-width:1200px;width:100%;margin:0 auto}.landing-nav{display:flex;align-items:center;gap:2rem}.landing-nav-link{font-size:.9rem;font-weight:600;color:var(--text-2);text-decoration:none;transition:color var(--fast) var(--ease)}.landing-nav-link:hover{color:var(--accent)}.home-center{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;padding:3rem 2rem 5rem;max-width:1200px;width:100%;margin:0 auto}.landing-badge{display:inline-flex;align-items:center;gap:6px;background:#ffffffb3;border:1px solid var(--border);padding:6px 14px;border-radius:var(--radius-full);font-size:.8rem;font-weight:600;color:var(--accent);margin-bottom:2rem;box-shadow:var(--shadow-sm);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:fadeUp .6s var(--ease)}.landing-hero{text-align:center;max-width:800px;margin-bottom:3.5rem;animation:fadeUp .8s var(--ease)}.landing-title{font-size:3.5rem;font-weight:800;line-height:1.15;letter-spacing:-.03em;color:var(--text);margin:0 0 1.25rem}.landing-title span{background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.landing-subtitle{font-size:1.15rem;line-height:1.6;color:var(--text-2);max-width:620px;margin:0 auto}.landing-row{display:flex;gap:3rem;align-items:stretch;width:100%;margin-bottom:4rem;animation:fadeUp 1s var(--ease)}.home-card-wrapper{flex:1;max-width:440px;display:flex;flex-direction:column}.home-card{background:#ffffffbf;border:1px solid rgba(255,255,255,.6);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:28px;padding:2.5rem 2.25rem;width:100%;box-shadow:var(--shadow-card);border:1px solid var(--border)}.home-logo{display:flex;align-items:center;justify-content:center;gap:.6rem;margin-bottom:1.5rem}.home-logo-icon{color:var(--accent)}.home-logo h2{font-size:1.8rem;font-weight:800;letter-spacing:-.02em;color:var(--text);margin:0}.home-form{display:flex;flex-direction:column;gap:1rem;width:100%}.home-input{width:100%;background:#ffffffe6;border:1px solid var(--border);border-radius:16px;padding:.9rem 1.2rem;font-size:.95rem;font-weight:550;font-family:inherit;text-align:center;color:var(--text);transition:all var(--normal) var(--ease)}.home-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px #db277714;background:#fff}.home-input::placeholder{color:var(--text-3);font-weight:400}.btn-create{width:100%;padding:.95rem;background:var(--accent-gradient);color:#fff;border:none;border-radius:16px;font-size:1rem;font-weight:700;font-family:inherit;cursor:pointer;box-shadow:0 4px 15px #db27772e;transition:all var(--fast) var(--ease)}.btn-create:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #db277740}.btn-create:active:not(:disabled){transform:translateY(0)}.btn-create:disabled{opacity:.5;cursor:not-allowed}.home-divider{display:flex;align-items:center;margin:.8rem 0;gap:.8rem}.home-divider:before,.home-divider:after{content:"";flex:1;height:1px;background:var(--border)}.home-divider span{color:var(--text-3);font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.btn-join{padding:.9rem 1.2rem;background:var(--bg);border:1px solid var(--border);color:var(--accent);border-radius:16px;font-size:1rem;font-weight:700;font-family:inherit;cursor:pointer;transition:all var(--fast) var(--ease)}.btn-join:hover:not(:disabled){background:var(--bg-hover);border-color:var(--accent)}.btn-join:disabled{opacity:.5;cursor:not-allowed}.home-error{color:#e11d48;font-size:.85rem;font-weight:600;margin-top:1rem;text-align:center}.landing-showcase{flex:1.2;background:#ffffff73;border:1px solid rgba(255,255,255,.4);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:28px;padding:2rem;box-shadow:var(--shadow-card);display:flex;flex-direction:column;justify-content:center;border:1px solid var(--border)}.showcase-header{display:flex;align-items:center;gap:8px;padding-bottom:1.25rem;border-bottom:1px solid var(--border);margin-bottom:1.5rem}.showcase-dot{width:10px;height:10px;border-radius:50%;background:#10b981}.showcase-title{font-size:.95rem;font-weight:700;color:var(--text)}.showcase-bubble{display:flex;gap:10px;margin-bottom:1.25rem;animation:msgIn .3s ease}.showcase-bubble.self{flex-direction:row-reverse}.showcase-avatar{width:32px;height:32px;border-radius:50%;background:var(--border);display:grid;place-items:center;font-size:1rem;flex-shrink:0}.showcase-content{max-width:75%;background:var(--bg);border:1px solid var(--border);border-radius:16px;padding:.7rem 1rem;font-size:.88rem;color:var(--text-2);box-shadow:var(--shadow-sm)}.showcase-bubble.self .showcase-content{background:var(--bubble-sent);color:#fff;border:none}.showcase-bot-tag{display:inline-block;background:var(--bg-3);color:var(--accent);font-size:.72rem;font-weight:700;padding:1px 6px;border-radius:4px;margin-bottom:4px}.btn-join{padding:.8rem 1.4rem;background:#fff;color:#111;border:1.5px solid #111;border-radius:14px;font-size:.95rem;font-weight:600;font-family:inherit;cursor:pointer;transition:all var(--normal) var(--ease)}.btn-join:hover:not(:disabled){background:#111;color:#fff;transform:scale(1.02)}.btn-join:disabled{opacity:.4;cursor:not-allowed}.home-error{color:#e53e3e;font-size:.85rem;margin-top:1rem}.home-features{display:flex;gap:2rem;margin-top:2.5rem;animation:cardIn .5s var(--ease) .15s both}.home-feat{display:flex;flex-direction:column;align-items:center;gap:.4rem;color:#999;transition:transform var(--normal) var(--ease)}.home-feat:hover{transform:scale(1.05)}.home-feat svg{opacity:.5}.home-feat span{font-size:.78rem}.chat-screen{height:100vh;overflow:hidden}.app-layout{display:flex;width:100%;height:100vh}.sidebar{width:280px;min-width:240px;max-width:320px;border-right:1px solid var(--border);background:#fff;display:flex;flex-direction:column;height:100vh;flex-shrink:0}.sb-header{display:flex;align-items:center;gap:.7rem;padding:1rem;border-bottom:1px solid var(--border)}.sb-logo{font-size:1.4rem}.sb-title{font-size:1.1rem;font-weight:700;color:var(--text);margin:0}.sb-sub{font-size:.75rem;color:var(--text-3);margin:.1rem 0 0}.sb-search{padding:.6rem .8rem;border-bottom:1px solid var(--border)}.sb-search input{width:100%;border:1px solid var(--border);border-radius:var(--radius-full);background:#f7f7f7;padding:.5rem .8rem;font-size:.85rem;font-family:inherit;color:var(--text);transition:border var(--normal) var(--ease)}.sb-search input:focus{outline:none;border-color:var(--accent)}.sb-list{flex:1;overflow-y:auto;padding:.5rem}.sb-item{display:flex;justify-content:space-between;align-items:center;width:100%;background:#fff;border:1px solid var(--border);border-radius:14px;padding:.7rem .85rem;font-family:inherit;color:var(--text);text-align:left;cursor:pointer;transition:all var(--normal) var(--ease)}.sb-item:hover{transform:scale(1.02);background:var(--bg-hover)}.sb-item.active{border-color:var(--accent);box-shadow:0 0 0 2px #0000000d}.sb-item-name{font-weight:700;font-size:.9rem}.sb-item-meta{font-size:.75rem;color:var(--text-3);display:flex;align-items:center;gap:.35rem}.sb-badge{min-width:18px;padding:0 5px;border-radius:var(--radius-full);background:#111;color:#fff;font-size:.68rem;text-align:center;font-weight:600}.chat-main{flex:1;display:flex;flex-direction:column;height:100vh;position:relative;background:#fff;min-width:0}.chat-bg{position:absolute;inset:0;background-image:radial-gradient(rgba(0,0,0,.05) 1px,transparent 1px);background-size:24px 24px;pointer-events:none;z-index:0}.chat-bg:after{content:"";position:absolute;inset:0;background:#ffffff4d;pointer-events:none}.chat-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:.7rem 1.2rem;background:#fffffff7;border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.chat-header-info h3{font-size:1rem;font-weight:700;color:var(--text);margin:0}.chat-header-sub{font-size:.75rem;color:var(--text-2);margin:.1rem 0 0;display:flex;align-items:center;gap:.35rem}.status-dot{width:7px;height:7px;background:#22c55e;border-radius:50%;display:inline-block;animation:dotPulse 2s ease-in-out infinite}@keyframes dotPulse{0%,to{opacity:1}50%{opacity:.5}}.chat-typing-label{font-size:.72rem;color:var(--text-3);margin:.1rem 0 0}.chat-header-actions{display:flex;gap:.4rem}.hdr-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 12px;border-radius:12px;border:1px solid var(--border);background:#fff;cursor:pointer;font-size:.82rem;font-weight:600;color:var(--text-2);transition:all var(--normal) var(--ease);font-family:inherit}.hdr-btn:hover{background:var(--bg-hover);transform:scale(1.05)}.hdr-btn.leave:hover{background:#fef2f2;border-color:#fca5a5;color:#dc2626}.notif{position:fixed;top:1rem;left:50%;transform:translate(-50%);background:#fff;border:1px solid var(--border);padding:.6rem 1.3rem;border-radius:14px;font-size:.85rem;font-weight:500;z-index:1000;box-shadow:var(--shadow-md);animation:notifIn 3s var(--ease) forwards;color:var(--text)}.notif:before{content:"✓ ";font-weight:700}@keyframes notifIn{0%{opacity:0;transform:translate(-50%) translateY(-10px)}8%{opacity:1;transform:translate(-50%) translateY(0)}85%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(-10px)}}.messages{flex:1;overflow-y:auto;padding:1rem 1.2rem;display:flex;flex-direction:column;gap:6px;position:relative;z-index:1;scroll-behavior:smooth}.empty-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:3rem;animation:fadeUp .4s var(--ease)}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.empty-icon{font-size:2.5rem;margin-bottom:.8rem;opacity:.4}.empty-title{font-size:1.1rem;font-weight:600;color:var(--text-2);margin:0 0 .3rem}.empty-hint{font-size:.85rem;color:var(--text-3);margin:0}.message{display:flex;align-items:flex-start;gap:8px;max-width:75%;animation:msgIn .22s var(--ease)}@keyframes msgIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.message.sent{align-self:flex-end;flex-direction:row-reverse}.message.received{align-self:flex-start;flex-direction:row}.message.grouped{margin-bottom:2px}.message.last-group{margin-bottom:12px}.msg-bubble{padding:.6rem .9rem;border-radius:var(--radius);word-wrap:break-word;transition:transform var(--fast) var(--ease)}.msg-bubble:hover{transform:scale(1.01)}.message.sent .msg-bubble{background:var(--bubble-sent);color:#fff;border-bottom-right-radius:var(--radius-sm);box-shadow:var(--shadow-sm)}.message.received .msg-bubble{background:var(--bubble-recv);color:var(--text);border-bottom-left-radius:var(--radius-sm);border:1px solid #e0e0e0}.message.grouped.sent .msg-bubble{border-radius:var(--radius);border-bottom-right-radius:var(--radius-sm)}.message.grouped.received .msg-bubble{border-radius:var(--radius);border-bottom-left-radius:var(--radius-sm)}.msg-sender-name{display:block;font-size:.72rem;font-weight:700;color:#888;margin-bottom:4px}.message.sent .msg-sender-name{text-align:right;color:#ffffffb3}.msg-text{margin:0;line-height:1.5;font-size:.95rem}.msg-meta{display:flex;justify-content:flex-end;margin-top:.2rem;opacity:.7}.message.received .msg-meta{justify-content:flex-start}.msg-time{font-size:.7rem;color:var(--text-3)}.message.sent .msg-time{color:#fff9}.msg-status{font-size:.65rem;color:var(--text-3);text-align:right;margin-top:1px}.msg-error{background:#fef2f2!important;color:#dc2626!important;font-size:.85rem;border:1px solid #fca5a5}.msg-link{color:#3b82f6;text-decoration:underline;word-break:break-all}.message.sent .msg-link{color:#93c5fd}.code-msg{background:#1a1a1a;border-radius:12px;overflow:hidden;max-width:100%;box-shadow:var(--shadow-sm)}.code-hdr{display:flex;justify-content:space-between;align-items:center;padding:.4rem .7rem;background:#252525;border-bottom:1px solid #333}.code-lang{font-size:.72rem;color:#888;font-weight:600;text-transform:uppercase}.code-copy{background:transparent;border:1px solid #444;color:#ccc;font-size:.72rem;padding:.2rem .5rem;border-radius:6px;cursor:pointer;font-family:inherit;transition:all var(--fast) var(--ease)}.code-copy:hover{background:#333;color:#fff}.code-copy.copied{border-color:#22c55e;color:#22c55e}.code-body{padding:.7rem;font-family:JetBrains Mono,Fira Code,monospace;font-size:.82rem;color:#e4e4e4;overflow-x:auto;line-height:1.6;margin:0}.code-body .kw{color:#ff7b72}.code-body .str{color:#a5d6ff}.code-body .num{color:#79c0ff}.code-body .cmt{color:#6e7681;font-style:italic}.img-msg{position:relative;border-radius:12px;overflow:hidden;cursor:pointer;max-width:280px;box-shadow:var(--shadow-sm);transition:transform var(--fast) var(--ease)}.img-msg:hover{transform:scale(1.02)}.img-msg img{width:100%;display:block;object-fit:cover;max-height:300px}.img-overlay{position:absolute;bottom:0;left:0;right:0;padding:.6rem .8rem;background:linear-gradient(transparent,#000000b3);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:.5rem;pointer-events:none}.img-name{font-size:.75rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.img-dl{padding:.4rem;background:#fff3;border-radius:6px;color:#fff;display:grid;place-items:center;pointer-events:auto;transition:all var(--fast) var(--ease)}.img-dl:hover{background:#ffffff59;transform:scale(1.05)}.file-msg{display:flex;align-items:center;gap:.6rem;padding:.5rem;background:#00000008;border-radius:10px}.message.sent .file-msg{background:#ffffff1a}.file-icon{width:36px;height:36px;border-radius:8px;display:grid;place-items:center;font-size:1.1rem;background:#f3f3f3;flex-shrink:0}.message.sent .file-icon{background:#ffffff26}.file-info{flex:1;min-width:0}.file-name{display:block;font-size:.85rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-size{display:block;font-size:.72rem;color:var(--text-3)}.message.sent .file-size{color:#ffffff80}.file-progress-bar{height:2px;background:#e5e5e5;border-radius:1px;margin-top:4px;overflow:hidden}.file-progress-fill{height:100%;background:#111;transition:width .3s var(--ease)}.message.sent .file-progress-bar{background:#fff3}.message.sent .file-progress-fill{background:#fff}.file-dl{width:30px;height:30px;border-radius:8px;border:1px solid var(--border);display:grid;place-items:center;text-decoration:none;color:var(--text);font-size:1rem;font-weight:700;transition:all var(--fast) var(--ease);flex-shrink:0}.file-dl:hover{background:var(--bg-hover);transform:scale(1.05)}.message.sent .file-dl{border-color:#ffffff4d;color:#fff}.file-progress-tray{padding:.5rem 1rem;background:var(--bg-2);border-top:1px solid var(--border);z-index:2}.fp-item{display:flex;align-items:center;gap:.5rem;padding:.3rem 0;font-size:.8rem}.fp-icon{font-size:1rem}.fp-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fp-bar{width:60px;height:2px;background:#e5e5e5;border-radius:1px;overflow:hidden}.fp-fill{height:100%;background:#111;transition:width .3s var(--ease)}.fp-pct{font-size:.72rem;color:var(--text-3);min-width:30px;text-align:right}.typing-dots{display:flex;align-items:center;gap:.25rem;padding:.3rem 1.2rem;font-size:.8rem;color:var(--text-3);z-index:2}.typing-dots span{width:5px;height:5px;background:var(--text-3);border-radius:50%;animation:dotBounce 1s infinite ease-in-out}.typing-dots span:nth-child(2){animation-delay:.1s}.typing-dots span:nth-child(3){animation-delay:.2s}@keyframes dotBounce{0%,80%,to{transform:translateY(0);opacity:.3}40%{transform:translateY(-4px);opacity:1}}.input-bar{display:flex;align-items:flex-end;gap:.5rem;padding:.7rem 1rem;background:#fff;border-top:1px solid var(--border);z-index:3}.ib-attach{width:40px;height:40px;border-radius:50%;border:1px solid var(--border);background:#fff;cursor:pointer;display:grid;place-items:center;transition:all var(--normal) var(--ease);flex-shrink:0;color:var(--text-2)}.ib-attach:hover{background:var(--bg-hover);transform:scale(1.05)}.ib-input{flex:1;border:1px solid var(--border);border-radius:20px;padding:.6rem 1rem;font-size:.95rem;font-family:inherit;color:var(--text);background:#f9f9f9;resize:none;min-height:40px;max-height:120px;line-height:1.4;transition:border var(--normal) var(--ease),box-shadow var(--normal) var(--ease)}.ib-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #0000000a;background:#fff}.ib-input::placeholder{color:#bbb}.ib-send{width:40px;height:40px;border-radius:50%;border:none;background:#ddd;color:#999;cursor:not-allowed;display:grid;place-items:center;transition:all var(--normal) var(--ease);flex-shrink:0}.ib-send.active{background:#111;color:#fff;cursor:pointer}.ib-send.active:hover{transform:scale(1.05);box-shadow:var(--shadow-md)}.ib-code-wrap{flex:1;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:#f9f9f9}.ib-code-hdr{display:flex;align-items:center;gap:.5rem;padding:.4rem .7rem;background:#f0f0f0;border-bottom:1px solid var(--border);font-size:.85rem}.ib-code-sel{border:1px solid var(--border);border-radius:6px;padding:.2rem .4rem;font-size:.78rem;font-family:inherit;background:#fff;color:var(--text)}.ib-code-close{margin-left:auto;background:transparent;border:none;cursor:pointer;font-size:.85rem;color:var(--text-3);padding:.2rem}.ib-code-close:hover{color:var(--text)}.ib-code-area{width:100%;border:none;padding:.6rem .8rem;font-family:JetBrains Mono,monospace;font-size:.85rem;color:var(--text);background:transparent;resize:none;min-height:80px}.ib-code-area:focus{outline:none}.scroll-btn{position:absolute;bottom:80px;right:20px;z-index:20;background:#111;color:#fff;border:none;border-radius:var(--radius-full);padding:.4rem .9rem;font-size:.78rem;font-weight:500;font-family:inherit;cursor:pointer;box-shadow:var(--shadow-md);transition:transform var(--normal) var(--ease);animation:fadeUp .2s var(--ease)}.scroll-btn:hover{transform:translateY(-2px)}.picker-overlay{position:fixed;inset:0;background:#0000004d;z-index:100;animation:fadeIn .2s var(--ease)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.picker{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:440px;background:#fff;border-radius:20px 20px 0 0;padding:1rem 1.5rem 2rem;z-index:101;box-shadow:0 -4px 20px #0000001a;animation:slideUp .3s var(--ease)}@keyframes slideUp{0%{transform:translate(-50%,100%)}to{transform:translate(-50%)}}.picker-handle{width:36px;height:4px;background:#ddd;border-radius:2px;margin:0 auto .8rem}.picker h3{font-size:1rem;font-weight:700;margin-bottom:1rem}.picker-options{display:flex;gap:1rem;justify-content:center}.picker-opt{display:flex;flex-direction:column;align-items:center;gap:.4rem;cursor:pointer;transition:transform var(--fast) var(--ease)}.picker-opt:hover{transform:scale(1.08)}.picker-opt-icon{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;font-size:1.3rem;background:#f3f3f3;transition:background var(--normal) var(--ease)}.picker-opt-icon:hover{background:#e8e8e8}.picker-opt-icon.document{background:#e3f2fd}.picker-opt-icon.image{background:#fce4ec}.picker-opt-icon.code{background:#e8f5e9}.picker-opt-icon.archive{background:#fff3e0}.picker-opt span{font-size:.75rem;color:var(--text-2)}.drop-zone{position:fixed;inset:0;background:#fffffff2;z-index:200;display:flex;align-items:center;justify-content:center;animation:fadeIn .2s var(--ease)}.drop-content{text-align:center;padding:3rem;border:2px dashed var(--border);border-radius:20px;animation:fadeUp .3s var(--ease)}.drop-content span{font-size:2.5rem}.drop-content p{font-size:1.1rem;font-weight:600;margin-top:.5rem}.drop-hint{font-size:.85rem!important;color:var(--text-3)!important;font-weight:400!important}.img-viewer{position:fixed;inset:0;background:#000000e6;z-index:500;display:flex;align-items:center;justify-content:center;padding:2rem;cursor:pointer;animation:fadeIn .2s var(--ease)}.img-viewer img{max-width:90vw;max-height:90vh;object-fit:contain;border-radius:8px}.img-viewer-close{position:fixed;top:1rem;right:1rem;width:40px;height:40px;border-radius:50%;border:none;background:#ffffff26;color:#fff;font-size:1.2rem;cursor:pointer;display:grid;place-items:center;transition:background var(--fast) var(--ease)}.img-viewer-close:hover{background:#ffffff4d}.sidebar-toggle-btn,.sb-close-btn{display:none!important}.message.sent .reaction-bar-container{justify-content:flex-end}.message.sent .quick-reaction-popover{left:auto;right:0}@media(max-width:768px){.app-layout{flex-direction:column}.chat-main{width:100%}.message{max-width:85%}.home-features{gap:1.2rem;flex-direction:column;width:100%}.home-card{margin:0;padding:2rem 1.5rem}.landing-row{flex-direction:column;gap:2rem;width:100%}.landing-showcase{display:none}.landing-title{font-size:2.25rem}.landing-hdr{padding:1.25rem 1.5rem}.landing-nav{display:none}.chat-header{padding:.5rem .75rem!important}.messages{padding:12px 10px!important}.sidebar{display:flex!important;position:fixed!important;top:0;left:0;bottom:0;width:280px;max-width:80vw;z-index:1000;transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);background:var(--bg);box-shadow:var(--shadow-lg);border-right:1px solid var(--border)}.sidebar.mobile-open{transform:translate(0)!important}.sidebar-toggle-btn{display:inline-flex!important}.sb-close-btn{display:inline-flex!important;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;border:1px solid var(--border);background:var(--bg-2);font-size:.9rem;cursor:pointer;color:var(--text-2);transition:all .2s}.sb-close-btn:hover{background:var(--bg-hover);color:var(--text)}.hdr-btn span{display:none!important}.hdr-btn{padding:0!important;width:36px;height:36px;border-radius:50%!important}.chat-header-actions{gap:.35rem!important}.input-emoji-picker{left:8px!important;right:8px!important;bottom:72px!important;width:calc(100% - 16px)!important}.input-emoji-picker>div,.input-emoji-picker .EmojiPickerReact{width:100%!important;max-width:100%!important}.code-msg-container{max-width:100%;overflow-x:auto}.code-msg-container pre{font-size:.75rem!important}}@media(max-width:480px){.landing-title{font-size:1.8rem!important}.home-center{padding:2rem 1rem 3rem!important}.landing-badge{font-size:.75rem!important;text-align:center;display:inline-block!important}.chat-header h2{font-size:.95rem!important}}@media(min-width:769px)and (max-width:1023px){.sidebar{width:220px;min-width:200px}}@media(min-width:1024px){.messages{padding:1.2rem 2rem}}.qr-modal-overlay{position:fixed;inset:0;background:#00000080;z-index:500;display:flex;align-items:center;justify-content:center;animation:fadeIn .2s var(--ease);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.qr-modal{background:var(--bg);border-radius:24px;padding:2rem;max-width:360px;width:90%;text-align:center;box-shadow:var(--shadow-lg);border:1px solid var(--border);animation:cardIn .3s var(--ease)}.qr-modal h3{font-size:1.2rem;font-weight:700;margin-bottom:1.5rem;color:var(--text)}.qr-modal .qr-code{display:flex;justify-content:center;margin-bottom:1.5rem}.qr-modal .qr-room-code{font-size:2rem;font-weight:800;letter-spacing:.1em;color:var(--text);margin-bottom:.5rem}.qr-modal .qr-label{font-size:.8rem;color:var(--text-3);margin-bottom:1.5rem}.qr-modal .qr-actions{display:flex;gap:.75rem;justify-content:center}.qr-modal .qr-btn{padding:.6rem 1.2rem;border-radius:12px;border:1px solid var(--border);background:var(--bg-2);color:var(--text);font-family:inherit;font-weight:600;font-size:.85rem;cursor:pointer;transition:all .2s}.qr-modal .qr-btn:hover{background:var(--bg-hover);transform:scale(1.02)}.qr-modal .qr-btn-primary{background:var(--accent);color:var(--bg);border-color:var(--accent)}.qr-modal .qr-btn-primary:hover{background:var(--text)}.msg-reply-quoted{border-left:3px solid var(--accent);padding:4px 8px;background:#0000000a;font-size:.8rem;border-radius:4px;margin-bottom:6px;opacity:.85;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.input-reply-preview{display:flex;align-items:center;justify-content:space-between;background:var(--bg-2);padding:8px 16px;border-top-left-radius:12px;border-top-right-radius:12px;border-bottom:1px solid var(--border);border-left:3px solid var(--accent);font-size:.8rem}.message{position:relative}.msg-reply-btn{position:absolute;top:50%;transform:translateY(-50%);background:var(--bg);border:1px solid var(--border);border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .2s;z-index:5;font-size:.8rem;box-shadow:var(--shadow-sm)}.message:hover .msg-reply-btn{opacity:1}.message.sent .msg-reply-btn{left:-36px}.message.received .msg-reply-btn{right:-36px}.reaction-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 6px;border-radius:12px;border:1px solid var(--border);background:var(--bg-2);scale:.9;cursor:pointer;transition:all .2s}.reaction-badge.active{border:1px solid var(--accent);background:var(--bg-3)}.add-reaction-btn{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;border:1px solid var(--border);background:none;cursor:pointer;color:var(--text-3);font-size:.8rem;transition:all .2s}.add-reaction-btn:hover{background:var(--bg-hover);color:var(--text)}.quick-reaction-popover{position:absolute;bottom:24px;left:0;background:var(--bg);border:1px solid var(--border);border-radius:20px;padding:4px 8px;display:flex;gap:6px;box-shadow:var(--shadow-md);z-index:10;animation:fadeIn .15s ease}.quick-emoji-option:hover{transform:scale(1.2)}.home-encryption-badge{margin-top:1.5rem;display:flex;align-items:center;justify-content:center;font-size:.8rem;color:#16a34a;font-weight:500}.search-highlight{animation:highlight-pulse 2s ease}@keyframes highlight-pulse{0%{background-color:#fde04780}to{background-color:transparent}}.message{animation:msgSlideUp .35s cubic-bezier(.16,1,.3,1) both}@keyframes msgSlideUp{0%{opacity:0;transform:translateY(12px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}.home-card{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:#ffffffd1!important;border:1px solid rgba(0,0,0,.05)!important;box-shadow:0 20px 40px #0000000f,0 1px 3px #00000005!important}.btn-create,.btn-join,.qr-btn,.hdr-btn{transition:all .25s cubic-bezier(.4,0,.2,1)!important}.btn-create:hover:not(:disabled){background:var(--accent)!important;opacity:.95;transform:translateY(-1px) scale(1.01)!important;box-shadow:0 8px 24px #db277738!important}.btn-join:hover:not(:disabled){background:var(--bg-hover)!important;color:var(--accent)!important;border-color:var(--accent)!important;transform:translateY(-1px) scale(1.01)!important;box-shadow:0 8px 24px #db277714!important}.reaction-badge{transition:all .2s cubic-bezier(.175,.885,.32,1.275)!important}.reaction-badge:hover{transform:scale(1.06)!important;background:var(--bg-hover)!important}.reaction-badge:active{transform:scale(.92)!important}.link-preview-card{transition:all .3s cubic-bezier(.25,.8,.25,1)!important}.link-preview-card:hover{transform:translateY(-2px)!important;box-shadow:0 12px 24px #00000014!important;border-color:var(--accent)!important}.scroll-btn{transition:all .25s cubic-bezier(.175,.885,.32,1.275)!important;animation:bounceIn .3s cubic-bezier(.175,.885,.32,1.275) both}@keyframes bounceIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.scroll-btn:hover{background:var(--accent)!important;color:var(--bg)!important;transform:scale(1.05)!important}.home-input:focus,.sb-search:focus{border-color:var(--accent)!important;box-shadow:0 0 0 4px #db277714!important}