/* PokePark v79 — readable channel metadata, sticker rows and reliable Pokémon mentions. */

html .game-screen #chatPanel .chat-message.is-sticker-message .chat-message-body > p,
html .game-screen #chatPanel .chat-message-body > p:has(> .chat-sticker-row) {
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

html .game-screen #chatPanel .chat-sticker-row {
  display: flex !important;
  align-items: flex-end !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 5px 0 2px !important;
}

html .game-screen #chatPanel .chat-sticker-row .chat-inline-sticker {
  flex: 0 1 136px !important;
  display: grid !important;
  grid-template-rows: 86px auto !important;
  justify-items: center !important;
  width: 136px !important;
  min-width: 112px !important;
  max-width: 136px !important;
  margin: 0 !important;
  padding: 7px 8px 8px !important;
  border-radius: 16px !important;
}

html .game-screen #chatPanel .chat-sticker-row .chat-inline-sticker img {
  width: 86px !important;
  height: 86px !important;
}

html .game-screen #chatPanel .chat-sticker-row .chat-inline-sticker small {
  max-width: 100% !important;
  overflow: hidden !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html .game-screen #chatPanel .chat-pokemon-mention.is-pending {
  border-style: dashed !important;
}

html .game-screen #chatPanel .chat-pokemon-mention.is-pending b {
  color: var(--chat75-copy) !important;
}

html .game-screen #chatPanel .chat-message-meta {
  gap: 8px !important;
  min-height: 20px !important;
}

html .game-screen #chatPanel .chat-author-button,
html .game-screen #chatPanel .chat-message-meta > b {
  font-size: 12.5px !important;
}

html .game-screen #chatPanel .chat-message-meta time {
  font-size: 9.5px !important;
  font-weight: 650 !important;
}

html .game-screen #chatPanel .chat-channel-chip {
  min-height: 20px !important;
  padding: 0 7px !important;
  font-size: 8.5px !important;
  line-height: 20px !important;
  font-weight: 820 !important;
  letter-spacing: .005em !important;
}

html .game-screen #chatPanel .chat-message.is-location-message .chat-channel-chip.is-location,
html .game-screen #chatPanel .chat-message.is-trade-message .chat-channel-chip.is-trade {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 10%, transparent) !important;
}

html .game-screen #chatPanel .chat-message:not(.is-notice) .chat-message-body > p {
  font-size: 12.5px !important;
  line-height: 1.48 !important;
}

@media (max-width: 760px) {
  html .game-screen #chatPanel .chat-sticker-row {
    gap: 6px !important;
  }

  html .game-screen #chatPanel .chat-sticker-row .chat-inline-sticker {
    flex-basis: calc(50% - 3px) !important;
    grid-template-rows: 76px auto !important;
    width: calc(50% - 3px) !important;
    min-width: 96px !important;
    max-width: 128px !important;
    padding: 6px 7px 7px !important;
  }

  html .game-screen #chatPanel .chat-sticker-row .chat-inline-sticker img {
    width: 76px !important;
    height: 76px !important;
  }

  html .game-screen #chatPanel .chat-author-button,
  html .game-screen #chatPanel .chat-message-meta > b {
    font-size: 12px !important;
  }

  html .game-screen #chatPanel .chat-channel-chip {
    min-height: 19px !important;
    padding-inline: 6px !important;
    font-size: 8px !important;
    line-height: 19px !important;
  }

  html .game-screen #chatPanel .chat-message:not(.is-notice) .chat-message-body > p {
    font-size: 12px !important;
  }
}

