.uap-pk-trigger {
	cursor: pointer;
	display: inline-block;
}

.uap-pk-trigger-button.uap-pk-plugin-button-style,
.uap-pk-trigger.uap-pk-plugin-trigger-style .uap-pk-trigger-button {
	cursor: pointer;
	color: var(--uap-pk-trigger-color, inherit);
	text-decoration: var(--uap-pk-trigger-underline, inherit);
}

.uap-pk-trigger-button.uap-pk-plugin-button-style:hover,
.uap-pk-trigger.uap-pk-plugin-trigger-style .uap-pk-trigger-button:hover {
	color: var(--uap-pk-trigger-hover-color, var(--uap-pk-trigger-color, inherit));
}

.uap-pk-overlay {
	/* The theme's block-layout rules (e.g. .is-layout-constrained) apply
	   max-width + auto margins to content-flow children regardless of
	   position:fixed, since those are independent CSS properties. Reset them
	   explicitly so the overlay always covers the full viewport. */
	position: fixed;
	/* top (not inset:0) starts this box right below the site's own header,
	   so plain 24px padding + flex centering - unchanged, uniform on all
	   four sides - gives an EQUAL top/bottom gap by construction, for any
	   popup size. --uap-pk-top-inset is measured live in frontend.js
	   (openOverlay()): real theme headers are frequently sticky/fixed with
	   a theme-specific height (e.g. a Headroom.js header), which no fixed
	   CSS number could account for - falls back to 0 (full viewport) if no
	   header is found. */
	top: var(--uap-pk-top-inset, 0px);
	right: 0;
	bottom: 0;
	left: 0;
	max-width: none;
	margin: 0;
	z-index: 100000;
	/* background-color is always set inline per-presskit (settings.backdrop_*
	   in class-uap-presskit-render.php) - this is just a pre-render fallback. */
	background: rgba(0, 0, 0, 0.6);
	padding: 24px;
	box-sizing: border-box;
	align-items: center;
	justify-content: center;
}

.uap-pk-overlay[hidden] {
	display: none;
}

.uap-pk-overlay:not([hidden]) {
	display: flex;
}

.uap-pk-popup-stack {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	width: min(
		calc(90vw + (var(--uap-pk-outer-border-width, 0px) * 2)),
		calc(90vh + (var(--uap-pk-outer-border-width, 0px) * 2)),
		calc(900px + (var(--uap-pk-outer-border-width, 0px) * 2)),
		100%
	);
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
}

.uap-pk-popup-stack > .uap-pk-popup {
	width: calc(100% - (var(--uap-pk-outer-border-width, 0px) * 2));
	max-width: none !important;
	margin-left: var(--uap-pk-outer-border-width, 0px);
	margin-right: var(--uap-pk-outer-border-width, 0px);
}

.uap-pk-popup {
	position: relative;
	width: min(90vw, 90vh, 900px);
	/* The width remains unchanged. frontend.js measures the first rendered
	   DIN-A4 landscape page and sets only the popup height so that exactly
	   page 1 fills the visible scroll area. */
	height: auto;
	background: #fff;
	border: 0 !important;
	outline: 0 !important;
	border-radius: 12px;
}

.uap-pk-popup:not(.uap-pk-popup-shadow-enabled) {
	box-shadow: none !important;
}

.uap-pk-popup.uap-pk-popup-shadow-enabled {
	box-shadow: 0 var(--uap-pk-shadow-y, 20px) var(--uap-pk-shadow-blur, 60px) rgba(0, 0, 0, 0.35) !important;
}

/* Clips the scrollable content/background-overlay to the popup's own
   rounded corners. Kept as a separate absolutely-positioned wrapper
   (instead of overflow:hidden directly on .uap-pk-popup) so .uap-pk-close
   is NOT a descendant of it: a close button positioned a fixed 10px from
   the popup's corner falls partly outside a *large* corner-radius arc
   (verified: at corner_radius 60px, the button's inner corner sits ~71px
   from the arc's center, outside its 60px radius) and would otherwise get
   silently clipped away by that same overflow:hidden, making the button
   look cut off instead of sitting cleanly in the corner. */
.uap-pk-popup-clip {
	position: absolute;
	inset: 0;
	border-radius: inherit;
	overflow: hidden;
}

.uap-pk-popup-bg-overlay {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

/* The plugin's own default close button draws its "x" as two crossed bars
   instead of the "×" text glyph: a font's × character is rarely
   centered inside its own em-box (differs per font/browser), which let the
   glyph's bottom-right tip sit flush against - or past - the button's own
   edge, visually touching the adjacent image/page frame in the 24px chrome
   gap. A CSS-drawn X has an exact, font-independent center and a fixed,
   equal margin from every edge of the 17x17px button on all four sides. */
.uap-pk-close-default-glyph::before,
.uap-pk-close-default-glyph::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 9px;
	height: 1.4px;
	background: currentColor;
	transform-origin: center;
}
.uap-pk-close-default-glyph::before {
	transform: translate(-50%, -50%) rotate(45deg);
}
.uap-pk-close-default-glyph::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

/*
 * The popup chrome is authored as 24px at the 900px reference width.
 * frontend.js scales --uap-pk-popup-chrome by the popup's real rendered
 * width so the outer frame-to-page distance remains proportional instead
 * of staying 24px on narrow layouts. Padding on the *parent*
 * (.uap-pk-popup-clip) was tried first and
 * does NOT work here - verified live: for an absolutely positioned child
 * using inset:0, the containing block is the padding EDGE of the
 * positioned ancestor, which sits at the outer boundary of that padding
 * (right after the border), not after it - so inset:0 renders straight
 * into the parent's padding area, ignoring it entirely. Setting this
 * element's own top/bottom explicitly is the only way that actually
 * shrinks its box. Without this fix, the only top/bottom spacing came from
 * the first/last page's own .uap-pk-page-content padding - real content,
 * which IS what .uap-pk-scroll scrolls, so it disappeared the moment you
 * scrolled at all (verified live: scrolling by one authored chrome inset
 * already put a
 * cover image flush against the popup's true top edge, and scrolling to
 * the end put the PDF-download row flush against the true bottom edge -
 * 0px gap in both cases).
 */
.uap-pk-scroll {
	position: absolute;
	top: var(--uap-pk-popup-chrome, 24px);
	right: 0;
	bottom: var(--uap-pk-popup-chrome, 24px);
	left: 0;
	z-index: 1;
	overflow-y: auto;
	overflow-x: hidden;
}

/*
 * Pages are locked to the DIN-A4-landscape ratio no matter how much content
 * they hold: children are taken out of flow (absolute), so nothing inside
 * can stretch the page's own box. Content that doesn't fit scrolls inside
 * .uap-pk-page-content instead of growing the page.
 */
.uap-pk-page {
	position: relative;
	width: 100%;
	aspect-ratio: 297 / 210;
	box-sizing: border-box;
	overflow: hidden;
	border: 0;
}


/* Optional frame around the visible page-content/image area. Every page uses
   the same responsive popup-chrome inset on all four sides. Keeping these
   offsets on the frame itself makes its OUTER border edge coincide
   pixel-for-pixel with the rendered content/image edge without changing page
   or block dimensions. */

.uap-pk-overlay .uap-pk-page-frame {
	position: absolute !important;
	top: var(--uap-pk-popup-chrome, 24px) !important;
	right: var(--uap-pk-popup-chrome, 24px) !important;
	bottom: var(--uap-pk-popup-chrome, 24px) !important;
	left: var(--uap-pk-popup-chrome, 24px) !important;
	z-index: 2147483647 !important;
	box-sizing: border-box !important;
	border: var(--uap-pk-page-frame-width, 0px) solid var(--uap-pk-page-frame-color, transparent) !important;
	border-radius: var(--uap-pk-page-frame-radius, 0px) !important;
	background: transparent !important;
	box-shadow: none !important;
	outline: 0 !important;
	pointer-events: none !important;
}

/* If a page consists of exactly one normal image block, its visible image
   can be shorter than the page content area. In that specific structure the
   page frame must follow the actual image box instead of the full page inset.
   The PHP renderer adds .uap-pk-page-frame-follows-image only for this exact
   case, so cover pages and mixed-content pages keep their existing geometry. */
.uap-pk-overlay .uap-pk-page-frame-follows-image .uap-pk-page-frame {
	display: none !important;
}

.uap-pk-overlay .uap-pk-page-frame-follows-image .uap-pk-block-image {
	isolation: isolate;
}

/* A natural-size image block is a stretched flex item by default because
   .uap-pk-page-content is a column flexbox. Prevent only that wrapper from
   stretching when it owns the page frame, so the frame can match a small
   image's real width. Cropped/fixed-height image blocks keep width:100%. */
.uap-pk-overlay .uap-pk-page-frame-follows-image .uap-pk-block-image:not(.uap-pk-image-cropped) {
	align-self: flex-start;
	width: auto;
	max-width: 100%;
}

.uap-pk-overlay .uap-pk-page-frame-follows-image .uap-pk-block-image::after {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	z-index: 2147483647 !important;
	box-sizing: border-box !important;
	border: var(--uap-pk-page-frame-width, 0px) solid var(--uap-pk-page-frame-color, transparent) !important;
	border-radius: var(--uap-pk-page-frame-radius, 0px) !important;
	background: transparent !important;
	box-shadow: none !important;
	outline: 0 !important;
	pointer-events: none !important;
}

.uap-pk-page-content {
	position: absolute;
	inset: 0;
	overflow-y: auto;
	padding: var(--uap-pk-popup-chrome, 24px);
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
}

/* Centered page-number row after each page. The 1px page divider belongs
   to this row, so every divider appears directly BELOW its "N of N" label
   instead of at the bottom edge of the page/image itself. The border is
   included in the fixed 24px box via border-box, so spacing stays identical. */
.uap-pk-overlay .uap-pk-page-separator {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex: 0 0 24px !important;
	height: 24px !important;
	min-height: 24px !important;
	max-height: 24px !important;
	margin: 0 !important;
	padding: 0 24px !important;
	box-sizing: border-box !important;
	border: 0 !important;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
	outline: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	text-align: center !important;
	font-size: 12px !important;
	font-style: normal !important;
	font-weight: 400 !important;
	line-height: 14.4px !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	text-decoration: none !important;
	white-space: nowrap !important;
	color: #777;
}

.uap-pk-block + .uap-pk-block {
	margin-top: 12px;
}


/* Legacy/base line height remains inherited from the text block, while
   line heights applied to a TinyMCE selection are stored inline on that
   selected range and therefore override this base value independently. */
.uap-pk-block-text.uap-pk-has-line-height {
	line-height: var(--uap-pk-line-height);
}

.uap-pk-block-text {
	min-width: 0;
	max-width: 100%;
	padding: var(--uap-pk-text-padding, 12px);
	box-sizing: border-box;
	font-family: sans-serif;
	font-size: 17px;
	word-wrap: break-word;
	overflow-wrap: anywhere;
}

.uap-pk-text-content {
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
	font-size: 17px;
}

/* Stable defaults shared by normal text blocks and rich image/cover overlays.
   These are exactly 2px above the former computed 15px browser defaults.
   Inline sizes authored with the editor's font-size field still win. */
.uap-pk-text-content h1 {
	font-size: 32px;
}

.uap-pk-text-content h2 {
	font-size: 24.5px;
}

.uap-pk-text-content h3 {
	font-size: 19.55px;
}

.uap-pk-text-content h4 {
	font-size: 17px;
}

.uap-pk-text-content h5 {
	font-size: 14.45px;
}

.uap-pk-text-content h6 {
	font-size: 12.05px;
}

/* Optional height-centering belongs to the rich-text block itself. In normal
   document flow flex-grow is ignored; inside the page/column/cover flex
   contexts enabled below it consumes the real available height and centers
   only its text content within that measured space. */
.uap-pk-block-text.uap-pk-text-vertical-center {
	display: flex;
	flex: 1 1 0%;
	flex-direction: column;
	justify-content: center;
	min-height: 0;
}

.uap-pk-overlay .uap-pk-links-custom-color a:not([x-apple-data-detectors]) {
	color: var(--uap-pk-link-color) !important;
}

.uap-pk-overlay .uap-pk-links-custom-hover a:not([x-apple-data-detectors]):hover,
.uap-pk-overlay .uap-pk-links-custom-hover a:not([x-apple-data-detectors]):hover *,
.uap-pk-overlay .uap-pk-links-custom-hover a:not([x-apple-data-detectors]):focus,
.uap-pk-overlay .uap-pk-links-custom-hover a:not([x-apple-data-detectors]):focus * {
	color: var(--uap-pk-link-hover-color) !important;
}

.uap-pk-overlay .uap-pk-links-underlined a:not([x-apple-data-detectors]) {
	text-decoration: underline !important;
}

.uap-pk-overlay .uap-pk-links-not-underlined a:not([x-apple-data-detectors]) {
	text-decoration: none !important;
}

.uap-pk-text-content p {
	margin: 0 0 1em;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
}

.uap-pk-text-content p:last-child {
	margin-bottom: 0;
}

.uap-pk-block-text p.uap-pk-empty-line-height,
.uap-pk-image-overlay-rich p.uap-pk-empty-line-height {
	margin: 0 !important;
}

/* The line-gap span keeps its stored height/margin inline, while display is
   class-owned because wp_kses_post() removes display declarations from saved
   rich text. This same rule serves normal text, columns, image text and cover
   text in the live preview and public frontend. */
.uap-pk-text-content .uap-pk-line-gap,
.uap-pk-image-overlay-rich .uap-pk-line-gap {
	display: block !important;
}

.uap-pk-text-content h1,
.uap-pk-text-content h2,
.uap-pk-text-content h3,
.uap-pk-text-content h4,
.uap-pk-text-content h5,
.uap-pk-text-content h6,
.uap-pk-text-content blockquote {
	line-height: inherit;
}

.uap-pk-block-text ul,
.uap-pk-block-text ol {
	margin: 0 0 1em;
	padding-left: 1.5em;
}

.uap-pk-text-content li {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
}

.uap-pk-block-text img,
.uap-pk-block-text video {
	max-width: 100%;
	height: auto;
}

.uap-pk-block-text iframe {
	max-width: 100%;
}

.uap-pk-block-text table {
	display: block;
	max-width: 100%;
	overflow-x: auto;
	border-collapse: collapse;
}

.uap-pk-block-image {
	position: relative;
}

.uap-pk-block-image img {
	max-width: 100%;
	display: block;
}

.uap-pk-image-cropped {
	/* Explicit width (not stretch-resolved "auto") so browsers compute the
	   aspect-ratio-driven height correctly; some engines collapse aspect-ratio
	   flex items with align-items:stretch cross sizing to a height of 0. */
	width: 100%;
	flex: 0 0 auto;
	overflow: hidden;
}

.uap-pk-image-crop-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	max-width: none;
}

.uap-pk-image-overlay {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
	padding: 16px;
	box-sizing: border-box;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
	color: #fff;
}

.uap-pk-image-overlay:not(.uap-pk-image-overlay-rich) h3 {
	margin: 0 0 4px;
	font-size: 20px;
	line-height: 1.25;
}

.uap-pk-image-overlay:not(.uap-pk-image-overlay-rich) p {
	margin: 0;
	font-size: 16px;
	line-height: 1.4;
}


.uap-pk-block-cover > .uap-pk-image-overlay-rich {
	z-index: 3;
}

.uap-pk-image-overlay-rich {
	top: 0;
	bottom: auto;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
	line-height: 22px;
}

.uap-pk-image-overlay-rich.uap-pk-text-vertical-center {
	bottom: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 0;
}

.uap-pk-image-overlay-rich .uap-pk-text-content > :first-child {
	margin-top: 0;
}

.uap-pk-image-overlay-rich .uap-pk-text-content > :last-child {
	margin-bottom: 0;
}

.uap-pk-image-overlay-rich ul,
.uap-pk-image-overlay-rich ol {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.uap-pk-color-overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
}

.uap-pk-block-columns {
	display: grid;
	grid-template-columns: repeat(var(--uap-pk-columns, 2), minmax(0, 1fr));
	column-gap: 16px;
	row-gap: 16px;
	min-width: 0;
	min-height: 0;
	max-width: 100%;
	max-height: 100%;
	box-sizing: border-box;
}

.uap-pk-block-columns-custom-height {
	overflow: hidden;
}

/* Optional second row. The regular columns remain direct children of the
   original grid and therefore keep their side-by-side positions unchanged. */
.uap-pk-column-full-width {
	grid-column: 1 / -1;
	width: 100%;
	min-width: 0;
	min-height: 0;
	max-width: 100%;
	box-sizing: border-box;
	overflow: hidden;
}

/* When a multi-column row has a full-width row above/below it, centered text
   in that full-width row can follow any selected divider between adjacent
   columns. JavaScript measures the actual responsive gap midpoint and supplies
   only the extra left/right padding needed to put the text's center there. */
.uap-pk-column-full-width .uap-pk-align-to-regular-divider {
	box-sizing: border-box !important;
	padding-left: var(--uap-pk-divider-pad-left, 0px) !important;
	padding-right: var(--uap-pk-divider-pad-right, 0px) !important;
	text-align: center !important;
}

.uap-pk-column {
	position: relative;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
	word-wrap: break-word;
	overflow-wrap: anywhere;
	word-break: normal;
}

/* A direct image/cover configured to fill its column needs a real flex
   containing block. This also repairs legacy direct column images saved with
   the older "Seite ausfüllen" value: inside a column that value can only fill
   the column's available grid-row height, so both saved modes share the same
   geometry here. */
.uap-pk-column-has-fill-block {
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.uap-pk-column-has-vertical-center-text {
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.uap-pk-column-has-fill-block > .uap-pk-block-image.uap-pk-image-cropped,
.uap-pk-column-has-fill-block > .uap-pk-block-cover {
	min-height: 0;
}

.uap-pk-block-columns-custom-rows > .uap-pk-column {
	min-height: 0;
	height: 100%;
	overflow: hidden;
}

/* The configured column frame is a visual overlay only. It must not change
   the column's measured width/height: increasing the real box by the frame
   thickness can push its bottom edge outside a clipped cover block. The
   column itself is also reset so this configured frame remains the only
   border/outline/shadow around it, independent of theme CSS. Content is
   clipped to this same box: without it, text taller than the column's
   configured height (typewriter FX with neither centering option enabled,
   in particular) visibly renders past the drawn frame instead of staying
   inside it. FX5 explicitly reopens this during its own run (see the
   dedicated override below) because it must temporarily cross the edge. */
.uap-pk-column-has-border {
	isolation: isolate;
	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
	border-radius: var(--uap-pk-column-border-radius, 0px) !important;
	overflow: hidden;
}

.uap-pk-overlay .uap-pk-column-frame {
	position: absolute !important;
	inset: 0 !important;
	z-index: 2147483647 !important;
	box-sizing: border-box !important;
	border: 0 solid transparent !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	outline: 0 !important;
	pointer-events: none !important;
}

.uap-pk-overlay .uap-pk-column-has-border .uap-pk-column-frame {
	border-width: var(--uap-pk-column-border-width, 0px) !important;
	border-color: var(--uap-pk-column-border-color, transparent) !important;
	border-radius: var(--uap-pk-column-border-radius, 0px) !important;
}

/* Every column frame can end exactly on an overflow-clipped grid/page edge.
   Keep the real border, but move the complete frame inward by exactly half a
   physical device pixel. frontend.js calculates that value from the live
   devicePixelRatio; the admin preview additionally includes its actual preview
   scale. Regular and full-width columns intentionally share this one path so a
   through-row cannot lose a side that a normal row keeps. */
.uap-pk-overlay .uap-pk-column .uap-pk-column-frame {
	inset: var(--uap-pk-column-frame-safe-inset, 0px) !important;
}

/* Since 0.18.11.62 the resting frame is a direct child of the real column.
   Its border is painted inward and therefore no longer needs the historical
   half-device-pixel inset that protected frames inside clipped FX/content
   wrappers. Keeping that inset here leaves the fill image visible in a thin
   strip outside the frame, most noticeably along the bottom of fractional
   three-column grids. Nested frames during a running FX retain the safe inset
   through the general descendant rule above. */
.uap-pk-overlay .uap-pk-column > .uap-pk-column-frame {
	inset: 0 !important;
}

.uap-pk-overlay .uap-pk-column.uap-pk-column-has-border .uap-pk-column-frame {
	border-radius: max(0px, calc(var(--uap-pk-column-border-radius, 0px) - var(--uap-pk-column-frame-safe-inset, 0px))) !important;
}

.uap-pk-overlay .uap-pk-column.uap-pk-column-has-border > .uap-pk-column-frame {
	border-radius: var(--uap-pk-column-border-radius, 0px) !important;
}

.uap-pk-column img,
.uap-pk-column video,
.uap-pk-column iframe,
.uap-pk-column table {
	max-width: 100%;
}

.uap-pk-block-cover {
	position: relative;
	padding: 24px;
	box-sizing: border-box;
	overflow: hidden;
}

.uap-pk-cover-bg-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}

.uap-pk-cover-inner {
	position: relative;
	z-index: 2;
}

.uap-pk-cover-inner-has-vertical-center-text {
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 0;
	box-sizing: border-box;
}

.uap-pk-cover-inner-resize-context {
	height: 100%;
	min-height: 0;
	box-sizing: border-box;
}


/* When a cover contains exactly one columns block, the cover is the real
   visible clipping boundary. Lock that grid to the cover's content box so a
   tall image/text column cannot grow its own box below the visible cover and
   take the bottom frame edge with it. Content beyond the already-clipped cover
   remains clipped exactly as before; only the frame now ends at the visible
   edge. */
/* When a cover consists only of one columns block, the columns together
   must occupy exactly the same rectangle as the cover/background image.
   The normal 24px cover padding would otherwise make the grid 48px narrower
   and 48px shorter than the image. This special class is emitted only for
   that exact structure, so mixed-content covers keep their existing padding. */
.uap-pk-block-cover.uap-pk-cover-columns-only {
	padding: 0;
}

.uap-pk-cover-inner-columns-only {
	width: 100%;
	height: 100%;
	min-width: 0;
	min-height: 0;
	box-sizing: border-box;
}

.uap-pk-cover-inner-columns-only > .uap-pk-block-columns {
	width: 100%;
	height: 100%;
	min-width: 0;
	min-height: 0;
	overflow: hidden;
}

.uap-pk-cover-inner-columns-only > .uap-pk-block-columns:not(.uap-pk-block-columns-has-full-width) > .uap-pk-column {
	height: 100%;
	min-height: 0;
	overflow: hidden;
}

/* With the optional full-width row, the grid itself remains the fixed cover
   rectangle. The first row gets the remaining height; the full-width row uses
   only the height required by its own content, and both stay clipped to cover. */
.uap-pk-cover-inner-columns-only > .uap-pk-block-columns.uap-pk-block-columns-has-full-width.uap-pk-full-after {
	grid-template-rows: minmax(0, 1fr) auto;
}

.uap-pk-cover-inner-columns-only > .uap-pk-block-columns.uap-pk-block-columns-has-full-width.uap-pk-full-before {
	grid-template-rows: auto minmax(0, 1fr);
}

.uap-pk-cover-inner-columns-only > .uap-pk-block-columns.uap-pk-block-columns-has-full-width > .uap-pk-column:not(.uap-pk-column-full-width) {
	min-height: 0;
	overflow: hidden;
}

/* The same geometry applies when a columns block is the only block directly
   on a page: fill the page-content flex area so all four frame edges remain
   inside the visible page. */
.uap-pk-page-content > .uap-pk-block-columns:only-child {
	flex: 1 1 0%;
	min-height: 0;
	overflow: hidden;
}

.uap-pk-page-content > .uap-pk-block-columns:only-child.uap-pk-block-columns-custom-height {
	flex: 0 0 auto;
}

.uap-pk-page-content > .uap-pk-block-columns:only-child:not(.uap-pk-block-columns-has-full-width) > .uap-pk-column {
	min-height: 0;
	overflow: hidden;
}

.uap-pk-page-content > .uap-pk-block-columns:only-child.uap-pk-block-columns-has-full-width.uap-pk-full-after {
	grid-template-rows: minmax(0, 1fr) auto;
}

.uap-pk-page-content > .uap-pk-block-columns:only-child.uap-pk-block-columns-has-full-width.uap-pk-full-before {
	grid-template-rows: auto minmax(0, 1fr);
}

.uap-pk-page-content > .uap-pk-block-columns:only-child.uap-pk-block-columns-has-full-width > .uap-pk-column:not(.uap-pk-column-full-width) {
	min-height: 0;
	overflow: hidden;
}

.uap-pk-cover-inner > .uap-pk-block:first-child {
	margin-top: 0;
}

.uap-pk-block-social {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	padding-left: 12px;
	padding-right: 12px;
	box-sizing: border-box;
}

.uap-pk-block-social.uap-pk-social-horizontal {
	flex-direction: row;
}

.uap-pk-block-social.uap-pk-social-vertical {
	flex-direction: column;
	align-items: flex-start;
	flex-wrap: nowrap;
}

.uap-pk-social-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--uap-pk-social-size, 32px);
	height: var(--uap-pk-social-size, 32px);
	font-size: var(--uap-pk-social-size, 32px);
	color: var(--uap-pk-social-color, #333);
	line-height: 0;
}

.uap-pk-overlay .uap-pk-social-icon:hover {
	color: var(--uap-pk-social-hover-color, var(--uap-pk-social-color, #333)) !important;
}

.uap-pk-social-icon svg {
	width: 100%;
	height: 100%;
}

.uap-pk-social-custom-icon {
	display: block;
	width: 100%;
	height: 100%;
	background-color: currentColor;
	-webkit-mask-image: var(--uap-pk-social-custom-mask);
	mask-image: var(--uap-pk-social-custom-mask);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.uap-pk-video-embed {
	position: relative;
	padding-top: 56.25%;
}

.uap-pk-video-embed iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.uap-pk-block-video video {
	max-width: 100%;
	display: block;
}


.uap-pk-block-shortcode {
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

.uap-pk-block-shortcode > * {
	max-width: 100%;
}


/* Presskit-wide content frame. When enabled in the backend, these rules
   override per-page/per-column frame values without mutating them, so turning
   the global option off restores the individual settings. New pages, images,
   covers and columns automatically inherit the same frame variables. */
.uap-pk-overlay.uap-pk-global-frame .uap-pk-page-frame {
	border: var(--uap-pk-global-frame-width, 0px) solid var(--uap-pk-global-frame-color, transparent) !important;
	border-radius: var(--uap-pk-global-frame-radius, 0px) !important;
}

.uap-pk-overlay.uap-pk-global-frame .uap-pk-block-image,
.uap-pk-overlay.uap-pk-global-frame .uap-pk-block-cover,
.uap-pk-overlay.uap-pk-global-frame .uap-pk-column {
	position: relative;
	isolation: isolate;
	border-radius: var(--uap-pk-global-frame-radius, 0px) !important;
	overflow: hidden;
}

/* A rounded overlay frame and its image/background must share the same clip
   path. Without the radius on the host, square image corners remain visible
   outside the rounded frame and make the frame appear shifted in both the
   frontend and html2canvas' PDF clone. */

.uap-pk-overlay.uap-pk-global-frame .uap-pk-block-image::after,
.uap-pk-overlay.uap-pk-global-frame .uap-pk-block-cover::after {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	z-index: 2147483647 !important;
	box-sizing: border-box !important;
	border: var(--uap-pk-global-frame-width, 0px) solid var(--uap-pk-global-frame-color, transparent) !important;
	border-radius: var(--uap-pk-global-frame-radius, 0px) !important;
	background: transparent !important;
	box-shadow: none !important;
	outline: 0 !important;
	pointer-events: none !important;
}

/* A single fill image/cover and its column occupy the same rectangle. Drawing
   both global frames produces two slightly offset borders (the column frame
   has its physical-pixel safety inset). Keep the column frame as the one
   authoritative edge in normal, independent-column-FX and page-column-FX DOM
   structures. */
.uap-pk-overlay.uap-pk-global-frame .uap-pk-column-single-fill-media > .uap-pk-block-image::after,
.uap-pk-overlay.uap-pk-global-frame .uap-pk-column-single-fill-media > .uap-pk-block-cover::after,
.uap-pk-overlay.uap-pk-global-frame .uap-pk-column-single-fill-media > .uap-pk-column-fx-panel > .uap-pk-column-fx-target > .uap-pk-block-image::after,
.uap-pk-overlay.uap-pk-global-frame .uap-pk-column-single-fill-media > .uap-pk-column-fx-panel > .uap-pk-column-fx-target > .uap-pk-block-cover::after,
.uap-pk-overlay.uap-pk-global-frame .uap-pk-column-single-fill-media > .uap-pk-fx-column-content > .uap-pk-block-image::after,
.uap-pk-overlay.uap-pk-global-frame .uap-pk-column-single-fill-media > .uap-pk-fx-column-content > .uap-pk-block-cover::after,
.uap-pk-overlay.uap-pk-global-frame .uap-pk-column-single-fill-media > .uap-pk-fx-column-content > .uap-pk-column-fx-panel > .uap-pk-column-fx-target > .uap-pk-block-image::after,
.uap-pk-overlay.uap-pk-global-frame .uap-pk-column-single-fill-media > .uap-pk-fx-column-content > .uap-pk-column-fx-panel > .uap-pk-column-fx-target > .uap-pk-block-cover::after {
	content: none !important;
	border: 0 !important;
}

.uap-pk-overlay.uap-pk-global-frame .uap-pk-column-frame {
	border-width: var(--uap-pk-global-frame-width, 0px) !important;
	border-color: var(--uap-pk-global-frame-color, transparent) !important;
	border-radius: var(--uap-pk-global-frame-radius, 0px) !important;
}

.uap-pk-overlay.uap-pk-global-frame .uap-pk-column .uap-pk-column-frame {
	border-radius: max(0px, calc(var(--uap-pk-global-frame-radius, 0px) - var(--uap-pk-column-frame-safe-inset, 0px))) !important;
}

.uap-pk-overlay.uap-pk-global-frame .uap-pk-column > .uap-pk-column-frame {
	border-radius: var(--uap-pk-global-frame-radius, 0px) !important;
}

.uap-pk-copyright {
	box-sizing: border-box;
	width: 100%;
	margin: calc(var(--uap-pk-copyright-margin-top, 10px) + var(--uap-pk-outer-border-width, 0px)) 0 0;
	padding: 0;
	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
	font-size: var(--uap-pk-copyright-size, 11px) !important;
	color: var(--uap-pk-copyright-color, #666666) !important;
	line-height: 1.3;
	white-space: nowrap !important;
}


/* A single-image page already uses the image itself as the page-frame target.
   Keep one physical line at that exact image edge instead of drawing a second
   overlapping page-frame line. */
.uap-pk-overlay.uap-pk-global-frame .uap-pk-page-frame-follows-image .uap-pk-page-frame {
	display: none !important;
}

.uap-pk-pdf-row {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 0;
	padding: 20px var(--uap-pk-popup-chrome, 24px);
	text-align: center;
}

/* The action group keeps the existing 10px inter-button gap and is scaled as
   one visual unit only when its real button edges would come within 12px of
   the visible inner frame. Scaling the group (instead of each button) keeps
   custom/theme-styled footer buttons and their relative spacing together. */
.uap-pk-pdf-actions {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	gap: 10px;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
	transform: scale(var(--uap-pk-download-scale, 1));
	transform-origin: center center;
}

.uap-pk-footer-plugin-button {
	cursor: pointer;
	padding: 10px 20px;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 6px;
	background: #fff;
	font-size: 14px;
}

.uap-pk-footer-plugin-button {
	display: inline-block;
	color: inherit;
	text-decoration: none;
}

.uap-pk-pdf-download:disabled {
	opacity: 0.6;
	cursor: default;
}

/* Elements marked by frontend.js are hidden only while an overlay whose
   backend option is enabled is open. Media elements are never marked, so
   cover images, featured images and linked images remain visible. */
.uap-pk-underlay-hidden {
	visibility: hidden !important;
}

body.uap-pk-hide-page-content .uap-pk-overlay,
body.uap-pk-hide-page-content .uap-pk-overlay * {
	visibility: visible !important;
}

body.uap-pk-open {
	overflow: hidden;
}

/* Whole-page FX run inside a geometry-neutral stage instead of using
   .uap-pk-page itself as the Bio panel. Some Bio effects (notably the book
   effect) temporarily set panel min-height; applying that to the DIN-A4 page
   changes its measured height and separates a fill image from the page frame.
   The stage is permanently locked to the page box, so FX may transform or
   temporarily size their own panel without changing Presskit page geometry. */
.uap-pk-page-fx-panel,
.uap-pk-page-fx-target {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	min-width: 0 !important;
	min-height: 0 !important;
	max-width: 100% !important;
	max-height: 100% !important;
	box-sizing: border-box !important;
}

.uap-pk-page-fx-panel {
	display: block !important;
	overflow: hidden !important;
}

.uap-pk-page-fx-target {
	overflow: hidden !important;
}

/* -------------------------------------------------------------------------
 * Live UAP Bio FX adapter.
 * -------------------------------------------------------------------------
 * The effect algorithms stay in the installed UAP Bio runtime. Presskit only
 * supplies the structural hooks required to animate a Presskit page. No Bio
 * typography, colours, spacing or component styling is imported here. */
.uap-pk-fx-runtime-host {
	display: none !important;
}

.uap-pk-page-has-fx,
.uap-pk-page-has-fx .tooloon-bio-animation-target,
.uap-pk-column-has-fx,
.uap-pk-column-has-fx .tooloon-bio-animation-target,
.uap-pk-text-has-fx,
.uap-pk-text-has-fx .tooloon-bio-animation-target {
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

.uap-pk-page-has-fx.tooloon-fx1-door-target,
.uap-pk-page-has-fx .uap-pk-column.tooloon-fx1-door-target,
.uap-pk-column-has-fx.tooloon-fx1-door-target,
.uap-pk-column-has-fx .uap-pk-column-fx-panel.tooloon-fx1-door-target,
.uap-pk-column-has-fx .uap-pk-column-fx-target.tooloon-fx1-door-target,
.uap-pk-text-has-fx .uap-pk-text-fx-target.tooloon-fx1-door-target {
	will-change: transform;
}

.uap-pk-page-has-fx.tooloon-fx5-flight-target,
.uap-pk-page-has-fx .uap-pk-column.tooloon-fx5-flight-target,
.uap-pk-column-has-fx.tooloon-fx5-flight-target,
.uap-pk-column-has-fx .uap-pk-column-fx-panel.tooloon-fx5-flight-target,
.uap-pk-column-has-fx .uap-pk-column-fx-target.tooloon-fx5-flight-target,
.uap-pk-text-has-fx .uap-pk-text-fx-target.tooloon-fx5-flight-target {
	will-change: transform, opacity;
}

/* UAP Bio's public stylesheet contains the generic rule
   .tooloon-bio-animation-target img { height:auto; }. During a Presskit FX,
   that selector is more specific than the normal crop/cover image classes and
   would therefore replace their required 100% height. Restore only the two
   Presskit image types that deliberately fill a fixed box; natural-size images
   keep Bio's normal height:auto behavior. */
.uap-pk-overlay .tooloon-bio-animation-target img.uap-pk-image-crop-img,
.uap-pk-overlay .tooloon-bio-animation-target img.uap-pk-cover-bg-img {
	height: 100%;
}

.uap-pk-fx-column-content {
	position: relative;
	width: 100%;
	height: 100%;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

/* Whole-column FX now mirror the permanent page FX panel/target structure.
   Keeping the real Presskit blocks inside this stable structure means the FX
   runtime never reparents them during an animation, so direct-child image and
   cover sizing cannot disappear when several columns animate. */
.uap-pk-column-fx-panel,
.uap-pk-column-fx-target {
	width: 100%;
	height: 100%;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

.uap-pk-column-fx-target {
	position: relative;
}

.uap-pk-column-fx-panel {
	position: relative;
}

/* Each editor-level text FX has its own stable panel/target and Bio runtime
   host. Only glyph-bearing rich-text content is inside this target; the parent
   text block/image/cover remains in the main page/column FX geometry. */
.uap-pk-text-fx-panel,
.uap-pk-text-fx-target {
	position: relative;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

.uap-pk-text-vertical-center > .uap-pk-text-fx-panel {
	width: 100%;
}

.uap-pk-column-has-vertical-center-text > .uap-pk-column-fx-panel,
.uap-pk-column-has-vertical-center-text > .uap-pk-column-fx-panel > .uap-pk-column-fx-target {
	display: flex;
	flex: 1 1 0%;
	flex-direction: column;
	min-height: 0;
	height: 100%;
}

.uap-pk-column-has-fill-block > .uap-pk-column-fx-panel,
.uap-pk-column-has-fill-block > .uap-pk-column-fx-panel > .uap-pk-column-fx-target {
	display: flex;
	flex: 1 1 0%;
	flex-direction: column;
	min-height: 0;
	height: 100%;
}

.uap-pk-column-has-fill-block > .uap-pk-column-fx-panel > .uap-pk-column-fx-target > .uap-pk-block-image.uap-pk-image-cropped,
.uap-pk-column-has-fill-block > .uap-pk-column-fx-panel > .uap-pk-column-fx-target > .uap-pk-block-cover {
	min-height: 0;
}

/* UAP Bio FX4 can temporarily change the inner FX panel's minimum height.
   Lock the outer Presskit column to its already rendered height only while FX4
   runs, so the inner panel cannot expand the grid row. The lock is removed as
   soon as the FX finishes or the page leaves the viewport. */
.uap-pk-column-fx-geometry-locked {
	height: var(--uap-pk-fx-locked-height) !important;
	min-height: var(--uap-pk-fx-locked-height) !important;
	max-height: var(--uap-pk-fx-locked-height) !important;
	overflow: hidden;
}

/* Several fixed page/cover column layouts deliberately clip normal column
   content. FX5 moves its temporary animation target across the column edge,
   so that clipping must be suspended only for the running FX5 column. The
   original clipping rule becomes active again as soon as the runtime class is
   removed. */
.uap-pk-column.uap-pk-column-fx-running-fx5,
.uap-pk-page.uap-pk-fx-running-fx5 .uap-pk-column.uap-pk-fx-column-target {
	overflow: visible !important;
}

/* Every normal page/column FX is armed while the popup is still hidden. Its
   real content stays unpainted until that exact FX has synchronously installed
   its start state. FX3 is released in the same animation frame in which Bio
   positions the credits target. Descendants are included because the optional
   "hide underlying page content" mode explicitly forces overlay descendants to
   visibility:visible; these more specific rules must win there as well. */
.uap-pk-overlay .uap-pk-fx-content-pending,
.uap-pk-overlay .uap-pk-fx-content-pending *,
body.uap-pk-hide-page-content .uap-pk-overlay .uap-pk-fx-content-pending,
body.uap-pk-hide-page-content .uap-pk-overlay .uap-pk-fx-content-pending * {
	visibility: hidden !important;
	pointer-events: none !important;
}

/* FX 4 needs a temporary two-half page clone. These rules define geometry
   only; all visual content continues to be the cloned Presskit page itself. */
.uap-pk-overlay .tooloon-fx4-book-overlay {
	position: absolute;
	z-index: 2147483647;
	top: 0;
	left: 0;
	width: 100%;
	overflow: visible;
	perspective: 1600px;
	-webkit-perspective: 1600px;
	pointer-events: none;
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	contain: layout paint style;
}

.uap-pk-overlay .tooloon-fx4-book-half {
	position: absolute;
	top: 0;
	width: 50%;
	height: 100%;
	overflow: hidden;
	box-sizing: border-box;
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
}

.uap-pk-overlay .tooloon-fx4-book-half-left {
	left: 0;
}

.uap-pk-overlay .tooloon-fx4-book-half-right {
	right: 0;
}

.uap-pk-overlay .tooloon-fx4-book-page {
	z-index: 2;
}

.uap-pk-overlay .tooloon-fx4-book-stationary {
	z-index: 1;
}

.uap-pk-overlay .tooloon-fx4-book-rtl .tooloon-fx4-book-page {
	transform-origin: 0 50%;
	-webkit-transform-origin: 0 50%;
}

.uap-pk-overlay .tooloon-fx4-book-ltr .tooloon-fx4-book-page {
	transform-origin: 100% 50%;
	-webkit-transform-origin: 100% 50%;
}

.uap-pk-overlay .tooloon-fx4-book-face {
	position: absolute;
	inset: 0;
	overflow: hidden;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
}

.uap-pk-overlay .tooloon-fx4-book-front {
	transform: rotateY(0deg);
	-webkit-transform: rotateY(0deg);
}

.uap-pk-overlay .tooloon-fx4-book-back {
	transform: rotateY(180deg);
	-webkit-transform: rotateY(180deg);
	background: transparent;
}

.uap-pk-overlay .tooloon-fx4-book-content-clone {
	margin: 0 !important;
	pointer-events: none !important;
	user-select: none !important;
	-webkit-user-select: none !important;
}

/* Typewriter cursor suppression is scoped only to effects that the live UAP
   Bio registry identifies as typewriter/schreibmaschine. It handles the
   browser caret, a target-level pseudo cursor, and explicit runtime cursor
   elements without modifying other FX. */
.uap-pk-overlay [data-uap-pk-fx-typewriter="1"].uap-pk-fx-running .tooloon-bio-animation-target,
.uap-pk-overlay [data-uap-pk-fx-typewriter="1"].uap-pk-column-fx-running .tooloon-bio-animation-target,
.uap-pk-overlay [data-uap-pk-fx-typewriter="1"].uap-pk-text-fx-running .uap-pk-text-fx-target,
.uap-pk-overlay [data-uap-pk-fx-typewriter="1"].uap-pk-text-fx-running .uap-pk-text-fx-target * {
	caret-color: transparent !important;
}

.uap-pk-overlay [data-uap-pk-fx-typewriter="1"].uap-pk-fx-running .tooloon-bio-animation-target::after,
.uap-pk-overlay [data-uap-pk-fx-typewriter="1"].uap-pk-column-fx-running .tooloon-bio-animation-target::after,
.uap-pk-overlay [data-uap-pk-fx-typewriter="1"].uap-pk-text-fx-running .uap-pk-text-fx-target::after {
	content: none !important;
	border: 0 !important;
	animation: none !important;
}

.uap-pk-overlay [data-uap-pk-fx-typewriter="1"] [class*="cursor"],
.uap-pk-overlay [data-uap-pk-fx-typewriter="1"] [class*="caret"],
.uap-pk-overlay [data-uap-pk-fx-typewriter="1"] [class*="Cursor"],
.uap-pk-overlay [data-uap-pk-fx-typewriter="1"] [class*="Caret"] {
	display: none !important;
}

/* External Social/Linktree mode runs on the real WordPress frontend.
   Coverbild and Hintergrundfarbe add only a fixed visual layer below the
   unchanged popup. */
body.uap-pk-social-host .uap-pk-social-background-image,
body.uap-pk-social-host .uap-pk-social-background-color {
	position: fixed;
	inset: 0;
	z-index: 99999;
	pointer-events: none;
}

body.uap-pk-social-host .uap-pk-social-background-image {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}