.other-spyfall .spy-comms {
  align-self: start;
  position: sticky;
  top: 12px;
  padding: 12px;
  border: 1px solid #8cafba60;
  border-radius: 11px;
  background: #102535ed;
  box-shadow: 0 12px 28px #0005;
}
.spy-comms-head { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; margin-bottom: 9px; }
.spy-comms-head small { color: #bbd1cf; font-size: 9px; text-align: right; }
.spy-comms .chat-list { max-height: 140px; min-height: 52px; overflow: auto; color: #d7e7e5; font-size: 11px; }
.spy-comms .chat-list > div { padding: 5px 0; border-bottom: 1px solid #ffffff16; overflow-wrap: anywhere; }
.spy-comms .chat-list b { color: #f2d5a1; }
.spy-comms .chat-form { margin: 9px 0 0; }
.spy-comms .chat-form input { background: #0a1d2b; color: #f4f4e9; }
.spy-comms .chat-form button { min-height: 42px; border-color: #8fbfc2; background: #285260; }
.spy-comms-events { margin-top: 10px; border-top: 1px solid #ffffff27; }
.spy-comms-events summary { display: flex; justify-content: space-between; padding: 9px 0 0; color: #bbd1cf; font-size: 10px; list-style: none; }
.spy-comms-events summary::-webkit-details-marker { display: none; }
.spy-comms-events .other-events { max-height: 130px; margin-top: 8px; }

.spy-mission-head.spy-mission-urgent { border-color: #f1b877bb; background: linear-gradient(105deg, #47312e, #172b39 72%); box-shadow: 0 0 0 1px #e4a66a47, 0 0 25px #e4a66a24; }
.spy-clock-label { display: block; margin-bottom: 3px; color: #a9d3d3; font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.spy-clock-urgent .spy-clock-label { color: #ffd6a7; }
.spy-clock-urgent > span { color: #ffe6b8; text-shadow: 0 0 14px #e8a06580; }
.spy-clock-urgent .spy-progress i { background: #ffc27e; }
.spy-clock-urgent #turn-timer.timer-low { color: #fff1d9; animation: spy-clock-beat .8s ease-in-out infinite alternate; }
@keyframes spy-clock-beat { to { opacity: .55; text-shadow: 0 0 20px #ffc27e; } }

.spy-agent { min-height: 42px; }
.spy-agent strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.spy-agent-meta { display: grid; gap: 2px; justify-items: end; margin-left: auto; white-space: nowrap; }
.spy-agent-meta b { margin: 0; }
.spy-vote-state { min-width: 62px; padding: 3px 5px; border: 1px solid #8fbfc266; border-radius: 4px; background: #183744; color: #bfdee0; font-size: 8px; font-weight: 850; letter-spacing: .08em; text-align: center; }
.spy-agent.vote-yes .spy-vote-state { border-color: #8bd7aa88; background: #24503b; color: #b5f5c6; }
.spy-agent.vote-no .spy-vote-state { border-color: #efaa9a88; background: #5b302e; color: #ffd0c0; }
.spy-agent.vote-accused .spy-vote-state { border-color: #efbe86b0; background: #63412e; color: #ffddb1; }
.spy-agent.vote-pending .spy-vote-state { animation: spy-pending 1.7s ease-in-out infinite alternate; }
@keyframes spy-pending { to { box-shadow: 0 0 10px #a8d6d681; } }
.spy-vote-wait { color: #d4e2df; }

@media (max-width: 1120px) { .other-spyfall .spy-comms { position: static; } }
@media (max-width: 760px) {
  .other-spyfall .other-jump a { padding-inline: 4px; font-size: 10px; }
  .other-spyfall .spy-comms { margin-bottom: 80px; }
  .spy-comms .chat-list { max-height: 85px; }
}
@media (prefers-reduced-motion: reduce) {
  .spy-clock-urgent #turn-timer.timer-low,
  .spy-agent.vote-pending .spy-vote-state { animation: none; }
}
