/* Time Council · Leseseiten (sabische Symbole, Gradseiten, Impressum, Datenschutz).
   Hell wie timecouncil.de: Papier, Drachenblau, Kupfer (Muster B, Vikram 02.10.2026). Dunkel sind nur die Räume
   für Horoskop und Karten. Die Farbwerte selbst stehen in rahmen/rahmen.css, hier nur ihre Rollen. */
@font-face{font-family:"Source Sans 3";src:url("sabian/schriften/source-sans-3-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("sabian/schriften/source-sans-3-latin-600-normal.woff2") format("woff2");font-weight:600;font-display:swap}
:root{
  --nacht:var(--tc-papier);--tisch:#fffdf8;--tisch-2:var(--tc-flaeche);--linie:var(--tc-linie);
  --gold:var(--tc-kupfer);--gold-hell:var(--tc-tinte);--text:var(--tc-text);--text-2:var(--tc-leise);
  --display:var(--tc-titel);--titel:var(--tc-titel);--lese:var(--tc-lese);color-scheme:light}
html{font-size:20px;-webkit-text-size-adjust:100%}
@media (min-width:760px){html{font-size:21px}}
/* Vikram, 06.10.2026: Am Rechner stehen die Lesetexte kleiner als bisher (21 Pixel). Es sind 20 und nicht 19 Pixel geworden, weil bei 19 die kleinen
   Beschriftungen (0.9rem) unter die Grenze von 18 Pixel fielen. Handy und Tablet bleiben, wie sie sind. */
@media (min-width:1000px){html{font-size:20px}}
*{box-sizing:border-box}
body{margin:0;background:var(--nacht);background-image:radial-gradient(1100px 620px at 78% 260px,#fffdf8 0,rgba(255,253,248,0) 70%);
  color:var(--text);font-family:var(--lese);font-size:1rem;line-height:1.7;font-synthesis:none}
a{color:var(--gold-hell);text-decoration-color:var(--gold);text-underline-offset:3px}
:focus-visible{outline:2px solid var(--gold-hell);outline-offset:3px;border-radius:4px}
.huelle{max-width:1080px;margin:0 auto;padding:0 16px}
.kopf{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 0;border-bottom:1px solid var(--linie)}
.marke{font-family:var(--display);font-weight:600;letter-spacing:.18em;color:var(--gold-hell);text-decoration:none;font-size:1.1rem}
.kopf nav{display:flex;gap:18px;flex-wrap:wrap}
.kopf nav a{font-family:var(--lese);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:.9rem;color:var(--text-2);text-decoration:none}
.kopf nav a:hover{color:var(--gold-hell)}
@media (max-width:600px){.kopf{flex-direction:column;align-items:flex-start;gap:6px}.kopf nav{gap:4px 18px}}
.fuss{border-top:1px solid var(--linie);margin-top:64px;padding:26px 0 40px;color:var(--text-2);display:flex;flex-wrap:wrap;gap:10px 26px;justify-content:space-between}
.fuss a{color:var(--text-2)}
h1,h2,h3{font-family:var(--titel);font-weight:400;line-height:1.25;text-wrap:balance;color:var(--gold-hell)}
.knopf{display:inline-block;background:var(--gold-hell);color:var(--nacht);border:1px solid var(--gold-hell);padding:12px 28px;font-family:var(--lese);
  font-weight:600;letter-spacing:.05em;font-size:.95rem;text-decoration:none;box-shadow:0 0 0 4px var(--nacht),0 0 0 5px var(--gold)}
.knopf.zart{background:transparent;color:var(--gold-hell);border:1px solid var(--gold);box-shadow:none}
.recht{max-width:42rem;margin:40px auto 0}
.recht h1{font-size:1.6rem;color:var(--gold-hell)}
.recht h2{font-size:1.15rem;color:var(--gold-hell);margin-top:30px}
img{max-width:100%;height:auto}
/* Leseseiten: Einführung „Die sabischen Symbole“ */
.lesen{max-width:40rem;margin:40px auto 0}
.ueberzeile{font-family:var(--lese);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:.9rem;color:var(--gold);margin:0 0 6px}
.lesen h1{font-size:clamp(1.7rem,6vw,2.3rem);color:var(--gold-hell);margin:0 0 16px}
.lesen h2{font-size:1.3rem;color:var(--gold-hell);margin:40px 0 10px}
.lesen .leit{font-family:var(--titel);font-size:1.15rem;line-height:1.55}
.dreibild{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:26px 0 0}
.dreibild img{display:block;width:100%;border-radius:8px;border:1px solid var(--linie)}
.teile{padding-left:1.1em;margin:0 0 18px}
.teile li{margin:0 0 8px}
.teile b{color:var(--gold-hell);font-weight:600}
.knoepfe{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 0}
.frage{border-bottom:1px solid var(--linie)}
.frage:first-child{border-top:1px solid var(--linie)}
.frage summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;padding:18px 2px;min-height:56px;
  font-family:var(--titel);font-weight:600;font-size:1.1rem;line-height:1.35;color:var(--text)}
.frage summary::-webkit-details-marker{display:none}
.frage summary::after{content:"+";font-family:var(--display);font-size:1.4rem;line-height:1;color:var(--gold)}
.frage[open] summary::after{content:"−"}
.frage[open] summary{color:var(--gold-hell)}
.frage div{padding:0 2px 18px}
.frage p{margin:0}
/* Gradseiten (/sabian/grad/…), erzeugt von gradseiten.py */
.grad{display:grid;grid-template-columns:minmax(0,1fr);gap:26px;margin-top:30px}
@media (min-width:900px){.grad{grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:44px;align-items:start}.grad .bilder{position:sticky;top:20px}}
.grad .bilder{display:grid;gap:14px;max-width:420px;margin:0 auto;width:100%}
.grad figure{margin:0}
.grad .bildlink{display:block;cursor:zoom-in}
.grad .bildlink img{display:block;width:100%;border-radius:12px;border:1px solid var(--linie);box-shadow:0 14px 34px rgba(27,36,82,.28)}
.grad figcaption{color:var(--text-2);text-align:center;margin-top:4px}
.grad .text{min-width:0;max-width:40rem}
.grad .ort{font-family:var(--lese);font-weight:600;text-transform:uppercase;letter-spacing:.12em;font-size:.9rem;color:var(--gold);margin:0 0 6px}
.grad h1{font-size:clamp(1.45rem,4.4vw,1.8rem);margin:0 0 16px}
.arcanum{background:var(--tisch);border-left:3px solid var(--gold);border-radius:0 10px 10px 0;padding:12px 16px;margin:0 0 26px;font-size:1.05rem}
.arcanum b{display:block;font-family:var(--lese);font-weight:600;text-transform:uppercase;letter-spacing:.12em;font-size:.9rem;color:var(--gold);margin-bottom:2px}
.abschnitt{margin:0 0 24px}
/* Am Computer Kartentext in 19 px wie in der App; Überschriften bleiben (Vikram, 06.10.2026). */
@media (min-width:1000px){.grad .text{font-size:19px}.grad .text .arcanum{font-size:20px}}
.abschnitt h2{font-size:1.2rem;color:var(--gold-hell);margin:0 0 6px;display:flex;align-items:center;gap:12px}
.abschnitt h2::after{content:"";flex:1;height:1px;background:var(--linie)}
.abschnitt p{margin:0 0 12px;overflow-wrap:break-word}
.kraft{border:1px solid var(--gold);border-radius:12px;padding:16px 20px;margin:4px 0 0;text-align:center}
.kraft b{display:block;font-family:var(--lese);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:.9rem;color:var(--gold);margin-bottom:4px}
.kraft p{margin:0;font-family:var(--titel);font-size:1.15rem;line-height:1.5;color:var(--gold-hell)}
.platztext{color:var(--text-2)}
.blaettern{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin:40px 0 0;border-top:1px solid var(--linie);padding-top:20px}
.blaettern a{display:block;text-decoration:none;border:1px solid var(--linie);border-radius:12px;padding:12px 14px;background:var(--tisch);color:var(--text);min-width:0;overflow-wrap:break-word}
.blaettern a b{display:block;font-family:var(--lese);font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:.9rem;color:var(--gold)}
.blaettern a:last-child{text-align:right}
.zum-gespraech{margin:26px 0 0;padding-top:18px;border-top:1px solid var(--linie)}
.wege-zeile{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 0}
.gross{position:fixed;inset:0;z-index:10;background:rgba(5,8,16,.94);display:grid;place-items:center;padding:12px;cursor:zoom-out;border:0;width:100%}
.gross[hidden]{display:none}
.gross img{max-width:100%;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);border-radius:10px}
/* Übersicht aller Grade */
.zeichenleiste{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 10px}
.zeichenleiste a{border:1px solid var(--linie);border-radius:999px;padding:8px 16px;text-decoration:none;font-family:var(--lese);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:.9rem;color:var(--text-2)}
.zeichenblock h2{font-size:1.3rem;color:var(--gold-hell);margin:44px 0 10px;scroll-margin-top:16px}
.gradliste{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:0 22px}
.gradliste a{display:grid;grid-template-columns:2.2em 1fr;gap:8px;padding:10px 2px;border-bottom:1px solid var(--linie);text-decoration:none;color:var(--text)}
.gradliste a span:first-child{font-family:var(--display);font-weight:600;color:var(--gold);font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Kleiner Knopf und Ortswahl (Astrouhr, Mein Bereich; Vikram, 06.10.2026: Knöpfe auf das Maß der übrigen Seite) */
.knopf.klein{padding:8px 20px;font-size:.9rem;box-shadow:none;cursor:pointer}
.ortwahl label{display:block;font-weight:600;color:var(--gold-hell);margin:0 0 6px}
.ortwahl .ow-feld{position:relative}
.ortwahl input{display:block;width:100%;font:inherit;padding:10px 12px;border:1px solid var(--tc-linie);background:#fff;color:var(--text);border-radius:0}
.ortwahl .ow-hinweis{margin:8px 0 0;color:var(--text-2)}
.vorschlaege{position:absolute;left:0;right:0;top:100%;z-index:5;list-style:none;margin:4px 0 0;padding:4px;background:#fff;border:1px solid var(--tc-kupfer);
  max-height:320px;overflow:auto;box-shadow:0 10px 24px rgba(27,36,82,.14);text-align:left}
.vorschlaege li{padding:9px 12px;cursor:pointer;line-height:1.35}
.vorschlaege li small{display:block;font-size:.9rem;color:var(--text-2)}
.vorschlaege li[aria-selected="true"],.vorschlaege li:hover{background:var(--tc-flaeche)}

/* Das Mondband (Vikram, 07.10.2026): steht auf der Startseite und auf der Astrouhr-Seite und führt in den Mondkalender. */
.mondband{display:flex;align-items:center;gap:34px;max-width:860px;margin:30px auto 70px;padding:26px 34px;background:var(--tc-tinte);color:#f1ece1;text-decoration:none;border:1px solid var(--tc-kupfer);outline:1px solid rgba(201,168,92,.35);outline-offset:-7px}
.mondband:hover,.mondband:focus-visible{background:#1d2748}
.mondband:focus-visible{outline:2px solid #ead9a6;outline-offset:3px}
.mb-monde{display:flex;align-items:center;gap:6px;flex:none;min-height:84px}
.mb-monde figure{margin:0;text-align:center}.mb-monde figcaption{font-size:.9rem;color:#c9cad6;margin-top:2px}
.mb-text{display:flex;flex-direction:column;gap:6px;min-width:0}
.mb-kicker{font-size:.9rem;letter-spacing:.14em;text-transform:uppercase;color:#e1b78a}
.mb-text strong{font:600 1.5rem/1.25 var(--tc-titel,Georgia,serif);color:#ead9a6}
.mb-weiter{margin-top:6px;font-weight:600;color:#ead9a6}.mb-weiter::after{content:" \203A"}
@media (max-width:860px){.mondband{flex-direction:column;text-align:center;gap:20px;padding:26px 22px;margin-inline:16px}.mb-monde{justify-content:center}}
