.mgk-rev__heading,
.mgk-rev__avg,
.mgk-rev__dist-star,
.mgk-rev__dist-n,
.mgk-rev__item-name {
	color: var(--ink);
}

.mgk-rev__product,
.mgk-rev__title,
.mgk-rev__text {
	color: var(--ink-2);
}

.mgk-rev__count {
	color: var(--mgk-text-3);
}

.mgk-rev .mgk-rev__back,
.mgk-revmodal__signin-link,
.mgk-revmodal__btn--cancel {
	color: var(--accent);
}

.mgk-rev .mgk-rev__back:hover {
	color: color-mix(in srgb, var(--accent) 82%, var(--ink));
}

.mgk-revmodal__btn--cancel {
	border-color: var(--accent);
}

.mgk-revmodal__btn--cancel:hover {
	background: color-mix(in srgb, var(--accent) 8%, var(--surface));
}

.mgk-btn.mgk-rev__write,
.mgk-revmodal__btn--submit {
	background: var(--accent);
	color: var(--on-accent);
}

.mgk-btn.mgk-rev__write:hover,
.mgk-revmodal__btn--submit:hover:not(:disabled) {
	background: color-mix(in srgb, var(--accent) 82%, var(--ink));
}

.mgk-revmodal__btn--submit:disabled {
	background: color-mix(in srgb, var(--accent) 35%, var(--surface));
}

.mgk-rev__summary {
	border-color: var(--line);
	background: var(--surface);
	box-shadow: 0 1px 3px color-mix(in srgb, var(--ink) 10%, transparent),
	            0 1px 2px -1px color-mix(in srgb, var(--ink) 10%, transparent);
}

.mgk-rev__dist-bar {
	background: var(--raise);
}

.mgk-rev__item {
	border-bottom-color: var(--line);
}

.mgk-rev__verified {
	color: var(--accent);
	background: color-mix(in srgb, var(--accent) 10%, var(--surface));
	border-color: color-mix(in srgb, var(--accent) 35%, transparent);
}

.mgk-revmodal__backdrop {
	background: color-mix(in srgb, var(--ink) 45%, transparent);
}

.mgk-revmodal__title,
.mgk-revmodal__label {
	color: var(--ink);
}

.mgk-revmodal__opt,
.mgk-revmodal__textarea::placeholder {
	color: var(--mgk-text-3);
}

.mgk-revmodal__star {
	color: var(--line);
}

.mgk-revmodal__textarea:focus,
.mgk-revmodal__star-input:focus-visible + .mgk-revmodal__star,
.mgk-revmodal__signin-link:focus-visible {
	outline-color: var(--accent);
	border-color: var(--accent);
}

.mgk-termsheet__backdrop {
	background: color-mix(in srgb, var(--ink) 50%, transparent);
}

.mgk-termsheet__x:hover,
.mgk-tabbar__tab:active {
	background: var(--raise);
}

.mgk-tabbar {
	background: color-mix(in srgb, var(--surface) 96%, transparent);
	border-top-color: color-mix(in srgb, var(--line) 90%, transparent);
}

.mgk-rev__dist-fill {
	background: var(--accent);
}