/* ===================== Prüfbericht der Header-/Test-Mail-Analyse mit Stempel (seit 1.0.56) – Portal und Website ===================== */
.ms24r { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 22px; padding: clamp(22px, 4vw, 40px) clamp(18px, 4vw, 44px); border-radius: 6px; background: #FFFFFF; color: #0E171C; font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif; text-align: left; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.30); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.ms24r * { box-sizing: border-box; }
.ms24r__kopf { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 16px; padding-bottom: 18px; border-bottom: 2px solid #0E171C; }
.ms24r__marke { display: block; font: 700 12px/1.4 "JetBrains Mono", ui-monospace, Consolas, monospace; letter-spacing: 0.12em; text-transform: uppercase; color: #45525B; }
.ms24r__titel { display: block; font-size: clamp(22px, 3vw, 28px); line-height: 1.2; font-weight: 900; letter-spacing: -0.02em; color: #0E171C; }
.ms24r__meta { display: flex; flex-direction: column; gap: 2px; font: 13px/1.5 "JetBrains Mono", ui-monospace, Consolas, monospace; color: #45525B; text-align: right; }
.ms24r__eck { display: grid; grid-template-columns: max-content 1fr; gap: 8px 22px; margin: 0; max-width: calc(100% - 200px); font-size: 15px; }
.ms24r__eck dt { margin: 0; color: #45525B; }
.ms24r__eck dd { margin: 0; font-weight: 600; color: #0E171C; overflow-wrap: anywhere; }
.ms24r__mono { font-family: "JetBrains Mono", ui-monospace, Consolas, monospace; }
.ms24r .ms24r__rot { color: #A80006; }
.ms24r .ms24r__gruen { color: #0B5E3C; }
.ms24r__punkte { display: flex; flex-direction: column; }
.ms24r__punkt { display: grid; grid-template-columns: 34px 110px 1fr; gap: 12px; align-items: start; padding: 14px 0; border-top: 1px solid #E2E6E9; }
.ms24r__punkt:last-child { border-bottom: 1px solid #E2E6E9; }
.ms24r__punkt strong { padding-top: 4px; font-size: 16px; color: #0E171C; }
.ms24r__punkt .t { padding-top: 4px; font-size: 15px; line-height: 1.55; color: #0E171C; overflow-wrap: anywhere; }
.ms24r__ico { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px; font: 800 15px/1 Inter, system-ui, sans-serif; color: #FFFFFF; }
.ms24r__ico.is-ok { background: #0E7A4F; }
.ms24r__ico.is-fail { background: #DE060E; }
.ms24r__ico.is-warn { background: #E5A000; color: #0E171C; }
.ms24r__ico.is-muted { background: #8A97A1; }
.ms24r__h { margin: 0 0 8px; font-size: 15px; font-weight: 700; color: #0E171C; }
.ms24r__hinweise { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 6px; font-size: 14px; line-height: 1.55; color: #2A353C; }
.ms24r__weg { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; font: 13px/1.5 "JetBrains Mono", ui-monospace, Consolas, monospace; color: #0E171C; overflow-wrap: anywhere; }
.ms24r__weg .n { margin-right: 10px; color: #8A97A1; }
.ms24r__aktionen { display: flex; flex-wrap: wrap; gap: 10px; }
.ms24r__knopf { display: inline-flex; align-items: center; min-height: 46px; padding: 0 20px; border: 0; border-radius: 10px; background: #0E171C; color: #FFFFFF !important; font: 700 15px Inter, system-ui, sans-serif; text-decoration: none !important; cursor: pointer; }
.ms24r__knopf:hover { background: #24323D; }
.ms24r__knopf:focus-visible { outline: 3px solid #DE060E; outline-offset: 2px; }
.ms24r__knopf--zweit { background: #FFFFFF; color: #0E171C !important; border: 1px solid #C9D1D7; }
.ms24r__knopf--zweit:hover { background: #F4F5F6; }
.ms24r__stempel { position: absolute; top: 92px; right: 32px; z-index: 1; opacity: 0.93; mix-blend-mode: multiply; pointer-events: none; }
.ms24r__stempel--eckig { padding: 5px; border: 4px solid currentColor; border-radius: 12px; transform: rotate(-9deg); }
.ms24r__stempel--eckig > div { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 16px; border: 2px solid currentColor; border-radius: 7px; }
.ms24r__stempel--eckig b { font: 900 26px/1 Inter, system-ui, sans-serif; letter-spacing: 0.14em; }
.ms24r__stempel--eckig small { font: 700 10px/1.3 "JetBrains Mono", ui-monospace, monospace; letter-spacing: 0.18em; }
.ms24r__stempel.is-fail { color: #DE060E; }
.ms24r__stempel.is-unklar { color: #5B6872; }
.ms24r__stempel.is-gut { color: #0E7A4F; transform: rotate(-14deg); top: 80px; }
.ms24r__stempel svg { display: block; }
.ms24r.ist-neu { animation: ms24rDruck 0.9s ease-out 0.35s both; }
.ms24r.ist-neu .ms24r__stempel--eckig { animation: ms24rStempelE 1.1s cubic-bezier(0.2, 0.8, 0.2, 1) 0.25s both; }
.ms24r.ist-neu .ms24r__stempel.is-gut { animation: ms24rStempelR 1.1s cubic-bezier(0.2, 0.8, 0.2, 1) 0.25s both; }
@keyframes ms24rStempelE { 0% { opacity: 0; transform: rotate(-9deg) scale(2.6); } 55% { opacity: 1; transform: rotate(-9deg) scale(0.9); } 75% { transform: rotate(-9deg) scale(1.05); } 100% { opacity: 0.93; transform: rotate(-9deg) scale(1); } }
@keyframes ms24rStempelR { 0% { opacity: 0; transform: rotate(-14deg) scale(2.6); } 55% { opacity: 1; transform: rotate(-14deg) scale(0.9); } 75% { transform: rotate(-14deg) scale(1.05); } 100% { opacity: 0.93; transform: rotate(-14deg) scale(1); } }
@keyframes ms24rDruck { 0%, 50% { transform: none; } 58% { transform: translateY(4px) scale(0.996); } 75%, 100% { transform: none; } }
@media (prefers-reduced-motion: reduce) { .ms24r.ist-neu, .ms24r.ist-neu .ms24r__stempel { animation: none !important; } }
@media (max-width: 640px) { .ms24r__stempel { position: static; align-self: flex-end; margin: -8px 0 -8px; } .ms24r__eck { max-width: 100%; } .ms24r__punkt { grid-template-columns: 30px 1fr; } .ms24r__punkt .t { grid-column: 2; padding-top: 0; } .ms24r__meta { text-align: left; } }
@media print {
	@page { margin: 14mm; }
	body * { visibility: hidden !important; }
	.ms24r, .ms24r * { visibility: visible !important; }
	.ms24r { position: absolute; left: 0; top: 0; width: 100%; padding: 0; border-radius: 0; box-shadow: none; animation: none !important; }
	.ms24r__stempel { animation: none !important; opacity: 0.9; }
	.ms24r__aktionen { display: none !important; }
}
.ms24r-druckbox { display: none; }
@media print {
	html.ms24r-druck body > *:not(.ms24r-druckbox) { display: none !important; }
	html.ms24r-druck body { margin: 0 !important; padding: 0 !important; background: #FFFFFF !important; }
	html.ms24r-druck .ms24r-druckbox { display: block !important; visibility: visible !important; }
	html.ms24r-druck .ms24r-druckbox .ms24r { position: static !important; }
}
/* Druckfarben des Berichts sichern: Themes setzen beim Drucken oft * { color: #000 !important; background: transparent !important }. */
@media print {
	.ms24r, html.ms24r-druck .ms24r { background: #FFFFFF !important; color: #0E171C !important; }
	.ms24r .ms24r__titel, .ms24r .ms24r__eck dd, .ms24r .ms24r__punkt strong, .ms24r .ms24r__punkt .t, .ms24r .ms24r__h, .ms24r .ms24r__weg { color: #0E171C !important; }
	.ms24r .ms24r__marke, .ms24r .ms24r__meta, .ms24r .ms24r__meta span, .ms24r .ms24r__eck dt { color: #45525B !important; }
	.ms24r .ms24r__hinweise, .ms24r .ms24r__hinweise li { color: #2A353C !important; }
	.ms24r .ms24r__weg .n { color: #8A97A1 !important; }
	.ms24r .ms24r__rot, .ms24r .ms24r__eck dd.ms24r__rot { color: #A80006 !important; }
	.ms24r .ms24r__gruen, .ms24r .ms24r__eck dd.ms24r__gruen { color: #0B5E3C !important; }
	.ms24r .ms24r__ico.is-ok { background: #0E7A4F !important; color: #FFFFFF !important; }
	.ms24r .ms24r__ico.is-fail { background: #DE060E !important; color: #FFFFFF !important; }
	.ms24r .ms24r__ico.is-warn { background: #E5A000 !important; color: #0E171C !important; }
	.ms24r .ms24r__ico.is-muted { background: #8A97A1 !important; color: #FFFFFF !important; }
	.ms24r .ms24r__stempel.is-gut { color: #0E7A4F !important; }
	.ms24r .ms24r__stempel.is-fail { color: #DE060E !important; }
	.ms24r .ms24r__stempel.is-unklar { color: #5B6872 !important; }
	.ms24r .ms24r__stempel *, .ms24r .ms24r__stempel svg * { color: inherit !important; }
	.ms24r .ms24r__kopf { border-bottom-color: #0E171C !important; }
	.ms24r a[href]::after { content: none !important; }
}