+ {ADJ_GENDERS.map(x => {
+ const val = ADJ_ENDINGS[cls][x][c];
+ const hit = x === g && c === cas;
+ const bad = !hit && wrong && x === g && val === wrong;
+ return
-{val}
;
+ })}
+
+ ))}
+
+
+ );
+}
+
+// Why the noun itself changed — the last surviving case ending on German nouns.
+function NounEndingModal({ q, onClose }) {
+ const changed = nounForm(q.noun, q.cas);
+ return (
+
+
e.stopPropagation()}>
+
+
Why „{changed}"?
+
+
+
+ German normally leaves the noun alone and lets the article do the work. The
+ genitive is the one surviving exception: masculine and neuter nouns
+ add -s or -es in the genitive singular. So {q.noun.w} becomes
+ {changed}.
+
+ -es after one-syllable nouns, and after -s, -ß, -x, -z:
+ des Hauses, des Mannes, des Kindes, des Platzes
+
+
+ -s after longer nouns — especially those ending in -el, -en, -er —
+ and after foreign words:
+ des Regens, des Vaters, des Lehrers, des Autos, des Hotels
+
+
+
Feminine nouns never change
+
+ der Frau, der Stadt, der Nacht — the article alone marks the case.
+ Same for plurals: der Kinder.
+
+
+
The only other one left
+
+ The dative plural adds -n if the plural doesn't already end in one:
+ mit den Kindern, zwischen den Bäumen.
+
+
+ There is also a small group of masculine nouns — der Junge, der Student,
+ der Herr, der Mensch — that take -n in every case except the nominative.
+ None of them appear in Beug yet.
+
+
+
+
+
+ );
+}
+
+// The three adjective tables and the single idea underneath them.
+function AdjRuleModal({ onClose }) {
+ const rows = [
+ ['weak', 'After a der-word', 'der · dieser · jeder · welcher · alle',
+ 'The determiner already shows the case, so the adjective goes limp — only -e or -en.',
+ 'der gut\u00ADe Mann · den guten Mann'],
+ ['mixed', 'After an ein-word', 'ein · kein · mein · dein · sein · ihr · unser · euer',
+ 'Same as weak, EXCEPT the three slots where the ein-word has no ending of its own. There the adjective steps in and takes the strong ending.',
+ 'ein guter Mann · ein gutes Kind'],
+ ['strong', 'No determiner', '— nothing in front —',
+ 'Nothing else can signal the case, so the adjective carries the full load.',
+ 'guter Wein · kaltes Wasser'],
+ ];
+ return (
+
+
e.stopPropagation()}>
+
+
Which ending table?
+
+
+
+
+ One idea holds the whole system together: the case and gender have to be
+ signalled exactly once in the noun phrase. Whoever is able to show it,
+ shows it — and whoever is left over relaxes.
+
+ Strong genitive masc/neut is -en, not -es — trotz schlechten
+ Wetters. The noun already carries the -(e)s, so the adjective doesn't repeat it.
+
+
+ After the verb, an adjective takes no ending at all —
+ Das Haus ist groß, never großes. An adjective only declines
+ when it stands in front of its noun.
+
+
+ Beug has no plural nouns yet, so the plural column is shown for reference but is
+ not drilled.
+
+
+
+
+
+ );
+}
+
// The wohin/wo rule, the trap, the verb pairs, and the one real exception.
function WechselRuleModal({ onClose }) {
const PAIRS = [
@@ -1453,7 +1712,7 @@ function ChartModal({ section, q, onClose, onRule }) {
Wechsel: Akkusativ when the phrase is where something ends up
(wohin?), Dativ when it is where the action happens (wo?) — movement alone does
not decide it.
- {onRule && }
+ {onRule && }
)}
@@ -1469,6 +1728,23 @@ function ChartModal({ section, q, onClose, onRule }) {
)}
+ {section === 'adj' && (
+
+
Adjective Endings
+
+ The case is signalled once. If the determiner shows it, the adjective goes limp.
+
+ {['weak','mixed','strong'].map(cls => (
+
+
{ADJ_CLASS_LABEL[cls]}
+
{ADJ_CLASS_HINT[cls]}
+
+
+ ))}
+ {onRule && }
+
+ )}
+
{section === 'pronoun' && (
Personal Pronouns
@@ -1584,8 +1860,10 @@ const S = {
pillBtnOn: { border:`1.5px solid ${GREEN}`, color:GREEN, background:'#f3ffe8' },
chartsPill: { position:'absolute', right:20, bottom:2, borderRadius:999, padding:'5px 13px', fontSize:12, fontWeight:600, cursor:'pointer', fontFamily:'inherit', lineHeight:1.2, border:'1.5px solid #d5d5d5', color:'#777', background:'#fff' },
- tabs: { display:'flex', gap:0, borderBottom:'1px solid #eee', marginTop:6, marginBottom:12 },
- tab: { flex:1, background:'none', border:'none', padding:'12px 8px', cursor:'pointer', color:'#999', fontSize:13, fontWeight:600, fontFamily:'inherit', borderBottomWidth:2, borderBottomStyle:'solid', borderBottomColor:'transparent', marginBottom:-1, transition:'all 0.15s' },
+ // Five tabs no longer fit across a phone, so the row scrolls instead of
+ // squeezing the labels. The scrollbar itself is hidden (see the