/* Vexoria — PK (client/src/pk.js) */
#menu-hotbar #pk-open canvas.pk-icon{width:27px;height:24px;image-rendering:pixelated}
html #hotbar #menu-hotbar #pk-open canvas.pk-icon{width:30px;height:27px}
#menu-hotbar #pk-open.pk-active canvas.pk-icon{filter:drop-shadow(0 0 3px #ff4b4b) sepia(1) saturate(6) hue-rotate(-30deg)}
#mobile-dock canvas.pk-icon{width:28px;height:25px;image-rendering:pixelated}
html.touch-device #mobile-dock button.on canvas.pk-icon{transform:translateY(2px);filter:sepia(1) saturate(6) hue-rotate(-30deg)}

#pk-pill{position:absolute;right:10px;bottom:-12px;z-index:2;padding:2px 8px;font:14px Pix,monospace;border:2px solid #1a1126;background:#2a1a33ee;color:#e3dcef;cursor:pointer;pointer-events:auto;white-space:nowrap}
#pk-pill.hidden{display:none}
#pk-pill.pk-on{color:#ff9b4a;border-color:#7a3a1c}
#pk-pill.pk-white{color:#f2eee6;border-color:#8c8496}
#pk-pill.pk-yellow{color:#f7d34a;border-color:#7a6a1c}
#pk-pill.pk-red{color:#ff6b6b;border-color:#7a1c2a}
#pk-pill.pk-black{color:#ff4b4b;background:#0d0812ee;border-color:#ff4b4b;animation:pk-pulse 1.4s infinite}
@keyframes pk-pulse{50%{box-shadow:0 0 8px #ff4b4b}}

.pk-window .game-window{max-width:560px}
.pk-window .pk-head{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.pk-window .pk-head>div{display:flex;flex-direction:column;gap:2px;min-width:120px}
.pk-window .pk-head small{opacity:.7;font-size:12px}
.pk-window .pk-head strong{font:20px Pix,monospace}
.pk-window .pk-head button{margin-left:auto}
.pk-window .pk-on{color:#ff6b6b}
.pk-window .pk-off{color:#8fd1b8}
.pk-window .pk-clean{color:#8fd1b8}
.pk-window .pk-status{display:flex;align-items:center;gap:6px}
.pk-window .pk-skull-img{width:18px;height:16px;image-rendering:pixelated;vertical-align:middle}
.pk-window .pk-warn{color:#f7d77a;margin:6px 0}
.pk-window .pk-bad{color:#ffb0b0;background:#3a0f1a99;padding:6px 8px;border-left:3px solid #ff4b4b;margin:8px 0;line-height:1.5}
.pk-window h3{margin:10px 0 4px;font:16px Pix,monospace;color:#f7d77a}
.pk-window .pk-rules{margin:0;padding-left:18px;line-height:1.55;font-size:13px}
.pk-window .pk-rules li{margin:2px 0}

/* prévia do chat (client/src/chat-preview.js) */
#chat-preview{position:absolute;z-index:30;max-width:min(380px,70vw);display:flex;flex-direction:column;gap:3px;pointer-events:auto;cursor:pointer}
#chat-preview.hidden{display:none}
#chat-preview .cp-line{padding:4px 9px;background:#140d1ce6;border:2px solid #3d2c56;box-shadow:0 2px #0008;color:#e3dcef;font-size:14px;line-height:17px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:1px 1px 0 #07040c;animation:cp-in .18s ease-out}
#chat-preview .cp-line b{color:#f7d77a;font-weight:normal}
#chat-preview .cp-guild{border-color:#4d6b3a}#chat-preview .cp-guild b{color:#93b46a}
@keyframes cp-in{from{opacity:0;transform:translateY(6px)}}
.chat-unread{position:absolute;top:-8px;right:-8px;min-width:18px;height:18px;padding:0 4px;box-sizing:border-box;display:grid;place-items:center;
  background:#e0283f;color:#fff;border:2px solid #1a1126;font:11px/1 Pix,monospace;font-style:normal;animation:blink 1s infinite}
html.touch-device #chat-preview{z-index:45;max-width:min(300px,60vw)}
html.touch-device #chat-preview .cp-line{font-size:12px;line-height:15px;padding:3px 7px}