/* JinglePig Metal Prices — [jinglepig_metal_prices]. Brand tokens from BRAND.md; no theme dependency. */
.jpmp {
	--jpmp-deep-mint: #173D3A;
	--jpmp-coral: #E98976;
	--jpmp-gold: #E8B352;
	--jpmp-mint-mist: #ECF2ED;
	--jpmp-ink: #20343C;
	--jpmp-line: #DCE7E1;
	--jpmp-muted: #4f6963;
	margin: 32px 0;
	color: var(--jpmp-ink);
	font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
}
.jpmp-title {
	margin: 0 0 16px;
	color: var(--jpmp-deep-mint);
}
.jpmp-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
}
.jpmp-card {
	background: #fff;
	border: 1px solid var(--jpmp-line);
	border-top: 4px solid var(--jpmp-coral);
	border-radius: 18px;
	padding: 20px 20px 18px;
	box-shadow: 0 8px 20px #173d3a09;
	display: flex;
	flex-direction: column;
	min-width: 0;
}
.jpmp-card--xau { border-top-color: var(--jpmp-gold); }
.jpmp-card--xag { border-top-color: #C0CBD0; }
.jpmp-card--xpt { border-top-color: #9DB0BA; }
.jpmp-card--xpd { border-top-color: #8EBDAF; }
.jpmp-card--cu { border-top-color: #C7794B; }
.jpmp-card--zn { border-top-color: #A9B4B8; }
.jpmp-card--ni { border-top-color: #7F9A94; }
.jpmp-card p { margin: 0; }
.jpmp-name {
	font-weight: 800;
	color: var(--jpmp-deep-mint);
	font-size: 1rem;
	line-height: 1.3;
}
.jpmp-symbol {
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .1em;
	color: #466f64;
	margin-left: 4px;
}
.jpmp-price {
	margin-top: 10px !important;
	line-height: 1.15;
}
.jpmp-amount {
	display: block;
	font-size: clamp(1.45rem, 2.4vw, 1.9rem);
	font-weight: 800;
	letter-spacing: -.02em;
	color: var(--jpmp-deep-mint);
	font-variant-numeric: tabular-nums;
	overflow-wrap: anywhere;
}
.jpmp-unit {
	display: block;
	margin-top: 4px;
	font-size: .8rem;
	font-weight: 600;
	color: var(--jpmp-muted);
}
.jpmp-badge {
	align-self: flex-start;
	margin-top: 14px !important;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: .74rem;
	font-weight: 700;
	line-height: 1.5;
	background: var(--jpmp-mint-mist);
	color: var(--jpmp-deep-mint);
}
.jpmp-card[data-jpmp-status="unchanged"] .jpmp-badge { background: #FBF0D9; color: #6B4E12; }
.jpmp-card[data-jpmp-status="stale"] .jpmp-badge { background: #FBE3DD; color: #8A3426; }
.jpmp-card[data-jpmp-status="manual"] .jpmp-badge { background: #E6ECF4; color: #22405F; }
.jpmp-card[data-jpmp-status="unavailable"] .jpmp-badge { background: #EEF0F0; color: #44535A; }
.jpmp-card[data-jpmp-status="stale"] { border-top-color: var(--jpmp-coral); }
.jpmp-card[data-jpmp-status="stale"] .jpmp-amount,
.jpmp-card[data-jpmp-status="unavailable"] .jpmp-amount { color: #5d6f6b; }
.jpmp-time {
	margin-top: 8px !important;
	font-size: .78rem;
	color: var(--jpmp-muted);
	line-height: 1.45;
}
.jpmp-footnote {
	margin: 14px 2px 0;
	font-size: .8rem;
	line-height: 1.55;
	color: var(--jpmp-muted);
}
.jpmp-footnote span + span::before { content: " "; }
.jpmp-alert {
	margin: 10px 0 0;
	padding: 10px 14px;
	border-radius: 12px;
	background: #FBE3DD;
	color: #7a2e21;
	font-size: .85rem;
	font-weight: 600;
}
.jpmp-alert[hidden] { display: none; }
@media (max-width: 900px) {
	.jpmp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
}
@media (max-width: 480px) {
	.jpmp-card { padding: 16px 14px 14px; border-radius: 14px; }
	.jpmp-amount { font-size: 1.35rem; }
	.jpmp-badge { font-size: .7rem; padding: 2px 8px; }
}
@media (max-width: 330px) {
	.jpmp-grid { grid-template-columns: 1fr; }
}
@media print {
	.jpmp-card { box-shadow: none; }
}
