/* ══ THE FACTORY CREDIT ══
   One small dark pill just under the last line of the footer, aligned the
   way the footer is aligned (centered by default; .uf-left / .uf-right on
   the row for a footer that sits left or right), and set about three points
   smaller than the footer's own type. "a lever in" links to the sites page; the wordmark links to the
   gate. Self-contained: its own fonts, its own colors, nothing inherited, so
   it reads as a stamp from somewhere else on paper, moss or navy alike.

   Drop-in for a site outside unicornfactory.dev:
     <link rel="stylesheet" href="https://unicornfactory.dev/assets/uf-credit.css">
     <div class="uf-credit-row"><span class="uf-credit"><span class="uf-dot"></span>
       <a class="uf-k" href="https://unicornfactory.dev/sites/">a lever in</a>
       <a class="uf-wm" href="https://unicornfactory.dev/">The Unicorn Factory</a></span></div>
   On phones (under 720px) the kicker hides itself and the mark stands alone;
   where the kicker never fits, drop the .uf-k link and keep the mark. */
@import url("https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Source+Code+Pro:wght@400;600&display=swap");
.uf-credit-row{display:flex;justify-content:center;padding:6px 16px 22px;width:100%;box-sizing:border-box}
.uf-credit-row.uf-left{justify-content:flex-start}
.uf-credit-row.uf-right{justify-content:flex-end}
.uf-credit{display:inline-flex;align-items:center;gap:7px;padding:4px 10px 4px 8px;border-radius:999px;border:1px solid transparent;
  background:linear-gradient(#120826,#120826) padding-box,linear-gradient(102deg,#FF3D9A,#B36BFF 26%,#35E4F4 52%,#7CFFB2 74%,#FFC94D) border-box;
  box-shadow:0 6px 18px rgba(0,0,0,.35),0 0 0 3px rgba(14,7,32,.45);white-space:nowrap;line-height:1;
  transition:box-shadow 160ms}
.uf-credit:hover{box-shadow:0 6px 18px rgba(0,0,0,.35),0 0 0 3px rgba(14,7,32,.45),0 0 22px rgba(255,61,154,.22)}
.uf-dot{width:5px;height:5px;border-radius:50%;flex:none;background:radial-gradient(circle at 34% 30%,#FFEDBE,#D69A22 70%,#6B4A0E);box-shadow:0 0 8px rgba(255,201,77,.45)}
.uf-k{font-family:"Source Code Pro",ui-monospace,monospace;font-size:7px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:#9C8CB4;text-decoration:none;transition:color 120ms}
.uf-k:hover{color:#FFC94D}
.uf-wm{font-family:"Abril Fatface",Georgia,serif;font-weight:400;font-size:10.5px;letter-spacing:-.02em;padding-bottom:1px;text-decoration:none;
  background-image:linear-gradient(102deg,#FFC94D 0%,#FF3D9A 10%,#B36BFF 20%,#35E4F4 30%,#7CFFB2 40%,#FFC94D 50%,#FF3D9A 60%,#B36BFF 70%,#35E4F4 80%,#7CFFB2 90%,#FFC94D 100%);
  background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:uf-credit-sf 6.5s linear infinite}
@keyframes uf-credit-sf{from{background-position:0 0}to{background-position:100% 0}}
@media(prefers-reduced-motion:reduce){.uf-wm{animation:none}}
.uf-credit a:focus-visible{outline:2px solid #FFC94D;outline-offset:3px;border-radius:3px}
@media(forced-colors:active){.uf-wm{background:none;-webkit-text-fill-color:CanvasText;color:CanvasText}}
/* phones: the mark alone */
@media(max-width:719px){.uf-k{display:none}.uf-credit{gap:6px;padding:4px 9px 4px 8px}}