/* v0.5.2-D2 Safe Polish: only home + quiz UI */

body {
  background:
    radial-gradient(circle at 12% 8%, rgba(109, 93, 252, 0.12), transparent 28%),
    radial-gradient(circle at 86% 16%, rgba(25, 184, 216, 0.10), transparent 30%),
    linear-gradient(180deg, #f8f9ff 0%, #f4f6fb 100%);
}

#homePage .type-card {
  border: 1px solid rgba(20, 20, 33, 0.08) !important;
  box-shadow: 0 12px 30px rgba(20, 20, 33, 0.06);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

#homePage .type-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 46px rgba(20, 20, 33, 0.10);
  border-color: rgba(109, 93, 252, 0.18) !important;
}

#startBtn,
#nextBtn {
  background: linear-gradient(135deg, #6d5dfc, #19b8d8) !important;
  border: none !important;
  box-shadow: 0 14px 34px rgba(25, 184, 216, 0.24);
  transition: transform 0.16s ease, box-shadow 0.16s ease;
}

#startBtn:hover,
#nextBtn:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 42px rgba(25, 184, 216, 0.30);
}

#quizPage .option {
  border: 1px solid rgba(20, 20, 33, 0.08) !important;
  background: rgba(255, 255, 255, 0.86) !important;
  box-shadow: 0 8px 22px rgba(20, 20, 33, 0.045);
  line-height: 1.62;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

#quizPage .option:hover {
  transform: translateY(-2px);
  border-color: rgba(109, 93, 252, 0.24) !important;
  box-shadow: 0 12px 30px rgba(20, 20, 33, 0.075);
}

#quizPage .option.active {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.96), rgba(255,255,255,0.84)),
    linear-gradient(135deg, rgba(109,93,252,0.16), rgba(25,184,216,0.12)) !important;
  border-color: rgba(109, 93, 252, 0.42) !important;
  box-shadow: 0 14px 34px rgba(109, 93, 252, 0.13);
}

#bar {
  background: linear-gradient(90deg, #6d5dfc, #19b8d8, #1fc98d) !important;
  box-shadow: 0 0 18px rgba(25, 184, 216, 0.25);
  transition: width 0.28s ease;
}

#progressText {
  color: #6f7285;
  letter-spacing: 0.02em;
}

#question {
  line-height: 1.36;
  letter-spacing: -0.02em;
}

@media (max-width: 720px) {
  #homePage .type-card:hover,
  #quizPage .option:hover,
  #startBtn:hover,
  #nextBtn:hover {
    transform: none;
  }

  #quizPage .option {
    line-height: 1.55;
  }
}