@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css");

html,
body.mone-teachable-vrt-body {
  margin: 0;
  background: #ffffff;
}

.mone-teachable-vrt {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #111111;
  background: #ffffff;
}

.mone-teachable-vrt .vrt-page {
  min-height: auto;
  padding: 76px 0 18px;
  background: #ffffff;
  color: #111111;
}

.mone-teachable-vrt .vrt-container {
  max-width: 960px;
  padding: 0 16px;
}

.mone-teachable-vrt #vrt-intro,
.mone-teachable-vrt #vrt-loading,
.mone-teachable-vrt #vrt-gender,
.mone-teachable-vrt #vrt-countdown,
.mone-teachable-vrt #vrt-results {
  max-width: 760px;
}

.mone-teachable-vrt #vrt-intro {
  padding-top: 36px;
}

.mone-teachable-vrt .vrt-title,
.mone-teachable-vrt .vrt-step-title,
.mone-teachable-vrt .vrt-results__title,
.mone-teachable-vrt .vrt-fit__title {
  color: #111111;
  letter-spacing: 0;
  word-break: keep-all;
}

.mone-teachable-vrt .vrt-title {
  font-size: 42px;
  line-height: 1.25;
}

.mone-teachable-vrt .vrt-lead,
.mone-teachable-vrt .vrt-reassurance,
.mone-teachable-vrt .vrt-instruction-text,
.mone-teachable-vrt .vrt-cta__desc,
.mone-teachable-vrt .vrt-fit__text {
  color: #4b5563;
  word-break: keep-all;
}

.mone-teachable-vrt .vrt-reassurance--muted {
  color: #6b7280;
}

.mone-teachable-vrt .vrt-btn--primary,
.mone-teachable-vrt .vrt-cta__btn {
  background: #2563eb;
  border-radius: 8px;
  color: #ffffff;
  box-shadow: 0 0 8px rgba(37, 99, 235, 0.3);
}

.mone-teachable-vrt .vrt-btn--primary:hover,
.mone-teachable-vrt .vrt-cta__btn:hover {
  background: #1d4ed8;
  box-shadow: 0 8px 24px rgba(37, 99, 235, 0.35);
}

.mone-teachable-vrt .vrt-btn--large {
  animation: teachableBtnGlow 2s ease-in-out infinite;
}

@keyframes teachableBtnGlow {
  0%,
  100% {
    box-shadow: 0 0 8px rgba(37, 99, 235, 0.3);
  }

  50% {
    box-shadow: 0 0 24px rgba(37, 99, 235, 0.6), 0 0 48px rgba(37, 99, 235, 0.2);
  }
}

.mone-teachable-vrt .vrt-empty-gauge__frame,
.mone-teachable-vrt .vrt-gauge__frame {
  border-color: #dbe3f0;
  border-radius: 8px;
}

.mone-teachable-vrt .vrt-gender-btn {
  border-color: #dddddd;
  border-radius: 8px;
}

.mone-teachable-vrt .vrt-gender-btn:hover,
.mone-teachable-vrt .vrt-gender-btn--selected {
  border-color: #2563eb;
  background: #eff6ff;
  box-shadow: none;
}

.mone-teachable-vrt .vrt-fit__item {
  border-color: #dddddd;
}

.mone-teachable-vrt .vrt-fit__item:hover {
  background: #f8fafc;
}

.mone-teachable-vrt .vrt-fit__check-icon {
  border-color: #cbd5e1;
  border-radius: 6px;
}

.mone-teachable-vrt .vrt-fit__checkbox:checked + .vrt-fit__check-icon {
  background-color: #2563eb;
  border-color: #2563eb;
}

.mone-teachable-vrt .vrt-fit__score #vrt-fit-score,
.mone-teachable-vrt .vrt-countdown__number,
.mone-teachable-vrt .vrt-gauge-note,
.mone-teachable-vrt .vrt-results__try-again,
.mone-teachable-vrt .vrt-results__song-name {
  color: #2563eb;
}

/* ── Type Diagnosis: 티처블 결과지 톤 (파란 카드·둥근 모서리) ──
   vrtData.isLocalTeachableTest가 참일 때 JS가 .vrt-diagnosis--teachable을 붙인다. */
.vrt-diagnosis--teachable .vrt-diagnosis-name {
  color: #1d4ed8;
}

.vrt-diagnosis--teachable .vrt-diagnosis-text strong {
  color: #1d4ed8;
}

.vrt-diagnosis--teachable .vrt-diagnosis-bridge {
  background: #eff6ff;
  border: 1px solid #dbe2ff;
  border-radius: 18px;
}

.vrt-diagnosis--teachable .vrt-diagnosis-bridge p {
  color: #1d4ed8;
}

.vrt-diagnosis--teachable .vrt-diagnosis-review {
  border-color: #dbe2ff;
  border-radius: 15px;
  background: #f8faff;
}

.vrt-diagnosis--teachable .vrt-diagnosis-review__link {
  color: #1d4ed8;
}

.vrt-diagnosis--teachable .vrt-diagnosis-overlay {
  border-top-color: #dbe2ff;
}

@media (max-width: 520px) {
  .mone-teachable-vrt .vrt-page {
    padding: 62px 0 14px;
  }

  .mone-teachable-vrt .vrt-title {
    font-size: 36px;
  }
}

@media (max-width: 380px) {
  .mone-teachable-vrt .vrt-title {
    font-size: 34px;
  }
}