@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Source+Sans+3:wght@300;400;500;600&display=swap";:root{--color-bg: #fdfdfd;--color-surface: #ffffff;--color-text: #353535;--color-text-muted: #7d7d7d;--color-text-light: #9d9d9d;--color-border: #e0e0e0;--color-accent: #e73b42;--color-accent-hover: #d12d34;--color-accent-muted: #ffe5e7;--color-sidebar-bg: #f5f5f5;--color-success: #0f916a;--color-error: #c42f37;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--font-sans: "Inter", "Source Sans 3", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--safe-bottom: env(safe-area-inset-bottom, 0px);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .06);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08)}@media (prefers-color-scheme: dark){:root{--color-bg: #231f1f;--color-surface: #2f2a2a;--color-text: #d9d4d4;--color-text-muted: #b9b4b4;--color-text-light: #948f8f;--color-border: #3b3636;--color-accent: #ff6b7a;--color-accent-hover: #ff8590;--color-accent-muted: #3a2427;--color-sidebar-bg: #2b2626;--color-success: #35c38f;--color-error: #ff5d67;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .2);--shadow-md: 0 4px 12px rgba(0, 0, 0, .3)}}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden;overscroll-behavior:none;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) 0 env(safe-area-inset-left,0px)}body{font-family:var(--font-sans);font-size:16px;line-height:1.5;background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:fixed;width:100%}#root{min-height:100%;display:flex;flex-direction:column}input,button,textarea{font-family:inherit;font-size:inherit}input{background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);width:100%;font-size:1rem;transition:border-color .2s}input:focus{outline:none;border-color:var(--color-accent)}input::placeholder{color:var(--color-text-light)}button{background:var(--color-accent);color:#fff;border:none;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);cursor:pointer;font-weight:500;transition:background-color .2s,opacity .2s}button:hover:not(:disabled){background:var(--color-accent-hover)}button:disabled{opacity:.5;cursor:not-allowed}button.secondary{background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border)}button.secondary:hover:not(:disabled){background:var(--color-sidebar-bg)}button.small{padding:var(--spacing-xs) var(--spacing-sm);font-size:.85rem}a{color:var(--color-accent);text-decoration:none}a:hover{text-decoration:underline}.container{max-width:600px;margin:0 auto;padding:var(--spacing-md);width:100%}.page{flex:1;display:flex;flex-direction:column}.home{display:flex;align-items:center;justify-content:center;min-height:100vh;min-height:100dvh;padding:var(--spacing-lg)}.home-content{max-width:400px;width:100%}.home-intro{color:var(--color-text-muted);margin-bottom:var(--spacing-xl);font-size:.9rem;line-height:1.6;white-space:pre-line}.home-form{display:flex;flex-direction:column;gap:var(--spacing-md)}.home-form label{display:block;color:var(--color-text-muted);margin-bottom:var(--spacing-xs);font-size:.9rem;font-weight:500}.home-warning{color:var(--color-text-light);font-size:.8rem;margin-top:var(--spacing-sm)}.error-message{color:var(--color-error);font-size:.85rem;margin-top:var(--spacing-xs)}.recent-rooms{margin-top:var(--spacing-xl);padding-top:var(--spacing-xl);border-top:1px solid var(--color-border)}.recent-rooms-title{font-size:.85rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--spacing-md)}.recent-rooms-list{list-style:none;display:flex;flex-direction:column;gap:var(--spacing-sm)}.recent-room-item{display:flex;align-items:center;gap:var(--spacing-sm)}.recent-room-link{flex:1;display:flex;align-items:baseline;gap:var(--spacing-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--spacing-sm) var(--spacing-md);cursor:pointer;text-align:left;color:var(--color-text);transition:background .2s}.recent-room-link:hover{background:var(--color-sidebar-bg)}.recent-room-name{font-size:.9rem;font-weight:500}.recent-room-id{font-size:.75rem;color:var(--color-text-light)}.recent-room-remove{background:none;border:none;color:var(--color-text-light);font-size:1.1rem;padding:var(--spacing-xs) var(--spacing-sm);cursor:pointer;border-radius:var(--radius-sm);line-height:1;transition:color .2s}.recent-room-remove:hover{color:var(--color-error);background:none}.room{display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden}.room-header{padding:var(--spacing-md) var(--spacing-lg);border-bottom:1px solid var(--color-border);background:var(--color-surface)}.room-back{color:var(--color-text-muted);text-decoration:none;font-size:1.25rem;line-height:1;padding:var(--spacing-xs);transition:color .2s}.room-back:hover{color:var(--color-accent);text-decoration:none}.room-title{font-size:1.1rem;font-weight:600;margin-bottom:var(--spacing-xs);color:var(--color-text)}.room-code{font-size:.75rem;color:var(--color-text-light);letter-spacing:.3px}.messages-container{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:var(--spacing-lg);display:flex;flex-direction:column;gap:var(--spacing-sm);max-width:720px;width:100%;margin:0 auto}.message{max-width:520px;width:100%;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);background:var(--color-surface);border:1px solid var(--color-border);word-break:break-word}.message.own{align-self:flex-end;background:var(--color-accent-muted);border-color:transparent}.message-sender{font-size:.75rem;color:var(--color-text-muted);margin-bottom:var(--spacing-xs);font-weight:500;display:flex;align-items:center;gap:.3rem}.message.own .message-sender{color:var(--color-accent);justify-content:flex-end}.message.own .trust-verified{color:var(--color-success)}.message-text{font-size:.95rem;line-height:1.5}.message-time{font-size:.7rem;color:var(--color-text-light);margin-top:var(--spacing-xs);text-align:right}.message.own .message-time{color:var(--color-text-light)}.message-text a{color:var(--color-accent);text-decoration:underline;word-break:break-all}.message.own .message-text a{color:var(--color-accent)}.message-error{color:var(--color-error);font-style:italic}.message-input-container{flex-shrink:0;padding:var(--spacing-md);padding-bottom:calc(var(--spacing-md) + var(--safe-bottom));border-top:1px solid var(--color-border);background:var(--color-surface)}.message-input-form{display:flex;gap:var(--spacing-sm);max-width:720px;margin:0 auto}.message-input-form input{flex:1;font-size:1rem}.trust-indicator{display:inline-flex;align-items:center;line-height:1}.trust-verified{color:var(--color-success)}.trust-new{color:var(--color-text-light)}.trust-mismatch{color:var(--color-error)}.signing-status{font-size:.7rem;color:var(--color-success);letter-spacing:.02em}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;padding:var(--spacing-md);z-index:100}.modal{background:var(--color-surface);padding:var(--spacing-lg);border-radius:var(--radius-lg);max-width:400px;width:100%;border:1px solid var(--color-border)}.modal h2{margin-bottom:var(--spacing-md);font-size:1.25rem;font-weight:600}.modal p{color:var(--color-text-muted);font-size:.9rem;margin-bottom:var(--spacing-md)}.modal form{display:flex;flex-direction:column;gap:var(--spacing-md)}.admin{padding:var(--spacing-lg);max-width:600px;margin:0 auto;width:100%}.admin h1{font-size:1.5rem;font-weight:600;margin-bottom:var(--spacing-xl)}.admin-section{margin-bottom:var(--spacing-xl);padding-bottom:var(--spacing-xl);border-bottom:1px solid var(--color-border)}.admin-section:last-child{border-bottom:none}.admin-section h2{font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--color-text-muted);margin-bottom:var(--spacing-md)}.admin-form{display:flex;flex-direction:column;gap:var(--spacing-md)}.admin-form label{display:block;color:var(--color-text-muted);margin-bottom:var(--spacing-xs);font-size:.9rem;font-weight:500}.invite-kit{background:var(--color-surface);padding:var(--spacing-lg);border-radius:var(--radius-md);margin-top:var(--spacing-lg);border:1px solid var(--color-border)}.invite-kit h3{font-size:1rem;margin-bottom:var(--spacing-md);color:var(--color-accent);font-weight:600}.invite-kit-item{margin-bottom:var(--spacing-md)}.invite-kit-item:last-child{margin-bottom:0}.invite-kit-label{font-size:.8rem;color:var(--color-text-light);margin-bottom:var(--spacing-xs);text-transform:uppercase;letter-spacing:.5px;font-weight:500}.invite-kit-value{display:flex;align-items:center;gap:var(--spacing-sm);background:var(--color-bg);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);font-size:.9rem;word-break:break-all;border:1px solid var(--color-border)}.invite-kit-value code{flex:1;font-family:monospace;font-size:.8rem}.invite-kit-warning{color:var(--color-accent);font-size:.8rem;margin-top:var(--spacing-md)}.rooms-list{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-top:var(--spacing-md)}.room-list-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md);background:var(--color-surface);border-radius:var(--radius-md);border:1px solid var(--color-border);gap:var(--spacing-md)}.room-list-info{min-width:0;flex:1}.room-list-title{font-weight:500;font-size:.9rem;margin-bottom:var(--spacing-xs)}.room-list-meta{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);font-size:.8rem;color:var(--color-text-muted)}.room-list-meta code{font-family:monospace;font-size:.75rem;background:var(--color-bg);padding:2px 6px;border-radius:4px}.room-list-actions{display:flex;gap:var(--spacing-xs);flex-shrink:0}button.danger{background:var(--color-error);color:#fff;border:none}button.danger:hover{opacity:.9}.connection-status{font-size:.7rem;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);margin-left:auto;font-weight:500}.connection-status.connected{color:var(--color-success)}.connection-status.disconnected{color:var(--color-error)}.connection-status.connecting{color:var(--color-text-light)}.nav-link{color:var(--color-accent);text-decoration:none;font-size:.85rem;font-weight:500;transition:color .2s}.nav-link:hover{color:var(--color-accent-hover)}.sender-name-btn{background:none;border:none;color:inherit;font:inherit;padding:0;cursor:pointer;font-size:.75rem;font-weight:500}.sender-name-btn:hover{text-decoration:underline;background:none}.trust-btn{background:none;border:none;padding:0;cursor:pointer;display:inline-flex;align-items:center;line-height:1}.trust-btn:hover{opacity:.7;background:none}.message.deleted{opacity:.6}.message-deleted{font-style:italic;color:var(--color-text-light);font-size:.85rem}.key-fingerprint{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-md);margin-top:var(--spacing-md)}.key-fingerprint-label{font-size:.75rem;color:var(--color-text-light);text-transform:uppercase;letter-spacing:.5px;font-weight:500;margin-bottom:var(--spacing-sm)}.key-fingerprint-value{font-family:monospace;font-size:.95rem;line-height:1.8;color:var(--color-text);margin:0;white-space:pre;letter-spacing:.05em}.key-fingerprint-footer{display:flex;align-items:center;justify-content:space-between;margin-top:var(--spacing-sm)}.key-fingerprint-name{font-size:.8rem;color:var(--color-text-muted)}.members-list{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-top:var(--spacing-md)}.member-item{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-bg);border-radius:var(--radius-sm)}.member-dot{width:8px;height:8px;border-radius:50%;background:var(--color-success);flex-shrink:0}.member-name{font-size:.9rem;color:var(--color-text)}.member-you{font-size:.75rem;color:var(--color-text-light)}.invite-qr{margin-top:var(--spacing-lg);padding-top:var(--spacing-lg);border-top:1px solid var(--color-border);text-align:center}.invite-qr-code{display:inline-block;padding:var(--spacing-md);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text)}.invite-qr-hint{font-size:.8rem;color:var(--color-text-light);margin-top:var(--spacing-sm)}.empty-members{color:var(--color-text-light);font-size:.85rem;text-align:center;padding:var(--spacing-md)}.typing-indicator{font-size:.8rem;color:var(--color-text-light);font-style:italic;padding:var(--spacing-xs) 0}.message-delete{background:none;border:none;color:var(--color-text-light);font-size:1rem;padding:0 var(--spacing-xs);cursor:pointer;line-height:1;opacity:0;transition:opacity .15s,color .15s;margin-left:auto}.message:hover .message-delete,.message-delete:focus{opacity:1}.message-delete:hover{color:var(--color-error);background:none}.queue-indicator{font-size:.8rem;color:var(--color-text-light);text-align:center;padding:var(--spacing-xs) 0;margin-bottom:var(--spacing-xs)}.header-btn{background:none;border:none;color:var(--color-text-muted);font-size:.75rem;padding:var(--spacing-xs) var(--spacing-sm);cursor:pointer;border-radius:var(--radius-sm);transition:background .15s,color .15s;white-space:nowrap}.header-btn:hover{background:var(--color-bg);color:var(--color-text)}@media (max-width: 768px){.container{padding:var(--spacing-md) var(--spacing-sm)}.home{padding:var(--spacing-md)}.room-header{padding:var(--spacing-sm) var(--spacing-md)}.messages-container{padding:var(--spacing-md)}.message{max-width:100%}}