/* Load in HTML top, before deferred JavaScript, to prevent profile layout flash. */
html body #pun-profile #viewprofile > .container > ul,
html body #pun-profile #viewprofile .rv-profile-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 230px) minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: start !important;
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
html body #pun-profile #viewprofile .rv-profile-grid {
  grid-column: 1 / -1 !important;
}
html body #pun-profile #viewprofile #profile-left,
html body #pun-profile #viewprofile #profile-right {
  float: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
html body #pun-profile #viewprofile #profile-left { grid-column: 1 !important; }
html body #pun-profile #viewprofile #profile-right { grid-column: 2 !important; }
/* Put the existing award counter where it can be found immediately. */
html body #pun-profile #viewprofile #profile-right > #pa-awards {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  order: -1 !important;
  grid-column: 1 / -1 !important;
  min-height: 42px;
  align-items: center;
}
html body #pun-profile #viewprofile #pa-avatar img {
  display: block;
  max-width: 100%;
  height: auto;
}
html body #pun-profile #viewprofile :is(#pa-fld4,.pa-fld4) .plashka {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
}
@media (max-width: 650px) {
  html body #pun-profile #viewprofile > .container > ul,
  html body #pun-profile #viewprofile .rv-profile-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  html body #pun-profile #viewprofile #profile-left,
  html body #pun-profile #viewprofile #profile-right { grid-column: 1 !important; }
}

/* Struck images are blurred, but never crossed by a line. Hover reveals them. */
html body #pun .post-content :is(del,s,strike,.bbstrike,span[style*="line-through"]) {
  text-decoration: none !important;
  color: transparent !important;
  text-shadow: 0 0 7px var(--rv-text,#57402e) !important;
  transition: text-shadow 180ms ease !important;
}
html body #pun .post-content :is(del,s,strike,.bbstrike,span[style*="line-through"]):is(:hover,:focus,:focus-within) {
  color: inherit !important;
  text-shadow: none !important;
}
html body #pun .post-content :is(del,s,strike,.bbstrike,span[style*="line-through"]):has(img) {
  text-decoration: none !important;
  text-shadow: 0 0 7px var(--rv-text,#57402e) !important;
  color: transparent !important;
  border: 0 !important;
  background-image: none !important;
}
html body #pun .post-content :is(del,s,strike,.bbstrike,span[style*="line-through"]):has(img):is(:hover,:focus,:focus-within) {
  color: inherit !important;
  text-shadow: none !important;
}
html body #pun .post-content :is(del,s,strike,.bbstrike,span[style*="line-through"]):has(img)::before,
html body #pun .post-content :is(del,s,strike,.bbstrike,span[style*="line-through"]):has(img)::after {
  content: none !important;
  display: none !important;
}
html body #pun .post-content :is(del,s,strike,.bbstrike,span[style*="line-through"]) img {
  filter: blur(11px) !important;
  transition: filter 180ms ease !important;
}
html body #pun .post-content :is(del,s,strike,.bbstrike,span[style*="line-through"]):is(:hover,:focus,:focus-within) img {
  filter: none !important;
}
@media (prefers-reduced-motion: reduce) {
  html body #pun .post-content :is(del,s,strike,.bbstrike,span[style*="line-through"]) img {
    transition: none !important;
  }
}
