.ra-poster-dialog {
  box-sizing: border-box;
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 56px 16px 16px;
  border: 0;
  background: transparent;
  overflow: auto;
}
.ra-poster-dialog[open] { display: grid; place-items: center; }
.ra-poster-dialog::backdrop { background: rgb(0 0 0 / .72); }
.ra-poster-close {
  position: absolute;
  top: max(8px, env(safe-area-inset-top));
  right: max(12px, env(safe-area-inset-right));
  width: 44px;
  height: 44px;
  padding: 0;
  background: #132637;
  color: white;
  border: 1px solid #fff7;
  border-radius: 50%;
  font: 30px/1 system-ui, sans-serif;
  cursor: pointer;
}
.ra-poster-hit { display: block; padding: 0; border: 0; background: none; cursor: pointer; }
.ra-poster-hit img { display: block; width: auto; height: auto; max-width: min(760px, calc(100vw - 32px)); max-height: min(80dvh, calc(100dvh - 72px)); object-fit: contain; }
.ra-poster-dialog :is(a,button):focus-visible { outline: 3px solid #fbbc06; outline-offset: 4px; }
@media(max-width:640px) {
  .ra-poster-dialog { align-items: end; padding-bottom: max(12px, env(safe-area-inset-bottom)); }
  .ra-poster-hit img { max-height: 30dvh; }
}