/* REFERENCE
 * - ui/overlay/mote-tools.js (the hands + tool registry these rules pose)
 * - ui/companion/mote-work.js (toggles the working stage classes + syncs
 *   impact effects to the documented 60% cycle point)
 * - ui/mote-animation/mote-anim-idle.css (idle hand bob this overrides)
 *
 * Work choreography (KILPI spec): grip poses, tool mounts, swings, body
 * rock, wrist lag. IMPACT AT 60% OF THE CYCLE FOR BOTH MODES:
 *   chop 1.6s → impact 960ms into each cycle
 *   mine 1.4s → impact 840ms into each cycle
 * JS toggles .pg-mote--working-chop/-mine on .pg-mote; CSS owns the rest.
 * Scene-side animation (tree shake/fall, vein hits) lives further down.
 */

/* ── Equip: two-handed grip. CSS transform on .mote-hand replaces the bob
   animation's transform, so the bob is explicitly killed during work; the
   240ms transition makes the hands FLY to the handle. */
.pg-mote--working-chop .mote-hand,
.pg-mote--working-mine .mote-hand { animation: none; }

/* Working face: concentrated squint — this is honest work. */
.pg-mote--working-chop .mote-eye,
.pg-mote--working-mine .mote-eye { animation: none; transform: scaleY(0.55); }
/* …but joy breaks through when a resource pops (2-class beats 1-class). */
.pg-mote.pg-mote--happy .mote-eye { animation: none; transform: scale(1.15); }

/* CHOP: axe shouldered right, blade up-right, clear of the face.
   Mount nudged +4 toward the tree (Ville: swing fell short of the trunk). */
.pg-mote--working-chop .mote-tool {
  visibility: visible;
  transform: translate(70px, 54px) rotate(-10deg);
}
.pg-mote--working-chop .mote-hand--r { transform: translate(-12.5px, -6px) rotate(-8deg); }
.pg-mote--working-chop .mote-hand--l { transform: translate(53.6px, 0.4px) rotate(-8deg); }

/* MINE: pick held across the chest, head beside the right cheek. */
.pg-mote--working-mine .mote-tool {
  visibility: visible;
  transform: translate(66px, 58px) rotate(12deg);
}
.pg-mote--working-mine .mote-hand--r { transform: translate(-16.5px, -2px) rotate(10deg); }
.pg-mote--working-mine .mote-hand--l { transform: translate(47.2px, 4.4px) rotate(10deg); }

/* ── Swings on .mote-toolarm (pivot 50px 55px, set inline).
   Phases: 0–42% windup, 42–50% loaded hold-creep, 50–60% launch,
   60% IMPACT, 60–67% bury, 67–76% recoil, 76–100% recover. */
.pg-mote--working-chop .mote-toolarm { animation: mh-swing-chop 1.6s infinite; }
.pg-mote--working-mine .mote-toolarm { animation: mh-swing-mine 1.4s infinite; }

@keyframes mh-swing-chop {
  0%   { transform: translate(0, 0) rotate(0deg);           animation-timing-function: ease-in-out; }
  22%  { transform: translate(0, -0.5px) rotate(-32deg);    animation-timing-function: ease-in-out; }
  42%  { transform: translate(0, -1px) rotate(-56deg);      animation-timing-function: linear; }
  50%  { transform: translate(0, -1px) rotate(-58deg);      animation-timing-function: cubic-bezier(0.7, 0, 1, 0.6); }
  60%  { transform: translate(9px, 1.5px) rotate(40deg);    animation-timing-function: ease-out; }
  67%  { transform: translate(9.5px, 2px) rotate(46deg);    animation-timing-function: ease-in-out; }
  76%  { transform: translate(6px, 1px) rotate(32deg);      animation-timing-function: ease-in-out; }
  100% { transform: translate(0, 0) rotate(0deg); }
}
@keyframes mh-swing-mine {
  0%   { transform: translate(0, 0) rotate(0deg);           animation-timing-function: ease-in-out; }
  24%  { transform: translate(0, -2px) rotate(-14deg);      animation-timing-function: ease-in-out; }
  42%  { transform: translate(0, -4.5px) rotate(-22deg);    animation-timing-function: linear; }
  50%  { transform: translate(0, -5px) rotate(-24deg);      animation-timing-function: cubic-bezier(0.7, 0, 1, 0.6); }
  60%  { transform: translate(4px, 1px) rotate(58deg);      animation-timing-function: ease-out; }
  66%  { transform: translate(4.5px, 1.5px) rotate(63deg);  animation-timing-function: ease-in-out; }
  76%  { transform: translate(2.5px, 0) rotate(46deg);      animation-timing-function: ease-in-out; }
  100% { transform: translate(0, 0) rotate(0deg); }
}

/* ── Whole-body commitment: the mote leans/crouches with the swing.
   Runs on .mote-body-anim (ground-anchored origin) which also carries the
   hands — one unified action. Idle breathe lives on .mote-body, no fight. */
.pg-mote--working-chop .mote-body-anim { animation: mh-rock-chop 1.6s infinite; }
.pg-mote--working-mine .mote-body-anim { animation: mh-rock-mine 1.4s infinite; }
@keyframes mh-rock-chop {
  0%, 100% { transform: rotate(0deg) scaleY(1) scaleX(1); }
  42%, 50% { transform: rotate(-4deg) scaleY(1.01) scaleX(0.99); animation-timing-function: cubic-bezier(0.7, 0, 1, 0.6); }
  60%      { transform: rotate(3deg) scaleY(1) scaleX(1);        animation-timing-function: ease-out; }
  67%      { transform: rotate(4deg) scaleY(0.965) scaleX(1.035); }
  78%      { transform: rotate(1.5deg) scaleY(1.01) scaleX(0.99); }
}
@keyframes mh-rock-mine {
  0%, 100% { transform: translateY(0) scaleY(1) scaleX(1); }
  42%, 50% { transform: translateY(-1px) scaleY(1.035) scaleX(0.965); animation-timing-function: cubic-bezier(0.7, 0, 1, 0.6); }
  60%      { transform: translateY(0.5px) scaleY(0.95) scaleX(1.05);  animation-timing-function: ease-out; }
  70%      { transform: translateY(0) scaleY(0.985) scaleX(1.015); }
}

/* ── Wrist give: the tool drags behind the arm, whips through at impact.
   Animates the injected .mt-tool so it composes on the static mount. */
.mt-tool { transform-box: view-box; transform-origin: 0px 0px; }
.pg-mote--working-chop .mt-tool { animation: mh-wrist-lag 1.6s infinite; }
.pg-mote--working-mine .mt-tool { animation: mh-wrist-lag 1.4s infinite; }
@keyframes mh-wrist-lag {
  0%, 32%, 84%, 100% { transform: rotate(0deg); }
  42%, 50%           { transform: rotate(-7deg); animation-timing-function: cubic-bezier(0.7, 0, 1, 0.6); }
  60%                { transform: rotate(5deg);  animation-timing-function: ease-out; }
  70%                { transform: rotate(-2deg); }
}

/* ═══ Forest work scene (TAPIO): tree states + backdrop atmosphere ═══ */

/* Work tree (mhwt): idle breath, hit shudder, cut reveals, felling.
   Hinge: right trunk edge at stump top — keyframes depend on view-box. */
.mhwt-tree { transform-box: view-box; transform-origin: 347px 184.5px; }
.mhwt-crown { transform-box: fill-box; transform-origin: 50% 88%; animation: mhwt-idle 6.5s ease-in-out infinite; }
.mhwt-c { opacity: 0; transition: opacity .15s ease-out; }
.mhwt.mhwt-cut1 .mhwt-c1, .mhwt.mhwt-cut2 .mhwt-c2, .mhwt.mhwt-cut3 .mhwt-c3 { opacity: 1; }
.mhwt.mhwt-shake .mhwt-tree { animation: mhwt-shake .3s cubic-bezier(.36,.07,.19,.97) 1; }
.mhwt.mhwt-shake .mhwt-crown { animation: mhwt-crownshake .3s ease-out 1; }
.mhwt.mhwt-fall .mhwt-tree { animation: mhwt-fall 1.9s linear 1 forwards; }
.mhwt.mhwt-fall .mhwt-crown { animation: mhwt-fallcrush 1.9s linear 1 forwards; }

@keyframes mhwt-idle { 0%,100% { transform:rotate(-.8deg); } 50% { transform:rotate(1deg); } }
@keyframes mhwt-shake {
  0%,100% { transform:rotate(0) translateX(0); }
  18% { transform:rotate(.9deg) translateX(1.6px); }
  45% { transform:rotate(-.7deg) translateX(-1.1px); }
  72% { transform:rotate(.35deg) translateX(.6px); }
}
@keyframes mhwt-crownshake {
  0%,100% { transform:rotate(0); }
  20% { transform:rotate(2.6deg); }
  52% { transform:rotate(-1.9deg); }
  80% { transform:rotate(1deg); }
}
@keyframes mhwt-fall {
  0% { transform:rotate(0deg); opacity:1; animation-timing-function:ease-in-out; }
  10% { transform:rotate(-2.5deg); animation-timing-function:cubic-bezier(.62,.04,.96,.36); } /* creak back */
  48% { transform:rotate(84deg); animation-timing-function:cubic-bezier(.16,.84,.44,1); }     /* gravity slam */
  58% { transform:rotate(77deg); animation-timing-function:cubic-bezier(.55,.06,.68,.19); }   /* bounce */
  68%,80% { transform:rotate(84deg); opacity:1; }
  100% { transform:rotate(84deg); opacity:0; }
}
@keyframes mhwt-fallcrush {
  0%,45% { transform:scale(1,1); }
  50% { transform:scale(.8,1.1); }   /* local-X = world-down at 84deg: landing squash */
  58% { transform:scale(1.05,.96); }
  66%,100% { transform:scale(1,1); }
}

/* Forest backdrop atmosphere (mhwf) */
.mhwf-tw { animation: mhwf-tw 8s ease-in-out infinite; }
.mhwf-tw--b { animation-duration: 11s; animation-delay: -4s; }
.mhwf-ff { opacity: 0; animation: mhwf-ff 11s ease-in-out infinite; }
.mhwf-ff--1 { animation-duration: 10.5s; }
.mhwf-ff--2 { animation-duration: 12.5s; animation-delay: -5s; animation-direction: reverse; }
.mhwf-sway { transform-box: fill-box; transform-origin: 50% 100%; animation: mhwf-sway 7s ease-in-out infinite; }
.mhwf-d1 { animation-delay: -1.5s; }
.mhwf-d2 { animation-delay: -3.2s; }
@keyframes mhwf-tw { 0%,100% { opacity:.3; } 50% { opacity:.95; } }
@keyframes mhwf-ff { 0% { transform:translate(0,0); opacity:0; } 14% { opacity:.9; } 42% { opacity:.45; } 55% { transform:translate(8px,-11px); } 72% { opacity:.85; } 100% { transform:translate(13px,-19px); opacity:0; } }
@keyframes mhwf-sway { 0%,100% { transform:rotate(-2deg); } 50% { transform:rotate(2.4deg); } }

/* Wood chips fly smaller than the emoji default. */
.pg-particle--chip { font-size: 13px; }

/* Work backdrops fill the scene slot like the garden svg does. */
.mhwf, .mhwm { display: block; width: 100%; height: 100%; }

/* ═══ Mine work scene (LOUHI): backdrop atmosphere + iron vein ═══ */

/* Backdrop budget: exactly 2 keyframes (lantern breath + dust drift). */
.mhwm-gl { animation: mhwm-gl 5.5s ease-in-out infinite; }
.mhwm-gl--b { animation-duration: 7s; animation-delay: -2.6s; }
.mhwm-dm { opacity: 0; animation: mhwm-dm 13s ease-in-out infinite; }
.mhwm-dm--2 { animation-duration: 16s; animation-delay: -6s; }
.mhwm-dm--3 { animation-duration: 11s; animation-delay: -8.5s; animation-direction: reverse; }

@keyframes mhwm-gl {
  0%, 100% { opacity: 0.72; }
  50% { opacity: 1; }
}
/* Seam-free loop: opacity 0 at both ends (garden firefly rule). */
@keyframes mhwm-dm {
  0% { transform: translate(0, 0); opacity: 0; }
  16% { opacity: 0.55; }
  45% { opacity: 0.3; }
  62% { transform: translate(-6px, 9px); }
  80% { opacity: 0.5; }
  100% { transform: translate(-10px, 15px); opacity: 0; }
}

/* Iron vein (mhwv) — state classes toggled on the vein svg root.
   Ore sockets are always drawn under the nubs, so a popped nub leaves
   its crater for free. */
.mhwv-rock, .mhwv-n1, .mhwv-n2, .mhwv-n3,
.mhwv-f1, .mhwv-f2, .mhwv-f3, .mhwv-du circle {
  transform-box: fill-box;
  transform-origin: 50% 50%;
}
.mhwv-f1, .mhwv-f2, .mhwv-f3, .mhwv-du circle { opacity: 0; }
.mhwv-rock { transition: opacity 0.6s ease; }

.mhwv-hit .mhwv-rock { animation: mhwv-hit 0.25s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; }
/* glint flash lands on the next un-popped nub */
.mhwv-hit:not(.mhwv-got1) .mhwv-f1,
.mhwv-hit.mhwv-got1:not(.mhwv-got2) .mhwv-f2,
.mhwv-hit.mhwv-got2:not(.mhwv-got3) .mhwv-f3 { animation: mhwv-fl 0.28s ease-out both; }

/* progressive yield — got classes are cumulative and sticky */
.mhwv-got1 .mhwv-n1,
.mhwv-got2 .mhwv-n2,
.mhwv-got3 .mhwv-n3 { animation: mhwv-pop 0.45s cubic-bezier(0.34, 1.2, 0.64, 1) both; }

/* exhausted — applied after got3, with mhwv-hit removed first */
.mhwv-done .mhwv-rock { animation: mhwv-settle 0.9s ease-out both; opacity: 0.86; }
.mhwv-done .mhwv-du circle { animation: mhwv-puff 1s ease-out both; }
.mhwv-done .mhwv-du circle:nth-of-type(2) { animation-delay: 0.09s; }
.mhwv-done .mhwv-du circle:nth-of-type(3) { animation-delay: 0.17s; }

@keyframes mhwv-hit {
  0%, 100% { transform: translate(0, 0); }
  25% { transform: translate(-2.4px, 0.6px) rotate(-0.4deg); }
  55% { transform: translate(1.6px, -0.4px) rotate(0.3deg); }
  80% { transform: translate(-0.8px, 0.2px); }
}
@keyframes mhwv-fl {
  0% { opacity: 0; transform: scale(0.5); }
  30% { opacity: 0.95; transform: scale(1.05); }
  100% { opacity: 0; transform: scale(1.45); }
}
@keyframes mhwv-pop {
  0% { transform: scale(1); opacity: 1; }
  35% { transform: scale(1.16) translateY(-1.5px); }
  100% { transform: scale(0.05); opacity: 0; }
}
@keyframes mhwv-settle {
  0% { transform: translateY(0); }
  30% { transform: translateY(1.8px); }
  60% { transform: translateY(0.6px); }
  100% { transform: translateY(1px); }
}
@keyframes mhwv-puff {
  0% { opacity: 0; transform: translate(0, 0) scale(0.7); }
  20% { opacity: 0.5; }
  100% { opacity: 0; transform: translate(2px, -13px) scale(1.5); }
}

/* ── Reduced motion: static held READY pose — tool mounted, hands
   gripped, zero movement. Grip/mount transforms are static declarations,
   so they survive; only the motion dies. Tree hits/fall become fades. */
@media (prefers-reduced-motion: reduce) {
  .mote-hand,
  .mote-toolarm,
  .mt-tool,
  .pg-mote--working-chop .mote-body-anim,
  .pg-mote--working-mine .mote-body-anim { animation: none !important; }
  .mote-hand { transition: none !important; }
  .mote-hands { transition: none !important; }
  .mhwf-tw, .mhwf-ff, .mhwf-sway, .mhwt-crown { animation: none !important; }
  .mhwf-ff { opacity: .7; }
  .mhwt.mhwt-shake .mhwt-tree { animation: mhwt-hit-rm .3s ease-out 1 !important; }
  .mhwt.mhwt-shake .mhwt-crown { animation: none !important; }
  .mhwt.mhwt-fall .mhwt-tree { animation: mhwt-fall-rm 1s ease-out 1 forwards !important; }
  .mhwt.mhwt-fall .mhwt-crown { animation: none !important; }
  .mhwm-gl, .mhwm-dm,
  .mhwv-hit .mhwv-rock,
  .mhwv-done .mhwv-rock,
  .mhwv-done .mhwv-du circle { animation: none !important; }
  .mhwm-dm { opacity: 0.45; }
  .mhwv-hit:not(.mhwv-got1) .mhwv-f1,
  .mhwv-hit.mhwv-got1:not(.mhwv-got2) .mhwv-f2,
  .mhwv-hit.mhwv-got2:not(.mhwv-got3) .mhwv-f3 { animation: mhwv-flr 0.3s ease-out both !important; }
  .mhwv-got1 .mhwv-n1,
  .mhwv-got2 .mhwv-n2,
  .mhwv-got3 .mhwv-n3 { animation: mhwv-fade 0.3s ease both !important; }
}
@keyframes mhwv-flr {
  0% { opacity: 0; }
  30% { opacity: 0.85; }
  100% { opacity: 0; }
}
@keyframes mhwv-fade {
  to { opacity: 0; }
}
@keyframes mhwt-hit-rm { 0%,100% { opacity:1; } 45% { opacity:.7; } }
@keyframes mhwt-fall-rm { from { opacity:1; } to { opacity:0; } }
