/* Dopi V18 — self-contained additions, existing site and commerce UI untouched. */
.doplock-dopi-stage-v18 {
  position: relative;
  z-index: 40;
  width: min(1180px, calc(100% - 48px));
  height: 0;
  margin: 0 auto;
  padding: 0;
  pointer-events: none;
}
.doplock-dopi-shell-v18 {
  position: absolute;
  top: 0;
  right: 48px;
  width: 148px;
  height: 142px;
  pointer-events: auto;
}
.doplock-dopi-shell-v18 .doplock-dopi-toggle-v18 {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0 0 24px 24px;
  background: transparent;
  color: #111;
  box-shadow: none;
  cursor: pointer;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.doplock-dopi-toggle-v18:focus-visible {
  outline: 2px solid #f97316;
  outline-offset: -2px;
}
.doplock-dopi-window-v18 {
  position: absolute;
  display: block;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.doplock-dopi-rig-v18 {
  position: absolute;
  display: block;
  top: -30px;
  left: 0;
  width: 100%;
  aspect-ratio: 352 / 405;
  transform: rotate(180deg);
  transform-origin: 50% 50%;
  pointer-events: none;
}
.doplock-dopi-rig-v18 > img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}
.doplock-dopi-rig-v18 .doplock-dopi-arm-v18 {
  transform-origin: 82.5% 59.5%;
  animation: doplock-dopi-arrival-v18 1.5s ease-in-out .6s 1 both;
}
.doplock-dopi-shell-v18.is-greeting .doplock-dopi-arm-v18 {
  animation: doplock-dopi-wave-v18 1.5s ease-in-out 1 both;
}
@keyframes doplock-dopi-arrival-v18 {
  0%,100% { transform: rotate(0deg); }
  22%,66% { transform: rotate(-22deg); }
  44%,82% { transform: rotate(9deg); }
}
@keyframes doplock-dopi-wave-v18 {
  0%,100% { transform: rotate(0deg); }
  22%,66% { transform: rotate(-22deg); }
  44%,82% { transform: rotate(9deg); }
}
.doplock-dopi-shell-v18 .doplock-dopi-greeting-v18 {
  position: absolute;
  top: 24px;
  right: calc(100% + 10px);
  width: 246px;
  box-sizing: border-box;
  margin: 0;
  padding: 16px 18px;
  border: 1px solid #e7e3dc;
  border-radius: 18px;
  background: #fff;
  color: #111;
  box-shadow: 0 12px 36px rgb(0 0 0 / 9%);
}
.doplock-dopi-greeting-v18[hidden] { display: none !important; }
.doplock-dopi-greeting-v18::after {
  content: '';
  position: absolute;
  top: 24px;
  right: -6px;
  width: 10px;
  height: 10px;
  border-top: 1px solid #e7e3dc;
  border-right: 1px solid #e7e3dc;
  background: #fff;
  transform: rotate(45deg);
}
.doplock-dopi-shell-v18 .doplock-dopi-greeting-v18 p {
  margin: 0 0 10px;
  color: #3f3f46 !important;
  font: inherit;
  font-size: 14px;
  line-height: 1.45;
  letter-spacing: normal;
}
.doplock-dopi-greeting-v18 strong { color: #111; font-weight: 800; }
.doplock-dopi-shell-v18 .doplock-dopi-chat-link-v18 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  width: 100%;
  padding: 8px 12px;
  border: 0;
  border-radius: 999px;
  background: #111;
  color: #fff !important;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.3;
  cursor: pointer;
  touch-action: manipulation;
}
.doplock-dopi-shell-v18 .doplock-dopi-chat-link-v18 span { color: #fff !important; }
.doplock-dopi-chat-link-v18:focus-visible { outline: 2px solid #f97316; outline-offset: 3px; }
/* Opening the existing dialog is allowed even where the floating launcher is hidden. */
html body .doplock-guide-widget[data-doplock-dopi-panel-v18].is-open { display: block !important; }
html body .doplock-guide-widget[data-doplock-dopi-panel-v18][hidden] { display: none !important; }
.doplock-dopi-chat-identity-v18 {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.doplock-dopi-chat-identity-v18 .doplock-dopi-chat-avatar-v18 {
  display: block;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  max-width: 42px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  object-fit: contain;
}
html.doplock-menu-open .doplock-dopi-stage-v18 {
  visibility: hidden;
  pointer-events: none;
}
@media (max-width: 782px) {
  .doplock-dopi-stage-v18 {
    width: calc(100% - 26px);
    max-width: 430px;
    height: 108px;
  }
  .doplock-dopi-shell-v18 { right: 8px; width: 96px; height: 94px; }
  .doplock-dopi-rig-v18 { top: -18px; }
  .doplock-dopi-shell-v18 .doplock-dopi-greeting-v18 {
    top: 6px;
    right: calc(100% + 4px);
    width: min(254px, calc(100vw - 134px));
    padding: 12px;
    border-radius: 16px;
  }
  .doplock-dopi-shell-v18 .doplock-dopi-greeting-v18 p { font-size: 13px; }
  html body .doplock-guide-widget[data-doplock-dopi-panel-v18].is-open {
    right: 12px !important;
    bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important;
    width: min(390px, calc(100vw - 24px)) !important;
  }
  .doplock-guide-widget[data-doplock-dopi-panel-v18] .doplock-guide-card {
    max-height: min(620px, calc(100dvh - 36px)) !important;
  }
  .doplock-guide-widget[data-doplock-dopi-panel-v18] .doplock-guide-form input { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .doplock-dopi-rig-v18 .doplock-dopi-arm-v18,
  .doplock-dopi-shell-v18.is-greeting .doplock-dopi-arm-v18 { animation: none !important; }
  .doplock-guide-widget[data-doplock-dopi-panel-v18] { transition: none !important; }
}
