:root{--chat-gradient: linear-gradient(135deg, #87CEEB 0%, #1E90FF 50%, #FFFFFF 100%);--chat-gradient-button: linear-gradient(135deg, #4A90E2 0%, #1E90FF 50%, #0066CC 100%);--chat-primary: #1E90FF;--chat-primary-dark: #0066CC;--chat-primary-light: #87CEEB;--chat-secondary: #6c757d;--chat-success: #22c55e;--chat-danger: #DC3545;--chat-white: #FFFFFF;--chat-black: #000000;--chat-gray-50: #F8FAFC;--chat-gray-100: #F0F2F5;--chat-gray-200: #E5E7EB;--chat-gray-300: #D1D5DB;--chat-gray-400: #9CA3AF;--chat-gray-500: #6B7280;--chat-gray-600: #4B5563;--chat-gray-700: #374151;--chat-gray-800: #1F2937;--chat-gray-900: #111827;--chat-shadow-sm: 0 2px 8px rgba(0, 0, 0, .08);--chat-shadow-md: 0 4px 15px rgba(0, 0, 0, .12);--chat-shadow-lg: 0 8px 24px rgba(0, 0, 0, .15);--chat-shadow-xl: 0 12px 40px rgba(0, 0, 0, .18);--chat-radius-sm: 8px;--chat-radius-md: 12px;--chat-radius-lg: 16px;--chat-radius-xl: 24px;--chat-radius-full: 9999px;--chat-transition: all .3s cubic-bezier(.4, 0, .2, 1);--chat-transition-fast: all .15s ease}.floating-chat-button{position:fixed!important;bottom:24px!important;right:24px!important;z-index:9999!important;width:70px;height:70px;border-radius:var(--chat-radius-full);background:var(--chat-gradient-button);border:none;box-shadow:var(--chat-shadow-lg);cursor:pointer;transition:var(--chat-transition);display:flex;align-items:center;justify-content:center;animation:chat-button-entrance .5s cubic-bezier(.68,-.55,.265,1.55)}@keyframes chat-button-entrance{0%{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.floating-chat-button:hover{transform:translateY(-4px) scale(1.05);box-shadow:var(--chat-shadow-xl)}.floating-chat-button:active{transform:translateY(-2px) scale(.98)}.floating-chat-button .chat-icon{width:28px;height:28px;color:var(--chat-white);transition:var(--chat-transition-fast)}.floating-chat-button:hover .chat-icon{transform:scale(1.1)}.floating-chat-button .unread-badge{position:absolute;top:-4px;right:-4px;background:var(--chat-danger);color:var(--chat-white);font-size:11px;font-weight:700;min-width:20px;height:20px;border-radius:var(--chat-radius-full);display:none;align-items:center;justify-content:center;padding:0 6px;border:2px solid var(--chat-white);box-shadow:var(--chat-shadow-md)}.floating-chat-button .unread-badge.show{display:flex;animation:badge-bounce .5s cubic-bezier(.68,-.55,.265,1.55)}@keyframes badge-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.floating-chat-button .pulse-ring{position:absolute;width:100%;height:100%;border-radius:var(--chat-radius-full);border:3px solid var(--chat-primary);opacity:0;pointer-events:none}.floating-chat-button.has-unread .pulse-ring{animation:pulse-ring 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse-ring{0%{transform:scale(.9);opacity:1}to{transform:scale(1.4);opacity:0}}.floating-chat-button.pulse-animation{animation:button-pulse .6s ease-in-out 3}@keyframes button-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}.floating-chat-container{position:fixed!important;bottom:100px!important;right:24px!important;width:420px;max-width:calc(100vw - 48px);height:600px;max-height:calc(100vh - 150px);background:var(--chat-white);border-radius:var(--chat-radius-xl);box-shadow:var(--chat-shadow-xl);z-index:9998!important;display:flex;flex-direction:column;overflow:hidden;transform-origin:bottom right;transition:var(--chat-transition)}.floating-chat-container.hidden{opacity:0!important;transform:scale(.9) translateY(20px)!important;pointer-events:none!important;visibility:hidden!important}.floating-chat-container.show{opacity:1;transform:scale(1) translateY(0);animation:chat-container-entrance .4s cubic-bezier(.68,-.55,.265,1.55)}@keyframes chat-container-entrance{0%{opacity:0;transform:scale(.8) translateY(30px)}to{opacity:1;transform:scale(1) translateY(0)}}.chat-header{background:var(--chat-gradient);color:var(--chat-white);padding:16px 20px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;box-shadow:var(--chat-shadow-sm)}.chat-header-left{display:flex;align-items:center;gap:12px;flex:1;min-width:0}.chat-back-btn{background:#fff3;border:none;width:32px;height:32px;border-radius:var(--chat-radius-full);display:none;align-items:center;justify-content:center;cursor:pointer;transition:var(--chat-transition-fast)}.chat-back-btn:hover{background:#ffffff4d;transform:scale(1.1)}.chat-back-btn svg{width:20px;height:20px;fill:var(--chat-white)}.chat-title{flex:1;min-width:0}.chat-title h3{font-size:16px;font-weight:600;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-title span{font-size:12px;opacity:.9}.chat-header-actions{display:flex;gap:8px}.chat-action-btn{background:#fff3;border:none;width:32px;height:32px;border-radius:var(--chat-radius-full);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--chat-transition-fast)}.chat-action-btn:hover{background:#ffffff4d;transform:scale(1.1)}.chat-action-btn svg{width:18px;height:18px;fill:var(--chat-white)}.chat-body{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}.chat-rooms-list{display:flex;flex-direction:column;height:100%}.chat-search{padding:16px;border-bottom:1px solid var(--chat-gray-200)}.chat-search input{width:100%;padding:12px 16px;border:1px solid var(--chat-gray-300);border-radius:var(--chat-radius-lg);font-size:14px;transition:var(--chat-transition-fast)}.chat-search input:focus{outline:none;border-color:var(--chat-primary);box-shadow:0 0 0 3px #1e90ff1a}.chat-rooms-container{flex:1;overflow-y:auto;padding:8px}.chat-room-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:var(--chat-radius-md);cursor:pointer;transition:var(--chat-transition-fast);position:relative}.chat-room-item:hover{background:var(--chat-gray-50)}.chat-room-item.unread{background:#1e90ff0d}.room-avatar-container{position:relative;flex-shrink:0}.room-avatar{width:48px;height:48px;border-radius:var(--chat-radius-full);-o-object-fit:cover;object-fit:cover}.online-indicator{position:absolute;bottom:0;right:0;width:12px;height:12px;background:var(--chat-success);border:2px solid var(--chat-white);border-radius:var(--chat-radius-full)}.room-details{flex:1;min-width:0}.room-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.room-name{font-size:14px;font-weight:600;color:var(--chat-gray-900);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-time{font-size:11px;color:var(--chat-gray-500);flex-shrink:0}.room-last-message{display:flex;align-items:center;gap:8px}.message-preview{font-size:13px;color:var(--chat-gray-600);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.room-unread-badge{background:var(--chat-primary);color:var(--chat-white);font-size:11px;font-weight:700;min-width:20px;height:20px;border-radius:var(--chat-radius-full);display:flex;align-items:center;justify-content:center;padding:0 6px}.room-auction-image{width:40px;height:40px;flex-shrink:0}.room-auction-image img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:var(--chat-radius-sm)}.empty-state,.empty-chat-state,.error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;text-align:center;color:var(--chat-gray-500)}.empty-icon{width:64px;height:64px;opacity:.3;margin-bottom:16px}.empty-state h3{font-size:16px;font-weight:600;color:var(--chat-gray-700);margin:0 0 8px}.empty-state p{font-size:14px;margin:0}.active-chat-view{display:flex;flex-direction:column;height:100%}.active-chat-view.hidden{display:none}.chat-messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth}.chat-messages::-webkit-scrollbar{width:6px}.chat-messages::-webkit-scrollbar-track{background:transparent}.chat-messages::-webkit-scrollbar-thumb{background:var(--chat-gray-300);border-radius:var(--chat-radius-full)}.chat-messages::-webkit-scrollbar-thumb:hover{background:var(--chat-gray-400)}.chat-message{display:flex;gap:8px;animation:message-slide-in .3s ease}@keyframes message-slide-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.chat-message.own{flex-direction:row-reverse}.message-avatar{width:32px;height:32px;border-radius:var(--chat-radius-full);-o-object-fit:cover;object-fit:cover;flex-shrink:0}.message-bubble{max-width:70%;padding:10px 14px;border-radius:var(--chat-radius-md);position:relative}.chat-message.other .message-bubble{background:var(--chat-gray-100);border-bottom-left-radius:4px}.chat-message.own .message-bubble{background:var(--chat-gradient);color:var(--chat-white);border-bottom-right-radius:4px}.message-content{font-size:14px;line-height:1.5;word-wrap:break-word}.message-content a{color:inherit;text-decoration:underline}.message-meta{display:flex;align-items:center;gap:6px;margin-top:4px;font-size:11px;opacity:.7}.message-time,.message-status{color:inherit}.message-status.read{color:var(--chat-success)}.typing-indicator{padding:12px 16px;display:flex;align-items:center;gap:8px;background:var(--chat-gray-50);border-top:1px solid var(--chat-gray-200)}.typing-indicator.hidden{display:none}.typing-dot{width:8px;height:8px;background:var(--chat-gray-400);border-radius:var(--chat-radius-full);animation:typing-bounce 1.4s infinite ease-in-out}.typing-dot:nth-child(1){animation-delay:0s}.typing-dot:nth-child(2){animation-delay:.2s}.typing-dot:nth-child(3){animation-delay:.4s}@keyframes typing-bounce{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-10px)}}.typing-text{font-size:12px;color:var(--chat-gray-600)}.chat-input-wrapper{padding:16px;border-top:1px solid var(--chat-gray-200);background:var(--chat-white);display:flex;align-items:flex-end;gap:8px}.chat-attachment-btn,.chat-camera-btn,.emoji-btn{background:transparent;border:none;width:36px;height:36px;border-radius:var(--chat-radius-full);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--chat-gray-600);transition:var(--chat-transition-fast);flex-shrink:0}.chat-attachment-btn:hover,.chat-camera-btn:hover,.emoji-btn:hover{background:var(--chat-gray-100);color:var(--chat-primary)}.chat-attachment-btn svg,.chat-camera-btn svg,.emoji-btn svg{width:20px;height:20px;fill:currentColor}.chat-attachments-preview{display:none;gap:8px;padding:8px 0;flex-wrap:wrap}.attachment-preview{position:relative;width:80px;height:80px;border-radius:var(--chat-radius-md);overflow:hidden;background:var(--chat-gray-100);border:2px solid var(--chat-gray-200)}.attachment-preview img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.attachment-preview .file-icon{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--chat-primary)}.attachment-preview .file-icon svg{width:32px;height:32px;fill:currentColor}.attachment-preview .file-ext{font-size:10px;font-weight:600;margin-top:4px}.attachment-preview .remove-attachment{position:absolute;top:4px;right:4px;width:20px;height:20px;border-radius:var(--chat-radius-full);background:#000000b3;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .2s}.attachment-preview:hover .remove-attachment{opacity:1}.attachment-preview .remove-attachment svg{width:12px;height:12px;fill:#fff}.attachment-preview .file-name{position:absolute;bottom:0;left:0;right:0;background:#000000b3;color:#fff;font-size:9px;padding:2px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-input-container{flex:1;min-width:0}.chat-input-container textarea{width:100%;min-height:40px;max-height:120px;padding:10px 12px;border:1px solid var(--chat-gray-300);border-radius:var(--chat-radius-lg);font-size:14px;line-height:1.5;resize:none;transition:var(--chat-transition-fast);font-family:inherit}.chat-input-container textarea:focus{outline:none;border-color:var(--chat-primary);box-shadow:0 0 0 3px #1e90ff1a}.chat-input-footer{display:flex;justify-content:space-between;align-items:center;margin-top:4px;padding:0 4px}.char-count{font-size:11px;color:var(--chat-gray-500)}.emoji-btn{width:auto;height:auto;padding:4px;font-size:16px}.chat-send-btn{background:var(--chat-gradient);border:none;width:40px;height:40px;border-radius:var(--chat-radius-full);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--chat-transition-fast);flex-shrink:0}.chat-send-btn:hover:not(:disabled){transform:scale(1.05);box-shadow:var(--chat-shadow-md)}.chat-send-btn:active:not(:disabled){transform:scale(.95)}.chat-send-btn:disabled{opacity:.5;cursor:not-allowed}.chat-send-btn svg{width:20px;height:20px;fill:var(--chat-white)}.chat-loading,.loading-messages{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px}.spinner{width:32px;height:32px;border:3px solid var(--chat-gray-200);border-top-color:var(--chat-primary);border-radius:var(--chat-radius-full);animation:spinner-rotate .8s linear infinite}@keyframes spinner-rotate{to{transform:rotate(360deg)}}.chat-loading p,.loading-messages p{margin-top:16px;font-size:14px;color:var(--chat-gray-600)}.new-message-toast{position:fixed;top:24px;right:24px;z-index:10000;background:var(--chat-white);border-radius:var(--chat-radius-lg);box-shadow:var(--chat-shadow-xl);padding:16px;min-width:300px;max-width:400px;cursor:pointer;transition:var(--chat-transition);transform:translate(500px);opacity:0}.new-message-toast.hidden{display:none}.new-message-toast.show{transform:translate(0);opacity:1;animation:toast-slide-in .4s cubic-bezier(.68,-.55,.265,1.55)}@keyframes toast-slide-in{0%{transform:translate(500px);opacity:0}to{transform:translate(0);opacity:1}}.toast-content{display:flex;gap:12px;align-items:flex-start}.toast-avatar{width:40px;height:40px;border-radius:var(--chat-radius-full);-o-object-fit:cover;object-fit:cover;flex-shrink:0}.toast-details{flex:1;min-width:0}.toast-sender{font-size:14px;font-weight:600;color:var(--chat-gray-900);display:block;margin-bottom:4px}.toast-message{font-size:13px;color:var(--chat-gray-600);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:768px){.floating-chat-button{bottom:20px;right:20px;width:56px;height:56px}.floating-chat-container{bottom:0;right:0;width:100vw;height:100vh;max-width:100vw;max-height:100vh;border-radius:0}.chat-header{padding:12px 16px}.chat-back-btn{display:flex}.new-message-toast{right:16px;left:16px;max-width:none}}.floating-chat-button:focus-visible,.chat-action-btn:focus-visible,.chat-send-btn:focus-visible{outline:3px solid var(--chat-primary);outline-offset:2px}.chat-search input:focus-visible,.chat-input-container textarea:focus-visible{outline:none;box-shadow:0 0 0 3px #1e90ff4d}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes scratchHead{0%,to{transform:rotate(0) translateY(0)}15%{transform:rotate(12deg) translateY(-5px)}25%{transform:rotate(-12deg) translateY(-3px)}35%{transform:rotate(12deg) translateY(-5px)}45%{transform:rotate(-8deg) translateY(-2px)}55%{transform:rotate(8deg) translateY(-4px)}65%{transform:rotate(-5deg) translateY(-2px)}75%{transform:rotate(5deg) translateY(-3px)}}.animate-scratch-head{animation:scratchHead 2s ease-in-out}@keyframes wave{0%,to{transform:rotate(0)}10%{transform:rotate(14deg)}20%{transform:rotate(-8deg)}30%{transform:rotate(14deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(10deg)}60%{transform:rotate(0)}}.animate-wave{animation:wave 1.5s ease-in-out;transform-origin:center bottom}@keyframes peek{0%,to{transform:scale(1)}15%{transform:scale(1.1) translateY(-3px)}30%{transform:scale(.95) translateY(2px)}45%{transform:scale(1.05) translateY(-2px)}60%{transform:scale(.98)}75%{transform:scale(1.02)}}.animate-peek{animation:peek 2s ease-in-out}@keyframes bouncePlayful{0%,to{transform:translateY(0)}20%{transform:translateY(-15px)}40%{transform:translateY(-7px)}60%{transform:translateY(-12px)}80%{transform:translateY(-5px)}}.animate-bounce-playful{animation:bouncePlayful 1.5s ease-in-out}@keyframes swing{0%,to{transform:rotate(0)}20%{transform:rotate(15deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-5deg)}}.animate-swing{animation:swing 2s ease-in-out;transform-origin:top center}@keyframes spinSlow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin-slow{animation:spinSlow 3s ease-in-out}@keyframes wiggle{0%,to{transform:translate(0)}10%,30%,50%,70%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}.animate-wiggle{animation:wiggle 1.5s ease-in-out}@keyframes bounceSoft{0%,to{transform:translateY(0)}25%{transform:translateY(-10px)}50%{transform:translateY(-5px)}75%{transform:translateY(-7px)}}.animate-bounce-soft{animation:bounceSoft 1s ease-in-out}@keyframes shakeUrgent{0%,to{transform:translate(0) rotate(0)}10%,30%,50%,70%,90%{transform:translate(-8px) rotate(-3deg)}20%,40%,60%,80%{transform:translate(8px) rotate(3deg)}}.animate-shake-urgent{animation:shakeUrgent 1s ease-in-out}@keyframes bounceNotify{0%,to{transform:scale(1) translateY(0)}30%{transform:scale(1.15) translateY(-10px)}50%{transform:scale(.95) translateY(0)}70%{transform:scale(1.05) translateY(-5px)}}.animate-bounce-notify{animation:bounceNotify 1s ease-out}@keyframes pulseStrong{0%,to{transform:scale(1);box-shadow:0 8px 24px #1e90ff4d}25%{transform:scale(1.15);box-shadow:0 12px 32px #1e90ff80}50%{transform:scale(1.05);box-shadow:0 10px 28px #1e90ff66}75%{transform:scale(1.12);box-shadow:0 12px 32px #1e90ff80}}.animate-pulse-strong{animation:pulseStrong 1.5s ease-in-out}@keyframes celebrate{0%,to{transform:scale(1) rotate(0)}10%{transform:scale(1.2) rotate(-10deg)}20%{transform:scale(1.3) rotate(10deg)}30%{transform:scale(1.15) rotate(-10deg)}40%{transform:scale(1.25) rotate(10deg)}50%{transform:scale(1.1) rotate(-5deg)}60%{transform:scale(1.2) rotate(5deg)}70%{transform:scale(1.05) rotate(-5deg)}80%{transform:scale(1.15) rotate(5deg)}90%{transform:scale(1.05) rotate(0)}}.animate-celebrate{animation:celebrate 2.5s ease-in-out}.floating-chat-button.animate-celebrate,.floating-chat-button.animate-pulse-strong{filter:drop-shadow(0 0 20px rgba(30,144,255,.6))}.floating-chat-button{transition:none}.floating-chat-button:not([class*=animate-]){transition:var(--chat-transition)}
