:root {
  --up-app-sticker-acid: #C4F236;
  --up-app-sticker-ink: #0D0D0D;
  --up-app-sticker-diecut: #F7F6EF;
}

/* Die-cut App Store seal. Geometry and lettering live in the inline SVG
   (web/index.html and scripts/promote-landing.mjs carry identical markup);
   this file paints, places, and animates it. Default slot is the
   bottom-left corner, which suits the static docs (articles, guides,
   policies); the SPA overrides placement in src/index.css to clear its
   floating BottomNav and Home hero. */
.up-get-app-sticker {
  position: fixed;
  left: -0.45rem;
  bottom: 1.1rem;
  z-index: 1400;
  display: block;
  width: clamp(6.75rem, 8.5vw, 8.25rem);
  font-family: "Archivo", "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-decoration: none !important;
  transform: rotate(-8deg);
  filter: drop-shadow(0 1px 1.5px rgba(13, 13, 13, 0.22)) drop-shadow(0 10px 22px rgba(13, 13, 13, 0.26));
  transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1), filter 180ms ease;
}

.up-get-app-sticker svg {
  display: block;
  width: 100%;
  height: auto;
}

.up-get-app-sticker__diecut {
  fill: var(--up-app-sticker-diecut);
}

.up-get-app-sticker__face {
  fill: var(--up-app-sticker-acid);
  stroke: var(--up-app-sticker-ink);
  stroke-width: 1.5;
}

.up-get-app-sticker__ring {
  fill: none;
  stroke: var(--up-app-sticker-ink);
  stroke-width: 1.4;
}

.up-get-app-sticker__dot {
  fill: var(--up-app-sticker-ink);
}

.up-get-app-sticker__arc,
.up-get-app-sticker__kicker,
.up-get-app-sticker__app {
  fill: var(--up-app-sticker-ink);
}

.up-get-app-sticker__arc {
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 1.2px;
}

.up-get-app-sticker__kicker {
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: 0.5px;
}

.up-get-app-sticker__app {
  font-size: 25.5px;
  font-weight: 900;
}

.up-get-app-sticker:hover {
  transform: rotate(-2deg) scale(1.06);
  filter: drop-shadow(0 2px 2px rgba(13, 13, 13, 0.2)) drop-shadow(0 14px 28px rgba(13, 13, 13, 0.3));
}

.up-get-app-sticker:active {
  transform: rotate(-9deg) scale(0.96);
  filter: drop-shadow(0 1px 1px rgba(13, 13, 13, 0.24)) drop-shadow(0 6px 14px rgba(13, 13, 13, 0.26));
}

.up-get-app-sticker:focus-visible {
  outline: 3px solid var(--up-app-sticker-ink);
  outline-offset: 4px;
  border-radius: 50%;
}

@media (max-width: 680px) {
  .up-get-app-sticker {
    left: -0.4rem;
    bottom: 1rem;
    width: 6.1rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .up-get-app-sticker {
    transition: none;
  }
}
