:root{--primary-pink: #e8c8d4;--primary-pink-dark: #c8788e;--accent-gold: #d4a814;--text-pink: #e8a0b5;--bg-main: #faf8f6;--text-primary: #666;--font-primary: "Segoe UI", -apple-system, BlinkMacSystemFont, sans-serif}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;width:100%;margin:0;padding:0;font-family:var(--font-primary);background-image:linear-gradient(to top,#0003,#0000000d);box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-overflow-scrolling:touch;overscroll-behavior:none;overscroll-behavior-y:contain;touch-action:manipulation}#root{height:100%;width:100%}::-webkit-scrollbar{display:none;width:0;height:0;background:transparent}*{scrollbar-width:none}*{-ms-overflow-style:none}input,textarea,button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0}input,textarea,select{font-size:16px!important}*:focus{outline:none;-webkit-tap-highlight-color:transparent}@keyframes native-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}img{-webkit-user-drag:none;pointer-events:none}button img{pointer-events:auto}body{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.avatar-initials{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:1.2em}.avatar{border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;flex-shrink:0;overflow:hidden;border:2px solid #e0e0e0;background:#607d8b}.avatar img{width:100%;height:100%;object-fit:cover}.avatar--small{width:32px;height:32px;font-size:.85rem}.avatar--medium{width:40px;height:40px;font-size:1rem}.avatar--large{width:56px;height:56px;font-size:1.25rem}.message{display:flex;gap:12px;align-items:flex-start;animation:message-fade-in .3s ease}@keyframes message-fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.message__content{display:flex;flex-direction:column;gap:2px;padding-top:4px}.message__line{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}.message__username{font-weight:600;font-size:.95rem;color:#fff}.message__text{font-size:.95rem;color:#fffb90;word-break:break-word}.message--own .message__username{color:#fff}.message--own .message__text{color:#fffb90}.empty-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#ccc;gap:8px}.empty-state__icon{font-size:2.5rem;opacity:.5}.empty-state__message{font-size:.9rem}.message-list{flex:1;overflow-y:auto;padding:16px 50px 16px 16px;display:flex;flex-direction:column;gap:12px;background:transparent}.message-list--empty{padding-right:16px}.emoji-picker{position:absolute;bottom:50px;left:0;width:280px;max-height:200px;overflow-y:auto;background:#282828f2;border-radius:12px;padding:10px;display:grid;grid-template-columns:repeat(8,1fr);gap:4px;box-shadow:0 4px 20px #0000004d;z-index:1000;animation:emoji-picker-slide-up .2s ease}@keyframes emoji-picker-slide-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.emoji-picker__item{width:30px;height:30px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;background:transparent;border:none;border-radius:6px;cursor:pointer;transition:all .15s;outline:none;-webkit-tap-highlight-color:transparent}.emoji-picker__item:hover{background:#fff3;transform:scale(1.2)}.emoji-picker__item:focus{outline:none;box-shadow:none}.toast{position:fixed;top:50px;left:50%;transform:translate(-50%);padding:12px 20px;border-radius:12px;display:flex;align-items:center;gap:10px;font-size:.9rem;font-weight:500;box-shadow:0 4px 20px #00000040;z-index:9999;animation:toast-slide-down .3s ease-out;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}@keyframes toast-slide-down{0%{opacity:0;transform:translate(-50%) translateY(-20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.toast--warning{background:#ffc107f2;color:#7a5c00;border:1px solid rgba(255,193,7,.5)}.toast--error{background:#f44336f2;color:#fff;border:1px solid rgba(244,67,54,.5)}.toast--success{background:#4caf50f2;color:#fff;border:1px solid rgba(76,175,80,.5)}.toast--info{background:#2196f3f2;color:#fff;border:1px solid rgba(33,150,243,.5)}.toast__icon{font-size:1.1rem}.toast__message{display:flex;align-items:center;gap:6px}.toast__countdown{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:24px;padding:0 8px;background:#00000026;border-radius:12px;font-weight:700;font-size:.85rem}@media(max-width:400px){.toast{width:90%;max-width:300px;padding:10px 16px;font-size:.85rem}}.chat-input{display:flex;align-items:center;gap:10px;padding:12px 16px;background:transparent;border-top:none}.chat-input__emoji-wrapper{position:relative}.chat-input__emoji-btn{width:36px;height:36px;padding:0;border-radius:50%;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s;overflow:hidden;outline:none;-webkit-tap-highlight-color:transparent}.chat-input__emoji-btn:hover{transform:scale(1.15)}.chat-input__emoji-btn:focus{outline:none;box-shadow:none}.chat-input__emoji-icon{width:36px;height:36px;object-fit:contain}.chat-input__field{min-width:0;height:33px;flex:1;padding:12px 18px;border:3px solid #E7D16C;border-radius:11px;background:#e8c8d4;font-size:16px;outline:none;color:#666;transition:all .2s;-webkit-user-select:text;user-select:text;-webkit-appearance:none;appearance:none}.chat-input__field::placeholder{color:#a08090}.chat-input__field:focus{background:#dfc0cc;border-color:#d4c060}.chat-input__send-btn{display:flex;align-items:center;justify-content:center;padding:0;border:none;background:transparent;cursor:pointer;transition:transform .2s;outline:none;-webkit-tap-highlight-color:transparent}.chat-input__send-btn:hover{transform:scale(1.05)}.chat-input__send-btn:active{transform:scale(.98)}.chat-input__send-btn:focus{outline:none;box-shadow:none}.chat-input__send-icon{height:32px;width:auto;object-fit:contain}@media(max-width:400px){.chat-input__field{padding:10px 14px;font-size:.9rem}.chat-input__send-btn{min-width:46px;padding:0 10px}}.expand-button{width:28px;height:16px;padding:8px 6px;gap:10px;border-radius:50px;position:absolute;top:12px;right:12px;border:0;background:#ffffff80;color:#e90848;font-size:.85rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:100;outline:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.expand-button:hover{background:#e8a0b5;color:#fff}.expand-button:focus{outline:none;box-shadow:none}.expand-button svg{width:14px;height:14px}.chat-container{height:100%;display:flex;flex-direction:column;position:relative;font-family:Segoe UI,-apple-system,BlinkMacSystemFont,sans-serif;overflow:hidden}.connection-status{position:absolute;top:0;left:0;right:0;padding:8px 16px;font-size:.85rem;text-align:center;z-index:50;animation:slide-down .3s ease}@keyframes slide-down{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}.connection-status--disconnected{background:#f44336e6;color:#fff}.connection-status--connected{background:#4caf50e6;color:#fff}@media(max-width:400px){.chat-container{font-size:14px}}
