/* Thors chrome wordmark: layer stacking + motion. Generated by gen.py, do not edit.
   Same turn as thors-mark-animated.svg / thors-wordmark-animated*.svg. Keep this file next to the SVGs
   (the masks are relative URLs, and CSS masks need the SVGs on the same origin).

   <div class="thors-chrome" role="img" aria-label="Thors">
     <div class="thors-chrome-letters"></div>
     <div class="thors-chrome-o thors-orbit">     motion class: see below
       <div class="thors-chrome-ring"><div class="thors-chrome-fill"></div></div>
       <img src="satellite-layer.svg" alt="">
     </div>
   </div>

   Set only the width of .thors-chrome. Chrome = --thors-chrome (any background: gradient,
   image). Add class thors-on-dark on the dark section (wider light-on-dark gap). The ring layer
   and the satellite turn together on one element, about the ring centre (50.109% 50% of the
   527.35 x 102.5 layer box).

   Motion: put ONE of these on .thors-chrome-o (none = a still logo):
     thors-orbit        one turn, then a long rest (16s loop)
     thors-orbit-once   one turn .3s after load, then still
     thors-orbit-hover  one turn when the logo is hovered, or keyboard-focused (:focus-visible on
                        .thors-chrome or on its parent, e.g. the home link). Pure CSS: if the
                        pointer leaves mid-turn the O returns home at once; for a turn that always
                        finishes, use thors-orbit-play from mouseenter / focus instead.
     thors-orbit-play   one turn each time a script adds the class. To replay, remove it, force a
                        reflow, add it again:
                          o.classList.remove('thors-orbit-play'); void o.offsetWidth;
                          o.classList.add('thors-orbit-play');
                        (or remove it on 'animationend' and add it when needed).
   prefers-reduced-motion: reduce stops all of them. */
.thors-chrome{position:relative;aspect-ratio:527.35/102.5;overflow-x:clip}
.thors-chrome *{position:absolute;inset:0;width:100%;height:100%;transform-origin:50.109% 50%}
.thors-chrome-letters,.thors-chrome-fill{background:var(--thors-chrome,#0d0f12)}
.thors-chrome-letters{-webkit-mask:url(wordmark-mask-letters.svg) 0 0/100% 100% no-repeat;mask:url(wordmark-mask-letters.svg) 0 0/100% 100% no-repeat}
.thors-chrome-ring{-webkit-mask:url(wordmark-mask-ring.svg) 0 0/100% 100% no-repeat;mask:url(wordmark-mask-ring.svg) 0 0/100% 100% no-repeat}
.thors-on-dark .thors-chrome-ring{-webkit-mask:url(wordmark-mask-ring-light.svg) 0 0/100% 100% no-repeat;mask:url(wordmark-mask-ring-light.svg) 0 0/100% 100% no-repeat}
.thors-orbit{animation:thors-orbit 16s linear infinite}
.thors-orbit .thors-chrome-fill{animation:thors-orbit-still 16s linear infinite}
.thors-orbit-once{animation:thors-orbit-once 3.584s linear .3s 1 both}
.thors-orbit-once .thors-chrome-fill{animation:thors-orbit-still-once 3.584s linear .3s 1 both}
@keyframes thors-orbit{0%,6.25%{transform:rotate(0deg);animation-timing-function:cubic-bezier(.42,0,.8,.291)}10.125%{transform:rotate(42deg);animation-timing-function:linear}14.812%{transform:rotate(222deg);animation-timing-function:cubic-bezier(.22,.674,.5,1)}26.025%{transform:rotate(362.5deg);animation-timing-function:cubic-bezier(.4,0,.3,1)}28.65%,100%{transform:rotate(360deg)}}
@keyframes thors-orbit-still{0%,6.25%{transform:rotate(0deg);animation-timing-function:cubic-bezier(.42,0,.8,.291)}10.125%{transform:rotate(-42deg);animation-timing-function:linear}14.812%{transform:rotate(-222deg);animation-timing-function:cubic-bezier(.22,.674,.5,1)}26.025%{transform:rotate(-362.5deg);animation-timing-function:cubic-bezier(.4,0,.3,1)}28.65%,100%{transform:rotate(-360deg)}}
@keyframes thors-orbit-once{0%{transform:rotate(0deg);animation-timing-function:cubic-bezier(.42,0,.8,.291)}17.299%{transform:rotate(42deg);animation-timing-function:linear}38.225%{transform:rotate(222deg);animation-timing-function:cubic-bezier(.22,.674,.5,1)}88.281%{transform:rotate(362.5deg);animation-timing-function:cubic-bezier(.4,0,.3,1)}100%{transform:rotate(360deg)}}
@keyframes thors-orbit-still-once{0%{transform:rotate(0deg);animation-timing-function:cubic-bezier(.42,0,.8,.291)}17.299%{transform:rotate(-42deg);animation-timing-function:linear}38.225%{transform:rotate(-222deg);animation-timing-function:cubic-bezier(.22,.674,.5,1)}88.281%{transform:rotate(-362.5deg);animation-timing-function:cubic-bezier(.4,0,.3,1)}100%{transform:rotate(-360deg)}}
.thors-chrome:hover .thors-orbit-hover,.thors-chrome:focus-visible .thors-orbit-hover,:focus-visible>.thors-chrome .thors-orbit-hover{animation:thors-orbit-hover 3.584s linear 0s 1 both}
.thors-chrome:hover .thors-orbit-hover .thors-chrome-fill,.thors-chrome:focus-visible .thors-orbit-hover .thors-chrome-fill,:focus-visible>.thors-chrome .thors-orbit-hover .thors-chrome-fill{animation:thors-orbit-still-hover 3.584s linear 0s 1 both}
.thors-orbit-play{animation:thors-orbit-play 3.584s linear 0s 1 both}
.thors-orbit-play .thors-chrome-fill{animation:thors-orbit-still-play 3.584s linear 0s 1 both}
@keyframes thors-orbit-hover{0%{transform:rotate(0deg);animation-timing-function:cubic-bezier(.42,0,.8,.291)}17.299%{transform:rotate(42deg);animation-timing-function:linear}38.225%{transform:rotate(222deg);animation-timing-function:cubic-bezier(.22,.674,.5,1)}88.281%{transform:rotate(362.5deg);animation-timing-function:cubic-bezier(.4,0,.3,1)}100%{transform:rotate(360deg)}}
@keyframes thors-orbit-still-hover{0%{transform:rotate(0deg);animation-timing-function:cubic-bezier(.42,0,.8,.291)}17.299%{transform:rotate(-42deg);animation-timing-function:linear}38.225%{transform:rotate(-222deg);animation-timing-function:cubic-bezier(.22,.674,.5,1)}88.281%{transform:rotate(-362.5deg);animation-timing-function:cubic-bezier(.4,0,.3,1)}100%{transform:rotate(-360deg)}}
@keyframes thors-orbit-play{0%{transform:rotate(0deg);animation-timing-function:cubic-bezier(.42,0,.8,.291)}17.299%{transform:rotate(42deg);animation-timing-function:linear}38.225%{transform:rotate(222deg);animation-timing-function:cubic-bezier(.22,.674,.5,1)}88.281%{transform:rotate(362.5deg);animation-timing-function:cubic-bezier(.4,0,.3,1)}100%{transform:rotate(360deg)}}
@keyframes thors-orbit-still-play{0%{transform:rotate(0deg);animation-timing-function:cubic-bezier(.42,0,.8,.291)}17.299%{transform:rotate(-42deg);animation-timing-function:linear}38.225%{transform:rotate(-222deg);animation-timing-function:cubic-bezier(.22,.674,.5,1)}88.281%{transform:rotate(-362.5deg);animation-timing-function:cubic-bezier(.4,0,.3,1)}100%{transform:rotate(-360deg)}}
@media (prefers-reduced-motion:reduce){.thors-chrome *{animation:none!important}}