/* One conversation service, sized for a desktop window and a handheld app. */
.chat-page{--chat-ink:#18304f;--chat-muted:#73849d;background:#edf3fa;color:var(--chat-ink)}
.chat-page .chat-layout{height:calc(100dvh - 69px);min-height:540px;max-height:none;grid-template-columns:minmax(285px,330px) minmax(0,1fr);max-width:1600px;margin:auto;background:#fff;box-shadow:0 16px 60px #15294a15}
.chat-page .chat-side{background:#fff;color:var(--chat-ink);border-right:1px solid #e2e9f2;padding:26px 18px 18px;display:flex;flex-direction:column;position:static;transform:none}
.chat-page .chat-account{padding:4px 9px 13px;margin:0}.chat-page .chat-account>div{display:grid;gap:3px}.chat-page .chat-account .eyebrow{color:#617ab0;font-size:10px;letter-spacing:.16em}.chat-page .chat-account strong{font-size:28px;line-height:1.3}.chat-page .chat-account small{font-size:12px;color:var(--chat-muted)}
.chat-page #newChatButton{border:0;border-radius:15px;width:42px;height:42px;background:#315fda;color:white;font-size:26px}.chat-page #newChatButton:hover{background:#204dbf}
.chat-search{height:44px;border-radius:14px;background:#eef3f9;color:#7083a4;display:flex;align-items:center;padding:0 13px;gap:8px;margin:10px 5px 19px}.chat-search span{font-size:24px;line-height:1}.chat-search input{background:transparent;border:0;outline:0;color:var(--chat-ink);width:100%;font-size:14px}.chat-search input::placeholder{color:#8191a7}.chat-list-caption{font-size:11px;color:#8393ad;letter-spacing:.08em;padding:0 14px 8px;font-weight:700}.chat-page .conversation-list{overflow:auto;flex:1;align-content:start;gap:5px}.chat-page .conversation-item{display:grid;grid-template-columns:45px minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px 12px;min-height:71px;border-radius:15px;color:var(--chat-ink)}.chat-page .conversation-item:hover{background:#f4f7fc}.chat-page .conversation-item.active{background:#eaf0ff;color:#1b49b5}.chat-page .conversation-item .conversation-avatar{width:45px;height:45px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(145deg,#476fd5,#8dbbe8);color:#fff;font-size:19px;font-weight:700}.chat-page .conversation-item[data-type=group] .conversation-avatar{background:linear-gradient(145deg,#4279a7,#5cc5b3)}.chat-page .conversation-item[data-type=lobby] .conversation-avatar{background:linear-gradient(145deg,#273b65,#547da9)}.chat-page .conversation-item div{display:grid;gap:4px;min-width:0}.chat-page .conversation-item strong{font-size:14px}.chat-page .conversation-item small{font-size:12px;color:#8291a6}.chat-page .conversation-item time{font-size:10px;color:#98a4b5;align-self:start}.chat-page .connection{margin:12px 12px 5px;color:#648a7e;font-size:11px}.chat-side-home{margin:6px 12px 0;font-size:12px;color:#5873aa}
.chat-page .chat-main{background:linear-gradient(150deg,#f4f7fc,#edf2fa);grid-template-rows:76px minmax(0,1fr) auto auto auto}.chat-page .chat-head{background:#fff;border-bottom:1px solid #e2e9f2;padding:12px 23px;display:flex;align-items:center;gap:13px}.chat-page .chat-head .chat-room-name{margin-right:auto;min-width:0}.chat-page .chat-head strong{color:#1e304a;font-size:16px}.chat-page .chat-head .chat-room-name div{color:#8592a6;font-size:11px}.chat-room-avatar{width:43px;height:43px;border-radius:15px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#476fd5,#8dbbe8);font-weight:750}.mobile-chat-back{display:none}.chat-page #deleteConversation{padding:8px 12px;font-size:11px}
.chat-page .messages{padding:24px clamp(16px,5%,55px);gap:15px;scrollbar-gutter:auto}.chat-page .message{width:auto;max-width:min(84%,620px);grid-template-columns:34px minmax(0,1fr);align-items:end;gap:9px}.chat-page .message .avatar{width:32px;height:32px;border-radius:12px;background:#d6e4f4;color:#476383;font-size:12px}.chat-page .message-body{background:#fff;border:1px solid #e4eaf2;border-radius:17px 17px 17px 5px;box-shadow:0 3px 14px #15294a09;padding:10px 14px;min-width:0}.chat-page .message-meta{gap:8px}.chat-page .message-meta strong{color:#426594;font-size:11px}.chat-page .message-meta time{font-size:10px;color:#98a5b6}.chat-page .message-body p{color:#243751;font-size:14px;line-height:1.6;margin:5px 0}.chat-page .message.own{align-self:flex-end;grid-template-columns:minmax(0,1fr)}.chat-page .message.own .avatar{display:none}.chat-page .message.own .message-body{background:#dfeafa;border-color:#cfdef5;border-radius:17px 17px 5px 17px}.chat-page .message.own .message-meta{justify-content:end}.chat-page .message-actions{opacity:.55;min-height:18px}.chat-page .message:hover .message-actions,.chat-page .message:focus-within .message-actions{opacity:1}.chat-page .message-actions button{color:#6583a8}.chat-page .composer{grid-template-columns:42px 42px minmax(0,1fr) auto;gap:9px;padding:14px 22px;background:#fff;border-top:1px solid #e2e9f2}.chat-page .composer .attach-button{width:42px;height:42px;border:0;border-radius:13px;background:#eef3fb;color:#5074a8;font-size:23px}.chat-page .composer textarea{background:#f4f7fb;border:1px solid transparent;color:#1e304a;border-radius:14px;min-height:44px;max-height:130px;font-size:14px;padding:11px 13px}.chat-page .composer textarea:focus{border-color:#8ca9ea;outline:0}.chat-page .composer .button{border-radius:13px;background:#315fda;font-size:13px;padding:10px 17px}.chat-page .upload-list,.chat-page .reply-bar{background:#fff;color:#52657f;border-color:#e2e9f2}.chat-page .upload-list span{background:#eef3fb;color:#52657f}.chat-page .message-quote,.chat-page .file-attachment{background:#f3f6fb;border-color:#dce5f1;color:#294564}.chat-page .message.own .file-attachment{background:#edf4ff}.chat-page .history-limit-notice{background:#fff;border-color:#e1e9f2;color:#71829b}.chat-page .global-footer,.chat-page .global-feedback{display:none}
@media(max-width:760px){.chat-page>.nav{display:none}.chat-page .chat-layout{height:100dvh;min-height:0;display:block;overflow:hidden}.chat-page .chat-side{position:static;transform:none;width:100%;height:100dvh;padding:calc(env(safe-area-inset-top) + 20px) 14px calc(env(safe-area-inset-bottom) + 16px);border:0}.chat-page .chat-main{height:100dvh;min-height:0}.chat-page[data-mobile-chat-view=list] .chat-main{display:none}.chat-page[data-mobile-chat-view=thread] .chat-side{display:none}.chat-page .chat-head{height:calc(67px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 15px 0}.mobile-chat-back{display:grid;place-items:center;border:0;background:none;color:#4164a5;font-size:33px;width:31px;height:42px;padding:0}.chat-page .messages{padding:16px 12px;gap:13px}.chat-page .message{max-width:92%}.chat-page .message-body{padding:10px 12px}.chat-page .composer{grid-template-columns:40px 40px minmax(0,1fr) auto;gap:6px;padding:10px 9px calc(env(safe-area-inset-bottom) + 10px)}.chat-page .composer .attach-button{width:40px;height:40px}.chat-page .composer .button{padding:10px 12px}.chat-page .chat-account strong{font-size:30px}.chat-page .conversation-item{min-height:74px}.chat-page .message-actions{opacity:1}.chat-page .dialog{color:var(--text)}}
@media(max-width:360px){.chat-page .message .avatar{display:none}.chat-page .message{grid-template-columns:minmax(0,1fr)}.chat-page .composer .button{padding-inline:9px}}
.chat-page .breadcrumb{display:none}.chat-page .nav .brand{color:#f4f8ff}.chat-page .conversation-list{display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:min-content;align-content:start}
/* Use the same palette as the client space. */
.chat-page{--chat-ink:#213833;--chat-muted:#73827b;background:#f4f6f3}.chat-page .chat-main{background:linear-gradient(150deg,#f6f8f4,#edf3ee)}.chat-page #newChatButton,.chat-page .composer .button{background:#267668}.chat-page .conversation-item.active{background:#e5f2ed;color:#267668}.chat-page .conversation-item .conversation-avatar,.chat-room-avatar{background:linear-gradient(145deg,#315e52,#83b69d)}.chat-page .conversation-item[data-type=group] .conversation-avatar{background:linear-gradient(145deg,#356a6b,#78bbae)}.chat-page .conversation-item[data-type=lobby] .conversation-avatar{background:linear-gradient(145deg,#233f43,#608e8a)}.chat-page .message.own .message-body{background:#e5f2ed;border-color:#d8e7dc}.chat-page .message-meta strong,.chat-side-home{color:#487968}.chat-search,.chat-page .composer .attach-button,.chat-page .composer textarea{background:#f1f5f1}.chat-page .composer .attach-button,.mobile-chat-back{color:#487968}.chat-page .composer textarea:focus{border-color:#87b69f}.chat-page .message-actions button{color:#5f8274}
.chat-page[data-chat-theme=dark]{--chat-ink:#dfebe3;--chat-muted:#91a79b;background:#142321}.chat-page[data-chat-theme=dark] .chat-layout,.chat-page[data-chat-theme=dark] .chat-side,.chat-page[data-chat-theme=dark] .chat-head,.chat-page[data-chat-theme=dark] .composer,.chat-page[data-chat-theme=dark] .upload-list,.chat-page[data-chat-theme=dark] .reply-bar{background:#1c3028;border-color:#2c4037}.chat-page[data-chat-theme=dark] .chat-main{background:#142321}.chat-page[data-chat-theme=dark] .chat-head strong,.chat-page[data-chat-theme=dark] .message-body p{color:#dfebe3}.chat-page[data-chat-theme=dark] .conversation-item:hover,.chat-page[data-chat-theme=dark] .chat-search,.chat-page[data-chat-theme=dark] .composer textarea,.chat-page[data-chat-theme=dark] .composer .attach-button{background:#21372e;color:#c8ded0}.chat-page[data-chat-theme=dark] .conversation-item.active,.chat-page[data-chat-theme=dark] .message.own .message-body{background:#294c3c;border-color:#355b46;color:#b6dbc4}.chat-page[data-chat-theme=dark] .message-body{background:#21372e;border-color:#2c4037}.chat-page[data-chat-theme=dark] .message-meta strong,.chat-page[data-chat-theme=dark] .chat-side-home{color:#9bccb5}.chat-page[data-chat-theme=dark] .message-quote,.chat-page[data-chat-theme=dark] .file-attachment,.chat-page[data-chat-theme=dark] .history-limit-notice{background:#263f32;border-color:#355b46;color:#c8ded0}.chat-page[data-chat-theme=dark] .composer .button,.chat-page[data-chat-theme=dark] #newChatButton{background:#80b89d;color:#143426}