$primary-main: var(--mui-palette-primary-main); $primary-light: var(--mui-palette-primary-light); $primary-dark: var(--mui-palette-primary-dark); $accent-color: #41bfc2; $box-shadow-color: rgba(0, 0, 0, 0.1); $border-color: #27323c; $page-background-color: #f4f4fb; $modal-input-background: #f4f4fb; $background-color: #fff; $text-color: #3e3e3e; $input-text-color: #717171; $info-text-color: #4169e1; $icon-color: #c1c1c1; $zap-icon-color: #ffd700; $btn-background-color: $primary-main; $btn-color: #fff; $progress-box-background-color: $primary-main; $progress-box-inner-background-color: $primary-dark; $rank-progress-background-color: #445c76; $correct-answer-background-color: $primary-light; $incorrect-answer-background-color: #e84d67; $incorrect-answer-label-color: #fff; $checkbox-border-color: #ccc; $checkbox-hover-border-color: #888; $checkbox-checked-background-color: $primary-main; $checkbox-checked-color: #fff; $comment-notice-background-color: #0d6efd; $comment-notice-color: #fff; $comment-divider-color: #eee; $activated-topic-background-color: var(--mui-palette-info-dark); $error-msg-color: red; $suggestion-box-heading-color: #dfe0e0; $callOut-success-background: $primary-light; $callOut-success-color: $primary-dark; $review-feedback-correct: #178b13; $review-feedback-incorrect: #d82222; $review-feedback-neutral: #f39220; $review-feedback-selected-color: #fff;