.pop-stickynote {
	--stickynote-bg: #fdedac;
	--stickynote-fg: #0f172a;
	--stickynote-accent: #854d0e;

	box-sizing: border-box;
	background: var(--stickynote-bg);
	color: var(--stickynote-fg);
	padding: 1.8rem;
	margin-block: 2rem;
	border: 1px solid var(--stickynote-bg);
	border-radius: 0.75rem;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.14);
}

.pop-stickynote--important {
	--stickynote-bg: #fdedac;
	--stickynote-accent: #854d0e;
}

.pop-stickynote--information {
	--stickynote-bg: #e0e7ff;
	--stickynote-accent: #4338ca;
}

.pop-stickynote--urgent {
	--stickynote-bg: #fee2e2;
	--stickynote-accent: #b91c1c;
}

.pop-stickynote--tip {
	--stickynote-bg: #dcfce7;
	--stickynote-accent: #15803d;
}

.pop-stickynote__meta {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 1.25rem;
	color: var(--stickynote-accent);
	font-size: 1.2rem;
	font-weight: 600;
}

.pop-stickynote__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 1.5rem;
	height: 1.5rem;
	font-size: 1.5rem;
	line-height: 1;
}

.pop-stickynote__icon svg {
	display: block;
	width: 100%;
	height: 100%;
}

.pop-stickynote__type {
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.pop-stickynote__title {
	margin: 0 0 0.75rem;
	color: inherit;
	font-size: clamp(1.35rem, 2vw, 1.75rem);
	line-height: 1.2;
}

.pop-stickynote__description,
.pop-stickynote__description p,
.pop-stickynote__description a,
.pop-stickynote__description strong,
.pop-stickynote__description em {
	color: inherit;
}

.pop-stickynote__description a {
	text-decoration: underline;
	text-underline-offset: 0.12em;
}

.pop-stickynote__description > :first-child {
	margin-top: 0;
}

.pop-stickynote__description > :last-child {
	margin-bottom: 0;
}

.pop-stickynote__related:empty {
	display: none;
}

.pop-stickynote__related:not(:empty) {
	margin-top: 1.5rem;
}

.pop-stickynote__related .wp-block-pop-help-readme-card {
	margin-top: 0;
	margin-bottom: 0;
}

.pop-stickynote__related .readme-card {
	box-shadow: none;
}
