/* Ramp Calculator (Other) — Math-style Three.js slope diagram. */

.pc-calc-shell[data-calculator="ramp"] .pc-diagram-formula {
	display: none !important;
}

.pc-calc-shell[data-calculator="ramp"] .pc-diagram-frame {
	height: auto;
	min-height: 0;
	max-height: none;
	aspect-ratio: 640 / 420;
	width: 100%;
}

.pc-calc-shell[data-calculator="ramp"] .pc-diagram.pc-rmp-diagram,
.pc-calc-shell[data-calculator="ramp"] .pc-diagram.pc-diagram--3d-only {
	display: block;
	padding: 0;
	min-height: 0;
	height: 100%;
	overflow: hidden;
	background: var(--pc-diagram-bg);
	border: 1px solid var(--pc-border);
	border-radius: var(--pc-radius-sm);
}

.pc-calc-shell[data-calculator="ramp"] .pc-oth-mode-note,
.pc-calc-shell[data-calculator="ramp"] .pc-oth-disclaimer {
	margin: 0.35rem 0 0.65rem;
	font-size: 0.75rem;
	line-height: 1.45;
	color: var(--pc-muted, #9ca3af);
}

.pc-calc-shell[data-calculator="ramp"] .pc-oth-check {
	margin: 0.5rem 0;
}

.pc-calc-shell[data-calculator="ramp"] .pc-oth-check .pc-field-label {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-weight: 500;
	cursor: pointer;
}

.pc-calc-shell[data-calculator="ramp"] .pc-oth-check input {
	margin-top: 0.2rem;
}

.pc-calc-shell[data-calculator="ramp"] .pc-oth-multi {
	margin-top: 0.65rem;
}

@media (min-width: 921px) {
	.pc-calc-shell[data-calculator="ramp"] .pc-calc-views > .pc-result {
		margin-top: 0.35rem;
	}
}