body { margin: 0; background: #f4f1ec; font-family: "Inter", system-ui, sans-serif; color: #1d1b19; }
.rc-logo { font-weight: 800; font-size: 2.6rem; letter-spacing: -0.04em; }
.rc-logo span { color: #e8573a; }
.rc-logo.small { font-size: 1.5rem; }
.rc-tag { color: #6b645c; margin: 0 0 1.25rem; }
.rc-btn { background: #e8573a; color: #fff; border: 0; border-radius: 999px; padding: 0.7rem 1.3rem; font-weight: 600; cursor: pointer; }
.rc-btn:disabled { opacity: 0.5; cursor: default; }
.rc-join { min-height: 100vh; display: grid; place-items: center; padding: 1rem; box-sizing: border-box; }
.rc-join-card { background: #fff; border-radius: 24px; padding: 2rem; width: 100%; max-width: 380px; display: flex; flex-direction: column; gap: 0.9rem; box-shadow: 0 20px 50px rgba(60, 40, 20, 0.08); }
.rc-join-card .field { display: flex; flex-direction: column; gap: 0.35rem; font-weight: 600; font-size: 0.9rem; }
.rc-app { max-width: 760px; margin: 0 auto; height: 100vh; height: 100dvh; display: flex; flex-direction: column; }
.rc-head { display: flex; justify-content: space-between; align-items: center; padding: 0.8rem 1rem; border-bottom: 1px solid #e4ddd3; gap: 0.5rem; flex-wrap: wrap; }
.rc-me { display: flex; align-items: center; gap: 0.5rem; font-weight: 600; font-size: 0.9rem; }
.rc-dot { width: 8px; height: 8px; border-radius: 50%; background: #3bb273; }
.rc-link { background: none; border: 0; color: #6b645c; text-decoration: underline; cursor: pointer; font-size: 0.8rem; }
.rc-feed { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: 0.6rem; }
.rc-msg { display: flex; flex-direction: column; align-items: flex-start; max-width: 80%; }
.rc-msg.grouped { margin-top: -0.35rem; }
.rc-msg.mine { align-self: flex-end; align-items: flex-end; }
.rc-name { font-size: 0.78rem; font-weight: 700; margin: 0 0 0.2rem 0.6rem; }
.rc-bubble { background: #fff; padding: 0.55rem 0.85rem; border-radius: 18px; line-height: 1.4; overflow-wrap: anywhere; white-space: pre-wrap; box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
.rc-msg.mine .rc-bubble { background: #e8573a; color: #fff; }
.rc-bubble time { font-size: 0.68rem; opacity: 0.6; margin-left: 0.5rem; }
.rc-err { padding: 0 1rem; }
.rc-compose { display: flex; gap: 0.5rem; padding: 0.8rem 1rem 1rem; border-top: 1px solid #e4ddd3; }
.rc-compose .input { flex: 1; min-width: 0; border-radius: 999px; padding: 0.7rem 1rem; }