.about { position: relative; scroll-margin-top: 24px; }
.cat-walk {
  --cat-sprite-width: 64px;
  position: absolute;
  inset-inline: 0;
  bottom: 100%;
  height: calc(var(--cat-sprite-width) * .7);
  z-index: 2;
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
}
.cat-walk.is-active { visibility: visible; opacity: 1; }
.cat-walk-sprite {
  position: absolute;
  left: 0;
  bottom: calc(var(--cat-sprite-width) * -.025);
  display: block;
  width: var(--cat-sprite-width);
  height: calc(var(--cat-sprite-width) * .7);
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  pointer-events: none;
}
.cat-walk.is-active .cat-walk-sprite { will-change: transform; }
@media (min-width: 1100px) {
  .cat-walk { position: fixed; inset-inline: auto; left: var(--cat-lane-left); width: var(--cat-lane-width); bottom: 24px; }
  .cat-walk::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; border-bottom: 1px solid var(--line); }
}
@media (width < 1100px) {
  .about { scroll-margin-top: 56px; }
  .cat-walk { --cat-sprite-width: 56px; bottom: -40px; }
}
@media print {
  .cat-walk { display: none; }
}

.cat-walk-treat {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 20px;
  height: 17px;
  image-rendering: pixelated;
  pointer-events: none;
}
.cat-walk-treat[hidden] { display: none; }

html.cat-cursor-hand, html.cat-cursor-hand * { cursor: grab !important; }
html.cat-cursor-feather, html.cat-cursor-feather * {
  cursor: url('../assets/cat-feather-cursor.svg?v=20260906-single-feather') 22 9, pointer !important;
}

.cat-feather-toy {
  position: fixed; width: 32px; height: 32px; z-index: 100;
  pointer-events: none; transform-origin: 22px 9px;
  animation: cat-feather-shake .55s ease-in-out infinite;
}
.cat-feather-toy[hidden] { display: none; }
html.cat-cursor-playing, html.cat-cursor-playing * { cursor: none !important; }
@keyframes cat-feather-shake {
  0%, 100% { transform: rotate(-16deg); }
  50% { transform: rotate(16deg); }
}
@media (prefers-reduced-motion: reduce) { .cat-feather-toy { animation: none; } }

.cat-home-anchor { position: absolute; inset-inline: 0; bottom: 100%; height: 0; pointer-events: none; visibility: hidden; }
@media (min-width: 1100px) {
  .cat-home-anchor { position: fixed; inset-inline: auto; left: var(--cat-lane-left); width: var(--cat-lane-width); bottom: 24px; }
}
@media (width < 1100px) { .cat-home-anchor { bottom: -40px; } }
.cat-walk[data-transported='true'] { z-index: 80; }
.cat-walk[data-transported='true']::after { display: none; }
.cat-drop-guide { position: fixed; z-index: 90; height: 2px; background: #c58049; box-shadow: 0 0 8px #c5804960; pointer-events: none; }
.cat-drop-guide[hidden] { display: none; }
html.cat-carrying, html.cat-carrying * { cursor: grabbing !important; user-select: none !important; }

@media (min-width: 1100px) {
  .cat-home-anchor[data-away='true'] { visibility: visible; }
  .cat-home-anchor[data-away='true']::after { content: ''; position: absolute; inset-inline: 0; bottom: 0; border-bottom: 1px solid var(--line); transform: translateY(var(--cat-home-rule-offset, 0px)); }
}

html.cat-cursor-scruff, html.cat-cursor-scruff * { cursor: grab !important; }
.cat-scruff-hint {
  position: fixed; z-index: 92; width: 10px; height: 10px; border: 1px solid #dda16db0;
  border-radius: 50%; transform: translate(-50%,-50%); pointer-events: none;
}
.cat-scruff-hint[hidden], .cat-return-hole[hidden], .cat-portal-sparks[hidden] { display: none; }
.cat-return-hole {
  position: fixed; z-index: 79; border-radius: 50%; pointer-events: none;
  isolation: isolate; transform-origin: 50% 100%;
}
.cat-return-hole::before {
  content: ''; position: absolute; inset: 2%; border-radius: inherit;
  background: #15171d url('../assets/cat-portal-passage.svg') center / 100% 100%;
  box-shadow: inset 0 0 4px #070a10b0;
  opacity: var(--cat-portal-aperture, 0);
}
.cat-portal-sparks {
  position: fixed; z-index: 81;
  pointer-events: none;
}

.cat-portal-sparks-back { z-index: 79; }

/* The same animated value drives the actual rule and its cat anchor. */
@property --cat-home-gap { syntax: '<length>'; inherits: true; initial-value: 40px; }
@media (width < 1100px) {
  .content > .about { --cat-home-gap: 40px; margin-bottom: var(--cat-home-gap); transition: --cat-home-gap 380ms cubic-bezier(.22,.7,.2,1); }
  .content > .about[data-cat-vacant='true'] { --cat-home-gap: 24px; }
  .cat-walk, .cat-home-anchor { bottom: calc(0px - var(--cat-home-gap)); }
}
.section-disclosure, footer { transition: margin-top 380ms cubic-bezier(.22,.7,.2,1); }
.section-disclosure[data-cat-occupied='true'], footer[data-cat-occupied='true'] { margin-top: 18px; }
@media (prefers-reduced-motion: reduce) {
  .content > .about, .section-disclosure, footer { transition: none; }
}

html.cat-handling, html.cat-handling *, html.cat-carrying, html.cat-carrying * {
  -webkit-user-select: none !important; user-select: none !important; -webkit-touch-callout: none !important;
}

/* A tiny press accent when BoBo taps a header control. */
.header-actions button[data-cat-poked='true'] { color: #c58049; background: #c5804922; transform: translateY(1px); }