/* Chat geometry and feedback. Existing sending/deleting/smiley code is retained. */
.wars-ui .wars-chat { width:calc(100% - 16px); max-width:none; min-width:0; margin:8px; padding:0; }
.wars-ui .wars-chat > .cont { width:100%; max-width:none; margin:0; padding:0; border:1px solid var(--w-line); border-radius:var(--w-radius); overflow:hidden; box-shadow:none; }
.wars-ui .wars-chat .head { font-size:18px; padding:8px 10px; }
.wars-ui .wars-chat .lenta { padding:8px 10px; }
.wars-ui .wars-chat .chat-composer { text-align:left; margin:0; }
.wars-ui .wars-chat label { display:block; font-size:12px; font-weight:600; margin:0 0 5px; }
.wars-ui .wars-chat #message { display:block; min-height:64px; resize:vertical; border-radius:4px; }
.wars-ui .wars-chat .chat-tools { display:flex; align-items:center; gap:6px; margin-top:6px; }
.wars-ui .wars-chat .chat-tool, .wars-ui .wars-chat .chat-send {
  display:inline-flex; align-items:center; justify-content:center; min-height:44px;
  border:1px solid var(--w-line); border-radius:4px; padding:8px 11px;
  background:var(--w-alt); color:var(--w-ink); cursor:pointer; text-decoration:none; font:600 14px/1.3 var(--w-font);
}
.wars-ui .wars-chat .chat-send { flex:1; background:var(--w-action); border-color:var(--w-action); color:var(--w-on-action); }
.wars-ui .wars-chat .chat-hint { display:flex; justify-content:space-between; flex-wrap:wrap; gap:4px 8px; font-size:12px; color:var(--w-muted); margin-top:6px; }
.wars-ui .wars-chat .chat-feed { display:flex; flex-direction:column; gap:7px; }
.wars-ui .wars-chat .chat1, .wars-ui .wars-chat .chat2 { width:auto; min-width:0; max-width:96%; margin:0; padding:7px 9px; border:1px solid var(--w-line); border-radius:6px; overflow-wrap:anywhere; line-height:1.45; font-size:14px; box-shadow:none; background:var(--w-alt); color:var(--w-ink); }
.wars-ui .wars-chat .chat1 { align-self:flex-end; background:#dce8e7; color:#263e40; border-color:#bbcfcd; border-bottom-right-radius:3px; }
.wars-ui .wars-chat .chat2 { align-self:flex-start; border-bottom-left-radius:3px; }
.wars-ui[data-theme=dark] .wars-chat .chat1 { background:#233739; color:#e0efed; border-color:#496064; }
.wars-ui[data-theme=dark] .wars-chat article font[color="#001a00"] { color:inherit; }
.wars-ui .wars-chat .chat1 small, .wars-ui .wars-chat .chat2 small { font-size:12px; color:inherit; }
.wars-ui .wars-chat .chat-reply { display:inline-flex; align-items:center; justify-content:center; min-width:36px; min-height:36px; padding:4px 6px; border:0; border-radius:4px; background:transparent; cursor:pointer; text-decoration:none; color:inherit; font:14px/1 var(--w-font); }
.wars-ui .wars-chat #smiles, .wars-ui .wars-chat #smiles1 { width:100%; max-width:100%; table-layout:fixed; margin-top:6px; }
.wars-ui .wars-chat #smiles td, .wars-ui .wars-chat #smiles1 td { padding:4px 0; text-align:center; }
.wars-ui .wars-chat #smiles img, .wars-ui .wars-chat #smiles1 img { max-width:40px; max-height:40px; cursor:pointer; vertical-align:middle; }
.wars-ui .wars-chat .next { display:inline-flex; align-items:center; justify-content:center; width:auto; min-width:36px; height:36px; min-height:36px; padding:0 9px; margin:2px 3px 6px; line-height:1; vertical-align:middle; border:1px solid var(--w-action); border-radius:4px; background:var(--w-action); color:var(--w-on-action); text-decoration:none; }
.wars-ui .wars-chat .next#pressed { background:var(--w-alt); border-color:var(--w-line); color:var(--w-ink); }
.wars-ui .wars-chat .chat-delete { display:inline; margin:0; }
.wars-ui .wars-chat .chat-delete button { background:transparent; border:0; min-height:36px; min-width:36px; }
.wars-ui .wars-chat #chat-error { padding:9px; border:1px solid var(--w-danger); border-radius:4px; margin-bottom:8px; background:var(--w-surface); color:var(--w-danger); }
.wars-ui .wars-chat #chat-notice:empty { display:none; }
.wars-ui .wars-chat #chat-notice { padding:6px 0; color:var(--w-success); font-size:12px; }
.wars-ui .wars-chat button:disabled { opacity:.65; cursor:wait; }
.wars-ui .wars-chat article img { max-width:100%; max-height:120px; }
.wars-ui .wars-chat [hidden] { display:none !important; }
.wars-ui #chat-footer { text-align:center; font-size:12px; color:var(--w-muted); }
@media(max-width:600px) {
  .wars-ui .wars-chat { width:100%; margin:0; padding:0; }
  .wars-ui .wars-chat > .cont { border-left:0; border-right:0; border-radius:0; }
  .wars-ui .wars-chat .lenta { padding:8px; }
  .wars-ui .wars-chat .chat-feed { padding:8px; }
}

/* Point complaints to the bugs and suggestions page. */
.wars-ui .wars-chat .chat-feedback { display:flex; align-items:center; gap:6px; min-height:36px; margin-top:4px; font-size:12px; color:var(--w-muted); text-decoration:none; }
.wars-ui .wars-chat .chat-feedback b { color:var(--w-ink); text-decoration:underline; text-underline-offset:2px; }

/* Reactions: compact parchment controls, no extra message cards or reloads. */
.wars-ui .wars-chat .chat-meta {display:flex;align-items:center;flex-wrap:wrap;gap:0 3px;margin-top:2px}
.wars-ui .wars-chat .chat-meta>small {white-space:nowrap}
.wars-ui .wars-chat .chat-reactions {display:inline-flex;align-items:center;flex-wrap:wrap;gap:3px;margin:0 0 0 auto;padding:0;max-width:100%}
.wars-ui .wars-chat .chat-reaction {display:inline-flex;align-items:center;justify-content:center;gap:3px;min-width:36px;min-height:36px;padding:3px 6px;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--w-ink);font:14px/1.2 var(--w-font);cursor:pointer;box-shadow:none;text-shadow:none;vertical-align:middle}
.wars-ui .wars-chat .chat-reaction>span:first-child {font:17px/1.2 'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif}
.wars-ui .wars-chat .chat-reaction-count {font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.wars-ui .wars-chat .chat-reaction-count:empty {display:none}
.wars-ui .wars-chat .chat-reaction[aria-pressed=true] {background:var(--w-surface);border-color:var(--w-action);color:var(--w-ink)}
.wars-ui .wars-chat .chat-reaction:focus-visible {outline:2px solid var(--w-focus);outline-offset:2px}
.wars-ui .wars-chat .chat-reaction-static {cursor:default;min-height:28px;min-width:0;padding:2px 4px}
.wars-ui .wars-chat .chat-reaction-status {position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.wars-ui .wars-chat .chat-reaction-error {position:static;flex-basis:100%;width:auto;height:auto;overflow:visible;clip-path:none;white-space:normal;color:var(--w-danger);font-size:12px;line-height:1.4;padding:2px 0}
@media(hover:hover) {.wars-ui .wars-chat button.chat-reaction:hover {background:var(--w-surface);border-color:var(--w-line)}}

/* r2: tap a message for a floating picker; only received counts stay visible. */
.wars-ui .wars-chat .chat-reaction-totals {display:inline-flex;align-items:center;gap:3px}
.wars-ui .wars-chat .chat-reaction-totals:empty {display:none}
.wars-ui .wars-chat .chat-reaction-total {min-height:28px;min-width:0;padding:2px 5px}
.wars-ui .wars-chat span.chat-reaction-total {cursor:default}
.wars-ui .wars-chat .chat-reaction-total[data-mine=true] {background:var(--w-surface);border-color:var(--w-action)}
.wars-ui .wars-chat .chat-reaction-menu {position:relative}
.wars-ui .wars-chat .chat-reaction-open {display:inline-flex;align-items:center;min-height:32px;padding:2px 5px;cursor:pointer;color:var(--w-muted);font-size:12px;list-style:none}
.wars-ui .wars-chat .chat-reaction-open::-webkit-details-marker {display:none}
.wars-ui .wars-chat .chat-reaction-menu:not([open])>.chat-reaction-picker {display:none}
.wars-ui .wars-chat .chat-reaction-picker {display:flex;align-items:center;gap:4px;position:absolute;right:0;bottom:calc(100% + 8px);z-index:1000;width:max-content;max-width:calc(100vw - 16px);padding:5px;border:1px solid var(--w-edge);border-radius:28px;background:var(--w-surface);box-shadow:0 4px 16px #0003}
.wars-ui .wars-chat .chat-reaction-picker>.chat-reaction {min-width:44px;min-height:44px;padding:5px;border-radius:50%}
.wars-ui .wars-chat .chat-reaction-picker>.chat-reaction>span {font-size:26px}
.chat-reactions-enhanced .wars-chat article:has(.chat-reaction-menu) {cursor:pointer}
.chat-reactions-enhanced .wars-chat .chat-reaction-picker {position:fixed;right:auto;bottom:auto}
.chat-reactions-enhanced .wars-chat .chat-reaction-open:not(:focus-visible) {position:absolute;width:1px;height:1px;min-height:0;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.chat-reactions-enhanced .wars-chat .chat-reaction-open:focus-visible {position:absolute;bottom:0;right:0;width:max-content;background:var(--w-surface);outline:2px solid var(--w-focus);z-index:1}