/* Desktop-only chat. Keep the existing Quick Exit permanently accessible below it. */
.ks-desktop-chat { display: none; }
@media (min-width: 992px) {
  .ks-desktop-chat { display: block; position: fixed; right: 1.25rem; bottom: 5.15rem; z-index: 1420; font-family: inherit; }
  .ks-desktop-chat-launcher { cursor: pointer; display: flex; align-items: center; gap: .7rem; margin-left: auto; border: 1px solid #ab5cdd; border-radius: 100px; padding: .7rem 1.15rem; background: linear-gradient(110deg,#3e1c55,#6b2b8a); color: #fff; font-weight: 750; box-shadow: 0 12px 30px #0b0610a8; }
  .ks-desktop-chat-launcher:focus-visible, .ks-desktop-chat button:focus-visible, .ks-desktop-chat a:focus-visible { outline: 2px solid #f4aaff; outline-offset: 3px; }
  .ks-desktop-chat-launch-icon { display: inline-grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: #ffffff20; }
  .ks-desktop-chat-unread { min-width: 1.3rem; border-radius: 50px; background: #f17fd8; color: #230d2d; padding: .12rem .35rem; text-align: center; font-size: .74rem; }
  .ks-desktop-chat-panel { display: flex; flex-direction: column; position: absolute; bottom: 3.9rem; right: 0; height: min(560px, calc(100dvh - 10rem)); width: 362px; max-width: calc(100vw - 2.5rem); overflow: hidden; border: 1px solid #6a3b81; border-radius: 1.2rem; background: #1c1425; color: #f6efff; box-shadow: 0 22px 65px #07040ce0; }
  .ks-desktop-chat-panel[hidden], .ks-desktop-chat-thread[hidden], .ks-desktop-chat-inbox[hidden], .ks-desktop-chat-status[hidden] { display: none !important; }
  .ks-desktop-chat-header { display:flex; justify-content:space-between; align-items:center; padding: 1rem 1.1rem; border-bottom: 1px solid #493051; background: linear-gradient(115deg,#40224f,#25162e); }
  .ks-desktop-chat-kicker { color: #e4a4eb; font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; }
  .ks-desktop-chat-header h2 { font-size: 1.15rem; margin: .15rem 0 0; color: #fff; }
  .ks-desktop-chat-head-actions { display:flex; align-items:center; gap:.8rem; }
  .ks-desktop-chat-head-actions a, .ks-desktop-chat-head-actions button { color:#fff; background:none; border:0; font-size:1.4rem; text-decoration:none; line-height:1; }
  .ks-desktop-chat-inbox { display:flex; flex:1; flex-direction:column; min-height:0; padding:.7rem; }
  .ks-desktop-chat-inbox input { width:100%; padding:.7rem; border:1px solid #5e3b69; border-radius:.75rem; background:#2a1d34; color:#fff; }
  .ks-desktop-chat-inbox input::placeholder, .ks-desktop-chat-compose textarea::placeholder { color:#c5b0ce; }
  .ks-desktop-chat-list { display:grid; align-content:start; overflow-y:auto; flex:1; margin-top:.7rem; }
  .ks-desktop-chat-person { width:100%; text-align:left; display:flex; gap:.7rem; align-items:center; background:transparent; color:#fff; padding:.65rem .55rem; border:0; border-bottom:1px solid #392941; cursor:pointer; }
  .ks-desktop-chat-person:hover { background:#392444; }
  .ks-desktop-chat-avatar { display:grid; flex:none; place-items:center; width:2.7rem; height:2.7rem; border-radius:50%; background:#602c7b; font-weight:750; position:relative; }
  .ks-desktop-chat-avatar-img { position:absolute; inset:0; width:100%; height:100%; border-radius:inherit; object-fit:cover; object-position:center; opacity:0; transition:opacity .12s ease; }
  .ks-desktop-chat-avatar-img.is-ready { opacity:1; }
  .ks-desktop-chat-avatar-fallback { display:grid; place-items:center; width:100%; height:100%; border-radius:inherit; background:#602c7b; }
  .ks-desktop-chat-avatar-fallback[hidden] { display:none!important; }
  .ks-desktop-chat-avatar.is-compact { width:2rem; height:2rem; font-size:.82rem; }
  .ks-desktop-chat-avatar.is-online::after { z-index:2; content:""; position:absolute; right:0; bottom:0; background:#62d3a6; width:.65rem; height:.65rem; border:2px solid #1c1425; border-radius:100%; }
  .ks-desktop-chat-person-copy { display:grid; min-width:0; flex:1; }
  .ks-desktop-chat-person-copy strong,.ks-desktop-chat-person-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .ks-desktop-chat-person-copy small { color:#c4afcf; font-size:.75rem; }
  .ks-desktop-chat-count { display:grid; place-items:center; min-width:1.4rem; height:1.4rem; border-radius:1rem; font-size:.72rem; background:#df78e3; color:#210d2a; }
  .ks-desktop-chat-thread { display:flex; flex:1; flex-direction:column; min-height:0; }
  .ks-desktop-chat-thread-bar { display:flex; align-items:center; gap:.55rem; border-bottom:1px solid #3e2a4c; padding:.5rem .8rem; }
  .ks-desktop-chat-thread-avatar { display:inline-flex; flex:none; width:2rem; height:2rem; }
  .ks-desktop-chat-thread-bar strong { flex:1; font-size:.88rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .ks-desktop-chat-thread-bar button { border:0; background:transparent; color:white; font-size:1.55rem; }
  .ks-desktop-chat-thread-bar a,.ks-desktop-chat-footer a { color:#f0b4ee; font-size:.76rem; }
  .ks-desktop-chat-messages { display:flex; flex:1; flex-direction:column; gap:.55rem; min-height:0; overflow-y:auto; padding:.8rem; }
  .ks-desktop-chat-bubble { align-self:flex-start; max-width:86%; background:#392747; padding:.57rem .74rem; border-radius:.9rem .9rem .9rem .2rem; overflow-wrap:anywhere; white-space:pre-wrap; font-size:.85rem; }
  .ks-desktop-chat-bubble.is-mine { align-self:flex-end; background:#65317f; border-radius:.9rem .9rem .2rem .9rem; }
  .ks-desktop-chat-bubble time { display:block; color:#e7c9ea; font-size:.66rem; text-align:right; margin-top:.2rem; }
  .ks-desktop-chat-bubble a { color:#fff; text-decoration:underline; }
  .ks-desktop-chat-compose { display:flex; gap:.5rem; padding:.65rem .8rem; border-top:1px solid #46314c; }
  .ks-desktop-chat-compose textarea { flex:1; min-width:0; border:1px solid #5c4071; background:#2b1d35; color:#fff; border-radius:.6rem; padding:.6rem; resize:none; }
  .ks-desktop-chat-compose button { border:0; color:#fff; background:#8a3bb3; border-radius:.65rem; padding:.5rem .8rem; cursor:pointer; }
  .ks-desktop-chat-compose button:disabled { opacity:.6; cursor:wait; }
  .ks-desktop-chat-status { margin:0; padding:.45rem .8rem; background:#44243a; color:#fff; font-size:.78rem; }
  .ks-desktop-chat-footer { display:flex; justify-content:space-between; gap:.5rem; padding:.6rem .85rem; border-top:1px solid #45304e; }
  .ks-desktop-chat-empty { padding:1rem .6rem; text-align:center; color:#ccb7d4; font-size:.85rem; }
}
@media print { .ks-desktop-chat { display:none !important; } }
.ks-notification-is-read { opacity:.78; border-color:var(--ks-border); }
.ks-notification-is-read:hover { opacity:1; }

/* The same five message reactions as /messages/{id}, sized for the desktop popup. */
@media (min-width: 992px) {
  .ks-desktop-chat-message { display:flex; flex-direction:column; align-self:flex-start; align-items:flex-start; max-width:90%; min-width:0; }
  .ks-desktop-chat-message.is-mine { align-self:flex-end; align-items:flex-end; }
  .ks-desktop-chat-message .ks-desktop-chat-bubble { align-self:stretch; max-width:100%; }
  .ks-desktop-chat-reaction-controls { display:flex; flex-direction:column; align-items:flex-start; gap:.22rem; padding:.14rem .1rem .2rem; width:100%; max-width:100%; }
  .ks-desktop-chat-message.is-mine .ks-desktop-chat-reaction-controls { align-items:flex-end; }
  .ks-desktop-chat-reaction-toggle { color:#eac9f0; background:transparent; border:0; border-radius:.4rem; padding:.1rem .3rem; cursor:pointer; font-size:.72rem; }
  .ks-desktop-chat-reaction-toggle:hover, .ks-desktop-chat-reaction-toggle[aria-expanded="true"] { background:#4c315b; color:#fff; }
  .ks-desktop-chat-reaction-menu { display:flex; flex-wrap:wrap; gap:.16rem; padding:.3rem; border:1px solid #805098; border-radius:.75rem; background:#30203d; box-shadow:0 5px 15px #09030aa0; }
  .ks-desktop-chat-reaction-menu[hidden], .ks-desktop-chat-reaction-counts[hidden] { display:none!important; }
  .ks-desktop-chat-reaction-option { width:2.15rem; height:2.15rem; padding:0; font-size:1.13rem; line-height:1; border-radius:.5rem; background:transparent; color:white; border:1px solid transparent; cursor:pointer; }
  .ks-desktop-chat-reaction-option:hover, .ks-desktop-chat-reaction-option:focus-visible, .ks-desktop-chat-reaction-option[aria-pressed="true"] { background:#694082; border-color:#cb88e7; }
  .ks-desktop-chat-reaction-option:disabled { opacity:.55; cursor:wait; }
  .ks-desktop-chat-reaction-counts { display:flex; align-items:center; flex-wrap:wrap; gap:.23rem; padding:.05rem .04rem; }
  .ks-desktop-chat-reaction-pill { display:inline-flex; gap:.2rem; align-items:center; padding:.1rem .36rem; border:1px solid #84549a; border-radius:100px; background:#2a1b35; color:#fff; font-size:.78rem; }
  .ks-desktop-chat-reaction-count { border:0; background:transparent; color:#f8eaff; font-size:.75rem; padding:0 .12rem; cursor:pointer; }
  .ks-desktop-chat-reaction-count:hover { text-decoration:underline; }
  .ks-desktop-chat-message.is-activity { align-self:center; max-width:98%; align-items:center; }
  .ks-desktop-chat-reaction-activity { background:#2a2035; border:1px solid #4f355f; border-radius:.75rem; color:#e7c5ea; font-size:.72rem; padding:.3rem .5rem; text-align:center; white-space:normal; overflow-wrap:anywhere; }
}

/* In-chat report controls use the same KS moderation endpoint as full messages. */
@media (min-width: 992px) {
.ks-desktop-chat-report-toggle { margin-left:auto; color:#ffb4ce; border:1px solid #774661; background:transparent; border-radius:.45rem; padding:.25rem .45rem; font-size:.72rem; cursor:pointer; }
.ks-desktop-chat-report-panel { display:grid; gap:.45rem; width:100%; padding:.6rem; border:1px solid #744969; border-radius:.65rem; background:#291a35; }
.ks-desktop-chat-report-panel[hidden] { display:none!important; }
.ks-desktop-chat-report-select,.ks-desktop-chat-report-details { width:100%; min-width:0; padding:.4rem; border:1px solid #76518a; border-radius:.4rem; background:#21142d; color:#fff; font-size:.78rem; }
.ks-desktop-chat-report-actions { display:flex; justify-content:flex-end; gap:.5rem; }
.ks-desktop-chat-report-actions button { padding:.35rem .6rem; border:1px solid #875b91; border-radius:.4rem; background:#633375; color:#fff; font-size:.78rem; }
}