/* 滑块拼图验证码公共样式：宽度自适应容器（与输入框同宽），尺寸由 JS 按比例计算 */
.cap-box { width: 100%; margin-bottom: 14px; }
.cap-stage {
    position: relative; width: 100%;
    overflow: hidden; border-radius: 6px;
    background: #e5e7eb;
}
.cap-stage .cap-bg { width: 100%; display: block; }
.cap-stage .cap-slider {
    position: absolute; left: 0;
    cursor: grab; touch-action: none; user-select: none;
}
.cap-track {
    position: relative; height: 38px; margin-top: 10px;
    background: #f3f4f6; border: 1px solid #e5e7eb; border-radius: 4px;
    text-align: center; user-select: none;
}
.cap-track .cap-tip { font-size: 13px; color: #9ca3af; line-height: 38px; }
.cap-track .cap-btn {
    position: absolute; left: 0; top: 0; width: 40px; height: 38px;
    background: #fff; border: 1px solid #d1d5db; border-radius: 4px;
    text-align: center; line-height: 38px; cursor: pointer;
    color: #6b7280; font-size: 14px;
}
.cap-box.cap-ok .cap-track { border-color: #10b981; background: #ecfdf5; }
.cap-box.cap-ok .cap-track .cap-tip { color: #10b981; }
.cap-box.cap-ok .cap-track .cap-btn { background: #10b981; color: #fff; border-color: #10b981; display: none; }
.cap-box.cap-ok .cap-stage .cap-slider { display: none; }

.cap-box.cap-fail .cap-track { border-color: #ef4444; background: #fef2f2; }
.cap-box.cap-fail .cap-track .cap-tip { color: #ef4444; }
.cap-box.cap-fail .cap-track .cap-btn { background: #ef4444; color: #fff; border-color: #ef4444; display: none; }
.cap-box.cap-fail .cap-stage .cap-slider { display: none; }