*{box-sizing:border-box;margin:0;padding:0}:root{--primary-gradient: linear-gradient(135deg, #6366f1 0%, #a855f7 100%);--secondary-gradient: linear-gradient(135deg, #3b82f6 0%, #2dd4bf 100%);--sidebar-bg: rgba(255, 255, 255, .85);--chat-bg: #ffffff;--bg-color: #f3f4f6;--bubble-sent: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);--bubble-received: #f3f4f6;--text-dark: #111827;--text-light: #6b7280;--glass-border: rgba(255, 255, 255, .2);--pro-bg: #f8f9fa;--pro-card-bg: #ffffff;--pro-text: #2c3e50;--pro-subtext: #7f8c8d;--pro-accent: #007aff;--pro-border: #e1e4e8;--pro-shadow: 0 4px 6px -1px rgba(0, 0, 0, .05), 0 2px 4px -1px rgba(0, 0, 0, .03)}body{background:#f0f2f5;background-image:radial-gradient(at 0% 0%,hsla(253,16%,7%,1) 0,transparent 50%),radial-gradient(at 50% 0%,hsla(225,39%,30%,1) 0,transparent 50%),radial-gradient(at 100% 0%,hsla(339,49%,30%,1) 0,transparent 50%);background-size:cover;background-attachment:fixed;font-family:Inter,system-ui,-apple-system,sans-serif;height:100vh;height:100dvh;overflow-x:hidden}.chat-page{display:flex;justify-content:center;align-items:center;height:100vh;height:100dvh;padding:1.5rem;background:linear-gradient(to bottom right,#f3e8ff,#e0f2fe)}.chat-container{display:flex;width:100%;max-width:1400px;height:92vh;background:#fffffff2;border-radius:24px;box-shadow:0 20px 25px -5px #0000001a;overflow:hidden;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.5);position:relative}.sidebar{width:380px;background:var(--sidebar-bg);border-right:1px solid rgba(0,0,0,.05);display:flex;flex-direction:column;flex-shrink:0}.sidebar-header{padding:1.5rem;display:flex;margin-top:-34px;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(0,0,0,.05)}.sidebar-header span{font-size:1.5rem;font-weight:800;background:var(--primary-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.user-item{display:flex;align-items:center;padding:1rem 1.5rem;cursor:pointer;transition:all .2s ease;border-bottom:1px solid rgba(0,0,0,.02)}.user-item:hover{background:#6366f10d}.user-item.active{background:#6366f11a;border-left:4px solid #6366f1}.avatar{width:50px;height:50px;border-radius:50%;background:var(--secondary-gradient);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem;margin-right:1rem;box-shadow:0 4px 6px -1px #0000001a;position:relative;flex-shrink:0}.chat-area{flex:1;background:#fff9;display:flex;flex-direction:column;position:relative;min-width:0}.chat-header{padding:1rem 1.5rem;background:#fff;border-bottom:1px solid rgba(0,0,0,.05);display:flex;align-items:center;gap:1rem;box-shadow:0 4px 6px -1px #00000005;z-index:10;cursor:pointer;height:70px}.chat-messages{flex:1;padding:1.5rem;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem}.message-container{max-width:100%}.message-bubble{padding:10px 16px;border-radius:18px;width:fit-content;max-width:80%;position:relative;box-shadow:0 1px 2px #0000000d;white-space:pre-wrap;word-break:normal;overflow-wrap:break-word;word-wrap:break-word;font-size:.95rem;line-height:1.5}.chat-media{max-width:100%;border-radius:10px;margin-bottom:5px;height:auto;object-fit:contain;display:block}@media(min-width:768px){.chat-media{max-width:350px;max-height:400px}}.message-sent{background:var(--bubble-sent);color:#fff;border-bottom-right-radius:4px}.message-received{background:var(--bubble-received);color:var(--text-dark);border-bottom-left-radius:4px}.message-options-menu{position:absolute;top:100%;z-index:20;background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;overflow:hidden;min-width:140px;animation:scaleIn .2s ease-out;transform-origin:top center;margin-top:5px}.message-options-menu.sent{left:0;right:auto}.message-options-menu.received{right:0;left:auto}.menu-item{display:flex;align-items:center;width:100%;text-align:left;padding:10px 14px;background:none;border:none;cursor:pointer;font-size:.9rem;gap:10px;transition:background .2s;color:#374151}.menu-item:hover{background:#f3f4f6}.menu-item.delete{color:#ef4444}.menu-item.hide{color:#6b7280}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.chat-input-area{padding:1rem 1.5rem;background:#fff;border-top:1px solid rgba(0,0,0,.05)}.chat-input-wrapper{display:flex;align-items:center;background:#f3f4f6;padding:.5rem 1rem;border-radius:24px;border:1px solid transparent;transition:all .2s;width:100%}.chat-input-wrapper:focus-within{background:#fff;border-color:#6366f1;box-shadow:0 0 0 4px #6366f11a}.chat-input{flex:1;border:none;background:transparent;padding:8px;outline:none;font-size:1rem;min-width:0}.send-btn{background:var(--primary-gradient);border:none;width:40px;height:40px;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;margin-left:.5rem}.auth-container{min-height:100vh;display:flex;justify-content:center;align-items:center;background:radial-gradient(circle at top right,#4c1d95,#1e1b4b);position:relative;overflow:hidden;padding:20px}.auth-shape{position:absolute;filter:blur(80px);z-index:1;opacity:.6}.auth-shape-1{background:#a855f7;width:400px;height:400px;border-radius:50%;top:-100px;left:-100px;animation:float 8s ease-in-out infinite}.auth-shape-2{background:#3b82f6;width:300px;height:300px;border-radius:50%;bottom:-50px;right:-50px;animation:float 10s ease-in-out infinite reverse}@keyframes float{0%,to{transform:translate(0)}50%{transform:translate(20px,20px)}}.auth-box{background:#ffffffe6;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);padding:3rem;border-radius:32px;box-shadow:0 25px 50px -12px #00000080;width:100%;max-width:450px;z-index:10;border:1px solid rgba(255,255,255,.2);display:flex;flex-direction:column;gap:1.5rem;animation:slideUp .5s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.auth-header{text-align:center;margin-bottom:.5rem}.auth-header h2{font-size:2rem;font-weight:800;background:linear-gradient(to right,#4c1d95,#3b82f6);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:.5rem}.auth-header p{color:#6b7280;font-size:.95rem}.input-group{position:relative;display:flex;flex-direction:column}.input-field{padding:1rem 1rem 1rem 3rem;border-radius:12px;border:1px solid #e5e7eb;background:#f9fafb;font-size:1rem;outline:none;transition:all .2s;width:100%}.input-field:focus{background:#fff;border-color:#6366f1;box-shadow:0 0 0 4px #6366f11a}.input-icon{position:absolute;top:50%;transform:translateY(-50%);left:1rem;color:#9ca3af;pointer-events:none}.input-field:focus+.input-icon{color:#6366f1}.btn-primary{padding:1rem;border-radius:12px;border:none;background:linear-gradient(135deg,#6366f1,#4338ca);color:#fff;font-weight:600;font-size:1.1rem;cursor:pointer;transition:transform .1s,box-shadow .2s;box-shadow:0 10px 15px -3px #6366f14d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 15px 20px -3px #6366f166}.btn-primary:active{transform:translateY(1px)}.profile-info-sidebar{width:0;overflow:hidden;border-left:1px solid rgba(0,0,0,.05);background:#fff;transition:width .3s ease;display:flex;flex-direction:column}.profile-info-sidebar.open{width:350px}.tg-profile-page{min-height:100vh;background-color:var(--pro-bg);color:var(--pro-text);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex;flex-direction:column;align-items:center;padding-top:2rem;width:100%;overflow-x:hidden}.tg-container{max-width:500px;width:90%;margin:0 auto;display:flex;flex-direction:column;gap:1.5rem}.tg-navbar{width:100%;max-width:500px;display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding:0 .5rem}.tg-nav-btn{background:#fff;border:1px solid var(--pro-border);color:var(--pro-text);cursor:pointer;padding:10px;border-radius:12px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #00000008}.tg-header{background:var(--pro-card-bg);border-radius:20px;padding:2.5rem 1rem;display:flex;flex-direction:column;align-items:center;box-shadow:var(--pro-shadow);border:1px solid var(--pro-border);text-align:center;width:100%}.tg-avatar-container{width:120px;height:120px;position:relative;cursor:pointer;margin-bottom:1.5rem}.tg-avatar{width:100%;height:100%;border-radius:50%;overflow:hidden;background:#e9ecef;display:flex;align-items:center;justify-content:center;border:4px solid white;box-shadow:0 8px 16px #0000001a}.tg-avatar img{width:100%;height:100%;object-fit:cover}.tg-avatar-text{font-size:3rem;font-weight:600;color:#adb5bd}.tg-avatar-overlay{position:absolute;inset:0;background:#0000004d;border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}.tg-avatar-container:hover .tg-avatar-overlay{opacity:1}.tg-name{font-size:1.6rem;margin:0;font-weight:700;word-break:break-word}.tg-status{color:var(--pro-subtext);margin-top:.5rem}.tg-info-list{background:var(--pro-card-bg);border-radius:20px;overflow:hidden;box-shadow:var(--pro-shadow);border:1px solid var(--pro-border);width:100%}.tg-info-item{display:flex;align-items:center;padding:1.2rem 1rem;border-bottom:1px solid #f1f3f5}.tg-info-item:last-child{border-bottom:none}.tg-info-icon{width:40px;height:40px;border-radius:10px;background:#f0f7ff;color:var(--pro-accent);display:flex;align-items:center;justify-content:center;margin-right:1rem;flex-shrink:0}.tg-info-content{flex:1;min-width:0}.tg-info-value{font-size:1rem;font-weight:600;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tg-info-label{font-size:.85rem;color:var(--pro-subtext)}.tg-modal-overlay{position:fixed;inset:0;background:#0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.tg-modal{background:#fff;width:90%;max-width:450px;border-radius:24px;box-shadow:0 25px 50px -12px #00000026;overflow:hidden;animation:modalFadeIn .3s ease;display:flex;flex-direction:column}.tg-modal-header{padding:1.5rem 2rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #f1f3f5}.tg-modal-header h3{margin:0;font-size:1.25rem}.tg-modal-body{padding:2rem;display:flex;flex-direction:column;gap:1.5rem;overflow-y:auto;max-height:70vh}.tg-input{width:100%;padding:.8rem 1rem;border-radius:10px;border:1px solid #e2e8f0;font-size:1rem;background:#f9fafb}.tg-modal-footer{padding:1.5rem 2rem;display:flex;justify-content:flex-end;gap:1rem;border-top:1px solid #f1f3f5}.tg-save-btn{padding:.8rem 2rem;border-radius:10px;border:none;background:var(--pro-accent);color:#fff;font-weight:600;cursor:pointer}.tg-cancel-btn{padding:.8rem 1.5rem;background:#fff;border:1px solid #e1e4e8;border-radius:10px;cursor:pointer}@keyframes modalFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.chat-page{padding:0;height:100dvh;width:100%;overflow:hidden}.chat-container{height:100%;width:100%;max-width:none;border:none;border-radius:0;flex-direction:row}.chat-container.show-chat .sidebar{display:none}.chat-container.show-chat .chat-area,.chat-container.show-list .sidebar{display:flex;width:100%;height:100%}.chat-container.show-list .chat-area{display:none}.sidebar{width:100%;height:100%;border:none}.message-bubble{max-width:85%}.chat-messages,.chat-input-area{padding:.8rem}.profile-info-sidebar.open{position:fixed;inset:0;width:100%;height:100%;z-index:200}}@media(max-width:600px){.tg-profile-page{padding-top:.5rem;padding-bottom:2rem}.tg-container{width:95%;margin:0 auto;gap:1rem}.tg-header{padding:1.5rem 1rem}.tg-avatar-container{width:100px;height:100px}.tg-name{font-size:1.4rem}.tg-modal{width:95%;max-height:90vh;border-radius:16px;margin:auto}.tg-modal-header{padding:1rem 1.25rem}.tg-modal-body{padding:1.25rem;gap:1rem}.tg-modal-footer{padding:1rem 1.25rem}.tg-save-btn{padding:.7rem 1.5rem}.auth-box{padding:2rem;max-width:90%}.auth-shape{opacity:.4}.auth-header h2{font-size:1.7rem}}