.smith-menu .bakery-intro {
  background: linear-gradient(0deg,#261911eb,transparent 82%), url("./jobs/blacksmith/background.webp") center 46% / cover;
}
.bakery.smith-workshop {
  background: linear-gradient(180deg,#1d251d44,#231c13ef 78%), url("./jobs/blacksmith/background.webp") center / cover;
}
.smith-sprite {
  display: inline-block; width: 114px; aspect-ratio: 1;
  background: url("./jobs/blacksmith/sprites.webp") var(--x) var(--y) / 400% 300%;
  pointer-events: none;
}
.smith-menu .bakery-recipes .smith-sprite { width: 35px; }
.smith-station { overflow: hidden; }
.smith-scene {
  position: relative; display: grid; place-items: center; width: min(100%,320px); height: 143px; isolation: isolate;
  background: radial-gradient(ellipse at center,#ba6e393b,transparent 70%);
}
.smith-scene > .smith-sprite:first-child { width: 142px; }
.smith-scene .smith-blank { position: absolute; width: 70px; }
.smith-heat .smith-blank { left: 13%; bottom: 10px; }
.smith-heat.is-heating > .smith-sprite:first-child { animation: smith-fire .85s ease-in-out infinite alternate; }
.smith-heat.is-heating .smith-blank { animation: smith-feed .55s ease-out both; }
.smith-anvil .smith-blank { left: 50%; top: 25%; translate: -50% -50%; width: 92px; transform: scaleX(1.5); }
.smith-anvil.overheated .smith-blank { filter: brightness(.60) saturate(.55); }
.smith-transfer .smith-blank { animation: smith-transfer .38s ease-out both; }
.smith-hammer { position: absolute; right: 8%; top: -8px; width: 69px; transform-origin: 74% 74%; }
.smith-hit .smith-hammer { animation: smith-hammer .24s ease-out; }
.smith-hit .smith-blank, .smith-hit .smith-shaped { animation: smith-impact .23s ease-out; }
.smith-shaped { position: absolute; top: 4px; left: 50%; translate: -50% 0; opacity: var(--shape); pointer-events: none; }
.smith-shaped .smith-sprite { width: 72px; filter: drop-shadow(0 0 7px #fc783f); transform: rotate(22deg); }
.smith-hitbox { position: absolute; inset: 8px 18% 57px; touch-action: manipulation; }
.smith-target {
  position: absolute; top: var(--target-y); left: var(--target-x); width: 32px; height: 32px;
  translate: -50% -50%; border-radius: 50%; border: 2px solid #ffe7a8; padding: 0;
  background: radial-gradient(circle,#fff0bf 0 22%,#ff973877 25% 61%,#2a171bd9 68%);
  box-shadow: 0 0 11px #ffb254; touch-action: manipulation;
}
.smith-sparks {
  position: absolute; left: 50%; top: 25%; width: 5px; height: 5px; opacity: 0; border-radius: 50%;
  background: #ffe7a6; box-shadow: 24px -9px #ffc961,-23px -9px #ffcc61,10px -20px #fff4ba,
    -10px -26px #ffd977, -37px -21px #ff8e47,36px -19px #ffac4a; pointer-events: none;
}
.smith-sparks.show { animation: smith-sparks .37s ease-out both; }
.smith-quench .smith-blank { top: 0; right: 24%; transition: transform .3s ease,filter .35s ease; filter: drop-shadow(0 0 7px #ff803b); }
.smith-quench.is-dipping .smith-blank { transform: translate(-12px,44px); filter: saturate(.48) brightness(.8); }
.smith-steam {
  position: absolute; left: 31%; top: 30%; width: 38%; height: 42%;
  background: radial-gradient(ellipse at 25% 70%,#fcfff4ab,transparent 48%),
    radial-gradient(ellipse at 64% 50%,#f5f8f8be,transparent 49%); opacity: 0; pointer-events: none;
}
.smith-quench.is-dipping .smith-steam { animation: smith-steam .8s ease-out infinite; }
.smith-buttons { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.smith-buttons button { padding-inline: 4px; }
[data-smith-hold] { touch-action: none; user-select: none; -webkit-touch-callout: none; }
.smith-gauge {
  position: relative; width: 100%; height: 16px; border: 1px solid #ecd1ab; border-radius: 8px;
  background: linear-gradient(90deg,#51799d 0%,#537da0 27%,#db963f 27% var(--low),
    #a4d378 var(--low) var(--high),#a94743 var(--high) 100%);
}
.smith-gauge i { position: absolute; inset-block: -3px; left: 0; width: 4px; translate: -50% 0; border-radius: 3px; background: #fff7dc; box-shadow: 0 0 9px #fff8de; }
.smith-result small { color: #f0d5a8; }
.smith-summary .smith-sprite, .smith-result .smith-sprite { animation: bakery-rise .48s cubic-bezier(.2,.75,.3,1.3) both; }
@keyframes smith-feed { to { transform: translate(42px,-12px) scale(.75); opacity: .48; } }
@keyframes smith-fire { to { filter: drop-shadow(0 0 17px #ff963c); } }
@keyframes smith-transfer { from { translate: -150% -50%; opacity: .3; } }
@keyframes smith-hammer { 42% { rotate: -45deg; translate: -28px 14px; } }
@keyframes smith-impact { 42% { scale: 1.08 .79; } }
@keyframes smith-sparks { 25% { opacity: 1; } to { transform: translateY(-21px) scale(1.7); opacity: 0; } }
@keyframes smith-steam { 20% { opacity: .85; } to { transform: translateY(-27px) scale(1.2); opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .smith-scene *, .smith-summary .smith-sprite, .smith-result .smith-sprite { animation: none !important; }
}