.ws-tools {
	--ws-tools-gap: var(--wp--style--block-gap, 1rem);
	--ws-accent: var(--wp--custom--greyd--button--prim--color--background, var(--wp--preset--color--primary, #1d4ed8));
	--ws-text: var(--wp--preset--color--foreground, inherit);
	--ws-label: var(--wp--custom--greyd--input--label--color--text, var(--wp--preset--color--foreground, inherit));
	--ws-button-text: var(--wp--custom--greyd--button--prim--color--text, var(--wp--preset--color--base, #fff));
	--ws-input-bg: var(--wp--custom--greyd--input--prim--color--background, var(--wp--preset--color--base, #fff));
	--ws-form-bg: var(--wp--preset--color--base, #fff);
	--ws-border: var(--wp--custom--greyd--input--prim--border--color, var(--wp--preset--color--mediumlight, #d1d5db));
	--ws-notice-bg: var(--wp--preset--color--lightest, #eff6ff);
	--ws-result-bg: var(--wp--preset--color--base, #f8fafc);
	--ws-border-width: var(--wp--custom--greyd--input--prim--border--width, 1px);
	--ws-form-radius: var(--wp--custom--greyd--input--prim--border--radius, 12px);
	--ws-input-radius: var(--wp--custom--greyd--input--prim--border--radius, 6px);
	--ws-button-radius: var(--wp--custom--greyd--button--prim--border--radius, 6px);
	--ws-notice-radius: var(--wp--custom--greyd--input--prim--border--radius, 8px);
	--ws-result-radius: var(--wp--custom--greyd--input--prim--border--radius, 12px);
	--ws-label-weight: var(--wp--custom--greyd--input--label--typography--font-weight, 600);
	--ws-panel-padding: var(--wp--preset--spacing--medium, 24px);
	color: var(--ws-text);
	font-family: var(--wp--preset--font-family--body, inherit);
	max-width: var(--wp--style--global--wide-size, 60rem);
}
.ws-tools *, .ws-tools *::before, .ws-tools *::after { box-sizing: border-box; }
.ws-tools__app { height: auto; transition: height 280ms cubic-bezier(.4, 0, .2, 1); }
.ws-tools__intro, .ws-tools__form, .ws-tools__result, .ws-tools__lead { display: grid; gap: var(--ws-tools-gap); }
.ws-tools__progress progress { accent-color: var(--ws-accent, currentColor); width: 100%; }
.ws-tools__step-title { font-size: clamp(1.15rem, 2vw, 1.4rem); margin: 0 0 .65rem; }
.ws-tools fieldset { border: 0; margin: 0; min-width: 0; padding: 0; }
.ws-tools--boxed-form .ws-tools__form { background: var(--ws-form-bg, #fff); border: var(--ws-border-width, 1px) solid var(--ws-border, currentColor); border-radius: var(--ws-form-radius, .5rem); padding: var(--ws-panel-padding, 1.5rem); }
.ws-tools__field { display: grid; gap: .35rem; margin-block: 1rem; }
.ws-tools__label { color: var(--ws-label, inherit); font-weight: var(--ws-label-weight, 600); }
.ws-tools__help { color: color-mix(in srgb, var(--ws-text, currentColor) 72%, transparent); font-size: .875em; line-height: 1.45; margin: .15rem 0 0; }
.ws-tools__example { display: block; margin-top: .18rem; }
.ws-tools__input { font: inherit; max-width: 100%; min-height: 2.75rem; width: 100%; }
.ws-tools:not(.ws-tools--theme-styles) .ws-tools__input { background: var(--ws-input-bg, #fff); border: var(--ws-border-width, 1px) solid var(--ws-border, currentColor); border-radius: var(--ws-input-radius, .25rem); color: var(--ws-text, inherit); padding: .65rem .75rem; }
.ws-tools textarea.ws-tools__input { min-height: 7rem; resize: vertical; }
.ws-tools__choice { align-items: flex-start; display: flex; gap: .55rem; margin-block: .6rem; }
.ws-tools__choice input { flex: 0 0 auto; margin-top: .25em; }
.ws-tools__button { cursor: pointer; min-height: 2.75rem; }
.ws-tools:not(.ws-tools--theme-styles) .ws-tools__button { background: var(--ws-accent, #1e1e1e); border: 2px solid transparent; border-radius: var(--ws-button-radius, .25rem); color: var(--ws-button-text, #fff); font: inherit; font-weight: 600; padding: .65rem 1rem; }
.ws-tools:not(.ws-tools--theme-styles) .ws-tools__button--secondary { background: transparent; border-color: var(--ws-accent, currentColor); color: var(--ws-accent, inherit); }
.ws-tools__button:disabled { cursor: wait; opacity: .65; }
.ws-tools :focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }
.ws-tools__navigation, .ws-tools__actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-block: 1rem; }
.ws-tools__navigation .wp-block-button, .ws-tools__actions .wp-block-button { margin: 0; }
.ws-tools__required-note { font-size: .875em; margin: 0; }
.ws-tools__notice { background: var(--ws-notice-bg, transparent); border-inline-start: .3rem solid var(--ws-accent, currentColor); border-radius: var(--ws-notice-radius, 0); padding: .75rem 1rem; }
.ws-tools__notice--warning { background: color-mix(in srgb, #f0b849 16%, transparent); }
.ws-tools__draft h2, .ws-tools__draft p { margin-block: 0 .5rem; }
.ws-tools__review { display: grid; gap: 1rem; margin-bottom: 1.5rem; }
.ws-tools__review > h3, .ws-tools__review > p { margin: 0; }
.ws-tools__review-section { border: var(--ws-border-width, 1px) solid var(--ws-border, currentColor); border-radius: var(--ws-notice-radius, .5rem); padding: 1rem; }
.ws-tools__review-heading { align-items: center; display: flex; gap: 1rem; justify-content: space-between; }
.ws-tools__review-heading h4 { margin: 0; }
.ws-tools__review-edit { background: none; border: 0; color: var(--ws-accent, currentColor); cursor: pointer; font: inherit; font-weight: 600; padding: .25rem; text-decoration: underline; }
.ws-tools__review-section dl { display: grid; gap: .65rem; margin: 1rem 0 0; }
.ws-tools__review-row { display: grid; gap: .25rem; grid-template-columns: minmax(11rem, 1fr) 2fr; }
.ws-tools__review-row dt { font-weight: var(--ws-label-weight, 600); }
.ws-tools__review-row dd, .ws-tools__review-row dt { margin: 0; overflow-wrap: anywhere; }
.ws-tools__error, .ws-tools__summary-error { color: #b32d2e; font-weight: 600; }
.ws-tools__summary-error:empty, .ws-tools__error:empty { display: none; }
.ws-tools [aria-invalid="true"] { border-color: #b32d2e; }
.ws-tools__preview { border: var(--ws-border-width, 1px) solid transparent; overflow-wrap: anywhere; padding: clamp(1rem, 3vw, var(--ws-panel-padding, 2rem)); }
.ws-tools--boxed-output .ws-tools__preview { background: var(--ws-result-bg, #f8fafc); border-color: var(--ws-border, currentColor); border-radius: var(--ws-result-radius, .5rem); }
.ws-tools__preview--code { font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace; font-size: .875em; overflow: auto; white-space: pre-wrap; }
.ws-tools__generated-imprint p { margin-block: 1em; }
.ws-tools__result dl { display: grid; gap: .35rem 1rem; grid-template-columns: minmax(10rem, 1fr) 2fr; }
.ws-tools__result dt, .ws-tools__result dd { margin: 0; }
.ws-tools--boxed-output .ws-tools__generated-imprint h3 { border-bottom: var(--ws-border-width, 1px) solid var(--ws-border, currentColor); padding-bottom: .45rem; }
.ws-tools__attribution { background: var(--ws-notice-bg, transparent); border-radius: var(--ws-notice-radius, 0); border-top: var(--ws-border-width, 1px) solid var(--ws-border, currentColor); margin-top: 2rem; padding: 1rem; }
.ws-tools__honeypot { height: 0; left: -9999px; overflow: hidden; position: absolute; width: 0; }
.ws-tools__turnstile { min-height: 4.5rem; }
.ws-tools__success { margin-top: .5rem; }
.screen-reader-text { clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; width: 1px; }
@media (prefers-reduced-motion: reduce) { .ws-tools__app { transition: none; } }
@media (max-width: 37.5rem) { .ws-tools__navigation, .ws-tools__actions { align-items: stretch; flex-direction: column; } .ws-tools__navigation .wp-block-button, .ws-tools__actions .wp-block-button, .ws-tools__button { width: 100%; } .ws-tools__result dl, .ws-tools__review-row { grid-template-columns: 1fr; } .ws-tools__result dd { margin-bottom: .75rem; } }

/* ------------------------------------------------------------------
 * Hausoptik: Karte, Pillen, Hinweise und Rueckruf-Bereich im Stil der
 * Inhaltskacheln von Greyd-Themes (1px Rahmen, 30px Radius, Eckmarke).
 * Alle Werte folgen den Theme-Variablen; ohne Greyd greifen die Fallbacks.
 * ------------------------------------------------------------------ */
.ws-tools {
	--ws-ink: var(--wp--preset--color--foreground, #191f30);
	--ws-corner: var(--wp--preset--color--tertiary, #373736);
	--ws-soft: color-mix(in srgb, var(--ws-accent) 16%, var(--wp--preset--color--base, #fff));
	--ws-line: color-mix(in srgb, var(--ws-ink) 16%, transparent);
	--ws-card-radius: 30px;
	--ws-inner-radius: 18px;
	--ws-card-padding: clamp(1.25rem, 3.5vw, 2.5rem);
	max-width: none;
}
.ws-tools .screen-reader-text { border: 0 !important; clip: rect(0, 0, 0, 0) !important; clip-path: inset(50%) !important; height: 1px !important; margin: -1px !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; white-space: nowrap !important; width: 1px !important; }
.ws-tools .ws-tools__intro { display: grid; gap: .9rem; margin-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.ws-tools .ws-tools__intro > * { margin: 0 !important; }
.ws-tools .ws-tools__intro > p:not([class]) { max-width: 52rem; }
.ws-tools .ws-tools__badges { display: flex; flex-wrap: wrap; gap: .75rem; list-style: none; margin: .25rem 0 0; padding: 0; }
.ws-tools .ws-tools__badges li { align-items: center; background: var(--ws-accent); border-radius: var(--ws-button-radius, 18px); color: var(--ws-button-text); display: inline-flex; font-size: 1rem; font-weight: 700; gap: .55rem; line-height: 1.5; margin: 0; padding: 14px 22px 15px; }
.ws-tools .ws-tools__badges li::before { content: "\2713"; font-weight: 700; }
.ws-tools .ws-tools__app { background: var(--ws-form-bg, #fff); border: 1px solid var(--ws-ink); border-radius: var(--ws-card-radius); padding: var(--ws-card-padding); position: relative; }
.ws-tools .ws-tools__app::after { background: var(--ws-corner); border-radius: 0 0 var(--ws-card-radius) 0; bottom: -1px; content: ""; height: 35px; pointer-events: none; position: absolute; right: -1px; width: 35px; }
.ws-tools .ws-tools__app h3.wp-block-heading { margin-top: 0; }
.ws-tools .ws-tools__notice { background: var(--ws-soft); border: 0; border-radius: var(--ws-inner-radius); color: var(--ws-ink); padding: 1rem 1.25rem; }
.ws-tools .ws-tools__notice--warning { background: color-mix(in srgb, #f0b849 20%, var(--wp--preset--color--base, #fff)); }
.ws-tools .ws-tools__choice { font-size: 1rem; font-weight: 400; line-height: 1.5; text-transform: none; }
.ws-tools .ws-tools__choice input { accent-color: var(--ws-ink); height: 1.15rem; margin-top: .15em; width: 1.15rem; }
.ws-tools .ws-tools__help { font-size: .875rem; }
.ws-tools .ws-tools__navigation, .ws-tools .ws-tools__actions, .ws-tools .wp-block-buttons { gap: .75rem; }
.ws-tools .ws-tools__lead { background: var(--ws-soft); border: 0; border-radius: var(--ws-card-radius); margin-top: clamp(2rem, 4vw, 3rem); padding: var(--ws-card-padding); }
.ws-tools .ws-tools__lead > h2, .ws-tools .ws-tools__lead > h3 { margin: 0; }
.ws-tools .ws-tools__lead .ws-tools__input, .ws-tools .ws-tools__lead .input { background-color: var(--wp--preset--color--base, #fff); }
@media (max-width: 37.5rem) { .ws-tools .ws-tools__app { border-radius: 24px; } .ws-tools .ws-tools__app::after { border-radius: 0 0 24px 0; height: 28px; width: 28px; } }
.ws-tools__step-title { margin-bottom: .75rem; }
.ws-tools__progress { margin-bottom: 1.5rem; }
.ws-tools__progress progress { appearance: none; background: var(--ws-input-bg, #f7f7f7); border: 0; border-radius: 999px; display: block; height: .6rem; overflow: hidden; }
.ws-tools__progress progress::-webkit-progress-bar { background: var(--ws-input-bg, #f7f7f7); border-radius: 999px; }
.ws-tools__progress progress::-webkit-progress-value { background: var(--ws-accent); border-radius: 999px; }
.ws-tools__progress progress::-moz-progress-bar { background: var(--ws-accent); border-radius: 999px; }
.ws-tools__review-section { border-color: var(--ws-line); border-radius: var(--ws-inner-radius); padding: 1.25rem; }
.ws-tools__review-edit { color: var(--ws-ink); }
.ws-tools--boxed-output .ws-tools__preview { background: var(--ws-form-bg, #fff); border-color: var(--ws-line); border-radius: var(--ws-inner-radius); }
.ws-tools__preview--code { background: var(--ws-ink); border-radius: var(--ws-inner-radius); color: #f9fafb; }
.ws-tools__result > h2 { margin: 0; }
.ws-tools__attribution { background: var(--ws-soft); border: 0; border-radius: var(--ws-inner-radius); }
.ws-tools .ws-tools__field { grid-template-columns: minmax(0, 1fr); }
.ws-tools .ws-tools__help, .ws-tools .ws-tools__example { overflow-wrap: anywhere; }
.ws-tools .ws-tools__intro, .ws-tools .ws-tools__form, .ws-tools .ws-tools__result, .ws-tools .ws-tools__lead, .ws-tools .ws-tools__review, .ws-tools .ws-tools__review-section dl { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 37.5rem) { .ws-tools .ws-tools__review-row, .ws-tools .ws-tools__result dl { grid-template-columns: minmax(0, 1fr); } .ws-tools .ws-tools__review-heading { flex-wrap: wrap; } }
@media (max-width: 37.5rem) { .ws-tools .ws-tools__badges { gap: .5rem; } .ws-tools .ws-tools__badges li { font-size: .9375rem; padding: 11px 18px 12px; } }
/* Kompakteres Formular: am Desktop Bezeichnung + Erklaerung links, Feld rechts. */
.ws-tools .ws-tools__form .ws-tools__field, .ws-tools .ws-tools__lead-form .ws-tools__field { margin-block: .75rem; }
.ws-tools .ws-tools__form .ws-tools__label, .ws-tools .ws-tools__lead-form .ws-tools__label { font-size: 1.05rem; line-height: 1.35; }
@media (min-width: 64rem) {
	.ws-tools .ws-tools__field:has(> .ws-tools__input) { align-items: start; column-gap: 2rem; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); margin-block: .5rem; padding-block: .75rem; }
	.ws-tools .ws-tools__field:has(> .ws-tools__input) + .ws-tools__field:has(> .ws-tools__input) { border-top: 1px solid var(--ws-line); }
	.ws-tools .ws-tools__field:has(> .ws-tools__input) > .ws-tools__label { grid-column: 1; grid-row: 1; padding-top: .6rem; }
	.ws-tools .ws-tools__field:has(> .ws-tools__input) > .ws-tools__help { grid-column: 1; grid-row: 2; }
	.ws-tools .ws-tools__field:has(> .ws-tools__input) > .ws-tools__input { grid-column: 2; grid-row: 1 / span 2; }
	.ws-tools .ws-tools__field:has(> textarea.ws-tools__input) > .ws-tools__input { min-height: 5.5rem; }
}

/* Validierung im Stil der Greyd-Formulare: roter Ring + Hinweis-Symbol, Meldung als Tooltip. */
.ws-tools { --ws-invalid: var(--wp--preset--color--vivid-red, #cf2e2e); }
.ws-tools .ws-tools__field { position: relative; }
.ws-tools [aria-invalid="true"].ws-tools__input, .ws-tools [aria-invalid="true"].input { border-color: var(--ws-invalid) !important; box-shadow: 0 0 0 1px var(--ws-invalid) !important; }
.ws-tools input[aria-invalid="true"].ws-tools__input:not([type="checkbox"]):not([type="radio"]), .ws-tools textarea[aria-invalid="true"].ws-tools__input {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='9' fill='%23cf2e2e'/%3E%3Cpath d='M10 5v6' stroke='%23fff' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='10' cy='14.5' r='1.2' fill='%23fff'/%3E%3C/svg%3E") !important;
	background-position: right .9rem center !important; background-repeat: no-repeat !important; background-size: 1.1rem !important; padding-right: 2.75rem !important;
}
.ws-tools textarea[aria-invalid="true"].ws-tools__input { background-position: right .9rem top .9rem !important; }
.ws-tools [aria-invalid="true"] ~ .ws-tools__choice, .ws-tools .ws-tools__choice:has(> [aria-invalid="true"]) { color: var(--ws-invalid); }
.ws-tools .ws-tools__field > .ws-tools__error, .ws-tools [data-lead-field] > .ws-tools__error {
	background: var(--wp--preset--color--base, #fff); border-radius: 8px; box-shadow: 0 6px 18px rgb(0 0 0 / 14%), 0 0 0 1px rgb(0 0 0 / 6%);
	color: var(--ws-invalid); font-size: .8125rem; font-weight: 600; left: 0; line-height: 1.35; margin: 0; max-width: min(22rem, 100%);
	opacity: 0; padding: .45rem .75rem; pointer-events: none; position: absolute; top: calc(100% - .35rem); transform: translateY(-4px); width: max-content;
	transition: opacity 120ms ease, transform 120ms ease; z-index: 20;
}
.ws-tools .ws-tools__field > .ws-tools__error::before, .ws-tools [data-lead-field] > .ws-tools__error::before {
	border: 7px solid transparent; border-bottom-color: var(--wp--preset--color--base, #fff); content: ""; filter: drop-shadow(0 -1px 0 rgb(0 0 0 / 6%)); left: 1rem; position: absolute; top: -14px;
}
.ws-tools .ws-tools__field:is(:focus-within, :hover) > .ws-tools__error:not(:empty), .ws-tools [data-lead-field]:is(:focus-within, :hover) > .ws-tools__error:not(:empty) { opacity: 1; transform: none; }
.ws-tools .ws-tools__summary-error:not(:empty) { background: color-mix(in srgb, var(--ws-invalid) 8%, var(--wp--preset--color--base, #fff)); border-radius: var(--ws-inner-radius, 18px); color: var(--ws-invalid); font-size: .9rem; padding: .6rem 1rem; }