.tile .dm-btn { position: absolute; bottom: 8px; right: 8px; font-size: 11px; padding: 3px 10px; cursor: pointer; background: rgba(244,114,182,0.18); color: #f472b6; border: 1px solid rgba(244,114,182,0.3); border-radius: 999px; font-weight: 600; }
.tile .dm-btn:hover { background: rgba(244,114,182,0.28); }

/* chat panel — shown when body.has-chat */
#chat-panel  { display: none; flex-direction: column; width: 300px; flex-shrink: 0; border: 1px solid rgba(255,255,255,0.1); border-radius: 10px; background: #16181d; overflow: hidden; }
body.has-chat #chat-panel { display: flex; }
#chat-header { padding: 8px 12px; font-size: 11px; font-weight: 600; color: #9ca3af; text-transform: uppercase; letter-spacing: 0.05em; background: rgba(255,255,255,0.02); border-bottom: 1px solid rgba(255,255,255,0.06); flex-shrink: 0; }
#chat-log    { flex: 1; overflow-y: auto; padding: 8px; font-size: 13px; display: flex; flex-direction: column; gap: 6px; }
.msg-self    { align-self: flex-end;   background: rgba(14,165,164,0.15); color: #e5e7eb; padding: 6px 10px; border-radius: 10px; max-width: 85%; word-break: break-word; border: 1px solid rgba(14,165,164,0.22); }
.msg-other   { align-self: flex-start; background: rgba(255,255,255,0.04); color: #e5e7eb; padding: 6px 10px; border-radius: 10px; max-width: 85%; word-break: break-word; border: 1px solid rgba(255,255,255,0.06); }
.msg-private { background: rgba(244,114,182,0.15); border-color: rgba(244,114,182,0.28); }
.msg-route   { font-size: 10px; color: #9ca3af; display: block; margin-bottom: 3px; text-transform: uppercase; letter-spacing: 0.04em; font-weight: 600; }
.msg-private .msg-route { color: #f472b6; }
.msg-self p a, .msg-other p a { color: #0EA5A4; }
#chat-footer { display: flex; flex-direction: column; gap: 6px; padding: 8px; border-top: 1px solid rgba(255,255,255,0.06); flex-shrink: 0; background: rgba(255,255,255,0.02); }
#dm-bar      { font-size: 11px; color: #f472b6; display: none; align-items: center; gap: 6px; padding: 4px 10px; background: rgba(244,114,182,0.12); border: 1px solid rgba(244,114,182,0.25); border-radius: 999px; }
#dm-bar.on   { display: flex; }
#dm-bar #btn-clear-dm { background: none; border: none; padding: 0 4px; color: #f472b6; cursor: pointer; font-size: 14px; line-height: 1; }
#dm-bar #btn-clear-dm:hover { background: none; color: #fff; }
#send-row    { display: flex; gap: 6px; }
#chat-input  { flex: 1; font-size: 13px; padding: 6px 10px; background: #080808; border: 1px solid rgba(255,255,255,0.08); border-radius: 6px; color: #e5e7eb; outline: none; }
#chat-input:focus { border-color: rgba(14,165,164,0.4); }
#chat-input::placeholder { color: #9ca3af; }
#btn-send    { font-size: 12px; padding: 6px 12px; }