:root{--bg-desktop:#1c1b20;--bg-paper:#232229;--bg-subtle:#2b2a33;--bg-page:#1f1e25;--text-ink:#f0ede4;--text-body:#e8e3da;--text-muted:#b0a89b;--accent:#cd4b44;--accent-gold:#cbaa5c;--accent-warm:#d07848;--rule:#44424a;--shadow-soft:rgba(0,0,0,0.15);--shadow-med:rgba(0,0,0,0.25);--header-bg:rgba(30,30,36,0.85);--header-bg-solid:rgba(30,30,36,0.95);--btn-primary-bg:#cd4b44;--btn-primary-hover:#a83030;--radius:2px;--font-display:'Cormorant Garamond','Source Serif 4',Georgia,serif;--font-body:'Source Serif 4',Georgia,serif;--font-mono:'JetBrains Mono','Fira Code',monospace;--banner-h:0px;--header-h:calc(56px + var(--banner-h))}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{font-size:110%;scroll-behavior:auto;overflow-x:hidden}body{font-family:var(--font-body);font-size:1.0625rem;line-height:1.72;color:var(--text-body);background:var(--bg-desktop);-webkit-font-smoothing:antialiased}a{color:var(--accent);text-decoration:none}.skip-link{position:absolute;top:-100%;left:1rem;z-index:9999;padding:0.6rem 1.2rem;background:var(--accent);color:var(--bg-paper);font-family:var(--font-body);font-size:0.85rem;border-radius:var(--radius);text-decoration:none;transition:top 0.15s}.skip-link:focus{top:0.5rem}:focus-visible{outline:2px solid var(--accent-gold);outline-offset:2px}input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent-gold);outline-offset:0}a:hover{text-decoration:underline}.small-caps{font-variant:small-caps;letter-spacing:0.14em;font-weight:500}.site-header{position:fixed;top:var(--banner-h);left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 2rem;background:var(--bg-desktop);border-bottom:1px solid var(--rule);transition:background 0.4s,box-shadow 0.4s,top 0.2s} .promo-banner{position:fixed;top:0;left:0;right:0;z-index:250;display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;padding:0.5rem 2.6rem;background:var(--bg-subtle);border-bottom:1px solid var(--rule);font-size:0.78rem;color:var(--text-body);text-align:center} .promo-banner p{margin:0;line-height:1.4} .promo-banner-compact{display:none} .promo-banner a{color:var(--accent-gold);font-weight:600;white-space:nowrap} .promo-banner-bar{width:5rem;height:4px;background:var(--rule);border-radius:2px;overflow:hidden;flex:0 0 auto} .promo-banner-bar-fill{height:100%;background:var(--accent-gold);border-radius:2px} .promo-banner-close{position:absolute;right:0.6rem;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--text-muted);font-size:1.05rem;line-height:1;cursor:pointer;padding:0.4rem;font-family:inherit} .promo-banner-close:hover{color:var(--text-body)} @media (max-width:480px){.promo-banner{padding:0.5rem 2.2rem;font-size:0.72rem}.promo-banner-bar{display:none}.promo-banner-full{display:none}.promo-banner-compact{display:inline}}.site-title{display:flex;flex-direction:column;text-decoration:none;line-height:1.2} .site-title:hover{text-decoration:none}.site-title-eyebrow{font-size:0.5rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--text-muted);font-family:var(--font-body)}.site-title-main{font-family:var(--font-display);font-size:1.1rem;font-weight:400;color:var(--text-ink);letter-spacing:0.04em}.sitenav ul{list-style:none;display:flex;gap:1.6rem}.sitenav a{font-size:0.78rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-muted);text-decoration:none;transition:color 0.2s}.sitenav a:hover,.sitenav a.current{color:var(--accent)}.site-footer{display:flex;justify-content:space-between;align-items:center;padding:2rem;font-size:0.78rem;color:var(--text-muted);border-top:1px solid var(--rule);background:var(--bg-paper)}.site-footer nav{display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem}.site-footer a{color:var(--text-muted)}.site-footer a:hover{color:var(--accent)}.error-page{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - var(--header-h) - 6rem);padding:calc(var(--header-h) + 2rem) 2rem 2rem;text-align:center}.error-content{max-width:28rem}.error-code{font-family:var(--font-display);font-size:clamp(4rem,12vw,7rem);font-weight:300;color:var(--rule);line-height:1;margin-bottom:0.5rem}.error-title{font-family:var(--font-display);font-size:1.4rem;font-weight:400;color:var(--text-ink);margin-bottom:0.8rem}.error-text{font-size:0.92rem;color:var(--text-muted);margin-bottom:2rem;line-height:1.6}.error-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.reader-layout{display:grid;grid-template-columns:260px 1fr;min-height:100vh;padding-top:var(--header-h)}.reader-sidebar{position:sticky;top:var(--header-h);height:calc(100vh - var(--header-h));overflow-y:auto;padding:1.8rem 1.2rem;border-right:1px solid var(--rule);background:var(--bg-paper);scrollbar-width:none;-ms-overflow-style:none}.reader-sidebar::-webkit-scrollbar{display:none}.toc-list{list-style:none}.toc-list li{margin-bottom:0.35rem}.toc-list li a{font-size:0.82rem;color:var(--text-body);text-decoration:none;line-height:1.45;display:block;transition:color 0.15s}.toc-list li a:hover{color:var(--accent-gold)}.toc-list li[data-level="1"]{margin-top:1rem}.toc-list li[data-level="1"] a{font-weight:400;color:var(--text-ink);color:color-mix(in oklab,var(--accent-gold) 55%,var(--text-ink));font-size:0.84rem;letter-spacing:0.04em}.toc-list li[data-level="2"]{padding-left:0.6rem}.toc-list li[data-level="2"] a{font-size:0.82rem;color:var(--text-ink);opacity:0.92}.toc-list li[data-level="3"]{padding-left:1.2rem}.toc-list li[data-level="3"] a{font-size:0.8rem;color:var(--text-ink);opacity:0.85}.toc-list li[data-level="4"]{padding-left:1.8rem}.toc-list li[data-level="4"] a{font-size:0.78rem;color:var(--text-body);opacity:0.82}.toc-list li[data-level="5"]{padding-left:2.4rem}.toc-list li[data-level="5"] a{font-size:0.76rem;color:var(--text-body);opacity:0.78}.toc-list li[data-level="6"]{padding-left:3.0rem}.toc-list li[data-level="6"] a{font-size:0.74rem;color:var(--text-body);opacity:0.75} /* Ebenen 7 bis 9. Der Leser rechnet ausdruecklich bis neun — so tief geht die Gliederung der Kritik der reinen Vernunft —, das Blatt hoerte aber bei sechs auf. 102 Eintraege im Korpus (53 allein in AA III, 30 in AA IV, 17 in AA VI) standen darum ohne Einrueckung buendig links und sahen aus wie Werktitel, obwohl sie vier Stufen tiefer stehen. Schrittweite und Verlauf wie oben fortgesetzt. */ .toc-list li[data-level="7"]{padding-left:3.6rem} .toc-list li[data-level="7"] a{font-size:0.72rem;color:var(--text-body);opacity:0.72} .toc-list li[data-level="8"]{padding-left:4.2rem} .toc-list li[data-level="8"] a{font-size:0.71rem;color:var(--text-body);opacity:0.70} .toc-list li[data-level="9"]{padding-left:4.8rem} .toc-list li[data-level="9"] a{font-size:0.70rem;color:var(--text-body);opacity:0.68} /* Der Hover stand als `.toc-list li a:hover` weiter oben und war damit tot: gleiche Spezifitaet wie die Ebenenregeln, aber frueher im Blatt -- und da jeder Eintrag ein `data-level` traegt, gewann immer die Ebene. Im Verzeichnis zeigte darum nichts mehr an, dass die Zeilen anklickbar sind. Die Ebene im Selektor hebt die Spezifitaet ueber die Ebenenregeln. */ .toc-list li[data-level] a:hover{color:var(--accent-gold);opacity:1} /* Was nicht anklickbar ist, soll auch nicht so aussehen. `toc-divider` als `` ist eine Zwischenueberschrift ohne Ziel, `toc-orphan` ein Verweis auf eine Seite ausserhalb der Erfassung -- der traegt ein `title` und darf den Fragezeichen-Zeiger zeigen. */ .toc-list li span.toc-divider{cursor:default}.toc-list li .toc-orphan{cursor:help} .toc-list li.toc-active > a,.toc-list li.toc-active > .toc-divider{color:var(--accent) !important;opacity:1 !important}.toc-list li.toc-active{border-left:2px solid var(--accent-gold);padding-left:calc(0.6rem - 2px);margin-left:-2px}.toc-list li.toc-active[data-level="1"]{padding-left:calc(0rem - 2px);margin-left:-2px}.toc-list li.toc-active[data-level="3"]{padding-left:calc(1.2rem - 2px)}.toc-list li.toc-active[data-level="4"]{padding-left:calc(1.8rem - 2px)}.toc-list li.toc-active[data-level="5"]{padding-left:calc(2.4rem - 2px)}.toc-list li.toc-active[data-level="6"]{padding-left:calc(3.0rem - 2px)}.toc-orphan{color:var(--text-muted);opacity:0.5;font-size:0.78rem} /* Anmerkung der Herausgeber im gedruckten Verzeichnis -- kein Titel, kein Ziel. */ .toc-list li .toc-notiz{cursor:default} .toc-notiz{display:block;color:var(--text-muted);opacity:0.6;font-size:0.74rem;line-height:1.45;font-style:italic;letter-spacing:0}.toc-divider{color:var(--accent-gold);font-weight:400;letter-spacing:0.03em;text-decoration:none;display:block;transition:color 0.15s}a.toc-divider:hover{color:var(--accent-gold)}.toc-list li[data-level="1"] .toc-divider{font-size:0.84rem}.toc-list li[data-level="2"] .toc-divider{font-size:0.82rem;opacity:0.92}.text-content{padding:2rem 3rem;max-width:76rem;width:100%;margin:0 auto;min-width:0}.text-content h2{font-family:var(--font-display);font-size:1.6rem;font-weight:500;color:var(--text-ink);margin-bottom:0.5rem}.reader-sticky-bar{position:sticky;top:var(--header-h);z-index:100;background:var(--bg-desktop);padding:0 3rem;margin-left:-3rem;margin-right:-3rem;margin-top:-2rem}.reader-sticky-bar #reader-summary{margin-bottom:0.4rem}.reader-sticky-bar #reader-summary h2{font-size:1.25rem;margin-bottom:0.1rem}.reader-toolbar{display:flex;flex-wrap:nowrap;gap:1.2rem;align-items:center;margin:0;padding:0.45rem 0;border-bottom:1px solid var(--rule);font-size:0.82rem;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.reader-toolbar::-webkit-scrollbar{display:none}.toolbar-row1{display:contents}.toolbar-left{display:contents}#search-syntax-knopf{min-width:2.1rem;text-align:center}#inline-search-go{display:none;min-width:2.1rem;text-align:center}.toolbar-group{display:flex;align-items:center;gap:0.4rem;white-space:nowrap;flex-shrink:0}.toolbar-group .small-caps{font-size:0.58rem;color:var(--text-muted)}.toolbar-search{flex:2;min-width:12rem;flex-shrink:1}.toolbar-end{margin-left:auto}.toolbar-group select,.toolbar-group input{font-family:var(--font-body);font-size:0.85rem;padding:0.25rem 0.5rem;border:1px solid var(--rule);border-radius:3px;background:var(--bg-page);color:var(--text-body)}.btn-classic{font-family:var(--font-body);font-size:0.78rem;padding:0.3rem 0.8rem;border:1px solid var(--rule);border-radius:3px;background:var(--bg-paper);color:var(--text-body);cursor:pointer;transition:all 0.2s}.btn-classic:hover{background:var(--bg-subtle);border-color:var(--accent-gold)}.cookie-notice{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:900;max-width:44rem;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:1rem;padding:1rem 1.2rem;background:var(--bg-paper);border:1px solid var(--rule);border-radius:var(--radius);box-shadow:0 6px 24px var(--shadow-med);opacity:0;transform:translateY(0.6rem);transition:opacity 0.25s,transform 0.25s} .cookie-notice.is-shown{opacity:1;transform:none} .cookie-notice-text{flex:1 1 20rem;margin:0;font-size:0.8rem;line-height:1.55;color:var(--text-muted)} .cookie-notice-text a{color:var(--accent)} .cookie-notice-ok{flex:0 0 auto;font-family:var(--font-body);font-size:0.78rem;letter-spacing:0.06em;padding:0.4rem 1.1rem;border:1px solid var(--accent-gold);border-radius:3px;background:transparent;color:var(--text-ink);cursor:pointer;transition:background 0.2s} .cookie-notice-ok:hover{background:var(--bg-subtle)} @media (max-width:32rem){.cookie-notice{flex-direction:column;align-items:stretch}.cookie-notice-ok{width:100%}} .footer-by{display:block;margin-top:0.35rem;font-size:0.72rem;letter-spacing:0.02em;color:var(--text-muted);opacity:0.82} .lp-footer .footer-by{margin-top:0.6rem} .beta-badge{display:inline-block;margin-left:0.55rem;padding:0.08em 0.45em;border:1px solid var(--accent-gold);border-radius:2px;font-family:var(--font-mono);font-size:0.52rem;line-height:1.5;letter-spacing:0.08em;text-transform:uppercase;color:var(--accent-gold);vertical-align:middle;white-space:nowrap} .inline-search-wrap{position:relative;display:flex;align-items:center;flex:1;min-width:0}.inline-search-wrap input{width:100%;flex:1;min-width:0;padding-right:6.5rem} /* Trefferzaehler. Am Schreibtisch liegt er im Suchfeld, wie gehabt, mit deckendem Hintergrund -- sobald gesucht ist, darf er den eingetippten Text ueberdecken, das war nie das Problem. Das Problem war der *leere* Zaehler: er trug Polsterung und Hintergrund und stand als undurchsichtiges Kaestchen ueber dem Platzhalter, bevor ueberhaupt gesucht war. `:empty` nimmt ihn darum ganz weg, und solange er weg ist, muss das Feld rechts auch keinen Platz fuer ihn freihalten. */ .inline-search-count{position:absolute;right:0.5rem;font-family:var(--font-mono);font-size:0.65rem;color:var(--text-muted);pointer-events:none;background:var(--bg-page);padding:0.1rem 0.3rem;border-radius:2px;max-width:6rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .inline-search-count:empty{display:none} .inline-search-wrap:has(.inline-search-count:empty) input{padding-right:0.5rem} /* Auf dem Handy ist das Feld zu schmal, als dass der Zaehler darin liegen koennte, ohne die Eingabe zu verdecken. Dort haengt er stattdessen als kleines Fenster rechts unter der Werkzeugleiste -- unter `?` und Zahnrad. Bezugsrahmen ist die Leiste selbst (`.reader-toolbar{position:relative}` weiter oben), darum braucht es keine geratenen Abstaende. */ @media (max-width:768px){ .inline-search-wrap{position:static} .inline-search-wrap input{padding-right:0.5rem} /* Auf dem Handy trägt die Suchgruppe genau einen Knopf: den Suchknopf. Die Syntaxhilfe weicht -- sie erklaert eine Abfragesprache, die auf einer Bildschirmtastatur ohnehin niemand tippt, und jeder Knopf mehr geht von der Breite des Feldes ab. */ #search-syntax-knopf{display:none} #inline-search-go{display:inline-block} .inline-search-count{top:calc(100% + 0.35rem);right:0;z-index:120;font-size:0.62rem;line-height:1;max-width:calc(100vw - 2rem);background:var(--bg-paper);border:1px solid var(--rule);border-radius:var(--radius);box-shadow:0 2px 10px var(--shadow-soft);padding:0.3rem 0.55rem} }mark.search-hit{background:rgba(203,170,92,0.45);color:inherit;border-radius:2px;padding:0}mark.search-hit-active{background:var(--accent-gold);color:var(--bg-paper)}.jump-input-group input{width:4rem;text-align:center}.reader-toolbar .small-caps{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.page-card{margin-bottom:0}/* Seitenumbruch. Er faellt fast nie mit einem Satzende zusammen — ueber alle Baende schneiden 84-88 % der Fugen mitten in den Satz. Eine Linie quer durch die Spalte behauptet dort eine Zaesur, die der Text nicht hat, und die 4,6rem Weissraum darum machen aus einem Koordinatenwechsel ein Ereignis. Statt dessen traegt die Fuge ein kurzes Haarstrichlein in einer Atempause (2,25rem statt 4,6rem Weissraum plus Linie), und die Seitenziffer haengt im Rand auf Hoehe der ersten Zeile ihrer Seite. Sichtbar bleibt der Umbruch damit deutlich — nur zerschneidet er die Spalte nicht mehr. */ .page-divider{position:relative;height:3.5rem;margin:0;scroll-margin-top:calc(var(--header-h) + 5rem);user-select:none;-webkit-user-select:none}.page-divider:first-child{height:0} /* Der Absatzabstand der letzten Zeile einer Seite faellt aus der Karte heraus und legte sich zusaetzlich ueber das Strichlein: gemessen 37px darueber gegen 20px darunter. Den Abstand traegt allein der Trenner, dann liegt das Strichlein genau in der Mitte. */ .page-card .page-body > .text-unit:last-child{margin-bottom:0} /* Ein kurzes Haarstrichlein mittig in der Atempause: es benennt die Fuge, ohne die Spalte zu zerschneiden. Zu den Enden hin laeuft es aus, damit es keine harte Kante setzt — eine Naht, keine Trennwand. Eigener Platzbedarf: keiner, es sitzt im vorhandenen Abstand. */ .page-divider::before{content:'';position:absolute;left:50%;top:50%;width:5rem;height:1px;transform:translate(-50%,-50%);background:linear-gradient(90deg,transparent,var(--text-muted) 16%,var(--text-muted) 84%,transparent);opacity:0.55} .page-divider:first-child::before{display:none}.page-head{padding:0;border:none}/* Die Ziffer haengt im rechten Rand, auf der Hoehe des Strichleins — sie gehoert zum Umbruch, nicht zur ersten Textzeile der neuen Seite. Textserife statt Monospace: die Monospace liest sich wie Code, die Ziffer gehoert aber zum Buch. Sie steht im Akzentgold: Gold ist in dieser Edition die Farbe dessen, was nicht Hegels Text ist, sondern ihn erschliesst — eine Seitenzahl ist genau das. Mediaevalziffern, damit sie in der Zeile liegt statt auf ihr. */ .page-sigel{position:absolute;left:100%;margin-left:0.9rem;top:50%;transform:translateY(-50%);font-family:var(--font-display);font-size:1.02em;font-weight:600;font-variant-numeric:oldstyle-nums;letter-spacing:0.02em;color:var(--accent-gold);opacity:0.92;white-space:nowrap;transition:opacity .18s ease,color .18s ease} .page-sigel:hover{opacity:1} /* Im Druckbild rueckt die Ziffer neben die Textspalte — so weit von ihr weg wie die Randziffern auf der Gegenseite (0,55rem entspricht deren `margin-right` von 0,8em). `--versatz` ist der Abstand von der Spaltenmitte zur Textkante und wird je Seite gesetzt (setzeDiplVersatz in text.html), weil dort jede Seite ihre eigene Breite hat. Fehlt der Wert, bleibt die Ziffer aussen stehen. */ body.dipl-mode .page-sigel{left:50%;margin-left:calc(var(--dipl-halb, 50%) + 0.55rem)} /* Angesprungene Seite (Sprung ueber "GW-Seite") faerbt sich kurz an. */ .page-divider:target .page-sigel{opacity:1;color:var(--accent-gold)} /* Der Bandteil ("GW 7, ") bleibt im DOM — die Zitat-Kopie und Screenreader lesen ihn weiter —, nur im Satzbild waere er auf jeder Seite Wiederholung. */ .page-sigel-werk{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.text-unit{margin-bottom:1rem;text-align:justify;hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:6 3 2;overflow-wrap:break-word}.text-unit.type-heading,.text-unit.type-subheading{font-family:var(--font-display);font-weight:500;color:var(--text-ink);text-align:center;margin:2.5rem 0 1rem;letter-spacing:0.04em;opacity:0.88;scroll-margin-top:calc(var(--header-h) + 6rem)}.text-unit.type-subheading{font-size:1em;margin-top:0.5rem}.text-unit.type-heading[data-level="1"]{font-size:1.3em;font-weight:600;margin-top:3.5rem;letter-spacing:0.08em;opacity:1}.text-unit.type-heading[data-level="2"]{font-size:1.1em;font-weight:600}.text-unit.type-heading[data-level="3"]{font-size:1em}.text-unit.type-heading[data-level="4"]{font-size:0.95em;font-style:italic;letter-spacing:0.02em}.text-unit.enz-anmerkung{font-size:0.93em;margin-left:1rem}[id^="hd-"],[id^="page-"],[id^="line-"]{scroll-margin-top:calc(var(--header-h) + 5rem)} /* Eine Notiz steht am Fuss der Seite: springt man sie an, kaeme sie an den oberen Rand und damit halb unter die Kopfleiste zu liegen. Ein Rand von knapp der halben Fensterhoehe holt sie statt dessen in die Mitte, wo sie neben dem Satz steht, aus dem man kam. Auf niedrigen Fenstern greift weiterhin der gewoehnliche Kopfabstand. */ [id^="fn-"],[id^="ref-fn-"]{scroll-margin-top:max(calc(var(--header-h) + 5rem), 42vh)}.text-unit.type-heading[id]{position:relative}em:not(.sperrsatz),i{font-size:1.06em;line-height:1} .sperrsatz{font-style:italic;font-size:1.06em;line-height:1;letter-spacing:0;hyphens:auto;-webkit-hyphens:auto}body.sperrsatz-an .sperrsatz{font-style:normal;letter-spacing:0.09em;hyphens:none;-webkit-hyphens:none}.dipl-content{display:flex;flex-direction:column}.dipl-line{display:flex;align-items:baseline;min-height:1.5em;padding-left:3rem;margin-left:-3rem}.dipl-line-no{flex:0 0 2.2em;margin-left:-3em;margin-right:0.8em;text-align:right;font-family:var(--font-mono);font-size:0.68em;color:var(--text-muted);user-select:none;white-space:nowrap;-webkit-user-select:none} /* Die Ziffer selbst kommt aus dem Attribut (siehe text.html): generierter Inhalt ist nicht markierbar und wird von keinem Browser mitkopiert. */ .dipl-line-no::before{content:attr(data-no)}.dipl-content{display:none}.reflow-content{display:block}.reflow-content>p{margin:0}.reflow-content>p.anm-absatz{margin-top:0.55em;text-indent:0}body.dipl-mode .dipl-content{display:flex;flex-direction:column}body.dipl-mode .reflow-content{display:none}body.dipl-mode .text-unit.type-heading .dipl-line-no,body.dipl-mode .text-unit.type-subheading .dipl-line-no{display:none}body.dipl-mode .text-unit.type-heading .dipl-line,body.dipl-mode .text-unit.type-subheading .dipl-line{padding-left:0;margin-left:0;justify-content:center}body.dipl-mode .text-unit.type-heading .dipl-line-text,body.dipl-mode .text-unit.type-subheading .dipl-line-text{flex:0 1 auto}body.dipl-mode .dipl-line-text{flex:1;min-width:0;text-align:left;text-align-last:left}@media (min-width:769px){/* Kein Blocksatz im Druckbild. Ueber acht Baende gemessen (887 Druckzeilen) bekam die Haelfte aller gerechtfertigten Zeilen mehr als 0,295 em zusaetzlichen Wortabstand — bei einem normalen Wortzwischenraum von 0,25 bis 0,33 em also ungefaehr doppelte Abstaende, im schlimmsten Fall +147 px auf einer zu 77 % gefuellten Zeile. Der Grund ist strukturell: die Spalte ist `max-content`, also so breit wie die laengste Zeile der Seite, und weil im Druckbild die Zeilenumbrueche feststehen, kann der Ausgleich nur ueber die Wortzwischenraeume laufen. Der Setzer der Akademie-Ausgabe hatte Trennungen und Ausgleichsspatien; wir haben nur die Luecken. Das Druckbild soll die Zeilenumbrueche des Originals zeigen — die sind die Aussage; ein durch gedehnte Wortabstaende nachgeahmter bunder rechter Rand bildet den Satz nicht ab, sondern verfaelscht ihn. Eine diplomatische Wiedergabe darf rechts ausfransen. Die Regeln fuer `.dipl-line-kurz` und `.dipl-line-final` bleiben stehen: sie greifen nur bei `text-align-last` und schaden nicht. */ body.dipl-mode .dipl-line-text{white-space:nowrap}}@media (min-width:769px){/* Eine Spalte fuer das ganze Werk statt eine je Seite: `max-content` mass bisher jede Seite an ihrer eigenen laengsten Zeile (in GW 7 zwischen 83 und 95 Zeichen), wodurch die Absaetze verschieden breit untereinander standen. `--dipl-spalte` wird einmal gemessen (messeDiplSpalte in text.html); das `min(100%, …)` verhindert Ueberlauf, falls das Fenster schmaler ist. */ body.dipl-mode .page-body{display:grid;grid-template-columns:min(100%, var(--dipl-spalte, max-content));justify-content:center}}body.dipl-mode .dipl-line-final .dipl-line-text{text-align-last:left}body.dipl-mode .dipl-line-kurz .dipl-line-text{text-align-last:left}/* Dritter Schriftgrad des Zeitungsteils (GW 5). Der Druck setzt die nachgedruckten Stuecke kleiner; 27 gegen 30 px Versalhoehe entspricht rund 0.92em. Kein Einzug, keine Farbe — der Satz unterscheidet sich im Grad und sonst in nichts. */.text-unit.grad-zwei{font-size:0.92em}.reader-toast{position:fixed;bottom:2rem;left:50%;transform:translateX(-50%) translateY(20px);padding:0.6rem 1.4rem;background:var(--text-ink);color:var(--bg-paper);font-size:0.82rem;border-radius:4px;opacity:0;transition:opacity 0.3s,transform 0.3s;pointer-events:none;z-index:999}.reader-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.search-main{margin:0 auto;padding:0}.search-hero-area{position:relative;min-height:calc(100vh - var(--header-h));display:flex;align-items:center;justify-content:center;overflow:hidden;padding:var(--header-h) 2rem 3rem}.search-hero-content{position:relative;z-index:2;text-align:center;width:100%;max-width:52rem}.search-hero-badge{font-size:0.6rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--text-muted);margin-bottom:1.5rem;font-family:var(--font-body)}.search-hero-title{font-family:var(--font-display);font-size:clamp(1.8rem,4vw,2.6rem);font-weight:400;color:var(--text-ink);line-height:1.15;letter-spacing:0.01em;margin-bottom:0.6rem}.search-hero-rule{width:40px;height:1px;background:var(--rule);margin:1.2rem auto 1.8rem}.search-main.has-results .search-hero-area{min-height:0;padding:1rem 2rem;align-items:flex-start;position:sticky;top:var(--header-h);margin-top:var(--header-h);z-index:150;overflow:visible;background:var(--bg-desktop);border-bottom:1px solid var(--rule)}.search-main.has-results .search-hero-badge{display:none}.search-main.has-results .search-hero-title{display:none}.search-main.has-results .search-hero-rule{display:none}.search-main.has-results .search-hero-title{font-size:1.3rem;margin-bottom:0.4rem}.search-main.has-results .search-hero-rule{margin:0.6rem auto 1rem;opacity:0.4}.search-box-elegant{display:flex;max-width:56rem;margin:0 auto;gap:0.6rem}.search-box-elegant input{flex:1;font-family:var(--font-body);font-size:1.1rem;padding:0.9rem 1.4rem;border:1px solid var(--rule);border-radius:var(--radius);background:var(--bg-page);color:var(--text-body);transition:border-color 0.3s,box-shadow 0.3s}.search-box-elegant input:focus{border-color:var(--accent-gold);box-shadow:0 4px 20px var(--shadow-med)}.btn-search{font-family:var(--font-body);font-size:0.82rem;letter-spacing:0.08em;text-transform:uppercase;padding:0.9rem 2rem;background:var(--accent);color:var(--bg-paper);border:none;border-radius:var(--radius);cursor:pointer;transition:all 0.3s}.btn-search:hover{background:var(--btn-primary-hover);box-shadow:0 4px 16px var(--shadow-med)}.search-controls{max-width:56rem;margin:1rem auto 0;display:flex;flex-direction:column;gap:0.6rem}.search-filter-row{display:flex;gap:0.6rem;align-items:center;flex-wrap:wrap;justify-content:center}.search-status-inline{font-size:0.78rem;color:var(--text-muted);margin-left:auto;white-space:nowrap}.search-controls select{font-family:var(--font-body);font-size:0.8rem;padding:0.35rem 0.7rem;border:1px solid var(--rule);border-radius:3px;background:var(--bg-page);color:var(--text-body);transition:border-color 0.2s}.search-controls select:hover{border-color:var(--accent-gold)}#search-status{font-size:0.78rem;color:var(--text-muted)}.syntax-link{font-family:var(--font-body);font-size:0.72rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-muted);text-decoration:none;opacity:0.7;transition:opacity 0.2s,color 0.2s;position:relative}.syntax-link::after{content:'';display:inline-block;width:0.35em;height:0.35em;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg) translateY(-1px);margin-left:0.35em;transition:transform 0.25s}.syntax-link.active::after{transform:rotate(-135deg) translateY(-1px)}.syntax-link:hover{opacity:1;color:var(--accent-gold);text-decoration:none}.search-guide{max-width:56rem;margin:0 auto;overflow:hidden;max-height:0;opacity:0;transition:max-height 0.3s ease,opacity 0.2s ease}.search-guide.open{max-height:12rem;opacity:1;margin-top:0.4rem}.search-guide-list{display:flex;flex-wrap:wrap;gap:0.35rem 1rem;justify-content:center;padding:0.6rem 0 0.4rem;margin:0}.search-guide-list > div{display:flex;align-items:baseline;gap:0.35rem}.search-guide-list dt{margin:0}.search-guide-list dt code{font-family:var(--font-mono);font-size:0.68rem;background:var(--bg-subtle);padding:0.15rem 0.4rem;border-radius:3px;color:var(--accent)}.search-guide-list dd{margin:0;font-family:var(--font-body);font-size:0.7rem;color:var(--text-muted)}.search-guide-list dd em{font-style:italic}#search-results{max-width:48rem;margin:0 auto;padding:2.5rem 2rem 4rem}.no-results{padding:2rem 0;text-align:left}.no-results p{font-size:1.02rem;color:var(--text-ink);margin-bottom:1rem}.no-results ul{padding-left:1.2rem;margin:0}.no-results li{font-size:0.88rem;color:var(--text-muted);line-height:1.6;margin-bottom:0.5rem}.no-results a{color:var(--accent-gold)}.result-biblio{padding:1.4rem 1.4rem;margin-bottom:0.8rem;background:var(--bg-paper);border:1px solid var(--rule);border-radius:var(--radius);transition:box-shadow 0.2s,border-color 0.2s}.result-biblio:hover{border-color:var(--accent-gold);box-shadow:0 4px 16px var(--shadow-soft)}.result-biblio .sigle{font-size:0.62rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--accent-gold);margin-bottom:0.3rem}.result-chapter{font-size:0.72rem;color:var(--text-muted);margin-bottom:0.5rem;font-style:italic}.result-biblio .snippet{font-size:0.95rem;color:var(--text-body);line-height:1.75}.result-biblio .snippet mark{background:color-mix(in srgb,var(--accent-gold) 25%,transparent);color:inherit;padding:0;border-radius:2px}.result-biblio .result-link{display:inline-block;margin-top:0.6rem;font-size:0.78rem;color:var(--accent);transition:transform 0.2s}.result-biblio .result-link:hover{transform:translateX(4px);text-decoration:none}.result-group{margin-bottom:1.5rem}.result-group-header{display:flex;align-items:baseline;gap:0.6rem;padding:0.5rem 0;border-bottom:1px solid var(--border);margin-bottom:0.5rem;flex-wrap:wrap}.result-group-work{font-family:var(--font-body);font-size:0.9rem;font-weight:500;color:var(--accent)}.result-group-section{font-family:var(--font-body);font-size:0.85rem;color:var(--text-body)}.result-group-count{font-family:'JetBrains Mono',monospace;font-size:0.7rem;color:var(--text-muted);margin-left:auto}.result-group .result-biblio{border-left-width:2px}.legal-container{max-width:38rem;margin:0 auto;padding:calc(var(--header-h) + 3rem) 2rem 4rem}.legal-container--wide{max-width:46rem}.legal-kicker{font-size:0.62rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--accent-gold);margin-bottom:0.5rem}.legal-container h1{font-family:var(--font-display);font-size:2rem;font-weight:400;color:var(--text-ink);margin-bottom:1rem}.legal-lead{font-size:1.02rem;color:var(--text-muted);margin-bottom:2.5rem;line-height:1.7}.legal-section{margin-bottom:2rem}.legal-section h2{font-family:var(--font-display);font-size:1.15rem;font-weight:500;color:var(--text-ink);margin-bottom:0.6rem}.legal-section p{margin-bottom:0.8rem;font-size:0.95rem}.legal-list{padding-left:1.4rem;margin-bottom:1rem} .friends-list{list-style:none;padding:0;margin:0 0 2rem;text-align:center} .friends-list li{font-family:var(--font-display);font-size:1.3rem;color:var(--text-ink);padding:0.7rem 0;border-bottom:1px solid var(--rule)} .friends-list li:last-child{border-bottom:none} .friends-cta{text-align:center;color:var(--text-muted);font-size:0.92rem}.chart-wrap{background:var(--bg-page);border:1px solid var(--rule);border-radius:3px;padding:1.1rem 0.9rem 0.7rem;margin:1.2rem 0}.chart-title{font-size:0.72rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:0.3rem}.chart-wrap svg{width:100%;height:auto;display:block;font-family:var(--font-body)}.chart-ax,.chart-tick{stroke:var(--rule);stroke-width:1}.chart-gridlabel{fill:var(--text-muted);font-size:11px}.chart-rowlabel{fill:var(--text-body);font-size:12px}.chart-vallabel{fill:var(--text-muted);font-size:10.5px;font-family:var(--font-mono)}.chart-vallabel-own{fill:var(--text-ink);font-size:10.5px;font-family:var(--font-mono);font-weight:600}.chart-dot-ref{fill:var(--text-muted)}.chart-dot-own{fill:var(--accent-gold)}.chart-ci-band{fill:var(--accent-gold);opacity:0.14}.chart-threshold{stroke:var(--accent);stroke-width:1.3;stroke-dasharray:4 3}.chart-thresholdlabel{fill:var(--accent);font-size:11px}.chart-axislabel{fill:var(--text-muted);font-size:10.5px;text-anchor:middle}.chart-bar-12{fill:var(--accent)}.chart-bar-21{fill:var(--accent-gold)}.legal-list li{font-size:0.92rem;margin-bottom:0.3rem}.fb-field{margin-bottom:1.4rem}.fb-field label{display:block;font-size:0.78rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:0.4rem}.fb-field input,.fb-field select,.fb-field textarea{width:100%;font-family:var(--font-body);font-size:0.95rem;color:var(--text-ink);background:var(--bg-card);border:0.5px solid var(--text-muted);border-radius:4px;padding:0.6rem 0.8rem;transition:border-color 0.2s}.fb-field input:focus,.fb-field select:focus,.fb-field textarea:focus{border-color:var(--accent-gold)}.fb-field textarea{resize:vertical;line-height:1.6}.fb-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media (max-width:480px){.fb-row{grid-template-columns:1fr}}.fb-submit{font-family:var(--font-display);font-size:0.9rem;letter-spacing:0.06em;color:var(--bg-paper);background:var(--text-ink);border:none;border-radius:4px;padding:0.7rem 2.2rem;cursor:pointer;transition:opacity 0.2s}.fb-submit:hover{opacity:0.85}.fb-submit:disabled{opacity:0.5;cursor:default}.fb-success{text-align:center;padding:3rem 0;color:var(--text-ink)}.fb-success p{font-size:1.05rem;margin-bottom:1.5rem}.fb-another{font-size:0.85rem;color:var(--accent-gold);text-decoration:underline;text-underline-offset:3px}.legal-table{margin:1rem 0}.roadmap-toggle{font-family:var(--font-body);font-size:0.78rem;letter-spacing:0.06em;color:var(--accent-gold);background:none;border:1px solid var(--rule);border-radius:3px;padding:0.5rem 1rem;cursor:pointer;transition:border-color 0.2s,background 0.2s;margin-top:0.5rem;margin-bottom:1.8rem;display:block}.roadmap-toggle:hover{border-color:var(--accent-gold);background:var(--bg-subtle)}.legal-table-row{display:grid;grid-template-columns:160px 1fr;gap:1rem;padding:0.8rem 0;border-bottom:1px solid var(--rule)}.legal-table-norm{font-family:var(--font-mono);font-size:0.78rem;color:var(--accent);font-weight:500}.legal-table-text{font-size:0.88rem}.legal-quote{border-left:3px solid var(--accent-gold);padding:0.8rem 1.2rem;margin:1rem 0;font-style:italic;color:var(--text-body);background:var(--bg-paper)}.hero{position:relative;height:100vh;min-height:600px;display:flex;align-items:center;justify-content:center;overflow:hidden}.hero-content{position:relative;z-index:2;text-align:center;max-width:640px;padding:0 2rem}.hero-badge{font-size:0.6rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--text-muted);margin-bottom:1.5rem;font-family:var(--font-body)}.hero-title{font-family:var(--font-display);font-size:clamp(2.8rem,6vw,4.2rem);font-weight:400;color:var(--text-ink);line-height:1.15;letter-spacing:0.01em}.hero-version{font-family:var(--font-body);font-size:0.72rem;font-weight:400;letter-spacing:0.12em;color:var(--text-muted);text-align:center;margin-top:0.5rem;font-variant:small-caps}.hero-rule{width:40px;height:1px;background:var(--rule);margin:1.5rem auto}.hero-sub{font-size:1.05rem;color:var(--text-muted);line-height:1.65;max-width:480px;margin:0 auto 2rem}.hero-actions{display:flex;gap:1rem;justify-content:center}.hero-btn-primary{font-family:var(--font-body);font-size:0.82rem;letter-spacing:0.14em;text-transform:uppercase;padding:0.6rem 1.8rem;background:transparent;color:var(--text-ink);border:1px solid var(--text-ink);border-radius:0;text-decoration:none;transition:border-color 0.2s,color 0.2s}.hero-btn-primary:hover{border-color:var(--accent-gold);color:var(--accent-gold);text-decoration:none}.hero-btn-secondary{font-family:var(--font-body);font-size:0.82rem;letter-spacing:0.14em;text-transform:uppercase;padding:0.6rem 1.8rem;border:1px solid var(--rule);color:var(--text-muted);border-radius:0;text-decoration:none;transition:border-color 0.2s,color 0.2s}.hero-btn-secondary:hover{border-color:var(--accent-gold);color:var(--text-ink);text-decoration:none}.hero-scroll{position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:0.6rem;cursor:pointer;z-index:2}.hero-scroll span:first-child{font-size:0.6rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--text-muted)}.hero-scroll-line{width:1px;height:32px;background:var(--accent-gold)}.stats-bar{display:flex;justify-content:center;gap:3rem;padding:2.5rem 2rem;background:var(--bg-paper);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);min-height:165px}.stat-item{text-align:center}.stat-value{display:block;font-family:var(--font-display);font-size:2rem;font-weight:300;color:var(--text-ink);line-height:1.2}.stat-label{font-size:0.62rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--text-muted)}.lp-section{max-width:72rem;margin:0 auto;padding:5rem 2rem}.lp-section-label{font-size:0.6rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--accent-gold);margin-bottom:0.4rem}.lp-section-title{font-family:var(--font-display);font-size:2rem;font-weight:400;color:var(--text-ink);margin-bottom:2.5rem}.roadmap-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;max-width:72rem;margin:0 auto;padding:0 2rem}.roadmap-grid--3{grid-template-columns:repeat(3,1fr);max-width:60rem}.roadmap-card{position:relative;background:var(--bg-paper);border:1px solid var(--rule);border-radius:var(--radius);padding:1.8rem 1.4rem 1.4rem;transition:border-color 0.2s,box-shadow 0.3s}.roadmap-card:hover{border-color:var(--accent-gold);box-shadow:0 4px 16px var(--shadow-soft)}.roadmap-card-icon{font-family:var(--font-display);font-size:1.6rem;font-weight:300;color:var(--accent-gold);opacity:0.5;margin-bottom:0.8rem;line-height:1}.roadmap-card h4{font-family:var(--font-display);font-size:1.05rem;font-weight:500;color:var(--text-ink);margin-bottom:0.6rem}.roadmap-card p{font-family:var(--font-body);font-size:0.88rem;line-height:1.6;color:var(--text-body)}.workflow-section-wrap{padding-top:3rem}@media (max-width:960px){.roadmap-grid{grid-template-columns:repeat(2,1fr);gap:1rem}}@media (max-width:480px){.roadmap-grid{grid-template-columns:1fr;gap:0.8rem;padding:0 1rem}.roadmap-card{padding:1.2rem 1rem}.roadmap-card-icon{font-size:1.3rem}.roadmap-card h4{font-size:0.95rem}.roadmap-card p{font-size:0.82rem}}.works-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(10.2rem,1fr));gap:0.8rem;max-width:60rem;margin:0 auto;padding:0 2rem;min-height:660px}[data-color="ink"]{--card-accent:196,160,80}[data-color="ink-light"]{--card-accent:180,148,74}[data-color="ink-faded"]{--card-accent:100,94,82}.work-row{display:flex;flex-direction:column;align-items:flex-start;gap:0.4rem;padding:1rem 0.95rem 0.8rem;background:var(--bg-page);border:1px solid var(--rule);border-radius:var(--radius);color:inherit;text-decoration:none;transition:background 0.2s,border-color 0.2s,box-shadow 0.3s}.work-row:hover{background:var(--bg-subtle);border-color:var(--accent-gold);box-shadow:0 4px 16px var(--shadow-soft);text-decoration:none}a.work-row:hover{text-decoration:none}.work-row-band{font-family:var(--font-display);font-size:1.35rem;font-weight:300;color:var(--accent-gold);text-align:left;line-height:1}.work-row-main{min-width:0;display:flex;flex-direction:column;gap:0.15rem}.work-row-title{font-family:var(--font-display);font-size:0.98rem;font-weight:500;color:var(--text-ink);line-height:1.3}.work-row-sig{font-size:0.65rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--text-muted)}.work-row-meta{margin-top:auto;padding-top:0.35rem;font-size:0.72rem;color:var(--text-muted)}.work-row-arrow{align-self:flex-end;margin-top:-1.4rem;font-size:0.9rem;color:var(--accent-gold);opacity:0;transition:opacity 0.2s,transform 0.2s}.work-row:hover .work-row-arrow{opacity:1;transform:translateX(3px)}.work-row--upcoming{opacity:0.4;border-style:dashed;cursor:default}.work-row--upcoming:hover{opacity:0.55}.work-row-badge{font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.12em;text-transform:uppercase}.about-section{background:var(--bg-paper);border-radius:0}.about-lead{font-size:1.08rem;color:var(--text-body);max-width:52rem;line-height:1.75;margin-bottom:3rem}.about-cols{display:grid;grid-template-columns:1fr 1fr;gap:3rem;margin-bottom:3rem}.about-col h3{font-family:var(--font-display);font-size:1.15rem;font-weight:500;color:var(--text-ink);margin-bottom:0.8rem}.about-col p{font-size:0.92rem;color:var(--text-body);margin-bottom:0.8rem}.workflow-section{margin-top:2rem}.workflow-label{display:block;font-size:0.6rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--accent-gold);margin-bottom:1.5rem}.workflow-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1.2rem}.workflow-step{padding:1.2rem;background:var(--bg-page);border:1px solid var(--rule);border-radius:var(--radius);transition:transform 0.3s,box-shadow 0.3s}.workflow-step:hover{border-color:var(--accent-gold)}.workflow-step-num{display:block;font-size:0.58rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--accent-gold);margin-bottom:0.4rem}.workflow-step-name{display:block;font-family:var(--font-display);font-size:1rem;font-weight:500;color:var(--text-ink);margin-bottom:0.3rem}.workflow-step-detail{display:block;font-size:0.78rem;color:var(--text-muted);line-height:1.5}.lp-footer{text-align:center;padding:4rem 2rem;background:var(--bg-paper);border-top:1px solid var(--rule)}.lp-footer h3{font-family:var(--font-display);font-size:1.3rem;font-weight:400;color:var(--text-ink);margin-bottom:0.3rem}.lp-footer p{font-size:0.78rem;color:var(--text-muted);margin-bottom:1.5rem}.lp-footer nav{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem}.lp-footer nav a{font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-muted)}.lp-footer-credit{margin:2rem 0 0;font-size:0.68rem}.lp-footer-credit a{color:var(--text-muted)}.lp-footer nav a:hover{color:var(--accent)}.reveal,.reveal.visible,.reveal-3d,.reveal-3d.visible{opacity:1;transform:none}.reading-progress{position:fixed;top:var(--header-h);left:0;width:0;height:2px;background:var(--accent-gold);z-index:1000;transition:width 0.1s linear;pointer-events:none}.page-position{position:fixed;top:calc(var(--header-h) + 6px);right:1.2rem;z-index:199;font-family:var(--font-mono);font-size:0.65rem;color:var(--text-muted);background:var(--bg-paper);padding:0.15rem 0.5rem;border-radius:var(--radius);border:1px solid var(--rule);opacity:0;transform:translateY(-4px);transition:opacity 0.25s,transform 0.25s;pointer-events:none}.page-position.visible{opacity:0.85;transform:translateY(0)}.btn-font{min-width:2.2rem;text-align:center;font-weight:600;padding-left:0.4rem;padding-right:0.4rem}.mobile-toc-toggle{display:none;position:fixed;bottom:1.2rem;right:1.2rem;z-index:900;width:3rem;height:3rem;border-radius:50%;border:1px solid var(--rule);background:var(--bg-paper);color:var(--text-ink);font-size:1.2rem;cursor:pointer;box-shadow:0 2px 12px var(--shadow-med);transition:background 0.2s}.mobile-toc-toggle:hover{background:var(--bg-subtle)}.mobile-backdrop{display:none;position:fixed;inset:0;z-index:940;background:rgba(0,0,0,0.4)}.mobile-backdrop.visible{display:block}@media (max-width:1200px){.reader-layout{grid-template-columns:220px 1fr}.text-content{padding:1.5rem 2rem}.reader-sticky-bar{padding:0 2rem;margin-left:-2rem;margin-right:-2rem;margin-top:-1.5rem}.reader-toolbar{gap:0.8rem;font-size:0.78rem}}@media (max-width:960px){.reader-layout{grid-template-columns:180px 1fr}.text-content{padding:1.2rem 1.5rem 1.2rem 2rem}.reader-sticky-bar{padding:0 1.5rem 0 2rem;margin-left:-2rem;margin-right:-1.5rem;margin-top:-1.2rem}.reader-toolbar{gap:0.6rem;font-size:0.76rem}.reader-sticky-bar #reader-summary h2{font-size:1.05rem}}@media (max-width:768px){.reader-layout{grid-template-columns:1fr}.mobile-toc-toggle{display:block}.reader-sidebar{display:block;position:fixed;top:0;left:0;width:80vw;max-width:320px;height:100vh;z-index:950;transform:translateX(-100%);transition:transform 0.25s ease;box-shadow:4px 0 20px var(--shadow-med);padding-top:calc(1.4rem + env(safe-area-inset-top,0px))}/* Die Schublade liegt mit z-index 950 ueber Kopf (200) und Banner (250) und verdeckt beide ohnehin -- der frueher reservierte Platz `calc(var(--header-h) + 1rem)` hielt oben nichts frei, sondern schob das Verzeichnis nur nach unten. Mit zweizeiligem Banner waren das rund 150 px Leerraum. `env(safe-area-inset-top)` haelt den Rand bei Geraeten mit Aussparung frei. */.reader-sidebar.mobile-open{transform:translateX(0)}.text-content{padding:1rem 1rem 1rem 1rem}.reader-sticky-bar{padding:0 1rem;margin-left:-1rem;margin-right:-1rem;margin-top:-1rem}.reader-sticky-bar #reader-summary h2{font-size:0.95rem}.reader-toolbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:0.35rem;font-size:0.74rem;overflow-x:visible}.toolbar-row1{display:contents}.toolbar-left{display:flex;align-items:center;gap:0.35rem;min-width:0;justify-self:start}#toolbar-search{justify-self:stretch;width:auto;min-width:0;margin-top:0;order:0}.toolbar-end{justify-self:end}.toolbar-row1 .btn-classic{padding:0.3rem 0.5rem}.toolbar-row1 .einstellungen-knopf{width:1.7rem;font-size:0.78rem}#werkwahl-knopf{padding:0.25rem 1.25rem 0.25rem 0.45rem;background-position:right 0.35em center}.jump-input-group input{width:2.4rem} .toolbar-search .inline-search-wrap input{width:100%} /* Damit der Trefferzaehler auf dem Handy unter der Leiste haengen kann, braucht er die Leiste als Bezugsrahmen. Seine eigene Gestalt steht weiter unten bei den uebrigen Zaehlerregeln -- hier stuende sie zu frueh und wuerde von ihnen ueberschrieben. */ .reader-toolbar{position:relative}#dipl-toggle{display:none}.reading-progress{z-index:100}.page-position{display:none}.site-title-eyebrow{font-size:0.4rem;letter-spacing:0.2em}.site-title-main{font-size:0.85rem}.site-header{padding:0 1rem}.sitenav{flex:1;min-width:0}.sitenav ul{width:100%;gap:0.6rem}.sitenav ul>li:first-child{margin-left:auto}.sitenav ul>li:last-child{margin-left:auto}.sitenav a{font-size:0.68rem;letter-spacing:0.08em}.dipl-line{display:block;padding-left:0;margin-left:0}.dipl-line-no{float:left;margin:0 0.5em 0 0}.hero-title{font-size:2.4rem}.stats-bar{gap:1.5rem;flex-wrap:wrap;min-height:270px}.works-grid{padding:0 0.5rem;grid-template-columns:1fr;gap:0.7rem;min-height:2780px}.work-row{padding:1rem 1rem 0.85rem}.work-row-band{font-size:1.3rem}.about-cols{grid-template-columns:1fr;gap:2rem}.workflow-steps{grid-template-columns:1fr 1fr}.site-header{padding:0 1rem}.site-footer{flex-direction:column;gap:0.8rem;text-align:center}.search-box-elegant{position:relative;flex-direction:row} .search-box-elegant input{width:100%;font-size:1rem;padding:0.75rem 3.4rem 0.75rem 1rem} .btn-search{position:absolute;right:0.35rem;top:50%;transform:translateY(-50%);width:2.6rem;height:2.6rem;padding:0;border-radius:var(--radius);font-size:0;display:flex;align-items:center;justify-content:center} .btn-search::after{content:"→";font-size:1.2rem;color:var(--bg-paper)}.search-hero-area{padding:calc(var(--header-h) + 1.5rem) 1rem 2rem;min-height:auto}.search-hero-title{font-size:1.6rem}.search-hero-badge{font-size:0.5rem;margin-bottom:1rem}.search-hero-rule{margin:0.8rem auto 1.2rem}.search-main.has-results .search-hero-area{padding:0.6rem 1rem}.search-main.has-results .search-hero-title{font-size:1.1rem}.search-main.has-results .search-hero-rule{margin:0.4rem auto 0.6rem}.search-filter-row{gap:0.4rem}.search-controls select{font-size:0.72rem;padding:0.3rem 0.4rem}.search-filter-row .werkwahl-knopf,.search-filter-row .auswahl-knopf{font-size:0.72rem;padding:0.3rem 1.5rem 0.3rem 0.5rem}#search-status{font-size:0.7rem}.syntax-link{font-size:0.65rem}.search-guide-list{gap:0.25rem 0.7rem;padding:0.4rem 0}.search-guide-list dt code{font-size:0.62rem;padding:0.1rem 0.3rem}.search-guide-list dd{font-size:0.62rem}#search-results{padding:1rem 1rem 3rem}.result-biblio{padding:1rem}.result-biblio .sigle{font-size:0.62rem}.result-chapter{font-size:0.68rem}.result-biblio .snippet{font-size:0.82rem}.result-biblio .result-link{font-size:0.72rem}.result-group-header{gap:0.4rem;padding:0.4rem 0}.result-group-work{font-size:0.8rem}.result-group-section{font-size:0.75rem}.result-group-count{font-size:0.62rem}.legal-table-row{grid-template-columns:1fr}.legal-table-norm{margin-bottom:0.2rem}.wk-modal-stats{grid-template-columns:1fr;gap:0.6rem}}@media (max-width:480px){.workflow-steps{grid-template-columns:1fr}.hero-actions{flex-direction:column;align-items:center}.search-filter-row{justify-content:flex-start}.search-controls select{font-size:0.68rem;padding:0.25rem 0.3rem;max-width:45%}.search-guide-list{flex-direction:column;gap:0.2rem;align-items:flex-start;padding-left:0.5rem}.result-biblio .snippet{font-size:0.78rem;line-height:1.5}.sitenav a{font-size:0.6rem;letter-spacing:0.06em}.sitenav ul{gap:0.4rem}}.page-card:not([data-rendered]) .page-body{min-height:10rem}.page-card:not([data-rendered]) .page-body::before{content:'';display:block;height:0.8em;width:80%;margin:1.2rem 0 0.8rem;border-radius:3px;background:linear-gradient(90deg,var(--bg-subtle) 25%,var(--bg-page) 50%,var(--bg-subtle) 75%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite}.page-card:not([data-rendered]) .page-body::after{content:'';display:block;height:0.6em;width:55%;margin:0.5rem 0;border-radius:3px;background:linear-gradient(90deg,var(--bg-subtle) 25%,var(--bg-page) 50%,var(--bg-subtle) 75%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out 0.2s infinite}@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}@media print{.site-header,.site-footer,.reader-sidebar,.reader-sticky-bar,.mobile-toc-toggle,.mobile-backdrop,.reading-progress,.page-position,.page-header{display:none !important}body{background:#fff;color:#000}.reader-layout{display:block}.text-content{padding:0;max-width:100%;font-size:11pt;line-height:1.6}.page-card{border:none;page-break-inside:avoid;margin-bottom:1rem}.page-sigel{position:static;display:block;font-size:9pt;color:#666;margin-bottom:0.3rem}.text-unit{margin-bottom:0.5rem}mark.search-hit{background:#ff0;color:#000}a{color:#000;text-decoration:none}} .fn-ref{font-size:0.72em;vertical-align:super;line-height:0;color:inherit;text-decoration:none;padding:0 0.1em;user-select:none;-webkit-user-select:none}.fn-ref:target,.text-unit.type-author_footnote:target,.text-unit.type-footnote:target{background:var(--bg-subtle)}/* Die Anmerkungen stehen untereinander wie Textzeilen: kein eigener Rand, sie stapeln sich allein auf ihrem Zeilenmass. Vorher trug jede Notiz die `margin-bottom:1rem` jeder Unit, wodurch sie 70 px auseinander lagen, wo die Textzeilen 29 px haben. Der Abstand des Blocks zum Haupttext bleibt davon unberuehrt — den traegt der letzte Absatz. */.text-unit.type-author_footnote,.text-unit.type-footnote{font-size:0.9em;color:var(--text-muted);margin-top:0;margin-bottom:0;user-select:none;-webkit-user-select:none}.text-unit.type-author_footnote:last-child,.text-unit.type-footnote:last-child{margin-bottom:1rem}body.anm-zitieren .text-unit.type-author_footnote,body.anm-zitieren .text-unit.type-author_footnote *,body.anm-zitieren .text-unit.type-footnote,body.anm-zitieren .text-unit.type-footnote *{user-select:text;-webkit-user-select:text}body.anm-zitieren .text-unit:not(.type-author_footnote):not(.type-footnote),body.anm-zitieren .page-divider,body.anm-zitieren .page-sigel,body.anm-zitieren .dipl-line-no{user-select:none;-webkit-user-select:none}body.anm-zitieren .fn-marke,body.anm-zitieren .fn-ort,body.anm-zitieren .fn-ref,body.anm-zitieren .fn-aufruf{user-select:none;-webkit-user-select:none}/* Der Fussnotenstrich stand hier auf `:first-of-type` und hat nie gegriffen: der Pseudowaehler zaehlt Elementtypen unter den Geschwistern, nicht Klassen, und die Notizen sind `div` neben den Absatz-`div`s derselben Seite — erster `div` ist immer ein Absatz. Jetzt bekommt jede Notiz den Strich, und wer unmittelbar auf eine Notiz folgt, gibt ihn wieder ab; so bleibt genau einer ueber der ersten Notiz der Seite stehen. */ .text-unit.type-author_footnote,.text-unit.type-footnote{margin-top:0.8rem;padding-top:0.5rem;border-top:1px solid var(--rule)} .text-unit.type-author_footnote + .text-unit.type-author_footnote,.text-unit.type-author_footnote + .text-unit.type-footnote,.text-unit.type-footnote + .text-unit.type-author_footnote,.text-unit.type-footnote + .text-unit.type-footnote{margin-top:0;padding-top:0;border-top:0}.text-unit.type-author_footnote .sperrsatz,.text-unit.type-footnote .sperrsatz{color:inherit} /* Auswahlfelder in der Gestalt der Seite statt in der des Betriebssystems. Das aufgeklappte Menue zeichnet weiterhin das System - das laesst sich nicht gestalten; das geschlossene Feld und sein Pfeil schon. */ .toolbar-group select,.search-controls select{appearance:none;-webkit-appearance:none;background-color:var(--bg-page);background-image:url("data:image/svg+xml;utf8,");background-repeat:no-repeat;background-position:right 0.6em center;background-size:0.55em auto;padding-right:1.9em;cursor:pointer;transition:border-color 0.2s} .toolbar-group select:hover,.toolbar-group select:focus,.search-controls select:focus{border-color:var(--accent-gold)} /* Handy: Hinweisleiste schmaler setzen, sie nahm sonst den halben Schirm. */ @media (max-width:480px){.cookie-notice{left:0.5rem;right:0.5rem;bottom:0.5rem;gap:0.55rem;padding:0.7rem 0.85rem;max-height:58vh;overflow-y:auto}.cookie-notice-text{flex:1 1 100%;font-size:0.72rem;line-height:1.45}.cookie-notice-ok{width:100%;padding:0.45rem 0.8rem;font-size:0.74rem}.beta-badge{margin-left:0.35rem;font-size:0.45rem;padding:0.05em 0.35em;letter-spacing:0.05em}} /* Die Wortmarke bleibt einzeilig; sie brach sonst am Handy um und die Kopfleiste lief ueber. */ .site-title-main{white-space:nowrap} /* Bandauswahl im Leser — eigenes Feld statt vom Betriebssystem gezeichnet wird. Die Liste haengt am Seitenkoerper und ist fest positioniert; die Werkzeugleiste hat overflow-x:auto und wuerde sie sonst abschneiden. */ .werkwahl-knopf{font-family:var(--font-body);font-size:0.85rem;padding:0.25rem 1.9rem 0.25rem 0.6rem;border:1px solid var(--rule);border-radius:3px;background-color:var(--bg-page);color:var(--text-body);cursor:pointer;position:relative;transition:border-color 0.2s;background-image:url("data:image/svg+xml;utf8,");background-repeat:no-repeat;background-position:right 0.6em center;background-size:0.55em auto} .werkwahl-knopf:hover,.werkwahl-knopf[aria-expanded="true"]{border-color:var(--accent-gold)} .werkwahl-liste{position:fixed;z-index:1000;min-width:15rem;max-width:22rem;list-style:none;margin:0;padding:0.3rem;background:var(--bg-paper);border:1px solid var(--rule);border-radius:3px;box-shadow:0 8px 28px var(--shadow-med);max-height:min(70vh,32rem);overflow-y:auto;overscroll-behavior:contain} .werkwahl-liste a{display:block;padding:0.45rem 0.6rem;border-radius:2px;text-decoration:none;color:var(--text-body);transition:background 0.12s,color 0.12s} .werkwahl-liste a:hover,.werkwahl-liste a:focus-visible{background:var(--bg-subtle);color:var(--text-ink);text-decoration:none} .werkwahl-liste a.ist-gewaehlt{color:var(--accent-gold)} .werkwahl-sigel{display:block;font-family:var(--font-mono);font-size:0.68rem;letter-spacing:0.1em;color:var(--accent-gold);margin-bottom:0.1rem} .werkwahl-liste a.ist-gewaehlt .werkwahl-sigel{color:var(--accent)} .werkwahl-titel{display:block;font-size:0.82rem;line-height:1.35} /* Werkauswahl der Suche: Mehrfachauswahl mit Haekchen statt bleibt fast unsichtbar im Fluss, damit Pflichtfeld-Meldungen andocken koennen. */ .auswahl{position:relative;display:inline-block} select.auswahl-quelle{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0;pointer-events:none;margin:0;padding:0;border:0} .auswahl-liste{position:absolute;top:calc(100% + 0.3rem);left:0;z-index:500;min-width:100%;max-height:16rem;overflow-y:auto;padding:0.3rem;background:var(--bg-paper);border:1px solid var(--rule);border-radius:3px;box-shadow:0 8px 28px var(--shadow-med);display:flex;flex-direction:column;text-align:left} .auswahl-liste[hidden]{display:none} .auswahl-punkt{font-family:var(--font-body);font-size:0.8rem;text-align:left;padding:0.4rem 0.6rem;border:none;border-radius:2px;background:transparent;color:var(--text-body);cursor:pointer;white-space:nowrap;transition:background 0.12s,color 0.12s} .auswahl-punkt:hover,.auswahl-punkt:focus-visible{background:var(--bg-subtle);color:var(--text-ink)} .auswahl-punkt.ist-gewaehlt{color:var(--accent-gold)} .fb-field .auswahl{display:block} .fb-field .auswahl-knopf{width:100%;text-align:left;font-size:0.95rem;padding-top:0.6rem;padding-bottom:0.6rem;border-radius:4px;color:var(--text-ink)} .fb-field .auswahl-liste{width:100%} /* Handy: 'Feedback' wandert aus der Kopfleiste in die Fusszeile — oben wurde es sonst zwischen Recherche und Themenschalter gequetscht. */ .fuss-handy{display:none} @media (max-width:768px){.sitenav li.nav-feedback{display:none}.fuss-handy{display:inline}} .einstellungen-panel{position:fixed;z-index:1000;min-width:15rem;padding:0.6rem 0.7rem;background:var(--bg-paper);border:1px solid var(--rule);border-radius:3px;box-shadow:0 8px 28px var(--shadow-med);display:flex;flex-direction:column;gap:0.6rem;max-height:min(70vh,32rem);overflow-y:auto;overscroll-behavior:contain}.einstellungen-panel[hidden]{display:none}.syntax-hilfe-panel{width:23rem;max-width:88vw;gap:0.5rem}.syntax-hilfe-zeile{display:flex;flex-direction:column;gap:0.15rem;font-size:0.76rem;line-height:1.4;padding-bottom:0.4rem;border-bottom:1px solid var(--rule)}.syntax-hilfe-zeile:last-child{border-bottom:none;padding-bottom:0}.syntax-hilfe-zeile code{font-family:var(--font-mono);font-size:0.72rem;background:var(--bg-subtle);padding:0.1rem 0.4rem;border-radius:3px;color:var(--accent);align-self:flex-start}.syntax-hilfe-zeile span{color:var(--text-body)}.syntax-hilfe-zeile span em{font-style:italic;color:var(--text-muted)}.syntax-hilfe-fuss{font-size:0.72rem;color:var(--text-muted);font-style:italic} /* Zwei Spalten, die zweite fest — sonst richtet sich jeder Schalter nach der Laenge seines Etiketts und drei `ein` stehen in drei Groessen. */ .einstellungen-zeile{display:grid;grid-template-columns:minmax(0,1fr) 7.2rem;align-items:center;gap:1rem} .einstellungen-zeile-steuerung{display:flex;gap:0.3rem;justify-content:flex-end} .einstellungen-knopf{width:2.1rem;text-align:center;font-size:0.95rem;background-image:none;padding:0.25rem}.werkzeug-icon{width:1em;height:1em;min-width:1em;flex-shrink:0;display:block}.reader-toolbar .werkwahl-knopf,.reader-toolbar .btn-classic,.reader-toolbar .toolbar-group input{height:1.9rem;box-sizing:border-box}.reader-toolbar .werkwahl-knopf,.reader-toolbar .btn-classic{display:inline-flex;align-items:center}.reader-toolbar .btn-classic,.reader-toolbar .einstellungen-knopf{justify-content:center} /* Suche mittig zwischen Band/GW-Seite links und Druckbild/Zahnrad rechts — dieselbe Zwei-Randmarge-Technik wie bei der mobilen Hauptnavigation: der freie Platz teilt sich gleichmaessig vor der Suche und vor dem rechten Block auf. Nur am Schreibtisch — mobil bleibt die Suche ihre eigene, volle Zeile unterhalb der Werkzeugleiste. */ @media (min-width:769px){ /* Drei-Spalten-Gitter. Die beiden aeusseren Spalten nehmen nur, was ihr Inhalt braucht (auto); die Suche in der Mitte bekommt den ganzen Rest (1fr) und waechst und schrumpft mit dem Fenster. Sie lag frueher auf festen 22rem und war damit exakt mittig zur Toolbar -- das ist aufgegeben zugunsten der Breite: ein Suchfeld, das den vorhandenen Raum nutzt, ist mehr wert als eines, das mittig steht. minmax(0,1fr) statt 1fr, damit die Spalte unter die Mindestbreite ihres Inhalts schrumpfen darf und die Toolbar auf schmalen Fenstern nicht seitlich ueberlaeuft. */ .reader-toolbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;overflow-x:visible} .toolbar-left{display:flex;align-items:center;gap:0.7rem;min-width:0;justify-self:start} #toolbar-search{justify-self:stretch;width:auto;min-width:0} .toolbar-end{justify-self:end} /* Linke Gruppe war deutlich breiter als die rechte (232px vs. 143px), darum wirkte der Abstand zur Suche links kleiner als rechts, obwohl die Suche selbst schon exakt mittig lag. Pfeil und Eingabefeld hier verkleinert, um beide Seiten anzugleichen -- siehe Kommentar oben: bei gleich breiten aeusseren Spalten macht gleich breiter Inhalt auch die Luecken gleich breit. */ #werkwahl-knopf{background-image:none;padding:0.25rem 0.5rem} .jump-input-group input{width:2.6rem} .toolbar-jump .btn-classic{padding:0.3rem 0.5rem} } #dipl-toggle{min-width:5.6rem;text-align:center}#cite-toggle{text-align:center}#cite-italic-toggle{text-align:center}#emphasis-toggle{text-align:center} /* Seitenumbruch auf schmalen Geraeten: unter 768px bleibt kein Rand mehr, in dem die Ziffer haengen koennte (Satzspiegel-Polsterung faellt dort auf 1rem). Sie rueckt deshalb in die Atempause selbst und steht rechtsbuendig — kein Strich, kein zusaetzlicher Platzbedarf. */ @media (max-width:1200px){ /* Unterhalb 1200px faellt die Satzspiegel-Polsterung von 3rem auf 2rem und weniger. Gemessen: eine dreistellige Ziffer (340) endet dort exakt auf der Fensterkante — der Rand traegt sie nicht mehr. Sie rueckt deshalb in die Atempause selbst und steht rechtsbuendig ueber dem Seitenanfang, weiterhin ohne Strich und ohne zusaetzlichen Platzbedarf. */ .page-divider{height:auto;margin:1.6rem 0 0.7rem} .page-divider:first-child{margin-top:0} .page-sigel{position:static;display:block;margin:0;text-align:right;font-size:0.92em;line-height:1;opacity:0.92} } /* Im Druck traegt die Seitenzahl wieder den Bandnamen: das Blatt hat keinen Kontext, aus dem sich "GW 7" ergaenzen liesse. */ @media print{ .page-sigel-werk{position:static;width:auto;height:auto;margin:0;clip:auto;overflow:visible} } /* Druckbild: eine Zeile ist dort eine *gedruckte* Zeile. Passt sie nicht in die Spalte, bricht der Browser sie um — und weil `.text-unit` `hyphens:auto` traegt, setzt er dabei einen Trennstrich, den die Vorlage nicht hat (beobachtet auf Buchseite 12: "begräntzte" wurde zu "begräntz-/te", obwohl die Zeile das ganze Wort traegt). Ein erfundener Trennstrich ist in einer diplomatischen Wiedergabe ein Textfehler, kein Schoenheitsfehler. Im Druckbild wird deshalb nicht getrennt; bricht eine Zeile trotzdem um, ist der Umbruch als solcher erkennbar und behauptet kein Zeichen. */ body.dipl-mode .dipl-content, body.dipl-mode .dipl-line-text{hyphens:none;-webkit-hyphens:none} /* Ortszeichen vor Hegels Notizen: wo sie im Manuskript standen. Eigenes Zeichen statt der kursiven Herausgeberformel des Drucks — die Tatsache ist frei, ihre Formulierung nicht. Aufgeloest in den Editionsrichtlinien. */ .fn-ort{font-style:italic;color:var(--accent-gold);opacity:0.8;white-space:nowrap;user-select:none;-webkit-user-select:none} /* Die Marke am Anfang der Notiz im Lesefluss. Sie steht als hochgestelltes Zeichen schon in den Daten und wird darum nicht noch einmal gehoben. */ .fn-marke{color:inherit;user-select:none;-webkit-user-select:none} /* Die gedruckte Aufrufziffer im Druckbild: sieht aus wie zuvor, ist aber ein eigenes Element und wird darum nicht in ein Zitat mitgenommen. */ .fn-aufruf{user-select:none;-webkit-user-select:none} /* ── Befunde-Seite ────────────────────────────────────────────────── Die Diagramme benutzen die Klassen der Editionsrichtlinien (.chart-*), damit die Seite nicht wie ein Fremdkoerper wirkt. Hier steht nur, was dort noch fehlt. */ .sperr-bsp{letter-spacing:0.34em;font-style:normal} .befund-listen{display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:1rem 1.4rem;margin:1.2rem 0 0.6rem} .befund-liste-kopf{font-family:var(--font-body);font-size:0.66rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--accent-gold);margin-bottom:0.4rem} .befund-liste ol{list-style:none;margin:0;padding:0;counter-reset:bl} .befund-liste li{display:flex;justify-content:space-between;align-items:baseline;gap:0.5rem;font-size:0.86rem;line-height:1.6;border-bottom:1px solid var(--rule)} .befund-liste li:last-child{border-bottom:none} .bl-wort{color:var(--text-ink)} .bl-zahl{font-family:var(--font-mono);font-size:0.7rem;color:var(--text-muted)} .befund-hinweis{font-size:0.86rem;color:var(--text-muted);border-left:2px solid var(--rule);padding-left:0.9rem;margin-top:1rem} .befund-suche{display:flex;flex-wrap:wrap;align-items:center;gap:0.6rem;margin:1.1rem 0 0.2rem} .befund-label{font-size:0.7rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-muted)} .befund-suche input{font-family:var(--font-body);font-size:0.95rem;color:var(--text-ink);background:var(--bg-card,var(--bg-page));border:0.5px solid var(--text-muted);border-radius:4px;padding:0.4rem 0.7rem;min-width:12rem} .befund-suche input:focus{border-color:var(--accent-gold);outline:none} .befund-status{font-size:0.8rem;color:var(--text-muted)} .befund-tabelle{width:100%;border-collapse:collapse;margin:0.8rem 0;font-size:0.86rem} .befund-tabelle th{font-family:var(--font-body);font-size:0.66rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-muted);font-weight:500;text-align:left;padding:0.4rem 0.6rem 0.4rem 0;border-bottom:1px solid var(--rule)} .befund-tabelle td{padding:0.42rem 0.6rem 0.42rem 0;border-bottom:1px solid var(--rule);color:var(--text-body)} .befund-tabelle th.r,.befund-tabelle td.r{text-align:right;font-family:var(--font-mono);font-size:0.76rem} .befund-tabelle th.r{font-family:var(--font-body)} .befund-tabelle tr.summe td{border-bottom:none;border-top:1px solid var(--text-muted);color:var(--text-ink)} .befund-tabelle a{color:var(--text-ink);text-decoration:none;border-bottom:1px solid var(--rule)} .befund-tabelle a:hover{color:var(--accent-gold)} .befund-stand{font-size:0.76rem;color:var(--text-muted);margin-top:2.5rem;text-align:center} /* Auf schmalen Geraeten faellt die Tabelle sonst aus dem Satzspiegel. */ @media (max-width:640px){.befund-tabelle{display:block;overflow-x:auto} .befund-listen{grid-template-columns:1fr 1fr;gap:0.8rem}} /* Lateinisches im Fraktursatz stand im Druck in Antiqua. Kursiv ist die uebliche Wiedergabe dafuer; die Sprachangabe hilft Vorlesewerkzeugen. */ .latein { font-style: italic; } .sperrsatz-an .latein { font-style: italic; letter-spacing: 0; } /* Zentriert gesetzte Absaetze — im Druck mittig, aber keine Ueberschrift: also keine Auszeichnungsschrift, kein Sperrsatz, nur mittig. */ .text-unit.rend-center { text-align: center; text-align-last: center; } body.dipl-mode .text-unit.rend-center .dipl-line { justify-content: center; } /* Verzeichnisebenen 7 bis 9. Die Kritik der reinen Vernunft gliedert so tief; bis Ebene 6 zu gestalten hiess, 209 Eintraege flach zu zeigen. */ .toc-list li[data-level="7"]{padding-left:3.6rem} .toc-list li[data-level="7"] a{font-size:0.72rem;color:var(--text-body);opacity:0.72} .toc-list li[data-level="8"]{padding-left:4.2rem} .toc-list li[data-level="8"] a{font-size:0.71rem;color:var(--text-body);opacity:0.69} .toc-list li[data-level="9"]{padding-left:4.8rem} .toc-list li[data-level="9"] a{font-size:0.70rem;color:var(--text-body);opacity:0.66} .toc-list li.toc-active[data-level="7"]{padding-left:calc(3.6rem - 2px)} .toc-list li.toc-active[data-level="8"]{padding-left:calc(4.2rem - 2px)} .toc-list li.toc-active[data-level="9"]{padding-left:calc(4.8rem - 2px)} /* Die Bandliste fasst 22 Eintraege — ohne Hoehenbegrenzung lief sie aus dem Bild und liess sich nicht rollen. Der gewaehlte Band wird beim Aufklappen in den sichtbaren Bereich geholt (siehe `werkwahlAuf` in text.html). */ .werkwahl-liste::-webkit-scrollbar{width:8px} .werkwahl-liste::-webkit-scrollbar-thumb{background:var(--rule);border-radius:4px} /* macOS blendet Rollleisten aus, bis man rollt — in einem Aufklappfeld sieht das aus, als gaebe es keine. Hier bleiben sie sichtbar, damit erkennbar ist, dass unter dem Rand noch etwas steht. */ .mehrwahl-liste,.auswahl-liste,.werkwahl-liste,.einstellungen-panel{ scrollbar-width:thin;scrollbar-color:var(--rule) transparent} .mehrwahl-liste::-webkit-scrollbar,.auswahl-liste::-webkit-scrollbar{width:9px} .mehrwahl-liste::-webkit-scrollbar-thumb,.auswahl-liste::-webkit-scrollbar-thumb{ background:var(--rule);border-radius:5px;border:2px solid transparent;background-clip:content-box} .mehrwahl-liste::-webkit-scrollbar-thumb:hover,.auswahl-liste::-webkit-scrollbar-thumb:hover{ background:var(--accent-gold);background-clip:content-box} /* Der Suchkopf klemmt seinen Hintergrund mit `overflow:hidden` ein — und schnitt damit die aufgeklappte Werkauswahl ab, solange noch nicht gesucht worden war. Solange das Feld offen ist, faellt die Klemme weg. `:has()` deckt den Fall auch dann ab, wenn die Klasse einmal nicht gesetzt wird. */ .search-hero-area.feld-offen, .search-hero-area:has(.mehrwahl-liste:not([hidden])){overflow:visible} /* ── Suchkopf: nicht unter den Kopf zentrieren ──────────────────────────── `.search-hero-area` zentriert seinen Inhalt in einer Box von `100vh - var(--header-h)`. Solange der Inhalt kleiner war als die Box, ging das gut. Seit die Syntaxhilfe von Anfang an offensteht — und erst recht, wenn der Spendenbalken `--header-h` waschsen laesst — ist er groesser, und Flex-Zentrierung laesst den Ueberschuss **auf beiden Seiten** hinauslaufen: oben verschwindet er unter der festen Kopfleiste. `safe center` zentriert nur, solange Platz ist, und faellt sonst auf `start` zurueck. Dazu eine Untergrenze fuer den oberen Abstand. */ .search-hero-area{align-items:safe center;padding-top:calc(var(--header-h) + 1.25rem)} @media (max-width:768px){ .search-hero-area{align-items:flex-start} } /* Ueberschrift im Einstellungsfeld: zwei Zeilen betreffen das Lesen, drei das Kopieren. Die Gruppe traegt den Unterschied, darum darf `Hervorhebung` zweimal vorkommen. */ .einstellungen-gruppe{ font-size:0.56rem;letter-spacing:0.2em;text-transform:uppercase; color:var(--accent-gold);padding:0.7rem 0.15rem 0.35rem; border-bottom:1px solid var(--rule);margin-bottom:0.2rem; } .einstellungen-gruppe:first-child{padding-top:0.15rem} .einstellungen-panel .btn-einzel-toggle{min-width:0;justify-content:center;width:100%} .einstellungen-panel .einstellungen-zeile-steuerung .btn-font{flex:1 1 0;min-width:0} /* Zahlentafel in den Editionsrichtlinien. Uebernommen aus der Hegel-Edition, damit beide Richtlinien gleich aussehen. */ .daten-tab{width:100%;border-collapse:collapse;margin:1.4rem 0;font-size:0.92rem} .daten-tab th,.daten-tab td{padding:0.5rem 0.7rem;border-bottom:1px solid var(--rule);text-align:left} .daten-tab th{font-size:0.68rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-muted);font-weight:400} .daten-tab td:nth-child(2),.daten-tab td:nth-child(3){font-variant-numeric:lining-nums tabular-nums} .daten-tab tbody tr:last-child td{border-bottom:none} /* ── Bildgespann und Bänderliste, aus der Hegel-Edition ──────────────── Beim ersten Anlauf habe ich die Regeln einzeln herausgesucht und ohne ihre Media Queries angehängt. Die mobilen Überschreibungen — eine Spalte, Bild über dem Text — standen dadurch unbedingt und schlugen genau das, was sie herstellen sollten. Darum hier mit ihrem Zusammenhang. */ .mit-bild{display:grid;grid-template-columns:12.5rem 1fr;gap:2.2rem;align-items:start;margin-bottom:2rem} .mit-bild--rechts{grid-template-columns:1fr 12.5rem} .mit-bild--rechts .portrait{order:2} .mit-bild-text{min-width:0} .mit-bild .about-lead{margin:0 0 1.1rem;max-width:none} .mit-bild .about-lead:last-child{margin-bottom:0} .portrait{margin:0.35rem 0 0} .portrait img{width:100%;height:auto;display:block;border:1px solid var(--rule);border-radius:2px} .portrait figcaption{margin-top:0.5rem;font-size:0.66rem;line-height:1.5;color:var(--text-muted);text-align:center} .portrait-jahr{font-variant-numeric:lining-nums tabular-nums} .portrait-quelle{opacity:0.75} .portrait.faksimile img{background:#fff} /* Die Bänder als Liste in zwei Spalten statt als Kachelfeld. */ .works-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 3rem;max-width:64rem;min-height:0} @media (max-width:820px){ /* Auf schmalen Schirmen steht das Bild über dem Text, nicht daneben. */ .mit-bild,.mit-bild--rechts{grid-template-columns:1fr;gap:1.4rem} .mit-bild--rechts .portrait{order:0} .portrait{max-width:16rem;margin-inline:auto} .works-grid{grid-template-columns:1fr;gap:0} } /* ── Bänderliste: die Zeilenform der Hegel-Edition ───────────────────── Acht Regeln fehlten, und es waren genau die, die aus der Kachel eine Zeile machen: Fluss in der Waagerechten, Grundlinienausrichtung, durchsichtiger Grund statt Kastenfläche. Wortgleich übernommen, damit beide Editionen nicht wieder auseinanderlaufen. */ .work-row{flex-direction:row;align-items:baseline;gap:0.9rem;padding:0.85rem 0.2rem; background:transparent;border:0;border-bottom:1px solid var(--rule);border-radius:0} .work-row:hover{background:transparent;border-bottom-color:var(--accent-gold)} .work-row-band{flex:0 0 1.9rem;font-size:1.15rem;text-align:right} .work-row-main{flex:1 1 auto;gap:0.1rem} .work-row-title{font-size:0.95rem;line-height:1.25} .work-row-meta{flex:0 0 auto;margin:0;padding:0;white-space:nowrap;font-size:0.7rem} .work-row-arrow{flex:0 0 auto;align-self:baseline;margin:0} @media (max-width:820px){ .work-row-meta{display:none} } /* ── Startseite: der Bau der Hegel-Edition, vollstaendig ─────────────── Zweimal habe ich einzelne Regeln nachgetragen und zweimal blieb ein Unterschied. Darum jetzt der Abgleich ueber den ganzen Satz: jede Regel der Hegel-Startseite, die hier fehlte, mit ihrem Media Query. Die Farben stehen in Variablen — Kants eigener Ton bleibt. */ .lp-section{padding:3.25rem 2rem} .lp-section-title{margin-bottom:1.4rem;font-size:1.85rem} .lp-section-label{margin-bottom:0.55rem;display:inline-flex;align-items:center;gap:0.6rem} .lp-section-label::after{content:"";display:block;width:2.2rem;height:1px;background:var(--accent-gold);opacity:0.55} .about-lead{margin-bottom:2rem} .about-cols{gap:2.2rem;margin-bottom:1.5rem} .about-section,.pubroadmap-section{ background:var(--bg-paper); box-shadow:0 0 0 100vmax var(--bg-paper); clip-path:inset(0 -100vmax); } .hero-rule{margin:1.05rem auto} .hero-sub{font-size:1rem;margin:0 auto 1.6rem;max-width:460px} .hero-version{margin-top:0.35rem} .hero-scroll{bottom:2rem;gap:0.45rem;opacity:0.75;transition:opacity 0.2s} .hero-scroll:hover{opacity:1} .hero-scroll span:first-child{font-size:0.58rem;letter-spacing:0.24em} .hero-scroll-line{height:26px} .hero-page .stats-bar{margin-top:5rem} .portrait img{width:100%;height:auto;display:block;border:1px solid var(--rule); border-radius:var(--radius);box-shadow:0 2px 14px var(--shadow-soft)} .portrait figcaption{margin-top:0.55rem;font-size:0.72rem;line-height:1.5; color:var(--text-muted);font-family:var(--font-body); padding-top:0.45rem;border-top:1px solid var(--rule)} .portrait-jahr{font-variant:small-caps;letter-spacing:0.07em;color:var(--accent-gold)} .portrait-quelle{font-size:0.66rem;opacity:0.7} .portrait img{filter:saturate(0.93) contrast(1.02)} .mit-bild > *:not(.portrait):not(.mit-bild-text){grid-column:1/-1} @media (max-width:768px){ .lp-section{padding:2.5rem 1.2rem} .lp-section-title{font-size:1.55rem;margin-bottom:1.1rem} .hero-scroll{display:none} .hero-page .stats-bar{margin-top:2rem} } @media (max-width:820px){ .portrait{max-width:12rem;margin:0 auto} .portrait figcaption{text-align:center} } /* Aufgeloeste Siglen des Nachlasses. Gepunktet unterstrichen, damit der Hinweis auffindbar ist, ohne wie ein Verweis auszusehen — es fuehrt nirgends hin, es erklaert nur. */ abbr.siglum{ text-decoration:underline dotted var(--rule); text-underline-offset:0.22em;cursor:help; } abbr.siglum:hover{text-decoration-color:var(--accent-gold)} /* Register der Losen Blaetter: viele kurze Zeilen, darum enger gesetzt als die Zahlentafel der Richtlinien, und die Blattsigle in einer Spalte, die nicht mitwaechst. */ .lb-tab{font-size:0.86rem} .lb-tab th[scope="row"]{white-space:nowrap;width:11rem;font-weight:500;color:var(--text-ink)} .lb-tab td{line-height:1.7} .lb-tab .lb-anz{width:3rem;text-align:right;color:var(--text-muted);font-variant-numeric:tabular-nums} .lb-tab a{white-space:nowrap} /* Jahresgruppen im Inhaltsverzeichnis. Sie gliedern, tragen aber keinen eigenen Inhalt — darum zurueckgenommen statt hervorgehoben. Anspringbar bleiben sie: wer das Jahr sucht, soll hinkommen. */ .toc-list li[data-jahr] a{ color:var(--text-muted);font-size:0.74rem;letter-spacing:0.06em; font-variant-numeric:lining-nums tabular-nums;opacity:0.65; } .toc-list li[data-jahr] a:hover{opacity:1;color:var(--accent-gold)} .toc-list li[data-jahr]{margin-top:0.5rem} /* ═══════════════════════════════════════════════════════════════════════════ HELL / DUNKEL / SYSTEM Uebernommen aus der Schwester-Edition am 29.08.2026. Zuvor kannte diese Edition nur die dunkle Darstellung; `themefarbe.js` war ein Rumpf, der allein die Farbe der Browserleiste setzte. ═══════════════════════════════════════════════════════════════════════════ */ /* Der Hellmodus ist durchgerechnet, nicht nach Augenmass gewaehlt. Jede Farbe gegen ihren Untergrund nach WCAG gemessen: Fliesstext 12,33:1 (AAA), gedaempft 5,42:1, Akzent 6,17:1, Bronze 5,41:1. Das Papier ist warm (#faf6ec) statt weiss — auf Weiss laege der Fliesstext rechnerisch hoeher, waere fuer laengeres Lesen aber greller. Das Gold des dunklen Modus (#cbaa5c) haette hier nur 1,9:1 und ist darum durch ein Bronze ersetzt. */ :root[data-theme="hell"]{ --bg-desktop:#f1ebdf; --bg-paper:#faf6ec; --bg-subtle:#f2ecdf; --bg-page:#fdfaf3; --text-ink:#24211c; --text-body:#332f28; --text-muted:#6b6459; --accent:#a8322b; --accent-gold:#7d6118; --accent-warm:#9a4a1c; --rule:#d9d1c1; --shadow-soft:rgba(60,50,35,0.07); --shadow-med:rgba(60,50,35,0.14); --header-bg:rgba(250,246,236,0.86); --header-bg-solid:rgba(250,246,236,0.97); --btn-primary-bg:#a8322b; --btn-primary-hover:#87241e; } /* Der Schatten unter dem Kopf war fuer dunklen Grund gedacht und wirkt auf Papier wie Schmutz. */ :root[data-theme="hell"] .site-header{box-shadow:0 1px 0 var(--rule)} /* Der Darstellungsschalter sitzt in der Kopfleiste, nicht im Zahnrad des Lesers: die Wahl gilt fuer die ganze Website, das Zahnrad gibt es aber nur in der Lektuere. `justify-self` wirkt erst, wenn die Kopfleiste auf das dreispaltige Raster der Schwester-Edition umgestellt wird; unter dem heutigen `flex`/`space-between` ist es wirkungslos und stoert nicht. */ .thema-schalter{justify-self:end;margin-left:1.2rem;flex-shrink:0;width:2rem;height:2rem;display:flex; align-items:center;justify-content:center;font-size:0.95rem;line-height:1; border:1px solid var(--rule);border-radius:3px;background:transparent; color:var(--text-muted);cursor:pointer;transition:color 0.2s,border-color 0.2s} .thema-schalter:hover{color:var(--accent-gold);border-color:var(--accent-gold)} @media (max-width:600px){.thema-schalter{margin-left:0.6rem}} /* Waehrend eines Themenwechsels laufen keine Uebergaenge. Gesetzt und im selben Wimpernschlag wieder entfernt von `themefarbe.js` — siehe die Begruendung dort. Ohne das animiert der Kopf seinen Hintergrund ueber 0,4 s mit und hinkt sichtbar hinter dem Rest der Seite her. */ :root.thema-wechselt, :root.thema-wechselt *, :root.thema-wechselt *::before, :root.thema-wechselt *::after{transition:none !important} /* ── Fussnoten nie im Blocksatz ──────────────────────────────────────────── Gilt fuer beide Ansichten und jede Fensterbreite. Die Notizen sind kuerzer und oft schmaler gesetzt als der Fliesstext; der Randausgleich reisst die Wortabstaende dort noch staerker auseinander als im Haupttext, und im Druckbild kommt hinzu, dass die Zeilenumbrueche ohnehin feststehen. Beide Klassennamen, weil die Daten dieser Edition `footnote` fuehren und die der Schwester-Edition `author_footnote`. */ .text-unit.type-footnote, .text-unit.type-author_footnote{text-align:left;text-align-last:left} /* BBAW source information and edition-specific references. */ [hidden] { display: none !important; } .source-notice { max-width: 62rem; margin: 1.5rem auto; padding: 1rem 1.25rem; border: 1px solid var(--border, #b8b0a0); border-radius: 3px; font-size: .9rem; line-height: 1.6; } .source-notice p { margin: .5rem 0 0; } .search-source-notice { max-width: 48rem; font-size: .86rem; } .bbaw-page-source { display: block; font-size: .7rem; font-weight: normal; line-height: 1.5; letter-spacing: 0; opacity: .8; padding: .25rem 0; } .bbaw-references { display: block; } .source-figure { font-size: .85em; padding: 1rem 0; } @media (max-width: 768px) { .source-notice { margin: 1rem .5rem; padding: .8rem; } } /* Old-AA layout: BBAW wording, official page boundaries, matched line metadata. */ .aa-line-marker { display:none; user-select:none; -webkit-user-select:none; } .aa-source-line,.aa-unmapped-line { display:inline; } #aa-lines-toggle[aria-pressed="true"] { border-color:var(--accent-gold); color:var(--accent-gold); } #jump-edition { font-size:.72rem; padding:.25rem 1.5rem .25rem .4rem; } /* Keep source-page anchors and citation metadata without displaying new-edition breaks. */ .page-divider.bbaw-source-boundary { height:0; margin:0; } .bbaw-source-boundary::before,.bbaw-source-boundary .page-sigel, .bbaw-source-boundary .bbaw-page-source { display:none; } .bbaw-source-boundary.source-document-start { height:auto; margin:2.5rem 0 1rem; } .bbaw-source-boundary.source-document-start .bbaw-page-source { display:block; } .bbaw-source-boundary.source-document-start .bbaw-references { display:none; } .aa-paginated .page-body > .text-unit:last-child { margin-bottom:1rem; } .aa-paginated .page-body > .text-unit.aa-continues-next { margin-bottom:0; } .aa-paginated .page-body > .text-unit.aa-continues-prev { margin-top:0; } /* The source can place a page boundary inside a word. No characters are added. */ .aa-page-break { display:block; position:relative; height:3.5rem; width:100%; font-size:1rem; font-style:normal; font-weight:normal; letter-spacing:0; user-select:none; -webkit-user-select:none; scroll-margin-top:calc(var(--header-h) + 6rem); } .aa-page-break::before { content:''; position:absolute; left:50%; top:50%; width:5rem; height:1px; transform:translate(-50%,-50%); background:linear-gradient(90deg,transparent,var(--text-muted) 16%,var(--text-muted) 84%,transparent); opacity:.55; } .aa-page-label { position:absolute; left:100%; margin-left:.9rem; top:50%; transform:translateY(-50%); font-family:var(--font-display); font-size:1.02em; font-weight:600; font-variant-numeric:oldstyle-nums; letter-spacing:.02em; color:var(--accent-gold); white-space:nowrap; } .aa-page-label::before { content:attr(data-label); } .aa-page-break:target .aa-page-label { color:var(--accent); } @media (min-width:769px) { .aa-lines-on .page-body { max-width:42rem; margin-inline:auto; } .aa-lines-on .aa-source-line { display:block; position:relative; white-space:nowrap; hyphens:none; -webkit-hyphens:none; text-align:justify; text-align-last:justify; text-indent:0; font-size:calc(1em * var(--aa-line-scale, 1)); } .aa-lines-on .aa-line-final,.aa-lines-on .aa-line-short { text-align-last:left; } .aa-lines-on .aa-unmapped-line { display:block; text-align:left; text-indent:0; } .aa-lines-on .aa-line-marker { display:block; position:absolute; right:100%; width:2.2em; margin-right:.8em; font-family:var(--font-mono); font-size:.68em; font-weight:normal; font-style:normal; letter-spacing:0; line-height:inherit; color:var(--text-muted); text-align:right; } .aa-line-marker::before { content:attr(data-no); } .aa-lines-on .type-heading .aa-line-marker { display:none; } .aa-lines-on .type-heading .aa-source-line,.aa-lines-on .rend-center .aa-source-line { text-align:center; text-align-last:center; white-space:normal; } } @media (max-width:1199px) { .aa-page-label { left:auto; right:0; margin:0; font-size:.85em; } } @media (max-width:768px) { #aa-lines-toggle { display:none; } .aa-page-break { height:2.75rem; } #jump-edition { max-width:4.5rem; } .reader-toolbar .toolbar-row1 { display:grid; width:100%; grid-template-columns:1fr auto; gap:.45rem .6rem; } .reader-toolbar .toolbar-left { grid-column:1; grid-row:1; } .reader-toolbar .toolbar-end { grid-column:2; grid-row:1; } .reader-toolbar .toolbar-search { grid-column:1 / -1; grid-row:2; width:100%; min-width:0; } .reader-toolbar .inline-search-wrap { flex:1; min-width:0; } .reader-toolbar #inline-search { width:100%; min-width:0; } } @media print { .aa-line-marker { display:none!important; } .aa-source-line,.aa-unmapped-line { display:inline!important; white-space:normal!important; } .aa-page-break { break-before:page; height:1.5rem; } .aa-page-label { left:auto; right:0; } .aa-ref-text { text-decoration:none!important; } }