/* free PK at the bosses (js/bosspk.js, 2026-10-19): the chip at the top and the note across the middle on stepping in.
   Crisp text, no soft glow round it. */
#bpk-chip { position: fixed; left: 50%; top: 108px; z-index: 870; transform: translate(-50%, -6px); opacity: 0; pointer-events: none;
  display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 5px 18px 6px; border-radius: 14px;
  background: rgba(46, 8, 6, 0.9); border: 2px solid #ff5a44; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.35);
  transition: opacity 0.25s, transform 0.25s; font-family: Mali, sans-serif; text-align: center; max-width: calc(100vw - 32px); }
#bpk-chip.on { opacity: 1; transform: translate(-50%, 0); }
#bpk-chip b { font-weight: 800; font-size: 16px; color: #ffd9d2; letter-spacing: 0.01em; white-space: nowrap; }
#bpk-chip small { font-weight: 600; font-size: 12px; color: #ffb4a6; }
#bpk-chip.in { animation: bpk-pulse 1.6s ease-in-out infinite; }
#bpk-chip.near { background: rgba(48, 34, 4, 0.9); border-color: #ffc23a; }
#bpk-chip.near b { color: #ffe9a8; }
#bpk-chip.near small { color: #f5d483; }
@keyframes bpk-pulse { 0%, 100% { border-color: #ff5a44; } 50% { border-color: #ffb0a2; } }

#bpk-note { position: fixed; left: 50%; top: 30%; z-index: 871; transform: translate(-50%, -50%) scale(0.92); opacity: 0; pointer-events: none;
  display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 34px 16px; border-radius: 18px;
  background: linear-gradient(180deg, rgba(70, 10, 8, 0.92), rgba(36, 4, 4, 0.92)); border: 2px solid #ff5a44;
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.45); font-family: Mali, sans-serif; text-align: center; max-width: calc(100vw - 32px);
  transition: opacity 0.3s, transform 0.3s; }
#bpk-note.on { opacity: 1; transform: translate(-50%, -50%) scale(1); }
#bpk-note b { font-weight: 800; font-size: 30px; color: #fff0ec; -webkit-text-stroke: 1px #5a0a04; paint-order: stroke fill; }
#bpk-note small { font-weight: 600; font-size: 14px; color: #ffc4b8; }
@media (max-width: 640px) { #bpk-chip { top: 92px; } #bpk-chip b { font-size: 14px; } #bpk-note b { font-size: 22px; } }

/* the map tag "⚔ PK อิสระที่บอส" (ป่าพิษ and up, data.js FREE_PK): the world map's card chip and pin, the map screen's rows */
#wmap .wm3-chips i.pk { background: #5a0e08; color: #ffe2dc; box-shadow: inset 0 0 0 1px #ff5a44; }
#wmap .wm3-nm small em.wm3-pk { font-style: normal; font-weight: 800; color: #ff7a6a; }
#lmap .lm-mrow .nm small em.pk { font-weight: 700; color: #ff8a7a; }

/* the map screen (js/localmap.js, 2026-10-19): the safe ground green, each boss's free-PK ring red (solid = its boss is out
   now, dashed = its spot: free PK there while the boss is out), and the one key line under the map's name */
#lmap .lm-pkz { position: absolute; inset: 0; pointer-events: none; }
#lmap .lm-pkz i { position: absolute; display: block; box-sizing: border-box; }
#lmap .lm-safe { border-radius: 14px; background: rgba(70, 220, 110, 0.14); border: 2px dashed rgba(120, 255, 150, 0.9); }
#lmap .lm-pkr { transform: translate(-50%, -50%); border-radius: 50%; background: rgba(150, 10, 4, 0.12); border: 2px dashed rgba(255, 90, 68, 0.85); }
#lmap .lm-pkr.live { background: rgba(255, 46, 30, 0.2); border: 3px solid #ff4a36; }
#lmap .lm-mapname em.lm-key { margin-top: 2px; font: 600 12.5px/1.35 Mali, sans-serif; font-style: normal; }
#lmap .lm-mapname em.lm-key.pk { color: #ff9a88; }
#lmap .lm-mapname em.lm-key.safe { color: #8ee8a0; }

/* the world map (js/worldmap3.js): the card's one line, the legend's key */
#wmap .wm3-pkline { margin: 0; font: 700 12.5px/1.4 Mali, sans-serif; color: #a3241a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#wmap .wm3-pkline.safe { color: #2c6e2a; }
#wmap .wm3-legend .k-pk { padding: 0 6px; border-radius: 7px; background: #5a0e08; color: #ffe2dc; box-shadow: inset 0 0 0 1px #ff5a44; font: 700 10.5px/1.5 'Mali', sans-serif; font-style: normal; }
