/* Hive v0.27 locked layered avatar rig */
.customer-avatar-draft-placeholder,
.professional-master-art-avatar {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
}

.customer-avatar-draft-placeholder {
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  align-content: center;
  gap: 16px;
  padding: 28px;
  text-align: center;
  background:
    radial-gradient(circle at 28% 45%, #d7aa4926, transparent 34%),
    linear-gradient(145deg, #15171c, #070809);
}

.customer-draft-octagon {
  display: grid;
  width: min(100%, 190px);
  aspect-ratio: 1;
  place-items: center;
  border: 3px solid #d7aa49;
  clip-path: polygon(29% 0, 71% 0, 100% 29%, 100% 71%, 71% 100%, 29% 100%, 0 71%, 0 29%);
  background: #d7aa4914;
  box-shadow: inset 0 0 28px #d7aa4938;
}

.customer-draft-octagon span {
  color: #f0d27f;
  font-size: 28px;
  font-weight: 1000;
  letter-spacing: .14em;
}

.customer-draft-reference {
  display: block;
  width: min(100%, 190px);
  max-height: 310px;
  object-fit: contain;
  border: 2px solid #d7aa49;
  background: #08090b;
  box-shadow: 0 16px 34px #000b;
}

.customer-draft-copy {
  display: grid;
  gap: 9px;
  align-content: center;
  justify-items: center;
  width: min(100%, 430px);
}

.customer-draft-copy b,
.professional-master-art-avatar > span {
  color: #d8b85e;
  font-size: 9px;
  font-weight: 1000;
  letter-spacing: .12em;
}

.customer-draft-copy strong { color: #fff; font-size: 25px; }
.customer-draft-copy span { color: #d9dcdf; font-size: 13px; line-height: 1.5; }
.customer-draft-copy small { color: #8f959d; line-height: 1.45; }

.professional-master-art-avatar img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 16px 18px #000a);
  user-select: none;
}

.professional-master-art-avatar > span {
  position: absolute;
  left: 12px;
  top: 12px;
  padding: 7px 9px;
  border: 1px solid #806a39;
  background: #08090ade;
}

@media (max-width: 600px) {
  .customer-avatar-draft-placeholder {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 24px;
    text-align: center;
  }
  .customer-draft-octagon,
  .customer-draft-reference { width: 118px; max-height: 155px; }
  .customer-draft-copy strong { font-size: 20px; }
}

.layered-puppet-avatar {
  position: absolute;
  inset: 0;
  overflow: hidden;
  filter: drop-shadow(0 14px 18px #000a);
}

.layered-puppet-canvas {
  position: absolute;
  left: 50%;
  bottom: 0;
  height: 100%;
  aspect-ratio: 1 / 1;
  transform: translateX(-50%);
  transform-origin: 50% 99.5%;
  will-change: transform;
}

.puppet-layer {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  user-select: none;
  pointer-events: none;
}

.puppet-wave-arm {
  z-index: 1;
  opacity: 0;
  transform-origin: var(--wave-shoulder-x) var(--wave-shoulder-y);
  will-change: transform, opacity;
}

.puppet-body { z-index: 2; }

.puppet-mouth {
  position: absolute;
  z-index: 3;
  left: var(--mouth-x);
  top: var(--mouth-y);
  width: 4.7%;
  height: 1.55%;
  opacity: 0;
  transform: translate(-50%, -50%) scale(1, .5);
  transform-origin: center;
  background: radial-gradient(ellipse at 50% 22%, #f8eee5 0 18%, #7b323b 22% 61%, #d46e78 64% 82%, #5b242c 84%);
  border: 1px solid #71313b;
  border-radius: 48% 48% 55% 55%;
  box-shadow: 0 1px 2px #3f171c99;
  will-change: transform, opacity;
}

.layered-puppet-avatar[data-avatar-state="ended"],
.layered-puppet-avatar[data-avatar-state="muted"] {
  filter: grayscale(.5) brightness(.7) drop-shadow(0 14px 18px #000a);
}

.layered-puppet-avatar[data-avatar-state="thinking"]::after {
  content: "···";
  position: absolute;
  right: 24%;
  top: 18%;
  z-index: 4;
  padding: 3px 7px;
  border: 1px solid #806a39;
  border-radius: 999px;
  background: #08090ad9;
  color: #f2d27b;
  font-weight: 900;
  letter-spacing: .18em;
  animation: piper-status-pulse 1.2s ease-in-out infinite;
}

.rig-monitor b { color: #f6d36e; }

@media (prefers-reduced-motion: reduce) {
  .layered-puppet-canvas,
  .puppet-wave-arm,
  .puppet-mouth { transition: none !important; }
  .layered-puppet-avatar::after { animation: none !important; }
}

/* Hive v0.28.2 service-free articulated master rig */
.skeletal-puppet-avatar {
  position: absolute;
  inset: 0;
  overflow: hidden;
  display: grid;
  place-items: end center;
}

.skeletal-puppet-svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  object-fit: contain;
}

.skeletal-bone-art,
.skeletal-puppet-avatar [data-bone] {
  pointer-events: none;
  transform-box: view-box;
  will-change: transform;
}

.skeletal-joint { fill: #1d1e22; }
.skeletal-joint.skin { fill: #db9874; }

.skeletal-puppet-avatar[data-avatar-state="muted"],
.skeletal-puppet-avatar[data-avatar-state="ended"] {
  filter: grayscale(.35) brightness(.76);
}

.skeletal-puppet-avatar[data-avatar-state="thinking"]::after {
  content: "THINKING";
  position: absolute;
  right: 7%;
  top: 9%;
  padding: 5px 8px;
  border: 1px solid #806a39;
  background: #08090ad9;
  color: #f2d27b;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .1em;
}

.skeletal-rig-monitor b { color: #f6d36e; }
.rig-required.approved { background: #314f2f; color: #d5f0ce; border-color: #719666; }

.model-route-summary { margin-top: 9px; border-top: 1px solid #373a40; padding-top: 8px; }
.model-route-summary summary { cursor: pointer; color: #d8c58e; font-size: 9px; font-weight: 900; }
.model-route-summary small { display: block; margin-top: 6px; color: #989da5; line-height: 1.45; }

@media (prefers-reduced-motion: reduce) {
  .skeletal-puppet-avatar [data-bone] { will-change: auto; }
}
