:root {
	--kcc-primary: #0666cc;
	--kcc-primary-dark: #004ea8;
	--kcc-primary-light: #eaf4ff;
	--kcc-primary-soft: #f4f9ff;
	--kcc-primary-border: #cfe5ff;
	--kcc-primary-border-strong: #b7cee8;
	--kcc-primary-mid: #4c8fd4;
	--kcc-accent: #f57c00;
	--kcc-accent-dark: #d96500;
	--kcc-text: #172033;
	--kcc-text-sub: #596273;
	--kcc-bg: #ffffff;
	--kcc-bg-soft: #f7f9fc;
	--kcc-border: #dde3ec;
	--kcc-success: #14804a;
	--kcc-warning: #c87900;
	--kcc-danger: #c93737;
	--kcc-neutral-rank: #6d788a;
	--kcc-success-soft: #eff9f3;
	--kcc-focus: #ffbf47;
	--kcc-radius-sm: 8px;
	--kcc-radius-md: 12px;
	--kcc-radius-lg: 18px;
	--kcc-shadow-sm: 0 2px 10px rgba(23, 32, 51, 0.08);
	--kcc-shadow-md: 0 12px 30px rgba(23, 32, 51, 0.12);
	--kcc-shadow-primary: 0 5px 12px rgba(6, 102, 204, 0.18);
	--kcc-shadow-accent: 0 4px 12px rgba(245, 124, 0, 0.2);
	--kcc-decoration: rgba(6, 102, 204, 0.06);
	--kcc-container: 1160px;
	--kcc-section-gap: clamp(4rem, 7vw, 5.5rem);
	--kcc-transition: 160ms ease;
}

:where(.kcc-home, .kcc-card, .kcc-ranking, .kcc-compare, .kcc-score, .kcc-cta, .kcc-related, .kcc-next-read),
:where(.kcc-home, .kcc-card, .kcc-ranking, .kcc-compare, .kcc-score, .kcc-cta, .kcc-related, .kcc-next-read) * {
	box-sizing: border-box;
}

:where(.kcc-home, .kcc-card, .kcc-ranking, .kcc-compare, .kcc-cta, .kcc-related, .kcc-next-read) a:focus-visible,
.kcc-home summary:focus-visible {
	outline: 3px solid var(--kcc-focus);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	:where(.kcc-home, .kcc-card, .kcc-ranking, .kcc-compare, .kcc-cta, .kcc-related, .kcc-next-read) * {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}