:root{
  --design-w:1672;
  --design-h:941;
  --bg:#010914;
}
*{box-sizing:border-box}
html,body{
  margin:0;
  padding:0;
  min-height:100%;
  background:var(--bg);
}
body{
  overflow-x:hidden;
  font-family:Arial,Helvetica,sans-serif;
}
.pixel-page{
  width:100%;
  min-height:100vh;
  background:#010914;
  display:flex;
  justify-content:center;
  align-items:flex-start;
}
.pixel-stage{
  position:relative;
  width:100vw;
  max-width:1672px;
  aspect-ratio:1672/941;
  flex:0 0 auto;
  overflow:hidden;
  background:#010914;
}
.pixel-stage>img.pixel-background{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:fill;
  user-select:none;
  pointer-events:none;
  -webkit-user-drag:none;
}
.hotspot{
  position:absolute;
  display:block;
  z-index:10;
  border:0;
  background:transparent;
  color:transparent;
  text-indent:-9999px;
  overflow:hidden;
  cursor:pointer;
  border-radius:8px;
  outline:none;
}
.hotspot:focus-visible{
  box-shadow:0 0 0 2px rgba(255,215,115,.9),0 0 0 5px rgba(8,22,39,.72);
}
.hotspot-card{
  border-radius:14px;
}
.hotspot[aria-disabled="true"]{
  cursor:default;
  pointer-events:none;
}
.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
@media(min-width:1673px){
  .pixel-stage{
    margin-left:auto;
    margin-right:auto;
  }
}