.ingenium-mcc,
.ingenium-mcc * {
	box-sizing: border-box;
}

.ingenium-mcc {
	--mcc-navy: #161d4f;
	--mcc-deep: #003958;
	--mcc-teal: #009c8f;
	--mcc-mint: #dff4ef;
	--mcc-orange: #eea400;
	--mcc-yellow: #f9be3a;
	--mcc-red: #da4640;
	--mcc-cream: #fdfaf3;
	--mcc-paper: #ffffff;
	--mcc-ink: #17203b;
	--mcc-muted: #667085;
	--mcc-line: #293257;
	--mcc-size: 16;
	color: var(--mcc-ink);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	margin: 26px auto;
	max-width: 720px;
	width: 100%;
}

.ingenium-mcc [hidden] {
	display: none !important;
}

.ingenium-mcc-intro,
.ingenium-mcc-game,
.ingenium-mcc-result {
	background: var(--mcc-cream);
	border: 2px solid var(--mcc-navy);
	border-radius: 18px;
	box-shadow: 8px 8px 0 rgba(22, 29, 79, 0.15);
	overflow: hidden;
}

.ingenium-mcc-intro {
	align-items: stretch;
	display: grid;
	grid-template-columns: minmax(210px, 0.82fr) minmax(0, 1.45fr);
	isolation: isolate;
	min-height: 430px;
}

.ingenium-mcc-intro-grid {
	align-content: center;
	background: var(--mcc-navy);
	display: grid;
	gap: 6px;
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: repeat(4, auto);
	min-width: 0;
	overflow: hidden;
	padding: 26px;
	pointer-events: none;
	transform: rotate(-2deg) scale(1.04);
	transform-origin: center;
}

.ingenium-mcc-intro-grid span {
	align-items: center;
	aspect-ratio: 1;
	background: var(--mcc-paper);
	border: 2px solid var(--mcc-ink);
	color: var(--mcc-navy);
	display: flex;
	font-size: clamp(25px, 5vw, 46px);
	font-weight: 900;
	justify-content: center;
	line-height: 1;
	min-height: 0;
	min-width: 0;
	width: 100%;
}

.ingenium-mcc-intro-grid span:nth-child(2),
.ingenium-mcc-intro-grid span:nth-child(6),
.ingenium-mcc-intro-grid span:nth-child(11) {
	background: var(--mcc-yellow);
}

.ingenium-mcc-intro-grid span:nth-child(4),
.ingenium-mcc-intro-grid span:nth-child(7),
.ingenium-mcc-intro-grid span:nth-child(10),
.ingenium-mcc-intro-grid span:nth-child(13) {
	background: var(--mcc-teal);
}

.ingenium-mcc-intro-grid span:nth-child(8),
.ingenium-mcc-intro-grid span:nth-child(15) {
	background: var(--mcc-red);
}

.ingenium-mcc-intro-copy {
	align-self: center;
	min-width: 0;
	padding: 38px clamp(24px, 6vw, 54px);
	position: relative;
	z-index: 1;
}

.ingenium-mcc-kicker {
	color: var(--mcc-red);
	font-size: 12px;
	font-weight: 900;
	letter-spacing: 0.11em;
	line-height: 1.2;
	margin: 0 0 8px;
	text-transform: uppercase;
}

.ingenium-mcc h2,
.ingenium-mcc h3,
.ingenium-mcc h4,
.ingenium-mcc p {
	font-family: inherit;
}

.ingenium-mcc-intro h2 {
	color: var(--mcc-navy);
	font-size: clamp(42px, 8vw, 72px);
	font-weight: 950;
	letter-spacing: -0.055em;
	line-height: 0.92;
	margin: 0;
	padding: 0;
}

.ingenium-mcc-subtitle {
	color: var(--mcc-deep);
	font-size: clamp(18px, 3.3vw, 25px);
	font-weight: 750;
	line-height: 1.16;
	margin: 13px 0 18px;
}

.ingenium-mcc-rule {
	color: #3e465f;
	font-size: 15px;
	line-height: 1.58;
	margin: 0 0 20px;
}

.ingenium-mcc-intro-facts {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 24px;
}

.ingenium-mcc-intro-facts span {
	align-items: baseline;
	background: var(--mcc-paper);
	border: 1px solid #d7d9e3;
	border-radius: 999px;
	color: var(--mcc-muted);
	display: inline-flex;
	font-size: 12px;
	gap: 4px;
	padding: 7px 11px;
}

.ingenium-mcc-intro-facts strong {
	color: var(--mcc-navy);
	font-size: 16px;
}

.ingenium-mcc .ingenium-mcc-button {
	align-items: center;
	appearance: none;
	background: var(--mcc-paper);
	border: 2px solid var(--mcc-navy);
	border-radius: 9px;
	box-shadow: 3px 3px 0 rgba(22, 29, 79, 0.16);
	color: var(--mcc-navy);
	cursor: pointer;
	display: inline-flex;
	font-family: inherit;
	font-size: 14px;
	font-weight: 800;
	justify-content: center;
	line-height: 1.2;
	margin: 0;
	min-height: 42px;
	padding: 10px 15px;
	text-decoration: none;
	text-transform: none;
	transition: transform 140ms ease, box-shadow 140ms ease, background 140ms ease;
}

.ingenium-mcc .ingenium-mcc-button:hover,
.ingenium-mcc .ingenium-mcc-button:focus-visible {
	background: #fff6d9;
	box-shadow: 1px 1px 0 rgba(22, 29, 79, 0.2);
	color: var(--mcc-navy);
	transform: translate(2px, 2px);
}

.ingenium-mcc .ingenium-mcc-button:focus-visible,
.ingenium-mcc .ingenium-mcc-word:focus-visible,
.ingenium-mcc .ingenium-mcc-cell.is-letter:focus-visible {
	outline: 4px solid rgba(238, 164, 0, 0.48);
	outline-offset: 2px;
}

.ingenium-mcc .ingenium-mcc-button-primary {
	background: var(--mcc-navy);
	border-color: var(--mcc-navy);
	color: #ffffff;
}

.ingenium-mcc .ingenium-mcc-button-primary:hover,
.ingenium-mcc .ingenium-mcc-button-primary:focus-visible {
	background: var(--mcc-deep);
	color: #ffffff;
}

.ingenium-mcc .ingenium-mcc-button:disabled {
	box-shadow: none;
	cursor: default;
	opacity: 0.42;
	transform: none;
}

.ingenium-mcc .ingenium-mcc-button-quiet {
	background: transparent;
	border-color: transparent;
	box-shadow: none;
	color: var(--mcc-muted);
}

.ingenium-mcc-game {
	padding: clamp(18px, 4vw, 30px);
}

.ingenium-mcc-game-head {
	align-items: center;
	border-bottom: 4px solid var(--mcc-navy);
	display: flex;
	gap: 18px;
	justify-content: space-between;
	margin-bottom: 14px;
	padding-bottom: 13px;
}

.ingenium-mcc-game-head .ingenium-mcc-kicker {
	margin-bottom: 3px;
}

.ingenium-mcc-game-head h2 {
	color: var(--mcc-navy);
	font-size: clamp(24px, 4.8vw, 36px);
	font-weight: 900;
	letter-spacing: -0.035em;
	line-height: 1;
	margin: 0;
	padding: 0;
}

.ingenium-mcc-timer {
	align-items: center;
	background: var(--mcc-yellow);
	border: 2px solid var(--mcc-navy);
	border-radius: 50%;
	box-shadow: 3px 3px 0 var(--mcc-navy);
	display: flex;
	flex: 0 0 76px;
	flex-direction: column;
	height: 76px;
	justify-content: center;
	line-height: 1;
	transform: rotate(2deg);
}

.ingenium-mcc-timer span {
	font-size: 14px;
	margin-bottom: 4px;
}

.ingenium-mcc-timer strong {
	color: var(--mcc-navy);
	font-size: 17px;
	font-variant-numeric: tabular-nums;
}

.ingenium-mcc.is-time-over .ingenium-mcc-timer {
	background: #f7d6d4;
	color: var(--mcc-red);
}

.ingenium-mcc-progress-row {
	align-items: center;
	display: flex;
	gap: 12px;
	margin: 13px auto 10px;
	max-width: 610px;
}

.ingenium-mcc-progress {
	background: #e1e4ed;
	border: 1px solid #c8ccd8;
	display: grid;
	flex: 1 1 auto;
	grid-template-columns: repeat(16, 1fr);
	height: 12px;
	overflow: hidden;
	position: relative;
}

.ingenium-mcc-progress::after {
	background: repeating-linear-gradient(
		90deg,
		transparent 0,
		transparent calc(6.25% - 1px),
		rgba(255, 255, 255, 0.8) calc(6.25% - 1px),
		rgba(255, 255, 255, 0.8) 6.25%
	);
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
}

.ingenium-mcc-progress span {
	background: linear-gradient(90deg, var(--mcc-teal), #00af9b);
	display: block;
	grid-column: 1 / -1;
	height: 100%;
	transition: width 220ms ease;
	width: 0;
}

.ingenium-mcc-progress-row > strong {
	color: var(--mcc-navy);
	font-size: 14px;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.ingenium-mcc-selection {
	background: var(--mcc-paper);
	border-left: 6px solid var(--mcc-orange);
	color: #3e465f;
	font-size: 14px;
	font-weight: 650;
	line-height: 1.45;
	margin: 12px auto;
	max-width: 610px;
	min-height: 50px;
	padding: 9px 12px;
}

.ingenium-mcc-board-frame {
	background: var(--mcc-navy);
	border: 3px solid var(--mcc-navy);
	box-shadow: 6px 6px 0 rgba(22, 29, 79, 0.18);
	margin: 16px auto;
	max-width: 610px;
	padding: 5px;
	width: 100%;
}

.ingenium-mcc-board {
	background: var(--mcc-navy);
	display: grid;
	gap: 1px;
	grid-template-columns: repeat(var(--mcc-size), minmax(0, 1fr));
	width: 100%;
}

.ingenium-mcc .ingenium-mcc-cell {
	aspect-ratio: 1;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	font-family: inherit;
	margin: 0;
	min-height: 0;
	min-width: 0;
	padding: 0;
}

.ingenium-mcc .ingenium-mcc-cell.is-block {
	background:
		linear-gradient(135deg, rgba(255, 255, 255, 0.035) 25%, transparent 25%) 0 0 / 8px 8px,
		var(--mcc-navy);
	display: block;
}

.ingenium-mcc .ingenium-mcc-cell.is-letter {
	align-items: center;
	appearance: none;
	background: var(--mcc-paper);
	color: var(--mcc-navy);
	cursor: pointer;
	display: flex;
	font-size: clamp(10px, 3.6vw, 20px);
	font-weight: 850;
	justify-content: center;
	line-height: 1;
	text-align: center;
	text-transform: uppercase;
	transition: background 120ms ease, transform 120ms ease;
}

.ingenium-mcc .ingenium-mcc-cell.is-letter:hover {
	background: #eef3f5;
}

.ingenium-mcc .ingenium-mcc-cell.is-intersection::after {
	background: var(--mcc-teal);
	border-radius: 50%;
	content: "";
	height: 4px;
	position: absolute;
	right: 3px;
	top: 3px;
	width: 4px;
}

.ingenium-mcc .ingenium-mcc-cell.is-letter {
	position: relative;
}

.ingenium-mcc .ingenium-mcc-cell.is-active {
	background: #fff0b3;
	box-shadow: inset 0 0 0 2px var(--mcc-orange);
	position: relative;
	z-index: 2;
}

.ingenium-mcc .ingenium-mcc-cell.is-hinted {
	animation: ingenium-mcc-pulse 800ms ease-in-out 3;
	background: #ffd270;
	box-shadow: inset 0 0 0 3px var(--mcc-red);
	z-index: 3;
}

.ingenium-mcc .ingenium-mcc-cell.is-correct {
	background: var(--mcc-mint);
	color: #006b61;
}

.ingenium-mcc .ingenium-mcc-cell.is-wrong {
	background: #fbe0de;
	color: #972e2a;
}

.ingenium-mcc-placement,
.ingenium-mcc-tools {
	display: flex;
	flex-wrap: wrap;
	gap: 9px;
	justify-content: center;
	margin: 14px auto;
}

.ingenium-mcc-feedback {
	color: var(--mcc-muted);
	font-size: 14px;
	line-height: 1.5;
	margin: 10px auto 18px;
	max-width: 610px;
	min-height: 22px;
	text-align: center;
}

.ingenium-mcc-feedback[data-tone="success"] {
	color: #006b61;
	font-weight: 700;
}

.ingenium-mcc-feedback[data-tone="warning"],
.ingenium-mcc-feedback[data-tone="hint"] {
	color: #8a5b00;
	font-weight: 700;
}

.ingenium-mcc-feedback[data-tone="error"] {
	color: #a8322d;
	font-weight: 700;
}

.ingenium-mcc-reserve {
	background: var(--mcc-paper);
	border: 2px solid var(--mcc-navy);
	box-shadow: 5px 5px 0 rgba(22, 29, 79, 0.13);
	margin: 22px 0 16px;
	padding: clamp(15px, 3vw, 22px);
}

.ingenium-mcc-reserve-head {
	align-items: end;
	display: flex;
	gap: 12px;
	justify-content: space-between;
	margin-bottom: 15px;
}

.ingenium-mcc-reserve-head .ingenium-mcc-kicker {
	margin-bottom: 3px;
}

.ingenium-mcc-reserve-head h3 {
	color: var(--mcc-navy);
	font-size: 22px;
	font-weight: 900;
	line-height: 1.1;
	margin: 0;
	padding: 0;
}

.ingenium-mcc-reserve-head > span {
	background: var(--mcc-navy);
	border-radius: 999px;
	color: #ffffff;
	font-size: 12px;
	font-weight: 800;
	padding: 6px 10px;
	white-space: nowrap;
}

.ingenium-mcc-word-groups {
	display: grid;
	gap: 14px 18px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ingenium-mcc-word-group {
	min-width: 0;
}

.ingenium-mcc-word-group h4 {
	border-bottom: 2px solid var(--mcc-navy);
	color: var(--mcc-navy);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 0.08em;
	margin: 0 0 6px;
	padding: 0 0 5px;
	text-transform: uppercase;
}

.ingenium-mcc-word-list {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}

.ingenium-mcc .ingenium-mcc-word {
	appearance: none;
	background: #f5f7fa;
	border: 1px solid #c9ced9;
	border-radius: 6px;
	box-shadow: none;
	color: var(--mcc-ink);
	cursor: pointer;
	font-family: inherit;
	font-size: 12px;
	font-weight: 720;
	line-height: 1.2;
	margin: 0;
	min-height: 32px;
	padding: 6px 8px;
	text-align: left;
	text-transform: none;
	transition: background 120ms ease, border 120ms ease, transform 120ms ease;
}

.ingenium-mcc .ingenium-mcc-word:hover {
	background: #fff3cc;
	border-color: var(--mcc-orange);
}

.ingenium-mcc .ingenium-mcc-word.is-selected {
	background: var(--mcc-yellow);
	border-color: var(--mcc-navy);
	box-shadow: 2px 2px 0 var(--mcc-navy);
	transform: translate(-1px, -1px);
}

.ingenium-mcc .ingenium-mcc-word.is-placed {
	background: var(--mcc-mint);
	border-color: #74bdb3;
	color: #53706d;
	text-decoration: line-through;
	text-decoration-thickness: 2px;
}

.ingenium-mcc .ingenium-mcc-word.is-placed::after {
	color: var(--mcc-teal);
	content: " ✓";
	font-weight: 950;
	text-decoration: none;
}

.ingenium-mcc-tools {
	border-top: 1px solid #d7d9e3;
	margin-bottom: 0;
	padding-top: 15px;
}

.ingenium-mcc-result {
	align-items: center;
	background:
		linear-gradient(90deg, transparent 49.5%, rgba(22, 29, 79, 0.06) 49.5%, rgba(22, 29, 79, 0.06) 50.5%, transparent 50.5%),
		linear-gradient(0deg, transparent 49.5%, rgba(22, 29, 79, 0.06) 49.5%, rgba(22, 29, 79, 0.06) 50.5%, transparent 50.5%),
		var(--mcc-cream);
	background-size: 42px 42px;
	display: flex;
	flex-direction: column;
	min-height: 480px;
	justify-content: center;
	padding: 42px 24px;
	text-align: center;
}

.ingenium-mcc-result-mark {
	align-items: center;
	background: var(--mcc-yellow);
	border: 4px solid var(--mcc-navy);
	box-shadow: 7px 7px 0 var(--mcc-navy);
	color: var(--mcc-navy);
	display: flex;
	font-size: 68px;
	font-weight: 950;
	height: 130px;
	justify-content: center;
	line-height: 1;
	margin: 8px auto 28px;
	transform: rotate(-3deg);
	width: 130px;
}

.ingenium-mcc-result h2 {
	color: var(--mcc-navy);
	font-size: clamp(30px, 6vw, 48px);
	font-weight: 950;
	letter-spacing: -0.045em;
	line-height: 0.98;
	margin: 0 auto 13px;
	max-width: 560px;
	padding: 0;
}

.ingenium-mcc-result > p:not(.ingenium-mcc-kicker) {
	color: #4f566d;
	font-size: 16px;
	line-height: 1.55;
	margin: 0 auto 20px;
	max-width: 500px;
}

.ingenium-mcc-result-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 9px;
	justify-content: center;
	margin-bottom: 24px;
}

.ingenium-mcc-result-stats span {
	background: var(--mcc-paper);
	border: 2px solid var(--mcc-navy);
	border-radius: 999px;
	color: var(--mcc-muted);
	font-size: 13px;
	padding: 8px 12px;
}

.ingenium-mcc-result-stats strong {
	color: var(--mcc-navy);
	margin-right: 3px;
}

.ingenium-mcc.is-shaking .ingenium-mcc-board-frame {
	animation: ingenium-mcc-shake 300ms ease;
}

@keyframes ingenium-mcc-pulse {
	0%,
	100% {
		transform: scale(1);
	}
	50% {
		transform: scale(0.9);
	}
}

@keyframes ingenium-mcc-shake {
	0%,
	100% {
		transform: translateX(0);
	}
	30% {
		transform: translateX(-5px);
	}
	70% {
		transform: translateX(5px);
	}
}

@media (max-width: 620px) {
	.ingenium-mcc-intro {
		grid-template-columns: 1fr;
	}

	.ingenium-mcc-intro-grid {
		align-content: stretch;
		grid-template-columns: repeat(8, 1fr);
		grid-template-rows: repeat(2, minmax(0, 1fr));
		height: 145px;
		max-height: 145px;
		padding: 14px;
		transform: none;
	}

	.ingenium-mcc-intro-grid span {
		aspect-ratio: auto;
		font-size: 21px;
	}

	.ingenium-mcc-intro-copy {
		padding: 30px 22px 34px;
	}

	.ingenium-mcc-intro h2 {
		font-size: clamp(44px, 15vw, 62px);
	}

	.ingenium-mcc-word-groups {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 430px) {
	.ingenium-mcc {
		margin: 16px auto;
	}

	.ingenium-mcc-intro,
	.ingenium-mcc-game,
	.ingenium-mcc-result {
		border-radius: 12px;
		box-shadow: 4px 4px 0 rgba(22, 29, 79, 0.15);
	}

	.ingenium-mcc-game {
		padding: 14px 10px 18px;
	}

	.ingenium-mcc-game-head {
		align-items: flex-start;
	}

	.ingenium-mcc-game-head h2 {
		font-size: 25px;
		max-width: 220px;
	}

	.ingenium-mcc-timer {
		flex-basis: 64px;
		height: 64px;
	}

	.ingenium-mcc-timer strong {
		font-size: 14px;
	}

	.ingenium-mcc-board-frame {
		box-shadow: 3px 3px 0 rgba(22, 29, 79, 0.18);
		padding: 3px;
	}

	.ingenium-mcc-board {
		gap: 1px;
	}

	.ingenium-mcc .ingenium-mcc-cell.is-letter {
		font-size: clamp(9px, 3.5vw, 14px);
	}

	.ingenium-mcc .ingenium-mcc-cell.is-intersection::after {
		height: 3px;
		right: 1px;
		top: 1px;
		width: 3px;
	}

	.ingenium-mcc-selection {
		font-size: 13px;
	}

	.ingenium-mcc-reserve {
		padding: 14px 12px;
	}

	.ingenium-mcc-word-groups {
		grid-template-columns: 1fr;
	}

	.ingenium-mcc .ingenium-mcc-word {
		font-size: 13px;
	}

	.ingenium-mcc-placement .ingenium-mcc-button,
	.ingenium-mcc-tools .ingenium-mcc-button {
		flex: 1 1 135px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ingenium-mcc *,
	.ingenium-mcc *::before,
	.ingenium-mcc *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.001ms !important;
	}
}