.tc-calc{
	--tc-s1:#2a78d6;
	--tc-s2:#eb6834;
	--tc-s3:#1baf7a;
	--tc-surface:#fff;
	--tc-grid:#e1e0d9;
	--tc-axis:#c3c2b7;
	--tc-ink:var(--color-text,#16191b);
	--tc-ink-2:var(--color-text-muted,#5c6569);
	--tc-line:var(--color-grey-200,#e3e6e8);
	--tc-bg:var(--color-grey-100,#f4f5f6);
	--tc-accent:var(--color-primary,#E3130F);
	--tc-radius:var(--radius-md,16px);
	color:var(--tc-ink);
}
.tc-calc *{ box-sizing:border-box; }

.tc-calc__layout{
	display:grid;
	grid-template-columns:minmax(0,340px) minmax(0,1fr);
	gap:32px;
	align-items:start;
}
@media (max-width:960px){
	.tc-calc__layout{ grid-template-columns:minmax(0,1fr); gap:24px; }
}

.tc-calc__inputs{
	background:var(--tc-bg);
	border:1px solid var(--tc-line);
	border-radius:var(--tc-radius);
	padding:24px;
	display:grid;
	gap:18px;
}
@media (min-width:961px){
	.tc-calc__inputs{ position:sticky; top:calc(var(--nav-height,80px) + 24px); }
}

.tc-calc__field{ display:grid; gap:6px; }
.tc-calc__field label{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:8px;
	font-weight:600;
	font-size:.92rem;
}
.tc-calc__unit{
	font-weight:500;
	color:var(--tc-ink-2);
	font-size:.85rem;
}
.tc-calc select,
.tc-calc input[type="number"]{
	width:100%;
	min-height:46px;
	padding:10px 14px;
	font:inherit;
	color:var(--tc-ink);
	background:#fff;
	border:1px solid #c9cfd2;
	border-radius:var(--radius-sm,8px);
}
.tc-calc input[readonly]{
	background:#eceef0;
	color:var(--tc-ink-2);
	cursor:default;
}
.tc-calc select:focus-visible,
.tc-calc input:focus-visible{
	outline:3px solid rgba(42,120,214,.45);
	outline-offset:1px;
	border-color:#2a78d6;
}
.tc-calc__help{ margin:0; font-size:.82rem; color:var(--tc-ink-2); line-height:1.45; }
.tc-calc__error{ margin:0; font-size:.84rem; color:#b3201d; font-weight:600; }
.tc-calc__error[hidden]{ display:none; }

.tc-calc__temp{
	display:grid;
	grid-template-columns:minmax(0,1fr) 92px;
	gap:12px;
	align-items:center;
}
.tc-calc input[type="range"]{
	width:100%;
	accent-color:#2a78d6;
	min-height:28px;
	cursor:pointer;
}

.tc-calc__compare{
	border-top:1px solid var(--tc-line);
	padding-top:18px;
	display:grid;
	gap:14px;
}
.tc-calc__compare-title{ margin:0; font-weight:700; font-size:.92rem; }

.tc-calc__swatch{
	display:inline-block;
	width:12px;
	height:12px;
	border-radius:50%;
	flex:none;
	background:var(--tc-s1);
}
.tc-calc__swatch--s1{ background:var(--tc-s1); }
.tc-calc__swatch--s2{ background:var(--tc-s2); }
.tc-calc__swatch--s3{ background:var(--tc-s3); }

.tc-calc__output{ display:grid; gap:24px; min-width:0; }

.tc-calc__results{
	background:#fff;
	border:1px solid var(--tc-line);
	border-radius:var(--tc-radius);
	padding:24px;
	box-shadow:var(--shadow-sm,0 1px 3px rgba(0,0,0,.06));
}
.tc-calc__hero{ display:grid; gap:4px; }
.tc-calc__label{ font-size:.85rem; font-weight:600; color:var(--tc-ink-2); text-transform:uppercase; letter-spacing:.04em; }
.tc-calc__value{
	font-size:clamp(2rem,5vw,3rem);
	line-height:1.1;
	font-weight:700;
	color:var(--tc-ink);
	overflow-wrap:anywhere;
}
.tc-calc__sub{ color:var(--tc-ink-2); font-size:.95rem; }

.tc-calc__facts{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:16px;
	margin:20px 0 0;
	padding-top:18px;
	border-top:1px solid var(--tc-line);
}
.tc-calc__facts dt{ font-size:.8rem; color:var(--tc-ink-2); font-weight:600; margin:0 0 2px; }
.tc-calc__facts dd{ margin:0; font-weight:700; font-size:1.05rem; overflow-wrap:anywhere; }
@media (max-width:560px){
	.tc-calc__facts{ grid-template-columns:minmax(0,1fr); gap:10px; }
	.tc-calc__facts > div{ display:flex; justify-content:space-between; gap:12px; align-items:baseline; }
	.tc-calc__facts dt{ margin:0; }
}

.tc-calc__hint{
	margin:18px 0 0;
	padding:12px 14px;
	background:#fff6e0;
	border-left:4px solid #eda100;
	border-radius:6px;
	font-size:.9rem;
	line-height:1.5;
}
.tc-calc__hint[hidden]{ display:none; }

.tc-calc__chart{
	margin:0;
	background:var(--tc-surface);
	border:1px solid var(--tc-line);
	border-radius:var(--tc-radius);
	padding:20px 20px 12px;
	min-width:0;
}
.tc-calc__chart figcaption{ display:grid; gap:2px; margin-bottom:10px; }
.tc-calc__chart-title{ font-weight:700; font-size:1.05rem; }
.tc-calc__chart-sub{ color:var(--tc-ink-2); font-size:.85rem; }

.tc-calc__legend{
	list-style:none;
	margin:0 0 8px;
	padding:0;
	display:flex;
	flex-wrap:wrap;
	gap:6px 20px;
	font-size:.88rem;
}
.tc-calc__legend[hidden]{ display:none; }
.tc-calc__legend li{ display:flex; align-items:center; gap:8px; margin:0; }

.tc-calc__plot{ position:relative; width:100%; min-height:300px; }
.tc-calc__svg{ display:block; width:100%; height:auto; overflow:visible; touch-action:pan-y; }
.tc-calc__empty{ margin:0; padding:40px 0; text-align:center; color:var(--tc-ink-2); }

.tc-calc__grid{ stroke:var(--tc-grid); stroke-width:1; }
.tc-calc__grid--v{ stroke-opacity:.6; }
.tc-calc__zero{ stroke:var(--tc-axis); stroke-width:1.5; }
.tc-calc__tick{ fill:var(--tc-ink-2); font-size:12px; font-family:inherit; font-variant-numeric:tabular-nums; }
.tc-calc__axis-title{ fill:var(--tc-ink-2); font-size:12px; font-weight:600; font-family:inherit; }
.tc-calc__refline{ stroke:var(--tc-axis); stroke-width:1; stroke-dasharray:4 4; }
.tc-calc__ref-label{ fill:var(--tc-ink-2); font-size:11px; font-family:inherit; }
.tc-calc__end-label{ fill:var(--tc-ink); font-size:12px; font-weight:600; font-family:inherit; }

.tc-calc__line{ fill:none; stroke-width:2; stroke-linecap:round; }
.tc-calc__line--s1{ stroke:var(--tc-s1); }
.tc-calc__line--s2{ stroke:var(--tc-s2); }
.tc-calc__line--s3{ stroke:var(--tc-s3); }

.tc-calc__cross{ stroke:var(--tc-ink-2); stroke-width:1; stroke-opacity:.55; }
.tc-calc__dot{ stroke:var(--tc-surface); stroke-width:2; }
.tc-calc__dot--s1{ fill:var(--tc-s1); }
.tc-calc__dot--s2{ fill:var(--tc-s2); }
.tc-calc__dot--s3{ fill:var(--tc-s3); }
.tc-calc__overlay{ cursor:crosshair; }

.tc-calc__tip{
	position:absolute;
	z-index:3;
	pointer-events:none;
	background:#fff;
	border:1px solid var(--tc-line);
	border-radius:10px;
	box-shadow:0 6px 20px rgba(0,0,0,.14);
	padding:10px 12px;
	font-size:.84rem;
	line-height:1.5;
	white-space:nowrap;
}
.tc-calc__tip[hidden]{ display:none; }
.tc-calc__tip strong{ display:block; margin-bottom:2px; }
.tc-calc__tip div{ display:flex; align-items:center; gap:8px; }

.tc-calc__details{
	background:#fff;
	border:1px solid var(--tc-line);
	border-radius:var(--tc-radius);
	padding:0 20px;
}
.tc-calc__details summary{
	cursor:pointer;
	font-weight:600;
	padding:14px 0;
}
.tc-calc__details[open] summary{ border-bottom:1px solid var(--tc-line); margin-bottom:12px; }
.tc-calc__details .tc-calc__table-wrap{ padding-bottom:16px; }

.tc-calc__table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.tc-calc__ref-table{
	width:100%;
	border-collapse:collapse;
	font-size:.93rem;
	font-variant-numeric:tabular-nums;
}
.tc-calc__ref-table th,
.tc-calc__ref-table td{
	padding:9px 12px;
	text-align:left;
	border-bottom:1px solid var(--tc-line);
}
.tc-calc__ref-table thead th{
	font-size:.8rem;
	letter-spacing:.02em;
	color:var(--tc-ink-2);
	background:var(--tc-bg);
	white-space:nowrap;
}
.tc-calc__ref-table tbody th{ font-weight:600; }
.tc-calc__ref-table .is-num{ text-align:right; white-space:nowrap; }
.tc-calc__ref-group th{
	background:var(--tc-bg);
	font-size:.8rem;
	text-transform:uppercase;
	letter-spacing:.04em;
	color:var(--tc-ink-2);
}

.tc-calc__note{ margin:0; font-size:.85rem; color:var(--tc-ink-2); line-height:1.55; }

.tc-calc__ref{ margin-top:56px; }
.tc-calc__ref h2{ margin:0 0 8px; font-size:1.5rem; }
.tc-calc__ref > p{ margin:0 0 20px; color:var(--tc-ink-2); }
.tc-calc__ref .tc-calc__table-wrap{
	background:#fff;
	border:1px solid var(--tc-line);
	border-radius:var(--tc-radius);
	margin-bottom:14px;
}