/* ============================================================================
   TOUR GUIDE — overlay + tooltip
   ============================================================================ */
.cf-tour-overlay {
  position: fixed; inset: 0;
  background: rgba(15, 23, 42, .7);
  z-index: 9000;
  pointer-events: auto;
}
.cf-tour-cutout {
  position: absolute;
  background: transparent;
  border: 2px solid #1E5BAA;
  border-radius: 8px;
  box-shadow: 0 0 0 9999px rgba(15, 23, 42, .7);
  pointer-events: none;
  animation: cf-tour-pulse 1.4s ease-in-out infinite;
}
@keyframes cf-tour-pulse {
  0%, 100% { box-shadow: 0 0 0 9999px rgba(15, 23, 42, .7), 0 0 0 0 rgba(30, 91, 170, .4); }
  50% { box-shadow: 0 0 0 9999px rgba(15, 23, 42, .7), 0 0 0 12px rgba(30, 91, 170, 0); }
}

.cf-tour-tooltip {
  position: absolute;
  z-index: 9001;
  background: #fff;
  border-radius: 12px;
  padding: 16px 18px;
  width: 320px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, .25);
  font-family: 'Inter', sans-serif;
  animation: cf-tour-fade 200ms ease-out;
}
@keyframes cf-tour-fade {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
.cf-tour-tip-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 8px;
}
.cf-tour-tip-head strong {
  font-family: 'IBM Plex Serif', serif;
  font-weight: 400;
  font-size: 16px;
  color: #0f172a;
}
.cf-tour-x {
  background: transparent; border: 0;
  cursor: pointer;
  padding: 4px;
  color: #94a3b8;
  display: flex;
}
.cf-tour-x:hover { color: #dc2626; }
.cf-tour-tip-body {
  font-size: 13px;
  color: #475569;
  line-height: 1.5;
  margin-bottom: 14px;
}
.cf-tour-tip-foot {
  display: flex; align-items: center; justify-content: space-between;
}
.cf-tour-progress {
  font-size: 11px;
  color: #94a3b8;
  font-family: 'IBM Plex Mono', monospace;
}
.cf-tour-btn {
  font-family: inherit;
  border: 0;
  border-radius: 6px;
  padding: 6px 12px;
  font-size: 12.5px;
  cursor: pointer;
  margin-left: 4px;
}
.cf-tour-btn-primary {
  background: #1E5BAA;
  color: #fff;
}
.cf-tour-btn-primary:hover { background: #143C7E; }
.cf-tour-btn-ghost {
  background: transparent;
  color: #475569;
  border: 1px solid #e2e8f0;
}
.cf-tour-btn-ghost:hover { background: #f1f5f9; }