/* Zeitleiste der Weltgeschichte (geschichte.domain-root.de; T29, 29.10.2026). Rahmen, Knöpfe und Felder aus domainroot.css
   (.dr-werkzeug, .dr-btn, .dr-feld); Farben über die Variablen des Hosts, nur die Punkte der Achse haben je Epoche einen
   eigenen Ton. Ohne JavaScript ist die Liste mit allen Kurztexten sichtbar, Achse und Filter bleiben ohne Wirkung. */
.dr-zl-form { align-items: start; }
.dr-zl-form select { width: 100%; }
.dr-zl-zoom input[type="range"] { width: 100%; accent-color: var(--dr-marke); margin: .2rem 0; }
.dr-zl-schieben { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .3rem; }
.dr-zl-schieben .dr-btn:disabled { opacity: .45; cursor: not-allowed; }
.dr-zl-regionen { border: 1px solid var(--dr-linie); border-radius: 12px; padding: .55rem .9rem .65rem; margin: 0; min-width: 0;
    display: flex; flex-wrap: wrap; gap: .25rem 1.1rem; }
.dr-zl-regionen legend { font-weight: 700; font-size: .95rem; padding: 0 .3rem; }
.dr-zl-regionen label { display: inline-flex; gap: .45rem; align-items: center; padding: .25rem 0; cursor: pointer; }
.dr-zl-regionen input { width: 1.15rem; height: 1.15rem; accent-color: var(--dr-marke); margin: 0; }
.dr-main .prose .dr-zl-knoepfe, .dr-zl-knoepfe { margin: 0; }

/* Achse: ohne JavaScript leer und unsichtbar */
.dr-zl-achse:empty { display: none; }
.dr-zl-achse { margin: .4rem 0 1rem; padding: 1.7rem 2.6rem 1.8rem; border: 1px solid var(--dr-linie); border-radius: 12px; background: var(--dr-flaeche); }
.dr-zl-linie { position: relative; height: 1.4rem; border-bottom: 2px solid var(--dr-linie-2); }
.dr-zl-strich { position: absolute; bottom: -.45rem; width: 0; height: .9rem; border-left: 1px solid var(--dr-tinte-3); }
.dr-zl-strich-text { position: absolute; bottom: 1.05rem; transform: translateX(-50%); white-space: nowrap; font-size: .72rem; color: var(--dr-tinte-2); }
.dr-zl-strich--unten .dr-zl-strich-text { bottom: auto; top: 1.05rem; }
.dr-zl-marke { position: absolute; bottom: .15rem; width: .8rem; height: .8rem; margin-left: -.4rem; border-radius: 50%;
    background: var(--dr-marke); border: 2px solid var(--dr-grund); opacity: .85; cursor: pointer; }
.dr-zl-marke:hover, .dr-zl-marke--aktiv { opacity: 1; transform: scale(1.45); z-index: 2; box-shadow: 0 0 0 2px var(--dr-tinte); }
.dr-zl-marke--vorgeschichte { background: #8a6d3b; }
.dr-zl-marke--antike { background: #b5523b; }
.dr-zl-marke--mittelalter { background: #5b6aa8; }
.dr-zl-marke--fruehe-neuzeit { background: #3f8a6b; }
.dr-zl-marke--19-jahrhundert { background: #9a4f8c; }
.dr-zl-marke--20-jahrhundert { background: #2f7aa0; }
.dr-zl-marke--gegenwart { background: #c27c14; }

.dr-main .prose .dr-zl-tipp, .dr-main .prose .dr-zl-regel { margin: 0 0 .5rem; color: var(--dr-tinte-2); }

/* Liste */
.dr-zl-gruppe { margin: 0 0 1.2rem; }
.dr-main .prose .dr-zl-epoche, .dr-zl-epoche { margin: 1rem 0 .5rem; padding: 0; font-size: 1.1rem; }
.dr-zl-zahl { font-weight: 400; font-size: .9rem; color: var(--dr-tinte-3); }
.dr-main .prose .dr-zl-eintraege, .dr-zl-eintraege { list-style: none; margin: 0; padding: 0 0 0 .9rem; border-left: 2px solid var(--dr-linie-2); }
.dr-main .prose .dr-zl-eintrag, .dr-zl-eintrag { position: relative; margin: 0 0 .7rem; padding: .1rem 0 0 .7rem; break-inside: avoid; }
.dr-zl-eintrag::before { content: "" !important; position: absolute; left: -1.33rem; top: .45rem; width: .7rem; height: .7rem;
    border-radius: 50%; background: var(--dr-marke); border: 2px solid var(--dr-grund); }
.dr-main .prose .dr-zl-kopf, .dr-zl-kopf { margin: 0; font-size: .88rem; color: var(--dr-tinte-2); }
.dr-zl-datum { font-weight: 700; color: var(--dr-tinte); }
.dr-zl-region { display: inline-block; margin-left: .4rem; padding: 0 .45rem; border-radius: 999px; font-size: .75rem;
    background: var(--dr-marke-tint); color: var(--dr-marke-2); }
.dr-zl-titel { font-weight: 700; font-size: 1.02rem; }
.dr-zl--aktiv .dr-zl-titel { cursor: pointer; }
.dr-zl-mehr { margin: .3rem 0 0; }
.dr-main .prose .dr-zl-text, .dr-zl-text { margin: 0 0 .3rem; }
.dr-main .prose .dr-zl-andere, .dr-main .prose .dr-zl-artikel { margin: 0 0 .3rem; font-size: .9rem; color: var(--dr-tinte-2); }
.dr-zl-eintrag--offen::before { background: var(--dr-akzent, var(--dr-marke)); transform: scale(1.3); }
.dr-zl--aktiv .dr-zl-eintrag--offen { background: var(--dr-flaeche); border-radius: 10px; padding: .4rem .7rem .3rem; }
.dr-main .prose .dr-zl-leer { margin: 0 0 1rem; font-weight: 600; }

@media (max-width: 600px) {
    .dr-zl-strich-text { font-size: .64rem; }
    .dr-zl-achse { padding-left: 2rem; padding-right: 2rem; }
}
@media print {
    .dr-zl-achse, .dr-zl-tipp { display: none !important; }
    .dr-zl-mehr[hidden] { display: block !important; }
    .dr-zl-eintrag::before { background: #000; }
}