.macro-html {
	overflow-x: hidden;
}

.macro-page .section {
	padding-top: calc(52px + 20 * ((100vw - 375px) / 1545));
	padding-bottom: calc(52px + 20 * ((100vw - 375px) / 1545));
}

.macro-body {
	overflow-x: hidden;
}

.macro-page {
	overflow-x: hidden;
}

.macro-page .title__text--highlight::before {
	display: none;
}

.macro-hero__title {
	margin-bottom: 16px;
}

.macro-hero.section {
	margin-top: 72px;
	padding-top: 28px;
	padding-bottom: calc(20px + 8 * ((100vw - 375px) / 1545));
}

.macro-breadcrumbs {
	margin-bottom: 16px;
	font-size: 14px;
	color: #6b7280;
}

.macro-breadcrumbs a {
	color: inherit;
	text-decoration: none;
}

.macro-breadcrumbs a:hover {
	text-decoration: underline;
}

.macro-hero__lead {
	max-width: 100%;
	font-size: 16px;
	line-height: 1.6;
	margin-bottom: 24px;
}

.macro-layout {
	grid-template-columns: minmax(320px, 1.4fr) minmax(300px, 1fr);
	gap: 24px;
	align-items: stretch;
}

.macro-card,
.macro-results-panel {
	background: #fff;
	border: 1px solid #d9e5de;
	border-radius: 20px;
	padding: 24px;
	box-shadow: 0 20px 34px -28px rgba(0, 0, 0, 0.3);
	min-width: 0;
}

.macro-results-panel {
	display: flex;
	flex-direction: column;
}

.macro-card__title {
	font-weight: 700;
	font-size: 24px;
	line-height: 1.25;
	margin-bottom: 8px;
}

.macro-card__subtitle {
	font-size: 14px;
	line-height: 1.5;
	margin-bottom: 18px;
	color: #5c6660;
}

.macro-alert {
	border-radius: 12px;
	padding: 12px 14px;
	margin-bottom: 14px;
}

.macro-alert p {
	margin-bottom: 8px;
}

.macro-alert p:last-child {
	margin-bottom: 0;
}

.macro-alert ul {
	padding-left: 20px;
	list-style: disc;
}

.macro-alert--error {
	background: #ffecec;
	border: 1px solid #f8b9b9;
}

.macro-alert--notice {
	background: #f3f7f4;
	border: 1px solid #d3e3db;
	margin-top: 12px;
}

.macro-form__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}

.macro-form__grid--nested {
	margin-top: 12px;
}

.macro-form__field--full {
	grid-column: 1 / -1;
}

.macro-form__field {
	min-width: 0;
}

.macro-form__field input,
.macro-form__field select {
	width: 100%;
	min-width: 0;
	min-height: 46px;
	padding: 10px 12px;
	border: 1px solid #cbd9d1;
	border-radius: 12px;
	font-size: 15px;
	line-height: 1.3;
	color: #313232;
	background: #fff;
}

.macro-form__field select {
	max-width: 100%;
	text-overflow: ellipsis;
}

.macro-form__field input:focus,
.macro-form__field select:focus {
	outline: none;
	border-color: #0da675;
	box-shadow: 0 0 0 2px rgba(13, 166, 117, 0.2);
}

.macro-form__label {
	display: block;
	font-weight: 600;
	font-size: 13px;
	line-height: 1.35;
	margin-bottom: 6px;
}

.macro-form__label-row {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 6px;
}

.macro-form__label-row .macro-form__label {
	margin-bottom: 0;
}

.macro-tooltip {
	position: relative;
	display: inline-flex;
}

.macro-tooltip__trigger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	padding: 0;
	border: 1px solid #9fb2a8;
	border-radius: 50%;
	background: #fff;
	color: #557067;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	cursor: help;
}

.macro-tooltip__trigger:focus-visible {
	outline: none;
	border-color: #0da675;
	box-shadow: 0 0 0 2px rgba(13, 166, 117, 0.2);
}

.macro-tooltip__content {
	position: absolute;
	top: auto;
	bottom: calc(100% + 8px);
	left: 0;
	right: auto;
	width: 360px;
	max-width: min(360px, calc(100vw - 32px));
	padding: 10px 12px;
	border-radius: 10px;
	background: #1f2b26;
	color: #fff;
	font-size: 12px;
	line-height: 1.45;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(4px);
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
	z-index: 6;
}

.macro-tooltip__content::before {
	content: '';
	position: absolute;
	top: auto;
	right: auto;
	bottom: -5px;
	left: 8px;
	width: 10px;
	height: 10px;
	background: #1f2b26;
	transform: rotate(45deg);
}

.macro-tooltip:hover .macro-tooltip__content,
.macro-tooltip:focus-within .macro-tooltip__content {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0);
}

.macro-tooltip__section-title {
	display: block;
	margin-top: 8px;
	margin-bottom: 2px;
	font-weight: 700;
}

.macro-tooltip__section-title:first-child {
	margin-top: 0;
}

.macro-tooltip__item {
	display: block;
	margin-top: 2px;
}

.macro-form__hint {
	margin-top: 6px;
	font-size: 12px;
	line-height: 1.4;
	color: #63706a;
}

.macro-form__toggle {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.macro-form__chip input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.macro-form__chip span {
	display: inline-flex;
	align-items: center;
	padding: 8px 12px;
	border-radius: 999px;
	border: 1px solid #cbd9d1;
	background: #fff;
	font-weight: 600;
	font-size: 12px;
	line-height: 1;
	cursor: pointer;
	transition: 0.2s;
}

.macro-form__chip input:checked + span {
	background: #0da675;
	color: #fff;
	border-color: #0da675;
}

.macro-form__advanced {
	padding: 12px;
	border-radius: 12px;
	border: 1px solid #d3e3db;
	background: #f7fbf8;
}

.macro-form__field.is-disabled select {
	opacity: 0.65;
}

.macro-form__advanced-toggle {
	display: inline-flex;
	align-items: center;
	padding: 0;
	border: none;
	background: transparent;
	color: #0da675;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
}

.macro-form__actions {
	margin-top: 14px;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.macro-button--ghost {
	background: #f1f6f4;
	color: #313232;
}

.macro-button--ghost:hover {
	background: #e5f1eb;
}

.macro-client-error {
	font-size: 12px;
	line-height: 1.4;
	color: #cc3c3c;
	min-height: 20px;
	margin-top: 10px;
}

.macro-results-panel__title {
	font-weight: 700;
	font-size: 24px;
	line-height: 1.2;
	margin-bottom: 8px;
}

.macro-results-panel__subtitle {
	font-size: 13px;
	line-height: 1.5;
	color: #5c6660;
	margin-bottom: 16px;
}

.macro-results-panel__context {
	padding: 10px 12px;
	border: 1px solid #d9e5de;
	border-left: 3px solid #0da675;
	border-radius: 10px;
	background: #f7fbf8;
	font-size: 13px;
	line-height: 1.5;
	margin-bottom: 16px;
}

.macro-results-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}

.macro-result-card {
	padding: 12px;
	border-radius: 12px;
	background: #f7fbf8;
	border: 1px solid #d9e5de;
}

.macro-result-card span {
	display: block;
	font-size: 12px;
	line-height: 1.4;
	color: #5c6660;
	margin-bottom: 6px;
}

.macro-result-card strong {
	font-size: 20px;
	line-height: 1.2;
	font-weight: 700;
}

.macro-meal-split {
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px solid #dfe9e4;
}

.macro-meal-split__title {
	font-size: 14px;
	line-height: 1.4;
	font-weight: 700;
	margin-bottom: 10px;
}

.macro-results-grid--meals .macro-result-card strong {
	font-size: 18px;
}

.macro-chart-wrap {
	margin-top: 16px;
	display: grid;
	grid-template-columns: 140px 1fr;
	gap: 14px;
	align-items: center;
}

.macro-chart-side {
	display: grid;
	gap: 10px;
	align-content: start;
}

.macro-chart-meta {
	padding-top: 10px;
	border-top: 1px solid #dfe9e4;
}

.macro-chart-meta p {
	font-size: 13px;
	line-height: 1.5;
	margin-bottom: 4px;
}

.macro-chart-meta p:last-child {
	margin-bottom: 0;
}

.macro-donut {
	--macro-protein: 0;
	--macro-carbs: 0;
	--macro-fat: 0;
	position: relative;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	background: conic-gradient(
		#0da675 0 calc(var(--macro-protein) * 1%),
		#ffd621 calc(var(--macro-protein) * 1%)
			calc((var(--macro-protein) + var(--macro-carbs)) * 1%),
		#ff9f21 calc((var(--macro-protein) + var(--macro-carbs)) * 1%) 100%
	);
}

.macro-donut::after {
	content: '';
	position: absolute;
	inset: 16px;
	border-radius: 50%;
	background: #fff;
}

.macro-donut__center {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	z-index: 1;
}

.macro-donut__center strong {
	font-size: 24px;
	line-height: 1;
	font-weight: 700;
}

.macro-donut__center span {
	font-size: 12px;
	line-height: 1.2;
	color: #5c6660;
}

.macro-legend li {
	font-size: 13px;
	line-height: 1.5;
	display: flex;
	align-items: center;
	margin-bottom: 8px;
}

.macro-legend li:last-child {
	margin-bottom: 0;
}

.macro-legend__dot {
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	margin-right: 8px;
}

.macro-legend__dot--protein {
	background: #0da675;
}

.macro-legend__dot--carbs {
	background: #ffd621;
}

.macro-legend__dot--fat {
	background: #ff9f21;
}

.macro-diagnostics {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid #dfe9e4;
}

.macro-diagnostics p {
	font-size: 13px;
	line-height: 1.5;
	margin-bottom: 4px;
}

.macro-diagnostics p:last-child {
	margin-bottom: 0;
}

.macro-diagnostics__hint {
	font-size: 12px;
	line-height: 1.45;
	color: #5c6660;
	margin-top: -2px;
	margin-bottom: 8px;
}

.macro-results-panel__actions {
	margin-top: 14px;
}

.macro-content.section {
	padding-top: 0;
}

.macro-article {
	max-width: 900px;
}

.macro-article h2 {
	font-size: 34px;
	line-height: 1.2;
	font-weight: 700;
	margin-top: 30px;
	margin-bottom: 16px;
}

.macro-article h3 {
	font-size: 22px;
	line-height: 1.25;
	font-weight: 700;
	margin-top: 22px;
	margin-bottom: 10px;
}

.macro-article p {
	font-size: 15px;
	line-height: 1.72;
	margin-bottom: 14px;
	overflow-wrap: anywhere;
	word-break: break-word;
}

.macro-article table {
	width: 100%;
	margin: 20px 0;
	border: 1px solid #d9e5de;
	border-radius: 16px;
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 16px 28px -24px rgba(0, 0, 0, 0.35);
}

.macro-article thead {
	background: #f3f7f4;
}

.macro-article th,
.macro-article td {
	padding: 14px 16px;
	text-align: left;
	vertical-align: top;
	font-size: 14px;
	line-height: 1.55;
	border-bottom: 1px solid #dfe9e4;
}

.macro-article th {
	font-weight: 700;
	color: #1f2b26;
}

.macro-article td {
	color: #313232;
}

.macro-article tbody tr:last-child td {
	border-bottom: 0;
}

.macro-article ol {
	margin: 0 0 18px 22px;
	padding-left: 4px;
	list-style: decimal;
}

.macro-article ol li {
	margin-bottom: 10px;
	font-size: 15px;
	line-height: 1.72;
}

.macro-references {
	list-style: decimal;
	padding-left: 20px;
}

.macro-references li {
	font-size: 14px;
	line-height: 1.65;
	margin-bottom: 12px;
	overflow-wrap: anywhere;
	word-break: break-word;
}

.macro-disclaimer {
	margin-top: 16px;
	padding: 12px 14px;
	background: #f7fbf8;
	border: 1px solid #d9e5de;
	border-radius: 12px;
}

@media (max-width: 1024px) {
	.macro-layout {
		grid-template-columns: 1fr;
	}
}

@media (min-width: 1025px) {
	.macro-card,
	.macro-results-panel {
		height: 100%;
	}
}

@media (max-width: 768px) {
	.macro-form__grid {
		grid-template-columns: 1fr;
	}

	.macro-results-grid {
		grid-template-columns: 1fr;
	}

	.macro-chart-wrap {
		grid-template-columns: 1fr;
		justify-items: start;
	}

	.macro-chart-side {
		width: 100%;
	}

	.macro-tooltip__content {
		position: absolute;
		top: auto;
		right: auto;
		bottom: calc(100% + 8px);
		left: 0;
		width: min(320px, calc(100vw - 32px));
		max-width: calc(100vw - 32px);
	}

	.macro-tooltip__content::before {
		display: block;
		top: auto;
		right: auto;
		bottom: -5px;
		left: 8px;
	}

	.macro-article h2 {
		font-size: 28px;
	}

	.macro-article h3 {
		font-size: 20px;
	}

	.macro-article table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.macro-article th,
	.macro-article td {
		min-width: 160px;
		padding: 12px 14px;
	}
}

@media print {
	.header,
	.footer,
	.burger-menu,
	#macroDownloadPdf,
	#macroResetButton,
	#macroAdvancedToggle {
		display: none !important;
	}

	.macro-card,
	.macro-results-panel {
		box-shadow: none;
		border: 1px solid #d9e5de;
	}
}