/* chronos.css — ausgelagert aus index.html (#1008).
   Inhalt unveraendert; nur der Ort hat sich geaendert. Grund: die CSP verbietet
   Inline-<style>. Neue Regeln fuer ehemalige style=-Attribute stehen AM ENDE. */
/* ════════════════════════════════════════════════════════════════════════
   CHRONOS — Synthese der drei Entwürfe
   A Codex Stellarum  → Leder als Rahmen, Gold, Fundorte als Sterne, Räderwerk
   B Feldtagebuch     → Pergamentblatt als Dossier, Fototafel, Tuschebalken
   C Instrumententafel→ Messwerte in Mono, Zahlen ohne Beschönigung
   Das Leder umrahmt, das Pergament trägt den Text, die Tafel trägt die Zahlen.
   ════════════════════════════════════════════════════════════════════════ */
:root{
  --lth-deep:#120D09; --lth-mid:#241A12; --lth-rise:#3A2A1C; --lth-edge:#4C3826;
  --sky-void:#05070C; --sky-deep:#080D16; --sky-lift:#101827;
  --gold:#D2B178; --gold-hi:#F0DCAE; --brass:#A2834F; --brass-dim:#6E5833;
  --perg:#F2E2B5; --perg-tief:#E8D5A6; --perg-dim:#B9AA84;
  --tinte:#2A2113; --tinte-weich:#57472C; --roetel:#A8482C;
  --star:#E4EEF7; --star-dim:#8FA6BC;
  --frei:#6FCBA8; --mittel:#E0A33C; --verbaut:#D66A6A;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Hoefler Text",Georgia,serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%;overflow:hidden;
  background:var(--lth-deep);color:var(--perg);
  font-family:var(--mono);font-size:13px;font-variant-numeric:tabular-nums}
button,input{font-family:inherit}

/* ── Lederrahmen um die ganze Bühne ─────────────────────── */
#buehne{position:absolute;inset:0;padding:11px;
  background:repeating-linear-gradient(72deg,#1B1309 0 3px,#191108 3px 6px),var(--lth-deep)}
#karte{position:absolute;inset:11px;border:1px solid var(--lth-edge);
  box-shadow:inset 0 0 0 1px #0A0705, 0 0 40px #000 inset}

/* ── Das Papier ──────────────────────────────────────────
   Liegt als reine Auflage über dem Kartenbild: Faser, Flecken, Vignette.
   pointer-events:none — die Karte bleibt vollständig bedienbar.
   z-index 5 hält es unter allen Bedienfeldern (die liegen ab 10),
   sonst würde multiply auch die Tafeln einfärben.
   Im Himmel-Modus wird es ausgeblendet, nicht entfernt. */
#papier{position:absolute;inset:11px;z-index:5;pointer-events:none;
  mix-blend-mode:multiply;transition:opacity .28s ease;
  background-image:
    /* Stockflecken — sparsam, an drei festen Stellen */
    radial-gradient(ellipse 22% 17% at 17% 78%, rgba(150,112,58,.20), transparent 70%),
    radial-gradient(ellipse 15% 13% at 82% 24%, rgba(138,100,52,.17), transparent 72%),
    radial-gradient(ellipse 30% 12% at 62% 92%, rgba(120,92,50,.13), transparent 75%),
    /* Vignette zum Rand hin */
    radial-gradient(ellipse 78% 78% at 50% 48%, transparent 52%, rgba(92,70,38,.34) 100%),
    /* Papierfaser */
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.86' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23f)' opacity='.30'/%3E%3C/svg%3E");
  background-size:auto,auto,auto,auto,240px 240px}
body.himmel #papier{opacity:0}

/* ── Umschalter Pergament ↔ Himmel ───────────────────────── */
#grundKnopf{background:linear-gradient(180deg,#2C2013,#1A130B);
  border:1px solid var(--brass-dim);color:var(--gold);
  font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
  padding:8px 15px;cursor:pointer;border-radius:2px;white-space:nowrap;
  box-shadow:inset 0 1px 0 rgba(240,220,174,.09)}
#grundKnopf:hover{border-color:var(--gold);color:var(--gold-hi)}
#grundKnopf::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;
  margin-right:8px;vertical-align:middle;background:var(--perg);
  border:1px solid var(--brass);box-shadow:0 0 5px rgba(242,226,181,.5)}
body.himmel #grundKnopf::before{background:#0A1017;box-shadow:none}

/* ── Kartusche um die Wortmarke ──────────────────────────── */
.kartusche{position:relative;padding:9px 26px 11px;border:1px solid var(--brass-dim);
  background:linear-gradient(180deg,rgba(46,33,19,.55),rgba(18,13,9,.30))}
.kartusche::before,.kartusche::after{content:"";position:absolute;left:5px;right:5px;height:1px;
  background:linear-gradient(90deg,transparent,var(--brass-dim) 14%,var(--brass) 50%,var(--brass-dim) 86%,transparent)}
.kartusche::before{top:3px} .kartusche::after{bottom:3px}
.zier{position:absolute;width:7px;height:7px;border:1px solid var(--brass);
  transform:rotate(45deg);background:var(--lth-deep)}
.zier.lo{left:-4px;top:-4px} .zier.ro{right:-4px;top:-4px}
.zier.lu{left:-4px;bottom:-4px} .zier.ru{right:-4px;bottom:-4px}

/* ── Kopf ───────────────────────────────────────────────── */
#kopf{position:absolute;top:11px;left:11px;right:11px;z-index:10;display:flex;
  align-items:flex-start;gap:26px;padding:15px 20px 30px;pointer-events:none;
  background:linear-gradient(180deg,#120D09f2 0%,#120D0999 55%,#120D0900 100%)}
#kopf>*{pointer-events:auto}
.marke{font-family:var(--serif);font-size:30px;letter-spacing:.30em;line-height:1;
  background:linear-gradient(180deg,var(--gold-hi),var(--brass));
  -webkit-background-clip:text;background-clip:text;color:transparent}
.marke small{display:block;font-family:var(--mono);font-size:8.5px;letter-spacing:.26em;
  color:var(--brass);margin-top:6px;text-transform:uppercase;-webkit-text-fill-color:var(--brass)}
/* Ausgabe-Marke: dieselbe Zahl steht in version.json und im Git-Tag.
   Sichtbar, weil eine Beta erkennbar sein soll — nicht im Kleingedruckten. */
.ausgabe{display:inline-block;margin-left:9px;padding:1px 6px;border:1px solid var(--brass-dim);
  border-radius:2px;color:var(--gold);-webkit-text-fill-color:var(--gold);letter-spacing:.16em}
.zahlen{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.z b{display:block;font-size:17px;color:var(--gold);font-weight:400;line-height:1;
  font-family:var(--serif)}
.z span{font-size:8px;letter-spacing:.15em;color:var(--perg-dim);text-transform:uppercase}
/* Die Katalogsumme neben der Beschriftung — sie erscheint NUR, wenn gefiltert wird
   (kopfSetzen leert sie sonst). `white-space:nowrap` verhindert, dass „von 397"
   in der schmalen Leiste umbricht und wie zwei Angaben aussieht. */
.z span i{font-style:normal;white-space:nowrap;opacity:.8}
/* Suchfeld in Messing */
.suche{margin-left:auto;position:relative}
.suche input{background:#0E1319;border:1px solid var(--brass-dim);color:var(--perg);
  padding:9px 13px;width:260px;font-size:12px;border-radius:2px;letter-spacing:.03em}
.suche input:focus{outline:none;border-color:var(--gold)}
.suche input::placeholder{color:#5C6B7A}
#treffer{position:absolute;top:38px;left:0;right:0;background:#0B1119f2;
  border:1px solid var(--brass-dim);max-height:340px;overflow-y:auto;display:none;z-index:30}
#treffer.auf{display:block}
#treffer div{padding:8px 12px;cursor:pointer;border-bottom:1px solid #1A2430;font-size:12px}
#treffer div:hover{background:var(--lth-mid)}
#treffer small{display:block;color:var(--perg-dim);font-size:9.5px;margin-top:2px}

/* ── Steuertafel (Instrumententafel-Erbe) ───────────────── */
#steuer{position:absolute;left:22px;bottom:22px;z-index:10;width:288px;
  background:#0B1119ee;border:1px solid var(--lth-edge);border-radius:2px;
  padding:14px 16px;backdrop-filter:blur(8px);max-height:70vh;overflow-y:auto}
#steuer h3{margin:0 0 9px;font-size:8.5px;letter-spacing:.24em;color:var(--brass);
  text-transform:uppercase;font-weight:400}
.zeile{display:flex;align-items:center;gap:9px;margin:6px 0;font-size:11.5px;
  color:var(--perg-dim);cursor:pointer}
.zeile input{accent-color:var(--brass);cursor:pointer}
.zeile i{font-style:normal;color:#6B7A88;margin-left:auto;font-size:9.5px}
.pkt{width:9px;height:9px;border-radius:50%;flex:none}
.hinweis{font-size:9.5px;color:#6B7A88;line-height:1.5;margin-top:10px;
  border-top:1px solid #1A2430;padding-top:9px}
/* ── Klappbare Gruppen ───────────────────────────────────
   Die Tafel ist auf 16 Bedienteile gewachsen. Statt sie höher zu machen (und damit
   scrollbar, so dass man nicht mehr sieht, was man eingeschaltet hat), klappen die
   Gruppen zu. Offen startet nur „Auswahl".
   ⚠ Eine zugeklappte Gruppe, die still filtert, wäre genau die Falle, die wir sonst
   überall vermeiden — deshalb zeigt jeder Kopf, wie viel in ihm aktiv ist. */
.gruppe{border-top:1px solid #1A2430;margin-top:4px;padding-top:2px}
.gruppe:first-child{border-top:0;margin-top:0}
.gkopf{cursor:pointer;user-select:none;display:flex;align-items:center;gap:7px;
  padding:7px 0 6px;margin:0 !important}
.gkopf::after{content:"▾";margin-left:auto;font-size:9px;color:var(--brass-dim);
  transition:transform .18s}
.gruppe.zu .gkopf::after{transform:rotate(-90deg)}
.gruppe.zu .ginhalt{display:none}
.gzahl{font-style:normal;font-size:8.5px;letter-spacing:.1em;color:var(--gold);
  border:1px solid var(--brass-dim);border-radius:2px;padding:0 5px}
.gzahl:empty{display:none}
.gruppe.umstritten .gkopf{color:#B07AD8}
/* Drehprobe */
#leyDrehen{display:block;width:100%;margin-top:10px;padding:8px;
  background:linear-gradient(180deg,#2A1F3A,#1A1526);border:1px solid #7A5AA8;
  color:#C89AE8;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;cursor:pointer;border-radius:2px}
#leyDrehen:hover{border-color:#B07AD8;color:#E8CAFF}
#leyProbe{margin-top:9px;font-size:10.5px;color:var(--perg-dim)}
#leyProbe:empty{display:none}
.probzeile{display:flex;justify-content:space-between;gap:10px;padding:2.5px 0;
  font-family:var(--mono);font-size:10px}
.probzeile b{color:var(--perg);font-weight:500}
.proburteil{margin-top:8px;padding:8px 10px;font-size:10px;line-height:1.55;
  border-left:2px solid #7A5AA8;background:rgba(122,90,168,.10)}
.proburteil.auffaellig{border-left-color:var(--mittel);background:rgba(224,163,60,.10);
  color:var(--perg)}
.proburteil.unauffaellig{color:#8B93A0}
.probstreu{display:block;margin-top:6px;color:var(--mittel);font-size:9.5px;line-height:1.5}

#zurueck{display:block;width:100%;margin-top:10px;padding:7px;background:none;
  border:1px solid var(--lth-edge);color:var(--perg-dim);font-family:var(--mono);
  font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;border-radius:2px}
#zurueck:hover{border-color:var(--roetel);color:var(--perg)}
#zurueck[hidden]{display:none}

/* Nachweis-Link: steht dort, wo sonst Impressum und Quellen stehen — am Fuß der
   Tafel, die die Messwerte zeigt. Wer den Zahlen misstraut, findet hier ihre Herkunft. */
.nachweis{display:block;margin-top:11px;padding-top:9px;border-top:1px solid #1A2430;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--brass);text-decoration:none}
.nachweis:hover{color:var(--gold-hi)}
/* Rang-Regler: bekanntheit ist eine Zahl, also wird sie auch als Zahl bedient */
.regler{margin:11px 0 4px;font-size:11.5px;color:var(--perg-dim)}
.regler label{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.regler label b{color:var(--gold);font-weight:400;font-family:var(--mono);font-size:11px}
.regler input[type=range]{width:100%;accent-color:var(--brass);margin-top:5px;cursor:pointer}

/* ── Räderwerk ──────────────────────────────────────────── */
#radbox{position:absolute;right:22px;bottom:22px;z-index:10;width:250px;text-align:center;
  background:linear-gradient(180deg,#241A12ee,#120D09ee);border:1px solid var(--lth-edge);
  border-radius:2px;padding:14px 12px 12px}
#radbox h3{margin:0 0 10px;font-size:8.5px;letter-spacing:.24em;color:var(--brass);
  text-transform:uppercase;font-weight:400}
.mondzeile{display:flex;align-items:center;gap:12px;justify-content:center;margin-bottom:10px}
#mond{width:52px;height:52px;flex:none}
.mondtext{font-family:var(--mono);font-size:9px;color:var(--perg-dim);letter-spacing:.1em;
  text-align:left;line-height:1.5}
.mondtext b{display:block;color:var(--gold);font-size:11px;letter-spacing:.04em}
/* Facetten-Chips (#845): die Legende IST der Filter (CHR 05.09.) — kein zweites
   Schalterpanel, keine Checkbox-Wand. Jeder Chip traegt seine Anzahl, damit
   sichtbar bleibt, wie duenn eine Gruppe belegt ist. */
.fzeile{margin:0 0 10px}
.fkopf{font:600 10px var(--mono);letter-spacing:.1em;text-transform:uppercase;
  color:var(--perg-dim);margin:0 0 5px}
.chips{display:flex;flex-wrap:wrap;gap:4px}
.chip{font:400 11px var(--mono);padding:3px 8px;border:1px solid var(--linie);
  border-radius:11px;background:transparent;color:var(--perg-dim);cursor:pointer;
  transition:background .12s,color .12s,border-color .12s}
.chip:hover{border-color:var(--gold);color:var(--perg)}
.chip[aria-pressed="true"]{background:var(--gold);border-color:var(--gold);color:#1a1508}
.chip .n{opacity:.62;margin-left:4px;font-size:10px}
.chip.ohne{font-style:italic}
#zeitrad{width:222px;height:222px;margin:0 auto;cursor:grab;outline:none}
#zeitrad:active{cursor:grabbing}
.zeitrad-svg{width:100%;height:100%;display:block}
.zr-grund{fill:#0A1017;stroke:var(--lth-edge);stroke-width:1}
.zr-zahn{fill:var(--brass-dim)}
.zr-marke{stroke:#6B7A88;stroke-width:1}
.zr-marke-gross{stroke:var(--brass);stroke-width:1.6}
.zr-jahr{fill:var(--perg-dim);font:400 9px var(--mono);text-anchor:middle;letter-spacing:.08em}
.zr-scheibe{fill:#0C131C;stroke:#1A2430;stroke-width:1}
.zr-scheibe-innen{fill:#0E1720;stroke:var(--brass-dim);stroke-width:1}
.zr-obzeiger{fill:var(--gold-hi);opacity:.92}
.zr-index{fill:var(--gold)}
.zr-anzeige{fill:var(--gold-hi);font:400 29px var(--serif);text-anchor:middle;letter-spacing:.04em}
.zr-anzeige-klein{fill:var(--perg-dim);font:400 8.5px var(--mono);text-anchor:middle;letter-spacing:.2em}
.zr-anzeige-eps{fill:var(--brass);font:400 10px var(--mono);text-anchor:middle;letter-spacing:.08em}
.radfuss{font-size:9px;color:#6B7A88;letter-spacing:.06em;margin-top:6px;line-height:1.5}
.radfuss b{color:var(--gold)}
#radFilter{display:flex;align-items:center;gap:7px;justify-content:center;margin-top:8px;
  font-size:9.5px;color:var(--perg-dim);cursor:pointer}
/* Kopfzeile der Radkiste trägt den Vergrößerer */
.radkopf{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.radkopf h3{margin:0;flex:1;text-align:left}
#radGross{background:none;border:1px solid var(--lth-edge);color:var(--brass);
  width:24px;height:22px;font-size:12px;line-height:1;cursor:pointer;border-radius:2px;flex:none}
#radGross:hover{border-color:var(--gold);color:var(--gold-hi)}

/* ── Das Räderwerk in groß ───────────────────────────────
   Es ist DASSELBE Element, nur anders gesetzt und größer — kein zweites Rad
   und damit kein zweiter Zustand, der auseinanderlaufen könnte. Das SVG hat
   eine viewBox und skaliert verlustfrei mit. Ziehen, Mausrad und Pfeiltasten
   hängen unverändert am selben Knoten. */
#radDunkel{position:absolute;inset:11px;z-index:14;display:none;
  background:rgba(6,9,14,.62);backdrop-filter:blur(2px)}
#radDunkel.auf{display:block}
#radbox.gross{position:fixed;right:auto;bottom:auto;left:50%;top:50%;
  transform:translate(-50%,-50%);z-index:15;width:auto;padding:20px 26px 18px;
  background:linear-gradient(180deg,rgba(46,33,19,.90),rgba(18,13,9,.92));
  border:1px solid var(--brass-dim);
  box-shadow:0 0 0 1px #0A0705, 0 26px 90px rgba(0,0,0,.72)}
#radbox.gross #zeitrad{width:min(62vh,74vw);height:min(62vh,74vw)}
#radbox.gross #mond{width:74px;height:74px}
#radbox.gross .mondtext{font-size:11px} #radbox.gross .mondtext b{font-size:14px}
#radbox.gross .radfuss{font-size:11px;margin-top:10px}
#radbox.gross #radFilter{font-size:11px;margin-top:11px}
#radbox.gross #radGross{transform:rotate(45deg)}
#radbox.gross .zier{display:block}
#radbox .zier{display:none}

/* ── Dossier als Pergamentblatt ─────────────────────────── */
/* ── Die Windrose ───────────────────────────────────────
   Sie liegt AUF der Karte wie in einen alten Atlas gestochen — kein dunkles
   Kaestchen mit zwei Knoepfen (CHR 07.09.: "das ist ein pflaster kompass").
   SITZ: unten mittig — der einzige Platz, der in jeder Groesse frei bleibt.
   Links endet die Steuerung bei 310 px (22 + 288), rechts beginnt das Raederwerk
   bei 272 px (22 + 250), und unter 1100 px sind beide Auszuege. Genau die Ecke
   bottom-right war der Grund, warum MapLibres eigene Steuerung nie zu sehen war.
   ⚠ FARBEN FOLGEN DEM KARTENGRUND — dieselbe Regel, die der Befund vom 07.09.
   erzwungen hat: was auf der Karte liegt, wechselt mit ihr. Deshalb stehen die
   Werte als Marken hier und nicht als feste Farben im SVG. */
#kompass{
  --kr-hell:#9C7B44; --kr-dunkel:#6E5B3E; --kr-linie:#7A6238;
  --kr-nord-hell:#B4593B; --kr-nord-dunkel:#8E3320;
  position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:10;
  display:flex;align-items:center;gap:8px;
  /* Auf dem Papier ist sie Tinte, nicht Aufkleber: multiply laesst die Faser
     durchscheinen. In der Nachtfassung waere multiply unsichtbar — dort normal. */
  mix-blend-mode:multiply;opacity:1}
body.himmel #kompass{
  --kr-hell:#F0DCAE; --kr-dunkel:#8A6F42; --kr-linie:#A2834F;
  --kr-nord-hell:#E0A33C; --kr-nord-dunkel:#A8762C;
  mix-blend-mode:normal;opacity:.9}

#kompassRose{width:148px;height:148px;padding:0;background:none;border:0;
  cursor:pointer;display:block;line-height:0}
#kompassRose svg{width:100%;height:100%;display:block;overflow:visible}

.kr-ring-aussen{fill:none;stroke:var(--kr-linie);stroke-width:1.3;opacity:.95}
.kr-ring-innen {fill:none;stroke:var(--kr-linie);stroke-width:.8;opacity:.55}
/* Teilung als Strichmuster: 36 Marken alle 10 Grad, 12 alle 30.
   Umfang 2*pi*88 = 552,92 → Teilung 15,359; 2*pi*87 = 546,64 → 45,553.
   Der halbe Strich als Versatz setzt eine Marke exakt auf Nord. */
.kr-teilung-fein{fill:none;stroke:var(--kr-linie);stroke-width:7;opacity:.7;
  stroke-dasharray:1.3 14.059;stroke-dashoffset:.65}
.kr-teilung-grob{fill:none;stroke:var(--kr-linie);stroke-width:12;opacity:.75;
  stroke-dasharray:2.4 43.153;stroke-dashoffset:1.2}
.kr-mark{font-family:var(--serif);font-size:15px;text-anchor:middle;
  fill:var(--kr-linie);letter-spacing:.03em}

.kr-arm-hell  {fill:var(--kr-hell)}
.kr-arm-dunkel{fill:var(--kr-dunkel)}
.kr-klein     {opacity:.82}
.kr-nord .kr-arm-hell  {fill:var(--kr-nord-hell)}
.kr-nord .kr-arm-dunkel{fill:var(--kr-nord-dunkel)}
.kr-nabe{fill:none;stroke:var(--kr-linie);stroke-width:1.1}
.kr-nabe-punkt{fill:var(--kr-hell)}

/* Die Drehung kommt als eigene Eigenschaft aus dem Skript (CSSOM, kein
   style=-Attribut — die CSP-Vorbereitung aus #1008/#1013 soll halten).
   Es dreht sich die GANZE Rose samt Teilung und Buchstaben: eine gedruckte
   Rose dreht sich mit dem Blatt, und N steht dann da, wo Norden ist. */
.kr-rose{transform:rotate(var(--dreh,0deg));transform-origin:100px 100px;
  transition:transform .12s linear}
#kompassRose:hover .kr-ring-aussen{opacity:1;stroke-width:1.4}

/* Die zwei Zeichen fuer naeher und weiter — als Messingpunzen, nicht als Knoepfe. */
.kzoom{display:flex;flex-direction:column;gap:7px}
.kzoom button{width:25px;height:25px;padding:0;background:none;border-radius:50%;
  border:1px solid var(--kr-linie);color:var(--kr-linie);
  font:400 14px var(--serif);line-height:1;cursor:pointer;opacity:.9}
.kzoom button:hover:not(:disabled){color:var(--kr-nord-hell);
  border-color:var(--kr-nord-hell);opacity:1}
.kzoom button:disabled{opacity:.3;cursor:default}
@media (prefers-reduced-motion:reduce){.kr-rose{transition:none}}

#dossier{position:absolute;right:0;top:0;bottom:0;width:430px;z-index:12;
  transform:translateX(103%);transition:transform .26s cubic-bezier(.4,0,.2,1);
  padding:11px 11px 11px 0;display:flex}
#dossier.auf{transform:none}
.blatt{flex:1;overflow-y:auto;color:var(--tinte);
  background:linear-gradient(168deg,#F6E9C4,#EBD9AC 55%,#DFC996);
  box-shadow:-14px 0 44px #000a, inset 0 0 80px rgba(160,130,80,.22);
  border:1px solid #C4AE80}
.dzu{position:sticky;top:0;float:right;margin:9px 11px 0 0;background:#241B0E;border:0;
  color:var(--perg);width:26px;height:26px;font-size:15px;cursor:pointer;border-radius:2px;
  z-index:2;line-height:1}
.dzu:hover{background:var(--roetel)}
.tafelbild{margin:0;background:#1A1409;padding:10px 10px 0}
.tafelbild img{width:100%;display:block;filter:sepia(.2) contrast(1.04)}
.tafelbild figcaption{font-family:var(--mono);font-size:8px;line-height:1.55;color:#C8B48A;
  padding:7px 2px 9px;letter-spacing:.03em}
.tafelbild a{color:#E0C88E}
.dkopf{padding:22px 26px 14px}
.dkopf h2{margin:0 0 4px;font-family:var(--serif);font-size:29px;line-height:1.12;
  color:#241B0E;font-weight:400}
.dkopf .ort{font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:#6B5836}
.dabschnitt{padding:0 26px 18px}
.dabschnitt h4{font-family:var(--mono);font-size:8px;letter-spacing:.22em;color:#8A7346;
  text-transform:uppercase;margin:18px 0 8px;font-weight:400;
  border-bottom:1px solid #CDB98D;padding-bottom:5px}
.dabschnitt p{margin:0 0 11px;font-family:var(--serif);font-size:15px;line-height:1.62;color:#3A2E1B}
/* Berichte des Instituts ZETESIS (#980) — bewusst zurueckhaltend: sie sind ein
   Verweis nach drueben, kein eigener Abschnitt der Staette. */
.dzetesis{margin:0 0 7px !important;font-size:14px !important}
.dzetesis a{color:#8A4A28;text-decoration:none;border-bottom:1px solid #C9A98C}
.dzetesis a:hover{color:#6B3418;border-bottom-color:#8A4A28}
.dzdatum{font-family:var(--mono);font-size:10px;color:#8A7346;margin-left:5px}
/* Kurzes Aufleuchten, wenn man ueber die ζ-Marke herkommt — damit man sieht,
   wohin man gesprungen ist, ohne dass es blinkt wie eine Warnung. */
.dzblink{animation:dzblink 1.6s ease-out}
@keyframes dzblink{0%{background:rgba(224,113,66,.20)}100%{background:transparent}}
@media (prefers-reduced-motion:reduce){.dzblink{animation:none}}
.dzquelle{font-family:var(--mono) !important;font-size:9.5px !important;
  letter-spacing:.1em;color:#8A7346 !important;margin-top:9px !important}
.w{display:flex;justify-content:space-between;gap:14px;font-family:var(--mono);
  font-size:11.5px;padding:3.5px 0;color:#57472C}
.w b{color:#241B0E;font-weight:600;text-align:right}
.w b.hell{color:#2F7A5A} .w b.dunkel{color:#9E3A2A}
.schwarz{background:#241B0E;color:transparent;padding:0 4px;user-select:none;border-radius:1px}
.marke-typ{display:inline-block;font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;
  padding:2px 7px;border:1px solid #B09A6E;color:#6B5836;margin-top:8px}
.dknopf{display:block;width:100%;margin-top:12px;padding:12px;background:#241B0E;
  border:0;color:var(--perg);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  cursor:pointer;font-weight:600}
.dknopf:hover{background:var(--roetel)}
.dquelle{font-family:var(--mono);font-size:9px;color:#6B5836;line-height:1.65;
  border-top:1px solid #CDB98D;padding:12px 26px 24px;letter-spacing:.02em}
.dquelle a{color:#4A3C22}

/* ── Bericht im Dossierblatt ─────────────────────────────── */
.dlaedt{font-size:12.5px;color:#6B5836;margin:9px 0 0}
.dquelle-klein{font-family:var(--mono);font-size:9px;color:#8A7346;letter-spacing:.04em;
  margin:2px 0 8px}
.bericht{font-family:var(--serif);font-size:14.5px;line-height:1.6;color:#3A2E1B}
.bericht p{margin:0 0 .7em}
/* Zugeklappt: nur der Anriss. Weichzeichner statt hartem Schnitt — man soll sehen,
   dass es weitergeht, nicht dass etwas abgeschnitten wurde. */
.bericht.zu{max-height:6.2em;overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 55%,transparent 100%)}
.dmehr{background:none;border:0;border-bottom:1px solid #B09A70;color:#6B5836;
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  padding:3px 0;margin-top:6px;cursor:pointer}
.dmehr:hover{color:#241B0E;border-color:#241B0E}
.anriss{font-family:var(--serif);font-size:14.5px;line-height:1.6;color:#3A2E1B;
  max-height:5em;overflow:hidden;margin-top:8px;
  -webkit-mask-image:linear-gradient(180deg,#000 50%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 50%,transparent 100%)}
.dknopf.lesen{margin-top:10px}

/* ── Der Lesesaal ────────────────────────────────────────── */
#lesesaal{position:absolute;inset:11px;z-index:22;display:none;overflow-y:auto;
  background:rgba(6,9,14,.90)}
#lesesaal.auf{display:block}
#lsBlatt{position:relative;max-width:46rem;margin:0 auto;
  padding:clamp(1.6rem,4vw,3.4rem) clamp(1.2rem,4vw,3.4rem) 4rem;
  background:linear-gradient(168deg,#F6E9C4,#EBD9AC 55%,#DFC996);color:var(--tinte);
  box-shadow:0 0 60px #000, inset 0 0 0 1px rgba(120,92,50,.35);
  font-family:var(--serif)}
#lsBlatt h1{font-size:clamp(1.6rem,4vw,2.3rem);line-height:1.15;margin:0 0 .25em;
  font-weight:400;color:#241B0E}
.lsMeta{font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:#6B5836;
  text-transform:uppercase;padding-bottom:1.2rem;border-bottom:2px solid var(--tinte);
  margin-bottom:1.8rem}
/* Lesespalte: rund 70 Zeichen, sonst wandert das Auge beim Zeilenwechsel */
#lsText{font-size:16.5px;line-height:1.66;max-width:36em}
#lsText p{margin:0 0 1em}
.lsFuss{font-family:var(--mono);font-size:9.5px;color:#6B5836;letter-spacing:.04em;
  border-top:1px solid #CDB98D;margin-top:2.4rem;padding-top:1rem}
.lsFuss a{color:#8A5A2A}
.lsZu{position:absolute;right:14px;top:14px;background:#241B0E;border:0;color:var(--perg);
  width:30px;height:30px;font-size:17px;line-height:1;cursor:pointer;border-radius:2px}
.lsZu:hover{background:var(--roetel)}

/* Popup der Großkreis-Ausrichtungen */
.leyPopup .maplibregl-popup-content{background:#1A1526;color:var(--perg);
  border:1px solid #7A5AA8;border-radius:2px;padding:11px 13px;font-family:var(--mono);
  font-size:11px;line-height:1.5;max-width:280px}
.leyPopup .maplibregl-popup-content small{color:var(--perg-dim);font-size:9.5px;
  display:block;margin-top:6px;line-height:1.6}
.leyPopup .maplibregl-popup-tip{border-top-color:#1A1526}

/* ── Die Sternkarte ──────────────────────────────────────
   Hier ist Dunkelheit richtig: das ist der Himmel, nicht das Papier.
   Die Karte bleibt Pergament, der Himmel bleibt Nacht — die Trennung ist
   der ganze Punkt der eigenen Ansicht. */
#skFeld{position:absolute;inset:11px;z-index:24;display:none;flex-direction:column;
  padding:18px 22px 14px;border:1px solid var(--lth-edge);
  background:radial-gradient(ellipse 70% 70% at 50% 45%,#0B1420,#05070C 70%)}
#skFeld.auf{display:flex}
.skKopf{display:flex;align-items:flex-start;gap:20px;margin-bottom:8px;flex:none}
.skKopf h2{margin:0;font-family:var(--serif);font-size:25px;color:var(--gold-hi);line-height:1.1}
.skMeta{font-size:10px;color:#6B7A88;margin-top:6px;letter-spacing:.05em;line-height:1.7}
.skMeta b{color:var(--gold)}
.skMeta span{display:block}
.skMeta .skPol{color:var(--perg-dim);margin-top:3px}
.skMeta .skPol b{color:var(--star)}
.skMeta .skWarn{color:var(--mittel);margin-top:3px}
#skSvg{flex:1;min-height:0;width:100%;display:block}
.skFuss{flex:none;font-size:9px;color:#4A5B6E;line-height:1.6;margin-top:8px;
  border-top:1px solid #1A2430;padding-top:8px}
.skFuss a{color:var(--brass)}
.skFuss code{color:#6B7A88}
/* Gradnetz und Äquator */
.sk-netz{fill:none;stroke:#16202E;stroke-width:1}
.sk-aequator{fill:none;stroke:#26384C;stroke-width:1.2;stroke-dasharray:5 4}
/* Sternbilder: gestrichelte Messinglinien — die Bildsprache stammt aus dem
   Entwurf „Codex Stellarum", wo sie schon als .sternbild angelegt war. */
.sk-bild{fill:none;stroke:var(--brass-dim);stroke-width:.8;opacity:.5;stroke-dasharray:3 3}
.sk-stern{fill:var(--star)}
/* Leitsterne: benannt, weil sie die Ziele der Archäoastronomie sind */
.sk-leitring{fill:none;stroke:var(--gold);stroke-width:1.1;opacity:.85}
.sk-leitring.grob{stroke:var(--mittel);stroke-dasharray:2 2;opacity:.6}
.sk-leitname{fill:var(--gold);font:400 12px var(--mono);letter-spacing:.06em}
.sk-leitname.grob{fill:var(--mittel);opacity:.75}
.sk-pol line{stroke:var(--roetel);stroke-width:1.4;opacity:.9}
/* Knopf im Räderwerk */
#skOeffnen{display:block;width:100%;margin-top:9px;padding:7px;
  background:linear-gradient(180deg,#182231,#0C131C);border:1px solid var(--brass-dim);
  color:var(--star-dim);font-family:var(--mono);font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;cursor:pointer;border-radius:2px}
#skOeffnen:hover{border-color:var(--star-dim);color:var(--star)}

/* ── Feldbegehung ───────────────────────────────────────── */
#feld{position:absolute;inset:11px;z-index:20;background:#06090Ef8;display:none;
  flex-direction:column;padding:22px 26px;border:1px solid var(--lth-edge)}
#feld.auf{display:flex}
.fkopf{display:flex;align-items:flex-start;gap:20px;margin-bottom:13px}
.fkopf h2{margin:0;font-family:var(--serif);font-size:27px;color:var(--gold-hi);line-height:1.1}
.fkopf .meta{font-size:10.5px;color:#6B7A88;margin-top:5px;letter-spacing:.06em}
.fkopf .zu{margin-left:auto;background:none;border:1px solid var(--lth-edge);color:var(--perg-dim);
  padding:7px 15px;cursor:pointer;font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.fkopf .zu:hover{border-color:var(--gold);color:var(--perg)}
#fbPanorama{width:100%;flex:1;min-height:230px;max-height:42vh;cursor:crosshair;
  border:1px solid var(--lth-edge);background:#060A11;display:block}
.fb-himmel{fill:#070C15}
.fb-raster{stroke:#152030;stroke-width:1}
.fb-rasterbeschriftung{fill:#38485C;font:400 9px var(--mono)}
.fb-gelaende{fill:#140F09;stroke:none}
.fb-horizontlinie{fill:none;stroke:#6E5833;stroke-width:1.7}
/* Der Horizont-Fächer liegt ganz hinten und bleibt leise: er ist der Rahmen,
   in dem die Ziellinien stehen, nicht ein weiteres Zeichen neben ihnen. */
.fb-faecher-sonne{fill:#E0A33C;opacity:.055}
.fb-faecher-mond {fill:#7FB2E5;opacity:.04}
.fb-strahl{stroke:#E0A33C;stroke-width:.9;opacity:.3}
.fb-ziel{stroke-width:1;stroke-dasharray:3 4;opacity:.55}
.fb-ziel-sonne{stroke:#E0A33C} .fb-ziel-mond{stroke:#7FB2E5}
.fb-zielpunkt{stroke:none;opacity:.95}
circle.fb-ziel-sonne{fill:#E0A33C} circle.fb-ziel-mond{fill:#7FB2E5}
.fb-zielname{fill:#6B7A88;font:400 8.5px var(--mono);letter-spacing:.04em}
.fb-visur{stroke:var(--gold-hi);stroke-width:2}
.fb-visurpunkt{fill:var(--gold-hi)}
.fb-kompassstrich{stroke:#2A3849;stroke-width:1}
.fb-kompass{fill:#4A5B6E;font:400 8.5px var(--mono)}
.fb-kompass-gross{fill:var(--brass);font:600 11px var(--mono);letter-spacing:.1em}
.fzeile{display:flex;gap:18px;align-items:flex-start;margin-top:13px;flex-wrap:wrap}
.fwerte{display:flex;gap:26px;flex-wrap:wrap}
.fw b{display:block;font-size:19px;color:var(--gold-hi);line-height:1.1;font-weight:400;
  font-family:var(--serif)}
.fw span{font-size:8px;letter-spacing:.15em;color:#6B7A88;text-transform:uppercase}
.fsteuer{margin-left:auto;display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.fsteuer button{background:#141C26;border:1px solid var(--lth-edge);color:var(--perg);
  width:34px;height:34px;font-size:15px;cursor:pointer;border-radius:2px}
.fsteuer button:hover{border-color:var(--gold)}
#fbPruef{width:auto;padding:0 26px;background:var(--brass);color:#12100A;border:0;
  letter-spacing:.2em;font-size:10.5px;text-transform:uppercase;font-weight:700;height:34px}
#fbPruef:hover{background:var(--gold)}
.ffaecher{display:flex;align-items:center;gap:6px;font-size:10px;color:#6B7A88;
  letter-spacing:.06em;cursor:pointer}
.ffaecher input{accent-color:var(--brass)}
.ftol{display:flex;align-items:center;gap:8px;font-size:10px;color:#6B7A88}
.ftol input{accent-color:var(--brass);width:92px}
#fbErgebnis{margin-top:13px;min-height:96px;overflow-y:auto}
.fb-warte{color:#6B7A88;font-size:11.5px;padding:13px 0}
.fb-nix{border-left:2px solid var(--lth-edge);padding:11px 15px;font-size:12px;
  color:var(--perg-dim);line-height:1.6}
.fb-treffer{border-left:2px solid var(--brass);padding:11px 15px;max-width:660px}
.fb-treffer.fb-stark{border-left-color:var(--frei)}
.fb-treffer.fb-schwach{border-left-color:var(--verbaut)}
.fb-zeile{display:flex;justify-content:space-between;gap:22px;padding:3px 0;font-size:12px;
  color:var(--perg-dim)}
.fb-zeile b{color:var(--perg);font-weight:500;text-align:right}
.fb-treffer hr{border:0;border-top:1px solid #1A2430;margin:8px 0}
.fb-urteil{margin-top:9px;font-size:13.5px;letter-spacing:.03em;font-family:var(--serif)}
.fb-fuss{margin-top:8px;font-size:10.5px;color:#6B7A88;line-height:1.55}
.gut{color:var(--frei)} .warn{color:var(--verbaut)}
#fbHinweis{color:var(--verbaut);font-size:12px}
/* ═══════════════════════════════════════════════════════════════════════
   LAGEN UND GRÖSSEN

   Hier stand bis zum 16.08. eine einzige Regel, und die hat abgeschaltet:
       @media (max-width:1100px){ #radbox{display:none} #steuer{display:none} }
   Damit fehlten auf JEDEM Tablet die Antikythera und alle zehn Schalter — also
   ausgerechnet das Räderwerk, das neben der Karte liegen soll. Nicht kaputt,
   sondern weggeblendet; das ist der Unterschied, der es so lange überlebt hat.

   ⚠ DIE BREITE ALLEIN TRENNT NICHT. iPhone quer ist 667–932 px breit, iPad
   hochkant 768–834 — die Bereiche überschneiden sich. Was sie trennt, ist die
   HÖHE: quer gehaltene Telefone haben höchstens ~430 px, Tablets über 700.
   Deshalb steht in den Abfragen unten überall eine Höhe.
   ═══════════════════════════════════════════════════════════════════════ */

/* Die zwei Messingknöpfe. Sie erscheinen erst, wenn kein Platz mehr für die
   dauerhaft sichtbaren Tafeln ist — am Schreibtisch bleiben sie fort. */
#kopfSchalter{display:none;gap:8px;margin-left:auto;align-self:flex-start}
#kopfSchalter button{background:linear-gradient(180deg,#241A12ee,#120D09ee);
  border:1px solid var(--lth-edge);color:var(--brass);border-radius:2px;
  width:46px;height:46px;font-size:19px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center}
#kopfSchalter button[aria-expanded="true"]{border-color:var(--gold);color:var(--gold-hi)}

/* Schließbalken der Steuerung — nur auf Auszug-Größen sichtbar. Ohne ihn gäbe
   es auf dem Tablet keinen Weg zurück: Esc gibt es dort nicht. */
#steuerZu{display:none;width:100%;margin:-4px 0 10px;padding:9px;background:none;
  border:0;border-bottom:1px solid #1A2430;color:var(--brass);cursor:pointer;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase}

/* ── unter 1100 px: Tafeln werden zu Auszügen ─────────────────────────── */
@media (max-width:1100px){
  #kopfSchalter{display:flex}
  #steuerZu{display:block}
  #kopf{flex-wrap:wrap;gap:14px 18px;padding:12px 14px 24px}
  .marke{font-size:24px}

  /* Steuerung: Auszug von rechts statt Tafel unten links. Der Inhalt bleibt
     unangetastet — es ändert sich nur, wo die Tafel steht. */
  #steuer{left:auto;right:0;bottom:auto;top:0;height:100%;width:min(320px,88vw);
    max-height:none;border-radius:0;border-width:0 0 0 1px;padding:16px 18px;
    transform:translateX(103%);transition:transform .24s cubic-bezier(.4,0,.2,1);
    z-index:16;overflow-y:auto}
  #steuer.auf{transform:none}

  /* Das Räderwerk ruht und erscheint im schon vorhandenen .gross-Modus —
     derselbe Zustand, dieselbe Bedienung, kein zweites Rad. */
  #radbox{display:none}
  #radbox.gross{display:block}

  /* 100 % wären auf dem Tablet die ganze Bühne. Das Dossier ist ein Blatt,
     kein Vollbild — die Karte daneben soll sichtbar bleiben. */
  #dossier{width:min(430px,92vw)}
}

/* ── Telefon quer: jede Zeile zählt ───────────────────────────────────── */
@media (max-height:500px){
  #kopf{gap:10px;padding:8px 12px 18px}
  .marke{font-size:18px;letter-spacing:.22em}
  .marke small{display:none}
  .zahlen{display:none}          /* vier Zähler, für die es hier keine Zeile gibt */
  #kopfSchalter button{width:40px;height:40px;font-size:17px}
  #steuer{width:min(300px,74vw);padding:12px 14px}
  #buehne{padding:5px} #karte{inset:5px}
  #kompass{bottom:6px;gap:6px}
  #kompassRose{width:78px;height:78px}
  .kzoom button{width:21px;height:21px;font-size:12px}
  #skFeld,#feld,#lesesaal{inset:5px}
  /* ⚠ Das Dossier bekommt KEIN inset. Es ist ein rechts verankerter Auszug, und
     `inset` setzt auch die linke Kante — sind links, rechts und Breite zugleich
     gesetzt, gewinnt links, die Schublade hängt an der falschen Seite und ihr
     translateX(103%) schiebt sie mitten ins Bild statt hinaus. Gemessen am
     16.08.: stand 396 px weit offen, ohne dass jemand sie geöffnet hätte. */
  #dossier{top:5px;bottom:5px;right:0;left:auto;padding:0 5px 0 0}
  #skFeld{padding:10px 14px 8px} #feld{padding:12px 16px}
  .skKopf h2,.fkopf h2{font-size:17px}
}

/* ── Telefon hochkant: die Sperrplatte ────────────────────────────────── */
/* Ein echtes Erzwingen der Lage gibt es im Browser nicht — Safari kennt
   screen.orientation.lock() nicht, und das Manifest greift nur bei installierten
   Anwendungen. Was überall trägt, ist diese Platte: Sie liegt über allem, und
   die Seite bleibt bis zur Drehung unbenutzbar. Für den Benutzer ist das
   dasselbe wie Zwang; der Lock in chronos-karte.js ist nur die Zugabe. */
#querplatte{display:none;position:fixed;inset:0;z-index:9999;
  background:radial-gradient(ellipse 80% 60% at 50% 38%,#241A12,#120D09 72%);
  color:var(--perg-dim);text-align:center;padding:8vh 9vw;
  flex-direction:column;align-items:center;justify-content:center;gap:22px}
#querplatte svg{width:min(38vw,160px);height:auto;
  animation:kippen 3.4s cubic-bezier(.6,0,.4,1) infinite}
@keyframes kippen{0%,42%{transform:rotate(0)}58%,100%{transform:rotate(-90deg)}}
#querplatte h1{font-family:var(--serif);font-size:clamp(22px,7vw,32px);
  letter-spacing:.26em;margin:0;
  background:linear-gradient(180deg,var(--gold-hi),var(--brass));
  -webkit-background-clip:text;background-clip:text;color:transparent}
#querplatte p{margin:0;font-size:clamp(13px,3.9vw,16px);line-height:1.65;max-width:26em}
#querplatte .klein{font-size:clamp(10px,2.9vw,12px);color:#6B7A88;line-height:1.6}

@media (orientation:portrait) and (max-width:700px){
  #querplatte{display:flex}
  /* Was darunter liegt, wird nicht nur verdeckt, sondern stillgelegt: sonst
     scrollt und lädt die Karte hinter der Platte weiter. */
  body>*:not(#querplatte){visibility:hidden}
  body{overflow:hidden}
}

/* ── Finger statt Zeiger ──────────────────────────────────────────────── */
/* Nach der EINGABEART gefragt, nicht nach der Breite: Ein Touch-Bildschirm am
   Schreibtisch bekäme sonst weiter 13-px-Kästchen, und ein schmales Fenster
   mit Maus unnötig fette. */
@media (pointer:coarse){
  .zeile{margin:2px 0;padding:7px 0;font-size:13px;min-height:44px}
  .zeile input[type=checkbox]{width:22px;height:22px;flex:none}
  .zeile i{font-size:11px}
  .regler{margin:14px 0 6px;font-size:13px}
  .regler input[type=range]{height:34px}
  #grundKnopf,.nachweis,.dknopf,.dmehr,#skOeffnen,#leyDrehen{min-height:44px;font-size:11px}
  .hinweis{font-size:11px}
  #treffer div{padding:12px 14px;font-size:13px}
  .dzu,.lsZu,.fkopf .zu{width:44px;height:44px;font-size:20px}
}

/* ══════════════════════════════════════════════════════════════════════════
   Ehemalige style="…"-Attribute (#1008, 2026-09-06)
   Die CSP verbietet Style-ATTRIBUTE. Werte 1:1 uebernommen, damit die Seite
   gleich aussieht. Diese Regeln stehen bewusst AM ENDE: `.hinweis` (Z.116)
   setzt margin-top/border-top/padding-top selbst — bei gleicher Spezifitaet
   (010) gewinnt die spaeter definierte Regel. `.pkt` setzt KEIN background,
   dort gibt es gar keine Konkurrenz (beides nachgemessen).
   Die vier ID-Elemente tragen ID-Selektoren (100), damit sie unabhaengig von
   der Reihenfolge greifen.
   ══════════════════════════════════════════════════════════════════════════ */
.pkt-gold      { background:var(--gold) }
.pkt-goldhell  { background:var(--gold-hi) }
.pkt-blau      { background:#7FB2E5 }
.pkt-roetel    { background:var(--roetel) }
.pkt-violett   { background:#8A6ABF }
.pkt-lila      { background:#B07AD8 }
.pkt-blaugrau  { background:#7A9AD8 }
.pkt-verlauf-zustand { background:linear-gradient(90deg,var(--frei),var(--verbaut)) }
.pkt-verlauf-zeit    { background:linear-gradient(90deg,var(--mittel),#7FB2E5) }

/* „schliesst oben an" — kein Trennstrich, kein Innenabstand, nur der Aussenabstand */
.hinweis-anschluss { border-top:0; padding-top:0 }
.hinweis-abstand6  { margin-top:6px }
.hinweis-abstand7  { margin-top:7px }
.hinweis-abstand8  { margin-top:8px }
.regler-anschluss  { margin-top:0 }

#himmelTafel    { display:none; margin-top:10px; border-top:1px solid #1A2430; padding-top:9px }
#himmelDrehWert { float:right; color:var(--brass) }
#himmelWerte    { margin-top:7px; color:var(--perg-dim) }
#manifestFehlt  { margin-top:8px; border-top:0; padding-top:0; color:var(--verbaut); display:none }
#modusFehlt     { margin-top:8px; border-top:0; padding-top:0; color:var(--verbaut); display:none }

/* ── Ehemals in chronos-karte.js erzeugte style="…"-Attribute (#1008) ──────
   Werte 1:1 uebernommen. Die EINE gerechnete Farbe (ART_FARBE je Ebene) geht
   weiterhin dynamisch, aber ueber das CSSOM statt als Attribut. */
.t-leer        { color:#6B7A88; cursor:default }
.ort-zweitname { opacity:.75 }
.t-quelle      { color:#8A5A2A }
.t-fussnote      { font-size:12.5px; color:#6B5836 }
.t-fussnote-warn { font-size:12.5px; color:#9E3A2A }
.t-abstand       { margin-top:9px }
.t-messwerte   { font-family:var(--mono); font-size:9px; color:#8A7346; margin-top:8px }
.t-schwach     { opacity:.7 }
.t-schwach2    { opacity:.8 }
.t-gold        { color:var(--gold) }
.t-warn        { color:var(--verbaut) }