
	.zcl-ai-quiz {
		--quiz-accent: #009b77;
		--quiz-accent-soft: rgba(0, 155, 119, 0.12);
		--quiz-card-bg: #f4f5f9;
		margin: 48px 0;
	}
	.zcl-ai-quiz__card {
		display: grid;
		grid-template-columns: minmax(260px, 0.42fr) minmax(0, 0.58fr);
		gap: 32px;
		align-items: stretch;
		background: #fff;
		border-radius: 20px;
	}
	.zcl-ai-quiz__header {
		padding: 12px 0;
	}
	.zcl-ai-quiz__badge {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		width: fit-content;
		padding: 4px 14px 4px 4px;
		margin-bottom: 24px;
		border-radius: 999px;
		background: var(--quiz-accent-soft);
		color: var(--quiz-accent);
		font-size: 14px;
		font-weight: 700;
		line-height: 1;
	}
	.zcl-ai-quiz__badge-icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 30px;
		height: 30px;
		border-radius: 50%;
		background: var(--quiz-accent);
		color: #fff;
	}
	.zcl-ai-quiz__title {
		margin: 0 0 18px;
		color: #222;
		font-size: 36px;
		font-weight: 700;
		line-height: 1.2;
	}
	.zcl-ai-quiz__text {
		margin: 0;
		color: #747474;
		font-size: 16px;
		line-height: 1.55;
	}
	.zcl-ai-quiz__content {
		padding: 40px;
		border-radius: 20px;
		background: var(--quiz-card-bg);
	}
	.zcl-ai-quiz__progress {
		display: flex;
		align-items: center;
		gap: 15px;
		margin-bottom: 34px;
	}
	.zcl-ai-quiz__progress-text {
		color: var(--quiz-accent);
		font-size: 16px;
		font-weight: 700;
		white-space: nowrap;
	}
	.zcl-ai-quiz__progress-bar {
		flex: 1;
		height: 4px;
		overflow: hidden;
		border-radius: 4px;
		background: #e5e7eb;
	}
	.zcl-ai-quiz__progress-fill {
		height: 100%;
		border-radius: 4px;
		background: var(--quiz-accent);
		transition: width 0.35s ease;
	}
	.zcl-ai-quiz__step {
		display: none;
		animation: zclAiQuizFadeIn 0.35s ease;
	}
	.zcl-ai-quiz__step.is-active {
		display: block;
	}
	.zcl-ai-quiz__question,
	.zcl-ai-quiz__result-title {
		margin: 0 0 24px;
		color: #222;
		font-size: 22px;
		font-weight: 700;
		line-height: 1.4;
	}
	.zcl-ai-quiz__answers {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}
	.zcl-ai-quiz__answer {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 14px 24px;
		border: 1px dashed #d1d5db;
		border-radius: 12px;
		background: transparent;
		color: #2f343a;
		font-size: 16px;
		font-weight: 600;
		line-height: 1.35;
		text-align: left;
		cursor: pointer;
		transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
	}
	.zcl-ai-quiz__answer:hover,
	.zcl-ai-quiz__answer.is-selected {
		border-color: #fff;
		background: #fff;
		box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
		color: #222;
	}
	.zcl-ai-quiz__back {
		margin-top: 18px;
		padding: 0;
		border: 0;
		background: none;
		color: #747474;
		font-size: 14px;
		cursor: pointer;
	}
	.zcl-ai-quiz__back:hover {
		color: var(--quiz-accent);
	}
	.zcl-ai-quiz__loading {
		display: none;
		padding: 38px 0;
		text-align: center;
	}
	.zcl-ai-quiz__loading.is-active {
		display: block;
	}
	.zcl-ai-quiz__spinner {
		width: 44px;
		height: 44px;
		margin: 20px auto;
		border: 4px solid #e5e7eb;
		border-top-color: var(--quiz-accent);
		border-radius: 50%;
		animation: zclAiQuizSpin 1s linear infinite;
	}
	.zcl-ai-quiz__loader-phrase {
		min-height: 22px;
		color: #747474;
		font-size: 15px;
		transition: opacity 0.2s ease;
	}
	.zcl-ai-quiz__recap {
		display: none;
		flex-wrap: wrap;
		align-items: center;
		gap: 8px;
		margin-bottom: 18px;
	}
	.zcl-ai-quiz__recap.is-visible {
		display: flex;
	}
	.zcl-ai-quiz__recap-label {
		margin-right: 4px;
		color: #747474;
		font-size: 14px;
	}
	.zcl-ai-quiz__recap-item {
		display: inline-block;
		padding: 5px 14px;
		border: 1px solid #e5e7eb;
		border-radius: 999px;
		background: #fff;
		color: #46474c;
		font-size: 13px;
		font-weight: 500;
	}
	.zcl-ai-quiz__message {
		min-height: 96px;
		padding: 24px;
		border: 1px solid #e5e7eb;
		border-radius: 20px;
		background: #fff;
		color: #222;
		font-size: 16px;
		font-weight: 500;
		line-height: 1.55;
	}
	.zcl-ai-quiz__message::after {
		display: inline-block;
		margin-left: 3px;
		color: var(--quiz-accent);
		vertical-align: bottom;
		content: "▋";
		animation: zclAiQuizBlink 1s step-end infinite;
	}
	.zcl-ai-quiz__message.typing-done::after {
		display: none;
	}
	.zcl-ai-quiz__message p {
		margin: 0 0 12px;
	}
	.zcl-ai-quiz__message p:last-child {
		margin-bottom: 0;
	}
	.zcl-ai-quiz__message ul,
	.zcl-ai-quiz__message ol {
		margin: 0 0 12px;
		padding-left: 0;
		list-style: none;
	}
	.zcl-ai-quiz__message li {
		position: relative;
		margin-bottom: 8px;
		padding-left: 20px;
		line-height: 1.6;
	}
	.zcl-ai-quiz__message ul:not(.ai-boost-list):not(.ai-tips-list) li::before {
		position: absolute;
		top: 10px;
		left: 0;
		width: 5px;
		height: 5px;
		border-radius: 50%;
		background: var(--quiz-accent);
		content: "";
	}
	.zcl-ai-quiz__message ol {
		counter-reset: zcl-quiz-list;
	}
	.zcl-ai-quiz__message ol li {
		padding-left: 24px;
	}
	.zcl-ai-quiz__message ol li::before {
		position: absolute;
		top: 0;
		left: 0;
		color: var(--quiz-accent);
		font-weight: 700;
		content: counter(zcl-quiz-list) ".";
		counter-increment: zcl-quiz-list;
	}
	.ai-message-section {
		padding: 4px 0;
	}
	.ai-message-section + .ai-message-section {
		margin-top: 18px;
		padding-top: 18px;
		border-top: 1px solid #eee;
	}
	.ai-message-section > b {
		display: block;
		margin-bottom: 10px;
		color: #000;
		font-size: 17px;
	}
	.ai-message-section--price,
	.ai-message-section--doctor,
	.ai-message-section--save,
	.ai-message-section--boost {
		border-left: 3px solid var(--quiz-accent);
		padding-left: 14px;
	}
	.ai-message-muted {
		color: #747474;
		font-size: 15px;
	}
	.ai-message-inline-insight {
		margin-top: 18px;
	}
	.ai-chip {
		display: inline-flex;
		align-items: center;
		max-width: 100%;
		gap: 8px;
		margin: 2px 3px;
		padding: 4px 14px 4px 5px;
		border: 1px dashed #d1d5db;
		border-radius: 10px;
		background: #fff;
		color: #000;
		font-size: 15px;
		font-weight: 600;
		line-height: 1.3;
		text-decoration: none;
		vertical-align: middle;
		white-space: nowrap;
		transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
	}
	.ai-chip:hover {
		border-color: var(--quiz-accent);
		border-style: solid;
		box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
		color: #000;
		text-decoration: none;
		transform: translateY(-1px);
	}
	.ai-chip__thumb {
		display: inline-flex;
		flex-shrink: 0;
		align-items: center;
		justify-content: center;
		width: 34px;
		height: 34px;
		overflow: hidden;
		border-radius: 8px;
		background: #f4f5f7;
	}
	.ai-chip__thumb img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.ai-chip__thumb--icon {
		color: var(--quiz-accent);
		font-size: 16px;
		font-weight: 700;
	}
	.ai-chip--doctor .ai-chip__thumb,
	.ai-chip--doctor .ai-chip__thumb img {
		border-radius: 50%;
	}
	.ai-chip__label {
		max-width: 300px;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.ai-chip-link {
		color: var(--quiz-accent);
		font-weight: 600;
		text-decoration: underline;
		text-underline-offset: 3px;
	}
	.ai-appear {
		animation: zclAiQuizAppear 0.45s ease both;
	}
	.ai-price-rows {
		margin-bottom: 10px;
	}
	.ai-price-row {
		display: flex;
		align-items: baseline;
		gap: 8px;
		margin-bottom: 8px;
	}
	.ai-price-row__name {
		font-size: 15px;
	}
	.ai-price-row__note {
		display: block;
		color: #747474;
		font-size: 13px;
	}
	.ai-price-row__dots {
		flex: 1;
		border-bottom: 1px dotted #d1d5db;
	}
	.ai-price-row__price {
		color: var(--quiz-accent);
		font-weight: 700;
		white-space: nowrap;
	}
	.ai-tips-list,
	.ai-boost-list {
		padding-left: 0 !important;
		list-style: none;
	}
	.ai-tips-list li,
	.ai-boost-list li {
		margin-bottom: 10px;
		padding-left: 0;
	}
	.ai-insight-card {
		display: block;
		margin-bottom: 12px;
		padding: 16px 18px;
		border: 1px solid #e5e7eb;
		border-radius: 12px;
		background: #fff;
		color: #222;
		text-decoration: none;
	}
	.ai-insight-card:hover {
		border-color: var(--quiz-accent);
		color: #222;
		text-decoration: none;
	}
	.ai-insight-card__label {
		display: block;
		margin-bottom: 8px;
		color: var(--quiz-accent);
		font-size: 12px;
		font-weight: 700;
		text-transform: uppercase;
	}
	.ai-insight-card__title {
		display: block;
		margin-bottom: 6px;
		color: #000;
		font-size: 16px;
		font-weight: 600;
	}
	.ai-insight-card__quote {
		display: block;
		margin-bottom: 8px;
		color: #46474c;
		font-size: 15px;
		font-style: italic;
		line-height: 1.55;
	}
	.ai-insight-card__text {
		display: block;
		margin-bottom: 6px;
		color: #46474c;
		font-size: 14px;
		line-height: 1.5;
	}
	.ai-insight-card__note {
		display: block;
		color: #747474;
		font-size: 13px;
	}
	.zcl-ai-quiz__services {
		display: none;
		margin-top: 18px;
	}
	.zcl-ai-quiz__services.is-visible {
		display: block;
	}
	.zcl-ai-quiz__services-title {
		margin-bottom: 15px;
		color: #000;
		font-size: 18px;
		font-weight: 600;
	}
	.zcl-ai-quiz__services-list {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 15px;
	}
	.quiz-service-card {
		display: flex;
		align-items: flex-start;
		gap: 14px;
		padding: 16px;
		border: 1px solid #e5e7eb;
		border-radius: 12px;
		background: #fff;
		color: #222;
		text-decoration: none;
		transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
	}
	.quiz-service-card:hover {
		border-color: var(--quiz-accent);
		box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
		color: #222;
		text-decoration: none;
		transform: translateY(-2px);
	}
	.quiz-service-card__thumb {
		flex-shrink: 0;
		width: 64px;
		height: 64px;
		overflow: hidden;
		border-radius: 10px;
	}
	.quiz-service-card__thumb img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.quiz-service-card__body {
		display: block;
		min-width: 0;
	}
	.quiz-service-card__title {
		display: block;
		margin-bottom: 4px;
		color: #000;
		font-size: 15px;
		font-weight: 600;
		line-height: 1.4;
	}
	.quiz-service-card__text,
	.quiz-service-card__points {
		color: #46474c;
		font-size: 13px;
		line-height: 1.5;
	}
	.quiz-service-card__text {
		display: block;
		margin-bottom: 6px;
	}
	.quiz-service-card__points {
		margin: 0;
		padding-left: 16px;
	}
	.zcl-ai-quiz__actions {
		display: none;
		flex-wrap: wrap;
		gap: 15px;
		margin-top: 28px;
	}
	.zcl-ai-quiz__actions.is-visible {
		display: flex;
	}
	.zcl-ai-quiz__btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-height: 54px;
		padding: 0 34px;
		border-radius: 12px;
		font-size: 16px;
		font-weight: 700;
		line-height: 1;
		text-decoration: none;
		cursor: pointer;
		transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
	}
	.zcl-ai-quiz__btn--primary {
		border: 0;
		background: var(--quiz-accent);
		color: #fff;
	}
	.zcl-ai-quiz__btn--outline {
		border: 1px solid var(--quiz-accent);
		background: #fff;
		color: var(--quiz-accent);
	}
	.zcl-ai-quiz__btn:hover {
		transform: translateY(-1px);
	}
	@keyframes zclAiQuizFadeIn {
		from { opacity: 0; transform: translateY(10px); }
		to { opacity: 1; transform: translateY(0); }
	}
	@keyframes zclAiQuizSpin {
		to { transform: rotate(360deg); }
	}
	@keyframes zclAiQuizBlink {
		0%, 100% { opacity: 1; }
		50% { opacity: 0; }
	}
	@keyframes zclAiQuizAppear {
		from { opacity: 0; transform: translateY(6px) scale(0.97); }
		to { opacity: 1; transform: translateY(0) scale(1); }
	}
	@media (max-width: 991px) {
		.zcl-ai-quiz__card {
			grid-template-columns: 1fr;
			gap: 24px;
		}
		.zcl-ai-quiz__title {
			font-size: 28px;
		}
		.zcl-ai-quiz__content {
			padding: 28px;
		}
	}
	@media (max-width: 767px) {
		.zcl-ai-quiz__services-list {
			grid-template-columns: 1fr;
		}
	}
	@media (max-width: 576px) {
		.zcl-ai-quiz {
			margin: 32px 0;
		}
		.zcl-ai-quiz__title {
			font-size: 24px;
		}
		.zcl-ai-quiz__content {
			padding: 22px;
		}
		.zcl-ai-quiz__question,
		.zcl-ai-quiz__result-title {
			font-size: 20px;
		}
		.zcl-ai-quiz__answer,
		.zcl-ai-quiz__btn {
			width: 100%;
		}
		.ai-chip {
			white-space: normal;
		}
		.ai-chip__label {
			max-width: 210px;
		}
		.ai-price-row {
			align-items: flex-start;
			flex-wrap: wrap;
		}
		.ai-price-row__dots {
			display: none;
		}
		.ai-price-row__price {
			width: 100%;
		}
	}
