.skip-link{
  position:fixed;
  top:10px;
  left:10px;
  z-index:1000;
  max-width:calc(100vw - 20px);
  padding:11px 16px;
  border:2px solid #7ed7ff;
  border-radius:10px;
  background:#06101b;
  color:#fff;
  font-weight:850;
  box-shadow:0 8px 26px #0009;
  transform:translateY(-180%);
  transition:transform .16s ease;
}
.skip-link:focus{
  transform:translateY(0);
  outline:3px solid #f4b82d;
  outline-offset:3px;
}
:where(button,input[type="button"],input[type="submit"],input[type="reset"],summary,[role="button"]){
  min-inline-size:24px;
  min-block-size:24px;
}
:where(main,section,article,aside,nav,form,fieldset,div){min-inline-size:0}
:where(img,svg,video,canvas,iframe){max-inline-size:100%}
main[tabindex="-1"]:focus{outline:none}
.mobile-nav summary:focus-visible{outline:3px solid #7ed7ff;outline-offset:4px}
@media(max-width:360px){
  body{overflow-wrap:anywhere}
  input,select,textarea,button{max-inline-size:100%}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}
@media(forced-colors:active){
  .skip-link{border:2px solid ButtonText}
  :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid Highlight}
}