/* RUVI chat is a standalone layout extension. No game/host transforms or timing changes. */
.ruvi-chat{position:relative;min-width:0;overflow:hidden;background:#fff}
.chat-shell{display:flex;flex-direction:column;height:100%;min-height:0}
.chat-header{display:flex;align-items:center;gap:12px;padding:22px 20px;border-bottom:1px solid #f1eeeb;flex:none}
.chat-symbol{display:flex;color:#202126}
.ruvi-chat svg,.chat-launcher svg{width:23px;height:23px;display:block;flex:none}
.chat-heading{min-width:0;flex:1}
.chat-heading h2{font-size:20px;letter-spacing:-.6px;line-height:1.2}
.chat-presence{display:flex;align-items:center;gap:7px;font-size:11px;color:#919199;margin-top:7px;white-space:nowrap}
.chat-presence i{width:7px;height:7px;background:#18c27b;border-radius:50%;box-shadow:0 0 0 3px #18c27b0c}
.chat-icon{display:flex;justify-content:center;align-items:center;width:32px;height:36px;padding:0;border:0;border-radius:10px;background:transparent;color:#919199;flex:none}
.chat-icon:hover{color:#252529;background:#f6f3ef}
.chat-toggle{margin-left:auto;color:#44444b}
.chat-toggle svg{width:18px;height:18px}
.chat-body{display:flex;flex-direction:column;flex:1;min-height:0;position:relative}
.chat-body[hidden],.chat-emoji[hidden],.chat-rules[hidden],.chat-new[hidden],.chat-backdrop[hidden],.chat-launcher[hidden]{display:none}
.chat-messages{flex:1;min-height:0;overflow:auto;padding:14px 12px 8px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#e8e4de transparent}
.chat-message{display:flex;align-items:flex-start;gap:11px;padding:14px 10px;margin:0 0 8px;border-radius:16px}
.chat-message .avatar{--a:39px;margin-top:1px}
.chat-message-content{flex:1;min-width:0}
.chat-message-meta{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;line-height:1.3}
.chat-message-meta b{font-size:13px;font-weight:650;letter-spacing:-.15px}
.chat-message-meta time{font-size:10px;color:#9999a1;font-variant-numeric:tabular-nums}
.chat-message p{font-size:13px;line-height:1.55;color:#585964;margin-top:5px;white-space:pre-wrap;overflow-wrap:anywhere}
.chat-message.is-own{background:transparent}
.chat-message.is-reply-to-me{background:#fff2e9}
.chat-message.is-reply-to-me .avatar{outline:1.5px solid var(--orange);outline-offset:3px}
.chat-bottom{padding:12px 12px 16px;flex:none;background:#fff;position:relative}
.chat-compose{display:flex;gap:5px;align-items:flex-end;padding:5px;border:1px solid #eeebe7;border-radius:17px;background:#fcfbfa;transition:border-color .18s,box-shadow .18s}
.chat-compose:focus-within{border-color:#ffbe98;box-shadow:0 0 0 3px #ff6c170b}
.chat-compose .chat-icon{height:39px;width:31px}
.chat-compose textarea{resize:none;min-width:0;min-height:39px;height:39px;flex:1;border:0;outline:none!important;background:none;font:inherit;font-size:12px;line-height:20px;padding:10px 0 9px;max-height:100px;margin:0;color:#34343c;scrollbar-width:thin}
.chat-compose textarea::placeholder{color:#a7a6ad}
.chat-send{width:39px;height:39px;border:1px solid #ff5b17;border-radius:13px;background:var(--orange);color:white;display:flex;align-items:center;justify-content:center;flex:none;padding:0}
.chat-send:hover:not(:disabled){background:#ec4d0d;box-shadow:0 3px 10px #ff65182b}
.chat-send:disabled{opacity:.42;cursor:default}
.chat-send svg{width:21px;height:21px}
.chat-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:12px 6px 0;color:#aaa5a0;font-size:10px}
.chat-rules-toggle{padding:0;background:none;border:0;color:#898a93;font-size:10px;text-decoration:underline;text-underline-offset:3px}
.chat-rules-toggle:hover{color:var(--orange)}
.chat-rules{font-size:12px;line-height:1.6;color:#787780;background:#faf8f5;border-radius:12px;padding:12px;margin-top:12px;max-height:180px;overflow:auto}
.chat-feedback{font-size:11px;line-height:1.4;color:#9a6948;margin:8px 6px 0}
.chat-feedback:empty{display:none}
.chat-emoji{display:flex;justify-content:space-between;gap:3px;border:1px solid #eee9e3;background:#fff;border-radius:14px;padding:6px;margin-bottom:8px;box-shadow:0 6px 20px #47341b0a}
.chat-emoji button{font-size:20px;background:none;border:0;border-radius:8px;min-width:32px;height:36px;padding:0}
.chat-emoji button:hover{background:#fff1e7}
.chat-new{position:absolute;bottom:112px;left:50%;transform:translateX(-50%);border:1px solid #ffe0cc;border-radius:20px;padding:8px 12px;background:#fff4e9;color:#d95b20;font-size:11px;white-space:nowrap;z-index:1}
.chat-launcher{position:fixed;right:24px;bottom:24px;z-index:17;display:flex;align-items:center;gap:9px;background:white;color:#34343a;border:1px solid #eee5dc;box-shadow:0 6px 24px #49351e14;border-radius:18px;padding:13px 17px;font-size:14px;font-weight:600}
.chat-launcher svg{color:var(--orange);width:21px;height:21px}
.chat-backdrop{position:fixed;inset:0;background:#17171738;z-index:39;pointer-events:none}
@media(min-width:1500px){
  .layout.with-chat{max-width:1920px;grid-template-columns:clamp(240px,17vw,290px) minmax(0,1fr) clamp(280px,19vw,330px);column-gap:16px}
  .layout.with-chat .bet-title h2{font-size:20px}
  .with-chat>.ruvi-chat{grid-column:3;grid-row:1/3;align-self:stretch}
  .with-chat .chat-shell{position:absolute;inset:0}
  .layout.with-chat.chat-collapsed{grid-template-columns:clamp(240px,17vw,290px) minmax(0,1fr) 64px}
  .chat-collapsed .chat-header{padding:20px 12px;flex-direction:column;border-bottom:0;gap:16px}
  .chat-collapsed .chat-heading{display:none}
  .chat-collapsed .chat-toggle{margin:0;transform:rotate(180deg)}
  .chat-launcher{display:none}
}
@media(max-width:1499px){
  .ruvi-chat{position:fixed;z-index:40;right:16px;top:96px;bottom:18px;width:min(360px,calc(100vw - 32px));border:1px solid #eee6dd;box-shadow:0 18px 70px #30200b20;visibility:hidden;transform:translateX(16px);opacity:0;transition:transform .2s,opacity .2s,visibility .2s}
  .ruvi-chat.is-open{visibility:visible;transform:none;opacity:1}
  .chat-toggle svg{transform:rotate(90deg)}
}
@media(max-width:760px){
  .chat-launcher{right:14px;bottom:calc(168px + env(safe-area-inset-bottom));border-radius:15px;padding:10px 13px;font-size:12px}
  .ruvi-chat{right:0;top:auto;bottom:0;width:100%;height:min(680px,88dvh);border-radius:24px 24px 0 0;transform:translateY(20px)}
  .chat-header{padding:19px 20px}
  .chat-messages{padding:10px 13px}
  .chat-message{padding:12px 10px}
  .chat-message p{font-size:14px}
  .chat-message-meta b{font-size:14px}
  .chat-bottom{padding:12px 14px max(15px,env(safe-area-inset-bottom))}
  .chat-compose textarea{font-size:16px}
  .chat-meta{font-size:11px}
  .chat-rules-toggle{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.ruvi-chat,.chat-compose{transition:none}}
/* VIP status badge next to the nickname; the nickname shrinks first. */
.chat-message-meta b{min-width:0;max-width:calc(100% - 64px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-tier{flex:none;width:14px;height:16px;align-self:center;object-fit:contain;margin-left:-3px}
/* Reply actions are overlays, not another column. Own messages share the normal surface. */
.chat-message{position:relative}.chat-message-meta{padding-right:16px}
.chat-reply-button{position:absolute;top:9px;right:5px;width:26px;height:26px;border:0;border-radius:7px;background:transparent;color:#9698a2;display:flex;align-items:center;justify-content:center;padding:5px;opacity:0;transition:opacity .12s,background .12s;cursor:pointer}.ruvi-chat .chat-reply-button svg{width:16px;height:16px}.chat-message:hover .chat-reply-button,.chat-message:focus-within .chat-reply-button{opacity:1}.chat-reply-button:hover{background:#9397a215;color:#555a66}.chat-reply-button:focus-visible,.chat-reply-quote:focus-visible,.chat-reply-cancel:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.chat-reply-quote{display:flex;flex-direction:column;gap:3px;max-width:100%;width:100%;text-align:left;border:0;border-left:2px solid #c3c5ce;background:#979aa30b;border-radius:0 5px 5px 0;padding:5px 7px;margin-top:6px;color:#8a8d98;cursor:pointer;line-height:1.35;font-size:10px}.chat-reply-quote b{font-size:10px;font-weight:600;color:#737781}.chat-reply-quote span{display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.is-reply-to-me .chat-reply-quote{border-left-color:#f38650}.is-reply-to-me .chat-reply-quote b{color:#d16b39}
.chat-reply-draft{display:flex;align-items:center;justify-content:space-between;gap:7px;padding:0 5px 10px;color:#808591;min-width:0}.chat-reply-draft[hidden]{display:none}.chat-reply-draft>span{display:flex;align-items:center;gap:9px;min-width:0;flex:1}.ruvi-chat .chat-reply-draft svg{width:18px;height:18px;flex:none;color:#9a9da6}.chat-reply-draft>span>span{min-width:0;display:flex;flex-direction:column;gap:3px;border-left:2px solid #b9bdc5;padding-left:8px}.chat-reply-draft b,.chat-reply-draft small{font-size:11px;line-height:1.3;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-reply-draft b{font-weight:600;color:#6e7480}.chat-reply-cancel{display:flex;align-items:center;justify-content:center;width:28px;height:28px;flex:none;border:0;background:transparent;border-radius:7px;padding:0;color:#9397a2;font-size:23px;font-weight:400;line-height:1}
:root[data-theme=dark] .chat-message.is-own{background:transparent!important}:root[data-theme=dark] .chat-reply-button:hover{background:#ffffff0d;color:#c8cbd2}:root[data-theme=dark] .chat-reply-quote{background:#ffffff04;border-left-color:#616773;color:#999fab}:root[data-theme=dark] .chat-reply-quote b,:root[data-theme=dark] .chat-reply-draft b{color:#b3b9c4}:root[data-theme=dark] .is-reply-to-me .chat-reply-quote{border-left-color:#b7744c}:root[data-theme=dark] .is-reply-to-me .chat-reply-quote b{color:#dc9b73}
@media(hover:none),(pointer:coarse){.chat-reply-button{opacity:.7;min-width:28px;min-height:28px}.chat-reply-quote,.chat-reply-quote b{font-size:11px}.chat-reply-cancel{width:32px;height:32px}}
@media(prefers-reduced-motion:reduce){.chat-reply-button{transition:none}}

/* Stage 9: report button and reason menu (server mode) */
.chat-report-button{right:33px}.chat-message.has-report .chat-message-meta{padding-right:48px}
.chat-message:hover .chat-report-button,.chat-message:focus-within .chat-report-button{opacity:1}
.chat-report-menu{position:absolute;top:38px;right:8px;z-index:5;display:flex;flex-direction:column;min-width:190px;padding:6px;border-radius:12px;background:#fff;box-shadow:0 8px 28px #1b1d2329,0 0 0 1px #1b1d2314}
.chat-report-menu.is-up{top:auto;bottom:calc(100% - 8px)}
.chat-report-menu b{font-size:11px;font-weight:700;color:#8a8d97;padding:6px 10px 4px;text-transform:uppercase;letter-spacing:.04em}
.chat-report-menu button{border:0;background:transparent;text-align:left;font:inherit;font-size:13px;color:#24262d;padding:9px 10px;border-radius:8px;cursor:pointer}
.chat-report-menu button:hover,.chat-report-menu button:focus-visible{background:#f2f1ee;outline:none}
:root[data-theme=dark] .chat-report-menu{background:#22252b;box-shadow:0 8px 28px #0008,0 0 0 1px #ffffff12}:root[data-theme=dark] .chat-report-menu button{color:#d9dce2}:root[data-theme=dark] .chat-report-menu button:hover,:root[data-theme=dark] .chat-report-menu button:focus-visible{background:#ffffff0f}
@media(hover:none),(pointer:coarse){.chat-report-button{opacity:.7}.chat-report-menu button{padding:12px 10px}}
