@import"https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;700&display=swap";:root{color:#f5f9ff;font-family:Manrope,Trebuchet MS,Segoe UI,sans-serif;--bg-1: #051321;--bg-2: #0d2e44;--bg-3: #1b4f63;--shell-bg: linear-gradient(155deg, rgba(9, 29, 45, .94), rgba(6, 19, 33, .9));--shell-border: rgba(164, 214, 236, .22);--surface: rgba(255, 255, 255, .06);--surface-border: rgba(212, 241, 255, .2);--text-muted: #b8d2e2;--heading: #f8fcff;--accent: #7ae8d8;--bubble-other: rgba(238, 247, 255, .11);--bubble-self-start: #32a5ff;--bubble-self-end: #1e6be4;--bubble-self-text: #f7fbff}*{box-sizing:border-box}html,body,#root{width:100%;height:100%}body{margin:0;color:inherit;position:relative;overflow-y:hidden;overflow-x:hidden;background:radial-gradient(circle at 0% 0%,rgba(79,187,228,.2),transparent 45%),radial-gradient(circle at 100% 100%,rgba(120,234,216,.15),transparent 42%),linear-gradient(160deg,var(--bg-1),var(--bg-2) 48%,var(--bg-3))}body:before,body:after{content:"";position:fixed;pointer-events:none;z-index:0}body:before{width:46vmax;height:46vmax;top:-22vmax;right:-16vmax;border-radius:50%;background:radial-gradient(circle,rgba(122,232,216,.18),transparent 62%)}body:after{width:42vmax;height:42vmax;bottom:-18vmax;left:-14vmax;border-radius:50%;background:radial-gradient(circle,rgba(96,162,255,.18),transparent 66%)}#root{position:relative;z-index:1}.app-shell{height:100dvh;width:100%;display:flex;justify-content:center;align-items:stretch;padding-top:max(.7rem,env(safe-area-inset-top));padding-right:max(.7rem,env(safe-area-inset-right));padding-bottom:max(.5rem,env(safe-area-inset-bottom));padding-left:max(.7rem,env(safe-area-inset-left));overflow-y:hidden;overflow-x:clip}a{color:#9df2e8;text-decoration-thickness:.11em;text-underline-offset:.14em}a:hover{color:#ccfbf5}.join-screen,.chat-screen{width:min(100%,58rem);margin-inline:auto;border-radius:1.4rem;border:1px solid var(--shell-border);background:var(--shell-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 26px 70px #020a1473,inset 0 1px #ffffff0f}.join-screen{min-height:100%;display:grid;align-content:center;gap:1.1rem;padding:clamp(1rem,2.4vw,1.8rem)}.join-screen h1{margin:0;color:var(--heading);font-family:Space Grotesk,Manrope,sans-serif;font-weight:700;letter-spacing:.015em;font-size:clamp(1.6rem,3.8vw,2rem)}.join-form{display:grid;gap:.72rem}.join-form label{color:var(--text-muted);font-size:.9rem;font-weight:600}.join-input,.composer-input{width:100%;min-width:0;border:1px solid var(--surface-border);background:#051421b8;color:#f7fbff;border-radius:.95rem;padding:.78rem .92rem;font:500 .96rem/1.25 Manrope,Trebuchet MS,sans-serif;transition:border-color .14s ease,box-shadow .14s ease,background-color .14s ease}.join-input::placeholder,.composer-input::placeholder{color:#c4dbe7b8}.join-input:focus-visible,.composer-input:focus-visible{outline:none;border-color:#7ae8d8d6;box-shadow:0 0 0 3px #7ae8d82e;background:#051726db}.join-button,.composer-send{border:1px solid rgba(142,232,221,.55);background:linear-gradient(150deg,#79e8d8,#3fb6d3);color:#052233;border-radius:.95rem;padding:.67rem 1rem;font:700 .95rem/1 Manrope,Trebuchet MS,sans-serif;letter-spacing:.01em;cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,filter .14s ease,opacity .14s ease;box-shadow:0 10px 26px #40b8d047}@media (hover: hover){.join-button:hover,.composer-send:hover{transform:translateY(-1px);box-shadow:0 14px 28px #40b8d057;filter:brightness(1.04)}}.join-button:active,.composer-send:active{transform:translateY(0)}.join-button:disabled,.composer-send:disabled,.composer-input:disabled{opacity:.52;cursor:not-allowed}.chat-screen{height:100%;display:flex;flex-direction:column;gap:.6rem;padding:clamp(.85rem,2vw,1.2rem);overflow:hidden}.chat-top{display:grid;gap:.42rem;padding:.05rem .2rem .7rem;border-bottom:1px solid rgba(176,223,245,.18)}.chat-top h1{margin:0;font-family:Space Grotesk,Manrope,sans-serif;font-size:clamp(1.2rem,3vw,1.55rem);font-weight:700;letter-spacing:.012em;color:var(--heading)}.chat-identity{margin:0;color:var(--text-muted);font-size:.92rem}.header-status{display:flex;align-items:center;gap:.48rem;flex-wrap:wrap;color:var(--text-muted);font-size:.85rem;font-weight:600}.status-pill,.unread-pill{border-radius:999px;border:1px solid var(--surface-border);padding:.14rem .58rem;color:#f7fcff;font-size:.78rem;font-weight:700;text-transform:capitalize}.status-connected{background:#41d08642;border-color:#8df5c194}.status-reconnecting,.status-connecting{background:#e8ac564a;border-color:#ffd6998f}.status-disconnected{background:#df606f40;border-color:#ffaab58a}.unread-pill{min-width:1.45rem;text-align:center;background:#7ae8d833;border-color:#97efe4a6;color:#dcfbf8}.in-app-alert{border:1px solid rgba(254,227,139,.5);border-radius:.9rem;background:linear-gradient(120deg,#583d14a6,#a8751a61);padding:.5rem .68rem;font-size:.9rem;overflow-wrap:anywhere;animation:alert-pop .22s ease-out}.in-app-alert strong{color:#ffe6a7}@keyframes alert-pop{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.message-list{flex:1;min-height:0;list-style:none;margin:0;padding:.28rem .1rem .35rem;display:flex;flex-direction:column;gap:.7rem;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-y;overscroll-behavior:contain;max-width:100%}.message-list::-webkit-scrollbar{width:10px}.message-list::-webkit-scrollbar-track{background:transparent}.message-list::-webkit-scrollbar-thumb{background:#b1d7e747;border-radius:999px;border:2px solid transparent;background-clip:padding-box}.message-item{min-width:0;display:grid;align-items:end}.message-item-other{grid-template-columns:auto minmax(0,1fr);column-gap:.56rem;justify-items:start}.message-item-self{justify-items:end}.message-avatar{width:2rem;height:2rem;border-radius:999px;display:grid;place-items:center;background:linear-gradient(150deg,#7ae8d880,#379fd5a6);border:1px solid rgba(194,238,255,.44);color:#0d2a3f;font-size:.84rem;font-weight:800;letter-spacing:.02em}.message-bubble{position:relative;min-width:0;max-width:min(35rem,82vw);border-radius:1.08rem;border:1px solid rgba(220,243,255,.18);background:var(--bubble-other);padding:.5rem .7rem .58rem;box-shadow:0 8px 20px #040f1e2e}.message-item-other .message-bubble{border-bottom-left-radius:.58rem}.message-item-self .message-bubble{border-bottom-right-radius:.58rem;border-color:#b8e5ff70;background:linear-gradient(150deg,var(--bubble-self-start),var(--bubble-self-end));color:var(--bubble-self-text)}.message-meta{display:flex;align-items:baseline;gap:.42rem;min-width:0;color:#cde0eb;font-size:.78rem}.message-item-self .message-meta{color:#eff9ffeb}.message-meta strong{min-width:0;overflow-wrap:anywhere;font-weight:700;letter-spacing:.008em}.message-meta small{min-width:0;overflow-wrap:anywhere;opacity:.9;font-size:.72rem}.message-body{margin:.3rem 0 0;line-height:1.42;font-size:.95rem;overflow-wrap:anywhere;word-break:break-word;white-space:pre-wrap}.message-body a{overflow-wrap:anywhere;word-break:break-word}.composer{position:relative;flex-shrink:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.52rem;align-items:end;padding:.65rem .2rem max(.3rem,env(safe-area-inset-bottom));margin-top:.12rem;border-top:1px solid rgba(176,223,245,.16);background:linear-gradient(180deg,#08172659,#081726b8 48%,#081726e6)}.composer-label{grid-column:1 / -1;color:var(--text-muted);font-size:.78rem;font-weight:600}.composer-send{align-self:stretch;padding-inline:1.15rem}@media (max-width: 720px){.join-screen,.chat-screen{width:min(100%,48rem);border-radius:1rem}.chat-screen{padding:.8rem;gap:.52rem}.message-bubble{max-width:min(28rem,82vw)}}@media (max-width: 480px){.app-shell{padding-top:max(.45rem,env(safe-area-inset-top));padding-right:max(.42rem,env(safe-area-inset-right));padding-left:max(.42rem,env(safe-area-inset-left))}.join-screen,.chat-screen{border-radius:.85rem}.composer{grid-template-columns:minmax(0,1fr)}.composer-send{width:100%;min-height:2.6rem}}@media (min-width: 1000px){.chat-screen{width:min(100%,62rem)}.message-bubble{max-width:38rem}}