/* Radical Elements footer credit (re-sign-project skill), at the end of the
   copyright line. It inherits the footer's font and colour; on hover it
   fades like the footer's links. The footer's text is 8-10px, so the tile
   has a size of its own, the same in both languages. */
.re-credit {
  position: relative;
  display: inline-flex;
  align-items: center;
  /* After the line's trailing space: about one letter-space from the text. */
  margin-left: -4px;
  /* A 44px-tall hit area in the 50px footer, without changing the line's
     height (the negative margins take the padding back). */
  padding: 14px 6px;
  margin-top: -14px;
  margin-bottom: -14px;
  color: inherit;
  text-decoration: none;
  font: inherit;
  font-size: 9px;
  letter-spacing: 0.02em;
  text-transform: none;
  line-height: 1;
  /* Centred on the capitals (middle centres on the lower-case letters). */
  vertical-align: middle;
  top: -1px;
  touch-action: manipulation;
}
.re-credit__tile {
  display: inline-block;
  padding: 0.3em 0.5em;
  border: 1px solid currentColor;
  border-radius: 3px;
  transition: opacity 0.2s, transform 0.25s;
}
/* The wink, above the tile, starting at its left edge (the tile is near
   the left of the screen). */
.re-credit::after {
  content: attr(data-wink);
  position: absolute;
  left: 0;
  bottom: 100%;
  white-space: nowrap;
  padding: 0.6em 0.85em;
  border: 1px solid currentColor;
  border-radius: 4px;
  background: #fff;
  color: #000;
  font-size: 1.1em;
  letter-spacing: 0.02em;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 0.2s, transform 0.2s;
  pointer-events: none;
}
.re-credit:hover .re-credit__tile,
.re-credit:focus-visible .re-credit__tile {
  opacity: 0.5;
  transform: rotate(-6deg);
}
.re-credit:hover::after,
.re-credit:focus-visible::after {
  opacity: 1;
  transform: translateY(0);
}
.re-credit:focus-visible {
  outline: none;
}
.re-credit:focus-visible .re-credit__tile {
  opacity: 1;
  outline: 2px solid currentColor;
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  .re-credit__tile,
  .re-credit::after { transition: none; }
  .re-credit:hover .re-credit__tile,
  .re-credit:focus-visible .re-credit__tile { transform: none; }
  .re-credit::after,
  .re-credit:hover::after,
  .re-credit:focus-visible::after { transform: none; }
}

/* style.css floats every span of the copyright line and sets the Greek
   one's size; not the tile's. */
.policy-box .re-credit span {
  float: none;
  font-size: inherit;
}