.single-question {
	max-width: 860px;
	margin: 0 auto;
}

.form-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 12px;
}

.counter {
	font-size: 14px;
	color: var(--muted);
	letter-spacing: .2px;
}

.question-card {
	background: var(--card);
	border: var(--border);
	border-radius: var(--radius);
	padding: 20px;
	box-shadow: 0 6px 24px rgba(0,0,0,.18);
	will-change: transform, opacity;
}

/* 方向动画：前进/后退 */
.question-card.enter-next { animation: cardInNext .28s cubic-bezier(.22,.61,.36,1) both; }
.question-card.enter-prev { animation: cardInPrev .28s cubic-bezier(.22,.61,.36,1) both; }
.question-card.leave-next { animation: cardOutNext .2s ease both; }
.question-card.leave-prev { animation: cardOutPrev .2s ease both; }

@keyframes cardInNext {
	from { opacity: 0; transform: translateY(8px) scale(.98); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes cardInPrev {
	from { opacity: 0; transform: translateY(-6px) scale(.985); }
	to   { opacity: 1; transform: translateY(0)  scale(1); }
}
@keyframes cardOutNext {
	from { opacity: 1; transform: translateY(0) scale(1); }
	to   { opacity: 0; transform: translateY(-6px) scale(.985); }
}
@keyframes cardOutPrev {
	from { opacity: 1; transform: translateY(0) scale(1); }
	to   { opacity: 0; transform: translateY(8px)  scale(.98); }
}

.q-title {
	margin: 0 0 14px 0;
	font-size: 18px;
	line-height: 1.5;
	color: var(--text);
}

/* 选项栅格（覆盖 index.css 中的 .scale） */
.scale {
	display: grid;
	grid-template-columns: repeat(6, minmax(0,1fr));
	gap: 10px;
}

.scale-item input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.option {
	display: grid;
	place-items: center;
	min-height: 46px;
	padding: 10px 10px;
	border-radius: 12px;
	border: var(--border);
	background: var(--bg-soft);
	color: var(--muted);
	user-select: none;
	transition: transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
}

.scale-item:hover .option {
	transform: translateY(-1px);
	box-shadow: var(--ring);
}

.scale-item input:focus + .option {
	outline: 2px solid rgba(14,165,233,.35);
	outline-offset: 2px;
}

.scale-item input:checked + .option {
	border-color: transparent;
	background: linear-gradient(90deg, var(--accent-from), var(--accent-to));
	color: color-mix(in srgb, var(--text) 92%, white);
	box-shadow: 0 10px 28px rgba(2, 132, 199, .18);
}

/* 动态进度条更丝滑 */
.progress { position: relative; }
.progress > b {
	transition: width .28s cubic-bezier(.22,.61,.36,1), box-shadow .28s ease;
	box-shadow: 0 0 0 rgba(124,58,237,0);
}
.progress > b[style*="width"] {
	box-shadow: 0 6px 18px rgba(14, 165, 233, .18) inset;
}

/* 按钮区域微调 */
.form-actions .spacer { flex: 1; }
#prev:disabled,
#next:disabled { opacity: .5; cursor: not-allowed; }

/* 自适应 */
@media (max-width: 860px) {
	.scale { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 540px) {
	.scale { grid-template-columns: repeat(2, 1fr); }
	.q-title { font-size: 16px; }
	.option { min-height: 44px; }
}

/* 减少动画偏好 */
@media (prefers-reduced-motion: reduce) {
	.question-card { animation: none !important; }
	.progress > b { transition: none; }
	.option { transition: none; }
}