.pk-win {
  position: fixed;
  left: 8px;
  top: 170px;
  z-index: 60;
  display: flex;
  flex-direction: column;
  width: 460px;
  height: 340px;
  min-width: 260px;
  min-height: 160px;
  max-width: calc(100vw - 8px);
  max-height: calc(100vh - 8px);
  overflow: hidden;
  resize: both;
  background: linear-gradient(165deg, #24282d 0%, #17191d 45%, #0f1114 100%);
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 0 0 1px #060708, 0 6px 18px rgba(0, 0, 0, 0.65);
  color: #cfd4d9;
  font-family: "IBM Plex Mono", ui-monospace, Consolas, monospace;
}

.pk-win[hidden] { display: none; }
.pk-win.dragging { opacity: 0.92; }

.pk-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px 6px 10px;
  border-bottom: 1px solid #1d242b;
  cursor: grab;
  user-select: none;
  touch-action: none;
}

.pk-win.dragging .pk-head { cursor: grabbing; }

.pk-title {
  font-family: var(--font);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text, #d7dee5);
}

.pk-sub { color: #5db8ff; font-size: 8pt; letter-spacing: 1px; }

.pk-status {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #5b656e;
  font-size: 7.5pt;
}

.pk-close {
  flex: none;
  width: 24px;
  height: 24px;
  min-height: 0;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 4px;
  background: none;
  color: #93a0ab;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}

.pk-close:hover { background: #7a2820; color: #fff; }

.pk-bar {
  display: flex;
  align-items: center;
  padding: 5px 10px;
  border-bottom: 1px solid #1d242b;
  color: #5b656e;
  font-size: 7.5pt;
  letter-spacing: 0.5px;
}

.pk-clr {
  margin-left: auto;
  min-height: 0;
  padding: 1px 8px;
  border: 0;
  border-radius: 3px;
  background: #10161b;
  box-shadow: 0 0 0 1px #1d242b;
  color: #93a0ab;
  font: inherit;
  cursor: pointer;
}

.pk-clr:hover { background: #1d5fae; color: #fff; }

.pk-list { flex: 1; min-height: 0; overflow-y: auto; padding: 2px 6px; }

.pk-empty { padding: 14px 4px; color: #5b656e; font-size: 8pt; font-style: italic; }

.pk-row { padding: 4px 4px 5px; border-bottom: 1px solid rgba(255, 255, 255, 0.04); font-size: 8pt; }
.pk-row:first-child { animation: pk-flash 1.2s ease-out; }

@keyframes pk-flash {
  from { background: rgba(93, 184, 255, 0.18); }
  to { background: transparent; }
}

.pk-top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 7px; }
.pk-time { color: #5b656e; }
.pk-src { color: #f2f5f7; font-weight: 600; }
.pk-arrow { color: #5b656e; }
.pk-dst { color: #5db8ff; }
.pk-path { color: #b89a3c; font-size: 7.5pt; overflow-wrap: anywhere; }
.pk-info { margin-top: 1px; color: #d9e6f2; white-space: pre-wrap; overflow-wrap: anywhere; }
.pk-detail { margin-top: 2px; color: #7f8a94; font-size: 7.5pt; white-space: pre-wrap; overflow-wrap: anywhere; }

.pk-foot { padding: 3px 10px; border-top: 1px solid #1d242b; color: #4a535b; font-size: 7pt; }

@media (max-width: 760px) {
  .pk-win { left: 4px !important; right: 4px; width: auto !important; top: 70px; height: 50vh; resize: vertical; }
}
.pk-map {
  margin-left: auto;
  min-height: 0;
  padding: 0 6px;
  border: 1px solid rgba(62, 166, 255, 0.5);
  border-radius: 3px;
  background: rgba(62, 166, 255, 0.12);
  color: #3ea6ff;
  font: inherit;
  font-size: 0.6rem;
  letter-spacing: 0.06em;
  cursor: pointer;
}

.pk-win a.pk-src { text-decoration: none; }
.pk-win a.pk-src:hover { text-decoration: underline; }
.hz-win .pk-title { color: #ffb347; }
