/* Self-contained public-chat popup for the portal pages (account, activity, promotion, …)
   that don't have the homepage's built-in rail chat. Opens in-place as a modal (desktop) /
   full-screen sheet (mobile). Reads /api/chat (public); posting needs a logged-in member. */
/* Docked to the RIGHT side, below the navbar, NO dark backdrop + click-through — exactly like the
   homepage public-chat rail (was a centered modal-with-scrim until 2026-07-22). */
.cw-overlay{position:fixed;inset:0;z-index:4000;display:none;background:transparent;pointer-events:none}
.cw-overlay.open{display:flex;align-items:stretch;justify-content:flex-end}
@media (min-width:561px){ .cw-overlay{top:68px} } /* start below the 68px navbar (stays visible); phones full-screen */
.cw-panel{pointer-events:auto;display:flex;flex-direction:column;background:#fff;color:#191c26;width:100%;max-width:400px;height:100%;overflow:hidden;box-shadow:-16px 0 50px -24px rgba(0,0,0,.45);animation:cw-slidein-right .28s ease;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
@keyframes cw-slidein-right{from{transform:translateX(100%)}to{transform:translateX(0)}}
.cw-head{flex:0 0 auto;display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding:16px 18px 12px;border-bottom:1px solid #eef0f4}
.cw-title{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:800;color:#191c26}
.cw-dot{width:8px;height:8px;border-radius:50%;background:#12b46a;box-shadow:0 0 0 3px rgba(18,180,106,.18)}
.cw-sub{display:block;margin-top:3px;font-size:11px;color:#8b8b93}
.cw-close{flex:none;width:30px;height:30px;border:0;border-radius:50%;background:rgba(0,0,0,.05);color:#8b8b93;font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.cw-close:hover{background:rgba(0,0,0,.11);color:#191c26}
.cw-msgs{flex:1 1 auto;overflow-y:auto;padding:14px 14px 6px;display:flex;flex-direction:column;gap:9px}
.cw-empty{margin:auto;color:#8b8b93;font-size:12.5px}
.cw-msg{max-width:88%;align-self:flex-start;background:#f3f4f7;border:1px solid #e8e8e8;border-radius:12px;border-bottom-left-radius:4px;padding:7px 11px}
.cw-msg.mine{align-self:flex-end;background:linear-gradient(120deg,#ffe3ea,#fff0f3);border-color:#f7c9d6;border-bottom-left-radius:12px;border-bottom-right-radius:4px}
.cw-msg.pop{animation:cw-msgpop .4s cubic-bezier(.34,1.56,.64,1) both;transform-origin:bottom left}
.cw-msg.mine.pop{transform-origin:bottom right}
@keyframes cw-msgpop{0%{opacity:0;transform:translateY(11px) scale(.55)}55%{opacity:1;transform:translateY(0) scale(1.06)}100%{transform:translateY(0) scale(1)}}
.cw-name{font-size:11px;font-weight:800;color:var(--brand,#F5003A);margin-bottom:1px}
.cw-msg.mine .cw-name{color:var(--brand-d,#c0003a)}
.cw-text{font-size:13px;line-height:1.4;color:#191c26;word-wrap:break-word;overflow-wrap:anywhere}
.cw-form{position:relative;flex:0 0 auto;display:flex;gap:8px;padding:12px 14px;border-top:1px solid #eef0f4}
.cw-form input{flex:1;min-width:0;background:#f3f4f7;border:1px solid #e8e8e8;border-radius:20px;padding:10px 14px;font-size:13.5px;color:#191c26}
.cw-cd{position:absolute;left:14px;right:62px;top:12px;bottom:12px;display:none;align-items:center;justify-content:center;gap:7px;background:#fff0f3;border:1px solid #f5b6c5;border-radius:20px;font-size:13px;font-weight:800;color:var(--brand-d,#c0003a);pointer-events:none;z-index:2}
.cw-cd::before{content:"";width:13px;height:13px;border-radius:50%;border:2px solid #f5b6c5;border-top-color:var(--brand-d,#c0003a);animation:cw-cd-spin .9s linear infinite}
@keyframes cw-cd-spin{to{transform:rotate(360deg)}}
.cw-form input:focus{outline:none;border-color:var(--brand,#F5003A)}
.cw-send{flex:none;width:40px;height:40px;border:0;border-radius:50%;background:linear-gradient(120deg,var(--brand,#F5003A),var(--brand-d,#8c0026));color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}
.cw-send svg{width:18px;height:18px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.cw-send:hover{filter:brightness(1.08)}
.cw-send:disabled{cursor:default;opacity:.5}
.cw-login{display:none;flex:0 0 auto;margin:12px 14px;padding:13px;border:0;border-radius:22px;background:linear-gradient(120deg,var(--brand,#F5003A),var(--brand-d,#8c0026));color:#fff;font-weight:800;font-size:14px;cursor:pointer;text-align:center}
.cw-login:hover{filter:brightness(1.06)}
.cw-panel.guest .cw-form{display:none}
.cw-panel.guest .cw-login{display:block}
@media (max-width:560px){ .cw-panel{max-width:100%} } /* full-screen on phones */
@media (prefers-reduced-motion:reduce){ .cw-panel,.cw-msg.pop{animation:none} }