.room-chat-dialog{width:min(540px,calc(100% - 24px));max-height:min(760px,calc(100dvh - 24px));padding:22px;overflow:hidden;background:var(--ui-surface);color:var(--ui-ink)}
.room-chat-dialog[open]{display:flex;flex-direction:column;gap:10px}.room-chat-dialog .dialog-heading{flex:none;margin-bottom:0}.room-chat-dialog h2{margin:0;font-size:23px}.room-chat-subtitle,.room-chat-footnote{margin:0;color:var(--ui-muted);font-size:11px}.room-chat-scroll{min-height:150px;height:42dvh;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:12px 2px;flex:1 1 auto}.room-chat-empty{color:var(--ui-muted);text-align:center;padding:40px 16px;font-size:13px;line-height:1.8}.chat-message{display:flex;gap:9px;margin:14px 0;align-items:flex-start}.chat-avatar{position:relative;display:grid;place-items:center;width:32px;height:32px;flex:0 0 32px;overflow:hidden;border-radius:50%;background:var(--ui-surface-soft);color:var(--ui-accent);font-weight:600}.chat-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.chat-content{min-width:0;max-width:calc(100% - 45px)}.chat-message-meta{display:flex;gap:8px;align-items:baseline;font-size:10px;color:var(--ui-muted);flex-wrap:wrap;line-height:1.5}.chat-message-meta strong{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:var(--ui-ink)}.chat-bubble{margin:5px 0 0;padding:10px 13px;background:var(--ui-surface-soft);border:1px solid var(--ui-line);border-radius:3px 14px 14px 14px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7;font-size:14px}.chat-self{flex-direction:row-reverse}.chat-self .chat-message-meta{justify-content:flex-end}.chat-self .chat-bubble{border-radius:14px 3px 14px 14px;background:var(--ui-accent);color:var(--ui-on-accent,#fff);border-color:var(--ui-accent)}.chat-system{margin:16px 6px;text-align:center;color:var(--ui-muted);font-size:11px;line-height:1.7}.chat-system span{display:inline-block;padding:5px 10px;background:var(--ui-surface-soft);border-radius:10px}.room-chat-shortcuts{display:flex;gap:6px;overflow:auto;flex-shrink:0;padding-bottom:3px;scrollbar-width:none}.room-chat-shortcuts button{flex:0 0 auto;min-height:34px;padding:5px 10px;border:1px solid var(--ui-line);background:var(--ui-surface-soft);color:var(--ui-ink);border-radius:18px;font-size:11px}.room-chat-form{display:flex;gap:8px;align-items:stretch;flex-shrink:0}.room-chat-form textarea{resize:none;min-width:0;min-height:64px;max-height:120px;flex:1;border:1px solid var(--ui-line);border-radius:12px;padding:10px;background:var(--ui-bg);color:var(--ui-ink);font-size:16px}.room-chat-form .primary-button{min-width:60px;padding:10px}.room-chat-readonly{margin:0;padding:10px;border-radius:10px;background:var(--ui-surface-soft);color:var(--ui-muted);font-size:12px}.room-chat-dialog #room-chat-status{margin:0;min-height:0}.room-chat-dialog #room-chat-status:empty{display:none}.room-chat-footnote{text-align:center}.room-request-heading{display:flex;align-items:center;gap:10px}.room-request-heading>div{min-width:0;flex:1}.room-request-heading strong{font-size:14px}.room-request-heading p{margin:3px 0 0;font-size:12px;color:var(--ui-muted);line-height:1.6}.room-request-symbol{width:36px;height:36px;flex:none;border-radius:12px;display:grid;place-items:center;background:var(--ui-accent);color:var(--ui-on-accent,#fff);font-family:var(--ui-serif);font-size:20px}.room-request-heading #room-request-timer{font-size:11px;white-space:nowrap;color:var(--ui-muted)}.room-request-actions{display:flex;gap:8px;margin-top:10px}.room-request-actions button{flex:1;min-height:42px;padding:8px 12px}.room-request-actions:has(button:not([hidden])){display:flex}.room-request-actions:not(:has(button:not([hidden]))){display:none}#room-chat-unread{display:inline-flex;min-width:17px;height:17px;padding:0 4px;align-items:center;justify-content:center;border-radius:10px;background:var(--ui-danger);color:white;font:600 10px/1 var(--ui-font)}
@media(max-width:600px){.room-chat-dialog{margin:auto auto 10px;max-height:calc(100dvh - 20px);padding:18px;border-radius:24px}.room-chat-scroll{height:42dvh}.chat-message-meta strong{max-width:135px}}
@media(prefers-reduced-motion:reduce){.room-chat-scroll{scroll-behavior:auto}}

.room-chat-dialog .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* Keep the conversation readable and the composer inside the visible keyboard viewport. */
.room-chat-dialog { width: min(520px,calc(100% - 24px)); height: min(620px,calc(var(--chat-viewport-height,100dvh) - 24px)); max-height: calc(var(--chat-viewport-height,100dvh) - 24px); padding: 20px; }
.room-chat-dialog[open] { gap: 9px; }
.room-chat-dialog .dialog-heading { padding-bottom: 10px; }
.room-chat-dialog .dialog-heading .eyebrow { display: none; }
.room-chat-dialog h2 { font: 600 20px/1.4 var(--ui-font); }
.room-chat-dialog .dialog-heading .icon-button { width: 40px; height: 40px; flex-basis: 40px; padding: 10px; border-radius: 12px; }
.room-chat-subtitle { font-size: 10px; line-height: 1.5; }
.room-chat-scroll { min-height: 0; height: auto; padding: 10px 1px; }
.room-chat-empty { margin: 0; padding: 50px 16px; font-size: 13px; }
.chat-message { margin: 12px 0; }
.chat-message-meta { gap: 6px; font-size: 9px; }
.chat-bubble { border: 0; padding: 9px 12px; font-size: 14px; line-height: 1.6; }
.chat-system span { background: transparent; padding: 3px 0; }
.room-chat-shortcuts { padding-top: 2px; padding-bottom: 2px; }
.room-chat-shortcuts button { min-height: 34px; border-color: transparent; padding: 5px 10px; }
.room-chat-form { gap: 7px; align-items: flex-end; }
.room-chat-form textarea { height: 44px; min-height: 44px; max-height: 108px; padding: 10px 12px; line-height: 22px; border-radius: 14px; resize: none; }
.room-chat-form .primary-button { height: 44px; min-height: 44px; min-width: 56px; padding: 10px 12px; border-radius: 13px; }
.room-chat-footnote { font-size: 9px; line-height: 1.4; }
@media (max-width: 600px) {
  .room-chat-dialog { position: fixed; top: auto; bottom: calc(var(--chat-keyboard-inset,0px) + 12px); left: 12px; right: 12px; width: auto; margin: 0; padding: 16px; border-radius: 22px; }
}
/* Tablet keyboards reduce the visual viewport without changing CSS viewport width. */
.room-chat-dialog[data-keyboard-open='true'] { position: fixed; top: auto; bottom: calc(var(--chat-keyboard-inset,0px) + 12px); left: 12px; right: 12px; width: min(520px,calc(100% - 24px)); margin: 0 auto; }
.room-chat-dialog[data-keyboard-open='true'] .room-chat-shortcuts,
.room-chat-dialog[data-keyboard-open='true'] .room-chat-footnote { display: none; }