body { margin: 0; }

.wp-site-blocks,
.wp-site-blocks *,
.wp-site-blocks *::before,
.wp-site-blocks *::after { box-sizing: border-box; }

.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100dvh;
}
.wp-site-blocks > * { flex-shrink: 0; }
.wp-site-blocks > main { flex-grow: 1; }
.wp-site-blocks > footer { margin-bottom: 0; }

/* WordPress reserves viewport space for the logged-in admin bar. */
body.admin-bar .wp-site-blocks {
	min-height: calc(100vh - var(--wp-admin--admin-bar--height, 32px));
	min-height: calc(100dvh - var(--wp-admin--admin-bar--height, 32px));
}
@media (max-width: 782px) {
	body.admin-bar .wp-site-blocks {
		min-height: calc(100vh - var(--wp-admin--admin-bar--height, 46px));
		min-height: calc(100dvh - var(--wp-admin--admin-bar--height, 46px));
	}
}

.wp-site-blocks :where(p, h1, h2, h3, h4, li, figcaption, a) { overflow-wrap: anywhere; }
.wp-site-blocks :where(img, video, iframe) { max-width: 100%; }
.wp-site-blocks img { height: auto; border-radius: 2px; }
.wp-site-blocks pre { max-width: 100%; overflow: auto; }
.wp-site-blocks :where(input, textarea, select, button) { font: inherit; }

/* Pasted block layouts also need a usable baseline when Core styles are deferred. */
:where(.wp-block-post-content, .diebspiel-section) .wp-block-columns {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: 2rem;
}
:where(.wp-block-post-content, .diebspiel-section) .wp-block-column {
	flex: 1 1 0;
	min-width: 0;
}
:where(.wp-block-post-content, .diebspiel-section) .wp-block-column[style*="flex-basis"] {
	flex-grow: 0;
	flex-shrink: 1;
}
:where(.wp-block-post-content) .wp-block-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
}
:where(.wp-block-post-content, .diebspiel-section) .wp-block-image {
	margin: 0;
}
:where(.wp-block-post-content, .diebspiel-section) .wp-block-image img:not([src]),
:where(.wp-block-post-content, .diebspiel-section) .wp-block-image img[src=""] {
	display: none;
}
.diebspiel-section:not(.alignfull):not(.alignwide) {
	max-width: var(--wp--style--global--content-size, 1170px);
	margin-inline: auto;
}

.wp-site-blocks :where(
	.wp-block-search__input,
	.wp-block-post-comments-form input:not([type="submit"]),
	.wp-block-post-comments-form textarea,
	.wp-block-post-comments-form select
) { font-family: var(--wp--preset--font-family--lato); }

.wp-block-post-comments-form input[type="submit"] {
	font-family: var(--wp--preset--font-family--lato);
	font-weight: 700;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 4px;
}

.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	white-space: nowrap;
}

.screen-reader-text:focus {
	clip-path: none;
	background: var(--wp--preset--color--background);
	color: var(--wp--preset--color--foreground);
	height: auto;
	left: 1rem;
	margin: 0;
	padding: 1rem;
	top: 1rem;
	width: auto;
	z-index: 100000;
}

.diebspiel-header {
	border-bottom: 1px solid var(--wp--preset--color--line);
	padding-block: 1.25rem;
}

.diebspiel-header-row { gap: 1rem; }
.diebspiel-brand { flex: 1 1 auto; min-width: 0; gap: .75rem; }
.diebspiel-brand .wp-block-site-title { margin: 0; }
.diebspiel-brand .wp-block-site-logo img { max-width: 48px; max-height: 48px; object-fit: contain; }
.diebspiel-tools { flex: 0 1 auto; gap: .75rem 1.5rem; }
.diebspiel-tools > * { min-width: 0; }

.wp-block-navigation .wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-submenu__toggle,
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	min-height: 44px;
	min-width: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.wp-block-navigation .wp-block-navigation-item__content { padding-inline: .35rem; }
.wp-block-navigation .wp-block-navigation-item__content {
	transition: color .3s ease;
	text-underline-offset: 2px;
}
.wp-block-navigation .wp-block-navigation-item__content:is(:hover, :focus-visible) {
	color: var(--wp--preset--color--accent);
	text-decoration: underline;
}
.wp-block-post-title a:is(:hover, :focus-visible),
.diebspiel-card a:is(:hover, :focus-visible) {
	color: var(--wp--preset--color--accent);
	text-decoration: underline;
}
.diebspiel-point::after {
	content: ".";
	color: var(--wp--preset--color--accent);
}
.diebspiel-title-point { color: var(--wp--preset--color--accent); }
.wp-block-navigation .wp-block-navigation__submenu-container {
	background: var(--wp--preset--color--background);
	color: var(--wp--preset--color--foreground);
	border-color: var(--wp--preset--color--line);
}

.wp-site-blocks .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
	background: var(--wp--preset--color--background);
}
.wp-site-blocks .wp-block-navigation:not(.has-text-color) .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
	color: var(--wp--preset--color--foreground);
}
.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
	padding: 1.5rem;
}

.diebspiel-mode {
	border: 0;
	border-radius: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: .5rem;
	min-width: 44px;
	min-height: 44px;
	max-width: 100%;
	background: transparent;
	color: var(--wp--preset--color--foreground);
	cursor: pointer;
}

.diebspiel-mode[hidden] { display: none; }
.diebspiel-mode:hover { background: var(--wp--preset--color--surface); }
.diebspiel-mode .diebspiel-mode-icon { display: none; flex-shrink: 0; }
.diebspiel-mode[data-diebspiel-mode="light"] [data-mode-icon="light"],
.diebspiel-mode[data-diebspiel-mode="dark"] [data-mode-icon="dark"] { display: block; }
.diebspiel-mode-fallback { font-size: .75rem; color: var(--wp--preset--color--muted); }
.wp-block-navigation__responsive-container-content > .diebspiel-menu-mode {
	margin-block-start: 1.5rem;
}

.diebspiel-main { padding-block: 2.5rem; }
.wp-site-blocks > .diebspiel-main { margin-block-start: 0; }
.diebspiel-main > h1.wp-block-post-title { margin-block-start: 0; }
@media (max-width: 991px) {
	.diebspiel-main { padding-block: 1.875rem; }
}
.diebspiel-footer {
	border-top: 1px solid var(--wp--preset--color--line);
	background: var(--wp--preset--color--surface);
	padding-block: .9375rem;
}
.diebspiel-footer .wp-block-site-title { font-size: .875rem; }
.diebspiel-section { border-top: 1px solid var(--wp--preset--color--line); padding-block: clamp(1.875rem, 4vw, 2.5rem); }
/* Border-image outsets paint beyond the content without enlarging scrollable layout. */
.wp-site-blocks .diebspiel-section {
	border-top: 1px solid var(--wp--preset--color--line);
	border-image-source: linear-gradient(var(--wp--preset--color--line), var(--wp--preset--color--line));
	border-image-slice: 1;
	border-image-width: 1px 0 0;
	border-image-outset: 0 100vmax 0;
	border-image-repeat: stretch;
}
.diebspiel-cards { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
.diebspiel-card { min-width: 0; }
.diebspiel-posts > li + li { border-top: 1px solid var(--wp--preset--color--line); padding-top: 2rem; margin-top: 2rem; }

.wp-block-button__link,
.wp-block-query-pagination a,
.wp-block-post-navigation-link a,
.wp-block-comments-pagination a,
.wp-block-search__button,
.wp-block-post-excerpt__more-link {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

.wp-block-button__link,
.wp-block-search__button,
.wp-block-post-comments-form input[type="submit"] {
	min-width: 170px;
	max-width: 100%;
	justify-content: center;
	text-align: center;
	transition: box-shadow .3s ease;
}

.wp-block-button__link:is(:hover, :focus-visible),
.wp-block-search__button:is(:hover, :focus-visible),
.wp-block-post-comments-form input[type="submit"]:is(:hover, :focus-visible) {
	box-shadow: 10px 10px 20px color-mix(in srgb, var(--wp--preset--color--accent) 20%, transparent);
}

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--foreground);
	border: 0;
}

.wp-block-button.is-style-outline > .wp-block-button__link:is(:hover, :focus-visible) {
	box-shadow: 10px 10px 20px color-mix(in srgb, var(--wp--preset--color--foreground) 20%, transparent);
}

.wp-block-query-pagination,
.wp-block-comments-pagination { gap: 1rem; }
.wp-block-query-pagination-numbers a,
.wp-block-query-pagination-numbers .current { padding: .5rem .75rem; }
.wp-block-post-navigation-link { min-width: 0; }
.wp-block-search__inside-wrapper { flex-wrap: wrap; gap: .5rem; }
.wp-block-search__input { min-height: 50px; min-width: 0; background: var(--wp--preset--color--background); color: var(--wp--preset--color--foreground); border: 1px solid var(--wp--preset--color--muted); border-radius: 2px; padding: .9375rem 1.25rem; }
.wp-block-search__button { margin: 0; }
.wp-site-blocks .wp-block-search__button {
	font-family: var(--wp--preset--font-family--lato);
	font-weight: 700;
}
.wp-block-comment-template { padding-inline-start: 0; }
.wp-block-comment-template ol { padding-inline-start: clamp(.75rem, 3vw, 1.5rem); }
.wp-block-comment-template li { min-width: 0; }
.wp-block-post-comments-form :where(input:not([type="checkbox"]), textarea) {
	max-width: 100%;
	min-height: 50px;
	border: 1px solid var(--wp--preset--color--muted);
	border-radius: 2px;
	padding: .9375rem 1.25rem;
	background: var(--wp--preset--color--background);
	color: var(--wp--preset--color--foreground);
}
.wp-block-post-comments-form input[type="submit"] {
	cursor: pointer;
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--on-accent);
	border-color: transparent;
	padding-inline: 1.25rem;
	font-size: var(--wp--preset--font-size--label);
	line-height: 1.66;
	text-transform: uppercase;
}
.wp-block-search__input:is(:hover, :focus-visible),
.wp-block-post-comments-form :is(input:not([type="submit"]):not([type="checkbox"]), textarea):is(:hover, :focus-visible) {
	border-color: var(--wp--preset--color--accent);
}
.wp-block-post-comments-form .comment-form-cookies-consent { display: flex; align-items: start; gap: .75rem; }
.wp-block-post-comments-form .comment-form-cookies-consent label { min-height: 44px; }

@media (min-width: 600px) {
	.diebspiel-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 960px) {
	.diebspiel-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 781px) {
	:where(.wp-block-post-content, .diebspiel-section) .wp-block-columns {
		flex-wrap: wrap;
	}
	:where(.wp-block-post-content, .diebspiel-section) .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
		flex-basis: 100% !important;
	}
	.diebspiel-header { padding-block: .625rem .9375rem; }
	.diebspiel-brand .wp-block-site-title { font-size: 1.125rem; }
	.diebspiel-section > .wp-block-columns { gap: 1.5rem; }
}

@media (max-width: 959px) {
	.diebspiel-header-row { flex-wrap: nowrap !important; }
	.diebspiel-tools { flex: 0 0 auto; width: auto; justify-content: flex-end; }
	html[data-diebspiel-mode] .diebspiel-header .diebspiel-tools:has(.wp-block-navigation__responsive-container-content) > .wp-block-diebspiel-color-mode {
		display: none;
	}
}

@media (max-width: 959px) {
	html[data-diebspiel-mode].has-modal-open:has(.diebspiel-header .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)) {
		background: #3333ff;
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .wp-block-navigation__responsive-container:not(.disable-default-overlay) {
		background: #3333ff !important;
		color: #ffffff !important;
		position: fixed;
		inset: 0;
		width: 100%;
		z-index: 100000;
		padding: 1rem 1.25rem;
		overflow: auto;
		animation: none;
		transform: translateY(-100%);
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
		display: flex;
		transform: translateY(0);
	}
	html[data-diebspiel-mode] .diebspiel-header .wp-block-navigation__responsive-container.diebspiel-menu-swipe {
		touch-action: pan-x pinch-zoom;
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .wp-block-navigation__responsive-close {
		min-height: 100%;
		display: flex;
		flex-direction: column;
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .wp-block-navigation__responsive-dialog {
		display: flex;
		flex-direction: column;
		flex-grow: 1;
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .wp-block-navigation__responsive-container-content {
		flex: 1 0 auto;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding-block: 3rem;
		gap: 1rem;
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .wp-block-navigation__container,
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .wp-block-navigation-item {
		align-items: center;
		justify-content: center;
		text-align: center;
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .wp-block-navigation__container {
		flex-direction: column;
		gap: .625rem;
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .wp-block-navigation-item__content {
		min-height: 44px;
		padding: .6875rem;
		color: inherit;
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .wp-block-navigation__responsive-container-close {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		top: -.5rem;
		right: -.5rem;
		color: inherit;
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .diebspiel-menu-mode {
		margin: 0;
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .diebspiel-menu-mode .diebspiel-mode {
		color: inherit;
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .diebspiel-menu-mode .diebspiel-mode:hover {
		background: rgb(255 255 255 / 15%);
	}
	html[data-diebspiel-mode] .wp-site-blocks .diebspiel-header .wp-block-navigation__responsive-container :focus-visible {
		outline-color: #ffffff;
	}
}

/* Keep the mobile menu breakpoint in sync with color-mode.js. */
@media (min-width: 600px) and (max-width: 959px) {
	.wp-block-navigation__responsive-container:not(.is-menu-open):not(.hidden-by-default) { display: none !important; }
	.wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
}

@media (prefers-reduced-motion: reduce) {
	.wp-site-blocks *,
	.wp-site-blocks *::before,
	.wp-site-blocks *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
