/* Parts rest on the paper; only preview and activation move their geometry. */
[data-card-art] { touch-action: manipulation; isolation: isolate; transition: none; }
[data-card-art] > svg { pointer-events: none; }
[data-card-art]:focus-visible { outline-offset: -5px; outline-width: 3px; }
.ink-part { transform-box: fill-box; transform-origin: center; }
.ink-river {
  --ink-open: translate(18px, -5px) scaleY(.82) skewY(-4deg);
  --ink-peak: translate(24px, -8px) scaleY(.76) skewY(-6deg);
  --ink-rebound: translate(12px, -2px) scaleY(.9) skewY(-2deg);
}
.ink-flag {
  transform-origin: left center;
  --ink-open: rotate(-16deg) skewY(-12deg) scaleX(1.16);
  --ink-peak: rotate(-22deg) skewY(-16deg) scaleX(1.22);
  --ink-rebound: rotate(10deg) skewY(8deg) scaleX(.92);
}
.ink-window-left {
  transform-origin: left center;
  --ink-open: skewY(-18deg) scaleX(.36);
  --ink-peak: skewY(-24deg) scaleX(.2);
  --ink-rebound: skewY(-3deg) scaleX(.92);
}
.ink-window-right {
  transform-origin: right center;
  --ink-open: skewY(18deg) scaleX(.36);
  --ink-peak: skewY(24deg) scaleX(.2);
  --ink-rebound: skewY(3deg) scaleX(.92);
}
.ink-door {
  transform-origin: left center;
  --ink-open: skewY(-18deg) scaleX(.3);
  --ink-peak: skewY(-24deg) scaleX(.12);
  --ink-rebound: skewY(-3deg) scaleX(.9);
}
.ink-bun {
  --ink-open: translate(-4px, -26px) rotate(-8deg);
  --ink-peak: translate(-6px, -32px) rotate(-12deg);
  --ink-rebound: translate(-2px, -20px) rotate(-4deg);
}
.ink-filling-top {
  --ink-open: translate(5px, -16px) rotate(5deg);
  --ink-peak: translate(8px, -21px) rotate(8deg);
  --ink-rebound: translate(2px, -12px) rotate(2deg);
}
.ink-filling-bottom {
  --ink-open: translate(-5px, -7px) rotate(-4deg);
  --ink-peak: translate(-8px, -11px) rotate(-7deg);
  --ink-rebound: translate(-2px, -4px) rotate(-2deg);
}
.ink-drink {
  transform-origin: center bottom;
  --ink-open: translate(10px, -18px) rotate(-14deg);
  --ink-peak: translate(12px, -24px) rotate(-19deg);
  --ink-rebound: translate(6px, -12px) rotate(-7deg);
}
.ink-ear-left {
  transform-origin: center bottom;
  --ink-open: rotate(-17deg);
  --ink-peak: rotate(-23deg);
  --ink-rebound: rotate(7deg);
}
.ink-ear-right {
  transform-origin: center bottom;
  --ink-open: rotate(17deg);
  --ink-peak: rotate(23deg);
  --ink-rebound: rotate(-7deg);
}
.ink-eyes {
  --ink-open: scaleY(.16);
  --ink-peak: scaleY(.08);
  --ink-rebound: scaleY(1.08);
}
.ink-smile {
  --ink-open: translateY(3px) scale(1.18, 1.3);
  --ink-peak: translateY(4px) scale(1.25, 1.4);
  --ink-rebound: translateY(1px) scale(1.08, 1.12);
}
.ink-stars {
  --ink-open: translate(-12px, -12px) rotate(-20deg) scale(1.15);
  --ink-peak: translate(-16px, -17px) rotate(-35deg) scale(1.2);
  --ink-rebound: translate(-6px, -6px) rotate(12deg) scale(1.05);
}
.ink-lamp {
  transform-origin: center top;
  --ink-open: rotate(18deg);
  --ink-peak: rotate(24deg);
  --ink-rebound: rotate(-12deg);
}
.ink-lamp-right {
  transform-origin: center top;
  --ink-open: rotate(-18deg);
  --ink-peak: rotate(-24deg);
  --ink-rebound: rotate(12deg);
}
.ink-light-star {
  --ink-open: translateY(5px) rotate(28deg);
  --ink-peak: translateY(8px) rotate(52deg);
  --ink-rebound: translateY(2px) rotate(14deg);
}
.ink-curtain-left {
  transform-origin: left top;
  --ink-open: translateX(-16px) scaleX(.56) skewY(-8deg);
  --ink-peak: translateX(-22px) scaleX(.42) skewY(-11deg);
  --ink-rebound: translateX(-12px) scaleX(.67) skewY(-5deg);
}
.ink-curtain-right {
  transform-origin: right top;
  --ink-open: translateX(16px) scaleX(.56) skewY(8deg);
  --ink-peak: translateX(22px) scaleX(.42) skewY(11deg);
  --ink-rebound: translateX(12px) scaleX(.67) skewY(5deg);
}
.ink-screen {
  --ink-open: translate(7px, -22px) rotate(12deg);
  --ink-peak: translate(10px, -28px) rotate(18deg);
  --ink-rebound: translate(4px, -16px) rotate(6deg);
}
.ink-awning {
  transform-origin: center top;
  --ink-open: rotate(-8deg) skewX(-5deg);
  --ink-peak: rotate(-12deg) skewX(-7deg);
  --ink-rebound: rotate(5deg) skewX(3deg);
}
.ink-sign {
  transform-origin: center top;
  --ink-open: rotate(18deg);
  --ink-peak: rotate(25deg);
  --ink-rebound: rotate(-12deg);
}
.ink-skate {
  --ink-open: translate(18px, -8px) rotate(-7deg);
  --ink-peak: translate(28px, -16px) rotate(-12deg);
  --ink-rebound: translate(8px, -3px) rotate(3deg);
}
.ink-speed {
  --ink-open: translate(-12px, 4px) scaleX(.75);
  --ink-peak: translate(-22px, 6px) scaleX(.5);
  --ink-rebound: translate(-5px, 2px) scaleX(.9);
}
.ink-telescope {
  transform-origin: 45% 75%;
  --ink-open: rotate(-14deg) translate(0, -5px);
  --ink-peak: rotate(-22deg) translate(0, -8px);
  --ink-rebound: rotate(5deg);
}
.ink-orbit {
  --ink-open: translate(10px, -12px) rotate(25deg);
  --ink-peak: translate(15px, -20px) rotate(55deg);
  --ink-rebound: translate(5px, -6px) rotate(12deg);
}
.ink-orbit-star {
  --ink-open: translate(-7px, -8px) rotate(-16deg) scale(1.2);
  --ink-peak: translate(-12px, -13px) rotate(-25deg) scale(1.3);
  --ink-rebound: translate(-3px, -4px) rotate(7deg);
}

/* Removing the gate immediately removes both pose and animation, including transitions. */
@media (prefers-reduced-motion: no-preference) {
  body[data-art-motion="running"] [data-card-art].is-art-visible .ink-part {
    transform: var(--ink-rest, translate(0, 0));
    transition: transform 300ms cubic-bezier(.2, .7, .25, 1);
  }
  body[data-art-motion="running"] [data-card-art].is-art-visible.is-art-hovered .ink-part {
    --ink-rest: var(--ink-open);
    transition-duration: 260ms;
    transition-timing-function: cubic-bezier(.2, .85, .3, 1.12);
  }
  body[data-art-motion="running"] [data-card-art].is-art-visible.is-art-playing .ink-part {
    animation: ink-perform 1080ms cubic-bezier(.2, .7, .25, 1) both;
    transition: none;
  }
}
body:not([data-art-motion="running"]) .activity-card { transition: none; }
@media (prefers-reduced-motion: reduce) {
  .activity-card { transition: none; }
}

@keyframes ink-perform {
  0%, 100% { transform: var(--ink-rest, translate(0, 0)); }
  22% { transform: var(--ink-peak); }
  43%, 82% { transform: var(--ink-open); }
  64% { transform: var(--ink-rebound); }
}
