/* Todesseite + Erbe-Seite – baut auf register.css auf (gleiche Token, gleiche Bausteine). Ruhiger, dunkler Kopf für Verstorbene. */

.blatt.trauer .blatt-kopf { background: var(--druck); color: #eceef1; border-bottom-color: var(--druck); }
.blatt.trauer .blatt-kopf-innen { grid-template-columns: minmax(0, 1fr); }
.blatt.trauer .regnr, .blatt.trauer .regnr a { color: #aab0b9; }
.blatt.trauer h1 { color: #fff; }
.blatt.trauer .blatt-zusatz { color: #d3d6db; margin-bottom: .8rem; }
.blatt.trauer .avatar.gross { box-shadow: 0 0 0 4px var(--druck), 0 0 0 7px #8a9099; filter: grayscale(.35); }
.blatt.trauer .ki-hinweis { color: #8f96a0; }
.lebensdaten { margin: .5rem 0 .6rem; font-size: var(--t-m); font-stretch: 108%; color: #c9cdd3; font-variant-numeric: tabular-nums; }

.tf-zahlen { max-width: var(--breite); margin: 0 auto; border-left: 0; border-right: 0; border-top: 0; }
.blatt .tf-zahlen { margin: 0 auto; padding: 0 var(--rand); background: transparent; border: 0; gap: 0; }
.blatt .tf-zahlen div { border-bottom: 1px solid var(--linie); border-right: 1px solid var(--linie); }
.blatt .tf-zahlen div:last-child { border-right: 0; }

.tf-diagramm { overflow-x: auto; }
.lebenslinie { width: 100%; min-width: 560px; height: auto; display: block; }
.ll-rahmen { position: relative; color: var(--tinte); }
.ll-g { stroke: var(--linie); stroke-width: 1; stroke-dasharray: 2 4; }
.ll-achse { stroke: var(--druck); stroke-width: 1.5; }
.ll-vor { fill: var(--papier); stroke: var(--linie); stroke-dasharray: 3 4; }
.ll-bruch { stroke: var(--druck); stroke-width: 1.5; fill: none; }
.ll-tod { stroke: var(--druck); stroke-width: 1; stroke-dasharray: 4 3; }
.ll-kreuz { stroke: var(--druck); stroke-width: 1; }
.ll-marke { fill: var(--blatt); stroke: var(--tinte); stroke-width: 3; pointer-events: none; }
.ll-flaeche { fill: transparent; cursor: crosshair; }
.ll-tip { position: absolute; pointer-events: none; background: var(--druck); color: #fff; padding: .4rem .6rem; font-size: var(--t-xs); display: grid; gap: .05rem; white-space: nowrap; box-shadow: 0 6px 18px rgba(16,19,24,.25); }
.ll-tip[hidden] { display: none; }
.ll-tip b { font-size: var(--t-s); } .ll-tip span { font-weight: 700; font-size: var(--t-m); } .ll-tip small { color: #b9bec6; }
.ll-a { font-family: var(--sans); font-size: 12px; fill: var(--text-3); }
.ll-f { fill: url(#ll-verlauf); }
.ll-k { fill: none; stroke: var(--tinte); stroke-width: 2.5; stroke-linejoin: round; }
.ll-e { fill: var(--tinte); }
.ll-w { font-family: var(--sans); font-size: 13px; font-weight: 700; fill: var(--text); }
.ll-p { cursor: pointer; outline: none; }
.ll-p line { stroke: var(--signal); stroke-width: 1.5; opacity: 0; transition: opacity var(--d2); }
.ll-p circle { fill: var(--blatt); stroke: var(--druck); stroke-width: 1.5; transition: fill var(--d2); }
.ll-p text { font-family: var(--sans); font-size: 11px; font-weight: 700; fill: var(--text); pointer-events: none; }
.ll-p.aktiv line { opacity: .8; } .ll-p.aktiv circle { fill: var(--signal); stroke: var(--signal); } .ll-p.aktiv text { fill: #fff; }
.tf-stationen { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .45rem; font-size: var(--t-s); }
.tf-stationen li { display: grid; grid-template-columns: 1.6rem 3.2rem minmax(0, 1fr); gap: .5rem; align-items: baseline; padding: .35rem .5rem; margin: 0 -.5rem; cursor: default; transition: background var(--d2); outline: none; }
.tf-stationen li.aktiv, .tf-stationen li:focus-visible { background: var(--blatt); box-shadow: inset 3px 0 0 var(--signal); }
.tf-stationen li.aktiv .nr { background: var(--signal); border-color: var(--signal); color: #fff; }
.tf-stationen .nr { display: inline-grid; place-items: center; width: 1.35rem; height: 1.35rem; border: 1.5px solid var(--druck); border-radius: 50%; font-size: .75rem; font-weight: 700; }
.tf-stationen b { color: var(--tinte); font-variant-numeric: tabular-nums; }

.tf-tabelle { width: 100%; border-collapse: collapse; font-size: var(--t-s); min-width: 520px; }
.tf-tabelle th { text-align: left; font-size: var(--t-xs); color: var(--text-2); font-weight: 600; padding: .5rem .6rem; border-bottom: 2px solid var(--druck); }
.tf-tabelle td { padding: .65rem .6rem; border-bottom: 1px solid var(--linie); vertical-align: top; }
.tf-offen { color: var(--text-2); font-style: italic; }
.tf-status { font-size: var(--t-xs); color: var(--text-2); white-space: nowrap; }
.tf-status::before { content: ""; display: inline-block; width: .5rem; height: .5rem; border-radius: 50%; margin-right: .35rem; vertical-align: 1px; background: var(--text-3); }
.tf-status.auf::before { background: var(--auf); } .tf-status.tinte::before { background: var(--tinte); }

.tf-baum { overflow-x: auto; background: var(--blatt); border: 1px solid var(--linie); padding: .5rem; }
.sb-ausschnitt { width: 100%; min-width: 560px; height: auto; display: block; }
.sb-k { fill: var(--blatt); stroke: var(--druck); stroke-width: 1.5; }
.sb-k.tot { stroke-dasharray: 3 3; }
.sb-k.erbe { stroke: var(--auf); stroke-width: 3; }
.sb-k.haupt { stroke: var(--tinte); stroke-width: 3; fill: #e8ecf4; }
.sb-l { fill: none; stroke: var(--text-3); stroke-width: 1.5; }
.sb-l.erb { stroke: var(--auf); stroke-width: 2.25; }
.sb-n { font-family: var(--sans); font-size: 12px; font-weight: 600; fill: var(--text); }
.sb-r { font-family: var(--sans); font-size: 11px; fill: var(--text-2); }
.tf-punkt { display: inline-block; width: .7rem; height: .7rem; border-radius: 50%; border: 2px solid var(--auf); vertical-align: -1px; margin-right: .2rem; }
.tf-punkt.tot { border: 1.5px dashed var(--druck); }

.fliesstext blockquote { margin: 1.2rem 0; padding-left: 1rem; border-left: 3px solid var(--linie); }
.fliesstext blockquote p { margin: 0; font-style: italic; }
.fliesstext blockquote cite { display: block; margin-top: .3rem; font-family: var(--sans); font-style: normal; font-size: var(--t-xs); color: var(--text-2); }

.tf-offenliste { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; font-size: var(--t-s); }
.tf-offenliste li { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: .6rem; align-items: baseline; }
.tf-verlauf { list-style: none; margin: .8rem 0 0; padding: 0; display: grid; gap: .3rem; font-size: var(--t-xs); color: var(--text-2); }
.tf-verlauf time { font-weight: 650; color: var(--text); margin-right: .4rem; font-variant-numeric: tabular-nums; }
.tf-links { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; font-size: var(--t-s); }
.tf-links small { color: var(--text-3); }

.tf-erbe-kopf .seiten-zusatz { font-family: var(--serif); font-size: var(--t-l); color: var(--text-2); max-width: none; text-wrap: pretty; }
.tf-balken { display: flex; height: 2.4rem; border: 1px solid var(--druck); overflow: hidden; }
.tf-balken i { display: block; min-width: 0; }
.tf-legende { list-style: none; margin: .8rem 0 0; padding: 0; display: grid; gap: .35rem; font-size: var(--t-s); }
.tf-legende li { display: grid; grid-template-columns: .9rem minmax(0, 1fr) auto 7rem; gap: .6rem; align-items: center; border-bottom: 1px solid var(--linie); padding: .3rem 0; }
.tf-legende i { width: .9rem; height: .9rem; display: block; }
.tf-legende b { font-variant-numeric: tabular-nums; }
.tf-legende small { text-align: right; color: var(--text-2); font-variant-numeric: tabular-nums; }
.tf-kette-rahmen { overflow-x: auto; display: grid; gap: .8rem; }
.tf-kette { display: grid; grid-template-columns: minmax(10rem, 1fr) auto minmax(10rem, 1fr) auto minmax(10rem, 1fr); align-items: stretch; gap: .5rem; min-width: 560px; }
.tf-knoten { border: 1.5px solid var(--druck); background: var(--blatt); padding: .75rem .9rem; display: flex; flex-direction: column; gap: .15rem; font-size: var(--t-s); }
.tf-knoten span { color: var(--text-2); font-size: var(--t-xs); }
.tf-knoten.unsicher { border-style: dashed; color: var(--text-2); }
.tf-pfeil { align-self: center; color: var(--text-3); }

/* Bauplan-Ansicht (?bauplan=1): Notizen für Felix, nie für Besucher */
.bauplan-kopf { max-width: var(--breite); margin: 1rem auto 0; padding: .8rem var(--rand); background: #fff6d6; border: 1px dashed #7a5b00; color: #4d3a00; font-size: var(--t-s); }
.bauplan-notiz { margin: .9rem 0 0; padding: .55rem .8rem; background: #fff6d6; border: 1px dashed #7a5b00; color: #4d3a00; font-size: var(--t-xs); line-height: 1.45; }
.blatt > .bauplan-notiz { max-width: var(--breite); margin: .8rem auto 0; }

@media (max-width: 900px) {
  .blatt .tf-zahlen div { border-right: 0; }
  .tf-legende li { grid-template-columns: .9rem minmax(0, 1fr) auto; }
  .tf-legende small { display: none; }
}

/* Breite Diagramme scrollen in ihrem Kasten, nie die ganze Seite */
.blatt.trauer .blatt-raster > *, .tf-erbe > * { min-width: 0; }
@media (max-width: 600px) {
  .tf-zahlen { grid-template-columns: 1fr 1fr; }
  .tf-zahlen dd { font-size: var(--t-l); }
  .tf-zahlen div:last-child:nth-child(odd) { grid-column: 1 / -1; }
}

/* Häufige Fragen ausgeschrieben */
.tf-faq { display: grid; gap: 1.1rem; }
.tf-faq h3 { font-size: var(--t-m); font-weight: 700; margin: 0 0 .25rem; }
.tf-faq p { margin: 0; font-family: var(--serif); font-size: var(--t-m); color: var(--text); }

/* Seitenleiste */
.tf-steckbrief dl { margin: 0 0 1rem; display: grid; gap: .55rem; }
.tf-steckbrief dl div { display: grid; gap: .05rem; }
.tf-steckbrief dt { font-size: var(--t-xs); color: var(--text-2); }
.tf-steckbrief dd { margin: 0; font-weight: 650; font-size: var(--t-s); }
.tf-beobachten { width: 100%; justify-content: center; }
.tf-verstorben { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.tf-verstorben li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: .6rem; align-items: center; font-size: var(--t-s); }
.tf-verstorben small { display: block; color: var(--text-2); font-size: var(--t-xs); }
.tf-bild { font-size: var(--t-xs); }
.ll-stiel { stroke: var(--text-3); stroke-width: 1; fill: none; }
.ll-p.aktiv .ll-stiel { stroke: var(--signal); }
.blatt-teil h2 + .tf-faq { margin-top: 1.2rem; }
.blatt.trauer .blatt-teil h2 + .fliesstext, .tf-erbe .blatt-teil h2 + .fliesstext { margin-top: .9rem; }
.blatt.trauer .blatt-teil > h2, .tf-erbe .blatt-teil > h2 { margin-bottom: 1.1rem; }
.tf-erbe-kopf .tf-zahlen { margin-top: 1.4rem; }
@media (max-width: 600px) {
  .tf-kette { grid-template-columns: 1fr; min-width: 0; }
  .tf-pfeil { justify-self: center; transform: rotate(90deg); line-height: 1; }
  .tf-kette-rahmen { gap: 1.4rem; }
}

.sb-link { cursor: pointer; }
.sb-link:hover .sb-k, .sb-link:focus .sb-k { fill: #e8ecf4; stroke-width: 3; }
.sb-link .sb-n { text-decoration: underline; text-decoration-color: var(--linie); }
button.auto-link { background: none; border: 0; padding: 0; font: inherit; color: var(--tinte); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; cursor: pointer; }

/* Quellen des Text-Jobs (2i, 14.10.2026) */
.tf-quellenliste { margin: .4rem 0 0; padding-left: 1.4rem; font-family: var(--sans); font-size: var(--t-xs); color: var(--text-2); display: grid; gap: .35rem; }
.tf-quellenliste li { text-wrap: pretty; }
.tf-quellenliste a { color: var(--tinte); font-weight: 600; }
.tf-quellenliste a:hover { text-decoration: none; }
.tf-quellenliste span { color: var(--text-3); }
@media (min-width: 900px) { .blatt .tf-zahlen[style*="--spalten"] { grid-template-columns: repeat(var(--spalten), minmax(0, 1fr)); } }
.tf-erbe #t-chronik + .tabelle-rahmen td:first-child { white-space: nowrap; }

/* ───── Bereich „Profile“ (Darstellungsprüfung 19.10.2026): Todes- und Erbe-Seiten am Handy ───── */
/* Lebensdaten: Umbruch nur zwischen Geburt · Tod · Alter */
.lebensdaten span { display: inline-block; }
.lebensdaten span:not(:last-child)::after { content: " ·"; }
@media (max-width: 600px) { .lebensdaten span { display: block; } .lebensdaten span:not(:last-child)::after { content: none; } }
/* Lebenslinie und Stammbaum: eigene Handy-Fassung (lesbare Schrift) statt rechts abgeschnittenem Querscrollen */
.ll-klein, .sb-klein { display: none; }
.sb-klein .sb-ausschnitt { margin: 0 auto; }
@media (max-width: 600px) {
  .ll-gross, .sb-gross { display: none; }
  .ll-klein, .sb-klein { display: block; }
  .ll-klein .lebenslinie { min-width: 0; max-width: 560px; }
  /* Kennzahlen: lange Bezeichnungen („US-Repräsentantenhauses“) trennen statt die Seite zu verbreitern */
  .tf-zahlen { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tf-zahlen dt { hyphens: auto; overflow-wrap: anywhere; }
  /* Tabellen als gestapelte Zeilen statt rechts abgeschnitten */
  .tf-tabelle { min-width: 0; border-top: 2px solid var(--druck); }
  .tf-tabelle thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .tf-tabelle, .tf-tabelle tbody { display: block; }
  .tf-tabelle tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: .8rem; row-gap: .25rem; padding: .7rem 0; border-bottom: 1px solid var(--linie); }
  .tf-tabelle td { display: block; padding: 0; border: 0; min-width: 0; }
  .tf-tabelle td:empty { display: none; }
  .tf-chronik td:nth-child(1) { grid-area: 1 / 1; font-weight: 650; }
  .tf-chronik td:nth-child(2) { grid-area: 2 / 1 / 3 / -1; }
  .tf-chronik td:nth-child(3) { grid-area: 1 / 2; }
  .tf-firmen td:nth-child(1) { grid-area: 1 / 1; }
  .tf-firmen td:nth-child(2) { grid-area: 2 / 1 / 3 / -1; color: var(--text-2); font-size: var(--t-xs); }
  .tf-firmen td:nth-child(3) { grid-area: 3 / 1 / 4 / -1; }
  .tf-firmen td:nth-child(4) { grid-area: 1 / 2; }
  .tf-vergleich td:nth-child(1) { grid-area: 1 / 1; }
  .tf-vergleich td:nth-child(2) { grid-area: 1 / 2; color: var(--text-2); }
  .tf-vergleich td:nth-child(3) { grid-area: 2 / 1 / 3 / -1; }
}
/* Achsenbeschriftung bleibt lesbar, wo die Kurve sie kreuzt (Papier-Rand um die Schrift) */
.ll-a, .ll-w { paint-order: stroke; stroke: var(--papier); stroke-width: 3px; stroke-linejoin: round; }
.umbruchfrei { white-space: nowrap; }   /* Name-Knopf + Satzzeichen bleiben zusammen (verlinker.php) */
