/* =========================================================
   V101 — SMART 3D FEEDBACK
   Additive only. No 3D geometry/camera changes.
   ========================================================= */

.viewer-stage{
  position:relative;
}

.tq3d-feedback{
  position:absolute;
  top:18px;
  left:50%;
  transform:translate(-50%,-8px);
  z-index:24;
  display:flex;
  align-items:center;
  gap:8px;
  max-width:calc(100% - 36px);
  padding:9px 14px;
  border:1px solid rgba(12,110,116,.18);
  border-radius:999px;
  background:rgba(255,255,255,.94);
  color:#17484c;
  box-shadow:0 12px 28px rgba(17,73,77,.12);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  font-family:"Noto Kufi Arabic","DM Sans",Arial,sans-serif;
  font-size:12px;
  font-weight:700;
  line-height:1.35;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
}

.tq3d-feedback::before{
  content:"✓";
  display:grid;
  place-items:center;
  width:22px;
  height:22px;
  flex:0 0 22px;
  border-radius:50%;
  background:#14757a;
  color:#fff;
  font-size:12px;
}

.tq3d-feedback.is-visible{
  opacity:1;
  transform:translate(-50%,0);
}

.viewer-stage.tq3d-pulse{
  animation:tq3dStagePulse .75s ease;
}

@keyframes tq3dStagePulse{
  0%{box-shadow:0 0 0 0 rgba(20,117,122,0)}
  35%{box-shadow:0 0 0 4px rgba(20,117,122,.18)}
  100%{box-shadow:0 0 0 0 rgba(20,117,122,0)}
}

/* Floating preview gets a subtle acknowledgement too. */
#poolDock.tq3d-dock-pulse{
  animation:tq3dDockPulse .7s ease;
}

@keyframes tq3dDockPulse{
  0%{filter:none}
  40%{filter:drop-shadow(0 0 10px rgba(20,117,122,.32))}
  100%{filter:none}
}

@media(max-width:980px){
  .tq3d-feedback{
    top:12px;
    max-width:calc(100% - 24px);
    padding:8px 11px;
    font-size:11px;
  }
}