.yuansen-slider-check {
  display: grid;
  gap: 12px;
}
.yuansen-contact-form .puzzle-start {
  color: var(--ink);
  background: #eeebe4;
  border: 1px solid #bdb7aa;
  justify-content: space-between;
  align-items: center;
  width: min(100%, 480px);
  padding: 16px 18px;
  display: flex;
}
.puzzle-start span {
  font-size: 20px;
}
.puzzle-stage {
  border: 1px solid #bdb7aa;
  width: min(100%, 520px);
  padding: 12px;
  background: #ede9e1;
}
.puzzle-picture {
  height: 150px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(125deg, #c7b095 0 24%, #735f4e 24% 29%, #ddd6ca 29% 54%, #a7a093 54% 62%, #ebe7df 62% 100%);
}
.puzzle-picture::after {
  content: "";
  position: absolute;
  inset: 20% 8% 15% 46%;
  border: 10px solid #ffffff73;
  border-width: 10px 0 0 10px;
}
.puzzle-gap,
.puzzle-piece {
  width: 42px;
  height: 42px;
  clip-path: polygon(0 0, 35% 0, 35% 18%, 55% 18%, 55% 0, 100% 0, 100% 100%, 55% 100%, 55% 82%, 35% 82%, 35% 100%, 0 100%);
  position: absolute;
  top: 54px;
}
.puzzle-gap {
  left: calc(var(--target) - 21px);
  background: #25231f8c;
  box-shadow: 0 0 0 2px #fff9;
}
.puzzle-piece {
  z-index: 2;
  left: clamp(0px, calc(var(--piece-x) - 21px), calc(100% - 42px));
  background: #f5f1e9;
  border: 2px solid #fff;
  box-shadow: 0 5px 14px #0004;
}
.puzzle-track {
  height: 48px;
  margin-top: 10px;
  background: #ded9cf;
  position: relative;
  overflow: hidden;
}
.puzzle-track > span {
  color: #777168;
  pointer-events: none;
  text-align: center;
  letter-spacing: .08em;
  font-size: 12px;
  line-height: 48px;
  position: absolute;
  inset: 0;
}
.puzzle-track input[type="range"] {
  appearance: none;
  background: transparent;
  border: 0;
  width: 100%;
  height: 48px;
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 3;
}
.puzzle-track input[type="range"]::-webkit-slider-thumb {
  appearance: none;
  width: 52px;
  height: 48px;
  background: var(--ink);
  border: 0;
  cursor: grab;
  box-shadow: 0 0 0 1px #fff3 inset;
}
.puzzle-track input[type="range"]::-moz-range-thumb {
  width: 52px;
  height: 48px;
  background: var(--ink);
  border: 0;
  border-radius: 0;
  cursor: grab;
}
.slider-status {
  color: var(--muted);
  font-size: 12px;
  margin: 0;
}
.yuansen-slider-check.is-complete .puzzle-gap {
  background: #66816899;
  box-shadow: 0 0 0 2px #d8edd9;
}
.yuansen-slider-check.is-complete .puzzle-piece {
  background: #dce9db;
}
.yuansen-slider-check.is-complete .slider-status {
  color: #476847;
  font-weight: 600;
}
.yuansen-slider-check.is-complete .puzzle-track {
  background: #dce9db;
}
.yuansen-motion-strength-1.motion-ready .yi-motion-item { transform: translateY(12px); }
.yuansen-motion-strength-1.motion-ready .yi-motion-image { transform: scale(1.02); }
.yuansen-motion-strength-2.motion-ready .yi-motion-item { transform: translateY(18px); }
.yuansen-motion-strength-2.motion-ready .yi-motion-image { transform: scale(1.035); }
.yuansen-motion-strength-3.motion-ready .yi-motion-item { transform: translateY(26px); }
.yuansen-motion-strength-3.motion-ready .yi-motion-image { transform: scale(1.055); }
.motion-ready .yi-motion-item.is-visible { transform: none; }
.motion-ready .yi-motion-image.is-visible { transform: scale(1); }
.footer-address span {
  color: #fff;
  margin-right: .7em;
  font-weight: 500;
}
@media (max-width: 600px) {
  .puzzle-picture { height: 128px; }
  .puzzle-gap,
  .puzzle-piece { top: 43px; }
}
.puzzle-modal[hidden] { display: none; }
.puzzle-modal {
  z-index: 120;
  background: #171612b8;
  backdrop-filter: blur(8px);
  place-items: center;
  padding: 24px;
  display: grid;
  position: fixed;
  inset: 0;
}
.puzzle-dialog {
  width: min(92vw, 570px);
  background: #f3f1eb;
  box-shadow: 0 28px 80px #17140e59;
}
.puzzle-dialog > header {
  justify-content: space-between;
  align-items: center;
  padding: 20px 22px 16px;
  display: flex;
}
.puzzle-dialog header small {
  color: var(--muted);
  letter-spacing: .18em;
  font-size: 9px;
}
.puzzle-dialog header h3 {
  margin: 4px 0 0;
  font: 400 22px/1.2 "Noto Serif TC","Songti TC",serif;
}
.puzzle-dialog header button {
  color: var(--ink);
  background: transparent;
  border: 0;
  padding: 4px 8px;
  font-size: 28px;
  cursor: pointer;
}
.puzzle-dialog .puzzle-stage {
  border: 0;
  width: 100%;
  padding: 0 22px 22px;
  background: transparent;
}
.puzzle-modal-status {
  color: var(--muted);
  text-align: center;
  margin: 12px 0 0;
  font-size: 12px;
}
.puzzle-modal-open { overflow: hidden; }
.puzzle-variant-1 .puzzle-picture { background: linear-gradient(125deg,#c7b095 0 24%,#735f4e 24% 29%,#ddd6ca 29% 54%,#a7a093 54% 62%,#ebe7df 62% 100%); }
.puzzle-variant-2 .puzzle-picture { background: linear-gradient(155deg,#8f9a91 0 29%,#ded8cc 29% 52%,#927967 52% 59%,#e9e5dc 59% 100%); }
.puzzle-variant-3 .puzzle-picture { background: linear-gradient(105deg,#d4c6b6 0 22%,#ece8df 22% 48%,#6f716d 48% 55%,#bba38b 55% 76%,#e6e1d7 76% 100%); }
.puzzle-variant-4 .puzzle-picture { background: linear-gradient(135deg,#747b78 0 18%,#d8c9b5 18% 43%,#eee9df 43% 66%,#9a806d 66% 73%,#d7d5cd 73% 100%); }
.puzzle-start:disabled {
  color: #476847;
  background: #dce9db;
  border-color: #9db29e;
  opacity: 1;
}
