.ccfe-form-wrap {
  max-width: 820px;
  margin: 24px auto;
}

.ccfe-before-text,
.ccfe-after-text {
  margin-bottom: 18px;
  padding: 14px 16px;
  border-radius: 14px;
  background: linear-gradient(180deg, #fafbfc 0%, #f4f6f7 100%);
  border: 1px solid #e3e7ea;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04);
}

.ccfe-category-group {
  margin-bottom: 28px;
  padding: 16px;
  border: 1px solid #e2e7e4;
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 0%, #fcfcfc 100%);
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
}

.ccfe-category-heading {
  margin-top: 0;
  margin-bottom: 16px;
  font-size: 18px;
  line-height: 1.35;
}

.ccfe-form {
  max-width: 760px;
  margin: 24px auto;
  padding: 24px;
  border: 1px solid #dde3e7;
  border-radius: 18px;
  background: #fff;
  box-sizing: border-box;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.ccfe-question-block {
  margin-bottom: 24px;
  padding: 14px 0 0;
  border-top: 1px solid #eef2f4;
}

.ccfe-question-block:first-child {
  padding-top: 0;
  border-top: 0;
}

.ccfe-question-block p:first-child {
  margin-top: 0;
}

.ccfe-question-block input[type="text"],
.ccfe-question-block input[type="email"],
.ccfe-question-block input[type="number"],
.ccfe-question-block input[type="date"],
.ccfe-question-block select,
.ccfe-question-block textarea,
.ccfe-join-pair-wrap input,
.ccfe-pair-chat-input {
  width: 100%;
  max-width: 100%;
  padding: 11px 13px;
  border: 1px solid #cfd7de;
  border-radius: 10px;
  box-sizing: border-box;
  background: #fff;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}

.ccfe-question-block input[type="text"]:focus,
.ccfe-question-block input[type="email"]:focus,
.ccfe-question-block input[type="number"]:focus,
.ccfe-question-block input[type="date"]:focus,
.ccfe-question-block select:focus,
.ccfe-question-block textarea:focus,
.ccfe-join-pair-wrap input:focus,
.ccfe-pair-chat-input:focus {
  border-color: #2271b1;
  box-shadow: 0 0 0 3px rgba(34, 113, 177, 0.10);
  outline: none;
}

.ccfe-question-block label {
  display: inline-block;
  margin-bottom: 8px;
  font-weight: 600;
  color: #1f2937;
}

/* Unified CCFE button system */
.ccfe-submit-btn,
.ccfe-form button[type="submit"],
.ccfe-form input[type="submit"],
.ccfe-mode-box .button,
.ccfe-pair-send-btn,
.ccfe-pair-chat-form button[type="submit"],
.ccfe-pair-chat-form .button,
.ccfe-pair-quick,
.ccfe-join-pair,
.ccfe-create-pair,
.ccfe-start-solo {
  -webkit-appearance: none !important;
  appearance: none !important;
  background-image: none !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #111111 !important;
  -webkit-text-fill-color: #111111 !important;
  border: 1px solid #ccd0d4 !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04) !important;
  text-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
  outline: none !important;
  cursor: pointer;
  box-sizing: border-box;
  min-height: 46px;
  padding: 12px 18px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none !important;
  -webkit-tap-highlight-color: transparent !important;
  transition:
    background-color 0.18s ease,
    border-color 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.06s ease !important;
}

.ccfe-submit-btn:hover,
.ccfe-submit-btn:focus,
.ccfe-submit-btn:focus-visible,
.ccfe-form button[type="submit"]:hover,
.ccfe-form button[type="submit"]:focus,
.ccfe-form button[type="submit"]:focus-visible,
.ccfe-form input[type="submit"]:hover,
.ccfe-form input[type="submit"]:focus,
.ccfe-form input[type="submit"]:focus-visible,
.ccfe-mode-box .button:hover,
.ccfe-mode-box .button:focus,
.ccfe-mode-box .button:focus-visible,
.ccfe-pair-send-btn:hover,
.ccfe-pair-send-btn:focus,
.ccfe-pair-send-btn:focus-visible,
.ccfe-pair-chat-form button[type="submit"]:hover,
.ccfe-pair-chat-form button[type="submit"]:focus,
.ccfe-pair-chat-form button[type="submit"]:focus-visible,
.ccfe-pair-chat-form .button:hover,
.ccfe-pair-chat-form .button:focus,
.ccfe-pair-chat-form .button:focus-visible,
.ccfe-pair-quick:hover,
.ccfe-pair-quick:focus,
.ccfe-pair-quick:focus-visible,
.ccfe-join-pair:hover,
.ccfe-join-pair:focus,
.ccfe-join-pair:focus-visible,
.ccfe-create-pair:hover,
.ccfe-create-pair:focus,
.ccfe-create-pair:focus-visible,
.ccfe-start-solo:hover,
.ccfe-start-solo:focus,
.ccfe-start-solo:focus-visible {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #111111 !important;
  -webkit-text-fill-color: #111111 !important;
  border-color: #b8bec5 !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08) !important;
  outline: none !important;
  text-decoration: none !important;
}

.ccfe-submit-btn:active,
.ccfe-form button[type="submit"]:active,
.ccfe-form input[type="submit"]:active,
.ccfe-mode-box .button:active,
.ccfe-pair-send-btn:active,
.ccfe-pair-chat-form button[type="submit"]:active,
.ccfe-pair-chat-form .button:active,
.ccfe-pair-quick:active,
.ccfe-join-pair:active,
.ccfe-create-pair:active,
.ccfe-start-solo:active {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #111111 !important;
  -webkit-text-fill-color: #111111 !important;
  border-color: #b8bec5 !important;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.06) !important;
  filter: none !important;
  transform: scale(0.99);
}

.ccfe-submit-btn:disabled,
.ccfe-submit-btn[disabled],
.ccfe-form button[type="submit"]:disabled,
.ccfe-form button[type="submit"][disabled],
.ccfe-form input[type="submit"]:disabled,
.ccfe-form input[type="submit"][disabled],
.ccfe-mode-box .button:disabled,
.ccfe-mode-box .button[disabled],
.ccfe-pair-send-btn:disabled,
.ccfe-pair-send-btn[disabled],
.ccfe-pair-chat-form button[type="submit"]:disabled,
.ccfe-pair-chat-form button[type="submit"][disabled],
.ccfe-pair-chat-form .button:disabled,
.ccfe-pair-chat-form .button[disabled] {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #111111 !important;
  -webkit-text-fill-color: #111111 !important;
  border-color: #ccd0d4 !important;
  opacity: 1 !important;
  box-shadow: none !important;
  filter: none !important;
}

.ccfe-response {
  margin-top: 16px;
  font-weight: 600;
}

.ccfe-timer-wrap {
  position: sticky;
  top: 16px;
  z-index: 5;
  margin-bottom: 20px;
  padding: 12px 14px;
  border-radius: 12px;
  background: linear-gradient(180deg, #fafbfc 0%, #f4f6f8 100%);
  border: 1px solid #dcdcde;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05);
  backdrop-filter: blur(4px);
}

.ccfe-timer-warning {
  background: #fff8e5;
  border-color: #dba617;
}

.ccfe-timer-danger {
  background: #fff1f1;
  border-color: #d63638;
}

.ccfe-review-wrap {
  margin-top: 24px;
  display: grid;
  gap: 14px;
}

.ccfe-review-item {
  border: 1px solid #dcdcde;
  border-left-width: 5px;
  border-radius: 14px;
  padding: 14px 16px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
}

.ccfe-review-correct {
  border-left-color: #00a32a;
  background: #f6fff7;
}

.ccfe-review-incorrect {
  border-left-color: #d63638;
  background: #fff6f6;
}

.ccfe-correct-answer {
  color: #00a32a;
  font-weight: 700;
}

.ccfe-review-explanation {
  margin-top: 8px;
}

.ccfe-mode-box,
.ccfe-pair-result-box {
  padding: 18px;
  border: 1px solid #dcdcde;
  border-radius: 16px;
  background: #fff;
  margin-bottom: 18px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
}

.ccfe-mode-box h3,
.ccfe-pair-result-box h3 {
  margin-top: 0;
  margin-bottom: 12px;
}

.ccfe-join-pair-wrap {
  margin-top: 16px;
}

.ccfe-join-pair-wrap input {
  max-width: 280px;
  margin-bottom: 10px;
}

.ccfe-pair-status,
.ccfe-pair-comparison {
  margin-top: 14px;
  font-weight: 600;
}

.ccfe-pair-waiting {
  color: #50575e;
}

.ccfe-pair-launch {
  margin-bottom: 18px;
}

.ccfe-mode-box .button {
  margin-right: 10px;
  margin-bottom: 10px;
}

.ccfe-pair-result-box {
  margin-top: 18px;
  background: linear-gradient(180deg, #f9fcff 0%, #f3f9ff 100%);
  border-color: #c3d9ee;
}

.ccfe-form-locked {
  opacity: 0.95;
}

.ccfe-form-locked .ccfe-question-block input,
.ccfe-form-locked .ccfe-question-block textarea,
.ccfe-form-locked .ccfe-question-block select,
.ccfe-form-locked button[type="submit"] {
  cursor: not-allowed;
}

.ccfe-form-locked .ccfe-submit-btn:disabled,
.ccfe-form-locked .ccfe-submit-btn[disabled],
.ccfe-form-locked button[type="submit"]:disabled,
.ccfe-form-locked button[type="submit"][disabled],
.ccfe-form-locked input[type="submit"]:disabled,
.ccfe-form-locked input[type="submit"][disabled] {
  background: #f7f7f7 !important;
  background-color: #f7f7f7 !important;
  color: #111111 !important;
  border-color: #ccd0d4 !important;
  opacity: 1 !important;
}

.ccfe-post-submit-panel {
  margin-bottom: 18px;
}

.ccfe-waiting-box {
  padding: 18px;
  border: 1px solid #dcdcde;
  border-radius: 14px;
  background: linear-gradient(180deg, #f9fcff 0%, #f4f9ff 100%);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

.ccfe-waiting-box h3 {
  margin-top: 0;
  margin-bottom: 10px;
}

.ccfe-processing-box {
  padding: 18px;
  border: 1px solid #eadcff;
  border-radius: 18px;
  background: linear-gradient(180deg, #fff, #faf7ff);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.06);
  text-align: center;
}

.ccfe-processing-spinner {
  width: 34px;
  height: 34px;
  margin: 0 auto 12px;
  border-radius: 50%;
  border: 3px solid #eadcff;
  border-top-color: #7a4bff;
  animation: ccfe-spin 0.9s linear infinite;
}

@keyframes ccfe-spin {
  to {
    transform: rotate(360deg);
  }
}

.ccfe-pair-insight-box {
  margin-top: 16px;
  padding: 16px;
  border: 1px solid #dcdcde;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
}

.ccfe-pair-insight-box h4 {
  margin: 0 0 10px;
}

.ccfe-pair-insight-box p {
  margin: 8px 0;
  font-weight: 400;
}

.ccfe-ai-insight-body p {
  margin: 0 0 10px;
  line-height: 1.6;
}

.ccfe-ai-insight-body p:last-child {
  margin-bottom: 0;
}

.ccfe-pair-breakdown {
  margin-top: 18px;
  display: grid;
  gap: 12px;
}

.ccfe-pair-breakdown h4 {
  margin: 0 0 6px;
}

.ccfe-pair-detail {
  border: 1px solid #dcdcde;
  border-left-width: 5px;
  border-radius: 12px;
  background: #fff;
  padding: 12px 14px;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.03);
}

.ccfe-pair-detail-match {
  border-left-color: #00a32a;
  background: #f6fff7;
}

.ccfe-pair-detail-mismatch {
  border-left-color: #d63638;
  background: #fff6f6;
}

.ccfe-pair-detail p {
  margin: 6px 0;
  font-weight: 400;
}

.ccfe-pair-chat-block {
  margin-top: 18px;
}

.ccfe-pair-chat-title {
  margin: 0 0 12px;
}

.ccfe-pair-chat-wrap {
  display: grid;
  gap: 12px;
}

.ccfe-pair-quick-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ccfe-pair-quick {
  padding: 8px 12px;
  font-size: 13px;
  border-radius: 999px !important;
}

.ccfe-pair-typing-indicator {
  font-size: 13px;
  color: #50575e;
}

.ccfe-pair-chat-messages {
  min-height: 160px;
  max-height: 320px;
  overflow-y: auto;
  border: 1px solid #dcdcde;
  border-radius: 14px;
  background: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
  padding: 12px;
  display: grid;
  gap: 10px;
  scrollbar-width: thin;
}

.ccfe-pair-empty {
  color: #666;
  font-size: 14px;
}

.ccfe-pair-msg {
  max-width: 85%;
  padding: 10px 12px;
  border-radius: 14px;
  background: #f6f7f7;
  border: 1px solid #e5e7eb;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.03);
}

.ccfe-pair-msg.mine {
  margin-left: auto;
  background: #eef6ff;
  border-color: #cfe2ff;
}

.ccfe-pair-msg-meta {
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 4px;
  color: #4b5563;
}

.ccfe-pair-msg-body {
  white-space: pre-wrap;
  word-break: break-word;
}

.ccfe-pair-msg-time {
  margin-top: 6px;
  font-size: 11px;
  color: #6b7280;
}

.ccfe-pair-msg-new {
  animation: ccfePairPulse 0.6s ease;
}

@keyframes ccfePairPulse {
  0% {
    transform: scale(0.98);
    opacity: 0.75;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

.ccfe-pair-chat-form {
  display: flex;
  gap: 10px;
  align-items: flex-end;
}

.ccfe-pair-chat-input {
  min-height: 46px;
  resize: vertical;
}

.ccfe-pair-send-btn,
.ccfe-pair-chat-form button[type="submit"] {
  white-space: nowrap;
  min-width: 56px;
}

.ccfe-pair-chat-status {
  min-height: 18px;
  font-size: 13px;
  color: #50575e;
}

.ccfe-code-expiry-line {
  display: inline-block;
  margin-top: 8px;
  padding: 7px 10px;
  border-radius: 999px;
  background: #f5f7fa;
  border: 1px solid #dde3e9;
  font-size: 12px;
  font-weight: 600;
  color: #334155;
}

.ccfe-code-expiry-time {
  font-variant-numeric: tabular-nums;
}

.ccfe-code-expiry-warning {
  background: #fff7e8;
  border-color: #efc26f;
  color: #9a5b00;
}

.ccfe-pair-chat-pending,
.ccfe-pair-msg-pending {
  opacity: 0.78;
}

.ccfe-pair-msg-pending .ccfe-pair-msg-time {
  color: #8b8f97;
  font-style: italic;
}

/* Self-Healing */
.ccfe-self-heal-state-json,
.ccfe-self-heal-config {
  display: none !important;
}

.ccfe-self-heal-enabled .ccfe-question-block {
  position: relative;
}

.ccfe-self-heal-card {
  margin-top: 10px;
  padding: 12px 14px;
  border: 1px solid #e6defa;
  border-radius: 16px;
  background: linear-gradient(180deg, #fff, #faf7ff);
  box-shadow: 0 10px 24px rgba(90, 60, 140, 0.06);
  animation: ccfeSelfHealFade 0.18s ease;
}

.ccfe-self-heal-card[data-level="1"] {
  border-color: #ddd6fe;
  background: linear-gradient(180deg, #fff, #faf7ff);
}

.ccfe-self-heal-card[data-level="2"] {
  border-color: #d9c7ff;
  background: linear-gradient(180deg, #fff, #f8f3ff);
}

.ccfe-self-heal-card[data-level="3"] {
  border-color: #cab0ff;
  background: linear-gradient(180deg, #fff, #f4edff);
}

@keyframes ccfeSelfHealFade {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ccfe-self-heal-card strong {
  font-weight: 700;
}

.ccfe-self-heal-card .ccfe-self-heal-note {
  line-height: 1.45;
}

.ccfe-self-heal-dismiss,
.ccfe-self-heal-close,
.ccfe-self-heal-skip {
  -webkit-appearance: none;
  appearance: none;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 600;
  transition:
    transform 0.08s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease,
    background-color 0.18s ease,
    color 0.18s ease;
}

.ccfe-self-heal-dismiss {
  border: 0;
  background: transparent;
  color: #8d84a3;
  width: 28px;
  height: 28px;
  min-width: 28px;
  min-height: 28px;
  padding: 0;
  line-height: 1;
  font-size: 18px;
  box-shadow: none;
}

.ccfe-self-heal-dismiss:hover,
.ccfe-self-heal-dismiss:focus {
  color: #5f5870;
  transform: scale(1.04);
  outline: none;
}

.ccfe-self-heal-close {
  border: 1px solid #d7c8ff;
  background: #ffffff;
  color: #5c4f7a;
  min-height: 38px;
  padding: 8px 12px;
  box-shadow: none;
}

.ccfe-self-heal-close:hover,
.ccfe-self-heal-close:focus {
  border-color: #c3adff;
  background: #fcfbff;
  color: #473a66;
  outline: none;
}

.ccfe-self-heal-skip {
  border: 1px solid #6f42c1;
  background: #6f42c1;
  color: #ffffff;
  min-height: 38px;
  padding: 8px 12px;
  box-shadow: 0 8px 18px rgba(111, 66, 193, 0.18);
}

.ccfe-self-heal-skip:hover,
.ccfe-self-heal-skip:focus {
  background: #6238b0;
  border-color: #6238b0;
  color: #ffffff;
  outline: none;
}

.ccfe-self-heal-close:active,
.ccfe-self-heal-skip:active,
.ccfe-self-heal-dismiss:active {
  transform: scale(0.98);
}

.ccfe-question-block.ccfe-self-heal-skipped {
  padding: 12px;
  border-radius: 16px;
  background: linear-gradient(180deg, #fff, #faf8ff);
  border: 1px dashed #d8c9ff;
}

.ccfe-question-block.ccfe-self-heal-skipped > p:first-child strong {
  color: #5f4aa5;
}

.ccfe-question-block.ccfe-self-heal-skipped input[type="text"],
.ccfe-question-block.ccfe-self-heal-skipped input[type="email"],
.ccfe-question-block.ccfe-self-heal-skipped input[type="number"],
.ccfe-question-block.ccfe-self-heal-skipped input[type="date"],
.ccfe-question-block.ccfe-self-heal-skipped select,
.ccfe-question-block.ccfe-self-heal-skipped textarea {
  border-color: #d8c9ff;
  background: #fdfcff;
}

.ccfe-question-block.ccfe-self-heal-skipped::after {
  content: "Answer later";
  display: inline-block;
  margin-top: 10px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #efe8ff;
  color: #5a4697;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.ccfe-self-heal-enabled .ccfe-question-block input:focus,
.ccfe-self-heal-enabled .ccfe-question-block select:focus,
.ccfe-self-heal-enabled .ccfe-question-block textarea:focus {
  border-color: #b59eff;
  box-shadow: 0 0 0 3px rgba(122, 75, 255, 0.10);
  outline: none;
}

.ccfe-self-heal-enabled .ccfe-question-block.ccfe-self-heal-skipped input:focus,
.ccfe-self-heal-enabled .ccfe-question-block.ccfe-self-heal-skipped select:focus,
.ccfe-self-heal-enabled .ccfe-question-block.ccfe-self-heal-skipped textarea:focus {
  box-shadow: 0 0 0 3px rgba(122, 75, 255, 0.12);
}

/* Floating pair chat */
.ccfe-pair-floating-shell {
  position: fixed;
  right: 10px;
  bottom: 10px;
  z-index: 99999;
  width: auto;
  max-width: calc(100vw - 20px);
  font-family: inherit;
}

.ccfe-pair-fab {
  position: relative;
  width: 60px;
  height: 60px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, #2271b1, #2f7ec1);
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 14px 32px rgba(34, 113, 177, 0.30);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
  padding: 0;
}

.ccfe-pair-fab:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 38px rgba(34, 113, 177, 0.34);
}

.ccfe-has-unread .ccfe-pair-fab {
  animation: ccfeFabPulse 1.5s ease-in-out infinite;
}

@keyframes ccfeFabPulse {
  0%,
  100% {
    box-shadow: 0 14px 32px rgba(34, 113, 177, 0.30);
  }
  50% {
    box-shadow: 0 18px 40px rgba(34, 113, 177, 0.42);
  }
}

.ccfe-pair-fab-icon {
  font-size: 24px;
  line-height: 1;
}

.ccfe-pair-fab-badge {
  position: absolute;
  top: -4px;
  right: -2px;
  min-width: 22px;
  height: 22px;
  line-height: 22px;
  text-align: center;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  padding: 0 6px;
  box-shadow: 0 6px 18px rgba(239, 68, 68, 0.35);
}

.ccfe-pair-floating-panel[hidden] {
  display: none !important;
}

.ccfe-pair-floating-panel {
  position: absolute;
  right: 0;
  bottom: 70px;
  width: min(420px, calc(100vw - 20px));
  max-width: calc(100vw - 20px);
  height: min(560px, calc(100vh - 120px));
  max-height: calc(100vh - 120px);
  display: flex;
  flex-direction: column;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid #dcdcde;
  background: #fff;
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.22);
  box-sizing: border-box;
}

.ccfe-pair-floating-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px;
  background: linear-gradient(135deg, #2271b1, #2f7ec1);
  color: #fff;
  min-width: 0;
  box-sizing: border-box;
  flex: 0 0 auto;
}

.ccfe-pair-floating-avatar {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex: 0 0 38px;
}

.ccfe-pair-floating-title-wrap {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
}

.ccfe-pair-floating-title {
  font-weight: 700;
  line-height: 1.2;
}

.ccfe-pair-floating-subtitle {
  font-size: 12px;
  opacity: 0.92;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ccfe-pair-floating-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
}

.ccfe-pair-floating-actions button {
  border: 0;
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
  width: 32px;
  height: 32px;
  min-width: 32px;
  min-height: 32px;
  border-radius: 10px;
  cursor: pointer;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 32px;
  transition: background-color 0.16s ease, transform 0.16s ease;
}

.ccfe-pair-floating-actions button:hover,
.ccfe-pair-floating-actions button:focus {
  background: rgba(255, 255, 255, 0.24);
  outline: none;
  transform: translateY(-1px);
}

.ccfe-pair-floating-progress {
  padding: 12px 14px;
  border-bottom: 1px solid #e5e7eb;
  background: #f8fafc;
  flex: 0 0 auto;
}

.ccfe-pair-progress-head {
  margin-bottom: 10px;
}

.ccfe-pair-progress-head .ccfe-pair-status {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  color: #334155;
}

.ccfe-pair-progress-row {
  display: grid;
  grid-template-columns: 62px 1fr;
  gap: 10px;
  align-items: center;
  margin-bottom: 8px;
}

.ccfe-pair-progress-row:last-child {
  margin-bottom: 0;
}

.ccfe-pair-progress-label {
  font-size: 13px;
  color: #475569;
}

.ccfe-pair-progress-track {
  height: 10px;
  background: #e5e7eb;
  border-radius: 999px;
  overflow: hidden;
}

.ccfe-progress-a,
.ccfe-progress-b {
  height: 100%;
  width: 0%;
  border-radius: 999px;
  transition: width 0.25s ease;
}

.ccfe-progress-a {
  background: #2271b1;
}

.ccfe-progress-b {
  background: #46b450;
}

.ccfe-pair-floating-panel .ccfe-pair-chat-wrap {
  flex: 1 1 auto;
  min-height: 0;
  padding: 12px 14px 14px;
  overflow: hidden;
}

.ccfe-pair-floating-panel .ccfe-pair-chat-messages {
  flex: 1 1 auto;
  min-height: 120px;
  max-height: none;
  overflow-y: auto;
}

.ccfe-panel-expanded .ccfe-pair-floating-panel {
  right: 0;
  bottom: 70px;
  width: min(560px, calc(100vw - 20px));
  max-width: calc(100vw - 20px);
  height: min(85vh, calc(100vh - 100px));
  max-height: calc(100vh - 100px);
}

@media (max-width: 767px) {
  .ccfe-form {
    padding: 18px;
    margin: 18px auto;
    border-radius: 16px;
  }

  .ccfe-before-text,
  .ccfe-after-text,
  .ccfe-mode-box,
  .ccfe-pair-result-box,
  .ccfe-waiting-box,
  .ccfe-processing-box,
  .ccfe-pair-insight-box,
  .ccfe-category-group {
    border-radius: 14px;
  }

  .ccfe-pair-chat-form {
    flex-direction: column;
    align-items: stretch;
  }

  .ccfe-pair-send-btn,
  .ccfe-pair-chat-form button[type="submit"] {
    width: 100%;
  }

  .ccfe-self-heal-card {
    padding: 12px;
  }

  .ccfe-self-heal-close,
  .ccfe-self-heal-skip {
    width: 100%;
    justify-content: center;
  }

  .ccfe-pair-floating-shell {
    right: 8px;
    bottom: 8px;
    max-width: calc(100vw - 16px);
  }

  .ccfe-pair-floating-panel {
    right: 0;
    bottom: 66px;
    width: calc(100vw - 16px);
    max-width: calc(100vw - 16px);
    height: min(78vh, calc(100vh - 90px));
    max-height: calc(100vh - 90px);
    border-radius: 18px;
  }

  .ccfe-pair-floating-header {
    gap: 6px;
    padding: 10px;
  }

  .ccfe-pair-floating-avatar {
    width: 32px;
    height: 32px;
    font-size: 16px;
    flex: 0 0 32px;
  }

  .ccfe-pair-floating-title {
    font-size: 14px;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .ccfe-pair-floating-subtitle {
    font-size: 11px;
  }

  .ccfe-pair-floating-actions {
    gap: 4px;
  }

  .ccfe-pair-floating-actions button {
    width: 30px;
    height: 30px;
    min-width: 30px;
    min-height: 30px;
    flex: 0 0 30px;
    border-radius: 8px;
    font-size: 14px;
  }

  .ccfe-panel-expanded .ccfe-pair-floating-panel {
    right: 0;
    bottom: 8px;
    width: calc(100vw - 16px);
    max-width: calc(100vw - 16px);
    height: min(88vh, calc(100vh - 16px));
    max-height: calc(100vh - 16px);
  }

  .ccfe-mobile-fullscreen .ccfe-pair-floating-panel {
    position: fixed;
    inset: 0;
    width: 100vw;
    max-width: 100vw;
    height: 100vh;
    max-height: 100vh;
    border-radius: 0;
    right: 0;
    bottom: 0;
  }
}

.ccfe-self-heal-card [data-ccfe-example],
.ccfe-self-heal-card .ccfe-self-heal-example {
  color: #4c4560;
}


/* Paged form flow */
.ccfe-form-progress {
  margin: 0 0 18px;
  display: grid;
  gap: 8px;
}
.ccfe-form-progress-text {
  font-size: 13px;
  font-weight: 700;
  color: #4b5563;
}
.ccfe-form-progress-bar {
  height: 10px;
  border-radius: 999px;
  background: #eef2f7;
  border: 1px solid #dde5ee;
  overflow: hidden;
}
.ccfe-form-progress-fill {
  height: 100%;
  width: 0%;
  border-radius: 999px;
  background: linear-gradient(90deg, #6f42c1 0%, #8c63d9 100%);
  transition: width 0.2s ease;
}
.ccfe-form-page.ccfe-page-hidden {
  display: none !important;
}
.ccfe-form-nav {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid #eef2f4;
}
.ccfe-page-back,
.ccfe-page-next {
  -webkit-appearance: none !important;
  appearance: none !important;
  min-height: 46px;
  padding: 12px 18px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}
.ccfe-page-back {
  background: #fff !important;
  color: #111 !important;
  border: 1px solid #ccd0d4 !important;
}
.ccfe-page-next {
  background: #6f42c1 !important;
  color: #fff !important;
  border: 1px solid #6f42c1 !important;
  margin-left: auto;
  box-shadow: 0 8px 18px rgba(111, 66, 193, 0.18);
}
.ccfe-page-next:hover,
.ccfe-page-next:focus {
  background: #6238b0 !important;
  border-color: #6238b0 !important;
}
.ccfe-page-back:hover,
.ccfe-page-back:focus {
  border-color: #b8bec5 !important;
  box-shadow: 0 8px 20px rgba(15,23,42,0.08) !important;
}
.ccfe-category-page-group {
  margin-bottom: 0;
}


/* Premium pre-start intro */
.ccfe-form-intro{
  margin: 0 0 22px;
}
.ccfe-form-intro-shell{
  padding: 24px;
  border: 1px solid #dddff2;
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(111,66,193,.08), transparent 34%),
    linear-gradient(180deg, #ffffff 0%, #faf8ff 100%);
  box-shadow: 0 18px 40px rgba(15,23,42,0.08);
}
.ccfe-form-intro-badge{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background:#f4edff;
  border:1px solid #ddd1ff;
  color:#6f42c1;
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  margin-bottom:12px;
}
.ccfe-form-intro-title{
  margin:0 0 12px;
  font-size: clamp(24px, 3vw, 34px);
  line-height:1.12;
  letter-spacing:-0.03em;
  color:#111827;
}
.ccfe-form-intro-copy{
  color:#4b5563;
  line-height:1.7;
  font-size:15px;
}
.ccfe-form-intro-copy p:last-child{
  margin-bottom:0;
}
.ccfe-form-intro-registered,
.ccfe-form-intro-sharing{
  margin-top:16px;
  padding:14px 16px;
  border:1px solid #e7e9f4;
  border-radius:16px;
  background:#ffffff;
}
.ccfe-form-intro-registered strong,
.ccfe-form-intro-sharing strong{
  display:block;
  margin-bottom:8px;
  color:#111827;
}
.ccfe-form-intro-sharing-list{
  display:grid;
  gap:10px;
}
.ccfe-form-intro-sharing-item{
  display:grid;
  gap:4px;
}
.ccfe-form-intro-sharing-label{
  font-size:12px;
  font-weight:700;
  color:#6b7280;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.ccfe-form-intro-sharing-text{
  color:#374151;
  line-height:1.5;
}
.ccfe-form-intro-actions{
  margin-top:20px;
  display:flex;
  justify-content:flex-start;
}
.ccfe-begin-form{
  min-width:160px;
  min-height:48px;
  border-radius:999px !important;
  font-weight:700 !important;
  box-shadow:0 14px 30px rgba(111,66,193,.22) !important;
}
@media (max-width: 768px){
  .ccfe-form-intro-shell{
    padding:18px;
    border-radius:18px;
  }
  .ccfe-form-intro-title{
    font-size:26px;
  }
}

/* v2: premium theme system */
.ccfe-form-wrap {
  --ccfe-theme-accent: #6f42c1;
  --ccfe-theme-accent-dark: #6238b0;
  --ccfe-theme-shell-border: #dddff2;
  --ccfe-theme-shell-bg: radial-gradient(circle at top right, rgba(111,66,193,.08), transparent 34%), linear-gradient(180deg, #ffffff 0%, #faf8ff 100%);
  --ccfe-theme-form-bg: #ffffff;
  --ccfe-theme-form-border: #dde3e7;
  --ccfe-theme-form-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
  --ccfe-theme-badge-bg: #f4edff;
  --ccfe-theme-badge-border: #ddd1ff;
  --ccfe-theme-badge-text: #6f42c1;
  --ccfe-theme-title: #111827;
  --ccfe-theme-copy: #4b5563;
  --ccfe-theme-panel-bg: #ffffff;
  --ccfe-theme-panel-border: #e7e9f4;
  --ccfe-theme-progress: linear-gradient(90deg, #6f42c1 0%, #8c63d9 100%);
}

.ccfe-form-intro-shell {
  border-color: var(--ccfe-theme-shell-border);
  background: var(--ccfe-theme-shell-bg);
}

.ccfe-form-intro-badge {
  background: var(--ccfe-theme-badge-bg);
  border-color: var(--ccfe-theme-badge-border);
  color: var(--ccfe-theme-badge-text);
}

.ccfe-form-intro-title,
.ccfe-theme-custom-photo .ccfe-form-intro-title {
  color: var(--ccfe-theme-title);
}

.ccfe-form-intro-copy,
.ccfe-form-intro-sharing-text,
.ccfe-form-intro-section-body,
.ccfe-form-intro-section-body div,
.ccfe-form-intro-section-body p {
  color: var(--ccfe-theme-copy);
}

.ccfe-form-intro-registered,
.ccfe-form-intro-sharing,
.ccfe-form-intro-section {
  background: var(--ccfe-theme-panel-bg);
  border-color: var(--ccfe-theme-panel-border);
}

.ccfe-form {
  border-color: var(--ccfe-theme-form-border);
  background: var(--ccfe-theme-form-bg);
  box-shadow: var(--ccfe-theme-form-shadow);
}

.ccfe-page-next,
.ccfe-submit-btn.ccfe-theme-accent,
.ccfe-theme-aurora-slate .ccfe-begin-form,
.ccfe-theme-royal-glow .ccfe-begin-form,
.ccfe-theme-forest-editorial .ccfe-begin-form,
.ccfe-theme-sunset-copper .ccfe-begin-form,
.ccfe-theme-ocean-glass .ccfe-begin-form,
.ccfe-theme-midnight-luxe .ccfe-begin-form,
.ccfe-theme-custom-photo .ccfe-begin-form {
  background: var(--ccfe-theme-accent) !important;
  border-color: var(--ccfe-theme-accent) !important;
  color: #fff !important;
}

.ccfe-page-next:hover,
.ccfe-page-next:focus,
.ccfe-begin-form:hover,
.ccfe-begin-form:focus {
  background: var(--ccfe-theme-accent-dark) !important;
  border-color: var(--ccfe-theme-accent-dark) !important;
}

.ccfe-form-progress-fill {
  background: var(--ccfe-theme-progress);
}

.ccfe-theme-aurora-slate {
  --ccfe-theme-accent: #5b6cff;
  --ccfe-theme-accent-dark: #4454dd;
  --ccfe-theme-shell-border: #d9defb;
  --ccfe-theme-shell-bg: radial-gradient(circle at top right, rgba(91,108,255,.12), transparent 30%), linear-gradient(180deg, #f8faff 0%, #eef3ff 100%);
  --ccfe-theme-badge-bg: #eef1ff;
  --ccfe-theme-badge-border: #d6ddff;
  --ccfe-theme-badge-text: #4454dd;
  --ccfe-theme-progress: linear-gradient(90deg, #5b6cff 0%, #8d9cff 100%);
}

.ccfe-theme-royal-glow {
  --ccfe-theme-accent: #6f42c1;
  --ccfe-theme-accent-dark: #56319d;
  --ccfe-theme-shell-border: #e1d7f4;
  --ccfe-theme-shell-bg: radial-gradient(circle at top right, rgba(111,66,193,.14), transparent 30%), linear-gradient(180deg, #ffffff 0%, #f8f2ff 100%);
  --ccfe-theme-badge-bg: #f2eaff;
  --ccfe-theme-badge-border: #ddccff;
  --ccfe-theme-badge-text: #6b37cf;
  --ccfe-theme-progress: linear-gradient(90deg, #6f42c1 0%, #a06de0 100%);
}

.ccfe-theme-forest-editorial {
  --ccfe-theme-accent: #216e5a;
  --ccfe-theme-accent-dark: #185645;
  --ccfe-theme-shell-border: #d7ece4;
  --ccfe-theme-shell-bg: radial-gradient(circle at top right, rgba(33,110,90,.10), transparent 30%), linear-gradient(180deg, #ffffff 0%, #f2fbf7 100%);
  --ccfe-theme-badge-bg: #edf9f4;
  --ccfe-theme-badge-border: #d1ecdf;
  --ccfe-theme-badge-text: #216e5a;
  --ccfe-theme-progress: linear-gradient(90deg, #216e5a 0%, #46a082 100%);
}

.ccfe-theme-sunset-copper {
  --ccfe-theme-accent: #c56a2d;
  --ccfe-theme-accent-dark: #a95218;
  --ccfe-theme-shell-border: #f0dccf;
  --ccfe-theme-shell-bg: radial-gradient(circle at top right, rgba(197,106,45,.10), transparent 30%), linear-gradient(180deg, #fffdfb 0%, #fff4eb 100%);
  --ccfe-theme-badge-bg: #fff1e4;
  --ccfe-theme-badge-border: #f3d3b7;
  --ccfe-theme-badge-text: #b55d22;
  --ccfe-theme-progress: linear-gradient(90deg, #c56a2d 0%, #e39a61 100%);
}

.ccfe-theme-ocean-glass {
  --ccfe-theme-accent: #0f6e8f;
  --ccfe-theme-accent-dark: #0b5872;
  --ccfe-theme-shell-border: #d7ebf1;
  --ccfe-theme-shell-bg: radial-gradient(circle at top right, rgba(15,110,143,.10), transparent 30%), linear-gradient(180deg, #fbfeff 0%, #eef9fd 100%);
  --ccfe-theme-badge-bg: #e7f7fc;
  --ccfe-theme-badge-border: #cdebf6;
  --ccfe-theme-badge-text: #0f6e8f;
  --ccfe-theme-progress: linear-gradient(90deg, #0f6e8f 0%, #43abc9 100%);
}

.ccfe-theme-midnight-luxe {
  --ccfe-theme-accent: #111827;
  --ccfe-theme-accent-dark: #000000;
  --ccfe-theme-shell-border: #2b3242;
  --ccfe-theme-shell-bg: radial-gradient(circle at top right, rgba(255,215,128,.12), transparent 26%), linear-gradient(180deg, #121826 0%, #1a2233 100%);
  --ccfe-theme-form-bg: #ffffff;
  --ccfe-theme-form-border: #d6dbe4;
  --ccfe-theme-badge-bg: rgba(255,214,102,.10);
  --ccfe-theme-badge-border: rgba(255,214,102,.25);
  --ccfe-theme-badge-text: #f3d184;
  --ccfe-theme-title: #f8fafc;
  --ccfe-theme-copy: #d6dbe4;
  --ccfe-theme-panel-bg: rgba(255,255,255,.06);
  --ccfe-theme-panel-border: rgba(255,255,255,.12);
  --ccfe-theme-progress: linear-gradient(90deg, #d4af37 0%, #f1da85 100%);
}
.ccfe-theme-midnight-luxe .ccfe-form-intro-sharing-label,
.ccfe-theme-custom-photo .ccfe-form-intro-sharing-label {
  color: rgba(255,255,255,.82);
}
.ccfe-theme-midnight-luxe .ccfe-form-intro-section-title,
.ccfe-theme-custom-photo .ccfe-form-intro-section-title {
  color: #ffffff;
}

.ccfe-theme-custom-photo {
  position: relative;
  padding: 16px;
  border-radius: 28px;
  overflow: hidden;
}
.ccfe-theme-custom-photo::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--ccfe-theme-photo);
  background-size: cover;
  background-position: center;
  transform: scale(1.02);
}
.ccfe-theme-custom-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10,14,24,var(--ccfe-theme-photo-overlay, .58)) 0%, rgba(10,14,24,calc(var(--ccfe-theme-photo-overlay, .58) + .10)) 100%);
}
.ccfe-theme-custom-photo > * {
  position: relative;
  z-index: 1;
}
.ccfe-theme-custom-photo .ccfe-form-intro-shell {
  border-color: rgba(255,255,255,.18);
  background: linear-gradient(180deg, rgba(9,14,22,.60) 0%, rgba(9,14,22,.48) 100%);
  box-shadow: 0 22px 44px rgba(0,0,0,.20);
}
.ccfe-theme-custom-photo .ccfe-form {
  background: rgba(255,255,255,.94);
  border-color: rgba(255,255,255,.35);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 40px rgba(0,0,0,.14);
}
.ccfe-theme-custom-photo .ccfe-form-intro-copy,
.ccfe-theme-custom-photo .ccfe-form-intro-sharing-text,
.ccfe-theme-custom-photo .ccfe-form-intro-section-body,
.ccfe-theme-custom-photo .ccfe-form-intro-section-body div,
.ccfe-theme-custom-photo .ccfe-form-intro-section-body p {
  color: rgba(255,255,255,.92);
}
.ccfe-theme-custom-photo .ccfe-form-intro-badge {
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.18);
  color: #ffffff;
}
.ccfe-theme-custom-photo .ccfe-form-intro-registered,
.ccfe-theme-custom-photo .ccfe-form-intro-sharing,
.ccfe-theme-custom-photo .ccfe-form-intro-section {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.16);
}

/* Mobile-only collapsible intro sections */
.ccfe-form-intro-section-toggle {
  display: none;
}

@media (max-width: 768px) {
  .ccfe-form-intro-section {
    overflow: hidden;
  }
  .ccfe-form-intro-section-toggle {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0;
    border: 0;
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
  }
  .ccfe-form-intro-section-title {
    font-weight: 700;
    color: #111827;
  }
  .ccfe-form-intro-section-icon {
    transition: transform .18s ease;
    color: inherit;
  }
  .ccfe-form-intro-section.is-collapsed .ccfe-form-intro-section-icon {
    transform: rotate(-90deg);
  }
  .ccfe-form-intro-section-body {
    margin-top: 10px;
  }
  .ccfe-form-intro-section.is-collapsed .ccfe-form-intro-section-body {
    display: none;
  }
}

/* v3: stronger premium theme rendering on the actual form page */
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-category-group {
  border-color: var(--ccfe-theme-panel-border);
  background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.88) 100%);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block {
  border-top-color: color-mix(in srgb, var(--ccfe-theme-panel-border) 72%, #ffffff 28%);
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block label,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-category-heading,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-form-progress-text,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-response {
  color: var(--ccfe-theme-title);
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="text"],
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="email"],
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="number"],
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="date"],
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block select,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block textarea {
  border-color: color-mix(in srgb, var(--ccfe-theme-panel-border) 78%, #cfd7de 22%);
  background: #ffffff;
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="text"]:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="email"]:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="number"]:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="date"]:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block select:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block textarea:focus {
  border-color: var(--ccfe-theme-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ccfe-theme-accent) 14%, transparent 86%);
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-timer-wrap,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-review-item,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-mode-box,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-pair-result-box,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-waiting-box,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-pair-insight-box {
  border-color: var(--ccfe-theme-panel-border);
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-timer-wrap {
  background: linear-gradient(180deg, color-mix(in srgb, var(--ccfe-theme-shell-bg) 62%, #ffffff 38%) 0%, #ffffff 100%);
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-page-next,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-submit-btn.ccfe-theme-accent,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-begin-form {
  background: var(--ccfe-theme-accent) !important;
  border-color: var(--ccfe-theme-accent) !important;
  color: #ffffff !important;
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-page-next:hover,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-page-next:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-submit-btn.ccfe-theme-accent:hover,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-submit-btn.ccfe-theme-accent:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-begin-form:hover,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-begin-form:focus {
  background: var(--ccfe-theme-accent-dark) !important;
  border-color: var(--ccfe-theme-accent-dark) !important;
}

.ccfe-form.ccfe-theme-midnight-luxe,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-form {
  background: rgba(255,255,255,.98);
}

.ccfe-form.ccfe-theme-custom-photo,
.ccfe-form-wrap.ccfe-theme-custom-photo .ccfe-form {
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(10px);
}

/* v3: stronger live-form theme rendering */
.ccfe-form-wrap[class*="ccfe-theme-"] {
  border-radius: 26px;
  padding: 18px;
  background: var(--ccfe-theme-shell-bg);
  border: 1px solid var(--ccfe-theme-shell-border);
  box-shadow: 0 18px 40px rgba(15,23,42,.08);
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-form {
  background: var(--ccfe-theme-form-bg);
  border: 1px solid var(--ccfe-theme-form-border);
  box-shadow: var(--ccfe-theme-form-shadow);
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-category-group,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-before-text,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-after-text,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-waiting-box,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-processing-box,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-pair-result-box,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-mode-box {
  background: var(--ccfe-theme-panel-bg);
  border-color: var(--ccfe-theme-panel-border);
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block {
  border-top-color: color-mix(in srgb, var(--ccfe-theme-accent) 14%, #eef2f4);
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-category-heading,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block label,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-form-progress-text,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-response {
  color: var(--ccfe-theme-title);
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-timer-wrap {
  background: linear-gradient(180deg, color-mix(in srgb, var(--ccfe-theme-accent) 8%, #ffffff) 0%, color-mix(in srgb, var(--ccfe-theme-accent) 3%, #f4f6f8) 100%);
  border-color: color-mix(in srgb, var(--ccfe-theme-accent) 24%, #dcdcde);
  box-shadow: 0 6px 18px color-mix(in srgb, var(--ccfe-theme-accent) 10%, rgba(15,23,42,.05));
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-page-next,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-submit-btn,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-form button[type="submit"],
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-form input[type="submit"] {
  background: var(--ccfe-theme-accent) !important;
  border-color: var(--ccfe-theme-accent) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px color-mix(in srgb, var(--ccfe-theme-accent) 26%, rgba(15,23,42,.08)) !important;
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-page-next:hover,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-page-next:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-submit-btn:hover,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-submit-btn:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-form button[type="submit"]:hover,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-form button[type="submit"]:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-form input[type="submit"]:hover,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-form input[type="submit"]:focus {
  background: var(--ccfe-theme-accent-dark) !important;
  border-color: var(--ccfe-theme-accent-dark) !important;
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-page-back {
  border-color: color-mix(in srgb, var(--ccfe-theme-accent) 20%, #ccd0d4) !important;
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="text"],
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="email"],
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="number"],
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="date"],
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block select,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block textarea {
  border-color: color-mix(in srgb, var(--ccfe-theme-accent) 16%, #cfd7de);
}

.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="text"]:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="email"]:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="number"]:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block input[type="date"]:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block select:focus,
.ccfe-form-wrap[class*="ccfe-theme-"] .ccfe-question-block textarea:focus {
  border-color: var(--ccfe-theme-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ccfe-theme-accent) 16%, transparent);
}

.ccfe-theme-midnight-luxe .ccfe-form,
.ccfe-theme-midnight-luxe .ccfe-category-group,
.ccfe-theme-midnight-luxe .ccfe-before-text,
.ccfe-theme-midnight-luxe .ccfe-after-text,
.ccfe-theme-midnight-luxe .ccfe-mode-box,
.ccfe-theme-midnight-luxe .ccfe-pair-result-box,
.ccfe-theme-midnight-luxe .ccfe-waiting-box,
.ccfe-theme-midnight-luxe .ccfe-processing-box {
  background: rgba(255,255,255,.97);
}

.ccfe-theme-custom-photo {
  background-image: var(--ccfe-theme-photo);
  background-size: cover;
  background-position: center;
}

.ccfe-theme-custom-photo .ccfe-form {
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(10px);
}

.ccfe-theme-custom-photo .ccfe-question-block,
.ccfe-theme-custom-photo .ccfe-form-progress-text,
.ccfe-theme-custom-photo .ccfe-category-heading,
.ccfe-theme-custom-photo .ccfe-question-block label {
  color: #111827;
}


/* v4: ensure selected theme renders on the live form even when the wrapper selector is bypassed */
.ccfe-form[class*="ccfe-theme-"] {
  border-color: var(--ccfe-theme-form-border);
  background: var(--ccfe-theme-form-bg);
  box-shadow: var(--ccfe-theme-form-shadow);
}

.ccfe-form[class*="ccfe-theme-"] .ccfe-form-progress-fill {
  background: var(--ccfe-theme-progress);
}

.ccfe-form[class*="ccfe-theme-"] .ccfe-form-progress-text,
.ccfe-form[class*="ccfe-theme-"] .ccfe-category-heading,
.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block label,
.ccfe-form[class*="ccfe-theme-"] .ccfe-response,
.ccfe-form[class*="ccfe-theme-"] .ccfe-timer-wrap {
  color: var(--ccfe-theme-title);
}

.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block {
  border-top-color: color-mix(in srgb, var(--ccfe-theme-panel-border) 72%, #ffffff 28%);
}

.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block input[type="text"],
.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block input[type="email"],
.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block input[type="number"],
.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block input[type="date"],
.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block select,
.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block textarea {
  border-color: color-mix(in srgb, var(--ccfe-theme-panel-border) 78%, #cfd7de 22%);
  background: #ffffff;
}

.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block input[type="text"]:focus,
.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block input[type="email"]:focus,
.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block input[type="number"]:focus,
.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block input[type="date"]:focus,
.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block select:focus,
.ccfe-form[class*="ccfe-theme-"] .ccfe-question-block textarea:focus {
  border-color: var(--ccfe-theme-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ccfe-theme-accent) 18%, transparent);
}

.ccfe-form[class*="ccfe-theme-"] .ccfe-timer-wrap {
  background: linear-gradient(180deg, color-mix(in srgb, var(--ccfe-theme-accent) 8%, #ffffff) 0%, color-mix(in srgb, var(--ccfe-theme-accent) 3%, #f4f6f8) 100%);
  border-color: color-mix(in srgb, var(--ccfe-theme-accent) 24%, #dcdcde);
  box-shadow: 0 6px 18px color-mix(in srgb, var(--ccfe-theme-accent) 10%, rgba(15,23,42,.05));
}

.ccfe-form[class*="ccfe-theme-"] .ccfe-page-next,
.ccfe-form[class*="ccfe-theme-"] .ccfe-submit-btn,
.ccfe-form[class*="ccfe-theme-"] button[type="submit"],
.ccfe-form[class*="ccfe-theme-"] input[type="submit"] {
  background: var(--ccfe-theme-accent) !important;
  border-color: var(--ccfe-theme-accent) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px color-mix(in srgb, var(--ccfe-theme-accent) 26%, rgba(15,23,42,.08)) !important;
}

.ccfe-form[class*="ccfe-theme-"] .ccfe-page-next:hover,
.ccfe-form[class*="ccfe-theme-"] .ccfe-page-next:focus,
.ccfe-form[class*="ccfe-theme-"] .ccfe-submit-btn:hover,
.ccfe-form[class*="ccfe-theme-"] .ccfe-submit-btn:focus,
.ccfe-form[class*="ccfe-theme-"] button[type="submit"]:hover,
.ccfe-form[class*="ccfe-theme-"] button[type="submit"]:focus,
.ccfe-form[class*="ccfe-theme-"] input[type="submit"]:hover,
.ccfe-form[class*="ccfe-theme-"] input[type="submit"]:focus {
  background: var(--ccfe-theme-accent-dark) !important;
  border-color: var(--ccfe-theme-accent-dark) !important;
}

.ccfe-form[class*="ccfe-theme-"] .ccfe-page-back {
  border-color: color-mix(in srgb, var(--ccfe-theme-accent) 20%, #ccd0d4) !important;
}

.ccfe-form[class*="ccfe-theme-"] .ccfe-page-back:hover,
.ccfe-form[class*="ccfe-theme-"] .ccfe-page-back:focus {
  border-color: var(--ccfe-theme-accent) !important;
  box-shadow: 0 8px 20px color-mix(in srgb, var(--ccfe-theme-accent) 16%, rgba(15,23,42,.08)) !important;
}

.ccfe-form.ccfe-theme-custom-photo {
  background: rgba(255,255,255,.94);
  border-color: rgba(255,255,255,.35);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 40px rgba(0,0,0,.14);
}


/* v6 targeted fixes: Midnight Luxe intro readability + Custom Photo sticky timer/readability */

/* ---------- Midnight Luxe: lighter, more readable intro/start page ---------- */
.ccfe-theme-midnight-luxe::after {
  background: linear-gradient(180deg, rgba(13, 18, 28, 0.46) 0%, rgba(13, 18, 28, 0.58) 100%) !important;
}

.ccfe-theme-midnight-luxe .ccfe-form-intro-shell {
  background: linear-gradient(180deg, rgba(17, 24, 39, 0.40) 0%, rgba(17, 24, 39, 0.52) 100%) !important;
  border-color: rgba(255,255,255,0.18) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.18) !important;
}

.ccfe-theme-midnight-luxe .ccfe-form-intro-title,
.ccfe-theme-midnight-luxe .ccfe-form-intro-copy,
.ccfe-theme-midnight-luxe .ccfe-form-intro-copy p,
.ccfe-theme-midnight-luxe .ccfe-form-intro-sharing-label,
.ccfe-theme-midnight-luxe .ccfe-form-intro-sharing-text,
.ccfe-theme-midnight-luxe .ccfe-form-intro-section-title,
.ccfe-theme-midnight-luxe .ccfe-form-intro-section-body,
.ccfe-theme-midnight-luxe .ccfe-form-intro-section-body p,
.ccfe-theme-midnight-luxe .ccfe-form-intro-section-body div,
.ccfe-theme-midnight-luxe .ccfe-form-intro-registered,
.ccfe-theme-midnight-luxe .ccfe-form-intro-meta,
.ccfe-theme-midnight-luxe .ccfe-form-intro-email,
.ccfe-theme-midnight-luxe .ccfe-form-progress-text {
  color: #ffffff !important;
  text-shadow: 0 2px 10px rgba(0,0,0,0.34) !important;
}

.ccfe-theme-midnight-luxe .ccfe-form-intro-title {
  font-weight: 800 !important;
  letter-spacing: -0.02em;
}

.ccfe-theme-midnight-luxe .ccfe-form-intro-badge,
.ccfe-theme-midnight-luxe .ccfe-form-intro-registered,
.ccfe-theme-midnight-luxe .ccfe-form-intro-sharing,
.ccfe-theme-midnight-luxe .ccfe-form-intro-section {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,255,255,0.18) !important;
  backdrop-filter: blur(8px);
}

.ccfe-theme-midnight-luxe .ccfe-start-solo,
.ccfe-theme-midnight-luxe .ccfe-begin-form,
.ccfe-theme-midnight-luxe .ccfe-submit-btn {
  box-shadow: 0 14px 30px rgba(17,24,39,0.32) !important;
}

/* ---------- Custom Photo: cleaner photo, lighter intro text/cards, sticky timer ---------- */
.ccfe-theme-custom-photo,
.ccfe-form-wrap.ccfe-theme-custom-photo {
  overflow: visible !important;
}

.ccfe-theme-custom-photo::before,
.ccfe-form-wrap.ccfe-theme-custom-photo::before {
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  filter: none !important;
}

.ccfe-theme-custom-photo::after,
.ccfe-form-wrap.ccfe-theme-custom-photo::after {
  background: linear-gradient(180deg, rgba(9, 14, 24, 0.48) 0%, rgba(9, 14, 24, 0.62) 100%) !important;
}

.ccfe-theme-custom-photo .ccfe-form-intro-shell {
  background: linear-gradient(180deg, rgba(16, 24, 40, 0.30) 0%, rgba(16, 24, 40, 0.42) 100%) !important;
  border-color: rgba(255,255,255,0.20) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.16) !important;
}

.ccfe-theme-custom-photo .ccfe-form-intro-title,
.ccfe-theme-custom-photo .ccfe-form-intro-copy,
.ccfe-theme-custom-photo .ccfe-form-intro-copy p,
.ccfe-theme-custom-photo .ccfe-form-intro-sharing-label,
.ccfe-theme-custom-photo .ccfe-form-intro-sharing-text,
.ccfe-theme-custom-photo .ccfe-form-intro-section-title,
.ccfe-theme-custom-photo .ccfe-form-intro-section-body,
.ccfe-theme-custom-photo .ccfe-form-intro-section-body p,
.ccfe-theme-custom-photo .ccfe-form-intro-section-body div,
.ccfe-theme-custom-photo .ccfe-form-intro-registered,
.ccfe-theme-custom-photo .ccfe-form-intro-meta,
.ccfe-theme-custom-photo .ccfe-form-intro-email,
.ccfe-theme-custom-photo .ccfe-form-progress-text {
  color: #ffffff !important;
  text-shadow: 0 2px 10px rgba(0,0,0,0.34) !important;
}

.ccfe-theme-custom-photo .ccfe-form-intro-title {
  font-weight: 800 !important;
  letter-spacing: -0.02em;
}

.ccfe-theme-custom-photo .ccfe-form-intro-badge,
.ccfe-theme-custom-photo .ccfe-form-intro-registered,
.ccfe-theme-custom-photo .ccfe-form-intro-sharing,
.ccfe-theme-custom-photo .ccfe-form-intro-section {
  background: rgba(255,255,255,0.14) !important;
  border-color: rgba(255,255,255,0.24) !important;
  backdrop-filter: blur(10px);
}

.ccfe-form.ccfe-theme-custom-photo .ccfe-timer-wrap,
.ccfe-form-wrap.ccfe-theme-custom-photo .ccfe-timer-wrap {
  position: sticky !important;
  top: 16px !important;
  z-index: 8 !important;
  background: rgba(255,255,255,0.94) !important;
  border-color: rgba(17,24,39,0.10) !important;
  color: #111827 !important;
  backdrop-filter: blur(10px);
}

.ccfe-form.ccfe-theme-custom-photo .ccfe-form-progress-text,
.ccfe-form-wrap.ccfe-theme-custom-photo .ccfe-form-progress-text,
.ccfe-form.ccfe-theme-custom-photo .ccfe-response,
.ccfe-form-wrap.ccfe-theme-custom-photo .ccfe-response,
.ccfe-form.ccfe-theme-custom-photo .ccfe-question-block,
.ccfe-form-wrap.ccfe-theme-custom-photo .ccfe-question-block,
.ccfe-form.ccfe-theme-custom-photo .ccfe-question-block p,
.ccfe-form-wrap.ccfe-theme-custom-photo .ccfe-question-block p,
.ccfe-form.ccfe-theme-custom-photo .ccfe-question-block label,
.ccfe-form-wrap.ccfe-theme-custom-photo .ccfe-question-block label {
  color: #111827 !important;
}

.ccfe-form.ccfe-theme-custom-photo .ccfe-question-block input,
.ccfe-form.ccfe-theme-custom-photo .ccfe-question-block select,
.ccfe-form.ccfe-theme-custom-photo .ccfe-question-block textarea,
.ccfe-form-wrap.ccfe-theme-custom-photo .ccfe-question-block input,
.ccfe-form-wrap.ccfe-theme-custom-photo .ccfe-question-block select,
.ccfe-form-wrap.ccfe-theme-custom-photo .ccfe-question-block textarea {
  color: #111827 !important;
  background: rgba(255,255,255,0.98) !important;
}

.ccfe-form.ccfe-theme-custom-photo .ccfe-question-block input::placeholder,
.ccfe-form.ccfe-theme-custom-photo .ccfe-question-block textarea::placeholder,
.ccfe-form-wrap.ccfe-theme-custom-photo .ccfe-question-block input::placeholder,
.ccfe-form-wrap.ccfe-theme-custom-photo .ccfe-question-block textarea::placeholder {
  color: #6b7280 !important;
}


/* v7 Midnight Luxe live-form readability fix only */
.ccfe-form.ccfe-theme-midnight-luxe,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-form {
  background: rgba(255,255,255,.985) !important;
  border-color: #d6dbe4 !important;
}

.ccfe-form.ccfe-theme-midnight-luxe .ccfe-form-progress-text,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-form-progress-text,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-response,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-response,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-category-heading,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-category-heading,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-question-block,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-question-block,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-question-block p,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-question-block p,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-question-block label,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-question-block label,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-timer-wrap,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-timer-wrap,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-page-back,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-page-back {
  color: #111827 !important;
}

.ccfe-form.ccfe-theme-midnight-luxe .ccfe-question-block input,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-question-block select,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-question-block textarea,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-question-block input,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-question-block select,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-question-block textarea {
  color: #111827 !important;
  background: #ffffff !important;
}

.ccfe-form.ccfe-theme-midnight-luxe .ccfe-question-block input::placeholder,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-question-block textarea::placeholder,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-question-block input::placeholder,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-question-block textarea::placeholder {
  color: #6b7280 !important;
}

.ccfe-form.ccfe-theme-midnight-luxe .ccfe-timer-wrap,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-timer-wrap {
  position: sticky !important;
  top: 16px !important;
  z-index: 8 !important;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%) !important;
  border-color: #d7dce5 !important;
  box-shadow: 0 8px 20px rgba(15,23,42,.08) !important;
}

.ccfe-form.ccfe-theme-midnight-luxe .ccfe-form-progress-bar,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-form-progress-bar {
  background: #eceff3 !important;
  border-color: #dde3ea !important;
}

.ccfe-form.ccfe-theme-midnight-luxe .ccfe-question-block input[type="radio"],
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-question-block input[type="checkbox"],
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-question-block input[type="radio"],
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-question-block input[type="checkbox"] {
  accent-color: #111827;
  filter: none !important;
  opacity: 1 !important;
}

.ccfe-form.ccfe-theme-midnight-luxe .ccfe-question-block label *,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-question-block label * {
  color: inherit !important;
}

.ccfe-form.ccfe-theme-midnight-luxe .ccfe-page-next,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-page-next,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-submit-btn,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-submit-btn,
.ccfe-form.ccfe-theme-midnight-luxe button[type="submit"],
.ccfe-form-wrap.ccfe-theme-midnight-luxe button[type="submit"],
.ccfe-form.ccfe-theme-midnight-luxe input[type="submit"],
.ccfe-form-wrap.ccfe-theme-midnight-luxe input[type="submit"] {
  color: #ffffff !important;
}


.ccfe-payment-notice {
  border-width: 1px;
}
.ccfe-payment-notice-success {
  background: linear-gradient(180deg, #f4fff7 0%, #ecfff1 100%);
  border-color: #b7e0c2;
}
.ccfe-payment-notice-error {
  background: linear-gradient(180deg, #fff7f7 0%, #fff1f1 100%);
  border-color: #efb7b7;
}
.ccfe-payment-unlock-status.is-error { color: #b42318; }
.ccfe-payment-unlock-status.is-success { color: #027a48; }


/* v8 Midnight Luxe polish: payment gate readability + visible action buttons */
.ccfe-theme-midnight-luxe .ccfe-payment-unlock,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-payment-unlock,
.ccfe-theme-midnight-luxe .ccfe-mode-box.ccfe-payment-unlock,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-mode-box.ccfe-payment-unlock {
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.96) 0%, rgba(241, 245, 249, 0.94) 100%) !important;
  border: 1px solid rgba(214, 219, 228, 0.98) !important;
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.12) !important;
  color: #111827 !important;
}

.ccfe-theme-midnight-luxe .ccfe-payment-unlock h3,
.ccfe-theme-midnight-luxe .ccfe-payment-unlock p,
.ccfe-theme-midnight-luxe .ccfe-payment-unlock strong,
.ccfe-theme-midnight-luxe .ccfe-payment-unlock div,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-payment-unlock h3,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-payment-unlock p,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-payment-unlock strong,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-payment-unlock div {
  color: #111827 !important;
  text-shadow: none !important;
}

.ccfe-theme-midnight-luxe .ccfe-payment-unlock .ccfe-payment-unlock-status,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-payment-unlock .ccfe-payment-unlock-status {
  color: #334155 !important;
}

.ccfe-theme-midnight-luxe .ccfe-payment-unlock .ccfe-payment-unlock-status.is-error,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-payment-unlock .ccfe-payment-unlock-status.is-error {
  color: #b42318 !important;
}

.ccfe-theme-midnight-luxe .ccfe-payment-unlock .ccfe-payment-unlock-status.is-success,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-payment-unlock .ccfe-payment-unlock-status.is-success {
  color: #027a48 !important;
}

.ccfe-theme-midnight-luxe .ccfe-submit-btn,
.ccfe-theme-midnight-luxe button[type="submit"],
.ccfe-theme-midnight-luxe input[type="submit"],
.ccfe-theme-midnight-luxe .ccfe-page-next,
.ccfe-theme-midnight-luxe .ccfe-payment-unlock-btn,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-submit-btn,
.ccfe-form-wrap.ccfe-theme-midnight-luxe button[type="submit"],
.ccfe-form-wrap.ccfe-theme-midnight-luxe input[type="submit"],
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-page-next,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-payment-unlock-btn {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #111111 !important;
  -webkit-text-fill-color: #111111 !important;
  border: 1px solid #cfd6dd !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12) !important;
  text-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
}

.ccfe-theme-midnight-luxe .ccfe-submit-btn:hover,
.ccfe-theme-midnight-luxe .ccfe-submit-btn:focus,
.ccfe-theme-midnight-luxe button[type="submit"]:hover,
.ccfe-theme-midnight-luxe button[type="submit"]:focus,
.ccfe-theme-midnight-luxe input[type="submit"]:hover,
.ccfe-theme-midnight-luxe input[type="submit"]:focus,
.ccfe-theme-midnight-luxe .ccfe-page-next:hover,
.ccfe-theme-midnight-luxe .ccfe-page-next:focus,
.ccfe-theme-midnight-luxe .ccfe-payment-unlock-btn:hover,
.ccfe-theme-midnight-luxe .ccfe-payment-unlock-btn:focus,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-submit-btn:hover,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-submit-btn:focus,
.ccfe-form-wrap.ccfe-theme-midnight-luxe button[type="submit"]:hover,
.ccfe-form-wrap.ccfe-theme-midnight-luxe button[type="submit"]:focus,
.ccfe-form-wrap.ccfe-theme-midnight-luxe input[type="submit"]:hover,
.ccfe-form-wrap.ccfe-theme-midnight-luxe input[type="submit"]:focus,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-page-next:hover,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-page-next:focus,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-payment-unlock-btn:hover,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-payment-unlock-btn:focus {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #111111 !important;
  -webkit-text-fill-color: #111111 !important;
  border-color: #b8c2cc !important;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.16) !important;
}

.ccfe-theme-midnight-luxe .ccfe-submit-btn:active,
.ccfe-theme-midnight-luxe button[type="submit"]:active,
.ccfe-theme-midnight-luxe input[type="submit"]:active,
.ccfe-theme-midnight-luxe .ccfe-page-next:active,
.ccfe-theme-midnight-luxe .ccfe-payment-unlock-btn:active,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-submit-btn:active,
.ccfe-form-wrap.ccfe-theme-midnight-luxe button[type="submit"]:active,
.ccfe-form-wrap.ccfe-theme-midnight-luxe input[type="submit"]:active,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-page-next:active,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-payment-unlock-btn:active {
  background: #f8fafc !important;
  background-color: #f8fafc !important;
  color: #111111 !important;
  -webkit-text-fill-color: #111111 !important;
}

.ccfe-theme-midnight-luxe .ccfe-submit-btn[disabled],
.ccfe-theme-midnight-luxe .ccfe-submit-btn:disabled,
.ccfe-theme-midnight-luxe button[type="submit"][disabled],
.ccfe-theme-midnight-luxe button[type="submit"]:disabled,
.ccfe-theme-midnight-luxe input[type="submit"][disabled],
.ccfe-theme-midnight-luxe input[type="submit"]:disabled,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-submit-btn[disabled],
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-submit-btn:disabled,
.ccfe-form-wrap.ccfe-theme-midnight-luxe button[type="submit"][disabled],
.ccfe-form-wrap.ccfe-theme-midnight-luxe button[type="submit"]:disabled,
.ccfe-form-wrap.ccfe-theme-midnight-luxe input[type="submit"][disabled],
.ccfe-form-wrap.ccfe-theme-midnight-luxe input[type="submit"]:disabled {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #111111 !important;
  -webkit-text-fill-color: #111111 !important;
  opacity: 1 !important;
}


/* v9 Midnight Luxe submit button readability */
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-submit-btn,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-submit-btn,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-form button[type="submit"],
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-form button[type="submit"],
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-form input[type="submit"],
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-form input[type="submit"] {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #111111 !important;
  -webkit-text-fill-color: #111111 !important;
  border-color: #cfd6dd !important;
  text-shadow: none !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12) !important;
}

.ccfe-form.ccfe-theme-midnight-luxe .ccfe-submit-btn:hover,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-submit-btn:hover,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-submit-btn:focus,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-submit-btn:focus,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-form button[type="submit"]:hover,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-form button[type="submit"]:hover,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-form button[type="submit"]:focus,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-form button[type="submit"]:focus,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-form input[type="submit"]:hover,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-form input[type="submit"]:hover,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-form input[type="submit"]:focus,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-form input[type="submit"]:focus {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #111111 !important;
  -webkit-text-fill-color: #111111 !important;
  border-color: #b8c2cc !important;
}

.ccfe-form.ccfe-theme-midnight-luxe .ccfe-submit-btn:active,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-submit-btn:active,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-form button[type="submit"]:active,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-form button[type="submit"]:active,
.ccfe-form.ccfe-theme-midnight-luxe .ccfe-form input[type="submit"]:active,
.ccfe-form-wrap.ccfe-theme-midnight-luxe .ccfe-form input[type="submit"]:active {
  background: #f8fafc !important;
  background-color: #f8fafc !important;
  color: #111111 !important;
  -webkit-text-fill-color: #111111 !important;
}


/* Grid question types */
.ccfe-grid-question { overflow-x:auto; }
.ccfe-grid-table { width:100%; border-collapse:separate; border-spacing:0; min-width:420px; border:1px solid #dcdcde; border-radius:14px; overflow:hidden; background:#fff; }
.ccfe-grid-table th, .ccfe-grid-table td { padding:10px 12px; border-bottom:1px solid #eef2f4; border-right:1px solid #eef2f4; text-align:center; vertical-align:middle; }
.ccfe-grid-table thead th { background:linear-gradient(180deg, #fbfcfe 0%, #f4f6f8 100%); font-weight:700; color:#1f2937; }
.ccfe-grid-table tbody th { text-align:left; background:#fafbfc; font-weight:600; color:#1f2937; }
.ccfe-grid-table tr:last-child th, .ccfe-grid-table tr:last-child td { border-bottom:0; }
.ccfe-grid-table th:last-child, .ccfe-grid-table td:last-child { border-right:0; }
.ccfe-grid-cell { display:flex; align-items:center; justify-content:center; gap:6px; font-weight:500; }


/* CCFE mobile Self-Heal action layout polish
   Keeps Answer Guide controls compact on mobile without changing desktop flow. */
.ccfe-self-heal-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 10px;
}

@media (max-width: 767px) {
  .ccfe-self-heal-card {
    padding: 12px !important;
    border-radius: 16px !important;
    overflow: hidden !important;
  }

  .ccfe-self-heal-actions {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    align-items: stretch !important;
    margin-top: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .ccfe-self-heal-actions.ccfe-self-heal-actions-has-permanent {
    flex-wrap: wrap !important;
  }

  .ccfe-self-heal-actions .ccfe-self-heal-skip,
  .ccfe-self-heal-actions .ccfe-self-heal-clearer-help,
  .ccfe-self-heal-actions .ccfe-self-heal-close {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 38px !important;
    padding: 8px 7px !important;
    font-size: 11.5px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .ccfe-self-heal-actions .ccfe-self-heal-clearer-help[disabled],
  .ccfe-self-heal-actions .ccfe-self-heal-clearer-help[aria-busy="true"] {
    white-space: normal !important;
    font-size: 11px !important;
  }

  .ccfe-self-heal-actions.ccfe-self-heal-actions-has-permanent .ccfe-self-heal-skip,
  .ccfe-self-heal-actions.ccfe-self-heal-actions-has-permanent .ccfe-self-heal-clearer-help {
    flex: 1 1 calc(50% - 4px) !important;
  }

  .ccfe-self-heal-actions .ccfe-self-heal-close[data-close-mode="permanent"] {
    flex: 1 0 100% !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    margin-top: 4px !important;
    clear: both !important;
  }
}

@media (max-width: 360px) {
  .ccfe-self-heal-actions {
    gap: 5px !important;
  }

  .ccfe-self-heal-actions .ccfe-self-heal-skip,
  .ccfe-self-heal-actions .ccfe-self-heal-clearer-help,
  .ccfe-self-heal-actions .ccfe-self-heal-close {
    padding-left: 5px !important;
    padding-right: 5px !important;
    font-size: 10.8px !important;
  }
}


/* No-flash guard: logged-out users must not briefly see the payment unlock card
   when account-based payment access requires login. Server render shows the
   access-restricted card; this protects stale cached markup until JS verifies. */
body:not(.logged-in) .ccfe-form-wrap[data-ccfe-payment-login-required="1"] .ccfe-payment-unlock,
body:not(.logged-in) .ccfe-form-wrap[data-ccfe-payment-login-required="1"] .ccfe-form-intro,
body:not(.logged-in) .ccfe-form-wrap[data-ccfe-payment-login-required="1"] .ccfe-pair-launch,
body:not(.logged-in) .ccfe-form-wrap[data-ccfe-payment-login-required="1"] .ccfe-form,
body:not(.logged-in) .ccfe-form-wrap[data-ccfe-payment-login-required="1"] .ccfe-pair-floating-shell {
  display: none !important;
}


/* Pair mode uses the dedicated pair launcher. The intro Start button is solo-only. */
.ccfe-form-wrap[data-ccfe-pair-launcher="1"] .ccfe-form-intro .ccfe-begin-form,
.ccfe-form-wrap[data-ccfe-participation-mode="solo_or_pair"] .ccfe-form-intro .ccfe-begin-form,
.ccfe-form-wrap[data-ccfe-participation-mode="pair_only"] .ccfe-form-intro .ccfe-begin-form {
  display: none !important;
}

/* CCFE Self-Heal mobile action button refinement
   SaaS-safe visual polish only: prevents the longer "Need clearer help" label
   from being clipped on narrow screens without changing Self-Heal logic. */
@media (max-width: 767px) {
  .ccfe-self-heal-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.18fr) minmax(0, 1fr) !important;
    gap: 8px !important;
    align-items: stretch !important;
    width: 100% !important;
  }

  .ccfe-self-heal-actions .ccfe-self-heal-skip,
  .ccfe-self-heal-actions .ccfe-self-heal-clearer-help,
  .ccfe-self-heal-actions .ccfe-self-heal-close {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 44px !important;
    padding: 8px 8px !important;
    border-radius: 999px !important;
    font-size: 11.5px !important;
    line-height: 1.15 !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }

  .ccfe-self-heal-actions .ccfe-self-heal-skip,
  .ccfe-self-heal-actions .ccfe-self-heal-close {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .ccfe-self-heal-actions .ccfe-self-heal-clearer-help {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
  }

  .ccfe-self-heal-actions.ccfe-self-heal-actions-has-permanent {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }

  .ccfe-self-heal-actions.ccfe-self-heal-actions-has-permanent .ccfe-self-heal-close[data-close-mode="permanent"] {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
  }
}

@media (max-width: 360px) {
  .ccfe-self-heal-actions {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .ccfe-self-heal-actions .ccfe-self-heal-skip,
  .ccfe-self-heal-actions .ccfe-self-heal-clearer-help,
  .ccfe-self-heal-actions .ccfe-self-heal-close {
    min-height: 40px !important;
    font-size: 11px !important;
  }
}



/* Mobile Answer Guide button fix: keep action labels readable in portrait view. */
@media (max-width: 480px) and (orientation: portrait) {
  .ccfe-self-heal-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    width: 100% !important;
  }

  .ccfe-self-heal-actions .ccfe-self-heal-skip,
  .ccfe-self-heal-actions .ccfe-self-heal-clearer-help,
  .ccfe-self-heal-actions .ccfe-self-heal-close {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 44px !important;
    padding: 10px 14px !important;
    border-radius: 16px !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
  }
}