
/* Webhosting – Artikelgestaltung, freigegebener Entwurf, Helfer 2.1.2.
 * Nur innerhalb .wh-article. Keine globalen table-/h2-/body-Regeln.
 * Für den bestehenden Helfer als Ersatz/Erweiterung von assets/article.css.
 * Zusätzliche Bausteine (Navigation, Hinweise) brauchen passendes HTML.
 * Keine Inhalte werden versteckt, gekürzt oder automatisch verlinkt.
 */
.wh-article.wh-article {
  --wh-ink: #172b43;
  --wh-text: #33445a;
  --wh-muted: #59697c;
  --wh-accent: #0a7068;
  --wh-line: #dce5ec;
  --wh-soft: #f3f7fa;
  --wh-white: #ffffff;
  --wh-radius: 16px;
  --wh-shadow: 0 12px 34px -14px rgba(25, 45, 70, .26), 0 2px 7px rgba(25, 45, 70, .04);
  max-inline-size: 820px;
  min-inline-size: 0;
  margin-inline: auto;
  font-family: inherit;
  font-size: clamp(17px, 1rem + .15vw, 19px);
  line-height: 1.8;
  color: var(--wh-text);
  overflow-wrap: break-word;
  text-align: start;
}
.wh-article, .wh-article.wh-article * { box-sizing: border-box; }
.wh-article.wh-article p { margin-block: 0 1.2em; line-height: inherit; }
.wh-article.wh-article .wh-lead {
  color: var(--wh-ink);
  font-size: clamp(20px, 1.15rem + .3vw, 23px);
  line-height: 1.65;
  font-weight: 400;
  margin-block: 0 1.5em;
}
.wh-article.wh-article h2 {
  color: var(--wh-ink);
  font-family: inherit;
  font-size: clamp(25px, 1.3rem + .6vw, 32px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.018em;
  text-transform: none;
  margin-block: 2.3em .8em;
  scroll-margin-block-start: 120px;
}
.wh-article.wh-article h3 {
  color: var(--wh-ink); font-family: inherit;
  font-size: clamp(21px, 1.1rem + .3vw, 25px);
  font-weight: 650; line-height: 1.4;
  margin-block: 1.5em .65em;
  scroll-margin-block-start: 120px;
}
.wh-article.wh-article strong { color: var(--wh-ink); font-weight: 700; }
.wh-article.wh-article a {
  color: var(--wh-accent); text-decoration: underline;
  text-decoration-thickness: 1px; text-underline-offset: .18em;
}
.wh-article.wh-article a:hover { color: var(--wh-ink); }
.wh-article.wh-article :is(a, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--wh-accent); outline-offset: 4px; border-radius: 4px;
}
.wh-article.wh-article ul, .wh-article.wh-article ol { padding-inline-start: 1.3em; margin-block: 1em 1.4em; }
.wh-article.wh-article li { margin-block: .45em; padding-inline-start: .2em; }
.wh-article.wh-article li::marker { color: var(--wh-accent); }
.wh-article.wh-article :not(pre) > code {
  background: #edf3f6; color: #294760;
  border: 1px solid #dfe8ee; border-radius: 5px;
  padding: .1em .33em;
  font-size: .87em;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  white-space: normal; overflow-wrap: anywhere;
}
/* Leicht abgesetzte Tabellenkarte; echte, zugängliche HTML-Tabelle. */
.wh-article.wh-article .wh-table-scroll {
  max-inline-size: 100%; min-inline-size: 0;
  overflow-x: auto; overscroll-behavior-inline: contain;
  margin-block: 2rem 2.5rem;
  border: 1px solid var(--wh-line);
  border-radius: var(--wh-radius);
  background: var(--wh-white);
  box-shadow: var(--wh-shadow);
  scrollbar-color: #93a6b8 #edf2f6;
}
.wh-article.wh-article table {
  inline-size: 100%; min-inline-size: 640px;
  margin: 0; border: 0; border-collapse: separate; border-spacing: 0;
  background: var(--wh-white); font-size: 16px; line-height: 1.6;
}
.wh-article.wh-article table caption {
  padding: 22px 24px;
  caption-side: top; text-align: start;
  font-size: 19px; line-height: 1.45; font-weight: 700;
  color: var(--wh-ink); background: var(--wh-white);
  border-block-end: 1px solid var(--wh-line);
}
.wh-article.wh-article table :is(th, td) {
  border: 0; padding: 18px 20px; vertical-align: top;
  text-align: start; background: transparent; color: var(--wh-text);
  overflow-wrap: break-word; word-break: normal;
}
.wh-article.wh-article table thead th {
  background: #1b344d; color: #ffffff;
  font-size: 14px; line-height: 1.5; font-weight: 650;
  border-inline-end: 1px solid rgba(255,255,255,.1);
}
.wh-article.wh-article table thead th:last-child { border-inline-end: 0; }
.wh-article.wh-article table tbody tr :is(th, td) { border-block-end: 1px solid #e4ebf0; }
.wh-article.wh-article table tbody tr:nth-child(even) :is(th, td) { background: #f5f8fa; }
.wh-article.wh-article table tbody tr:last-child :is(th, td) { border-block-end: 0; }
.wh-article.wh-article table tbody :is(th[scope="row"], td:first-child) { font-weight: 600; color: var(--wh-ink); }
.wh-article.wh-article table [data-wh-numeric="true"] { text-align: end; font-variant-numeric: tabular-nums; }
@media (hover: hover) { .wh-article.wh-article table tbody tr:hover :is(th,td) { background: #edf6f4; } }
.wh-article.wh-article .wh-table-help { font-size: 14px; color: var(--wh-muted); margin-block: -.9rem 1.5rem; }
/* Optionale, sparsam eingesetzte redaktionelle Hinweisbox. Inhalt bleibt HTML. */
.wh-article.wh-article .wh-callout {
  padding: 22px 26px; margin-block: 2rem;
  border: 1px solid #cee5df; border-inline-start: 4px solid var(--wh-accent);
  border-radius: 12px; background: #f0f8f5;
  box-shadow: 0 7px 23px -16px rgba(16,62,62,.2);
}
.wh-article.wh-article .wh-callout p:last-child { margin-block-end: 0; }
.wh-article.wh-article .wh-callout .wh-callout-title { color: #155c52; font-size: 17px; font-weight: 700; margin-block: 0 .55rem; }
.wh-article.wh-article .wh-callout.wh-callout-warning { background: #fff8ed; border-color: #efdec4; border-inline-start-color: #a5650f; }
.wh-article.wh-article .wh-callout-warning .wh-callout-title { color: #815015; }
/* Optionales Inhaltsverzeichnis, aus echten Abschnittsüberschriften. */
.wh-article.wh-article .wh-toc { padding-block: 18px; margin-block: 1.6rem 2.4rem; border-block: 1px solid var(--wh-line); }
.wh-article.wh-article .wh-toc-title { font-size: 14px; font-weight: 700; color: var(--wh-muted); margin-block-end: 12px; }
.wh-article.wh-article .wh-toc ul { list-style: none; display: flex; flex-wrap: wrap; gap: 9px; padding: 0; margin: 0; }
.wh-article.wh-article .wh-toc li { padding: 0; margin: 0; }
.wh-article.wh-article .wh-toc a { display: block; padding: 7px 13px; background: var(--wh-soft); border-radius: 7px; font-size: 14px; font-weight: 550; text-decoration: none; }
.wh-article.wh-article .wh-toc a:hover { background: #e3f0ec; }
/* Code bleibt kopierbarer Text. Kein neues Highlighting-JavaScript. */
.wh-article.wh-article .wh-code {
  color: #e1edf8; background: #14283d;
  border: 1px solid #243e55; border-radius: 12px;
  padding: 22px 24px; margin-block: 1.4rem 2rem;
  max-inline-size: 100%; min-inline-size: 0; overflow-x: auto;
  white-space: pre; font-size: 14px; line-height: 1.8;
  box-shadow: 0 10px 28px -18px rgba(15,37,58,.65);
  text-align: left; direction: ltr;
}
.wh-article.wh-article .wh-code code { color: inherit; background: transparent; border: 0; padding: 0; font: inherit; white-space: inherit; }
.wh-article.wh-article .wh-code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.wh-article.wh-article .wh-figure { margin: 2.2rem 0; }
.wh-article.wh-article .wh-figure img { display: block; inline-size: 100%; block-size: auto; border-radius: 14px; }
.wh-article.wh-article figcaption { color: var(--wh-muted); font-size: 14px; line-height: 1.6; margin-block: .85rem 0; }
.wh-article.wh-article .wh-chart {
  border: 1px solid var(--wh-line); border-radius: var(--wh-radius);
  padding: 25px; margin: 2rem 0; background: var(--wh-white);
  box-shadow: var(--wh-shadow);
}
.wh-article.wh-article .wh-chart > figcaption { font-size: 19px; font-weight: 700; margin-block: 0 .5rem; color: var(--wh-ink); }
.wh-article.wh-article .wh-chart-unit { font-size: 14px; color: var(--wh-muted); }
.wh-article.wh-article .wh-chart-row { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,2fr) minmax(3em,auto); gap: 14px; align-items: center; margin-block: 14px; font-size: 15px; }
.wh-article.wh-article .wh-chart-track { display: block; height: 16px; background: #e8eff3; border-radius: 5px; overflow: hidden; }
.wh-article.wh-article .wh-chart-bar { display: block; height: 100%; border-radius: 5px; background: #168478; }
.wh-article.wh-article .wh-chart-number { font-variant-numeric: tabular-nums; font-weight: 650; text-align: end; }
.wh-article.wh-article .wh-chart details { overflow-x: auto; }
.wh-article.wh-article summary { cursor: pointer; color: var(--wh-ink); font-size: 15px; font-weight: 600; padding-block: .6rem; }
.wh-article.wh-article .wh-sources {
  margin-block: 3rem 0; padding-block: 1.5rem 0;
  border-block-start: 1px solid var(--wh-line);
  font-size: 14px; color: var(--wh-muted);
}
.wh-article.wh-article .wh-sources h2 { font-size: 20px; margin-block: 0 1rem; }
.wh-article.wh-article .wh-sources p { line-height: 1.65; }
.wh-article.wh-article .wh-sources ul { list-style: none; padding: 0; }
.wh-article.wh-article .wh-sources li { margin-block: .6rem; padding: 0; overflow-wrap: anywhere; }
.wh-article.wh-article .wh-source-url { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .9em; }
@media (max-width: 600px) {
  .wh-article.wh-article { font-size: 17px; line-height: 1.75; }
  .wh-article.wh-article h2 { margin-block-start: 1.9em; }
  .wh-article.wh-article .wh-table-scroll { border-radius: 12px; margin-block: 1.5rem 2rem; }
  .wh-article.wh-article table caption { padding: 18px; font-size: 17px; }
  .wh-article.wh-article table :is(th,td) { padding: 14px 16px; }
  .wh-article.wh-article .wh-callout { padding: 18px; }
  .wh-article.wh-article .wh-chart { padding: 18px; }
  .wh-article.wh-article .wh-chart-row { grid-template-columns: minmax(0,1fr) minmax(0,1.3fr) auto; gap: 8px; font-size: 13px; }
  .wh-article.wh-article .wh-code { padding: 17px; }
}
@media (prefers-reduced-motion: reduce) { .wh-article.wh-article * { scroll-behavior: auto; } }
@media print {
  .wh-article.wh-article { max-inline-size: none; color: #111; font-size: 11pt; }
  .wh-article.wh-article .wh-toc { display: none; }
  .wh-article.wh-article .wh-table-scroll { overflow: visible; box-shadow: none; border-radius: 0; }
  .wh-article.wh-article table { min-inline-size: 0; font-size: 9pt; }
  .wh-article.wh-article table thead th { color: #111; background: #eee; }
  .wh-article.wh-article .wh-callout, .wh-article.wh-article .wh-chart { box-shadow: none; }
  .wh-article.wh-article .wh-code { color: #111; background: #f5f5f5; white-space: pre-wrap; }
}

/* Isolate long chart values and source addresses on narrow/translated layouts. */
.wh-article.wh-article .wh-chart-number { min-inline-size: 0; overflow-wrap: anywhere; }
.wh-article.wh-article .wh-source-url { direction: ltr; unicode-bidi: isolate; }
.wh-article.wh-article .wh-toc a { overflow-wrap: anywhere; }
/* v2.1: article-only controls; no sitewide heading/list changes. */
.wh-article.wh-article .wh-toc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.wh-article.wh-article .wh-toc-grid .wh-toc-link{display:block;padding:12px 15px;border:1px solid var(--wh-line,#dce5ec);border-radius:10px;background:#fff;color:#174a60;text-decoration:none;font-size:15px;line-height:1.45;font-weight:600}
.wh-article.wh-article .wh-toc-grid .wh-toc-link:hover{border-color:var(--wh-accent,#0a7068);background:#eef7f6}
.wh-article.wh-article .wh-toc-grid .wh-toc-link:focus-visible,.wh-article.wh-article .wh-code-copy:focus-visible{outline:3px solid #087d88;outline-offset:3px}
.wh-article.wh-article ul.wh-list{list-style:none!important;padding:0!important;margin:24px 0!important}
.wh-article.wh-article ul.wh-list>li{list-style:none!important;padding:14px 18px;margin:8px 0;background:#f5f8fa;border:1px solid var(--wh-line,#dce5ec);border-radius:10px}
.wh-article.wh-article ul.wh-list>li::before,.wh-article.wh-article ul.wh-list>li::marker{content:none!important}
.wh-article.wh-article ol.wh-list{padding-inline-start:1.5em}
.wh-article.wh-article .wh-code-window{margin:26px 0 32px;border:1px solid #324859;border-radius:14px;overflow:hidden;background:#132a3b;box-shadow:0 9px 25px rgba(15,35,55,.10)}
.wh-article.wh-article .wh-code-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;justify-content:space-between;padding:11px 16px;background:#223e50;color:#edf5fa;font:600 13px/1.5 system-ui,sans-serif}
.wh-article.wh-article .wh-code-window pre.wh-code{margin:0!important;border:none!important;border-radius:0!important;box-shadow:none!important;padding:20px!important;color:#edf5fa;background:#132a3b;white-space:pre;overflow:auto;tab-size:4}
.wh-article.wh-article .wh-code-window pre.wh-code code{color:inherit!important;background:none!important;white-space:pre;font:14px/1.75 ui-monospace,monospace;padding:0!important}
.wh-article.wh-article .wh-code-copy{padding:6px 11px;border:1px solid #7893a1;border-radius:6px;background:transparent;color:#fff;font:600 12px/1.5 system-ui;cursor:pointer;text-transform:none}
.wh-article.wh-article .wh-code-copy[hidden]{display:none!important}
.wh-article.wh-article .wh-copy-status{font-weight:400}
.wh-article.wh-article .wh-source-urls p{margin:8px 0;font-size:13px;overflow-wrap:anywhere}
@media(max-width:600px){.wh-article.wh-article .wh-toc-grid{grid-template-columns:1fr}.wh-article.wh-article .wh-code-window pre.wh-code{padding:14px!important}}

/* 2.1.2: editorial rhythm, complete image units, front-end and editor iframe. */
.wh-article.wh-article .wh-section { display:block; margin-block:0 2.1rem; min-width:0; }
.wh-article.wh-article .wh-section > h2:first-child { margin-block-start:1.8rem; }
.wh-article.wh-article p { font-size:inherit; line-height:1.8; text-wrap:pretty; }
.wh-article.wh-article p.wh-lead { font-size:20px; line-height:1.7; }
.wh-article.wh-article .wh-toc { border:1px solid #d9e4e8; padding:22px; border-radius:14px; background:#f4f8f8; }
.wh-article.wh-article .wh-toc-title { font-size:13px; line-height:1.4; letter-spacing:.08em; font-weight:700; color:#49656b; margin:0 0 14px; }
.wh-article.wh-article .wh-toc-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:10px; }
.wh-article.wh-article .wh-toc-item { display:block; min-width:0; }
.wh-article.wh-article .wh-toc-link { box-sizing:border-box; height:100%; font-size:14px; line-height:1.5; }
.wh-article.wh-article .wh-figure { display:block; float:none!important; clear:both; width:100%; max-width:760px; margin:34px auto 40px; border:1px solid #dae5e9; border-radius:14px; overflow:hidden; background:#f5f8fa; box-shadow:0 10px 28px -17px rgba(24,47,60,.28); }
.wh-article.wh-article .wh-figure-media { display:block; background:#eef3f5; line-height:0; }
.wh-article.wh-article .wh-figure img { display:block; float:none!important; width:100%; max-width:100%; height:auto!important; margin:0; border-radius:0; object-fit:contain; }
.wh-article.wh-article figure.wh-figure figcaption { display:block; margin:0!important; padding:12px 18px 15px; border-top:1px solid #dce5e9; color:#506575; background:#f5f8fa; font-size:14px!important; line-height:1.55!important; text-align:start; }
.wh-article.wh-article .wh-sources h2 { font-size:20px; margin:0 0 14px; }
.wh-article.wh-article .wh-sources p { font-size:14px; line-height:1.65; }
.wh-article.wh-article .wh-source-urls p { font-size:12px; }
.wh-article.wh-article .wh-table-scroll table { width:100%; min-width:580px; font-size:15px; }
.wh-article.wh-article .wh-table-scroll th,.wh-article.wh-article .wh-table-scroll td { padding:15px 18px; font-size:15px; }
.wh-article.wh-article table caption { font-size:17px; padding:20px; }
.wh-article.wh-article .wh-table-scroll thead code { color:inherit; background:transparent; }
.wh-article.wh-article .wh-code-toolbar [hidden] { display:none!important; }
.wh-article.wh-article .wh-code-window { min-width:0; }
.wh-article.wh-article .wh-chart-title { font-size:18px; padding:0; border:0; background:transparent; }
@media(max-width:600px) { .wh-article.wh-article .wh-toc { padding:16px; } .wh-article.wh-article p.wh-lead { font-size:19px; } }
@media print { .wh-article.wh-article .wh-toc { display:none!important; } .wh-article.wh-article .wh-figure { break-inside:avoid; box-shadow:none!important; } }

/*# sourceURL=wh-make-article-inline-css */
