/* Chrome preservation enhancement: bigger modern presentation without redesigning the old pages. */
html.hr-modern-upres body {
  image-rendering: auto;
  background-repeat: repeat-x;
  background-position: left top;
  background-size: auto;
  background-attachment: scroll;
}

html.hr-modern-upres body[background="images/water_tile.jpg"] {
  background-size: 417px 2400px;
}

html.hr-modern-upres body[background="images/rain_tile.jpg"] {
  background-size: 300px 1800px;
}

html.hr-modern-upres body[background="images/jail_tile.jpg"] {
  background-size: 450px 1800px;
}

html.hr-modern-upres body[background="images/ripple_tile.jpg"] {
  background-size: 674px 1800px;
}

html.hr-modern-upres body[background="images/tile.jpg"] {
  background-size: 38px 1200px;
}

html.hr-modern-upres body {
  font-size: 18px;
}

html.hr-modern-upres font[size="3"] {
  font-size: 18px;
  line-height: 1.45;
}

html.hr-modern-upres font[size="4"] {
  font-size: 22px;
}

html.hr-modern-upres body > table:first-of-type > tbody > tr > td:first-child:has(> font[size="3"]) {
  box-sizing: border-box;
  padding: clamp(20px, 2.4vw, 30px) clamp(20px, 2.8vw, 36px) 22px;
}

html.hr-modern-upres img[width="100"][height="66"] {
  width: 150px;
  height: 99px;
}

html.hr-modern-upres td[width="150"] {
  width: 190px;
}

html.hr-modern-upres img[width="67"][height="135"] {
  width: 101px;
  height: 203px;
}

html.hr-modern-upres td[width="67"] {
  width: 105px;
}

html.hr-modern-upres img[width="106"][height="280"] {
  width: 159px;
  height: 420px;
}

html.hr-modern-upres img[width="120"][height="396"] {
  width: 180px;
  height: 594px;
}

html.hr-modern-upres img[width="54"][height="223"] {
  width: 81px;
  height: 335px;
}

html.hr-modern-upres img[width="113"][height="32"] {
  width: 170px;
  height: 48px;
}

html.hr-modern-upres img[width="150"][height="40"] {
  width: 180px;
  height: 48px;
}

html.hr-entry-upres body {
  font-size: 18px;
  background-repeat: repeat-x;
  background-attachment: scroll;
  background-size: 105px 1479px;
  background-position: calc(50% - 270px) 0;
}

html.hr-entry-upres img[src="images/names.gif"] {
  width: 638px;
  height: 44px;
}

html.hr-entry-upres img[src="images/keyart.jpg"] {
  width: 536px;
  height: 554px;
}

html.hr-entry-upres img[src="images/enter_sh.gif"] {
  width: 144px;
  height: 33px;
}

html.hr-entry-upres img[src="images/enter_nonsh.gif"] {
  width: 186px;
  height: 33px;
}

html.hr-entry-upres img[src="images/hrlogo.gif"] {
  width: 336px;
  height: 93px;
}

html.hr-entry-upres img[src="images/1_16_98.gif"] {
  width: 236px;
  height: 120px;
}

html.hr-entry-upres table[width="424"] {
  width: 650px;
}

.hr-rain-canvas {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  z-index: 9998;
  pointer-events: none;
  opacity: .68;
  mix-blend-mode: screen;
}

.hr-lightning-flash {
  position: fixed;
  inset: 0;
  z-index: 9997;
  pointer-events: none;
}

.hr-lightning-flash.is-active {
  animation: hr-lightning .42s ease-out;
}

@keyframes hr-lightning {
  0%, 100% { background: rgba(255,255,255,0); }
  8% { background: rgba(210,235,255,.46); }
  18% { background: rgba(255,255,255,.08); }
  31% { background: rgba(210,235,255,.32); }
}

.hr-sound-toggle {
  position: fixed;
  left: 10px;
  bottom: 10px;
  z-index: 10000;
  border: 1px solid #009c9c;
  background: #000;
  color: #fff;
  font: bold 11px Arial, Helvetica, sans-serif;
  letter-spacing: 0;
  padding: 5px 7px;
  cursor: pointer;
}

.hr-sound-toggle:hover {
  color: #009c9c;
}

.hr-lightbox {
  position: fixed;
  inset: 0;
  z-index: 10020;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.86);
}

.hr-lightbox.is-open {
  display: flex;
}

.hr-lightbox-frame {
  max-width: calc(100vw - 72px);
  max-height: calc(100vh - 72px);
  border: 1px solid #009c9c;
  background: #000;
  box-shadow: 0 0 28px rgba(0,156,156,.45);
}

.hr-lightbox-frame img {
  display: block;
  max-width: calc(100vw - 76px);
  max-height: calc(100vh - 76px);
  width: auto;
  height: auto;
}

.hr-lightbox-close {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 10021;
  border: 1px solid #009c9c;
  background: #000;
  color: #fff;
  font: bold 14px Arial, Helvetica, sans-serif;
  padding: 5px 9px;
  cursor: pointer;
}

.hr-lightbox-close:hover,
.hr-lightbox-close:focus {
  color: #009c9c;
}

html.hr-shocked body {
  cursor: crosshair;
}

video {
  background: #000;
}
