.ninagrafie-tests{max-width:1240px;margin:34px auto 70px;padding:0 22px;color:#292b26}.ninagrafie-tests__intro{display:flex;justify-content:space-between;gap:30px;align-items:flex-end;margin-bottom:24px}.ninagrafie-tests__eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:#6c735f}.ninagrafie-tests h1{margin:4px 0 8px;font-size:34px}.ninagrafie-tests__intro p{max-width:760px;margin:0;color:#666}.ninagrafie-tests__tools{display:flex;gap:8px;flex-wrap:wrap}.ninagrafie-tests__tools a,.ninagrafie-tests__tools span,.ninagrafie-tests__jump a{border:1px solid #d8d5cb;border-radius:999px;padding:8px 13px;text-decoration:none;color:#41453a;background:#fff;font-size:13px}.ninagrafie-tests__tools .is-active{background:#59634c;color:#fff;border-color:#59634c}.ninagrafie-tests__tools .is-disabled{opacity:.48}.ninagrafie-tests__kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:22px 0}.ninagrafie-tests__kpis>div{background:#f5f2e9;border:1px solid #e5e0d4;border-radius:10px;padding:18px}.ninagrafie-tests__kpis strong{display:block;font-size:28px;line-height:1}.ninagrafie-tests__kpis span{display:block;margin-top:8px;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#777}.ninagrafie-tests__jump{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 34px}.ninagrafie-tests__section{scroll-margin-top:30px;margin:0 0 48px}.ninagrafie-tests__section-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d9d5ca;margin-bottom:18px;padding-bottom:9px}.ninagrafie-tests__section-head h2{margin:0}.ninagrafie-tests__section-head span{font-size:12px;color:#888;letter-spacing:.12em}.ninagrafie-tests__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.ninagrafie-test-card{border:1px solid #ddd9cf;border-radius:12px;background:#fff;padding:18px;min-width:0}.ninagrafie-test-card>header{display:flex;gap:10px;align-items:center}.ninagrafie-test-card h3{font-size:17px;margin:0}.ninagrafie-test-card__badge{font-size:10px;font-weight:800;letter-spacing:.08em;border-radius:999px;padding:5px 8px;background:#eceae3}.ninagrafie-test-card--green .ninagrafie-test-card__badge{background:#e8efe5;color:#40513b}.ninagrafie-test-card--red .ninagrafie-test-card__badge{background:#f4e5e4;color:#7b3e3a}.ninagrafie-test-card--empty .ninagrafie-test-card__badge{background:#ece9df;color:#686354}.ninagrafie-test-card__expect{font-size:13px;color:#666;margin:12px 0}.ninagrafie-test-card__code{margin:10px 0 16px}.ninagrafie-test-card__code summary{cursor:pointer;font-size:12px;font-weight:700}.ninagrafie-test-card__code pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#f4f2ed;padding:12px;border-radius:7px;font-size:11px}.ninagrafie-test-card__output{border-top:1px dashed #d7d3c8;padding-top:14px;display:flow-root}.ninagrafie-test-card__output-label{text-transform:uppercase;letter-spacing:.09em;font-size:10px;font-weight:800;color:#888;margin-bottom:12px}.ninagrafie-test-card__no-output{border:1px dashed #ccc6b8;background:#faf8f3;padding:16px;border-radius:8px;color:#777;font-size:13px}.ninagrafie-test-card__output:after{content:"";display:block;clear:both}
@media(max-width:900px){.ninagrafie-tests__intro{align-items:flex-start;flex-direction:column}.ninagrafie-tests__kpis{grid-template-columns:repeat(3,1fr)}.ninagrafie-tests__grid{grid-template-columns:1fr}}
@media(max-width:560px){.ninagrafie-tests{padding:0 14px}.ninagrafie-tests__kpis{grid-template-columns:repeat(2,1fr)}.ninagrafie-tests__kpis>div:first-child{grid-column:1/-1}.ninagrafie-tests h1{font-size:28px}.ninagrafie-test-card{padding:14px}}
/* E1.2 */
.ninagrafie-tests__kpis{grid-template-columns:repeat(6,1fr)}
.ninagrafie-test-card--manual .ninagrafie-test-card__badge{background:#e7e2d5;color:#655f50}
.ninagrafie-test-card--edge .ninagrafie-test-card__badge{background:#f2e8d7;color:#7b5b2d}
.ninagrafie-test-card__note{margin:10px 0;padding:10px 12px;border-left:3px solid #c7b88e;background:#faf8f2;color:#625e54;font-size:12px}
.ninagrafie-test-card__manual{border:1px dashed #c9c0aa;background:#faf8f2;padding:16px;border-radius:8px;color:#6c6556;font-size:13px}
@media(max-width:900px){.ninagrafie-tests__kpis{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.ninagrafie-tests__kpis{grid-template-columns:repeat(2,1fr)}}
/* dev.20 – konfigurierbare QA-Testdaten */
.ninagrafie-tests__testdata{margin:22px 0 28px;border:1px solid #ddd9cf;border-radius:12px;background:#fff;padding:16px 18px}.ninagrafie-tests__testdata>summary{cursor:pointer;font-weight:700;color:#59634c}.ninagrafie-tests__testdata-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;margin:18px 0}.ninagrafie-tests__testdata-grid label{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:700}.ninagrafie-tests__testdata-grid input{min-height:40px;border:1px solid #d8d5cb;border-radius:7px;padding:7px 10px}.ninagrafie-tests__testdata-grid small{font-weight:400}.ninagrafie-tests__testdata-grid small.is-valid{color:#40513b}.ninagrafie-tests__testdata-grid small.is-invalid{color:#7b3e3a}.ninagrafie-tests__testdata-grid small.is-empty{color:#777}.ninagrafie-tests__testdata button{border:1px solid #59634c;border-radius:999px;background:#59634c;color:#fff;padding:9px 16px;font-weight:700}.ninagrafie-tests__saved{background:#e8efe5;padding:9px 12px;border-radius:7px}@media(max-width:760px){.ninagrafie-tests__testdata-grid{grid-template-columns:1fr}.ninagrafie-tests__section-head{align-items:flex-start;gap:8px;flex-direction:column}.ninagrafie-tests__section-head span{letter-spacing:0}}

/* dev.21 – Content-Zentrale Aktionsfarbe vereinheitlicht. */
.ninagrafie-tests__testdata button{border-color:#7f2435;background:#7f2435;color:#fff}
.ninagrafie-tests__testdata button:hover,.ninagrafie-tests__testdata button:focus{background:#681d2b;border-color:#681d2b;color:#fff}

/* dev.4.49 – breite Regressionstests für Grids, Floats, Carousels und Kalender */
.ninagrafie-test-card--wide{grid-column:1/-1}
/* dev.4.50 · Komponenten-Audit + kompaktere interne Discovery-Carousels */
.ninagrafie-tests__audit{margin:18px 0 24px;border:1px solid #ddd9cf;border-radius:12px;background:#fff;padding:14px 16px}.ninagrafie-tests__audit summary{cursor:pointer;font-weight:700}.ninagrafie-tests__audit>p{color:#666;font-size:13px}.ninagrafie-tests__audit-table{display:grid;gap:0;border:1px solid #e5e0d4;border-radius:9px;overflow:hidden}.ninagrafie-tests__audit-table>div{display:grid;grid-template-columns:minmax(180px,2fr) repeat(4,minmax(80px,1fr));gap:10px;padding:9px 12px;border-top:1px solid #eee9df;align-items:center}.ninagrafie-tests__audit-table>div:first-child{border-top:0}.ninagrafie-tests__audit-table .is-head{background:#f5f2e9;font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:700}.ninagrafie-tests .ninagrafie-discovery-carousel .ninagrafie-card-image img{max-height:280px;object-fit:cover}.ninagrafie-tests .ninagrafie-discovery-carousel .ninagrafie-card-image{max-height:280px;overflow:hidden}@media(max-width:700px){.ninagrafie-tests__audit-table{overflow-x:auto}.ninagrafie-tests__audit-table>div{min-width:620px}.ninagrafie-tests .ninagrafie-discovery-carousel .ninagrafie-card-image,.ninagrafie-tests .ninagrafie-discovery-carousel .ninagrafie-card-image img{max-height:220px}}

/* V1.7 QA consolidation: lightweight result recording and on-demand previews. */
.ninagrafie-qa-results{padding:1rem;margin:1rem 0;border:1px solid #d6d4cc;border-radius:8px;background:#faf9f5}
.ninagrafie-qa-results button{margin:.35rem .5rem .35rem 0}
.ninagrafie-test-card__assessment{margin:.5rem 0}.ninagrafie-test-card__assessment label{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.ninagrafie-qa-load{margin:.5rem 0}.ninagrafie-test-card [data-qa-rendered]:not(:empty){margin-top:.7rem}

/* dev.28.8: grouped on-demand visual QA, optional manual evaluation. */
.ninagrafie-tests__section{border:1px solid #d9d5ca;border-radius:12px;padding:0 16px;margin:12px 0;background:#fff}
.ninagrafie-tests__section>.ninagrafie-tests__section-head{cursor:pointer;display:flex;gap:12px;align-items:center;justify-content:space-between;margin:0;padding:16px 0;border:0;list-style-position:inside}
.ninagrafie-tests__section>.ninagrafie-tests__section-head strong{font-size:18px}
.ninagrafie-tests__section[open]>.ninagrafie-tests__section-head{border-bottom:1px solid #d9d5ca;margin-bottom:16px}
.ninagrafie-tests__section>.ninagrafie-tests__grid{padding-bottom:16px}
.ninagrafie-test-card__assessment{border:0;padding:0;margin:12px 0}
.ninagrafie-test-card__assessment>summary{cursor:pointer;font-size:12px;font-weight:600;color:#555}
.ninagrafie-test-card__assessment label{padding:10px 0}
.ninagrafie-qa-results [data-qa-static-details]{max-height:220px;overflow:auto;font-size:12px}
.ninagrafie-qa-results [data-qa-static-details][hidden]{display:none}

/* dev.28.10 – integrated QA overview and contextual result badges */
.ninagrafie-qa-results{background:#fff;border:1px solid #c6ad90;border-radius:12px;padding:20px;margin:24px 0}
.ninagrafie-qa-results__head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.ninagrafie-qa-results__head h2{font-size:20px;margin:0 0 6px;color:#7f2435}
.ninagrafie-qa-results__head p{margin:0;color:#666;font-size:13px}
.ninagrafie-qa-results__head [data-qa-progress]{font-size:12px;color:#666}
.ninagrafie-qa-results__actions{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 12px}
.ninagrafie-qa-results__actions button{border:1px solid #b78e6e;border-radius:999px;background:#fff;color:#7f2435;padding:9px 14px;cursor:pointer;font-weight:600}
.ninagrafie-qa-results__actions button:hover{background:#f6f1eb}
.ninagrafie-qa-results__status{display:flex;flex-wrap:wrap;gap:12px 28px;font-size:13px}
.ninagrafie-qa-results__status p{margin:4px 0}
.ninagrafie-qa-results__details{margin-top:14px;border-top:1px solid #eee5da;padding-top:12px;font-size:12px}
.ninagrafie-qa-results__details>summary{cursor:pointer;color:#7f2435;font-weight:600}
.ninagrafie-test-card>header{flex-wrap:wrap}
.ninagrafie-test-card__qa-state{margin-left:auto;border-radius:999px;padding:5px 9px;background:#f1eee9;color:#666;font-size:11px;white-space:nowrap}
.ninagrafie-test-card__qa-state[data-state=passed]{background:#e8efe5;color:#40513b}
.ninagrafie-test-card__qa-state[data-state=failed]{background:#f4e5e4;color:#7b3e3a}
.ninagrafie-test-card__qa-state[data-state=review]{background:#f2e8d7;color:#7b5b2d}
.ninagrafie-test-card__qa-state[data-state=excluded]{background:#f4f2ed;color:#777}
@media(max-width:700px){.ninagrafie-qa-results__head{flex-direction:column}.ninagrafie-qa-results__status{display:block}}

/* V1.8.0-dev.11: unified QA header and diagnostics; existing test cards intentionally unchanged. */
.ninagrafie-tests{--qa-border:#decbb8;--qa-ink:#70283d;--qa-muted:#746e6b;--qa-soft:#f8f5f0}
.ninagrafie-tests__kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:16px 0 20px}
.ninagrafie-tests__kpis>div{padding:12px 13px;background:var(--qa-soft);border:1px solid #eee4d8;border-radius:9px}
.ninagrafie-tests__kpis strong{font-size:23px;color:var(--qa-ink)}
.ninagrafie-tests__kpis span{font-size:10px;letter-spacing:.04em;margin-top:5px}
.ninagrafie-qa-results{margin:14px 0 12px;padding:18px 20px;background:#fff;border:1px solid var(--qa-border);border-radius:12px}
.ninagrafie-qa-results__head h2{font-size:18px;letter-spacing:0;text-transform:none}
.ninagrafie-qa-results__actions{margin:12px 0 6px}
.ninagrafie-qa-results__actions button{margin:0}
.ninagrafie-qa-results__status{gap:10px 22px}
.ninagrafie-tests__diagnostics{margin:12px 0 24px;border:1px solid var(--qa-border);border-radius:11px;background:#fff;overflow:hidden}
.ninagrafie-tests__diagnostics>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;padding:15px 18px;color:var(--qa-ink);font-size:14px;font-weight:700}
.ninagrafie-tests__diagnostics>summary small{color:var(--qa-muted);font-size:12px;font-weight:400}
.ninagrafie-tests__diagnostics[open]>summary{border-bottom:1px solid #eee4d8}
.ninagrafie-tests__diagnostics-body{padding:6px 18px 18px}
.ninagrafie-tests__diagnostics .ninagrafie-tests__testdata,.ninagrafie-tests__diagnostics .ninagrafie-tests__audit,.ninagrafie-tests__diagnostics .ninagrafie-qa-shortcode-coverage{margin:8px 0;border:0;border-bottom:1px solid #eee4d8;border-radius:0;padding:0;background:transparent}
.ninagrafie-tests__diagnostics .ninagrafie-tests__testdata>summary,.ninagrafie-tests__diagnostics .ninagrafie-tests__audit>summary,.ninagrafie-tests__diagnostics .ninagrafie-qa-shortcode-coverage summary{padding:12px 4px;cursor:pointer;font-weight:600;color:var(--qa-ink)}
.ninagrafie-tests__diagnostics .ninagrafie-tests__testdata[open],.ninagrafie-tests__diagnostics .ninagrafie-tests__audit[open],.ninagrafie-tests__diagnostics .ninagrafie-qa-shortcode-coverage details[open]{padding-bottom:16px}
.ninagrafie-tests__diagnostics .ninagrafie-qa-shortcode-coverage__scroll{overflow-x:auto;max-height:440px;overflow-y:auto}
.ninagrafie-tests__diagnostics .ninagrafie-qa-shortcode-coverage table{width:100%;border-collapse:collapse;font-size:12px}
.ninagrafie-tests__diagnostics .ninagrafie-qa-shortcode-coverage th,.ninagrafie-tests__diagnostics .ninagrafie-qa-shortcode-coverage td{text-align:left;vertical-align:top;padding:9px;border-bottom:1px solid #eee4d8}
.ninagrafie-tests__diagnostics .ninagrafie-qa-shortcode-coverage th{background:var(--qa-soft)}
.ninagrafie-tests__catalog-head{display:flex;justify-content:space-between;align-items:end;gap:18px;padding:8px 0 14px;border-bottom:1px solid #eee4d8;margin:18px 0 14px}
.ninagrafie-tests__catalog-head h2{margin:0 0 4px;color:var(--qa-ink);font-size:21px}
.ninagrafie-tests__catalog-head p{margin:0;font-size:13px;color:var(--qa-muted)}
.ninagrafie-tests__catalog-head label{display:flex;flex-direction:column;gap:5px;min-width:260px;font-size:12px;color:var(--qa-muted)}
.ninagrafie-tests__catalog-head select{width:100%;max-width:340px;padding:9px 12px;border:1px solid var(--qa-border);border-radius:8px;background:#fff;color:#34302e;font-size:13px}
.ninagrafie-tests__section{scroll-margin-top:24px}
@media(max-width:960px){.ninagrafie-tests__kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.ninagrafie-tests__kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.ninagrafie-tests__catalog-head{align-items:stretch;flex-direction:column}.ninagrafie-tests__catalog-head label{min-width:0}.ninagrafie-tests__diagnostics>summary{align-items:flex-start;flex-direction:column}}
