/* WomanTricks Tools 0.6.0 */

.wt-calculator {
	--wt-accent: #e40f8d;
	--wt-accent-hover: #ff0000;
	--wt-text: #252329;
	--wt-muted: #77717a;
	--wt-border: #e9e2e7;
	--wt-soft: #fbf7f9;
	max-width: 920px;
	margin: 0 auto;
	color: var(--wt-text);
	font-size: 16px;
	line-height: 1.45;
}
.wt-calculator *, .wt-calculator *::before, .wt-calculator *::after { box-sizing: border-box; }
.wt-calc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-bottom: 20px; }
.wt-calc-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wt-calc-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.wt-field { margin-bottom: 18px; }
.wt-field label { display: block; margin-bottom: 8px; font-weight: 600; }
.wt-number { width: 100%; min-height: 48px; padding: 11px 14px; border: 1px solid var(--wt-border); border-radius: 10px; background: #fff; color: var(--wt-text); font: inherit; outline: none; transition: border-color .2s ease, box-shadow .2s ease; }
.wt-number:focus { border-color: var(--wt-accent); box-shadow: 0 0 0 3px rgba(228,15,141,.1); }
.wt-choice-row { display: flex; flex-wrap: wrap; gap: 8px; }
.wt-choice, .wt-scenario-button { border: 1px solid var(--wt-border); border-radius: 9px; background: #fff; color: var(--wt-text); padding: 10px 13px; font: inherit; cursor: pointer; transition: .2s ease; }
.wt-choice:hover, .wt-scenario-button:hover { border-color: var(--wt-accent); color: var(--wt-accent); }
.wt-choice.is-active { background: var(--wt-accent); border-color: var(--wt-accent); color: #fff; }
.wt-help { margin-top: 8px; color: var(--wt-muted); font-size: 14px; }
.wt-section-heading { margin: 26px 0 14px; }
.wt-section-heading h3 { margin: 0; font-size: 20px; }
.wt-calc-actions { margin: 8px 0 22px; }
.wt-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 50px;
	padding: 12px 28px;
	border: 0;
	border-radius: 10px;
	background: #e40f8d;
	color: #fff;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
	transition: background-color .2s ease, transform .2s ease;
}
.wt-button:hover, .wt-button:focus-visible { background: #ff0000; color: #fff; }
.wt-button:active { transform: translateY(1px); }
.wt-result { padding: 24px; border: 1px solid var(--wt-border); border-radius: 16px; background: var(--wt-soft); }
.wt-result-hidden { display: none; }
.wt-result-main { padding: 22px; margin-bottom: 18px; border-radius: 14px; background: #fff; text-align: center; }
.wt-result-label { display: block; margin-bottom: 6px; color: var(--wt-muted); font-size: 14px; }
.wt-primary-result { display: block; font-size: clamp(30px, 5vw, 46px); line-height: 1.1; font-weight: 800; }
.wt-progress { margin: 20px 0; }
.wt-progress-track { height: 10px; overflow: hidden; border-radius: 999px; background: #eee7eb; }
.wt-progress-bar { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--wt-accent); transition: width .35s ease; }
.wt-progress-meta { display: flex; justify-content: space-between; gap: 10px; margin-top: 7px; color: var(--wt-muted); font-size: 13px; }
.wt-result-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 18px 0; }
.wt-stat { padding: 16px; border-radius: 12px; background: #fff; }
.wt-stat span { display: block; margin-bottom: 5px; color: var(--wt-muted); font-size: 13px; }
.wt-stat strong { font-size: 18px; }
.wt-explanation { margin: 18px 0; padding: 16px 18px; border-left: 3px solid var(--wt-accent); border-radius: 8px; background: #fff; }
.wt-scenario { margin-top: 20px; padding: 20px; border-radius: 12px; background: #fff; }
.wt-scenario h3 { margin: 0 0 8px; font-size: 18px; }
.wt-scenario p { margin: 0 0 14px; }
.wt-scenario-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.wt-reset-button { display: inline-block; margin-top: 18px; padding: 0; border: 0; background: transparent; color: var(--wt-accent); font: inherit; font-weight: 600; cursor: pointer; }
.wt-reset-button:hover { color: var(--wt-accent-hover); }
.wt-bar-item { margin: 14px 0; }
.wt-bar-item > div:first-child { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 6px; font-size: 14px; }
.wt-bars .wt-progress-track { height: 8px; }

@media (max-width: 700px) {
	.wt-calc-grid, .wt-calc-grid-2, .wt-calc-grid-3, .wt-result-grid { grid-template-columns: 1fr; }
	.wt-result { padding: 16px; }
	.wt-button { width: 100%; }
	.wt-choice, .wt-scenario-button { flex: 1 1 auto; }
}