.regia-chat-body{margin:0;padding:14px;background:var(--base,#fffaf2);color:var(--ink,#192d32);font:16px/1.45 system-ui,sans-serif;box-sizing:border-box}*{box-sizing:border-box}header strong{color:var(--head,#133b38);font-size:1.15rem}header p,.account{margin:6px 0 12px}a{color:var(--head,#133b38);text-decoration:underline}#messages{max-height:45vh;min-height:80px;overflow:auto;overflow-wrap:anywhere}article{padding:10px 0;border-bottom:1px solid #9997}article p{white-space:pre-wrap;margin:5px 0}small{font-size:.8rem}button{cursor:pointer;padding:8px 12px;border:1px solid currentColor;border-radius:6px;background:transparent;color:inherit;font:inherit;margin:4px 6px 4px 0}button:disabled{opacity:.5}textarea{display:block;width:100%;font:inherit;padding:10px;margin:6px 0;background:var(--base);color:var(--ink);border:1px solid currentColor;border-radius:6px}#notice{min-height:1.4em}label{display:block}.account{overflow-wrap:anywhere}@media(max-width:420px){.regia-chat-body{padding:10px}button{min-height:42px}}
input{display:block;width:100%;padding:10px;margin:6px 0 14px;font:inherit;border:1px solid #888;border-radius:6px}button:focus-visible,a:focus-visible,textarea:focus-visible,input:focus-visible{outline:3px solid var(--head,#133b38);outline-offset:2px}
header strong{font-size:1.35rem}.regia-chat-body{font-size:16px}#send button{background:var(--accent,#00605b);color:var(--on-accent,#fff);border:0;border-radius:24px;min-width:100px}a{color:var(--accent,#00605b)}article{padding:14px 0}#messages{scrollbar-width:thin}
#messages{max-height:340px;min-height:0}#notice:empty{display:none}.regia-chat-body{height:auto;min-height:0}
.regia-chat-body{padding:0;font-family:"Segoe UI",Arial,sans-serif;background:var(--base)}
header{padding:12px 15px;background:color-mix(in srgb,var(--base) 95%,var(--ink))}header strong{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:800;letter-spacing:-.025em}
.rh-icon{width:27px;height:27px;display:inline-block;flex:none}.account,.history,#send,#notice{margin:12px 15px}article{position:relative;padding:12px 15px 12px 60px;border-color:color-mix(in srgb,var(--ink) 18%,var(--base));font-size:15px}article strong{color:var(--head)}article p{margin:3px 0}.avatar{position:absolute;left:15px;top:13px;width:33px;height:33px;padding:5px;border-radius:50%;background:color-mix(in srgb,var(--base) 82%,var(--ink));color:var(--accent)}.avatar svg{width:100%;height:100%}#messages>p{padding:0 15px}.join{display:flex;align-items:center;justify-content:center;gap:12px;margin:14px;padding:12px;border-radius:12px;background:var(--accent);color:var(--on-accent);font-weight:750;text-align:center}.join a{color:inherit}.join .rh-icon{width:25px;height:25px}

.regia-chat-body{font-family:Arial,'Segoe UI',sans-serif}.account:empty,.history:has(button[hidden]):not(:has(button:not([hidden]))){display:none}
.thread{margin:10px 0 0;border-left:3px solid var(--accent);padding-left:8px}.thread summary{cursor:pointer;color:var(--accent);font-size:14px;padding:8px 0;font-weight:700}.thread article{padding-left:45px}.thread .avatar{left:4px;width:29px;height:29px}.reply-context{padding:10px;border:1px solid var(--accent);border-radius:8px;color:var(--head)}.reply-context[hidden]{display:none}article>button{font-size:13px;padding:5px 9px}

/* Keep the conversation readable while new messages arrive. */
#messages{max-height:420px;scrollbar-gutter:stable;overflow-anchor:none;text-align:left}
#messages:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
#messages article{font-size:16px;line-height:1.5}
#messages small{display:inline-block;font-size:13px}
.new-messages{display:block;margin:10px auto;background:var(--accent,#00605b);color:var(--on-accent,#fff);font-weight:700}
.new-messages[hidden]{display:none}
.thread-error{font-size:14px;color:var(--ink);padding:8px}

/* Include the form's outer margins in the height sent to the containing page. */
.regia-chat-body{display:flow-root}
/* Short messages share one line; longer text remains fully readable. */
#messages article{padding:7px 12px 7px 46px;min-height:42px;line-height:1.65}
#messages article>strong{margin-right:4px}
#messages article>small{margin-right:8px}
#messages article>p{display:inline;margin:0 8px 0 0;white-space:pre-wrap}
#messages .offline-note{color:#737373;font-size:11px;font-weight:400}
#messages .comment-time{display:inline-block;margin-right:8px;font-size:11px;font-weight:400;color:#737373;white-space:nowrap;vertical-align:baseline}
#messages .comment-time[hidden]{display:none}
#messages article>.avatar{left:12px;top:9px;width:26px;height:26px;padding:4px}
#messages article>button{appearance:none;display:inline-block;vertical-align:baseline;background:none;box-shadow:none;border:0;border-radius:0;padding:2px 0;margin:0 8px 0 0;min-height:28px;line-height:1.5;font-size:14px;color:var(--accent,#00605b);text-decoration:underline;text-underline-offset:3px}
#messages article>button:hover{text-decoration-thickness:2px}
#messages .thread article{padding-left:34px}
#messages .thread article>.avatar{left:2px;width:24px;height:24px}
.thread{margin-top:4px}

#messages article>.avatar:has(img){padding:0}
#messages .avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.account .profile-avatar{display:inline-grid;place-items:center;vertical-align:middle;width:26px;height:26px;margin:0 3px;border-radius:50%;overflow:hidden;background:color-mix(in srgb,var(--base) 82%,var(--ink));color:var(--accent)}
.account .profile-avatar img{width:100%;height:100%;object-fit:cover}
.account .profile-avatar svg{width:70%;height:70%}

/* Keep Send beside the input, including on narrow phones. */
#messages:empty{min-height:0;height:0}
#send{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}
#send>label,#send>.reply-context{grid-column:1 / -1}
#send>textarea{min-width:0;min-height:66px;max-height:180px;margin:0;font-size:16px;line-height:1.45;resize:vertical}
#send>button[type=submit]{min-width:68px;min-height:48px;margin:0;padding:10px 14px}