/*
 * 개발자도구 열림 덮개. devtools-guard.js 가 <html>.dp-devtools-open 을 켜고
 * #dp-devtools-cover 를 붙인다. 디자인 토큰이 없는 페이지에도 얹힐 수 있으므로
 * var() 에 전부 폴백을 둔다.
 */
#dp-devtools-cover {
	position: fixed;
	inset: 0;
	z-index: 2147483647;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: var(--dp-surface-overlay, rgba(15, 23, 42, 0.92));
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
.dp-devtools-cover__box {
	max-width: 380px;
	padding: 28px 32px;
	border-radius: var(--dp-radius-lg, 12px);
	background: var(--dp-surface-elevated, #fff);
	color: var(--dp-text-primary, #0f172a);
	text-align: center;
	box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28);
}
.dp-devtools-cover__box strong {
	display: block;
	margin-bottom: 8px;
	font-size: 1.0625rem;
}
.dp-devtools-cover__box p {
	margin: 0;
	color: var(--dp-text-muted, #64748b);
	font-size: 0.8125rem;
	line-height: 1.6;
}
/* 덮개가 떠 있는 동안 뒤 내용은 읽히지 않게 흐린다. */
html.dp-devtools-open body > *:not(#dp-devtools-cover) {
	filter: blur(7px);
	pointer-events: none;
	user-select: none;
}
/* 인쇄에는 덮개가 끼어들지 않게 — 가격표 인쇄가 이 테마의 본업이다. */
@media print {
	#dp-devtools-cover { display: none !important; }
	html.dp-devtools-open body > *:not(#dp-devtools-cover) { filter: none !important; }
}