.ark-return-gate {
  position: fixed;
  top: max(16px, env(safe-area-inset-top));
  left: max(16px, env(safe-area-inset-left));
  z-index: 2147483000;
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  color: #f2d995;
  background:
    radial-gradient(circle at 50% 42%, rgba(247, 220, 151, .12), transparent 48%),
    linear-gradient(145deg, rgba(31, 24, 12, .96), rgba(3, 3, 2, .94));
  border: 1px solid rgba(236, 207, 132, .62);
  border-radius: 2px;
  clip-path: polygon(28% 0, 72% 0, 100% 28%, 100% 72%, 72% 100%, 28% 100%, 0 72%, 0 28%);
  box-shadow:
    inset 0 0 0 3px rgba(3, 3, 2, .78),
    inset 0 0 0 4px rgba(236, 207, 132, .22),
    0 0 18px rgba(217, 173, 62, .15);
  opacity: .78;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  backdrop-filter: blur(4px);
  transition: opacity 160ms ease, color 160ms ease, filter 160ms ease, box-shadow 160ms ease;
}

.ark-return-gate::before,
.ark-return-gate::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.ark-return-gate::before {
  inset: 7px;
  border: 1px solid rgba(236, 207, 132, .2);
  transform: rotate(45deg);
}

.ark-return-gate::after {
  inset: 3px;
  border-top: 1px solid rgba(255, 236, 177, .25);
  border-bottom: 1px solid rgba(117, 79, 20, .34);
}

.ark-return-gate svg {
  position: relative;
  z-index: 1;
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.45;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 4px rgba(242, 217, 149, .34));
}

.ark-return-gate:hover,
.ark-return-gate:focus-visible {
  color: #ffe9ad;
  opacity: 1;
  filter: brightness(1.1);
  box-shadow:
    inset 0 0 0 3px rgba(3, 3, 2, .78),
    inset 0 0 0 4px rgba(255, 229, 160, .38),
    0 0 22px rgba(217, 173, 62, .28);
  outline: 2px solid rgba(255, 232, 172, .78);
  outline-offset: 4px;
}

.ark-return-gate:active {
  filter: brightness(.92);
}

.ark-return-gate__label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 600px) {
  .ark-return-gate {
    top: max(12px, env(safe-area-inset-top));
    left: max(12px, env(safe-area-inset-left));
    width: 44px;
    height: 44px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ark-return-gate { transition: none; }
}
