.clear-screen {
  position:fixed;
  inset:0;
  z-index:10000;
  overflow:hidden;
  background:#090b08;
}
.clear-screen-art {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  user-select:none;
  -webkit-user-select:none;
  -webkit-user-drag:none;
}
.clear-restart-button {
  position:absolute;
  right:3%;
  bottom:4%;
  min-width:150px;
  min-height:54px;
  padding:0 24px;
  border:2px solid #f0c96a;
  border-radius:15px;
  background:rgba(20,17,12,.84);
  color:#fff2ca;
  font-size:18px;
  font-weight:900;
  letter-spacing:.08em;
  box-shadow:0 8px 24px rgba(0,0,0,.5);
  cursor:pointer;
  backdrop-filter:blur(4px);
  -webkit-tap-highlight-color:transparent;
}
.clear-restart-button:active { transform:scale(.97); }
.clear-restart-button:focus-visible { outline:4px solid #fff; outline-offset:3px; }
@media (orientation:portrait) {
  .clear-screen-art { object-fit:contain; }
  .clear-restart-button {
    right:50%;
    bottom:calc((100vh - min(100vw * .5625, 100vh)) / 2 + 2%);
    transform:translateX(50%);
  }
  .clear-restart-button:active { transform:translateX(50%) scale(.97); }
}