@charset "UTF-8";

.hyperInfoIconDefinition{
  display:none
}
.hyperInfoLogoClippath{
  position:absolute
}
.hyperInfoArea{
  display:none
}
.hyperInfoArea.isInit{
  display:block
}
.hyperInfoArea.isInit.isMobile:not(.isNoItem):after{
  content:"";
  display:block;
  width:100%;
  height:12px;
  margin:16px 0 0;
  background:linear-gradient(0deg,#00000026,#0000000d,#00000026)
}
.hyperInfoHeader{
  margin:0 0 8px
}
.hyperInfoHeaderLink{
  display:flex;
  justify-content:flex-start;
  align-items:center;
  padding:0 0 0 16px;
  color:#bf0000;
  font-weight:700;
  text-decoration:none
}
.hyperInfoHeaderTitle{
  flex:1 0 auto;
  display:flex;
  justify-content:flex-start;
  align-items:flex-end
}
.hyperInfoLogo{
  position:relative;
  background-color:#bf0000;
  height:auto;
  overflow:hidden;
  color:#bf0000
}
.anniversary13Logo{
  clip-path:url(#anniversary13Logo);
  aspect-ratio:182 / 16;
  width:182px;
  margin-right: 4px;
}
.hyperInfoLogo::selection{
  background-color:#bf0000;
  color:#bf0000
}
.hyperInfoLogo:after{
  content:"";
  position:absolute;
  left:0;
  bottom:50%;
  width:50px;
  height:100%;
  transform:translateY(50%);
  background:radial-gradient(circle,#fff,#fff0);
  opacity:.6;
  animation:hyperInfoLogoShine 4s ease infinite normal both
}
@keyframes hyperInfoLogoShine{
  0%{
    transform:translate(-100%,50%)
  }
  50%{
    transform:translate(200px,50%)
  }
  to{
    transform:translate(200px,50%)
  }
}
.hyperInfoLogo svg{
  display:block
}
.hyperInfoHeaderText{
  font-size:12px;
  line-height:1;
  color:#bf0000
}
.hyperInfoHeaderArrow{
  margin:12px;
  fill:#bf0000
}
.hyperInfoList{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
  margin:auto 16px;
  padding:0;
  list-style:none
}
.hyperInfoListItem{
  background-color:inherit;
  overflow:hidden
}
.hyperInfoListLink{
  display:flex;
  justify-content:flex-start;
  align-items:center;
  border:1px solid #333;
  border-radius:4px;
  color:#333;
  font-weight:400;
  text-decoration:none;
  min-width:0
}
.hyperInfoListIcon{
  flex:0 0 24px;
  fill:#bf0000;
  height:24px;
  margin:12px
}
.hyperInfoListText{
  flex:1 1 auto;
  color:#333;
  font-size:14px;
  line-height:20px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis
}
.hyperInfoListArrow{
  flex:0 0 20px;
  fill:#333;
  height:20px;
  margin:14px
}
.logo{
  height:6em;
  padding:1.5em;
  will-change:filter;
  transition:filter .3s
}
.logo:hover{
  filter:drop-shadow(0 0 2em #646cffaa)
}
.logo.svelte:hover{
  filter:drop-shadow(0 0 2em #ff3e00aa)
}
.read-the-docs{
  color:#888
}