/* ───────────────────────────────────────────────────────────────────────────── Stilblatt des Regelbogens — Grammatikmodul, Regelteil nach Découvertes. Verbindlich ist LOMOME_DESIGN_MASTER.md §6.5 „Der Regelbogen". Dieses Blatt ist die technische Fassung davon und gilt für JEDEN Bogen: Heft #F5F2E8 mit Lochung und Stapelschatten (§6.1), Tinte #1C3A7A, Tafel #2F4538 (§3.1), Modulfarbe Grammatik Terrakotta #C97B5A (§3.8), alles Manrope, keine Handschrift im Heft (§2). Die vier Marker (§6.5.1): .mark grün #AEEF94 hier greift die Regel .aus neonorange #FFA23A die Form, aus der es entsteht .abw neongelb #F2F53C worauf es ankommt .markPink pink #FFA6C6 so sagt man es nicht Es gibt genau EIN Stilblatt für alle Bände. Wer ein Bauteil braucht, das hier fehlt, trägt es hier ein — nicht im einzelnen Bogen. Zusammengeführt am 04.09.2026 aus den Musterbögen von Band 1. ───────────────────────────────────────────────────────────────────────────── */ /* Die Tokens und der Grund stehen auf EINER Klasse, nicht auf `:root`, `*` und `body`: das Blatt steht in der App in einem Kasten neben anderen Bildschirmen, und was hier global wäre, träfe die ganze App. Die Musterseite trägt die Klasse deshalb am `body` (06.09.2026, §6.5.8). */ .bogenRahmen{ --mod:#C97B5A; --mod-soft:rgba(201,123,90,.14); --tafel:#2F4538; --creme:#F5F5DC; --kreide:#F4F1E4; --marke:#98D8AA; --papier:#F5F2E8; --tinte:#1C3A7A; --print:#1C1810; --grau:#6B6358; --gruen:#AEEF94; --pink:#FFA6C6; --gelb:#F2F53C; --orange:#FFA23A; --abwFarbe:var(--gelb); --titel:'Manrope',-apple-system,BlinkMacSystemFont,sans-serif; --inter:-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,Inter,sans-serif; } .bogenRahmen *{box-sizing:border-box} .bogenRahmen{ margin:0;font-family:var(--titel);color:var(--creme);line-height:1.6; background-color:var(--tafel); background-image: radial-gradient(ellipse 62% 48% at 50% 12%, rgba(152,216,170,.16), transparent 70%), radial-gradient(ellipse 120% 90% at 50% 50%, transparent 45%, rgba(0,0,0,.46) 100%), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23p)' opacity='0.06'/%3E%3C/svg%3E"); background-attachment:fixed,fixed,fixed; } /* ── Tafel-Leiste ─────────────────────────────────────────────────────────── */ .bogenRahmen .leiste{display:flex;align-items:center;gap:16px;padding:16px 28px 14px; background:rgba(0,0,0,.20);border-bottom:1.5px solid rgba(245,245,220,.10)} .bogenRahmen .zurueck{font:400 13px var(--inter);color:rgba(245,245,220,.55)} .bogenRahmen .leisteTitel{position:absolute;left:50%;transform:translateX(-50%); font:400 13px var(--inter);color:rgba(245,245,220,.45)} .bogenRahmen .kopfAktionen{margin-left:auto;display:flex;align-items:center;gap:12px} .bogenRahmen .headAction{font:800 14px var(--inter);color:var(--mod); background:color-mix(in srgb,var(--mod) 16%,transparent); border:1.5px solid color-mix(in srgb,var(--mod) 55%,transparent); border-radius:10px;padding:9px 18px;cursor:pointer} .bogenRahmen .modLabel{font:400 12px var(--inter);letter-spacing:.06em;text-transform:uppercase; color:var(--mod);background:var(--mod-soft);border:1px solid rgba(201,123,90,.35); padding:5px 11px;border-radius:999px} .bogenRahmen .buehne{max-width:900px;margin:0 auto;padding:40px max(20px,4vw) 90px} .bogenRahmen .hinweis{font:500 12.5px var(--inter);color:#E8C79A;border:1px solid rgba(232,199,154,.30); background:rgba(232,199,154,.06);border-radius:8px;padding:10px 14px;margin:0 0 36px} /* ── Auswahl — Materialsprache der Übersichten (§9) ───────────────────────── */ /* Farbtokens Zeichen für Zeichen aus UnlockScreen.module.css: Titel und Zeilen in Kreide-Weiß #F5F5DC, die Modulfarbe nur an Rahmen, Chips und Bedienelementen. */ .bogenRahmen .auswahlTitel{font:800 28px var(--titel);color:#F5F5DC;margin:0;line-height:1.1; text-shadow:0 0 8px rgba(245,245,220,.40)} .bogenRahmen .auswahlSub{font:400 13px var(--titel);color:rgba(245,245,220,.70);margin:6px 0 20px} .bogenRahmen .pillen{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:22px} .bogenRahmen .pille{font:700 14px var(--titel);background:transparent; border:1.5px solid rgba(245,245,220,.12);color:rgba(245,245,220,.70); border-radius:12px;padding:12px 20px;cursor:pointer} .bogenRahmen .pille[aria-pressed="true"]{border-color:rgba(201,123,90,.40); background:rgba(201,123,90,.15);color:var(--mod)} .bogenRahmen .suchzeile{margin:0 0 22px} .bogenRahmen .suche{width:100%;background:transparent;border:none; border-bottom:1.5px solid rgba(245,245,220,.18); color:var(--creme);font:400 15px var(--titel);padding:8px 2px} .bogenRahmen .suche::placeholder{color:rgba(245,245,220,.26)} .bogenRahmen .suche:focus{outline:none;border-bottom-color:rgba(201,123,90,.6)} .bogenRahmen .karte{border:2px solid rgba(201,123,90,.45);border-radius:16px; background:rgba(255,255,255,.06);margin-bottom:14px;overflow:hidden; transition:border-color .18s,box-shadow .18s} .bogenRahmen .karte:hover{border-color:rgba(201,123,90,.65);box-shadow:0 10px 28px rgba(0,0,0,.28)} .bogenRahmen .karteKopf{display:flex;align-items:center;gap:12px;cursor:pointer;padding:14px 18px; background:rgba(0,0,0,.20);border-radius:14px 14px 0 0} .bogenRahmen .karteAuf{width:24px;height:24px;border-radius:7px; border:1px solid rgba(201,123,90,.25);background:rgba(201,123,90,.12); display:grid;place-items:center;font:700 11px var(--inter);color:var(--mod); flex:0 0 auto;transition:transform .15s} .bogenRahmen .offen .karteAuf{transform:rotate(90deg)} .bogenRahmen .karteTitel{font:700 19px var(--titel);color:#F5F5DC} .bogenRahmen .karteTitel span{font-weight:400;font-size:15px;color:rgba(245,245,220,.50)} .bogenRahmen .gruppeLab{font:700 11.5px var(--inter);letter-spacing:.11em;text-transform:uppercase; color:var(--marke);margin:30px 0 12px;padding-left:2px} .bogenRahmen .gruppeLab:first-child{margin-top:4px} .bogenRahmen .karteZahl{margin-left:auto;font:700 11px var(--inter);letter-spacing:.04em;color:var(--mod); background:rgba(201,123,90,.15);border:1px solid rgba(201,123,90,.40); border-radius:5px;padding:4px 10px;white-space:nowrap} .bogenRahmen .karteInhalt{display:none} .bogenRahmen .offen .karteInhalt{display:block} .bogenRahmen .zeile{display:flex;align-items:baseline;gap:16px;padding:13px 20px; border-top:1px solid rgba(245,245,220,.08);cursor:pointer} .bogenRahmen .zeile:hover{background:rgba(245,245,220,.05)} /* Zwei Spalten: links die Fundstelle, rechts die Überschrift — beide bündig */ .bogenRahmen .zRef{flex:0 0 auto;font:700 12px var(--inter);letter-spacing:.03em; color:rgba(245,245,220,.50);white-space:nowrap} .bogenRahmen [data-weg="band"] .zRef{width:74px} .bogenRahmen [data-weg="thema"] .zRef{width:176px} /* Der Weg „Buch" im Bildschirm: dort steht in der Spalte die ganze G-Angabe eines Bogens, bis zu „G 6 · G 8 · G 10" (gemessen 06.09.2026). */ .bogenRahmen [data-weg="buch"] .zRef{width:132px} /* Kapitel, die es im Buch nicht gibt — Gegenüberstellungen und Veranschaulichungen, die wir selbst schreiben. Sie tragen statt der Fundstelle die Modulfarbe. */ .bogenRahmen .zRef.eigen{color:var(--mod)} .bogenRahmen .zText{min-width:0;font:400 15px var(--titel);color:#F5F5DC} .bogenRahmen .pfeilRechts{margin-left:auto;color:rgba(245,245,220,.30);font-size:15px;flex:0 0 auto} .bogenRahmen .leer{font:400 14px var(--titel);color:rgba(245,245,220,.50);padding:18px 20px} .bogenRahmen .trenner{font:700 12px var(--inter);letter-spacing:.09em;text-transform:uppercase; color:var(--marke);margin:58px 0 8px} .bogenRahmen .trennerText{font:400 14px var(--titel);color:rgba(245,245,220,.55);margin:0 0 4px;max-width:64ch} /* ── Das Heft (§6.1) ──────────────────────────────────────────────────────── */ .bogenRahmen .heft{ position:relative;width:100%;max-width:900px;margin:24px auto 0; background-color:var(--papier); background-image: radial-gradient(ellipse 70% 40% at 22% 0%, rgba(255,255,255,.55), transparent 60%), radial-gradient(ellipse 60% 50% at 88% 100%, rgba(214,206,180,.30), transparent 62%), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E"); border:1px solid rgba(184,176,144,.35);border-radius:5px; box-shadow:3px 3px 0 -1px #DDD7C5,4px 4px 0 0 rgba(184,176,144,.5), 7px 7px 0 -1px #CFC8B2,8px 8px 0 0 rgba(184,176,144,.4), 0 16px 40px rgba(0,0,0,.34); padding:46px 54px 52px;color:var(--print);line-height:1.7} .bogenRahmen .heft::after{content:'';position:absolute;top:11px;left:50%;transform:translateX(-50%); width:13px;height:13px;border-radius:50%;background:rgba(0,0,0,.13); box-shadow:inset 0 1px 2px rgba(0,0,0,.35)} .bogenRahmen .hKopf{display:flex;align-items:flex-start;gap:15px 18px;padding-top:6px;flex-wrap:wrap} /* Der Titel bricht nie um; zu eng wird zuerst die Buchangabe umgebrochen. */ .bogenRahmen .hKopf > div:first-of-type{flex:1 1 260px;min-width:0} .bogenRahmen .hTitel,.bogenRahmen .hLabel{white-space:nowrap} .bogenRahmen .emblem{flex:0 0 auto;color:var(--tinte);margin-top:3px} .bogenRahmen .hLabel{font:700 11px var(--inter);letter-spacing:.11em;text-transform:uppercase;color:var(--grau)} .bogenRahmen .hTitel{font:800 30px var(--titel);color:var(--tinte);margin:2px 0 0;line-height:1.2} .bogenRahmen .hSub{font:400 15px var(--titel);color:var(--grau);margin:4px 0 0} .bogenRahmen .hBuch{margin-left:auto;text-align:right;font:700 11.5px var(--inter); letter-spacing:.05em;color:var(--grau);flex:0 0 auto;padding-top:4px} .bogenRahmen .hBuch b{display:block;font:800 14px var(--inter);letter-spacing:.03em;color:var(--tinte); margin-top:2px} .bogenRahmen .linie{height:1.5px;background:rgba(28,58,122,.24);margin:22px 0 30px;border-radius:1px} /* Textmarker — Rezept 1:1 aus UebersichtenALernScreen.module.css. Grün = die Endung · Gelb = die Ausnahme · Pink = nur der Fehler. */ /* Ein Marker ist ein Stück, kein Text: er bricht nicht um (09.09.2026, §6.5.1). Reißt eine Zeile mitten durch die angestrichene Form, zerfällt die Aussage des Markers in zwei halbe — `pruef_bogen.js` meldet das als „Marker über zwei Zeilen". Gemessen am Bestand: von 2 428 Markern sind 14 länger als 20 Zeichen, der längste 36 (`ais · ais · ait · ions · iez · aient`); keiner davon läuft mit dieser Zeile über. */ .bogenRahmen .mark,.bogenRahmen .aus,.bogenRahmen .abw,.bogenRahmen .markPink{white-space:nowrap} .bogenRahmen .mark{background:linear-gradient(to bottom,transparent 6%,var(--gruen) 16%,var(--gruen) 84%,transparent 96%); mix-blend-mode:multiply;color:var(--print);padding:0 1px;border-radius:2px; -webkit-box-decoration-break:clone;box-decoration-break:clone} .bogenRahmen .markPink{background:linear-gradient(to bottom,transparent 6%,var(--pink) 16%,var(--pink) 84%,transparent 96%); mix-blend-mode:multiply;color:var(--print);padding:0 1px;border-radius:2px; -webkit-box-decoration-break:clone;box-decoration-break:clone} /* Der pinke Leerblock: hier fehlt etwas. Seine Breite ist ein Maß, das das Blatt braucht, und steht deshalb hier und nicht im Aufruf (06.09.2026). */ .bogenRahmen .markPink.leerBlock{padding:0 7px} .bogenRahmen .abw{background:linear-gradient(to bottom,transparent 6%,var(--abwFarbe) 16%,var(--abwFarbe) 84%,transparent 96%); mix-blend-mode:multiply;color:var(--print);padding:0 1px;border-radius:2px; -webkit-box-decoration-break:clone;box-decoration-break:clone} /* Eine Markierung im Regel- oder Achtungstext bleibt in einer Zeile: bricht sie um, sieht sie aus wie zwei Markierungen (§6.5.1). */ .bogenRahmen .kText .mark,.bogenRahmen .kText .aus,.bogenRahmen .kText .abw,.bogenRahmen .kText .markPink{white-space:nowrap} /* orange: der Buchstabe, AUS dem die Ausnahme entsteht — nur in den Sonderfällen */ .bogenRahmen .aus{background:linear-gradient(to bottom,transparent 6%,var(--orange) 16%,var(--orange) 84%,transparent 96%); mix-blend-mode:multiply;color:var(--print);padding:0 1px;border-radius:2px; -webkit-box-decoration-break:clone;box-decoration-break:clone} /* ── Zeitfarben (§6.5.9) ─────────────────────────────────────────────────── Der zweite Kanal neben den vier Markern. Die Zeit steht in einem leicht eingefärbten Kasten mit Rahmen und feiner Schraffur — wie der Achtung-Kasten, nur in der Farbe ihrer Zeitstufe. Die Schrift bleibt Tinte; die Farbe trägt nie allein, neben ihr steht immer der Name der Zeit. Die Zeitstufe wählt den Farbton: Gegenwart grün, Vergangenheit blau, Zukunft rot, Möglichkeit violett. Gold ist keine Zeitstufe, sondern die Haltung des Sprechers — dort stehen die beiden Modi, subjonctif und impératif. Eine zusammengesetzte Form trägt einen zweiten Ring. */ .bogenRahmen{ --z-praesens:#1F8A4C; /* Gegenwart */ --z-imparfait:#3E86C8; /* Vergangenheit */ --z-passecompose:#0E7C86; --z-plusqueparfait:#2A4C9B; --z-passesimple:#5C7A93; --z-futur:#C43D2E; /* Zukunft */ --z-futurant:#8E2A20; --z-conditionnel:#8B4BAE; /* Möglichkeit */ --z-conditionnelpasse:#6A2E8E; --z-subjonctif:#A97B18; /* Haltung — die beiden Modi */ --z-imperatif:#A97B18; /* Englisch: das going-to-future ist keine Aspektvariante des will-future, sondern eine eigene Form — es braucht darum einen eigenen Ton. Der am 08.09. geliehene --z-futurant lag mit ΔE 19,5 unter dem Abstand, den die Palette sonst hält (27 bis 54); gemessen am 09.09.2026. Dieser Ton hält ΔE 29,8 zum will-future und bleibt im roten Feld. */ --z-en-goingto:#6B1608; } /* Französisch (§6.5.9) */ .bogenRahmen [data-zeit="praesens"]{--zf:var(--z-praesens)} .bogenRahmen [data-zeit="imperatif"]{--zf:var(--z-imperatif)} .bogenRahmen [data-zeit="imparfait"]{--zf:var(--z-imparfait)} .bogenRahmen [data-zeit="passe-compose"]{--zf:var(--z-passecompose)} .bogenRahmen [data-zeit="passe-recent"]{--zf:var(--z-imparfait)} .bogenRahmen [data-zeit="plus-que-parfait"]{--zf:var(--z-plusqueparfait)} .bogenRahmen [data-zeit="passe-simple"]{--zf:var(--z-passesimple)} .bogenRahmen [data-zeit="futur"],.bogenRahmen [data-zeit="futur-proche"]{--zf:var(--z-futur)} .bogenRahmen [data-zeit="futur-anterieur"]{--zf:var(--z-futurant)} .bogenRahmen [data-zeit="conditionnel"]{--zf:var(--z-conditionnel)} .bogenRahmen [data-zeit="conditionnel-passe"]{--zf:var(--z-conditionnelpasse)} .bogenRahmen [data-zeit="subjonctif"],.bogenRahmen [data-zeit="subjonctif-passe"]{--zf:var(--z-subjonctif)} /* Englisch (§6.5.10, 08.09.2026) — die Farbe kommt von der Zeitstufe, der Aspekt vom Rahmen. Kein neuer Farbwert: die sieben Töne stehen schon oben. */ .bogenRahmen [data-zeit="present-simple"],.bogenRahmen [data-zeit="present-progressive"],.bogenRahmen [data-zeit="present-perfect"],.bogenRahmen [data-zeit="present-perfect-progressive"]{--zf:var(--z-praesens)} .bogenRahmen [data-zeit="past-simple"],.bogenRahmen [data-zeit="past-progressive"]{--zf:var(--z-imparfait)} .bogenRahmen [data-zeit="past-perfect"],.bogenRahmen [data-zeit="past-perfect-progressive"]{--zf:var(--z-plusqueparfait)} .bogenRahmen [data-zeit="will-future"],.bogenRahmen [data-zeit="future-progressive"],.bogenRahmen [data-zeit="future-perfect"]{--zf:var(--z-futur)} .bogenRahmen [data-zeit="going-to-future"]{--zf:var(--z-en-goingto)} .bogenRahmen [data-zeit="conditional"],.bogenRahmen [data-zeit="conditional-perfect"]{--zf:var(--z-conditionnel)} .bogenRahmen [data-zeit="imperative"]{--zf:var(--z-imperatif)} /* Der Kasten ist mit dem Buntstift gezogen, nicht gedruckt: der Rahmen liegt auf einem eigenen Feld und trägt den Bleistiftfilter, damit er neben dem Textmarker als zweites Schreibgerät erkennbar bleibt. Die Schraffur ist weit und leise; die Schrift bleibt Tinte. */ /* Alle Zeitkästen sind gleich hoch, gleich welche Schriftgröße darin steht — der Name einer Zeit im Spaltenkopf (10px) und die Verbform im Satz (20px) sollen als dasselbe Bauteil zu erkennen sein. */ .bogenRahmen .zeitKasten[data-zeit]{position:relative;display:inline-block;white-space:nowrap; min-height:24px;line-height:24px;text-transform:none;letter-spacing:normal; color:var(--tinte);padding:0 .5em;margin:0 3px; background-color:color-mix(in srgb,var(--zf) 6%,transparent); background-image:repeating-linear-gradient(45deg, color-mix(in srgb,var(--zf) 9%,transparent) 0 2px,transparent 2px 9px); border-radius:6px} .bogenRahmen .zeitKasten[data-zeit]::before{content:"";position:absolute;inset:0; border:1.6px solid var(--zf);border-radius:6px; filter:url(#pencil-rough);pointer-events:none} /* zusammengesetzte Form: ein zweiter Strich um den Kasten */ .bogenRahmen .zeitKasten.zDoppelt[data-zeit]::after{content:"";position:absolute;inset:-3.5px; border:1.4px solid var(--zf);border-radius:8px; filter:url(#pencil-rough);pointer-events:none} /* Der zweite Strich liegt 3,5 px außerhalb des Kastens. Ohne eigenen Rand stieß er im Fließtext ans nächste Wort („[had seen]the film“, EN-09-01) und in die Unterlängen der Zeile darüber (EN-06-03, EN-09-08). Der Außenrand hält ihm genau diesen Platz frei; der senkrechte Teil macht die Zeile, in der er steht, um so viel höher (11.09.2026, gemessen an 27 Stellen). */ .bogenRahmen .zeitKasten.zDoppelt[data-zeit]{margin:3.5px 6.5px} /* Umschreibung (futur proche, passé récent): gestrichelt */ .bogenRahmen .zeitKasten.zStrich[data-zeit]::before{border-style:dashed} /* ── Der Zeitstrahl (§6.5.9) ───────────────────────────────────────────── Eine Achse für alle Bögen, klein unter dem Blattkopf: dieselben elf Namen an denselben Stellen, auf jedem Bogen, dessen Thema eine Zeit ist. Der Bogen setzt genau einen davon in seinen Zeitkasten; die übrigen stehen in blasser Tinte. Alles hier ist Tinte — der zweite Kanal trägt seine Farbe allein im einen Kasten, und die Achse behauptet keine Zeit, die auf diesem Blatt nicht gemeint ist. Grau kommt nicht vor: grau ist Übersetzung und Beiwerk (§6.5.1), die Achse gehört zum Kern. */ .bogenRahmen .zeitstrahl{margin:2px 0 20px} .bogenRahmen .zsLinie{position:relative;height:0;margin:0 0 9px} .bogenRahmen .zsLinie::before{content:"";position:absolute;left:0;right:20px;top:0; border-top:1.6px solid rgba(28,58,122,.55);filter:url(#pencil-rough)} .bogenRahmen .zsLinie::after{content:"";position:absolute;right:0;top:-5px;width:0;height:0; border-left:11px solid rgba(28,58,122,.55); border-top:5.5px solid transparent;border-bottom:5.5px solid transparent; filter:url(#pencil-rough)} .bogenRahmen .zsAchse{display:grid;grid-template-columns:repeat(4,1fr);column-gap:16px} .bogenRahmen .zsFeld{position:relative;display:block;padding-top:12px} .bogenRahmen .zsFeld::before{content:"";position:absolute;left:0;top:-13px; width:1.4px;height:13px;background:rgba(28,58,122,.55); filter:url(#pencil-rough)} .bogenRahmen .zsStufe{display:block;font:700 10px var(--titel);letter-spacing:.08em; text-transform:uppercase;color:rgba(28,58,122,.62);margin:0 0 7px} .bogenRahmen .zsListe{display:flex;flex-direction:column;align-items:flex-start;gap:5px} .bogenRahmen .zsName{display:inline-block;font:600 13px/24px var(--titel); color:rgba(28,58,122,.50);padding:0 .5em; min-height:24px;white-space:nowrap;text-align:center} /* Die Kurzform `font:` setzt die Zeilenhöhe zurück; sie steht hier deshalb mit im Wert, sonst sitzt das Wort am oberen Rand seines 24-px-Kastens. */ .bogenRahmen .zeitstrahl .zeitKasten[data-zeit]{font:700 13px/24px var(--titel); margin:0;text-align:center} /* Möglichkeit und Haltung liegen unter der Achse — sie sagen nicht wann. */ .bogenRahmen .zsDaneben{display:flex;flex-wrap:wrap;gap:8px 34px;margin:16px 0 0; padding:11px 0 0;border-top:1.2px dashed rgba(28,58,122,.26)} .bogenRahmen .zsGruppe{display:flex;align-items:center;gap:9px} .bogenRahmen .zsGruppeLab{font:700 10px var(--titel);letter-spacing:.08em; text-transform:uppercase;color:rgba(28,58,122,.62);white-space:nowrap} /* ── Der Weg (§6.5.3) ──────────────────────────────────────────────────── Der Entscheidungsweg in nummerierten Schritten. Alles ist Tinte: die Ringe, die verbindende Linie und die Fragen. Farbe trägt nur, was ohnehin gilt — der Marker am Wort, auf das die Frage zielt, und der Zeitkasten dort, wo die Antwort eine Zeit ist. Ring und Linie tragen den Bleistiftfilter, damit sie als gezogen und nicht als gedruckt zu erkennen sind. */ .bogenRahmen .weg{display:flex;flex-direction:column;gap:0;margin:2px 0 4px} .bogenRahmen .wegLab{display:block;font:700 10px var(--titel);letter-spacing:.08em; text-transform:uppercase;color:rgba(28,58,122,.62);margin:0 0 12px} .bogenRahmen .wegSchritt{position:relative;display:grid;grid-template-columns:30px 1fr; column-gap:14px;padding:0 0 20px} .bogenRahmen .wegSchritt:last-child{padding-bottom:0} /* die Linie führt von einem Ring zum nächsten */ .bogenRahmen .wegSchritt:not(:last-child)::before{content:"";position:absolute; left:14.5px;top:30px;bottom:2px;width:1.5px; background:rgba(28,58,122,.45);filter:url(#pencil-rough)} .bogenRahmen .wegNr{position:relative;width:30px;height:30px;border-radius:50%; display:flex;align-items:center;justify-content:center; font:800 14px/30px var(--titel);color:var(--tinte)} .bogenRahmen .wegNr::before{content:"";position:absolute;inset:0;border-radius:50%; border:1.6px solid rgba(28,58,122,.55); filter:url(#pencil-rough);pointer-events:none} .bogenRahmen .wegFrage{font:700 16px/30px var(--titel);color:var(--tinte)} .bogenRahmen .wegAus{display:flex;flex-wrap:wrap;gap:6px 26px;margin:7px 0 0} .bogenRahmen .wegAst{display:flex;align-items:center;gap:8px;font:400 15px/24px var(--titel)} .bogenRahmen .wegJa{font:700 13px/24px var(--titel);color:var(--tinte); min-width:34px;text-align:right;white-space:nowrap} .bogenRahmen .wegPfeil{color:rgba(28,58,122,.55);font-size:15px;line-height:24px} .bogenRahmen .wegZiel{font:600 15px/24px var(--titel);color:var(--tinte)} .bogenRahmen .wegAst i{color:var(--grau);font-size:13px;line-height:24px} /* ── Die Probe (§6.5.3) ────────────────────────────────────────────────── Vier Spalten in jeder Zeile: Satz · Frage · Antwort · Benennung. Weil das Gitter für alle Zeilen dasselbe ist, beginnt die Frage in jeder Zeile an derselben Stelle — was zusammengehört, steht untereinander (§6.5.9). Die Benennung ist grau: sie ist Beiwerk, die Antwort trägt. */ .bogenRahmen .probe{margin:2px 0 4px} .bogenRahmen .probeLab{display:block;font:700 10px var(--titel);letter-spacing:.08em; text-transform:uppercase;color:rgba(28,58,122,.62);margin:0 0 12px} .bogenRahmen .probeGitter{display:grid;grid-template-columns:auto auto auto auto auto; column-gap:20px;row-gap:11px;align-items:baseline;justify-content:start} .bogenRahmen .pSatz{font:600 17px/26px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .pFrage{font:400 15px/26px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .pPfeil{color:rgba(28,58,122,.55);font-size:15px;line-height:26px} .bogenRahmen .pAntwort{font:700 15px/26px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .pWas{font:400 14px/26px var(--titel);color:var(--grau);white-space:nowrap} /* die Trennlinie zwischen zwei Proben — gezogen, nicht gedruckt */ .bogenRahmen .probeGitter .pTrenn{grid-column:1 / -1;height:1px; background:rgba(28,58,122,.20);filter:url(#pencil-rough);margin:1px 0} /* ── Das Merkbild (§6.5.3) ─────────────────────────────────────────────── Ein Bild je Seite einer Gegenüberstellung. Gezeichnet wie das Emblem im Blattkopf: Tinte, Strichstärke 1,7, runde Enden, kein Füllen, dazu der Bleistiftfilter — es ist gezeichnet, nicht gedruckt. Das Merkbild ist die einzige Zeichnung im Blattkörper. */ .bogenRahmen .merkbild{display:flex;gap:26px;flex-wrap:wrap;margin:2px 0 4px} .bogenRahmen .mSeite{flex:1 1 260px;display:grid;grid-template-columns:52px 1fr; column-gap:16px;align-items:center} .bogenRahmen .mZeichnung{width:52px;height:52px;color:var(--tinte);filter:url(#pencil-rough)} .bogenRahmen .mZeit{margin:0 0 5px} .bogenRahmen .mWort{font:800 19px/26px var(--titel);color:var(--tinte)} .bogenRahmen .mSatz{font:400 14px/22px var(--titel);color:var(--grau);margin:2px 0 0} /* ── Das Raster (§6.5.3) ───────────────────────────────────────────────── Drei Felder nebeneinander — für die Übersichtsbögen, die eine Ordnung zeigen statt einer Regel. Ein Raster je Bogen: zwei nebeneinander messen ihre Spalten je für sich und laufen auseinander (§6.5.9, Bündigkeit). */ .bogenRahmen .raster{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:2px 0 20px} .bogenRahmen .rFeld{border:1px solid rgba(28,58,122,.14);border-radius:5px; background:rgba(255,255,255,.42);padding:14px 16px 16px} .bogenRahmen .rStufe{display:block;font:700 10px var(--inter);letter-spacing:.11em; text-transform:uppercase;color:var(--grau);margin-bottom:10px;padding-bottom:6px; border-bottom:1px solid rgba(28,58,122,.10)} .bogenRahmen .rZeile{margin:0 0 13px} .bogenRahmen .rZeile:last-child{margin-bottom:0} .bogenRahmen .rSatz{display:block;font:600 17px/1.5 var(--titel);color:var(--tinte)} .bogenRahmen .rDe{display:block;font:400 13px var(--titel);color:var(--grau);margin:2px 0 0} .bogenRahmen .rFrage{display:block;font:400 13px var(--titel);color:var(--grau);margin:4px 0 0} /* die Signalwörter mit ihrer Zeit davor */ .bogenRahmen .signalZeile{display:grid;grid-template-columns:auto 1fr;gap:14px; align-items:baseline;margin:0 0 12px} .bogenRahmen .signalZeile:last-child{margin-bottom:0} /* in der Zeile stehen die Wörter beieinander, nicht über die Breite verteilt: sie gehören zu dem Kasten links, nicht zum Rand rechts */ .bogenRahmen .signalZeile .signalWorte{justify-content:flex-start;gap:12px 26px} /* ── Der Streifen (§6.5.3) ─────────────────────────────────────────────── Ein Verb durch mehrere Zeiten, vier Spalten in jeder Zeile: die Zeit, die Form, aus der ihr Stamm kommt, die Endungen und das Ergebnis. Ein Gitter für alle Zeilen, damit jede Spalte an derselben Stelle beginnt (§6.5.9). Der Streifen ordnet nach Bildung, nicht nach Zeit — er trägt deshalb keinen Zeitstrahl: seine erste Spalte ist die Achse. */ .bogenRahmen .streifen{display:grid;grid-template-columns:auto auto auto auto; column-gap:12px;row-gap:0;align-items:baseline; border:1px solid rgba(28,58,122,.14);border-radius:5px; background:rgba(255,255,255,.42);padding:14px 11px 16px;margin:2px 0 20px} .bogenRahmen .stKopf{font:700 10px var(--inter);letter-spacing:.11em;text-transform:uppercase; color:var(--grau);padding:0 0 7px} .bogenRahmen .stTrenn{grid-column:1 / -1;height:1px;background:rgba(28,58,122,.12);margin:0 0 11px} .bogenRahmen .stZeit{padding:0 0 13px} .bogenRahmen .stStamm,.bogenRahmen .stEnd{font:400 13px/26px var(--titel);color:var(--tinte); padding:0 0 13px;white-space:nowrap} .bogenRahmen .stForm{font:700 16px/26px var(--titel);color:var(--tinte); padding:0 0 13px;white-space:nowrap} .bogenRahmen .streifen > :nth-last-child(-n+4){padding-bottom:0} /* ── Die Zeitentafel (§6.5.3) ──────────────────────────────────────────── Drei Spalten — die Zeit, wie sie gebaut ist, ein Beispiel —, darunter je Zeile eine graue Zeile: wann sie steht. Vier Spalten nebeneinander wären 789 px breit gemessen; die Spur trägt 620. Der Gebrauch steht deshalb unter der Zeile, nicht neben ihr. */ .bogenRahmen .zTafel{display:grid;grid-template-columns:auto 1fr auto;column-gap:14px;row-gap:0; align-items:baseline} .bogenRahmen .zKopf{font:700 10px var(--inter);letter-spacing:.11em;text-transform:uppercase; color:var(--grau);padding:0 0 6px} .bogenRahmen .zZeit{padding:0 0 3px} .bogenRahmen .zBild{font:400 13px/26px var(--titel);color:var(--tinte);padding:0 0 3px} .bogenRahmen .zForm{font:700 15px/26px var(--titel);color:var(--tinte);padding:0 0 3px; white-space:nowrap} .bogenRahmen .zWann{grid-column:1 / -1;font:400 12.5px/1.4 var(--titel);color:var(--grau); padding:0 0 12px} .bogenRahmen .zTafel > :last-child{padding-bottom:0} /* die Liste der Verben, die mit être gehen */ .bogenRahmen .hausListe{display:flex;flex-wrap:wrap;gap:5px 16px; font:600 15px/1.7 var(--titel);color:var(--tinte)} .bogenRahmen .hausNote{display:block;font:400 12.5px var(--titel);color:var(--grau);margin:9px 0 0} /* die Probe in der Zeichenerklärung — neutral, damit sie keine Zeit behauptet */ .bogenRahmen .probeZeit{color:var(--tinte);border:1.5px solid rgba(28,58,122,.55); border-radius:5px;padding:1px 8px 2px; background-image:repeating-linear-gradient(45deg,rgba(28,58,122,.10) 0 2px, transparent 2px 7px)} /* ── Die drei Bedingungssätze nebeneinander ─────────────────────────────── Drei Spalten: was im si-Satz steht, was im anderen Satzteil steht, was der Satz meint. Orange ist der si-Satz (die Form, aus der es entsteht), gelb der andere Satzteil (worauf es ankommt) — wie auf den drei Einzelbögen. */ /* ── Die Tafel der Bedingungssätze (§6.5.9) ─────────────────────────────── Eine Tafel je Bogen. Der Name der Zeit steht in derselben Spalte wie der Satz, der in ihr steht — was zusammengehört, steht untereinander. */ .bogenRahmen .bedKopf{display:flex;align-items:center;gap:9px;margin:0 0 2px; font:700 14px var(--titel);color:var(--tinte)} .bogenRahmen .bedKopf i{font:400 12.5px var(--titel);font-style:normal;color:var(--grau); margin-left:auto} .bogenRahmen .siTyp{position:relative;flex:0 0 auto;display:inline-flex;align-items:center; justify-content:center;min-width:27px;height:23px;padding:0 5px; font:800 12px var(--inter);letter-spacing:.04em;color:var(--tinte)} .bogenRahmen .siTyp::before{content:"";position:absolute;inset:0;border-radius:12px; border:1.8px solid var(--tinte);filter:url(#pencil-rough)} /* Die Tafel steht in Teilspalten: si, was davor steht, die Verbform, was dahinter steht — und ebenso für den anderen Satzteil. Dadurch beginnt die Verbform in jeder Zeile an derselben Stelle, und der Name der Zeit steht genau darüber. */ .bogenRahmen .bedTab{display:grid; grid-template-columns:auto auto auto auto auto auto auto minmax(110px,1fr); gap:0 5px;margin:4px 0 0;align-items:baseline} .bogenRahmen .vglTab{display:grid; grid-template-columns:auto auto auto auto auto auto auto auto; gap:0 5px;margin:2px 0 0;align-items:baseline} .bogenRahmen .stKopf{font:700 10px var(--inter);letter-spacing:.12em;text-transform:uppercase; color:var(--grau);padding-bottom:8px;border-bottom:1px solid rgba(28,58,122,.14)} .bogenRahmen .stSi,.bogenRahmen .stVor,.bogenRahmen .stVerb,.bogenRahmen .stNach,.bogenRahmen .stVor2,.bogenRahmen .stVerb2,.bogenRahmen .stNach2{ font:700 16px var(--titel);color:var(--tinte);white-space:nowrap;padding:5px 0 3px} .bogenRahmen .stVor,.bogenRahmen .stVor2{text-align:right} .bogenRahmen .stVor2{padding-left:20px} .bogenRahmen .stDe{font:400 13px var(--titel);color:var(--grau);padding:5px 0 3px 22px} /* Der Name der Zeit hängt frei über der Verbform: er beginnt genau an ihrer Kante und macht die Spalte nicht breiter. */ .bogenRahmen .bedZeit{position:relative;height:34px;padding:0} .bogenRahmen .bedZeit>span{position:absolute;left:0;bottom:2px;white-space:nowrap} .bogenRahmen .bedTab .zeitKasten,.bogenRahmen .vglTab .zeitKasten{margin:0} /* In den Teilspalten liegen schon 5 px Spaltenabstand neben dem Kasten; der zweite Strich nahm davon 3,5 und ließ 1,5 px zum Nachbarwort („had had|time,“, EN-10-03). 2 px Außenrand geben ihm 3,5 px Luft, so viel wie zwischen den beiden Strichen. Die 2 px nimmt der Kasten aus seinem eigenen Innenrand (.5em → .5em − 2px): so bleibt er gleich breit, und keine Tafel wird breiter. Ohne diesen Ausgleich lief die Typtafel mit drei doppelten Kästen je Zeile um 19 px über die Spur (D4-G10, EN-07-10; gemessen 11.09.2026). */ .bogenRahmen .bedTab .zeitKasten.zDoppelt[data-zeit],.bogenRahmen .vglTab .zeitKasten.zDoppelt[data-zeit]{ margin:3.5px 2px;padding:0 calc(.5em - 2px)} .bogenRahmen .bedKopf{display:flex;align-items:center;gap:9px;margin:0 0 2px; font:700 14px var(--titel);color:var(--tinte)} .bogenRahmen .bedKopf i{font:400 12.5px var(--titel);font-style:normal;color:var(--grau); margin-left:auto} .bogenRahmen .siTyp{position:relative;flex:0 0 auto;display:inline-flex;align-items:center; justify-content:center;min-width:27px;height:23px;padding:0 5px; font:800 12px var(--inter);letter-spacing:.04em;color:var(--tinte)} .bogenRahmen .siTyp::before{content:"";position:absolute;inset:0;border-radius:12px; border:1.8px solid var(--tinte);filter:url(#pencil-rough)} .bogenRahmen .vglFall{grid-row:span 3;display:flex;flex-direction:column;justify-content:center; gap:4px;font:700 13.5px var(--titel);color:var(--tinte); padding:12px 18px 5px 0;border-top:1px solid rgba(28,58,122,.10)} .bogenRahmen .vglFall i{font:400 12px var(--titel);font-style:normal;color:var(--grau)} .bogenRahmen .vglFall .siTyp{align-self:flex-start} .bogenRahmen .vglTab .bedZeit{border-top:1px solid rgba(28,58,122,.10);height:40px} .bogenRahmen .vglDe{font:400 13px var(--titel);color:var(--grau);padding:1px 0 11px} /* ── EIN Bauteil: der Kasten. Beschriftung oben links, Fragezeichen oben rechts, Beispiele eingerückt darunter. Drei Sorten, sonst keine. ─────────────── */ .bogenRahmen .kasten{border-radius:5px;padding:15px 20px 17px;background:rgba(255,255,255,.32)} .bogenRahmen .kLab{display:block;font:700 10.5px var(--inter);letter-spacing:.13em; text-transform:uppercase;color:var(--grau);margin-bottom:9px} .bogenRahmen .kText{font:700 16px var(--titel);color:var(--print);margin:0} /* Ein hervorgehobenes Wort im Erklärsatz: der Satz selbst steht auf 700, ein darin bliebe ohne eigene Regel unsichtbar. Manrope wird mit 400, 500, 700 und 800 geladen — 800 ist der nächste Schnitt (08.09.2026). */ .bogenRahmen .kText b{font-weight:800} .bogenRahmen .kKopf{display:flex;align-items:center;gap:12px;margin-bottom:9px} .bogenRahmen .kKopf .kLab{margin-bottom:0} .bogenRahmen .kHerkunft{margin-left:auto;font:700 10px var(--inter);letter-spacing:.05em; color:rgba(107,99,88,.75);white-space:nowrap} .bogenRahmen .kasten.regel{border:2px solid rgba(28,58,122,.45)} .bogenRahmen .kasten.regel .kText{font-size:17px} /* Die Ausnahme ist EIN Kasten: oben die Regel, unten — durch eine Linie getrennt — ihre Beispiele. Der Rahmen sitzt deshalb auf .einheit. */ .bogenRahmen .einheit{border:2px solid var(--abwFarbe);border-radius:5px;overflow:hidden; background:color-mix(in srgb,var(--abwFarbe) 10%,rgba(255,255,255,.3))} .bogenRahmen .einheit .kasten.ausnahme{border:none;background:transparent;padding:14px 20px 15px} /* Kerninhalt und Listen, die keine Ausnahme sind, stehen im neutralen Rahmen — der Neongelb-Rahmen bleibt der Stolperstelle vorbehalten. */ .bogenRahmen .einheit.neutral{border:1px solid rgba(28,58,122,.18);background:rgba(255,255,255,.32)} .bogenRahmen .einheit.neutral .kasten{border:none;background:transparent;padding:14px 20px 15px} .bogenRahmen .kasten.rahmen{border:1px solid rgba(28,58,122,.18);padding:16px 24px 18px} .bogenRahmen .kasten.signal{border:1px solid rgba(28,58,122,.20);padding:16px 24px 20px} /* Fragezeichen — Tintenkreis mit dem Bleistift-Filter über einem Markerfleck, dasselbe Bauteil wie der Haken auf den Vokabelkarten. */ .bogenRahmen .frageWrap{position:relative;display:inline-flex;margin-left:auto;flex:0 0 auto} .bogenRahmen .blob{position:absolute;left:-4px;top:7px;width:36px;height:20px; background:var(--abwFarbe);mix-blend-mode:multiply;border-radius:3px; transform:rotate(-5deg);pointer-events:none} .bogenRahmen .frage{position:relative;width:30px;height:30px;border:2px solid var(--tinte); border-radius:50%;background:transparent;color:var(--tinte); font:800 17px var(--titel);line-height:1;cursor:pointer;padding:0; filter:url(#pencil-rough);transition:transform .15s} .bogenRahmen .frage:hover{transform:scale(1.08)} /* ── Die Spur: eine Mittelbahn, an der alles ausgerichtet ist ─────────────── */ .bogenRahmen .spur{width:min(100%,620px);margin:0 auto} .bogenRahmen .spur + .spur{margin-top:26px} .bogenRahmen .paar{display:flex;flex-direction:column;gap:18px} /* Gliederung */ .bogenRahmen .abschnitt{font:700 12px var(--inter);letter-spacing:.13em;text-transform:uppercase; color:var(--grau);margin:48px 0 0;display:flex;align-items:center;gap:14px} .bogenRahmen .abschnitt::after{content:'';flex:1;height:1px;background:rgba(28,58,122,.14)} .bogenRahmen .abschnitt + .spur{margin-top:26px} .bogenRahmen .block{margin:26px 0 0} .bogenRahmen .bKopf{display:flex;align-items:baseline;gap:14px;margin-bottom:22px} .bogenRahmen .bName{font:800 19px var(--titel);color:var(--tinte)} .bogenRahmen .bHerkunft{margin-left:auto;font:700 11px var(--inter);letter-spacing:.05em;color:var(--grau); border:1px solid rgba(107,99,88,.34);border-radius:5px;padding:2px 9px;white-space:nowrap} .bogenRahmen .glied{width:min(100%,620px);margin:34px auto 14px;display:flex;align-items:center;gap:12px} .bogenRahmen .gliedLab{font:800 12px var(--inter);letter-spacing:.14em;text-transform:uppercase;color:var(--grau)} .bogenRahmen .glied::after{content:'';flex:1;height:1px;background:rgba(28,58,122,.12)} /* Beispiele — immer unter ihrem Kasten und eingerückt */ .bogenRahmen .einheit + .einheit{margin-top:22px} /* Der Beispielteil der Einheit — und damit der Kasten, in dem eine Tafel aus `nachAchtung` steht. Er ist enger als die Spur: 620 px minus den Rahmen der Einheit minus 34 px links und 20 px rechts. Gemessen am 12.09.2026 (§6.5.3): **562 px** in der Ausnahme-Einheit mit ihrem 2 px starken Rahmen, **564 px** in der neutralen mit 1 px — nicht 620. Zwei Tafeln blieben unter 620 und brachen trotzdem um (EN-08-07, EN-09-06), weil die engere Zahl nirgends stand. Der Prüfer gibt sie seit demselben Tag zu jeder Tafel mit Befund selbst aus. */ .bogenRahmen .bsp{display:flex;flex-direction:column;gap:8px; padding:13px 20px 15px 34px;background:rgba(255,255,255,.42); border-top:1px solid color-mix(in srgb,var(--abwFarbe) 60%,transparent)} .bogenRahmen .aBsp{display:block;font:700 18px var(--titel);color:var(--tinte)} .bogenRahmen .aBsp i{display:block;font:400 13.5px var(--titel);font-style:normal; color:var(--grau);margin-top:1px} /* Ein Beispielsatz, der allein im Satzkasten steht, steht mittig — er ist dort das Bild, nicht eine Zeile unter anderen (§6.5.8). `display:block` muss dabeistehen: trägt der Satz einen Auslöser-Bogen, macht `.mitBogen` ihn sonst zu einem inline-block, und er schrumpft auf seinen Inhalt. */ .bogenRahmen .satzKasten>.aBsp{display:block;text-align:center} /* Zwei Beispielsätze im Formenkasten brauchen Luft dazwischen; im .bsp besorgt das der Zeilenabstand des Blocks. */ .bogenRahmen .kasten.rahmen>.aBsp+.aBsp{margin-top:12px} /* Formentabelle — Singular und Plural als zwei eigene Kästchen nebeneinander, damit die Trennung nicht zu überlesen ist */ .bogenRahmen .formenPaar{display:grid;grid-template-columns:1fr 1fr;gap:14px} .bogenRahmen .teil{border:1px solid rgba(28,58,122,.14);border-radius:4px; background:rgba(255,255,255,.42);padding:11px 14px 13px} .bogenRahmen .tLab{display:block;font:700 10px var(--inter);letter-spacing:.12em;text-transform:uppercase; color:var(--grau);margin-bottom:7px;padding-bottom:6px; border-bottom:1px solid rgba(28,58,122,.10)} .bogenRahmen :where(.heft) table{border-collapse:collapse;width:100%} .bogenRahmen :where(.heft) td{padding:4px 0;vertical-align:baseline} .bogenRahmen :where(.heft) td.pron{font:400 13px var(--titel);color:var(--grau);padding-right:12px;white-space:nowrap;width:1%} .bogenRahmen :where(.heft) td.form{font:700 18px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .leer1{font:400 14px var(--titel);color:rgba(107,99,88,.55);margin-left:5px} /* der leere Platz: ein deutlicher Strich, gelb hinterlegt */ .bogenRahmen .luecke{display:inline-block;margin-left:9px;padding:0 3px;font-weight:700; color:var(--tinte);background:linear-gradient(to bottom,transparent 6%, var(--abwFarbe) 16%,var(--abwFarbe) 84%,transparent 96%);mix-blend-mode:multiply; border-radius:2px;letter-spacing:-.02em} .bogenRahmen .signalWorte{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 20px} .bogenRahmen .signalWorte span{display:flex;flex-direction:column} .bogenRahmen .signalWorte b{font:700 17px var(--titel);color:var(--tinte)} .bogenRahmen .signalWorte i{font:400 13px var(--titel);font-style:normal;color:var(--grau);margin-top:1px} /* Zeichenerklärung */ .bogenRahmen .zeichen{margin-top:46px;border-top:1px solid rgba(184,176,144,.6);padding-top:16px} .bogenRahmen .zeichenLab{display:block;font:700 10.5px var(--inter);letter-spacing:.13em; text-transform:uppercase;color:var(--grau);margin-bottom:12px} .bogenRahmen .zeichenListe{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:9px 26px;font:400 13.5px var(--titel);color:var(--grau)} .bogenRahmen .zeichenListe b{font-weight:700;color:var(--print);margin-right:7px} .bogenRahmen .probeRegel{border:2px solid rgba(28,58,122,.45);border-radius:4px;padding:0 6px} .bogenRahmen .probeAusn{border:2px solid var(--abwFarbe);border-radius:4px;padding:0 6px} .bogenRahmen .probeFrage{display:inline-grid;place-items:center;width:22px;height:22px; border:2px solid var(--tinte);border-radius:50%;color:var(--tinte);font-size:12px} .bogenRahmen .probeGrau{color:var(--grau)} /* Popup */ .bogenRahmen .dimmer{position:fixed;inset:0;background:rgba(20,28,22,.62);backdrop-filter:blur(3px); display:none;place-items:center;padding:24px;z-index:20} .bogenRahmen .dimmer.auf{display:grid} .bogenRahmen .popup{background:var(--papier);color:var(--print);border-radius:6px;max-width:520px; padding:30px 34px 26px;line-height:1.65; box-shadow:3px 3px 0 -1px #DDD7C5,7px 7px 0 -1px #CFC8B2,0 22px 60px rgba(0,0,0,.45)} .bogenRahmen .popupLabel{font:700 11px var(--inter);letter-spacing:.11em;text-transform:uppercase;color:var(--grau)} .bogenRahmen .popupTitel{font:800 21px var(--titel);color:var(--tinte);margin:3px 0 14px} .bogenRahmen .popupText{font:400 16px var(--titel);margin:0} .bogenRahmen .popupText + .popupText{margin-top:12px} .bogenRahmen .popupBsp{font:700 17px var(--titel);color:var(--tinte);margin-top:14px} .bogenRahmen .popupFehler{font:400 15px var(--titel);color:var(--grau);margin-top:16px} .bogenRahmen .popupZu{margin-top:22px;font:700 12px var(--inter);letter-spacing:.07em;text-transform:uppercase; color:var(--tinte);background:transparent;border:1.5px solid rgba(28,58,122,.30); border-radius:7px;padding:7px 16px;cursor:pointer} @media(max-width:760px){ .bogenRahmen .heft{padding:32px 22px 38px} .bogenRahmen .buehne{padding:26px 16px 70px} .bogenRahmen .paar{grid-template-columns:1fr} .bogenRahmen .hBuch{margin-left:0;text-align:left;width:100%;padding-top:10px} } /* ── Neu: die Satzklammer ────────────────────────────────────────────────── Was das Buch nur beschreibt, wird hier gezeichnet. Der Satz steht in einer Zeile, darunter fasst eine Klammer das Wort, um das es geht. Gezeichnet mit demselben Bleistiftfilter wie der Tintenkreis des Fragezeichens — es bleibt dieselbe Handschrift, kein neues Zeichen. */ /* EIN Gitter für beide Sätze: die Wörter stehen in denselben Spalten, die Lücken in der ersten Zeile zeigen, wo „ne“ und „pas“ hineingehen. */ /* Reihe gleichgebauter Sätze: konstanter Teil bleibt stehen, nur das markierte Wort wechselt — die Gegenüberstellung als Bild. */ .bogenRahmen .reihe4{display:grid;grid-template-columns:auto 1fr;gap:11px 22px;align-items:baseline} .bogenRahmen .r4fr{font:700 19px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .r4de{font:400 14px var(--titel);color:var(--grau)} /* die Falle: das, was man nicht sagt — pink, wie überall in der App */ .bogenRahmen .falle{display:flex;align-items:baseline;gap:10px;font:700 17px var(--titel); color:var(--tinte);margin-top:18px} /* Der Abstand der Falle steht seit 05.09.2026 nur hier (§6.5.8): 18 px, wo etwas darüber steht; 0, wo sie die erste Zeile des Beispielblocks ist — dessen Innenrand trägt dann den Abstand; 10 px, wo zwei Fallen aufeinander folgen, weil sie zusammengehören. Kein Aufruf trägt mehr margin-top. */ .bogenRahmen .bsp>.falle:first-child{margin-top:0} .bogenRahmen .falle+.falle{margin-top:10px} .bogenRahmen .falleLab{font:800 11px var(--inter);letter-spacing:.09em;text-transform:uppercase; color:var(--grau);flex:0 0 auto} /* ── Neu: das Formenkreuz ───────────────────────────────────────────────── Vier Formen, aber nur zwei Entscheidungen: weiblich (+e) und Plural (+s). Als Kreuz sieht man das; als Liste von vier Zeilen sieht man es nicht. */ /* Die Breite des Formenkreuzes steht seit 06.09.2026 nur hier (§6.5.8): das schmale Kreuz misst 430 px, das breite 580 px. Vorher trugen zwei Bögen eigene Breiten (560 px, 580 px) als `style` im Aufruf — zwei Zahlen für dieselbe Lage. `.breit` ist eine Bauform, keine Zahl: `KREUZ(…, breit=True)` dort, wo die Zellen ganze Wortgruppen tragen. */ .bogenRahmen .kreuz{display:grid;grid-template-columns:auto 1fr 1fr;gap:0; margin:2px auto 0;width:min(100%,430px)} .bogenRahmen .kreuz.breit{width:min(100%,580px)} /* Die Zeile mit dem Auslöser-Bogen: der Bogen geht vom auslösenden Wort zur Form. Die zwei Regeln standen bis 06.09.2026 als `CSS_BOGENZEILE` in baue_dec4.py und wurden einem einzigen Bogen mitgegeben (§6.5.8: ein Stilblatt). Der Abstand zwischen zwei Paaren steht hier mit. */ .bogenRahmen .bZeile{display:flex;flex-direction:column;align-items:center;gap:4px;margin:2px auto 0} .bogenRahmen .bPaar{display:flex;flex-direction:column;align-items:center;gap:2px} .bogenRahmen .bPaar+.bPaar{margin-top:16px} /* Luft zwischen zwei Bildern in derselben Spur. Bis 06.09.2026 stand sie sechsmal als `style="height:22px"` im Aufruf, einmal mit 16 px (§6.5.8). */ .bogenRahmen .bildLuft{height:22px} /* Ein Zusatz in leichterer Schrift, etwa in einer fetten Zeilenbeschriftung. Stand bis 06.09.2026 als `style="font-weight:400"` im Aufruf (§6.5.8). */ .bogenRahmen .zusatz{font-weight:400} .bogenRahmen .kreuz .ecke{} .bogenRahmen .kreuz .kopfLab,.bogenRahmen .kreuz .seitLab{font:700 10px var(--inter);letter-spacing:.12em; text-transform:uppercase;color:var(--grau)} .bogenRahmen .kreuz .kopfLab{padding:0 0 8px;text-align:center} .bogenRahmen .kreuz .seitLab{display:flex;align-items:center;padding-right:16px;white-space:nowrap} .bogenRahmen .kreuz .zelle{font:700 21px var(--titel);color:var(--tinte);text-align:center; padding:11px 8px;border-top:1px solid rgba(28,58,122,.12)} .bogenRahmen .kreuz .zelle.rechts{border-left:1px solid rgba(28,58,122,.12)} /* Der Abstand nach unten stand nirgends: er kam vom Vorgabewert des Browsers für einen Absatz (1em = 13px). In der App gibt es den nicht, weil ihr Grundreset alle Ränder nullt — gemessen 06.09.2026 an drei Stellen. */ .bogenRahmen .kreuzDe{text-align:center;font:400 13px var(--titel);color:var(--grau); margin:12px 0 13px} /* Folgt das Formenkreuz einem Beispielsatz, setzt es sich von ihm ab. */ .bogenRahmen .satzKasten>.aBsp+.kreuz{margin-top:22px} .bogenRahmen .lautung{font:400 14px var(--titel);color:var(--grau);letter-spacing:.01em} /* ── Neu: die Satzmelodie ───────────────────────────────────────────────── Der Pfeil ist das, was man nicht schreiben kann: die Stimme. Gezeichnet wie alles Handgezeichnete auf der Seite, mit dem Bleistiftfilter. */ .bogenRahmen .melodie{flex:0 0 auto;color:var(--tinte);filter:url(#pencil-rough)} .bogenRahmen .satzZeileM{display:grid;grid-template-columns:auto auto 1fr; align-items:center;gap:0 18px} .bogenRahmen .mFr{font:700 21px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .mDe{font:400 14px var(--titel);color:var(--grau);white-space:nowrap} .bogenRahmen .mPaar{display:flex;flex-direction:column;gap:20px; width:min(100%,430px);margin:0 auto} /* ── Neu: das Paarbild ──────────────────────────────────────────────────── Zwei Zeilen, drei Spalten: Genus · Französisch · Deutsch. Für Kapitel, in denen es nur eine einzige Entscheidung gibt. */ .bogenRahmen .paarBild{display:grid;grid-template-columns:auto auto 1fr; gap:14px 26px;align-items:baseline;width:min(100%,430px);margin:0 auto} .bogenRahmen .pGen{font:700 10px var(--inter);letter-spacing:.12em;text-transform:uppercase; color:var(--grau);white-space:nowrap} .bogenRahmen .pFr{font:700 21px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .pDe{font:400 14px var(--titel);color:var(--grau)} /* ── Neu: die Klangzeile ────────────────────────────────────────────────── Zwei Formen, die gleich aussehen und verschieden klingen. Nebeneinander, mit der Lautschrift darunter — der Unterschied ist hörbar, nicht sichtbar. */ /* ── Neu: das Kreuz mit zusammengefasster Zeile ─────────────────────────── Im Plural verschwindet der Unterschied — deshalb ist die untere Zeile EIN Feld statt zwei. Die Form sagt es, bevor man den Text liest. */ .bogenRahmen .kreuz .zelle.breit{grid-column:2 / span 2;border-left:none} .bogenRahmen .zellDe{font:400 13px var(--titel);color:var(--grau);display:block;margin-top:3px} /* ── Neu: die Artikeltafel ──────────────────────────────────────────────── Alle vier Artikel in einem Bild — das Einzige auf der Seite, das über das Kapitel hinausgeht, und genau deshalb am Schluss. */ /* Die Tafel ist mindestens 470 px breit und wächst mit ihrem Inhalt bis an die Spur. Bis zum 11.09.2026 stand sie fest auf 470 px; ganze englische Sätze in drei Spalten brachen darin um („The room / has been / cleaned.“, EN-08-02). Gemessen an allen 146 Bögen: 113 umgebrochene Zellen vorher, 52 nachher; keine französische Tafel ändert ihre Breite. */ .bogenRahmen .tafel{border-collapse:collapse;width:auto;min-width:min(100%,470px);max-width:100%;margin:2px auto 0} .bogenRahmen .tafel th,.bogenRahmen .tafel td{border:1px solid rgba(28,58,122,.16);padding:9px 12px;text-align:center} .bogenRahmen .tafel th{font:700 10px var(--inter);letter-spacing:.12em;text-transform:uppercase; color:var(--grau);background:rgba(255,255,255,.34)} .bogenRahmen .tafel th.seite{text-align:right;white-space:nowrap} .bogenRahmen .tafel td{font:700 18px var(--titel);color:var(--tinte);background:rgba(255,255,255,.42)} .bogenRahmen .tafel td.leer{background:transparent;border:none} /* Der Hinweis der Tafel: letzte Zeile, über alle Spalten. Er trägt den Rahmen der Tafel und endet, wo sie endet — dieselbe graue Zeile wie `GRAU()` in der Zelle, nur unter der ganzen Tafel (12.09.2026). Davor stand er als `.listenNote` daneben: 620 px breit gegen eine Tafel von 470 px und mehr. `.listenNote` bleibt unverändert für jede Stelle, über der keine Tafel steht. Warum `caption` und keine Zeile in der Tafel: Eine Zeile trieb die Breite der Tafel hoch — 11 von 44 Bögen mit Befund, bis 942 px gegen 620 px Spur. Die `caption` ist genau so breit wie die Tafel und bricht darin um. */ .bogenRahmen .tafel > caption.tafelNote{caption-side:bottom;font:400 12.5px var(--titel); color:var(--grau);background:rgba(255,255,255,.34);padding:7px 12px; text-align:center;border:1px solid rgba(28,58,122,.16);border-top:none} /* Die Benennung unter der Form: eigener Block, grau, kleiner — wie bei `.vglR i`, `.dImp i` und `.drei.zweizeilig .dZelle i`. Bis zum 12.09.2026 gab es sie in der Tafelzelle nicht: wer „Gebrauch als graue Zeile unter die Form“ wollte, musste die Tafel in zwei Zeilen teilen. Seit dem 12.09.2026 greift die Regel auch hier, und EN-09-09 setzt sie ein. `TAFEL(…)` reicht das `` unverändert durch; geschrieben wird es mit `GRAU()` aus `bausteine.py`. Das Grau kommt vom umgebenden Block, nicht vom `` selbst — außerhalb der Blöcke, die es setzen, bleibt `` gewöhnliche Kursivschrift. Der Prüfer zählt je Block — eine eigene Zeile in eigenem Block ist kein Umbruch (§6.5.3). */ .bogenRahmen :where(.heft) .tafel td i{display:block;font:400 12.5px var(--titel); font-style:normal;color:var(--grau);margin-top:2px} /* ── Neu: der Wandel ────────────────────────────────────────────────────── Singular → Plural in einer Zeile. Zwei Dinge ändern sich zugleich, der Artikel und das Nomen — nebeneinander sieht man beide Bewegungen. */ /* Der Abstand des Wandels steht seit 05.09.2026 nur hier (§6.5.8): die Zeilenhöhe des Rasters und der Sitz der Übersetzung darunter. Kein Aufruf trägt gap oder einen eigenen Rand. */ .bogenRahmen .wandel .wDe{grid-column:1 / -1;text-align:center;margin:-10px 0 0} /* ── Neu: die Gruppen nach dem Klang ────────────────────────────────────── Zwei Häufchen statt sechs Zeilen: dort, wo die Endung stumm ist, steht der Akzent — sonst nicht. Das ist die eigentliche Regel des Kapitels. */ /* Die Häufchen: so viele Spalten, wie es Häufchen gibt — `auto-fit` zählt sie selbst, damit kein Aufruf eine Spaltenzahl mitgeben muss. Breite seit 06.09.2026 nur hier (§6.5.8): 470 px, `.breit` 620 px. Vorher trugen sieben Aufrufe `width:min(100%,620px)` und einer eigene Spaltenanteile. */ .bogenRahmen .gruppen{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:16px 24px;width:min(100%,470px);margin:2px auto 0} .bogenRahmen .gruppen.breit{width:min(100%,620px)} .bogenRahmen .gruppeKasten{border:1px solid rgba(28,58,122,.14);border-radius:4px; background:rgba(255,255,255,.42);padding:11px 14px 13px} .bogenRahmen .gruppeLab2{display:block;font:700 10px var(--inter);letter-spacing:.11em; text-transform:uppercase;color:var(--grau);margin-bottom:8px;padding-bottom:6px; border-bottom:1px solid rgba(28,58,122,.10)} .bogenRahmen .gruppeForm{display:block;font:700 16px var(--titel);color:var(--tinte);padding:2px 0} /* ── Die Besitztafel ────────────────────────────────────────────────────── Sechs Zeilen, drei Spalten. Wo männlich und weiblich zusammenfallen, ist es EIN Feld — dieselbe Sprache wie beim Plural des Artikels. */ .bogenRahmen .besitz{border-collapse:collapse;width:min(100%,470px);margin:2px auto 0} .bogenRahmen .besitz th,.bogenRahmen .besitz td{border:1px solid rgba(28,58,122,.16);padding:8px 10px;text-align:center} .bogenRahmen .besitz th{font:700 10px var(--inter);letter-spacing:.11em;text-transform:uppercase; color:var(--grau);background:rgba(255,255,255,.34)} .bogenRahmen .besitz th.wer{text-align:right;white-space:nowrap;font-weight:700} .bogenRahmen .besitz td{font:700 18px var(--titel);color:var(--tinte);background:rgba(255,255,255,.42)} .bogenRahmen .besitz td.leer{background:transparent;border:none} .bogenRahmen .besitz tr.zweit td,.bogenRahmen .besitz tr.zweit th{border-top:2px solid rgba(28,58,122,.28)} /* Gegenüberstellung Französisch → zwei deutsche Sätze */ .bogenRahmen .spiegel{display:grid;grid-template-columns:auto auto 1fr;gap:10px 16px; align-items:baseline;margin:0 auto} .bogenRahmen .sFr{font:700 18px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .sPfeil{color:rgba(28,58,122,.45)} .bogenRahmen .sDe{font:400 14px var(--titel);color:var(--grau)} /* ── Neu: der Auslöser-Bogen ────────────────────────────────────────────── Ein runder Bogen mit Pfeil zeigt, WAS die Form auslöst — vom Auslöser zur Form, nicht umgekehrt. Gezeichnet mit demselben Bleistiftstrich wie das Fragezeichen. Die Kurve wird nach dem Satzumbruch berechnet, damit sie auch bei anderer Schriftgröße sitzt. */ .bogenRahmen .mitBogen{position:relative;display:inline-block;padding-bottom:32px} .bogenRahmen .mitBogen.obenAuch{padding-top:48px} .bogenRahmen .aBsp.mitBogen{padding-bottom:0} /* Platz für die Beschriftung des Auslöser-Bogens: sie sitzt unter der Kurve und darf die kursive Übersetzung nicht berühren. 32px reichten nicht — gemessen 04.09.2026: sechs von neun Beschriftungen liefen hinein. */ .bogenRahmen .aBsp.mitBogen i{margin-top:48px} .bogenRahmen .bogenSvg{position:absolute;left:0;top:0;width:100%;height:100%; overflow:visible;pointer-events:none;color:rgba(28,58,122,.62)} .bogenRahmen .bogenLab{position:absolute;font:700 9px var(--inter);letter-spacing:.12em; text-transform:uppercase;color:var(--grau);transform:translateX(-50%); pointer-events:none;white-space:nowrap} /* ── Zwei Spalten: à links, de rechts ───────────────────────────────────── Beide Präpositionen tun genau dasselbe. Nebeneinander sieht man das in einem Blick; untereinander muss man es sich merken und vergleichen. Weil Formel und Ergebnis nun direkt nebeneinander stehen, braucht es keinen Bogen mehr — das Gleichheitszeichen leistet dasselbe. */ .bogenRahmen .zweiSpalten{display:grid;grid-template-columns:1fr 1fr;gap:0 30px; width:min(100%,520px);margin:2px auto 0} .bogenRahmen .präSpalte{} /* Die enge Gleichungsspalte — ein Nachtrag unter dem Formenkasten. Die Breite stand bis 06.09.2026 dreimal als `style` im Aufruf (§6.5.8). */ .bogenRahmen .präSpalte.schmal{width:min(100%,320px);margin:0 auto} .bogenRahmen .präKopf2{padding-bottom:9px;border-bottom:1.5px solid rgba(28,58,122,.20); margin-bottom:12px} .bogenRahmen .präWort2{display:block;font:800 24px var(--titel);color:var(--tinte);line-height:1.1} .bogenRahmen .präSinn2{display:block;font:400 12.5px var(--titel);color:var(--grau);margin-top:3px} .bogenRahmen .fRow{display:grid;grid-template-columns:auto 14px auto;gap:0 8px; align-items:baseline;padding:4px 0} .bogenRahmen .fA{font:400 16px var(--titel);color:var(--grau);white-space:nowrap} .bogenRahmen .fEq{font:400 15px var(--titel);color:rgba(28,58,122,.40)} .bogenRahmen .fB{font:700 19px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .fTrenn{height:1px;background:rgba(28,58,122,.12);margin:11px 0} .bogenRahmen .fLab{font:700 9.5px var(--inter);letter-spacing:.11em;text-transform:uppercase; color:var(--grau);margin:0 0 6px} /* Beispiele: ein kompakter Block unter beiden Spalten */ .bogenRahmen .bspBlock{width:min(100%,520px);margin:26px auto 0; border-top:1px solid rgba(28,58,122,.12);padding-top:16px; display:grid;grid-template-columns:auto 1fr;gap:7px 22px;align-items:baseline} /* Steht der Beispielblock zuoberst in seinem Kasten oder Abschnitt, trennt die Linie nichts — sie stand dann allein über dem Block, mit 26 px Luft darüber (11.09.2026, 104 Stellen auf 54 Bögen). Gebaut wie `.bsp>.falle:first-child`. */ .bogenRahmen .bspBlock:first-child{border-top:0;padding-top:0;margin-top:0} .bogenRahmen .bFr{font:700 16px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .bDe{font:400 13px var(--titel);color:var(--grau)} /* Klangzeile und Fallenzeile werden auf den Verbbögen gebraucht */ .bogenRahmen .klang{display:flex;flex-wrap:wrap;justify-content:center;gap:18px 30px; max-width:100%;margin:2px auto 0} .bogenRahmen .klangTeil{text-align:center;flex:0 1 auto;min-width:0} .bogenRahmen .klangFr{font:700 22px var(--titel);color:var(--tinte);display:block} .bogenRahmen .klangLaut{font:400 15px var(--titel);color:var(--grau);display:block;margin-top:3px} .bogenRahmen .klangDe{font:400 13px var(--titel);color:var(--grau);display:block;margin-top:1px} /* Zwei Zusatzformen des Klangpaars (06.09.2026, §6.5.3). Sie stehen hier und nicht im Blatt: `satz` für Klangblöcke, die ganze Sätze zeigen statt einzelner Formen — schmaler, damit die Zeilen nicht auseinanderlaufen, und mit kleinerer französischer Schrift; `abgesetzt` für den zweiten Block, wenn zwei Klangblöcke untereinander zwei Fälle gegenüberstellen. */ .bogenRahmen .klang.satz{width:min(100%,530px)} .bogenRahmen .klang.satz .klangFr{font-size:19px} .bogenRahmen .klang.abgesetzt{margin-top:20px;padding-top:16px; border-top:1px solid rgba(28,58,122,.12)} .bogenRahmen .listenNote{margin:14px 0 0;font:400 13px var(--titel);color:var(--grau);text-align:center} .bogenRahmen .zeichenHinweis{margin:14px 0 0;font:400 13px var(--titel);color:var(--grau)} /* Satzklammer — dasselbe Bauteil wie auf dem Bogen zur Verneinung */ .bogenRahmen .satzKasten{border:1px solid rgba(28,58,122,.18);border-radius:5px; background:rgba(255,255,255,.32);padding:20px 24px 24px} .bogenRahmen .satzLab{display:block;font:700 10px var(--inter);letter-spacing:.12em; text-transform:uppercase;color:var(--grau);margin-bottom:14px;text-align:center} /* Der Rand des Satzgitters steht seit 06.09.2026 nur hier (§6.5.8) — 2 px wie bei .kreuz, .klang, .vgl, .drei, .gruppen und .tafel; stehen zwei Gitter untereinander, trennt sie 26 px. Kein Aufruf trägt mehr einen Rand. Nur `margin-top`, kein `auto`: .bsp ist eine Flex-Spalte, dort schrumpft ein Feld mit seitlichem auto auf seinen Inhalt — das Gitter zentriert seine Spalten aber selbst über `justify-content`. */ .bogenRahmen .satzGitter{display:grid;justify-content:center;column-gap:10px;margin-top:2px} .bogenRahmen .satzGitter + .satzGitter{margin-top:26px} .bogenRahmen .satzGitter .w{display:flex;flex-direction:column;align-items:center; font:700 21px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .satzGitter .w i{font:400 12px var(--titel);font-style:normal;color:var(--grau); margin-top:2px;white-space:nowrap} .bogenRahmen .satzLuft{grid-column:1/-1;height:20px} .bogenRahmen .klammer{height:11px;margin-top:6px;border:3px solid rgba(28,58,122,.80); border-top:none;border-bottom-left-radius:6px;border-bottom-right-radius:6px; filter:url(#pencil-rough)} .bogenRahmen .klammerLab{margin-top:6px;text-align:center; font:700 10.5px var(--inter);letter-spacing:.11em;text-transform:uppercase; color:var(--grau)} /* Wandel: links die Ausgangsform, rechts das Ergebnis */ .bogenRahmen .wandel{display:grid;grid-template-columns:auto auto auto;gap:14px 18px; align-items:baseline;justify-content:center;margin:0 auto} .bogenRahmen .wFr{font:700 20px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .wPfeil{color:rgba(28,58,122,.45);font:700 18px var(--titel)} .bogenRahmen .wDe{font:400 13.5px var(--titel);color:var(--grau);white-space:nowrap} /* ── Präsens gegen Imperativ ────────────────────────────────────────────── Keine Umformung, sondern ein Vergleich: links die Präsensform, rechts der Befehl. Zwei von drei Formen sind gleich (grün, die Regel greift), nur in der Du-Form wird aus -es ein -e (orange → gelb, wie bei acheter). */ .bogenRahmen .vgl{display:grid;grid-template-columns:auto auto;gap:12px 44px; justify-content:center;margin:2px auto 0} .bogenRahmen .vglKopf{font:700 10px var(--inter);letter-spacing:.12em;text-transform:uppercase; color:var(--grau);padding-bottom:8px;border-bottom:1px solid rgba(28,58,122,.14)} .bogenRahmen .vglL{font:400 19px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .vglR{font:700 21px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .vglR i{display:block;font:400 12.5px var(--titel);font-style:normal; color:var(--grau);margin-top:2px} /* Die linke Spalte der Gegenüberstellung trägt ihre Übersetzung wie die rechte */ .bogenRahmen .vglL i{display:block;font:400 12.5px var(--titel);font-style:normal; color:var(--grau);margin-top:2px} .bogenRahmen .bildNote{margin:16px 0 0;text-align:center;font:400 12.5px var(--titel);color:var(--grau)} /* Dreispaltiger Vergleich: tu-Form · il-Form · Imperativ */ /* D3-G 11: die Zellen dieser Tafel brechen nicht um (§6.5.8) */ .bogenRahmen :where(.heft) .tafel.eng td{white-space:nowrap} /* D3-VGL-PC-PQP: die Übersetzung steht unter der Form, nicht daneben */ .bogenRahmen .drei.zweizeilig .dZelle i{display:block;font:400 12.5px var(--titel);font-style:normal;color:var(--grau);margin-top:2px} .bogenRahmen .drei{display:grid;grid-template-columns:auto 22px auto;gap:12px 26px; align-items:baseline;justify-content:center;margin:2px auto 0} .bogenRahmen .dKopf{font:700 10px var(--inter);letter-spacing:.12em;text-transform:uppercase; color:var(--grau);padding-bottom:8px;border-bottom:1px solid rgba(28,58,122,.14)} .bogenRahmen .dZelle{font:400 19px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .dGleich{font:400 18px var(--titel);color:rgba(28,58,122,.40);text-align:center} .bogenRahmen .dImp{font:700 20px var(--titel);color:var(--tinte);white-space:nowrap} .bogenRahmen .dImp i{display:block;font:400 12.5px var(--titel);font-style:normal; color:var(--grau);margin-top:2px} /* ── Aufklapper ─────────────────────────────────────────────────────────── Für das, was der Schüler schon einmal hatte und vielleicht vergessen hat. Anders als das Fragezeichen (wissenswert, aber nicht nötig) geht es hier um Formen, die man zum Bilden des Satzes wirklich braucht — deshalb steht der Aufklapper mitten auf der Seite und nicht hinter einem Popup. */ .bogenRahmen .aufklapp{width:min(100%,620px);margin:16px auto 0} .bogenRahmen .aufklapp summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center; gap:9px;font:700 11px var(--inter);letter-spacing:.08em;text-transform:uppercase; color:var(--tinte);border:1px solid rgba(28,58,122,.28);border-radius:7px; padding:7px 15px;background:rgba(255,255,255,.34)} .bogenRahmen .aufklapp summary::-webkit-details-marker{display:none} .bogenRahmen .aufklapp summary::marker{content:''} .bogenRahmen .aufklapp summary:hover{background:rgba(255,255,255,.55)} .bogenRahmen .aufklappPfeil{font-size:13px;transition:transform .15s;display:inline-block} .bogenRahmen .aufklapp[open] .aufklappPfeil{transform:rotate(90deg)} .bogenRahmen .aufklappInhalt{margin-top:14px}