/* ============================================================
   Recipe Snapshot — frontend styles
   ============================================================ */

.rs-snapshot {
	--rs-bg:      #fafafa;
	--rs-label:   #1a1a1a;
	--rs-value:   #444;
	--rs-radius:  14px;
	--rs-shadow:  none;
	--rs-font:    -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

	font-family:   var(--rs-font);
	background:    var(--rs-bg);
	border-radius: var(--rs-radius);
	overflow:      visible;
	margin:        28px 0;
	box-shadow:    var(--rs-shadow);
}

/* ── Header ────────────────────────────────────────────────── */

.rs-snapshot .rs-heading {
	padding:        20px 24px 14px;
	text-align:     center;
	font-size:      27px;
	font-weight:    800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height:    1.3;
	color:          var(--rs-label);
}

.rs-snapshot .rs-heading-emoji {
	font-size:   20px;
	line-height: inherit;
	font-style:  normal;
}

/* ── Field list — stacked single column ───────────────────── */

.rs-snapshot .rs-grid {
	display:        flex;
	flex-direction: column;
	padding:        16px 24px 20px;
	gap:            10px;
}

.rs-snapshot .rs-field {
	font-size:   15px;
	line-height: 1.5;
}

/* Emoji */
.rs-snapshot .rs-emoji {
	font-style:   normal;
	font-size:    16px;
	line-height:  inherit;
	margin-right: 2px;
}

/* Bold label */
.rs-snapshot .rs-label {
	font-weight: 700;
	color:       var(--rs-label);
}

/* Regular value */
.rs-snapshot .rs-value {
	color:       var(--rs-value);
	font-weight: 400;
}

/* ── Theme-inherit mode ────────────────────────────────────── */

.rs-snapshot.rs-theme {
	font-family: inherit;
}

.rs-snapshot.rs-theme .rs-heading,
.rs-snapshot.rs-theme .rs-value,
.rs-snapshot.rs-theme .rs-label {
	color: inherit;
}

/* ── Responsive ────────────────────────────────────────────── */

@media (max-width: 480px) {
	.rs-snapshot .rs-heading {
		font-size: 16px;
		padding:   16px 18px 12px;
	}

	.rs-snapshot .rs-grid {
		padding: 14px 18px 16px;
		gap:     8px;
	}

	.rs-snapshot .rs-field {
		font-size: 14px;
	}
}