.dk-discussion {
	padding: 16px 18px 18px;
	scroll-margin-top: calc(var(--dk-header-h, 64px) + 12px);
}

.dk-discussion__header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	margin-bottom: 14px;
}

.dk-discussion__title {
	flex: 1 1 auto;
	margin: 0;
	font-size: 1.375rem;
	line-height: 1.2;
}

.dk-discussion__count {
	font-size: 0.8125rem;
	color: var(--dk-muted);
	white-space: nowrap;
}

.dk-discussion__sort.dk-segmented {
	gap: 6px;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
}

.dk-discussion__sort .dk-segmented__item {
	border: 1px solid var(--dk-border);
	background: var(--dk-surface);
}

.dk-discussion__sort .dk-segmented__item[aria-current] {
	border-color: var(--dk-brown);
	background: var(--dk-brown);
}

.dk-discussion__closed,
.dk-discussion__empty {
	margin-top: 4px;
}

.dk-discussion__empty svg {
	color: var(--dk-brown);
}

.dk-discussion__more {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 14px;
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
}

.dk-discussion__more:hover {
	text-decoration: underline;
}

.dk-discussion__pages {
	margin-top: 18px;
}

.dk-discussion__login {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 16px;
	padding: 14px 16px;
	border: 1px solid var(--dk-border);
	border-radius: var(--dk-radius);
	background: var(--dk-surface-warm);
}

.dk-discussion__login-icon {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--dk-brown-tint);
	color: var(--dk-brown);
}

.dk-discussion__login-text {
	flex: 1 1 260px;
	min-width: 0;
}

.dk-discussion__login-text p {
	margin: 0;
	font-size: 0.875rem;
	color: var(--dk-muted);
}

.dk-discussion__login .dk-discussion__login-title {
	margin-bottom: 2px;
	font-family: var(--dk-font-serif);
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--dk-text);
}

.dk-discussion__login-actions {
	display: flex;
	gap: 8px;
}

.dk-composer {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 12px;
	align-items: start;
}

.dk-composer__main {
	display: grid;
	gap: 10px;
	min-width: 0;
}

.dk-composer__text.dk-textarea {
	min-height: 44px;
	padding-block: 11px;
	transition: min-height 0.15s;
}

.dk-composer__text:focus,
.dk-composer__text:not(:placeholder-shown) {
	min-height: 96px;
}

.dk-composer__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.dk-composer__bar .dk-btn--secondary {
	border-color: var(--dk-border);
	color: var(--dk-text);
	font-weight: 500;
}

.dk-composer__bar .dk-btn--secondary:hover,
.dk-composer__bar [aria-expanded="true"] {
	border-color: var(--dk-brown);
	background: var(--dk-surface);
	color: var(--dk-brown);
}

.dk-composer__bar .dk-btn--secondary svg {
	color: var(--dk-brown);
}

.dk-composer__photo {
	cursor: pointer;
}

.dk-composer__photo:has(input:focus-visible) {
	outline: 2px solid var(--dk-brown);
	outline-offset: 2px;
}

.dk-composer__submit {
	margin-left: auto;
	min-width: 170px;
}

.dk-composer__reply {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: 0.875rem;
	color: var(--dk-muted);
}

.dk-composer__reply[hidden],
.dk-composer__panel[hidden],
.dk-composer__preview[hidden],
.dk-composer__error[hidden] {
	display: none;
}

.dk-composer__reply svg {
	color: var(--dk-brown);
}

.dk-composer__cancel {
	margin-left: auto;
	font-size: 0.8125rem;
	font-weight: 600;
}

.dk-composer__panel {
	display: grid;
	gap: 6px;
	padding: 12px;
	border: 1px solid var(--dk-border);
	border-radius: var(--dk-radius);
	background: var(--dk-surface-warm);
}

.dk-composer__plz {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.dk-composer__plz .dk-input {
	width: 120px;
}

.dk-composer__plz .dk-select {
	flex: 1 1 220px;
	width: auto;
}

.dk-composer__plz [hidden] {
	display: none;
}

.dk-composer__hint {
	margin: 0;
	font-size: 0.8125rem;
	color: var(--dk-muted);
}

.dk-composer__hint:empty {
	display: none;
}

.dk-composer__preview {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 6px;
	border: 1px solid var(--dk-border);
	border-radius: var(--dk-radius);
	font-size: 0.8125rem;
}

.dk-composer__preview img {
	width: 56px;
	height: 56px;
	border-radius: var(--dk-radius-sm);
	object-fit: cover;
}

.dk-composer__file {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.dk-composer__error {
	margin: 0;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--dk-red);
}

.dk-composer.is-reply {
	margin: 12px 0 0 52px;
	padding: 12px;
	border: 1px solid var(--dk-border);
	border-radius: var(--dk-radius);
	background: var(--dk-surface-warm);
}

.dk-comments,
.dk-comment__replies {
	margin: 0;
	padding: 0;
	list-style: none;
}

.dk-comments {
	margin-top: 16px;
}

.dk-comment {
	scroll-margin-top: calc(var(--dk-header-h, 64px) + 12px);
}

.dk-comments > .dk-comment {
	padding: 14px 0;
	border-top: 1px solid var(--dk-border);
}

.dk-comments > .dk-comment:last-child {
	padding-bottom: 0;
}

.dk-comment:target > .dk-comment__body {
	border-radius: var(--dk-radius);
	background: var(--dk-brown-tint);
	box-shadow: 0 0 0 6px var(--dk-brown-tint);
}

.dk-comment__body {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 12px;
}

.dk-comment__main {
	min-width: 0;
}

.dk-comment__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px 14px;
	min-height: 28px;
	font-size: 0.8125rem;
	color: var(--dk-muted);
}

.dk-comment__name {
	font-size: 0.9375rem;
	color: var(--dk-text);
}

.dk-comment__place {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.dk-comment__word a {
	font-weight: 600;
}

.dk-comment__menu-btn.dk-icon-btn {
	width: 32px;
	height: 28px;
	margin-left: auto;
	color: var(--dk-muted);
}

.dk-comment-menu {
	inset: auto;
	margin: 0;
	padding: 4px;
	border: 1px solid var(--dk-border);
	border-radius: var(--dk-radius);
	background: var(--dk-surface);
	color: var(--dk-text);
	box-shadow: 0 8px 24px rgb(37 28 24 / 0.12);
}

.dk-comment-menu__item {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	min-height: 36px;
	padding: 6px 12px;
	border: 0;
	border-radius: var(--dk-radius-sm);
	background: none;
	font-size: 0.875rem;
	white-space: nowrap;
}

.dk-comment-menu__item:hover {
	background: var(--dk-brown-tint);
}

.dk-comment__pending {
	display: inline-block;
	margin: 4px 0 0;
	padding: 2px 8px;
	border-radius: var(--dk-radius-sm);
	background: var(--dk-brown-tint);
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--dk-brown);
}

.dk-comment__text {
	margin-top: 2px;
	font-size: 0.9375rem;
	line-height: 1.55;
	overflow-wrap: anywhere;
}

.dk-comment__text p {
	margin: 0 0 0.5em;
}

.dk-comment__text p:last-child {
	margin-bottom: 0;
}

.dk-comment__photo {
	display: inline-block;
	margin-top: 8px;
}

.dk-comment__photo img {
	display: block;
	width: auto;
	max-width: min(240px, 100%);
	height: auto;
	max-height: 180px;
	border: 1px solid var(--dk-border);
	border-radius: var(--dk-radius);
	object-fit: cover;
}

.dk-comment__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 20px;
	margin-top: 8px;
}

.dk-comment__action {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 28px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--dk-muted);
	font-size: 0.8125rem;
	text-decoration: none;
}

.dk-comment__action:hover {
	color: var(--dk-brown);
}

.dk-comment__action[aria-pressed="true"] {
	color: var(--dk-brown);
	font-weight: 600;
}

.dk-comment__action[aria-pressed="true"] svg {
	fill: var(--dk-brown-tint);
}

.dk-comment__action:disabled {
	cursor: default;
	opacity: 0.7;
}

.dk-comment__replies {
	margin: 12px 0 0 52px;
	padding-left: 14px;
	border-left: 2px solid var(--dk-border);
}

.dk-comment--reply + .dk-comment--reply {
	margin-top: 12px;
}

@media (max-width: 599.98px) {
	.dk-discussion {
		padding: 14px;
	}

	.dk-discussion__title {
		flex-basis: 100%;
		font-size: 1.25rem;
	}

	.dk-composer {
		grid-template-columns: minmax(0, 1fr);
	}

	.dk-composer > .dk-avatar {
		display: none;
	}

	.dk-composer__bar .dk-btn--secondary {
		flex: 1 1 0;
		min-width: 0;
	}

	.dk-composer__submit {
		flex-basis: 100%;
		margin-left: 0;
	}

	.dk-composer.is-reply {
		margin-left: 0;
	}

	.dk-comment__replies {
		margin-left: 18px;
	}

	.dk-discussion__login-actions {
		width: 100%;
	}

	.dk-discussion__login-actions .dk-btn {
		flex: 1;
	}
}

.dk-discussions__intro {
	max-width: 760px;
	margin-bottom: 16px;
}

.dk-discussions__intro p {
	margin: 0;
	color: var(--dk-muted);
}

.dk-discussions__intro .dk-page__title {
	margin-bottom: 4px;
}

.dk-topics__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 10px;
	margin: 0;
	padding: 14px 18px 18px;
	list-style: none;
}

.dk-topic__link {
	display: flex;
	gap: 12px;
	height: 100%;
	padding: 10px;
	border: 1px solid var(--dk-border);
	border-radius: var(--dk-radius);
	background: var(--dk-surface-warm);
	color: inherit;
	text-decoration: none;
	transition: border-color 0.15s, background-color 0.15s;
}

.dk-topic__link:hover {
	border-color: var(--dk-brown);
	background: var(--dk-surface);
}

.dk-topic__img {
	display: grid;
	flex-shrink: 0;
	place-items: center;
	width: 64px;
	height: 64px;
	overflow: hidden;
	border-radius: var(--dk-radius-sm);
	background: var(--dk-bg-alt);
	color: var(--dk-brown);
}

.dk-topic__img img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.dk-topic__text {
	display: grid;
	align-content: start;
	gap: 2px;
	min-width: 0;
	font-size: 0.8125rem;
}

.dk-topic__title {
	font-family: var(--dk-font-serif);
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.25;
}

.dk-topic__count {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-weight: 600;
	color: var(--dk-brown);
}

.dk-topic__excerpt {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	margin-top: 2px;
}

.dk-topic__by {
	color: var(--dk-muted);
}

.dk-join .dk-card__title {
	margin-bottom: 6px;
}

.dk-join__user {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 14px;
}

.dk-join__user .dk-card__title {
	margin: 0;
}

.dk-join__muted {
	margin: 0 0 14px;
	font-size: 0.875rem;
	color: var(--dk-muted);
}

.dk-join__user .dk-join__muted {
	margin: 0;
}

.dk-join__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.dk-join__actions .dk-btn {
	flex: 1;
}

.dk-rules {
	display: grid;
	gap: 12px;
	margin: 0;
	list-style: none;
	font-size: 0.875rem;
}

.dk-rules li {
	display: flex;
	gap: 10px;
}

.dk-rules svg {
	margin-top: 1px;
	color: var(--dk-brown);
}

.dk-profile__muted {
	margin: 0;
	font-size: 0.8125rem;
	color: var(--dk-muted);
}

.dk-profile__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 24px;
	padding: 18px;
}

.dk-profile__who {
	display: flex;
	align-items: center;
	gap: 16px;
	min-width: 0;
}

.dk-profile__who .dk-avatar {
	font-size: 1.375rem;
}

.dk-profile__name {
	margin: 2px 0;
	font-size: 1.75rem;
	line-height: 1.15;
}

.dk-profile__since {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
	margin: 0;
	font-size: 0.875rem;
	color: var(--dk-muted);
}

.dk-profile__stats {
	display: grid;
	grid-template-columns: repeat(4, minmax(84px, 1fr));
	margin: 0;
	border: 1px solid var(--dk-border);
	border-radius: var(--dk-radius);
	background: var(--dk-surface-warm);
}

.dk-profile__stats > div {
	padding: 10px 14px;
	text-align: center;
}

.dk-profile__stats > div + div {
	border-left: 1px solid var(--dk-border);
}

.dk-profile__stats dt {
	font-size: 0.75rem;
	color: var(--dk-muted);
}

.dk-profile__stats dd {
	margin: 0;
	font-family: var(--dk-font-serif);
	font-size: 1.375rem;
	font-weight: 700;
	color: var(--dk-brown);
}

.dk-profile__account {
	display: grid;
	gap: 8px;
}

.dk-profile__account .dk-profile__muted {
	margin-bottom: 6px;
}

.dk-profile__tabs {
	padding-bottom: 2px;
}

.dk-badges {
	display: grid;
	gap: 8px;
	margin: 0;
	list-style: none;
}

.dk-badges__item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 8px 10px;
	border: 1px dashed var(--dk-border);
	border-radius: var(--dk-radius);
	color: var(--dk-muted);
}

.dk-badges__item.is-earned {
	border-style: solid;
	background: var(--dk-surface-warm);
	color: var(--dk-text);
}

.dk-badges__icon {
	display: inline-grid;
	flex-shrink: 0;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--dk-bg-alt);
	color: var(--dk-muted);
}

.is-earned .dk-badges__icon {
	background: var(--dk-brown);
	color: var(--dk-surface);
}

.dk-badges__text {
	display: grid;
	flex: 1;
	min-width: 0;
	font-size: 0.75rem;
	line-height: 1.35;
}

.dk-badges__text strong {
	font-size: 0.875rem;
}

.dk-badges__check {
	color: var(--dk-brown);
}

.dk-rows {
	display: grid;
	margin: 0;
	padding: 0;
	list-style: none;
}

.dk-card__body.dk-rows {
	padding-block: 8px;
}

.dk-rows[hidden] {
	display: none;
}

.dk-rows__item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
}

.dk-rows__item + .dk-rows__item {
	border-top: 1px solid var(--dk-border);
}

.dk-rows__img {
	display: grid;
	flex-shrink: 0;
	place-items: center;
	width: 44px;
	height: 44px;
	overflow: hidden;
	border-radius: var(--dk-radius-sm);
	background: var(--dk-bg-alt);
	color: var(--dk-brown);
}

.dk-rows__img img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.dk-rows__num {
	font-family: var(--dk-font-serif);
	font-size: 1.125rem;
	font-weight: 700;
}

.dk-rows__main {
	display: grid;
	flex: 1;
	gap: 2px;
	min-width: 0;
}

.dk-rows__title {
	font-family: var(--dk-font-serif);
	font-size: 1rem;
	font-weight: 700;
	color: var(--dk-text);
	text-decoration: none;
}

.dk-rows__title:hover {
	color: var(--dk-brown);
	text-decoration: underline;
}

.dk-rows__sub,
.dk-rows__excerpt {
	font-size: 0.8125rem;
	color: var(--dk-muted);
}

.dk-rows__excerpt {
	color: var(--dk-text);
}

.dk-rows__variant {
	font-family: var(--dk-font-serif);
	color: var(--dk-brown);
}

.dk-rows__tag {
	display: inline-block;
	margin-left: 4px;
	padding: 1px 6px;
	border-radius: 4px;
	background: var(--dk-brown-tint);
	font-size: 0.6875rem;
	font-weight: 600;
	color: var(--dk-brown);
}

.dk-rows__meta {
	display: grid;
	flex-shrink: 0;
	justify-items: end;
	gap: 2px;
	font-size: 0.8125rem;
	color: var(--dk-muted);
	text-align: right;
}

.dk-rows__meta > span {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.dk-agree {
	display: grid;
	flex: 0 0 240px;
	gap: 6px;
	font-size: 0.8125rem;
}

.dk-agree__label {
	font-weight: 600;
}

.dk-dialect {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 16px;
	margin-bottom: 8px;
	padding: 14px;
	border-radius: var(--dk-radius);
	background: var(--dk-brown-tint);
}

.dk-dialect__icon {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--dk-surface);
	color: var(--dk-brown);
}

.dk-dialect__text {
	flex: 1 1 240px;
}

.dk-dialect__place {
	margin: 0 0 2px;
	font-family: var(--dk-font-serif);
	font-size: 1.125rem;
	font-weight: 700;
}

.dk-saved__list {
	display: grid;
	margin: 0;
	padding: 0;
	list-style: none;
}

.dk-saved__list[hidden],
.dk-quizlog__list[hidden],
.dk-quizlog__summary[hidden],
.dk-profile [data-dk-empty][hidden] {
	display: none;
}

.dk-saved__item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
}

.dk-saved__item + .dk-saved__item {
	border-top: 1px solid var(--dk-border);
}

.dk-saved__img {
	display: grid;
	flex-shrink: 0;
	place-items: center;
	width: 48px;
	height: 48px;
	overflow: hidden;
	border-radius: var(--dk-radius-sm);
	background: var(--dk-bg-alt);
	color: var(--dk-brown);
}

.dk-saved__img img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.dk-saved__img img[hidden] {
	display: none;
}

.dk-saved__text {
	display: grid;
	flex: 1;
	min-width: 0;
}

.dk-saved__title {
	font-family: var(--dk-font-serif);
	font-size: 1.0625rem;
}

.dk-saved__word {
	font-size: 0.8125rem;
	color: var(--dk-muted);
}

.dk-quizlog__summary {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin: 0 0 12px;
	border: 1px solid var(--dk-border);
	border-radius: var(--dk-radius);
	background: var(--dk-surface-warm);
	text-align: center;
}

.dk-quizlog__summary > div {
	padding: 8px 6px;
}

.dk-quizlog__summary > div + div {
	border-left: 1px solid var(--dk-border);
}

.dk-quizlog__summary dt {
	font-size: 0.6875rem;
	color: var(--dk-muted);
}

.dk-quizlog__summary dd {
	margin: 0;
	font-family: var(--dk-font-serif);
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--dk-brown);
}

.dk-quizlog__list {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.dk-quizlog__item {
	display: grid;
	grid-template-columns: minmax(110px, auto) 1fr auto;
	align-items: center;
	gap: 12px;
	font-size: 0.8125rem;
}

.dk-quizlog__item time {
	color: var(--dk-muted);
}

.dk-guest {
	display: grid;
	gap: 20px;
	margin-bottom: 16px;
	padding: 22px;
}

.dk-guest__title {
	margin: 4px 0 8px;
	font-size: 1.75rem;
}

.dk-guest__intro p {
	max-width: 680px;
	margin: 0;
	color: var(--dk-muted);
}

.dk-guest__intro .dk-kicker {
	color: var(--dk-muted);
}

.dk-guest__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 16px;
}

.dk-guest__cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 12px;
}

.dk-guest__col {
	padding: 16px;
	border: 1px solid var(--dk-border);
	border-radius: var(--dk-radius);
	background: var(--dk-surface-warm);
}

.dk-guest__col--plus {
	border-color: var(--dk-brown-tint);
	background: var(--dk-brown-tint);
}

.dk-guest__subtitle {
	margin: 0 0 10px;
	font-size: 1.0625rem;
}

.dk-guest__list {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 0.875rem;
}

.dk-guest__list li {
	display: flex;
	gap: 10px;
}

.dk-guest__list svg {
	margin-top: 1px;
	color: var(--dk-brown);
}

@media (max-width: 959.98px) {
	.dk-profile__head {
		padding: 16px;
	}

	.dk-profile__stats {
		width: 100%;
	}
}

@media (max-width: 599.98px) {
	.dk-profile__name,
	.dk-guest__title {
		font-size: 1.375rem;
	}

	.dk-profile__stats {
		grid-template-columns: repeat(2, 1fr);
	}

	.dk-profile__stats > div:nth-child(3) {
		border-left: 0;
	}

	.dk-profile__stats > div:nth-child(n + 3) {
		border-top: 1px solid var(--dk-border);
	}

	.dk-guest {
		padding: 16px;
	}

	.dk-guest__actions .dk-btn {
		flex: 1;
	}

	.dk-rows__item {
		flex-wrap: wrap;
	}

	.dk-rows__meta {
		display: flex;
		flex-basis: 100%;
		flex-wrap: wrap;
		justify-items: start;
		gap: 4px 14px;
		text-align: left;
	}

	.dk-agree {
		flex-basis: 100%;
	}

	.dk-rows__item:has(.dk-rows__img) .dk-rows__meta,
	.dk-rows__item:has(.dk-rows__img) .dk-agree {
		margin-left: 56px;
	}

	.dk-quizlog__item {
		grid-template-columns: 1fr auto;
	}

	.dk-quizlog__item .dk-progress {
		grid-column: 1 / -1;
		grid-row: 2;
	}
}