/* HOME only. Visible artwork: 80px desktop / 50px mobile. */
.hana-walk {
  --hana-height: 80px;
  --hana-gap: 4px;
  position: fixed;
  left: 0;
  bottom: calc(var(--hana-clearance, 0px) + var(--hana-gap));
  width: calc(var(--hana-height) * 1.28);
  height: var(--hana-height);
  z-index: 54;
  /* hana-link-20260916 : the cat links to her own page, so she takes pointer events.
     The lane around her stays none, so nothing else on the page is blocked. */
  pointer-events: auto;
  cursor: pointer;
  user-select: none;
  visibility: hidden;
  contain: layout style;
}
.hana-walk.is-ready { visibility: visible; }
.hana-walk__direction { width: 100%; height: 100%; }
.hana-walk__frame {
  display: block;
  width: 100%;
  height: 100%;
  background: url('./hana/hana-walk.png') 0 0 / 800% 100% no-repeat;
}
@media (max-width: 768px) {
  .hana-walk { --hana-height: 50px; }
}

/* Clip the one-way exit to the viewport without creating horizontal scrolling. */
.hana-walk-lane{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:54}
.hana-walk-lane .hana-walk{position:absolute}