:root{--bg: #faf8f4;--terracotta: #e8734a;--terracotta-deep: #d0603a;--received-bubble: #efebe3;--received-text: #2b2a28;--ai-bubble: #dce8dd;--ai-text: #2b2a28;--ai-accent: #5b8c6b;--border: #e5e0d6;--muted: #9c9689;--error: #c9573f;--font: "Inter", -apple-system, BlinkMacSystemFont, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--received-text);font-family:var(--font);font-size:16px;-webkit-font-smoothing:antialiased}button,input,textarea{font-family:inherit}.app-frame{max-width:460px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;background:var(--bg)}.auth-screen{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2.5rem 1.75rem;text-align:center}.auth-logo{width:72px;height:72px;border-radius:50%;background:var(--terracotta);display:flex;align-items:center;justify-content:center;margin-bottom:1.25rem}.auth-logo .ring{width:30px;height:30px;border-radius:50%;border:2.5px solid #fff}.auth-title{font-size:1.6rem;font-weight:700;margin:0 0 .5rem}.auth-subtitle{color:var(--muted);font-size:.95rem;margin:0 0 2rem;line-height:1.5}.auth-form{width:100%;text-align:left}.auth-label{display:block;font-size:.85rem;font-weight:600;margin-bottom:.4rem}.auth-input{width:100%;padding:.85rem 1rem;border:1px solid var(--border);border-radius:14px;background:#fff;font-size:1rem;margin-bottom:1rem}.auth-input:focus{outline:2px solid var(--terracotta);outline-offset:1px}.btn-primary{width:100%;padding:.9rem;background:var(--terracotta);color:#fff;border:none;border-radius:999px;font-size:1rem;font-weight:700;cursor:pointer;transition:transform .2s ease,opacity .2s ease,background .2s ease}.btn-primary:hover{background:var(--terracotta-deep)}.btn-primary:active{transform:scale(.97)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.auth-hint{font-size:.82rem;color:var(--muted);margin-top:.9rem;text-align:center}.auth-switch{margin-top:1.75rem;font-size:.9rem;color:var(--muted)}.auth-switch button{background:none;border:none;color:var(--terracotta-deep);font-weight:600;cursor:pointer;font-size:.9rem;padding:0}.auth-error{color:var(--error);font-size:.85rem;margin:-.4rem 0 1rem}.member-pill{margin-top:2.5rem;display:inline-flex;align-items:center;gap:.5rem;font-size:.82rem;color:var(--muted)}.member-dots{display:flex;gap:4px}.member-dots span{width:10px;height:10px;border-radius:50%;background:var(--border)}.member-dots span.active{background:var(--terracotta)}.chat-header{border-bottom:1px solid var(--border);padding:.9rem 1.1rem .8rem;background:var(--bg);position:sticky;top:0;z-index:5}.chat-header-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.avatar-stack{display:flex}.avatar{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.75rem;font-weight:700;border:2px solid var(--bg);margin-left:-8px}.avatar:first-child{margin-left:0}.icon-btn{background:none;border:none;cursor:pointer;color:var(--received-text);font-size:1.1rem;padding:.3rem}.chat-title{font-size:1.15rem;font-weight:700;margin:0}.chat-subtitle{font-size:.82rem;color:var(--muted);margin:.15rem 0 0}.chat-subtitle .dot{color:var(--ai-accent)}.conn-banner{display:flex;align-items:center;gap:.6rem;background:#fff;border:1px solid #f0d6cd;border-radius:999px;padding:.7rem 1rem;margin:.75rem 1.1rem 0;box-shadow:0 2px 10px #0000000a}.conn-dot{width:8px;height:8px;border-radius:50%;background:var(--error);flex-shrink:0}.conn-text{font-size:.88rem;font-weight:600;color:var(--error);flex:1}.conn-spinner{width:16px;height:16px;border-radius:50%;border:2px solid #f0d6cd;border-top-color:var(--error);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.message-feed{flex:1;overflow-y:auto;padding:1rem 1.1rem 1.25rem}.date-divider{text-align:center;margin:.75rem 0 1.25rem}.date-divider span{background:var(--received-bubble);color:var(--muted);font-size:.75rem;font-weight:600;padding:.3rem .9rem;border-radius:999px}.msg-group{margin-bottom:1.1rem}.msg-sender{font-size:.82rem;font-weight:700;margin:0 0 .35rem 2px;display:flex;align-items:center;gap:.4rem}.msg-sender.ai{color:var(--ai-accent)}.ai-chip{font-size:.65rem;font-weight:700;color:var(--ai-accent);background:#cfe3d1;padding:.05rem .45rem;border-radius:999px}.msg-row{display:flex;margin-bottom:.35rem}.msg-row.own{justify-content:flex-end}.msg-row.ai{align-items:flex-end;gap:.5rem}.ai-avatar{width:26px;height:26px;border-radius:50%;background:var(--ai-accent);flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.8rem}.bubble{max-width:78%;padding:.65rem .95rem;border-radius:18px;font-size:.95rem;line-height:1.45;word-wrap:break-word}.bubble.own{background:var(--terracotta);color:#fff;border-bottom-right-radius:4px}.bubble.received{background:var(--received-bubble);color:var(--received-text);border-bottom-left-radius:4px}.bubble.ai{background:var(--ai-bubble);color:var(--ai-text);border-bottom-left-radius:4px}.msg-time{font-size:.72rem;color:var(--muted);margin:.3rem 2px 0}.msg-time.own{text-align:right}.msg-image{max-width:220px;border-radius:16px;overflow:hidden;cursor:pointer;margin-bottom:.3rem}.msg-image img{width:100%;display:block}.ai-typing{font-size:.82rem;color:var(--muted);padding:0 .2rem .5rem;display:flex;align-items:center;gap:.4rem}.empty-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);text-align:center;padding:2rem}.empty-icon{width:56px;height:56px;border-radius:50%;background:var(--received-bubble);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:.75rem}.input-bar-wrap{position:sticky;bottom:0;background:var(--bg);border-top:1px solid var(--border);padding:.75rem 1.1rem;box-shadow:0 -2px 12px #0000000d}.ai-hint{font-size:.78rem;color:var(--ai-accent);font-weight:600;margin:0 0 .4rem .2rem}.input-bar{display:flex;align-items:center;gap:.6rem}.attach-btn{width:40px;height:40px;border-radius:50%;background:var(--received-bubble);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;font-size:1.05rem;transition:transform .2s ease}.attach-btn:active{transform:scale(.94)}.msg-input-shell{flex:1;background:#fff;border:1px solid var(--border);border-radius:999px;padding:.6rem 1.1rem}.msg-input{width:100%;border:none;outline:none;font-size:.95rem;background:transparent}.send-btn{width:42px;height:42px;border-radius:50%;background:var(--terracotta);border:none;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;font-size:1.1rem;transition:transform .2s ease,opacity .2s ease}.send-btn:active{transform:scale(.94)}.send-btn:disabled{opacity:.5;cursor:not-allowed}.upload-screen{flex:1;display:flex;flex-direction:column;padding:1rem 1.1rem}.upload-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.upload-header h2{font-size:1.05rem;margin:0}.upload-header .room-name{font-size:.82rem;color:var(--muted)}.upload-preview{border-radius:18px;overflow:hidden;margin-bottom:1rem;max-height:320px}.upload-preview img{width:100%;display:block;object-fit:cover}.caption-input{width:100%;padding:.85rem 1rem;border:1px solid var(--border);border-radius:14px;background:#fff;font-size:.95rem;margin-bottom:1rem}.upload-actions{display:flex;gap:.7rem}.btn-secondary{flex:1;padding:.85rem;background:#fff;border:1px solid var(--border);border-radius:999px;font-weight:700;cursor:pointer}.upload-actions .btn-primary{flex:1.4}.upload-note{font-size:.78rem;color:var(--muted);text-align:center;margin-top:.9rem}.lightbox{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:50;padding:1.5rem}.lightbox img{max-width:100%;max-height:78vh;border-radius:12px}.lightbox-close{position:absolute;top:1.25rem;right:1.25rem;width:36px;height:36px;border-radius:50%;background:#ffffff26;border:none;color:#fff;font-size:1.2rem;cursor:pointer}.lightbox-caption{position:absolute;bottom:1.5rem;left:0;right:0;text-align:center;color:#fff;font-size:.85rem}.lightbox-caption .name{font-weight:700}