.yngn-posts-section {
	--yngn-gap: 16px;
	--yngn-radius: 6px;
	--yngn-border: var(--main-border-color, rgba(50, 50, 50, .06));
	--yngn-shadow: 0 1px 2px rgba(34, 36, 38, .025);
	--yngn-loading-footer-gap: 32px
}

.yngn-posts-section {
	position: relative
}

.yngn-masonry {
	display: grid;
	grid-auto-rows: 8px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--yngn-gap);
	align-items: start
}

.yngn-first-layout-stage {
	display: grid
}

.yngn-first-layout-stage>.yngn-first-layout-skeleton,
.yngn-first-layout-stage>.yngn-masonry {
	grid-area: 1/1
}

.yngn-first-layout-skeleton {
	display: none
}

.yngn-first-layout-pending .yngn-first-layout-skeleton {
	display: block
}

.yngn-first-layout-pending>.yngn-loading-slot,
.yngn-first-layout-pending>.yngn-posts-empty {
	visibility: hidden
}

.yngn-masonry.yngn-layout-pending,
.yngn-post-card.yngn-layout-pending-card {
	visibility: hidden
}

.yngn-post-card {
	position: relative;
	min-width: 0;
	overflow: hidden;
	border: 0;
	border-radius: var(--yngn-radius);
	background: var(--main-bg-color, #fff);
	box-shadow: var(--yngn-shadow)
}

.yngn-post-skeleton {
	--yngn-skeleton-base: rgba(125, 125, 125, .1);
	--yngn-skeleton-shine: rgba(255, 255, 255, .46);
	min-width: 0;
	overflow: hidden;
	border-radius: var(--yngn-radius);
	background: var(--main-bg-color, #fff);
	box-shadow: var(--yngn-shadow);
	pointer-events: none
}

.yngn-initial-skeleton-grid {
	--yngn-gap: 16px;
	--yngn-radius: 6px;
	--yngn-shadow: 0 1px 2px rgba(34, 36, 38, .025);
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--yngn-gap);
	padding-bottom: 32px;
	align-items: start
}

.yngn-first-layout-skeleton .yngn-initial-skeleton-grid {
	padding-bottom: 0
}

.yngn-initial-skeleton-column {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: var(--yngn-gap)
}

.yngn-loading-slot {
	display: flex;
	height: 46px;
	margin-top: 16px;
	align-items: center;
	justify-content: center;
	transition: margin-top .2s ease
}

.yngn-loading-slot-done {
	height: 0;
	margin-top: 0
}

.yngn-loading-slot-done .yngn-load-more {
	display: none
}

.yngn-loading-skeleton-grid {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: 1;
	opacity: 0;
	visibility: hidden;
	transition: opacity .2s ease
}

.yngn-loading-skeleton-grid>.yngn-post-skeleton {
	position: absolute;
	top: 0;
	left: 0
}

.yngn-loading-slot-active .yngn-loading-skeleton-grid {
	opacity: 1;
	visibility: visible
}

.yngn-loading-slot-leave .yngn-loading-skeleton-grid {
	opacity: 0;
	visibility: visible
}

.yngn-loading-slot-active .yngn-load-more,
.yngn-loading-slot-leave .yngn-load-more {
	visibility: hidden
}

.yngn-loading-slot .yngn-load-more {
	margin: 0
}

.yngn-loaded-card {
	opacity: 0;
	transform: translateY(10px);
	transition: opacity .22s ease, transform .22s ease
}

.yngn-loaded-card-ready {
	opacity: 1;
	transform: none
}

.dark-theme .yngn-post-skeleton {
	--yngn-skeleton-base: rgba(255, 255, 255, .09);
	--yngn-skeleton-shine: rgba(255, 255, 255, .08)
}

.yngn-skeleton-block {
	background: linear-gradient(100deg, transparent 24%, var(--yngn-skeleton-shine) 42%, transparent 60%) 150% 0/220% 100% no-repeat, var(--yngn-skeleton-base);
	animation: yngn-skeleton-shimmer 1.35s ease-in-out infinite
}

.yngn-skeleton-media {
	width: 100%;
	height: 0;
	padding-top: 88%
}

.yngn-post-skeleton-2 .yngn-skeleton-media {
	padding-top: 118%
}

.yngn-post-skeleton-3 .yngn-skeleton-media {
	padding-top: 76%
}

.yngn-post-skeleton-4 .yngn-skeleton-media {
	padding-top: 104%
}

.yngn-skeleton-body {
	display: flex;
	padding: 15px 16px 16px;
	flex-direction: column;
	gap: 9px
}

.yngn-skeleton-title {
	display: block;
	width: 100%;
	height: 14px;
	border-radius: 7px
}

.yngn-skeleton-title-short {
	width: 68%
}

.yngn-skeleton-author {
	display: flex;
	min-width: 0;
	margin-top: 4px;
	align-items: center;
	gap: 7px
}

.yngn-skeleton-avatar {
	width: 24px;
	height: 24px;
	flex: 0 0 24px;
	border-radius: 50%
}

.yngn-skeleton-name {
	width: 34%;
	height: 10px;
	border-radius: 5px
}

.yngn-skeleton-stat {
	width: 22%;
	height: 10px;
	margin-left: auto;
	border-radius: 5px
}

@keyframes yngn-skeleton-shimmer {
	to {
		background-position: -150% 0, 0 0
	}
}

.yngn-card-media {
	position: relative;
	display: block;
	width: 100%;
	overflow: hidden;
	border: 0;
	padding: 0;
	background: rgba(125, 125, 125, .08);
	color: inherit;
	font: inherit;
	text-align: left;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none
}

.yngn-card-media::after,
.yngn-card-text-cover::after {
	position: absolute;
	inset: 0;
	z-index: 2;
	background: rgba(0, 0, 0, .1);
	content: "";
	opacity: 0;
	pointer-events: none;
	transition: opacity .2s ease
}

.yngn-card-media:hover::after,
.yngn-card-text-cover:hover::after {
	opacity: 1
}

.yngn-card-media img,
.yngn-card-media video {
	display: block;
	width: 100%;
	max-height: 680px;
	object-fit: cover;
	transition: transform .25s ease
}

.yngn-card-media:hover img {
	transform: scale(1.025)
}

.yngn-card-media.yngn-suppress-hover::after,
.yngn-card-text-cover.yngn-suppress-hover::after {
	opacity: 0
}

.yngn-card-media.yngn-suppress-hover img {
	transform: none
}

.yngn-card-text-cover {
	--yngn-tone-bg: rgba(79, 129, 189, .075);
	--yngn-tone-accent: rgba(79, 129, 189, .18);
	position: relative;
	display: block;
	width: 100%;
	height: 0;
	border: 0;
	padding-top: 130%;
	overflow: hidden;
	border-radius: var(--yngn-radius) var(--yngn-radius) 0 0;
	background: linear-gradient(180deg, rgba(255, 255, 255, .34), rgba(255, 255, 255, 0)), var(--yngn-tone-bg);
	color: inherit;
	font: inherit;
	text-align: inherit;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none
}

.yngn-card-tone-2 {
	--yngn-tone-bg: rgba(82, 153, 122, .075);
	--yngn-tone-accent: rgba(82, 153, 122, .18)
}

.yngn-card-tone-3 {
	--yngn-tone-bg: rgba(202, 151, 63, .075);
	--yngn-tone-accent: rgba(202, 151, 63, .18)
}

.yngn-card-tone-4 {
	--yngn-tone-bg: rgba(166, 98, 120, .07);
	--yngn-tone-accent: rgba(166, 98, 120, .17)
}

.yngn-card-tone-5 {
	--yngn-tone-bg: rgba(109, 124, 138, .07);
	--yngn-tone-accent: rgba(109, 124, 138, .17)
}

.dark-theme .yngn-card-text-cover {
	--yngn-tone-bg: #526f91;
	--yngn-tone-accent: rgba(204, 228, 255, .4);
	background: linear-gradient(155deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .025) 54%, rgba(0, 0, 0, .06)), var(--yngn-tone-bg)
}

.dark-theme .yngn-card-tone-2 {
	--yngn-tone-bg: #4f7967;
	--yngn-tone-accent: rgba(198, 245, 219, .38)
}

.dark-theme .yngn-card-tone-3 {
	--yngn-tone-bg: #806943;
	--yngn-tone-accent: rgba(255, 226, 170, .4)
}

.dark-theme .yngn-card-tone-4 {
	--yngn-tone-bg: #7c5d69;
	--yngn-tone-accent: rgba(255, 211, 228, .38)
}

.dark-theme .yngn-card-tone-5 {
	--yngn-tone-bg: #596d7d;
	--yngn-tone-accent: rgba(218, 235, 248, .38)
}

.yngn-card-cover-content,
.yngn-card-pattern {
	position: absolute;
	inset: 0
}

.yngn-card-cover-content,
.yngn-card-mark,
.yngn-card-pattern {
	transition: transform .25s ease
}

.yngn-card-text-cover:hover .yngn-card-cover-content,
.yngn-card-text-cover:hover .yngn-card-mark,
.yngn-card-text-cover:hover .yngn-card-pattern {
	transform: scale(1.025)
}

.yngn-card-text-cover.yngn-suppress-hover .yngn-card-cover-content,
.yngn-card-text-cover.yngn-suppress-hover .yngn-card-mark,
.yngn-card-text-cover.yngn-suppress-hover .yngn-card-pattern {
	transform: none
}

.yngn-card-pattern {
	background: radial-gradient(var(--yngn-tone-accent) .7px, transparent .7px) 0 0/13px 13px, linear-gradient(135deg, transparent, rgba(255, 255, 255, .22));
	opacity: .45
}

.yngn-card-mark {
	position: absolute;
	right: -4px;
	bottom: -13px;
	color: var(--yngn-tone-accent);
	font-size: clamp(82px, 8vw, 118px);
	font-weight: 700;
	line-height: 1;
	opacity: .2;
	pointer-events: none
}

.yngn-card-cover-content {
	z-index: 1;
	display: flex;
	padding: 14px 20px;
	justify-content: space-between;
	flex-direction: column
}

.yngn-card-cover-meta {
	display: flex;
	min-width: 0;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	color: rgba(45, 49, 53, .45);
	font-size: 12px;
	font-weight: 500;
	line-height: 16px
}

.yngn-card-cover-copy {
	display: -webkit-box;
	overflow: hidden;
	color: var(--main-color, #2c2f32);
	font-weight: 500;
	text-align: center;
	-webkit-box-orient: vertical
}

.yngn-card-cover-copy-short {
	font-size: 22px;
	line-height: 1.45;
	-webkit-line-clamp: 3
}

.yngn-card-cover-copy-medium {
	font-size: 20px;
	line-height: 1.55;
	-webkit-line-clamp: 5
}

.yngn-card-cover-copy-long {
	font-size: 16px;
	line-height: 1.65;
	text-align: left;
	-webkit-line-clamp: 8
}

.yngn-card-cover-footer {
	color: rgba(45, 49, 53, .45);
	font-size: 12px;
	line-height: 16px
}

.dark-theme .yngn-card-cover-footer,
.dark-theme .yngn-card-cover-meta {
	color: rgba(247, 250, 253, .72)
}

.dark-theme .yngn-card-cover-copy {
	color: #f7fafd;
	text-shadow: 0 1px 2px rgba(0, 0, 0, .16)
}

.yngn-card-body {
	position: relative;
	display: flex;
	padding: 15px 16px 16px;
	flex-direction: column;
	gap: 12px
}

.yngn-card-title {
	display: -webkit-box;
	width: 100%;
	overflow: hidden;
	border: 0;
	padding: 0;
	background: 0 0;
	color: inherit;
	font-family: inherit;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	text-align: left;
	cursor: pointer;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	-webkit-appearance: none;
	appearance: none
}

.yngn-card-media:focus-visible,
.yngn-card-text-cover:focus-visible {
	outline: 2px solid var(--focus-color, #409eff);
	outline-offset: -3px
}

.yngn-card-title:focus-visible {
	outline: 2px solid var(--focus-color, #409eff);
	outline-offset: 2px
}

.yngn-card-author {
	display: flex;
	min-width: 0;
	align-items: center;
	flex-wrap: nowrap;
	gap: 8px;
	color: var(--muted-color, #777);
	font-size: 12px
}

.yngn-card-author-link {
	display: flex;
	min-width: 0;
	overflow: visible;
	flex: 1 1 auto;
	align-items: center;
	gap: 6px;
	color: inherit
}

.yngn-card-author-link:hover {
	color: var(--theme-color, #3a7afe)
}

.yngn-card-author-link>.avatar-img {
	--this-size: 24px;
	flex: 0 0 24px;
	border: 0;
	box-shadow: none
}

.yngn-card-author-link>.avatar-img>img.avatar {
	width: 100%;
	height: 100%;
	border: 0;
	object-fit: cover
}

.yngn-card-author-name {
	display: block;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.yngn-card-stats {
	display: flex;
	flex: 0 0 auto;
	margin-left: auto;
	align-items: center;
	gap: 7px;
	white-space: nowrap
}

.yngn-card-stats>.item {
	display: inline-flex;
	margin: 0;
	align-items: center;
	gap: 3px
}

.yngn-card-stats .icon {
	width: 1em;
	height: 1em;
	fill: currentColor
}

.yngn-load-more {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 20px auto 0;
	border: 0;
	border-radius: 30px;
	padding: 5px 15px;
	background: 0 0;
	color: var(--muted-color, #777);
	font: inherit;
	line-height: 1.42857143;
	opacity: .6;
	cursor: pointer;
	transition: background .3s, color .2s, opacity .3s
}

.yngn-load-more:focus-visible,
.yngn-load-more:hover {
	background: var(--main-border-color, rgba(50, 50, 50, .06));
	color: var(--muted-color, #777);
	opacity: 1
}

.yngn-load-more:focus-visible {
	outline: 2px solid var(--focus-color, #409eff);
	outline-offset: 2px
}

.yngn-load-more-icon {
	display: inline-flex;
	width: 1em;
	height: 1em;
	margin-right: 15px;
	align-items: center;
	justify-content: center;
	transition: margin-right .3s
}

.yngn-load-more:focus-visible .yngn-load-more-icon,
.yngn-load-more:hover .yngn-load-more-icon {
	margin-right: 8px
}

.yngn-load-more.is-error {
	color: #ff5473;
	opacity: .85
}

.yngn-auto-sentinel {
	height: 1px
}

html.yngn-modal-open {
	overflow-x: hidden;
	overflow-y: scroll
}

body.yngn-modal-open {
	position: fixed;
	top: calc(-1 * var(--yngn-modal-scroll-top, 0px));
	right: 0;
	left: 0;
	overflow: hidden
}

body.yngn-modal-open>.modal-backdrop {
	z-index: 2147483200 !important
}

body.yngn-modal-open>.modal,
body.yngn-modal-open>.popover,
body.yngn-modal-open>.tooltip {
	z-index: 2147483300 !important
}

body.yngn-modal-open>#mini-imgbox {
	z-index: 2147483400 !important
}

body.yngn-modal-open.yngn-modal-imgbox-prepared .yngn-modal-backdrop {
	-webkit-backdrop-filter: blur(10px) !important;
	backdrop-filter: blur(10px) !important
}

body.yngn-modal-open>.notyn {
	z-index: 2147483500 !important
}

.yngn-modal {
	position: fixed;
	z-index: 2147483000;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	isolation: isolate;
	padding: 5vh 4.3vw;
	pointer-events: none
}

.yngn-modal.yngn-is-visible {
	pointer-events: auto
}

.yngn-modal.yngn-is-closing {
	z-index: var(--yngn-modal-return-z-index, 2147483000);
	pointer-events: auto
}

.yngn-modal-backdrop {
	position: absolute;
	z-index: 0;
	background: rgba(78, 82, 86, .56);
	inset: 0;
	backdrop-filter: blur(10px);
	opacity: 0;
	transition: opacity 320ms cubic-bezier(.4, 0, .2, 1);
	will-change: opacity
}

.yngn-modal-close {
	display: none
}

.yngn-modal.yngn-is-visible .yngn-modal-backdrop {
	opacity: 1
}

.yngn-modal.yngn-has-origin:not(.yngn-is-closing) .yngn-modal-backdrop {
	opacity: 1;
	transition-duration: 140ms
}

.yngn-modal.yngn-has-origin.yngn-is-closing .yngn-modal-backdrop {
	opacity: 0;
	transition-delay: 0s;
	transition-duration: .4s
}

.yngn-modal.yngn-is-preparing .yngn-modal-backdrop,
.yngn-modal.yngn-is-preparing .yngn-modal-cover,
.yngn-modal.yngn-is-preparing .yngn-modal-dialog,
.yngn-modal.yngn-is-preparing .yngn-modal-loading-cover {
	transition: none
}

.yngn-modal-dialog {
	--yngn-modal-media-bg: #f8faf9;
	position: relative;
	z-index: 2;
	display: flex;
	width: var(--yngn-modal-width, 112vh);
	max-width: 100%;
	height: min(90vh, 880px);
	overflow: visible;
	border-radius: 4px;
	background: 0 0;
	opacity: 0;
	clip-path: inset(0 0 0 0 round 4px);
	transform: translate3d(0, 14px, 0) scale(.985);
	transform-origin: left top;
	transition: clip-path .4s cubic-bezier(.4, 0, .2, 1), transform .4s cubic-bezier(.4, 0, .2, 1), opacity 280ms cubic-bezier(.4, 0, .2, 1);
	will-change: clip-path, transform, opacity
}

.dark-theme .yngn-modal-dialog {
	--yngn-modal-media-bg: #292b2e
}

.yngn-modal.yngn-is-visible .yngn-modal-dialog {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
	transition-delay: 70ms
}

.yngn-modal.yngn-is-closing .yngn-modal-dialog {
	transition-delay: 0s
}

.yngn-modal.yngn-has-origin.yngn-is-closing .yngn-modal-dialog {
	opacity: 0;
	transition: clip-path .4s cubic-bezier(.4, 0, .2, 1), transform .4s cubic-bezier(.4, 0, .2, 1), opacity 120ms ease-out 280ms
}

@media (min-width:696px) {
	.yngn-modal-close {
		position: absolute;
		z-index: 3;
		top: 12px;
		right: 12px;
		display: inline-flex;
		width: 38px;
		height: 38px;
		padding: 0;
		align-items: center;
		justify-content: center;
		border: 0;
		border-radius: 50%;
		color: rgba(255, 255, 255, .92);
		background: rgba(25, 28, 31, .24);
		box-shadow: none;
		opacity: 0;
		cursor: pointer;
		transform: scale(.92);
		transition: color .18s ease, background-color .18s ease, opacity .18s ease, transform .18s ease
	}

	.yngn-modal-close .icon {
		width: 18px;
		height: 18px;
		margin: 0
	}

	.yngn-modal.yngn-is-visible .yngn-modal-close {
		opacity: 1;
		transform: scale(1)
	}

	.yngn-modal-close:focus-visible,
	.yngn-modal-close:hover {
		color: #fff;
		background: rgba(25, 28, 31, .46);
		outline: 0
	}

	.yngn-modal-close:focus-visible {
		box-shadow: 0 0 0 3px rgba(255, 255, 255, .32)
	}

	.yngn-modal-dialog {
		position: absolute;
		top: 0;
		left: 0;
		height: var(--yngn-modal-height, min(90vh, 880px));
		transform: translate3d(var(--yngn-modal-left, 0), calc(var(--yngn-modal-top, 0) + 14px), 0) scale(.985)
	}

	.yngn-modal.yngn-is-visible .yngn-modal-dialog {
		transform: translate3d(var(--yngn-modal-left, 0), var(--yngn-modal-top, 0), 0) scale(1)
	}

	.yngn-modal.yngn-has-origin .yngn-modal-dialog {
		overflow: hidden;
		opacity: 1;
		clip-path: inset(0 var(--yngn-modal-start-clip-right) 0 0 round 4px);
		transform: translate3d(var(--yngn-modal-start-left), var(--yngn-modal-start-top), 0) scale(var(--yngn-modal-start-scale-x), var(--yngn-modal-start-scale-y));
		transition-delay: 0s
	}

	.yngn-modal.yngn-has-origin .yngn-modal-cover,
	.yngn-modal.yngn-has-origin .yngn-modal-loading-cover {
		transform: scale(var(--yngn-modal-media-scale-x, 1), var(--yngn-modal-media-scale-y, 1));
		transition-delay: 0s
	}

	.yngn-modal.yngn-has-origin.yngn-is-visible .yngn-modal-dialog {
		clip-path: inset(0 0 0 0 round 4px);
		transform: translate3d(var(--yngn-modal-left), var(--yngn-modal-top), 0) scale(1)
	}

	.yngn-modal.yngn-has-origin.yngn-is-visible .yngn-modal-cover,
	.yngn-modal.yngn-has-origin.yngn-is-visible .yngn-modal-loading-cover {
		transform: scale(1)
	}

	.yngn-modal-body {
		width: var(--yngn-modal-width);
		min-width: var(--yngn-modal-width);
		flex: 0 0 var(--yngn-modal-width)
	}
}

@media (min-width:960px) {
	.yngn-modal-close {
		top: var(--yngn-modal-top, 5vh);
		right: auto;
		left: calc(var(--yngn-modal-left, 0px) + var(--yngn-modal-width, 112vh) + 12px)
	}
}

.yngn-modal-body {
	width: 100%;
	height: 100%;
	padding: 0;
	overflow: hidden;
	border-radius: 4px;
	background: var(--main-bg-color, #fff);
	box-shadow: none;
	overscroll-behavior: contain
}

.yngn-modal-state {
	display: flex;
	min-height: 100%;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 12px;
	color: var(--muted-color, #777);
	text-align: center
}

.yngn-modal-loading-preview {
	display: grid;
	width: 100%;
	height: 100%;
	min-height: 0;
	grid-template-columns: var(--yngn-modal-media-width, minmax(0, 1fr)) var(--yngn-modal-side-width, minmax(0, 1fr))
}

.yngn-modal-cover-pane,
.yngn-modal-loading-cover {
	min-width: 0;
	min-height: 0;
	overflow: hidden;
	background: var(--yngn-modal-media-bg)
}

.yngn-modal-cover,
.yngn-modal-loading-cover {
	transform: scale(1);
	transform-origin: center;
	transition: transform .4s cubic-bezier(.4, 0, .2, 1);
	will-change: transform
}

.yngn-modal-loading-cover>.yngn-card-media,
.yngn-modal-loading-cover>.yngn-card-text-cover,
.yngn-modal-loading-cover>.yngn-post-card {
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	pointer-events: none !important
}

.yngn-modal-loading-cover>.yngn-card-media {
	background: 0 0 !important
}

.yngn-modal-loading-cover>.yngn-card-media.yngn-video-card {
	background: #000 !important
}

.yngn-modal-loading-cover .yngn-card-media::after,
.yngn-modal-loading-cover .yngn-card-text-cover::after {
	display: none
}

.yngn-modal-loading-cover img,
.yngn-modal-loading-cover video {
	width: 100% !important;
	height: 100% !important;
	max-height: none !important;
	object-fit: contain;
	transform: none !important
}

.yngn-modal-loading-copy {
	display: grid;
	min-width: 0;
	min-height: 0;
	place-items: center;
	background: var(--main-bg-color, #fff)
}

.yngn-modal-loading-spinner {
	box-sizing: border-box;
	width: 28px;
	height: 28px;
	border: 3px solid rgba(125, 125, 125, .18);
	border-top-color: var(--theme-color, #3a7afe);
	border-radius: 50%;
	animation: yngn-modal-loading-spin .72s linear infinite
}

@keyframes yngn-modal-loading-spin {
	to {
		transform: rotate(360deg)
	}
}

.yngn-modal-article {
	display: grid;
	height: 100%;
	min-height: 0;
	grid-template-columns: var(--yngn-modal-media-width, minmax(0, 1fr)) var(--yngn-modal-side-width, minmax(0, 1fr))
}

.yngn-modal-cover {
	display: grid;
	width: 100%;
	height: 100%;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: minmax(0, 1fr);
	place-items: center
}

.yngn-modal-cover>* {
	width: 100%;
	height: 100%;
	min-width: 0;
	min-height: 0;
	margin: 0 !important
}

.yngn-modal-native-media {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: minmax(0, 1fr);
	place-items: center
}

.yngn-modal-dplayer-media {
	background: #000
}

.yngn-modal-dplayer {
	width: 100%;
	height: 100%
}

.yngn-modal-dplayer>.graphic {
	width: 100%;
	height: 100%;
	padding-bottom: 0 !important
}

.yngn-modal-dplayer .dplayer-video-wrap {
	height: 100%
}

.yngn-modal-dplayer .dplayer-video {
	object-fit: contain
}

.yngn-modal-cover img,
.yngn-modal-cover video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain
}

.yngn-modal-text-cover {
	height: 100%;
	padding-top: 0;
	border-radius: 0
}

.yngn-modal-text-cover::after {
	display: none
}

.yngn-modal-text-cover .yngn-card-cover-content,
.yngn-modal-text-cover .yngn-card-mark,
.yngn-modal-text-cover .yngn-card-pattern {
	transition: none
}

.yngn-modal-text-cover:hover .yngn-card-cover-content,
.yngn-modal-text-cover:hover .yngn-card-mark,
.yngn-modal-text-cover:hover .yngn-card-pattern {
	transform: none
}

.yngn-modal-main-pane {
	display: grid;
	min-width: 0;
	min-height: 0;
	grid-template-rows: auto minmax(0, 1fr) auto;
	background: var(--main-bg-color, #fff)
}

.yngn-modal-main-content {
	min-width: 0;
	min-height: 0;
	padding: 0 28px
}

.yngn-modal-side-header {
	position: relative;
	min-width: 0;
	padding: 0 0 12px
}

.yngn-modal-title {
	margin: 0 0 6px;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.4
}

.yngn-modal-author-row {
	position: relative;
	z-index: 2;
	display: flex;
	min-width: 0;
	padding: 18px 28px;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	background: var(--main-bg-color, #fff)
}

.yngn-modal-author-row::after {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 1px;
	background: var(--yngn-border, rgba(125, 125, 125, .14));
	content: "";
	opacity: 0;
	pointer-events: none
}

.yngn-modal-author-row.yngn-is-scrolled::after {
	opacity: 1
}

.yngn-modal-author {
	display: flex;
	min-width: 0;
	align-items: flex-start;
	color: inherit;
	font-size: 15px
}

.yngn-modal-author-avatar {
	width: 45px;
	height: 45px;
	margin-right: 20px;
	--this-size: 45px
}

.yngn-modal-author-avatar .avatar {
	width: 100%;
	height: 100%;
	object-fit: cover
}

.yngn-modal-author-info {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 7px
}

.yngn-modal-author-name-row {
	display: flex;
	min-width: 0;
	align-items: center;
	flex-wrap: wrap
}

.yngn-modal-author-name {
	min-width: 0;
	flex: 0 1 auto
}

.yngn-modal-author-date {
	color: var(--muted-2-color, #666);
	font-size: 14px;
	line-height: 1.4
}

.yngn-modal-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	color: var(--muted-color, #888);
	font-size: 12px
}

.yngn-modal-meta span {
	display: inline-flex;
	align-items: center;
	gap: 5px
}

.yngn-modal-plate {
	min-width: 0;
	max-width: 100%
}

.yngn-modal-plate-link {
	max-width: 180px;
	color: inherit
}

.yngn-modal-plate-link:hover {
	color: var(--focus-color)
}

.yngn-modal-actions .icon,
.yngn-modal-meta .icon {
	width: 1em;
	height: 1em;
	fill: currentColor
}

.yngn-modal-actions {
	position: relative;
	z-index: 3;
	display: block;
	min-height: 0;
	box-sizing: border-box;
	margin: 0;
	padding: 0 18px;
	overflow: visible;
	border-top: 1px solid var(--yngn-border, rgba(125, 125, 125, .1));
	background: var(--main-bg-color, #fff);
	transition: padding-left .3s ease, padding-right .3s ease
}

.yngn-modal-actions-default {
	display: flex;
	min-height: 56px;
	max-height: 56px;
	align-items: center;
	justify-content: flex-end;
	gap: 4px;
	opacity: 1;
	transform: translateY(0);
	transition: min-height .3s ease, max-height .3s ease, opacity .2s ease .08s, transform .3s ease
}

.yngn-modal-actions .yngn-modal-action,
.yngn-modal-actions-default>a {
	display: inline-flex;
	min-width: 0;
	align-items: center;
	gap: 5px;
	padding: 7px 8px;
	border-radius: 18px;
	color: var(--main-color, #333);
	font-size: 12px;
	white-space: nowrap
}

.yngn-modal-actions .yngn-modal-comment-jump {
	min-width: 0;
	flex: 1 1 auto;
	gap: 6px;
	margin-right: 8px;
	padding: 8px 16px 8px 8px;
	border-radius: 20px;
	background: var(--body-bg-color, #f6f7f8);
	color: var(--muted-color, #777);
	cursor: text
}

.yngn-modal-actions .yngn-modal-comment-jump text {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis
}

.yngn-modal-actions .yngn-modal-comment-avatar {
	--this-size: 24px;
	width: 24px;
	height: 24px;
	flex: 0 0 24px;
	overflow: hidden;
	border-radius: 50%
}

.yngn-modal-actions .yngn-modal-comment-avatar img {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	object-fit: cover
}

.yngn-modal-actions-default>.right {
	flex: 0 0 auto
}

.yngn-modal-actions .yngn-modal-action:hover,
.yngn-modal-actions-default>a.active,
.yngn-modal-actions-default>a:hover {
	background: var(--body-bg-color, #f1f2f3);
	color: #ff2442
}

.yngn-modal-actions .yngn-modal-comment-jump:hover {
	color: var(--muted-color, #777)
}

.yngn-modal-comment-editor {
	display: grid;
	min-height: 0;
	grid-template-rows: 0fr;
	opacity: 0;
	transform: translateY(10px);
	visibility: hidden;
	transition: grid-template-rows .32s ease, opacity .2s ease, transform .3s ease, visibility 0s linear .32s
}

.yngn-modal-comment-editor-inner {
	min-height: 0;
	overflow: hidden
}

.yngn-modal-comment-editor #respond {
	position: relative !important;
	inset: auto !important;
	margin: 0;
	padding: 8px 0;
	background: 0 0;
	box-shadow: none
}

.yngn-modal-actions.yngn-comment-editor-open .yngn-modal-actions-default {
	min-height: 0;
	max-height: 0;
	opacity: 0;
	pointer-events: none;
	transform: translateY(-8px);
	transition-delay: 0s
}

.yngn-modal-actions.yngn-comment-editor-open {
	padding-right: 0;
	padding-left: 0;
	overflow: hidden
}

.yngn-modal-actions.yngn-comment-editor-open .yngn-modal-comment-editor {
	grid-template-rows: 1fr;
	opacity: 1;
	transform: translateY(0);
	visibility: visible;
	transition-delay: 0s
}

.yngn-modal-actions.yngn-comment-editor-overflow-ready,
.yngn-modal-actions.yngn-comment-editor-overflow-ready .yngn-modal-comment-editor-inner {
	overflow: visible
}

.yngn-modal-main-scroll {
	min-height: 0;
	overflow: auto;
	overflow-x: hidden;
	overscroll-behavior: contain;
	-ms-overflow-style: none;
	scrollbar-width: none
}

.yngn-modal-main-scroll::-webkit-scrollbar {
	display: none
}

.yngn-modal-content {
	max-width: none;
	margin: 0;
	padding: 4px 0 18px;
	font-size: 15px;
	line-height: 1.8
}

.yngn-modal-content .theme-box.wp-posts-content {
	margin: 0;
	padding: 0;
	background: 0 0;
	box-shadow: none
}

.yngn-modal-score.single-footer.score-box {
	margin: 4px 0 8px
}

.yngn-modal-score-actions {
	position: relative;
	z-index: 4;
	display: flex;
	min-height: 32px;
	align-items: center;
	justify-content: flex-end;
	gap: 2px;
	margin: -6px -8px 22px 0;
	color: var(--muted-color, #777)
}

.yngn-modal-score-actions .yngn-modal-more,
.yngn-modal-score-actions .yngn-modal-rewards {
	flex: 0 0 auto
}

.yngn-modal-score-actions .yngn-modal-more>.dropdown-menu {
	z-index: 95
}

.yngn-modal-comments {
	min-height: 0;
	padding: 0 0 12px
}

.yngn-modal-comments #comments {
	display: block
}

.yngn-modal-comments #comments,
.yngn-modal-comments #postcomments,
.yngn-modal-comments .bbs-commentlist {
	height: auto !important;
	min-height: 0 !important
}

.yngn-modal-comments #comments>.comment-box:first-child {
	display: none
}

.yngn-modal-comments #postcomments {
	order: 1;
	margin: 0;
	padding: 8px 0;
	background: 0 0;
	box-shadow: none
}

.yngn-modal-comments #postcomments .bbs-commentlist>.comment>.list-inline,
.yngn-modal-comments #postcomments .bbs-commentlist>.comment>.list-inline>.comt-main {
	padding-right: 0;
	padding-left: 0
}

.yngn-modal-comments .dropdown:not(.open)>.dropdown-menu,
.yngn-modal-comments .dropup:not(.open)>.dropdown-menu {
	display: none
}

.yngn-modal-comment-editor #respond.mobile-fixed,
.yngn-modal-comments #respond.mobile-fixed {
	position: relative !important;
	inset: auto !important;
	margin: 0;
	transform: none !important
}

.yngn-modal-comment-editor #respond .fixed-body,
.yngn-modal-comments #respond .fixed-body {
	display: none
}

.yngn-modal-comment-editor #commentform,
.yngn-modal-comments #commentform {
	padding: 6px 10px;
	border: 0;
	border-radius: 10px;
	background: 0 0
}

.yngn-modal-comment-editor .action-text:empty,
.yngn-modal-comments .action-text:empty {
	display: none
}

.yngn-modal-comment-editor #comment,
.yngn-modal-comments #comment {
	min-height: 46px;
	max-height: 84px !important;
	background: var(--body-bg-color, #f6f7f8)
}

.yngn-modal-comment-editor .comt-title,
.yngn-modal-comments .comt-title {
	display: none
}

.yngn-modal-comments .comment-filter {
	margin-bottom: 14px
}

.yngn-modal-comment-editor .comt-tips-left>.dropup>.btn-input-expand {
	display: inline-flex;
	width: 32px;
	height: 32px;
	margin-right: 4px;
	padding: 0;
	align-items: center;
	justify-content: center;
	font-size: 0;
	line-height: 1
}

.yngn-modal-comment-editor .comt-tips-left>.dropup>.btn-input-expand .fa {
	width: auto;
	margin: 0;
	font-size: 15px
}

.yngn-modal-comment-editor .comt-tips-left>.dropup>.btn-input-expand .icon {
	width: 15px;
	height: 15px;
	margin: 0;
	font-size: 15px
}

.yngn-modal-comments .commentlist>.comment-null {
	min-height: 180px;
	padding: 32px 0
}

.yngn-modal-comments .comment-null img,
.yngn-modal-comments .comment-null svg {
	max-height: 120px
}

[hidden] {
	display: none !important
}

@media (prefers-reduced-motion:reduce) {

	.yngn-modal-actions,
	.yngn-modal-actions-default,
	.yngn-modal-backdrop,
	.yngn-modal-comment-editor,
	.yngn-modal-dialog {
		transform: none
	}

	.yngn-modal-actions-default,
	.yngn-modal-actions.yngn-comment-editor-open .yngn-modal-actions-default,
	.yngn-modal-comment-editor {
		transform: none
	}

	.yngn-modal-loading-spinner,
	.yngn-skeleton-block {
		animation: none
	}

	.yngn-loaded-card,
}

@media (max-width:991px) {
	.yngn-posts-section {
		--yngn-loading-footer-gap: 24px
	}

	.yngn-initial-skeleton-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		padding-bottom: 24px
	}

	.yngn-first-layout-skeleton .yngn-initial-skeleton-grid {
		padding-bottom: 0
	}

	.yngn-initial-skeleton-column:nth-child(n+3) {
		display: none
	}

	.yngn-masonry {
		grid-template-columns: repeat(2, minmax(0, 1fr))
	}

	.yngn-modal {
		padding: 26px
	}

	.yngn-modal-article {
		grid-template-columns: var(--yngn-modal-media-width, minmax(0, 1fr)) var(--yngn-modal-side-width, minmax(0, 1fr))
	}
}

@media (max-width:575px) {
	.yngn-card-body {
		padding: 10px;
		gap: 9px
	}

	.yngn-card-title {
		font-size: 13px
	}

	.yngn-card-cover-content {
		padding: 10px 12px
	}

	.yngn-card-cover-copy-short {
		font-size: 18px
	}

	.yngn-card-cover-copy-medium {
		font-size: 16px
	}

	.yngn-card-cover-copy-long {
		font-size: 13px;
		-webkit-line-clamp: 7
	}

	.yngn-modal {
		align-items: flex-end;
		padding: 0
	}

	.yngn-modal-dialog {
		width: 100vw;
		height: 94vh;
		max-height: 94vh;
		border-radius: 4px 4px 0 0
	}

	.yngn-modal-body {
		overflow: auto;
		border-radius: 4px 4px 0 0
	}

	.yngn-modal-loading-preview {
		display: block;
		height: auto;
		min-height: 100%
	}

	.yngn-modal-loading-cover {
		height: min(62vh, 520px)
	}

	.yngn-modal-loading-copy {
		min-height: 32vh
	}

	.yngn-modal-article {
		display: block;
		height: auto
	}

	.yngn-modal-cover-pane {
		height: min(62vh, 520px);
		border-right: 0;
		border-bottom: 1px solid var(--yngn-border, rgba(125, 125, 125, .14))
	}

	.yngn-modal-main-pane {
		display: block
	}

	.yngn-modal-main-content {
		padding: 0 18px
	}

	.yngn-modal-author-row {
		position: sticky;
		top: 0;
		padding: 16px 18px
	}

	.yngn-modal-side-header {
		padding: 0 0 12px
	}

	.yngn-modal-title {
		margin-top: 0;
		font-size: 21px
	}

	.yngn-modal-meta {
		gap: 13px
	}

	.yngn-modal-actions {
		position: sticky;
		z-index: 3;
		bottom: 0;
		max-width: none;
		padding: 0 12px env(safe-area-inset-bottom, 0);
		overflow: hidden
	}

	.yngn-modal-actions:not(.yngn-comment-editor-open),
	.yngn-modal-actions:not(.yngn-comment-editor-open) .yngn-modal-actions-default {
		overflow: visible
	}

	.yngn-modal-actions-default {
		gap: 1px;
		scrollbar-width: none
	}

	.yngn-modal-actions .yngn-modal-comment-jump {
		margin-right: 2px;
		padding-right: 10px
	}

	.yngn-modal-actions-default>.right>.item text {
		display: none
	}

	.yngn-modal-actions-default>.right {
		min-width: 0;
		gap: 0
	}

	.yngn-modal-actions-default>.right>.item {
		margin: 0;
		padding-right: 5px;
		padding-left: 5px
	}

	.yngn-modal-actions-default::-webkit-scrollbar {
		display: none
	}

	.yngn-modal-main-scroll {
		overflow: visible
	}

	.yngn-modal-content {
		padding: 4px 0 18px
	}

	.yngn-modal-score-actions {
		margin-right: -4px;
		margin-bottom: 18px
	}

	.yngn-modal-comments {
		min-height: 360px;
		padding: 0
	}

	.yngn-modal-comment-editor .ccomt-ctrl,
	.yngn-modal-comments .ccomt-ctrl {
		flex-wrap: wrap;
		gap: 8px
	}
}